查看负责 Odoo12 中的顶部导航栏

View responsible for top navbar in Odoo12

我正在尝试将徽标添加到顶部导航栏,我正在寻找要继承的视图 ID,这将允许我使用 xpath 定位 propper 元素。

我无法找到负责包含两个相邻元素的导航栏布局的视图。

我找到了这样的东西:addons\website\views\website_navbar_templates.xml。但它没有定义这两个相邻节点(存在于浏览器检查元素工具中):

<ul class="o_menu_apps">

<a class="o_menu_brand" role="button">

它们只存在于静态 xml: addons\web\static\src\xml\menu.xml 中。但我不知道我是否可以用我的自定义模块和 xpath 修改这个 xml。

内部:addons\website\views\website_templates.xml 我看到了这段代码:

<template id="layout_logo_show" inherit_id="website.layout" customize_show="True" name="Show Logo">
    <xpath expr="//header//a[hasclass('navbar-brand')]" position="replace">
        <a href="/" class="navbar-brand logo">
            <span t-field="res_company.logo" t-options="{'widget': 'image'}" role="img" t-att-aria-label="'Logo of %s' % res_company.name" t-att-title="res_company.name" />
        </a>
    </xpath>
</template>

这个标志去哪儿了?我在 Odoo12 中没有看到任何徽标。我觉得没有class叫'navbar-brand'.

我最终用我的自定义模块覆盖了静态 xml 文件,如下所示:

<?xml version="1.0" encoding="UTF-8"?>
<templates  xml:space="preserve">    
    <t t-extend="Menu">
        <t t-jquery="*" t-operation="replace">
            <div style="height:100%; background-color: #4c4c4c;">
                <nav class="o_main_navbar">
                    <ul class="o_menu_apps"/>
                    <div class="example_div">
                        <a href="https://google.com/" target="_blank">
                            <img src="example.png"/>
                        </a>
                    </div>
                    <a class="o_menu_brand" role="button"/>
                    <ul class="o_menu_sections" role="menu"/>
                    <ul class="o_menu_systray" role="menu"/>
                </nav>
            </div>
        </t>
    </t>

</templates>

我将这个文件放在 static/src/xml 中并在 manifest.py

中调用它
    'qweb': [
        'static/src/xml/*.xml',
    ],

这也可以动态完成。在这种情况下,我们将使用 front-end 上的 JavaScript 代码和一个控制器来通知 front-end 如果该公司存在公司徽标,那么我们将使用来自 [=21] 的获取请求=]获取公司标志。

首先我们添加 img 标签以显示来自 XML 的公司徽标。

<?xml version="1.0" encoding="UTF-8"?>
<templates id="template" xml:space="preserve">
    <t t-extend="Menu">
        <t t-jquery=".o_menu_apps" t-operation="prepend">
            <a id="company-logo-link" href="/web">
                <img id="company-logo" alt="Logo"/>
            </a>
        </t>
    </t>
</templates>

之后我们添加JavaScript来显示当前用户所在公司的标志。我们从当前用户的会话中获取公司 ID。

odoo.define('web_company_logo.Menu', function (require) {
'use strict';

var session = require('web.session');
var Menu = require('web.Menu');

Menu.include({
    /**
    * @override
    */
    start: function (parent, options) {
        this._super.apply(this, arguments);

        // current url, <domain_name>:<port_number>
        var url = window.location.origin;

        // company id from the session
        var companyId = session.company_id;

        // use ajax to check if the company has a logo.
        // if there is no logo, remove the anchor, else
        // use the company's logo as the img src
        $.ajax({
            type: 'GET',
            data: {'company_id': companyId},
            url: `${url}/check_company_logo`,
            success: function (result) {
                console.log('Inside the success function');
                var result = JSON.parse(result);
                if (result.has_logo == true) {
                    $('#company-logo')[0].src = `${url}/web/image?model=res.company&id=${companyId}&field=logo`;
                }
                else {
                    $('#company-logo-link')[0].remove();
                }
            },
            error: function (xhr, ajaxOptions, thrownError) {
                console.log('Error encountered');
            },
        });
    },
   });
});

要使此 JavaScript 代码正常工作,应添加以下控制器以通知 front-end 该公司是否有徽标。

import json

from odoo import http
from odoo.http import request


class WebCompanyLogoController(http.Controller):

@http.route(['/check_company_logo'], type='http',
            auth="public", methods=['GET'],
            website=True, sitemap=False)
def check_company_logo(self, company_id=0):
    """
    Check if company has a logo
    :param company_id: ID of the company as an integer
    :return: bool
    """
    has_logo = bool(request.env['res.company'].browse(int(company_id)).logo)

    return json.dumps({
        'has_logo': has_logo,
    }, ensure_ascii=False)