Browse Source

Pull request #3030: KERNEL-12250 downlist支持自定义icon

Merge in VISUAL/fineui from ~TREECAT/fineui:master to master

* commit 'e6a95a3b7f485a83ecb24d8a99d9627cb99503c5':
  KERNEL-12250 downlist支持自定义icon
es6
treecat 2 years ago
parent
commit
020670e1c3
  1. 62
      demo/js/widget/downlist/demo.downlist.js
  2. 16
      src/widget/downlist/item.downlist.js
  3. 38
      src/widget/downlist/item.downlistgroup.js

62
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) {

16
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({

38
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);

Loading…
Cancel
Save