Sep 13 [FIX] : Bug Fixed 'listview_change_background_color'

listview_change_background_color/doc/RELEASE_NOTES.md

@@ -1,6 +1,6 @@
 ## Module <listview_change_background_color>
 
-#### 15.02.2022
+#### 31.08.2023
 #### Version 16.0.1.0.0
 #### ADD
 - Initial commit for Listview Change Background Color

listview_change_background_color/models/color_picker.py

@@ -34,7 +34,8 @@ class ColorPicker(models.Model):
     @api.model
     def get_color_picker_model_and_id(self, **kw):
         """We can get the all records, models and colors"""
-        record = self.search([('record_id', '=', kw['record_id']), ('res_model', '=', kw['model_name'])])
+        record = self.search([('record_id', '=', kw['record_id']),
+                              ('res_model', '=', kw['model_name'])])
         if record:
             record.write({'color': kw['record_color']})
         else:

listview_change_background_color/static/src/js/color_picker.js

@@ -1,76 +1,77 @@
 /** @odoo-module **/
-
 import { patch } from "@web/core/utils/patch";
 import { ListRenderer } from "@web/views/list/list_renderer";
 import { ListController } from '@web/views/list/list_controller';
-
 //For ORM Call
 import { useService } from "@web/core/utils/hooks";
-
-
-const { useRef, onPatched, onMounted, useState } = owl;
-
+const { useRef, onPatched, onMounted, useState,onWillUpdateProps } = owl;
 //Patching
 patch(ListRenderer.prototype, 'list-color-patch', {
     setup() {
+        if (this.constructor.name == 'SectionAndNoteListRenderer') {
+        // Call method for removing color picking field from one2many
+            onMounted(() => {
+                this.__owl__.bdom.el.children[0].children[1].childNodes.forEach((item) => {
+                    if (item.nodeName != "#text"){
+                        if(!item.attributes.length == 0){
+                            var list_one2many = item.children[1];
+                            list_one2many.remove();
+                        }
+                    }
+                })
+            })
+        }
         this._super.apply();
         this.orm = useService("orm");
-//        PATH OF CORRESPONDING MODEL
-//        var current_model = this.props.list.model.env.searchModel.resModel
-        onMounted(this.color)
+        onMounted(this.color);
+        if (this.constructor.name == 'SectionAndNoteListRenderer') {
+        // Call method for removing color picking field from one2many
+            onPatched(()=>{
+                this.__owl__.bdom.el.children[0].children[1].childNodes.forEach((item) => {
+                    if (item.nodeName != "#text"){
+                        if(!item.attributes.length == 0){
+                            var list_one2many = item.children[1];
+                            list_one2many.remove();
+                        }
+                    }
+                })
+            });
+        }
+        onPatched(()=>{
+            this.color()
+        });
     },
-
-
     color_pick(ev,record){
         var color = ev.target.value
         var res_id = record.resId
         var res_model = record.resModel
-
-                                  //ORM Call
-
+        //ORM Call
         this.orm.call("color.picker","get_color_picker_model_and_id",[],{
             record_id: res_id,
             model_name: res_model,
             record_color: color,
         }).then(function(data){
-
-
         })
-
-
         ev.target.parentNode.parentNode.style.backgroundColor = color
     },
-
-
-//Call from onMounted
+    //Call from onMounted
     color(){
-      var current_model = this.props.list.model.env.searchModel.resModel
-      var tr_list = $('.o_data_row')
-      var current_tr;
-
-
+        var current_model = this.props.list.model.env.searchModel.resModel
+        var tr_list = $('.o_data_row')
+        var current_tr;
+        var self = this;
         this.orm.call("color.picker","search_read",[],{
-          domain: [
+            domain: [
                 ['res_model', '=',current_model],
-
             ],
-
         }).then(function(data){
-        for(var i=0;i<tr_list.length;i++){
-        current_tr = tr_list[i].children[1].dataset.id
-
-         for(var j=0;j<data.length;j++){
-         if(current_tr == data[j].record_id){
-         tr_list[i].style.backgroundColor = data[j].color
-
-
-         }
-
-         }
-        }
-
+            Array.prototype.forEach.call(tr_list, function(tr) {
+                data.forEach((item) => {
+                    if (tr.firstChild.nextElementSibling.dataset.id == item.record_id) {
+                        tr.style.backgroundColor = item.color
+                    }
+                });
+            });
         })
-
     },
-
-})
+})

listview_change_background_color/static/src/xml/color_picker.xml

@@ -1,20 +1,26 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <templates id="template" xml:space="preserve">
 <!--    Add  the header on th-->
-    <t t-name="ListHeadTemplate" t-inherit="web.ListRenderer" t-inherit-mode="extension" owl="1">
+    <t t-name="ListHeadTemplate" t-inherit="web.ListRenderer"
+       t-inherit-mode="extension" owl="1">
         <xpath expr="//th[hasclass('o_list_record_selector')]" position="after">
            <th>
-                <td>Color</td>
+                <td class="color_picker_td">Color</td>
             </th>
         </xpath>
     </t>
-<!--    Add the color field on tree -->
-    <t t-name="ListColorTemplate" t-inherit="web.ListRenderer.RecordRow" t-inherit-mode="extension" owl="1">
+    <!--    Add the color field on tree -->
+    <t t-name="ListColorTemplate" t-inherit="web.ListRenderer.RecordRow"
+       t-inherit-mode="extension" owl="1">
         <xpath expr="//td[hasclass('o_list_record_selector')]" position="after">
-            <td class="not_display" t-att-data-id="record.resId" style="display:none">
+            <td class="not_display" t-att-data-id="record.resId"
+                style="display:none">
             </td>
-           <td class="color_picker_checkbox">
-                <input type="color" value="#e7d8d5" class="row_color_pick" name="row_color_value" style="width:20px;border: 1px;height: 20px;" t-on-change="(ev) => this.color_pick(ev, record)"/>
+            <td class="color_picker_checkbox">
+                <input type="color" value="#e7d8d5" class="row_color_pick"
+                       name="row_color_value"
+                       style="width:20px;border: 1px;height: 20px;"
+                       t-on-change="(ev) => this.color_pick(ev, record)"/>
             </td>
         </xpath>
     </t>