Update to v1.3.2

README.md

@@ -190,13 +190,13 @@ function(data, render) {
 
 ### 5. `set_row_background`
 
-Function to set the background color of row.
+Function to set the background color of row, (css, hex, rgb, rgba, hsla).
 
 **Arguments:** `row`
 
 **Return:** `String`, `Null`
 
-**Colors:**
+**CSS Colors:**
 <div style="width:100%;text-align:center">
     <img src="https://github.com/kid1194/frappe-better-list-view/blob/main/images/row_bg.png?raw=true" alt="Frappe Better List View"/>
 </div>
@@ -205,9 +205,9 @@ Function to set the background color of row.
 ```
 function(row) {
     if (cint(row.cost) > 1000) return 'danger';
-    if (cint(row.cost) > 800) return 'warning';
-    if (cint(row.cost) > 600) return 'info';
-    if (cint(row.cost) < 300) return 'success';
+    if (cint(row.cost) > 800) return '#ffeeba';
+    if (cint(row.cost) > 600) return 'rgba(190,229,235,1)';
+    if (cint(row.cost) < 300) return 'hsla(133.7,41.2%,83.3%,1)';
 }
 ```
 

frappe_better_list_view/__init__.py

@@ -4,4 +4,4 @@
 # Licence: Please refer to LICENSE file
 
 
-__version__ = "1.3.1"
+__version__ = "1.3.2"

frappe_better_list_view/public/js/better_list_view.bundle.js

@@ -85,14 +85,23 @@ frappe.views.ListView = class ListView extends frappe.views.ListView {
     get_list_row_html(doc) {
         let html = super.get_list_row_html(doc);
         if (!$.isFunction(this.settings.set_row_background)) return html;
-        let css = 'level list-row',
-        color = this.settings.set_row_background(doc);
-        if (color && [
+        let color = this.settings.set_row_background(doc);
+        if (!color || Object.prototype.toString.call(color) !== '[object String]') return html;
+        let row = $('<div>').append(html),
+        list_row = $($(html.children()[0]).children()[0]);
+        if ([
             'active', 'primary', 'secondary', 'success',
             'danger', 'warning', 'info',
         ].indexOf(color) >= 0) {
-            html = html.replace(css, css + ' table-' + color);
+            list_row.addClass('table-' + color);
+        } else if (
+            (color[0] === '#' && color.length >= 4)
+            || (color.substring(0, 3).toLowerCase() === 'rgb')
+            || (color.substring(0, 4).toLowerCase() === 'hsla')
+        ) {
+            list_row.css('background-color', color);
         }
+        html = row.html();
         return html;
     }
 };

frappe_better_list_view/public/js/better_list_view_v12.bundle.js

@@ -35,11 +35,11 @@ frappe.views.ListView = class ListView extends frappe.views.ListView {
                 && this.settings.query_filters.length
             )
         ) {
-            let get_query_filter = function(doctype, cond, column) {
-                let sign = '=',
+            var get_query_filter = function(doctype, cond, column) {
+                var sign = '=',
                 value = cond;
                 if ($.isArray(cond)) {
-                    let len = cond.length,
+                    var len = cond.length,
                     i = 0;
                     if (len < 2) return;
                     if (len > 2) column = cond[i++];
@@ -48,8 +48,8 @@ frappe.views.ListView = class ListView extends frappe.views.ListView {
                 }
                 return [doctype, column, sign, value];
             };
-            for (let key in this.settings.query_filters) {
-                let cond = get_query_filter(
+            for (var key in this.settings.query_filters) {
+                var cond = get_query_filter(
                     this.doctype,
                     this.settings.query_filters[key],
                     key
@@ -83,16 +83,25 @@ frappe.views.ListView = class ListView extends frappe.views.ListView {
         super.render();
     }
     get_list_row_html(doc) {
-        let html = super.get_list_row_html(doc);
+        var html = super.get_list_row_html(doc);
         if (!$.isFunction(this.settings.set_row_background)) return html;
-        let css = 'level list-row',
-        color = this.settings.set_row_background(doc);
-        if (color && [
+        var color = this.settings.set_row_background(doc);
+        if (!color || Object.prototype.toString.call(color) !== '[object String]') return html;
+        var row = $('<div>').append(html),
+        list_row = $($(html.children()[0]).children()[0]);
+        if ([
             'active', 'primary', 'secondary', 'success',
             'danger', 'warning', 'info',
         ].indexOf(color) >= 0) {
-            html = html.replace(css, css + ' table-' + color);
+            list_row.addClass('table-' + color);
+        } else if (
+            (color[0] === '#' && color.length >= 4)
+            || (color.substring(0, 3).toLowerCase() === 'rgb')
+            || (color.substring(0, 4).toLowerCase() === 'hsla')
+        ) {
+            list_row.css('background-color', color);
         }
+        html = row.html();
         return html;
     }
 };