Add colurs to statusbar in odoo10

爱⌒轻易说出口 提交于 2020-01-24 10:22:25

问题


Need to add colour in statusbar in odoo10 which available openerp versions eg: <field name = 'state' widget=statusbar clickabe= 'True' statubar_colors='{"new": "blue"}'>

How add colours in statusbar in odoo10

Need different color for different states in status bar For eg: Blue color for draft,green for progress, red for cancel


回答1:


There is two solution for your requirement:

  1. If you need this behavior for only one Form view, Is simple as this:

just add style tag to beat the css selector generated by Odoo

        <style>
            .o_form_view .o_form_statusbar > .o_statusbar_status > .o_arrow_button.btn-primary.disabled {
               background: yellow;
            }
            .o_form_view .o_form_statusbar > .o_statusbar_status > .o_arrow_button.btn-primary.disabled::after {
               border-left-color: yellow;
            }
        </style>
        ...
        ...
        <field name ="state" widget="statusbar">

Here I used the same css selector because it's loaded after Odoo selector it is the one used, notice that my status bare button have .disabled class because it's readonly I think you have to change that clickabe= 'True' means it's not readonly.

  1. if you want to have this for all your model here you need to use css file and add it to assets_backend template, make sure that your selector beat Odoo selector.
   <template id="assets_backend" name="backend" inherit_id="web.assets_backend">
        <xpath expr="." position="inside">
            <link rel="stylesheet" href="/your_addon_name/static/src/css/your_css_file_name.css"/>
        </xpath>
    </template>

Now I don't how you want to change the color exactly Here, you need to deal with CSS to select the right element, for example if you want to make the status bar color blue only when the "new" value is selected, lucky for you Odoo show the value selected in attribute data-value that doesn't change by translation.

   .o_form_view .o_form_statusbar > .o_statusbar_status > .o_arrow_button.btn-primary.disabled[data-value="new"] {
        background: blue;
    }
    .o_form_view .o_form_statusbar > .o_statusbar_status > .o_arrow_button.btn-primary.disabled[data-value="new"]::after {
       border-left-color: blue;
    }

This is in Odoo 11, when I inspected the element, this what I noticed:

  • status that is selected have class btn-primary the rest have btn-default
  • readonly have attribute disabled="disabled" and class disabled

And just to show that this work Here is a screen shot of what I have, You may have some side effect, it's when you open some record in popup and this form is still shown in the web page, this will effect the record shown too if it have a status bare widget, because the style tag will be removed when the form view is removed from the web page.

Edits:

Let say your selection has two values : new, valid

This will color new to blue if selected and valid to green fi selected

<style>

       .o_form_view .o_form_statusbar > .o_statusbar_status > .o_arrow_button.btn-primary.disabled[data-value="new"] {
            background: blue;
        }
        .o_form_view .o_form_statusbar > .o_statusbar_status > .o_arrow_button.btn-primary.disabled[data-value="new"]::after {
           border-left-color: blue;
        }

        .o_form_view .o_form_statusbar > .o_statusbar_status > .o_arrow_button.btn-primary.disabled[data-value="progress"] {
            background: blue;
        }
        .o_form_view .o_form_statusbar > .o_statusbar_status > .o_arrow_button.btn-primary.disabled[data-value="progress"]::after {
           border-left-color: blue;
        }

        .o_form_view .o_form_statusbar > .o_statusbar_status > .o_arrow_button.btn-primary.disabled[data-value="cancel"] {
            background: red;
        }
        .o_form_view .o_form_statusbar > .o_statusbar_status > .o_arrow_button.btn-primary.disabled[data-value="cancel"]::after {
           border-left-color: red;
        }
</style>
...
...
...
<field name="state" .....>

It's all about selecting the field by data-value Hope you get the idea. and this is easier than having to deal with javascript.




回答2:


This feature was removed from Odoo a long time ago.

https://github.com/odoo/odoo/issues/5987

https://github.com/odoo/odoo/pull/11199

If you need to add this feature you will have to create a new widget for it.




回答3:


 inherit_id="web.assets_backend"

add style as you need, you can also give style in css



来源:https://stackoverflow.com/questions/57726716/add-colurs-to-statusbar-in-odoo10

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!