Zhenfei.Li
2 years ago
21 changed files with 2595 additions and 2061 deletions
@ -1,143 +1,155 @@
|
||||
(function() { |
||||
function transformItems(items) { |
||||
if (!items) return items; |
||||
var result = BI.cloneDeep(items); |
||||
var isComplexItmes = BI.some(items, function (_, item) { |
||||
return BI.isArray(item); |
||||
import { shortcut, Widget, extend, createWidget, cloneDeep, some, isArray, each } from "@/core"; |
||||
import { DownListPopup } from "./popup.downlist"; |
||||
import { Combo } from "@/base"; |
||||
import { IconTrigger } from "@/case"; |
||||
|
||||
|
||||
function transformItems(items) { |
||||
if (!items) return items; |
||||
let result = cloneDeep(items); |
||||
const isComplexItmes = some(items, (_, item) => isArray(item)); |
||||
// 传一维数组，帮转二维
|
||||
if (!isComplexItmes) { |
||||
result = [result]; |
||||
} |
||||
// 帮转 el
|
||||
each(result, (_, arr) => { |
||||
each(arr, (_, item) => { |
||||
if (item.children && !item.el) { |
||||
item.el = { |
||||
text: item.text, |
||||
icon: item.icon, |
||||
cls: item.cls, |
||||
iconCls1: item.iconCls1, |
||||
value: item.value, |
||||
}; |
||||
} |
||||
}); |
||||
// 传一维数组，帮转二维
|
||||
if (!isComplexItmes) { |
||||
result = [result]; |
||||
} |
||||
// 帮转 el
|
||||
BI.each(result, function (_, arr) { |
||||
BI.each(arr, function (_, item) { |
||||
if (item.children && !item.el) { |
||||
item.el = { |
||||
text: item.text, |
||||
icon: item.icon, |
||||
cls: item.cls, |
||||
iconCls1: item.iconCls1, |
||||
value: item.value |
||||
}; |
||||
} |
||||
}); |
||||
}); |
||||
|
||||
return result; |
||||
} |
||||
|
||||
@shortcut() |
||||
export class DownListCombo extends Widget { |
||||
static xtype = "bi.down_list_combo"; |
||||
|
||||
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||
static EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE"; |
||||
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; |
||||
|
||||
_defaultConfig() { |
||||
return extend(super._defaultConfig(...arguments), { |
||||
baseCls: "bi-down-list-combo", |
||||
height: 24, |
||||
items: [], |
||||
adjustLength: 0, |
||||
direction: "bottom", |
||||
trigger: "click", |
||||
container: null, |
||||
stopPropagation: false, |
||||
el: {}, |
||||
popup: {}, |
||||
minWidth: 140, |
||||
maxHeight: 1000, |
||||
destroyWhenHide: false, |
||||
isDefaultInit: true, |
||||
}); |
||||
return result; |
||||
} |
||||
|
||||
/** |
||||
* Created by roy on 15/8/14. |
||||
*/ |
||||
BI.DownListCombo = BI.inherit(BI.Widget, { |
||||
_defaultConfig: function () { |
||||
return BI.extend(BI.DownListCombo.superclass._defaultConfig.apply(this, arguments), { |
||||
baseCls: "bi-down-list-combo", |
||||
height: 24, |
||||
items: [], |
||||
adjustLength: 0, |
||||
direction: "bottom", |
||||
trigger: "click", |
||||
container: null, |
||||
stopPropagation: false, |
||||
el: {}, |
||||
popup: {}, |
||||
minWidth: 140, |
||||
maxHeight: 1000, |
||||
destroyWhenHide: false, |
||||
isDefaultInit: true, |
||||
}); |
||||
}, |
||||
_init() { |
||||
super._init(...arguments); |
||||
const o = this.options; |
||||
|
||||
_init: function () { |
||||
BI.DownListCombo.superclass._init.apply(this, arguments); |
||||
var self = this, o = this.options; |
||||
|
||||
this.downlistcombo = BI.createWidget({ |
||||
element: this, |
||||
type: "bi.combo", |
||||
trigger: o.trigger, |
||||
isNeedAdjustWidth: false, |
||||
isDefaultInit: o.isDefaultInit, |
||||
container: o.container, |
||||
adjustLength: o.adjustLength, |
||||
direction: o.direction, |
||||
belowMouse: o.belowMouse, |
||||
stopPropagation: o.stopPropagation, |
||||
destroyWhenHide: o.destroyWhenHide, |
||||
this.downlistcombo = createWidget({ |
||||
element: this, |
||||
type: Combo.xtype, |
||||
trigger: o.trigger, |
||||
isNeedAdjustWidth: false, |
||||
isDefaultInit: o.isDefaultInit, |
||||
container: o.container, |
||||
adjustLength: o.adjustLength, |
||||
direction: o.direction, |
||||
belowMouse: o.belowMouse, |
||||
stopPropagation: o.stopPropagation, |
||||
destroyWhenHide: o.destroyWhenHide, |
||||
el: { |
||||
type: IconTrigger.xtype, |
||||
extraCls: o.iconCls, |
||||
width: o.width, |
||||
height: o.height, |
||||
...o.el, |
||||
}, |
||||
popup: { |
||||
el: { |
||||
type: "bi.icon_trigger", |
||||
extraCls: o.iconCls, |
||||
width: o.width, |
||||
height: o.height, |
||||
...o.el |
||||
}, |
||||
popup: { |
||||
el: { |
||||
type: "bi.down_list_popup", |
||||
ref: function (ref) { |
||||
self.popupView = ref; |
||||
}, |
||||
items: transformItems(o.items), |
||||
chooseType: o.chooseType, |
||||
value: o.value, |
||||
listeners: [{ |
||||
eventName: BI.DownListPopup.EVENT_CHANGE, |
||||
action: function (value) { |
||||
self.fireEvent(BI.DownListCombo.EVENT_CHANGE, value); |
||||
self.downlistcombo.hideView(); |
||||
} |
||||
}, { |
||||
eventName: BI.DownListPopup.EVENT_SON_VALUE_CHANGE, |
||||
action: function (value, fatherValue) { |
||||
self.fireEvent(BI.DownListCombo.EVENT_SON_VALUE_CHANGE, value, fatherValue); |
||||
self.downlistcombo.hideView(); |
||||
} |
||||
}] |
||||
type: DownListPopup.xtype, |
||||
ref: _ref => { |
||||
this.popupView = _ref; |
||||
}, |
||||
stopPropagation: o.stopPropagation, |
||||
maxHeight: o.maxHeight, |
||||
minWidth: o.minWidth, |
||||
...o.popup |
||||
} |
||||
}); |
||||
|
||||
this.downlistcombo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () { |
||||
self.fireEvent(BI.DownListCombo.EVENT_BEFORE_POPUPVIEW); |
||||
}); |
||||
}, |
||||
items: transformItems(o.items), |
||||
chooseType: o.chooseType, |
||||
value: o.value, |
||||
listeners: [ |
||||
{ |
||||
eventName: DownListPopup.EVENT_CHANGE, |
||||
action: value => { |
||||
this.fireEvent( |
||||
DownListCombo.EVENT_CHANGE, |
||||
value |
||||
); |
||||
this.downlistcombo.hideView(); |
||||
}, |
||||
}, |
||||
{ |
||||
eventName: DownListPopup.EVENT_SON_VALUE_CHANGE, |
||||
action: (value, fatherValue) => { |
||||
this.fireEvent( |
||||
DownListCombo.EVENT_SON_VALUE_CHANGE, |
||||
value, |
||||
fatherValue |
||||
); |
||||
this.downlistcombo.hideView(); |
||||
}, |
||||
} |
||||
], |
||||
}, |
||||
stopPropagation: o.stopPropagation, |
||||
maxHeight: o.maxHeight, |
||||
minWidth: o.minWidth, |
||||
...o.popup, |
||||
}, |
||||
}); |
||||
|
||||
hideView: function () { |
||||
this.downlistcombo.hideView(); |
||||
}, |
||||
this.downlistcombo.on(Combo.EVENT_BEFORE_POPUPVIEW, () => { |
||||
this.fireEvent(DownListCombo.EVENT_BEFORE_POPUPVIEW); |
||||
}); |
||||
} |
||||
|
||||
showView: function (e) { |
||||
this.downlistcombo.showView(e); |
||||
}, |
||||
hideView() { |
||||
this.downlistcombo.hideView(); |
||||
} |
||||
|
||||
populate: function (items) { |
||||
this.popupView.populate(items); |
||||
}, |
||||
showView(e) { |
||||
this.downlistcombo.showView(e); |
||||
} |
||||
|
||||
setValue: function (v) { |
||||
this.popupView.setValue(v); |
||||
}, |
||||
populate(items) { |
||||
this.popupView.populate(items); |
||||
} |
||||
|
||||
getValue: function () { |
||||
return this.popupView.getValue(); |
||||
}, |
||||
setValue(v) { |
||||
this.popupView.setValue(v); |
||||
} |
||||
|
||||
adjustWidth: function () { |
||||
this.downlistcombo.adjustWidth(); |
||||
}, |
||||
getValue() { |
||||
return this.popupView.getValue(); |
||||
} |
||||
|
||||
adjustHeight: function () { |
||||
this.downlistcombo.adjustHeight(); |
||||
} |
||||
}); |
||||
BI.DownListCombo.EVENT_CHANGE = "EVENT_CHANGE"; |
||||
BI.DownListCombo.EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE"; |
||||
BI.DownListCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; |
||||
adjustWidth() { |
||||
this.downlistcombo.adjustWidth(); |
||||
} |
||||
|
||||
BI.shortcut("bi.down_list_combo", BI.DownListCombo); |
||||
}()); |
||||
adjustHeight() { |
||||
this.downlistcombo.adjustHeight(); |
||||
} |
||||
} |
||||
|
||||
@ -1,51 +1,62 @@
|
||||
/** |
||||
* Created by roy on 15/9/6. |
||||
*/ |
||||
BI.DownListGroup = BI.inherit(BI.Widget, { |
||||
constants: { |
||||
iconCls: "check-mark-ha-font" |
||||
}, |
||||
_defaultConfig: function () { |
||||
return BI.extend(BI.DownListGroup.superclass._defaultConfig.apply(this, arguments), { |
||||
baseCls: "bi-down-list-group", |
||||
items: [ |
||||
{ |
||||
el: {} |
||||
} |
||||
] |
||||
}); |
||||
}, |
||||
_init: function () { |
||||
BI.DownListGroup.superclass._init.apply(this, arguments); |
||||
var o = this.options, self = this; |
||||
|
||||
this.downlistgroup = BI.createWidget({ |
||||
element: this, |
||||
type: "bi.button_tree", |
||||
items: o.items, |
||||
chooseType: 0, // 0单选，1多选
|
||||
layouts: [{ |
||||
type: "bi.vertical", |
||||
hgap: 0, |
||||
vgap: 0 |
||||
}], |
||||
value: o.value |
||||
}); |
||||
this.downlistgroup.on(BI.Controller.EVENT_CHANGE, function (type) { |
||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
||||
if(type === BI.Events.CLICK) { |
||||
self.fireEvent(BI.DownListGroup.EVENT_CHANGE, arguments); |
||||
} |
||||
}); |
||||
}, |
||||
getValue: function () { |
||||
return this.downlistgroup.getValue(); |
||||
}, |
||||
setValue: function (v) { |
||||
this.downlistgroup.setValue(v); |
||||
} |
||||
|
||||
|
||||
}); |
||||
BI.DownListGroup.EVENT_CHANGE = "EVENT_CHANGE"; |
||||
BI.shortcut("bi.down_list_group", BI.DownListGroup); |
||||
import { |
||||
shortcut, |
||||
Widget, |
||||
extend, |
||||
createWidget, |
||||
Controller, |
||||
Events |
||||
} from "@/core"; |
||||
|
||||
@shortcut() |
||||
export class DownListGroup extends Widget { |
||||
static xtype = "bi.down_list_group"; |
||||
|
||||
constants = { iconCls: "check-mark-ha-font" }; |
||||
|
||||
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||
|
||||
_defaultConfig() { |
||||
return extend(super._defaultConfig(...arguments), { |
||||
baseCls: "bi-down-list-group", |
||||
items: [ |
||||
{ |
||||
el: {}, |
||||
} |
||||
], |
||||
}); |
||||
} |
||||
|
||||
_init() { |
||||
super._init(...arguments); |
||||
const o = this.options; |
||||
|
||||
this.downlistgroup = createWidget({ |
||||
element: this, |
||||
type: "bi.button_tree", |
||||
items: o.items, |
||||
chooseType: 0, // 0单选，1多选
|
||||
layouts: [ |
||||
{ |
||||
type: "bi.vertical", |
||||
hgap: 0, |
||||
vgap: 0, |
||||
} |
||||
], |
||||
value: o.value, |
||||
}); |
||||
this.downlistgroup.on(Controller.EVENT_CHANGE, (type, ...args) => { |
||||
this.fireEvent(Controller.EVENT_CHANGE, type, ...args); |
||||
if (type === Events.CLICK) { |
||||
this.fireEvent(DownListGroup.EVENT_CHANGE, type, ...args); |
||||
} |
||||
}); |
||||
} |
||||
|
||||
getValue() { |
||||
return this.downlistgroup.getValue(); |
||||
} |
||||
|
||||
setValue(v) { |
||||
this.downlistgroup.setValue(v); |
||||
} |
||||
} |
||||
|
||||
@ -0,0 +1,5 @@
|
||||
export { DownListGroup } from "./group.downlist"; |
||||
export { DownListItem } from "./item.downlist"; |
||||
export { DownListGroupItem } from "./item.downlistgroup"; |
||||
export { DownListPopup } from "./popup.downlist"; |
||||
export { DownListCombo } from "./combo.downlist"; |
||||
@ -1,102 +1,125 @@
|
||||
BI.DownListItem = BI.inherit(BI.BasicButton, { |
||||
_defaultConfig: function () { |
||||
var conf = BI.DownListItem.superclass._defaultConfig.apply(this, arguments); |
||||
return BI.extend(conf, { |
||||
baseCls: "bi-down-list-item bi-list-item-active", |
||||
cls: "", |
||||
height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, |
||||
logic: { |
||||
dynamic: true |
||||
}, |
||||
selected: false, |
||||
iconHeight: null, |
||||
iconWidth: null, |
||||
textHgap: 0, |
||||
textVgap: 0, |
||||
textLgap: 0, |
||||
textRgap: 0 |
||||
}); |
||||
}, |
||||
_init: function () { |
||||
BI.DownListItem.superclass._init.apply(this, arguments); |
||||
var self = this, o = this.options; |
||||
this.text = BI.createWidget({ |
||||
type: "bi.label", |
||||
cls: "list-item-text", |
||||
textAlign: "left", |
||||
hgap: o.textHgap, |
||||
vgap: o.textVgap, |
||||
lgap: o.textLgap, |
||||
rgap: o.textRgap, |
||||
text: o.text, |
||||
value: o.value, |
||||
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: icon, |
||||
}], |
||||
}); |
||||
|
||||
BI.createWidget(BI.extend({ |
||||
element: this |
||||
}, BI.LogicFactory.createLogic(BI.LogicFactory.createLogicTypeByDirection(BI.Direction.Left), BI.extend(o.logic, { |
||||
items: BI.LogicFactory.createLogicItemsByDirection(BI.Direction.Left, this.icon, this.text) |
||||
})))); |
||||
}, |
||||
|
||||
setValue: function () { |
||||
if (!this.isReadOnly()) { |
||||
this.text.setValue.apply(this.text, arguments); |
||||
} |
||||
}, |
||||
|
||||
getValue: function () { |
||||
return this.text.getValue(); |
||||
}, |
||||
|
||||
setText: function () { |
||||
this.text.setText.apply(this.text, arguments); |
||||
}, |
||||
|
||||
getText: function () { |
||||
return this.text.getText(); |
||||
}, |
||||
|
||||
doClick: function () { |
||||
BI.DownListItem.superclass.doClick.apply(this, arguments); |
||||
if (this.isValid()) { |
||||
this.fireEvent(BI.DownListItem.EVENT_CHANGE, this.getValue(), this); |
||||
} |
||||
}, |
||||
|
||||
doRedMark: function () { |
||||
this.text.doRedMark.apply(this.text, arguments); |
||||
}, |
||||
|
||||
unRedMark: function () { |
||||
this.text.unRedMark.apply(this.text, arguments); |
||||
}, |
||||
|
||||
doHighLight: function () { |
||||
this.text.doHighLight.apply(this.text, arguments); |
||||
}, |
||||
|
||||
unHighLight: function () { |
||||
this.text.unHighLight.apply(this.text, arguments); |
||||
} |
||||
}); |
||||
BI.DownListItem.EVENT_CHANGE = "EVENT_CHANGE"; |
||||
BI.shortcut("bi.down_list_item", BI.DownListItem); |
||||
import { shortcut, extend, createWidget, isPlainObject, LogicFactory, Direction } from "@/core"; |
||||
import { BasicButton } from "@/base"; |
||||
|
||||
@shortcut() |
||||
export class DownListItem extends BasicButton { |
||||
static xtype = "bi.down_list_item"; |
||||
|
||||
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||
|
||||
_defaultConfig() { |
||||
const conf = super._defaultConfig(...arguments); |
||||
|
||||
return extend(conf, { |
||||
baseCls: "bi-down-list-item bi-list-item-active", |
||||
cls: "", |
||||
height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, |
||||
logic: { |
||||
dynamic: true, |
||||
}, |
||||
selected: false, |
||||
iconHeight: null, |
||||
iconWidth: null, |
||||
textHgap: 0, |
||||
textVgap: 0, |
||||
textLgap: 0, |
||||
textRgap: 0, |
||||
}); |
||||
} |
||||
|
||||
_init() { |
||||
super._init(...arguments); |
||||
const o = this.options; |
||||
this.text = createWidget({ |
||||
type: "bi.label", |
||||
cls: "list-item-text", |
||||
textAlign: "left", |
||||
hgap: o.textHgap, |
||||
vgap: o.textVgap, |
||||
lgap: o.textLgap, |
||||
rgap: o.textRgap, |
||||
text: o.text, |
||||
value: o.value, |
||||
keyword: o.keyword, |
||||
height: o.height, |
||||
}); |
||||
|
||||
const icon = isPlainObject(o.icon) |
||||
? o.icon |
||||
: { |
||||
type: "bi.icon", |
||||
width: o.iconWidth, |
||||
height: o.iconHeight, |
||||
}; |
||||
|
||||
this.icon = createWidget({ |
||||
type: "bi.center_adapt", |
||||
width: 36, |
||||
height: o.height, |
||||
items: [ |
||||
{ |
||||
el: icon, |
||||
} |
||||
], |
||||
}); |
||||
|
||||
createWidget( |
||||
extend( |
||||
{ |
||||
element: this, |
||||
}, |
||||
LogicFactory.createLogic( |
||||
LogicFactory.createLogicTypeByDirection(Direction.Left), |
||||
extend(o.logic, { |
||||
items: LogicFactory.createLogicItemsByDirection( |
||||
Direction.Left, |
||||
this.icon, |
||||
this.text |
||||
), |
||||
}) |
||||
) |
||||
) |
||||
); |
||||
} |
||||
|
||||
setValue() { |
||||
if (!this.isReadOnly()) { |
||||
this.text.setValue(...arguments); |
||||
} |
||||
} |
||||
|
||||
getValue() { |
||||
return this.text.getValue(); |
||||
} |
||||
|
||||
setText() { |
||||
this.text.setText(...arguments); |
||||
} |
||||
|
||||
getText() { |
||||
return this.text.getText(); |
||||
} |
||||
|
||||
doClick() { |
||||
super.doClick(...arguments); |
||||
if (this.isValid()) { |
||||
this.fireEvent(DownListItem.EVENT_CHANGE, this.getValue(), this); |
||||
} |
||||
} |
||||
|
||||
doRedMark() { |
||||
this.text.doRedMark(...arguments); |
||||
} |
||||
|
||||
unRedMark() { |
||||
this.text.unRedMark(...arguments); |
||||
} |
||||
|
||||
doHighLight() { |
||||
this.text.doHighLight(...arguments); |
||||
} |
||||
|
||||
unHighLight() { |
||||
this.text.unHighLight(...arguments); |
||||
} |
||||
} |
||||
|
||||
@ -1,118 +1,141 @@
|
||||
BI.DownListGroupItem = BI.inherit(BI.BasicButton, { |
||||
_defaultConfig: function () { |
||||
var conf = BI.DownListGroupItem.superclass._defaultConfig.apply(this, arguments); |
||||
return BI.extend(conf, { |
||||
baseCls: (conf.baseCls || "") + " bi-down-list-group-item", |
||||
logic: { |
||||
dynamic: false |
||||
}, |
||||
// invalid: true,
|
||||
iconCls1: "dot-e-font", |
||||
icon: "", |
||||
iconCls2: "pull-right-e-font" |
||||
}); |
||||
}, |
||||
render: function () { |
||||
var o = this.options; |
||||
var self = this; |
||||
this.text = BI.createWidget({ |
||||
type: "bi.label", |
||||
cls: "list-group-item-text", |
||||
textAlign: "left", |
||||
text: o.text, |
||||
value: o.value, |
||||
height: o.height, |
||||
}); |
||||
|
||||
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, |
||||
width: 24, |
||||
forceNotSelected: true |
||||
}); |
||||
|
||||
this.element.hover(function () { |
||||
if (self.isEnabled()) { |
||||
self.hover(); |
||||
} |
||||
}, function () { |
||||
if (self.isEnabled()) { |
||||
self.dishover(); |
||||
} |
||||
}); |
||||
|
||||
return { |
||||
type: "bi.horizontal_fill", |
||||
columnSize: [36, "fill", 24], |
||||
items: [this.icon1, this.text, this.icon2] |
||||
} |
||||
}, |
||||
|
||||
_getLevel: function () { |
||||
var child = BI.first(this.options.childValues); |
||||
return BI.isNotNull(child) ? (child + "").split(BI.BlankSplitChar).length : 0; |
||||
}, |
||||
|
||||
_digest: function (v) { |
||||
var self = this, o = this.options; |
||||
v = BI.isArray(v) ? v : [v]; |
||||
var level = this._getLevel(); |
||||
return BI.any(v, function (idx, value) { |
||||
return BI.contains(o.childValues, (value + "").split(BI.BlankSplitChar).slice(0, level).join(BI.BlankSplitChar)); |
||||
}); |
||||
}, |
||||
|
||||
hover: function () { |
||||
BI.DownListGroupItem.superclass.hover.apply(this, arguments); |
||||
this.icon1.element.addClass("hover"); |
||||
this.icon2.element.addClass("hover"); |
||||
|
||||
}, |
||||
|
||||
dishover: function () { |
||||
BI.DownListGroupItem.superclass.dishover.apply(this, arguments); |
||||
this.icon1.element.removeClass("hover"); |
||||
this.icon2.element.removeClass("hover"); |
||||
}, |
||||
|
||||
doClick: function () { |
||||
BI.DownListGroupItem.superclass.doClick.apply(this, arguments); |
||||
if (this.isValid()) { |
||||
this.fireEvent(BI.DownListGroupItem.EVENT_CHANGE, this.getValue()); |
||||
} |
||||
}, |
||||
|
||||
doRedMark: function () { |
||||
this.text.doRedMark.apply(this.text, arguments); |
||||
}, |
||||
|
||||
unRedMark: function () { |
||||
this.text.unRedMark.apply(this.text, arguments); |
||||
}, |
||||
|
||||
setValue: function (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); |
||||
import { |
||||
shortcut, |
||||
extend, |
||||
createWidget, |
||||
isNotNull, |
||||
isArray, |
||||
any, |
||||
contains, |
||||
isPlainObject, |
||||
first, |
||||
BlankSplitChar |
||||
} from "@/core"; |
||||
import { BasicButton } from "@/base"; |
||||
|
||||
@shortcut() |
||||
export class DownListGroupItem extends BasicButton { |
||||
static xtype = "bi.down_list_group_item"; |
||||
|
||||
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||
|
||||
_defaultConfig() { |
||||
const conf = super._defaultConfig(...arguments); |
||||
|
||||
return extend(conf, { |
||||
baseCls: `${conf.baseCls || ""} bi-down-list-group-item`, |
||||
logic: { |
||||
dynamic: false, |
||||
}, |
||||
// invalid: true,
|
||||
iconCls1: "dot-e-font", |
||||
icon: "", |
||||
iconCls2: "pull-right-e-font", |
||||
}); |
||||
} |
||||
|
||||
render() { |
||||
const o = this.options; |
||||
this.text = createWidget({ |
||||
type: "bi.label", |
||||
cls: "list-group-item-text", |
||||
textAlign: "left", |
||||
text: o.text, |
||||
value: o.value, |
||||
height: o.height, |
||||
}); |
||||
|
||||
if (isPlainObject(o.icon)) { |
||||
this.icon1 = createWidget({ |
||||
width: 36, |
||||
height: o.height, |
||||
type: "bi.center_adapt", |
||||
items: [o.icon], |
||||
}); |
||||
} else { |
||||
this.icon1 = 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 = createWidget({ |
||||
type: "bi.icon_button", |
||||
cls: o.iconCls2, |
||||
width: 24, |
||||
forceNotSelected: true, |
||||
}); |
||||
|
||||
this.element.hover( |
||||
() => { |
||||
if (this.isEnabled()) { |
||||
this.hover(); |
||||
} |
||||
}, |
||||
() => { |
||||
if (this.isEnabled()) { |
||||
this.dishover(); |
||||
} |
||||
} |
||||
); |
||||
|
||||
return { |
||||
type: "bi.horizontal_fill", |
||||
columnSize: [36, "fill", 24], |
||||
items: [this.icon1, this.text, this.icon2], |
||||
}; |
||||
} |
||||
|
||||
_getLevel() { |
||||
const child = first(this.options.childValues); |
||||
|
||||
return isNotNull(child) ? (`${child}`).split(BlankSplitChar).length : 0; |
||||
} |
||||
|
||||
_digest(v) { |
||||
const o = this.options; |
||||
v = isArray(v) ? v : [v]; |
||||
const level = this._getLevel(); |
||||
|
||||
return any(v, (idx, value) => contains( |
||||
o.childValues, |
||||
(`${value}`).split(BlankSplitChar).slice(0, level).join(BlankSplitChar) |
||||
)); |
||||
} |
||||
|
||||
hover() { |
||||
super.hover(...arguments); |
||||
this.icon1.element.addClass("hover"); |
||||
this.icon2.element.addClass("hover"); |
||||
} |
||||
|
||||
dishover() { |
||||
super.dishover(...arguments); |
||||
this.icon1.element.removeClass("hover"); |
||||
this.icon2.element.removeClass("hover"); |
||||
} |
||||
|
||||
doClick() { |
||||
super.doClick(...arguments); |
||||
if (this.isValid()) { |
||||
this.fireEvent(DownListGroupItem.EVENT_CHANGE, this.getValue()); |
||||
} |
||||
} |
||||
|
||||
doRedMark() { |
||||
this.text.doRedMark(...arguments); |
||||
} |
||||
|
||||
unRedMark() { |
||||
this.text.unRedMark(...arguments); |
||||
} |
||||
|
||||
setValue(v) { |
||||
this.icon1.setSelected && this.icon1.setSelected(this._digest(v)); |
||||
} |
||||
} |
||||
|
||||
@ -1,301 +1,332 @@
|
||||
/** |
||||
* Created by roy on 15/9/8. |
||||
* 处理popup中的item分组样式 |
||||
* 一个item分组中的成员大于一时，该分组设置为单选，并且默认状态第一个成员设置为已选择项 |
||||
*/ |
||||
BI.DownListPopup = BI.inherit(BI.Pane, { |
||||
constants: { |
||||
nextIcon: "pull-right-e-font", |
||||
height: 24, |
||||
iconHeight: 12, |
||||
iconWidth: 12, |
||||
hgap: 0, |
||||
vgap: 0, |
||||
border: 1 |
||||
}, |
||||
_defaultConfig: function () { |
||||
var conf = BI.DownListPopup.superclass._defaultConfig.apply(this, arguments); |
||||
return BI.extend(conf, { |
||||
baseCls: "bi-down-list-popup", |
||||
items: [], |
||||
chooseType: BI.Selection.Multi |
||||
}); |
||||
}, |
||||
_init: function () { |
||||
BI.DownListPopup.superclass._init.apply(this, arguments); |
||||
this.singleValues = []; |
||||
this.childValueMap = {}; |
||||
this.fatherValueMap = {}; |
||||
this.items = []; |
||||
var self = this, o = this.options, children = this._createPopupItems(o.items); |
||||
this.popup = BI.createWidget({ |
||||
type: "bi.button_tree", |
||||
items: BI.createItems(children, |
||||
{}, { |
||||
adjustLength: -2 |
||||
} |
||||
), |
||||
layouts: [{ |
||||
type: "bi.vertical", |
||||
hgap: this.constants.hgap, |
||||
vgap: this.constants.vgap |
||||
}], |
||||
value: this._digest(o.value), |
||||
chooseType: o.chooseType |
||||
}); |
||||
import { |
||||
shortcut, |
||||
extend, |
||||
createWidget, |
||||
createItems, |
||||
isNotNull, |
||||
contains, |
||||
each, |
||||
isEmpty, |
||||
map, |
||||
isNotEmptyString, |
||||
isNotEmptyArray, |
||||
some, |
||||
deepClone |
||||
} from "@/core"; |
||||
import { Pane, ButtonTree } from "@/base"; |
||||
|
||||
this.popup.on(BI.ButtonTree.EVENT_CHANGE, function (value, object) { |
||||
var changedValue = value; |
||||
if (BI.isNotNull(self.childValueMap[value])) { |
||||
changedValue = self.childValueMap[value]; |
||||
self.fireEvent(BI.DownListPopup.EVENT_SON_VALUE_CHANGE, changedValue, self.fatherValueMap[value]); |
||||
} else { |
||||
self.fireEvent(BI.DownListPopup.EVENT_CHANGE, changedValue, object); |
||||
} |
||||
@shortcut() |
||||
export class DownListPopup extends Pane { |
||||
static xtype = "bi.down_list_popup"; |
||||
|
||||
constants = { |
||||
nextIcon: "pull-right-e-font", |
||||
height: 24, |
||||
iconHeight: 12, |
||||
iconWidth: 12, |
||||
hgap: 0, |
||||
vgap: 0, |
||||
border: 1, |
||||
}; |
||||
|
||||
if (!BI.contains(self.singleValues, changedValue)) { |
||||
var item = self.getValue(); |
||||
var result = []; |
||||
BI.each(item, function (i, valueObject) { |
||||
if (valueObject.value != changedValue) { |
||||
result.push(valueObject); |
||||
} |
||||
}); |
||||
self.setValue(result); |
||||
} |
||||
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||
static EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE"; |
||||
|
||||
}); |
||||
_defaultConfig() { |
||||
const conf = super._defaultConfig(...arguments); |
||||
|
||||
return extend(conf, { |
||||
baseCls: "bi-down-list-popup", |
||||
items: [], |
||||
chooseType: Selection.Multi, |
||||
}); |
||||
} |
||||
|
||||
BI.createWidget({ |
||||
type: "bi.vertical", |
||||
element: this, |
||||
items: [this.popup], |
||||
vgap: 5 |
||||
}); |
||||
_init() { |
||||
super._init(...arguments); |
||||
this.singleValues = []; |
||||
this.childValueMap = {}; |
||||
this.fatherValueMap = {}; |
||||
this.items = []; |
||||
const o = this.options, |
||||
children = this._createPopupItems(o.items); |
||||
this.popup = createWidget({ |
||||
type: "bi.button_tree", |
||||
items: createItems( |
||||
children, |
||||
{}, |
||||
{ |
||||
adjustLength: -2, |
||||
} |
||||
), |
||||
layouts: [ |
||||
{ |
||||
type: "bi.vertical", |
||||
hgap: this.constants.hgap, |
||||
vgap: this.constants.vgap, |
||||
} |
||||
], |
||||
value: this._digest(o.value), |
||||
chooseType: o.chooseType, |
||||
}); |
||||
|
||||
}, |
||||
_createPopupItems: function (items) { |
||||
var self = this, result = []; |
||||
// 不能修改populate进来的item的引用
|
||||
BI.each(items, function (i, it) { |
||||
var item_done = { |
||||
type: "bi.down_list_group", |
||||
items: [] |
||||
}; |
||||
this.popup.on(ButtonTree.EVENT_CHANGE, (value, object) => { |
||||
let changedValue = value; |
||||
if (isNotNull(this.childValueMap[value])) { |
||||
changedValue = this.childValueMap[value]; |
||||
this.fireEvent( |
||||
DownListPopup.EVENT_SON_VALUE_CHANGE, |
||||
changedValue, |
||||
this.fatherValueMap[value] |
||||
); |
||||
} else { |
||||
this.fireEvent(DownListPopup.EVENT_CHANGE, changedValue, object); |
||||
} |
||||
|
||||
var storeItem = []; |
||||
if (!contains(this.singleValues, changedValue)) { |
||||
const item = this.getValue(); |
||||
const result = []; |
||||
each(item, (i, valueObject) => { |
||||
if (valueObject.value !== changedValue) { |
||||
result.push(valueObject); |
||||
} |
||||
}); |
||||
this.setValue(result); |
||||
} |
||||
}); |
||||
|
||||
BI.each(it, function (i, sourceItem) { |
||||
var item = BI.extend({}, sourceItem); |
||||
if (BI.isNotEmptyArray(sourceItem.children) && !BI.isEmpty(sourceItem.el)) { |
||||
item.type = "bi.combo_group"; |
||||
// popup未初始化返回的是options中的value, 在经过buttontree的getValue concat之后，无法区分值来自options
|
||||
// 还是item自身, 这边控制defaultInit为true来避免这个问题
|
||||
item.isDefaultInit = true; |
||||
item.cls = "down-list-group"; |
||||
item.trigger = "hover"; |
||||
item.isNeedAdjustWidth = false; |
||||
item.el = sourceItem.el; |
||||
item.el.title = sourceItem.el.title || sourceItem.el.text; |
||||
item.el.type = "bi.down_list_group_item"; |
||||
item.el.logic = { |
||||
dynamic: true |
||||
}; |
||||
item.el.height = sourceItem.el.height || BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT; |
||||
item.el.iconCls2 = self.constants.nextIcon; |
||||
item.popup = { |
||||
lgap: 1, |
||||
el: { |
||||
type: "bi.button_tree", |
||||
chooseType: 0, |
||||
layouts: [{ |
||||
type: "bi.vertical" |
||||
}] |
||||
createWidget({ |
||||
type: "bi.vertical", |
||||
element: this, |
||||
items: [this.popup], |
||||
vgap: 5, |
||||
}); |
||||
} |
||||
|
||||
}, |
||||
innerVgap: 5, |
||||
maxHeight: 378 |
||||
}; |
||||
self._createChildren(item, sourceItem); |
||||
} else { |
||||
item.type = sourceItem.type || "bi.down_list_item"; |
||||
item.title = sourceItem.title || sourceItem.text; |
||||
item.textRgap = 10; |
||||
item.isNeedAdjustWidth = false; |
||||
item.logic = { |
||||
dynamic: true |
||||
}; |
||||
} |
||||
var el_done = {}; |
||||
el_done.el = item; |
||||
item_done.items.push(el_done); |
||||
storeItem.push(item); |
||||
}); |
||||
if (self._isGroup(item_done.items)) { |
||||
BI.each(item_done.items, function (i, item) { |
||||
self.singleValues.push(item.el.value); |
||||
}); |
||||
} |
||||
_createPopupItems(items) { |
||||
const result = []; |
||||
// 不能修改populate进来的item的引用
|
||||
each(items, (i, it) => { |
||||
const item_done = { |
||||
type: "bi.down_list_group", |
||||
items: [], |
||||
}; |
||||
|
||||
result.push(item_done); |
||||
self.items.push(storeItem); |
||||
if (self._needSpliter(i, items.length)) { |
||||
var spliter_container = BI.createWidget({ |
||||
type: "bi.vertical", |
||||
items: [{ |
||||
el: { |
||||
type: "bi.layout", |
||||
cls: "bi-down-list-spliter bi-split-top cursor-pointer", |
||||
height: 0 |
||||
} |
||||
const storeItem = []; |
||||
|
||||
}], |
||||
cls: "bi-down-list-spliter-container cursor-pointer", |
||||
vgap: 5, |
||||
hgap: 12 |
||||
}); |
||||
result.push(spliter_container); |
||||
} |
||||
}); |
||||
return result; |
||||
}, |
||||
each(it, (i, sourceItem) => { |
||||
const item = extend({}, sourceItem); |
||||
if (isNotEmptyArray(sourceItem.children) && !isEmpty(sourceItem.el)) { |
||||
item.type = "bi.combo_group"; |
||||
// popup未初始化返回的是options中的value, 在经过buttontree的getValue concat之后，无法区分值来自options
|
||||
// 还是item自身, 这边控制defaultInit为true来避免这个问题
|
||||
item.isDefaultInit = true; |
||||
item.cls = "down-list-group"; |
||||
item.trigger = "hover"; |
||||
item.isNeedAdjustWidth = false; |
||||
item.el = sourceItem.el; |
||||
item.el.title = sourceItem.el.title || sourceItem.el.text; |
||||
item.el.type = "bi.down_list_group_item"; |
||||
item.el.logic = { |
||||
dynamic: true, |
||||
}; |
||||
item.el.height = |
||||
sourceItem.el.height || BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT; |
||||
item.el.iconCls2 = this.constants.nextIcon; |
||||
item.popup = { |
||||
lgap: 1, |
||||
el: { |
||||
type: "bi.button_tree", |
||||
chooseType: 0, |
||||
layouts: [ |
||||
{ |
||||
type: "bi.vertical", |
||||
} |
||||
], |
||||
}, |
||||
innerVgap: 5, |
||||
maxHeight: 378, |
||||
}; |
||||
this._createChildren(item, sourceItem); |
||||
} else { |
||||
item.type = sourceItem.type || "bi.down_list_item"; |
||||
item.title = sourceItem.title || sourceItem.text; |
||||
item.textRgap = 10; |
||||
item.isNeedAdjustWidth = false; |
||||
item.logic = { |
||||
dynamic: true, |
||||
}; |
||||
} |
||||
const el_done = {}; |
||||
el_done.el = item; |
||||
item_done.items.push(el_done); |
||||
storeItem.push(item); |
||||
}); |
||||
if (this._isGroup(item_done.items)) { |
||||
each(item_done.items, (i, item) => { |
||||
this.singleValues.push(item.el.value); |
||||
}); |
||||
} |
||||
|
||||
_createChildren: function (targetItem, sourceItem) { |
||||
var self = this; |
||||
targetItem.el.childValues = []; |
||||
targetItem.items = targetItem.children = []; |
||||
BI.each(sourceItem.children, function (i, child) { |
||||
var item = BI.extend({}, child); |
||||
var fatherValue = BI.deepClone(targetItem.el.value); |
||||
var childValue = BI.deepClone(item.value); |
||||
self.singleValues.push(item.value); |
||||
item.type = item.type || "bi.down_list_item"; |
||||
item.extraCls = " child-down-list-item"; |
||||
item.title = item.title || item.text; |
||||
item.textRgap = 10; |
||||
item.isNeedAdjustWidth = false; |
||||
item.logic = { |
||||
dynamic: true |
||||
}; |
||||
item.father = fatherValue; |
||||
item.childValue = item.value; |
||||
self.fatherValueMap[self._createChildValue(fatherValue, childValue)] = fatherValue; |
||||
self.childValueMap[self._createChildValue(fatherValue, childValue)] = childValue; |
||||
item.value = self._createChildValue(fatherValue, childValue); |
||||
targetItem.el.childValues.push(item.value); |
||||
targetItem.items.push(item); |
||||
}); |
||||
}, |
||||
result.push(item_done); |
||||
this.items.push(storeItem); |
||||
if (this._needSpliter(i, items.length)) { |
||||
const spliter_container = createWidget({ |
||||
type: "bi.vertical", |
||||
items: [ |
||||
{ |
||||
el: { |
||||
type: "bi.layout", |
||||
cls: "bi-down-list-spliter bi-split-top cursor-pointer", |
||||
height: 0, |
||||
}, |
||||
} |
||||
], |
||||
cls: "bi-down-list-spliter-container cursor-pointer", |
||||
vgap: 5, |
||||
hgap: 12, |
||||
}); |
||||
result.push(spliter_container); |
||||
} |
||||
}); |
||||
|
||||
return result; |
||||
} |
||||
|
||||
_isGroup: function (i) { |
||||
return i.length > 1; |
||||
}, |
||||
_createChildren(targetItem, sourceItem) { |
||||
targetItem.el.childValues = []; |
||||
targetItem.items = targetItem.children = []; |
||||
each(sourceItem.children, (i, child) => { |
||||
const item = extend({}, child); |
||||
const fatherValue = deepClone(targetItem.el.value); |
||||
const childValue = deepClone(item.value); |
||||
this.singleValues.push(item.value); |
||||
item.type = item.type || "bi.down_list_item"; |
||||
item.extraCls = " child-down-list-item"; |
||||
item.title = item.title || item.text; |
||||
item.textRgap = 10; |
||||
item.isNeedAdjustWidth = false; |
||||
item.logic = { |
||||
dynamic: true, |
||||
}; |
||||
item.father = fatherValue; |
||||
item.childValue = item.value; |
||||
this.fatherValueMap[this._createChildValue(fatherValue, childValue)] = |
||||
fatherValue; |
||||
this.childValueMap[this._createChildValue(fatherValue, childValue)] = |
||||
childValue; |
||||
item.value = this._createChildValue(fatherValue, childValue); |
||||
targetItem.el.childValues.push(item.value); |
||||
targetItem.items.push(item); |
||||
}); |
||||
} |
||||
|
||||
_needSpliter: function (i, itemLength) { |
||||
return i < itemLength - 1; |
||||
}, |
||||
_isGroup(i) { |
||||
return i.length > 1; |
||||
} |
||||
|
||||
_createChildValue: function (fatherValue, childValue) { |
||||
return fatherValue + BI.BlankSplitChar + childValue; |
||||
}, |
||||
_needSpliter(i, itemLength) { |
||||
return i < itemLength - 1; |
||||
} |
||||
|
||||
_digest: function (valueItem) { |
||||
var self = this; |
||||
var valueArray = []; |
||||
BI.each(valueItem, function (i, item) { |
||||
var value; |
||||
if (BI.isNotNull(item.childValue)) { |
||||
value = self._createChildValue(item.value, item.childValue); |
||||
} else { |
||||
value = item.value; |
||||
} |
||||
valueArray.push(value); |
||||
} |
||||
); |
||||
return valueArray; |
||||
}, |
||||
_createChildValue(fatherValue, childValue) { |
||||
return fatherValue + BI.BlankSplitChar + childValue; |
||||
} |
||||
|
||||
_checkValues: function (values) { |
||||
var value = []; |
||||
BI.each(this.items, function (idx, itemGroup) { |
||||
BI.each(itemGroup, function (id, item) { |
||||
if(BI.isNotNull(item.children)) { |
||||
var childValues = BI.map(item.children, "value"); |
||||
var v = joinValue(childValues, values[idx]); |
||||
if(BI.isNotEmptyString(v)) { |
||||
value.push(v); |
||||
} |
||||
}else{ |
||||
if(item.value === values[idx][0]) { |
||||
value.push(values[idx][0]); |
||||
} |
||||
} |
||||
}); |
||||
}); |
||||
return value; |
||||
_digest(valueItem) { |
||||
const valueArray = []; |
||||
each(valueItem, (i, item) => { |
||||
let value; |
||||
if (isNotNull(item.childValue)) { |
||||
value = this._createChildValue(item.value, item.childValue); |
||||
} else { |
||||
value = item.value; |
||||
} |
||||
valueArray.push(value); |
||||
}); |
||||
|
||||
return valueArray; |
||||
} |
||||
|
||||
function joinValue (sources, targets) { |
||||
var value = ""; |
||||
BI.some(sources, function (idx, s) { |
||||
return BI.some(targets, function (id, t) { |
||||
if(s === t) { |
||||
value = s; |
||||
return true; |
||||
} |
||||
}); |
||||
}); |
||||
return value; |
||||
} |
||||
}, |
||||
_checkValues(values) { |
||||
const value = []; |
||||
each(this.items, (idx, itemGroup) => { |
||||
each(itemGroup, (id, item) => { |
||||
if (isNotNull(item.children)) { |
||||
const childValues = map(item.children, "value"); |
||||
const v = joinValue(childValues, values[idx]); |
||||
if (isNotEmptyString(v)) { |
||||
value.push(v); |
||||
} |
||||
} else { |
||||
if (item.value === values[idx][0]) { |
||||
value.push(values[idx][0]); |
||||
} |
||||
} |
||||
}); |
||||
}); |
||||
|
||||
return value; |
||||
|
||||
populate: function (items) { |
||||
BI.DownListPopup.superclass.populate.apply(this, arguments); |
||||
this.items = []; |
||||
this.childValueMap = {}; |
||||
this.fatherValueMap = {}; |
||||
this.singleValues = []; |
||||
var children = this._createPopupItems(items); |
||||
var popupItem = BI.createItems(children, |
||||
{}, { |
||||
adjustLength: -2 |
||||
} |
||||
); |
||||
this.popup.populate(popupItem); |
||||
}, |
||||
function joinValue(sources, targets) { |
||||
let value = ""; |
||||
some(sources, (idx, s) => some(targets, (id, t) => { |
||||
if (s === t) { |
||||
value = s; |
||||
|
||||
return true; |
||||
} |
||||
})); |
||||
|
||||
return value; |
||||
} |
||||
} |
||||
|
||||
setValue: function (valueItem) { |
||||
this.popup.setValue(this._digest(valueItem)); |
||||
}, |
||||
populate(items) { |
||||
super.populate(...arguments); |
||||
this.items = []; |
||||
this.childValueMap = {}; |
||||
this.fatherValueMap = {}; |
||||
this.singleValues = []; |
||||
const children = this._createPopupItems(items); |
||||
const popupItem = createItems( |
||||
children, |
||||
{}, |
||||
{ |
||||
adjustLength: -2, |
||||
} |
||||
); |
||||
this.popup.populate(popupItem); |
||||
} |
||||
|
||||
_getValue: function () { |
||||
var v = []; |
||||
BI.each(this.popup.getAllButtons(), function (i, item) { |
||||
i % 2 === 0 && v.push(item.getValue()); |
||||
}); |
||||
return v; |
||||
}, |
||||
setValue(valueItem) { |
||||
this.popup.setValue(this._digest(valueItem)); |
||||
} |
||||
|
||||
getValue: function () { |
||||
var self = this, result = []; |
||||
var values = this._checkValues(this._getValue()); |
||||
BI.each(values, function (i, value) { |
||||
var valueItem = {}; |
||||
if (BI.isNotNull(self.childValueMap[value])) { |
||||
var fartherValue = self.fatherValueMap[value]; |
||||
valueItem.childValue = self.childValueMap[value]; |
||||
valueItem.value = fartherValue; |
||||
} else { |
||||
valueItem.value = value; |
||||
} |
||||
result.push(valueItem); |
||||
}); |
||||
return result; |
||||
} |
||||
_getValue() { |
||||
const v = []; |
||||
each(this.popup.getAllButtons(), (i, item) => { |
||||
i % 2 === 0 && v.push(item.getValue()); |
||||
}); |
||||
|
||||
return v; |
||||
} |
||||
|
||||
|
||||
}); |
||||
|
||||
BI.DownListPopup.EVENT_CHANGE = "EVENT_CHANGE"; |
||||
BI.DownListPopup.EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE"; |
||||
BI.shortcut("bi.down_list_popup", BI.DownListPopup); |
||||
getValue() { |
||||
const result = []; |
||||
const values = this._checkValues(this._getValue()); |
||||
each(values, (i, value) => { |
||||
const valueItem = {}; |
||||
if (isNotNull(this.childValueMap[value])) { |
||||
const fartherValue = this.fatherValueMap[value]; |
||||
valueItem.childValue = this.childValueMap[value]; |
||||
valueItem.value = fartherValue; |
||||
} else { |
||||
valueItem.value = value; |
||||
} |
||||
result.push(valueItem); |
||||
}); |
||||
|
||||
return result; |
||||
} |
||||
} |
||||
|
||||
@ -0,0 +1,2 @@
|
||||
export { AccurateCalculationModel } from "./model.accuratecalculation"; |
||||
export { IntervalSlider } from "./intervalslider"; |
||||
@ -1,196 +1,217 @@
|
||||
BI.SignTextEditor = BI.inherit(BI.Widget, { |
||||
_defaultConfig: function () { |
||||
var conf = BI.SignTextEditor.superclass._defaultConfig.apply(this, arguments); |
||||
return BI.extend(conf, { |
||||
baseCls: (conf.baseCls || "") + " bi-sign-initial-editor", |
||||
validationChecker: BI.emptyFn, |
||||
import { |
||||
shortcut, |
||||
Widget, |
||||
extend, |
||||
emptyFn, |
||||
createWidget, |
||||
nextTick, |
||||
Controller, |
||||
AbsoluteLayout, |
||||
VerticalLayout, |
||||
bind, |
||||
isEmpty, |
||||
isKey |
||||
} from "@/core"; |
||||
import { TextButton, Editor } from "@/base"; |
||||
|
||||
@shortcut() |
||||
export class SignTextEditor extends Widget { |
||||
static xtype = "bi.sign_text_editor"; |
||||
|
||||
static EVENT_CONFIRM = "EVENT_CONFIRM"; |
||||
static EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM"; |
||||
static EVENT_CLICK_LABEL = "EVENT_CLICK_LABEL"; |
||||
|
||||
_defaultConfig() { |
||||
const conf = super._defaultConfig(...arguments); |
||||
|
||||
return extend(conf, { |
||||
baseCls: `${conf.baseCls || ""} bi-sign-initial-editor`, |
||||
validationChecker: emptyFn, |
||||
text: "", |
||||
height: 24 |
||||
height: 24, |
||||
}); |
||||
}, |
||||
} |
||||
|
||||
_init: function () { |
||||
BI.SignTextEditor.superclass._init.apply(this, arguments); |
||||
var self = this, o = this.options; |
||||
this.editor = BI.createWidget({ |
||||
type: "bi.editor", |
||||
_init() { |
||||
super._init(...arguments); |
||||
const o = this.options; |
||||
this.editor = createWidget({ |
||||
type: Editor.xtype, |
||||
simple: o.simple, |
||||
height: o.height, |
||||
hgap: 4, |
||||
vgap: 2, |
||||
value: o.value, |
||||
validationChecker: o.validationChecker, |
||||
allowBlank: false |
||||
allowBlank: false, |
||||
}); |
||||
this.text = BI.createWidget({ |
||||
type: "bi.text_button", |
||||
this.text = createWidget({ |
||||
type: TextButton.xtype, |
||||
cls: "sign-editor-text", |
||||
title: function () { |
||||
return self.getValue(); |
||||
}, |
||||
title: () => this.getValue(), |
||||
textAlign: o.textAlign, |
||||
height: o.height, |
||||
hgap: 4, |
||||
handler: function () { |
||||
self._showInput(); |
||||
self.editor.focus(); |
||||
self.editor.selectAll(); |
||||
} |
||||
handler: () => { |
||||
this._showInput(); |
||||
this.editor.focus(); |
||||
this.editor.selectAll(); |
||||
}, |
||||
}); |
||||
this.text.on(BI.TextButton.EVENT_CHANGE, function () { |
||||
BI.nextTick(function () { |
||||
self.fireEvent(BI.SignTextEditor.EVENT_CLICK_LABEL); |
||||
this.text.on(TextButton.EVENT_CHANGE, () => { |
||||
nextTick(() => { |
||||
this.fireEvent(SignTextEditor.EVENT_CLICK_LABEL); |
||||
}); |
||||
}); |
||||
BI.createWidget({ |
||||
type: "bi.absolute", |
||||
createWidget({ |
||||
type: AbsoluteLayout.xtype, |
||||
element: this, |
||||
items: [{ |
||||
el: this.text, |
||||
left: 0, |
||||
right: 0, |
||||
top: 0, |
||||
bottom: 0 |
||||
}] |
||||
items: [ |
||||
{ |
||||
el: this.text, |
||||
left: 0, |
||||
right: 0, |
||||
top: 0, |
||||
bottom: 0, |
||||
} |
||||
], |
||||
}); |
||||
this.editor.on(BI.Controller.EVENT_CHANGE, function () { |
||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
||||
this.editor.on(Controller.EVENT_CHANGE, (...args) => { |
||||
this.fireEvent(Controller.EVENT_CHANGE, ...args); |
||||
}); |
||||
this.editor.on(BI.Editor.EVENT_CONFIRM, function () { |
||||
self._showHint(); |
||||
self._checkText(); |
||||
self.fireEvent(BI.SignTextEditor.EVENT_CONFIRM, arguments); |
||||
this.editor.on(Editor.EVENT_CONFIRM, (...args) => { |
||||
this._showHint(); |
||||
this._checkText(); |
||||
this.fireEvent(SignTextEditor.EVENT_CONFIRM, ...args); |
||||
}); |
||||
this.editor.on(BI.Editor.EVENT_CHANGE_CONFIRM, function () { |
||||
self._showHint(); |
||||
self._checkText(); |
||||
self.fireEvent(BI.SignTextEditor.EVENT_CHANGE_CONFIRM, arguments); |
||||
this.editor.on(Editor.EVENT_CHANGE_CONFIRM, (...args) => { |
||||
this._showHint(); |
||||
this._checkText(); |
||||
this.fireEvent(SignTextEditor.EVENT_CHANGE_CONFIRM, ...args); |
||||
}); |
||||
this.editor.on(BI.Editor.EVENT_ERROR, function () { |
||||
self._checkText(); |
||||
this.editor.on(Editor.EVENT_ERROR, () => { |
||||
this._checkText(); |
||||
}); |
||||
BI.createWidget({ |
||||
type: "bi.vertical", |
||||
createWidget({ |
||||
type: VerticalLayout.xtype, |
||||
scrolly: false, |
||||
element: this, |
||||
items: [this.editor] |
||||
items: [this.editor], |
||||
}); |
||||
this._showHint(); |
||||
self._checkText(); |
||||
}, |
||||
|
||||
_checkText: function () { |
||||
var o = this.options; |
||||
BI.nextTick(BI.bind(function () { |
||||
if (this.editor.getValue() === "") { |
||||
this.text.setValue(o.watermark || ""); |
||||
this.text.element.addClass("bi-water-mark"); |
||||
} else { |
||||
var v = this.editor.getValue(); |
||||
v = (BI.isEmpty(v) || v == o.text) ? o.text : v + o.text; |
||||
this.text.setValue(v); |
||||
this.text.element.removeClass("bi-water-mark"); |
||||
} |
||||
}, this)); |
||||
}, |
||||
|
||||
_showInput: function () { |
||||
this._checkText(); |
||||
} |
||||
|
||||
_checkText() { |
||||
const o = this.options; |
||||
nextTick( |
||||
bind(() => { |
||||
if (this.editor.getValue() === "") { |
||||
this.text.setValue(o.watermark || ""); |
||||
this.text.element.addClass("bi-water-mark"); |
||||
} else { |
||||
let v = this.editor.getValue(); |
||||
v = isEmpty(v) || v === o.text ? o.text : v + o.text; |
||||
this.text.setValue(v); |
||||
this.text.element.removeClass("bi-water-mark"); |
||||
} |
||||
}, this) |
||||
); |
||||
} |
||||
|
||||
_showInput() { |
||||
this.editor.visible(); |
||||
this.text.invisible(); |
||||
}, |
||||
} |
||||
|
||||
_showHint: function () { |
||||
_showHint() { |
||||
this.editor.invisible(); |
||||
this.text.visible(); |
||||
}, |
||||
} |
||||
|
||||
setTitle: function (title) { |
||||
setTitle(title) { |
||||
this.text.setTitle(title); |
||||
}, |
||||
} |
||||
|
||||
setWarningTitle: function (title) { |
||||
setWarningTitle(title) { |
||||
this.text.setWarningTitle(title); |
||||
}, |
||||
} |
||||
|
||||
focus: function () { |
||||
focus() { |
||||
this._showInput(); |
||||
this.editor.focus(); |
||||
}, |
||||
} |
||||
|
||||
blur: function () { |
||||
blur() { |
||||
this.editor.blur(); |
||||
this._showHint(); |
||||
this._checkText(); |
||||
}, |
||||
} |
||||
|
||||
doRedMark: function () { |
||||
if (this.editor.getValue() === "" && BI.isKey(this.options.watermark)) { |
||||
doRedMark() { |
||||
if (this.editor.getValue() === "" && isKey(this.options.watermark)) { |
||||
return; |
||||
} |
||||
this.text.doRedMark.apply(this.text, arguments); |
||||
}, |
||||
this.text.doRedMark(...arguments); |
||||
} |
||||
|
||||
unRedMark: function () { |
||||
this.text.unRedMark.apply(this.text, arguments); |
||||
}, |
||||
unRedMark() { |
||||
this.text.unRedMark(...arguments); |
||||
} |
||||
|
||||
doHighLight: function () { |
||||
if (this.editor.getValue() === "" && BI.isKey(this.options.watermark)) { |
||||
doHighLight() { |
||||
if (this.editor.getValue() === "" && isKey(this.options.watermark)) { |
||||
return; |
||||
} |
||||
this.text.doHighLight.apply(this.text, arguments); |
||||
}, |
||||
this.text.doHighLight(...arguments); |
||||
} |
||||
|
||||
unHighLight: function () { |
||||
this.text.unHighLight.apply(this.text, arguments); |
||||
}, |
||||
unHighLight() { |
||||
this.text.unHighLight(...arguments); |
||||
} |
||||
|
||||
isValid: function () { |
||||
isValid() { |
||||
return this.editor.isValid(); |
||||
}, |
||||
} |
||||
|
||||
setErrorText: function (text) { |
||||
setErrorText(text) { |
||||
this.editor.setErrorText(text); |
||||
}, |
||||
} |
||||
|
||||
getErrorText: function () { |
||||
getErrorText() { |
||||
return this.editor.getErrorText(); |
||||
}, |
||||
} |
||||
|
||||
isEditing: function () { |
||||
isEditing() { |
||||
return this.editor.isEditing(); |
||||
}, |
||||
} |
||||
|
||||
getLastValidValue: function () { |
||||
getLastValidValue() { |
||||
return this.editor.getLastValidValue(); |
||||
}, |
||||
} |
||||
|
||||
getLastChangedValue: function () { |
||||
getLastChangedValue() { |
||||
return this.editor.getLastChangedValue(); |
||||
}, |
||||
} |
||||
|
||||
setValue: function (v) { |
||||
setValue(v) { |
||||
this.editor.setValue(v); |
||||
this._checkText(); |
||||
}, |
||||
} |
||||
|
||||
getValue: function () { |
||||
getValue() { |
||||
return this.editor.getValue(); |
||||
}, |
||||
} |
||||
|
||||
getState: function () { |
||||
getState() { |
||||
return this.text.getValue(); |
||||
}, |
||||
} |
||||
|
||||
setState: function (v) { |
||||
var o = this.options; |
||||
setState(v) { |
||||
const o = this.options; |
||||
this._showHint(); |
||||
v = (BI.isEmpty(v) || v == o.text) ? o.text : v + o.text; |
||||
v = isEmpty(v) || v === o.text ? o.text : v + o.text; |
||||
this.text.setValue(v); |
||||
} |
||||
}); |
||||
BI.SignTextEditor.EVENT_CONFIRM = "EVENT_CONFIRM"; |
||||
BI.SignTextEditor.EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM"; |
||||
BI.SignTextEditor.EVENT_CLICK_LABEL = "EVENT_CLICK_LABEL"; |
||||
|
||||
BI.shortcut("bi.sign_text_editor", BI.SignTextEditor); |
||||
} |
||||
|
||||
@ -1,26 +1,24 @@
|
||||
/** |
||||
* Created by zcf on 2016/9/22. |
||||
*/ |
||||
BI.SliderIconButton = BI.inherit(BI.Widget, { |
||||
import { shortcut, Widget, Layout } from "@/core"; |
||||
|
||||
props: { |
||||
@shortcut() |
||||
export class SliderIconButton extends Widget { |
||||
static xtype = "bi.single_slider_button"; |
||||
|
||||
props = { |
||||
baseCls: "bi-single-slider-button slider-button bi-high-light-border", |
||||
height: 8, |
||||
width: 8, |
||||
}, |
||||
|
||||
constants: { |
||||
} |
||||
constants = { |
||||
LARGE_SIZE: 16, |
||||
NORMAL_SIZE: 12, |
||||
LARGE_OFFSET: 4, |
||||
NORMAL_OFFSET: 6 |
||||
}, |
||||
NORMAL_OFFSET: 6, |
||||
}; |
||||
|
||||
render: function () { |
||||
var self = this; |
||||
render() { |
||||
return { |
||||
type: "bi.layout", |
||||
type: Layout.xtype, |
||||
}; |
||||
} |
||||
}); |
||||
BI.shortcut("bi.single_slider_button", BI.SliderIconButton); |
||||
} |
||||
|
||||
@ -0,0 +1,5 @@
|
||||
export { SingleSlider } from "./singleslider"; |
||||
export { SingleSliderLabel } from "./singleslider.label"; |
||||
export { SingleSliderNormal } from "./singleslider.normal"; |
||||
export { SignTextEditor } from "./button/editor.sign.text"; |
||||
export { SliderIconButton } from "./button/iconbutton.slider"; |
||||
Loading…
Reference in new issue