KERNEL-12250 downlist支持自定义icon

demo/js/widget/downlist/demo.downlist.js

@@ -1,3 +1,15 @@
+(function () {
+    var CustomIcon = BI.inherit(BI.Widget, {
+        render: function () {
+            return {
+                type: "bi.label",
+                text: "✨",
+            };
+        },
+    });
+    BI.shortcut("demo.downlist.icon", CustomIcon);
+}());
+
 Demo.Downlist = BI.inherit(BI.Widget, {
     props: {
         baseCls: "demo-downlist"
@@ -22,9 +34,9 @@ Demo.Downlist = BI.inherit(BI.Widget, {
 
     render: function () {
         var self = this;
-        // test
+
         return {
-            type: "bi.horizontal_adapt",
+            type: "bi.left",
             items: [{
                 type: "bi.down_list_combo",
                 ref: function (_ref) {
@@ -131,7 +143,51 @@ Demo.Downlist = BI.inherit(BI.Widget, {
                         // }]
                     }]
 
-                ]
+                ],
+            }, {
+                type: "bi.down_list_combo",
+                el: {
+                    type: "bi.button",
+                    ghost: true,
+                    iconPosition: "right",
+                    icon: "column-next-page-h-font",
+                    text: "自定义 trigger 和 icon 的级联下拉框",
+                },
+                listeners: [{
+                    eventName: "EVENT_CHANGE",
+                    action: function (v) {
+                        console.log("触发值", v);
+                    }
+                }, {
+                    eventName: "EVENT_SON_VALUE_CHANGE",
+                    action: function(v) {
+                        console.log("二级菜单触发值", v)
+                    }
+                }],
+                items: [
+                    [{
+                        el: {
+                            text: "选项一",
+                            value: 1,
+                            icon: {
+                                type: "demo.downlist.icon",
+                            },
+                        },
+                        children: [{
+                            text: "选项一",
+                            value: 11,
+                            icon: {
+                                type: "demo.downlist.icon",
+                            },
+                        }, {
+                            text: "选项二",
+                            value: 12,
+                        }],
+                    }, {
+                        text: "选项二",
+                        value: 2,
+                    }]
+                ],
             }, {
                 type: "bi.multi_layer_down_list_combo",
                 ref: function (_ref) {

src/widget/downlist/item.downlist.js

@@ -33,17 +33,21 @@ BI.DownListItem = BI.inherit(BI.BasicButton, {
             keyword: o.keyword,
             height: o.height
         });
+
+
+        var icon = BI.isPlainObject(o.icon) ? o.icon : {
+            type: "bi.icon",
+            width: o.iconWidth,
+            height: o.iconHeight,
+        }
+
         this.icon = BI.createWidget({
             type: "bi.center_adapt",
             width: 36,
             height: o.height,
             items: [{
-                el: {
-                    type: "bi.icon",
-                    width: o.iconWidth,
-                    height: o.iconHeight
-                }
-            }]
+                el: icon,
+            }],
         });
 
         BI.createWidget(BI.extend({

src/widget/downlist/item.downlistgroup.js

@@ -8,6 +8,7 @@ BI.DownListGroupItem = BI.inherit(BI.BasicButton, {
             },
             // invalid: true,
             iconCls1: "dot-e-font",
+            icon: "",
             iconCls2: "pull-right-e-font"
         });
     },
@@ -21,20 +22,29 @@ BI.DownListGroupItem = BI.inherit(BI.BasicButton, {
             textAlign: "left",
             text: o.text,
             value: o.value,
-            height: o.height
-        });
-
-        this.icon1 = BI.createWidget({
-            type: "bi.icon_button",
-            cls: o.iconCls1,
-            width: 36,
             height: o.height,
-            iconHeight: o.iconHeight,
-            iconWidth: 36,
-            disableSelected: true,
-            selected: this._digest(o.value)
         });
 
+        if (BI.isPlainObject(o.icon)) {
+            this.icon1 = BI.createWidget({
+                width: 36,
+                height: o.height,
+                type: "bi.center_adapt",
+                items: [o.icon],
+            });
+        } else {
+            this.icon1 = BI.createWidget({
+                type: "bi.icon_button",
+                cls: o.iconCls1,
+                width: 36,
+                height: o.height,
+                iconHeight: o.iconHeight,
+                iconWidth: 36,
+                disableSelected: true,
+                selected: this._digest(o.value),
+            });
+        }
+
         this.icon2 = BI.createWidget({
             type: "bi.icon_button",
             cls: o.iconCls2,
@@ -117,8 +127,8 @@ BI.DownListGroupItem = BI.inherit(BI.BasicButton, {
     },
 
     setValue: function (v) {
-        this.icon1.setSelected(this._digest(v));
-    }
+        this.icon1.setSelected && this.icon1.setSelected(this._digest(v));
+    },
 });
 BI.DownListGroupItem.EVENT_CHANGE = "EVENT_CHANGE";
-BI.shortcut("bi.down_list_group_item", BI.DownListGroupItem);
+BI.shortcut("bi.down_list_group_item", BI.DownListGroupItem);