javascript-如何自定义OpenERP 6.1 WebClient HTML DOM？

OpenERP Web客户端的页面可以很宽,在列表视图中有很多列.在短屏幕上,这是一个麻烦,因为居中菜单超出了内容的右侧.我决定为此找到一个快速解决方案：使菜单向左对齐.对于普通网站,这对于标准JQuery来说可谓小菜一碟,但是这个OpenERP网站几乎完全是用JS生成的！

生成的HTML具有以下菜单结构：

<div class="menu" id="oe_menu">
  <table align="left">
    <tbody>
      <tr>
        <td>
          <a href="#" data-menu="3">
            Settings
          </a>
        </td>
        <!--other menus...-->
      </tr>
    </tbody>
  </table>
</div>

使用JQuery的方法是(在JS控制台中测试)：

$('div.menu table[align=center]').attr('align','left');

尽管通常的$(document).ready()会失败,因为加载DOM的时间仅仅是OpenERP Web客户端的初始化.

我的要求是,这需要从模块进行管理. Simahawk得到了类似主题hooking into the logout event的答案,该主题为我指明了正确的方向,但没有解决我的任务.

解决方法:

我从web_livechat模块中找到并修改了一段代码,该代码终于起作用了.我的模块称为camara,这很重要,因为必须在模块之后调用openerp对象的新方法-static / src / js / tweaks.js：

// openerp.camara(openerp) is executed when the module is loaded - UI is not rendered yet!

openerp.camara = function(openerp) {

    // so we hook into (override) the Header do_update() call 
    // which is executed upon session validation by the WebClient
    // we have to call the overriden parent method
    // then we hook onto the update_promise 
    // which executes our code after the update is done.

    openerp.web.Header.include({
        do_update: function() {
        var self = this;
        this._super();
        this.update_promise.then(function() {
            // change menu alignment to the left
            // because with wide views, it runs out of reach
            $('div.menu table[align=center]').attr('align','left')
        });
        }
    });

}

js文件需要包含在__openerp__.py中：

'js': ["static/src/js/tweaks.js"]

尚待解决的问题：

>您是否喜欢此方法并找到合适的方法？
>如果没有,请提供其他解决方案.

我自己觉得这很笨拙,这就是为什么要问.我考虑过使用CSS,但没有设法覆盖表的align属性.

标签：openerp,dom,css,javascript,jquery
来源： https://codeday.me/bug/20191201/2078385.html