forked from fanruan/fineui
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
137 lines
4.0 KiB
137 lines
4.0 KiB
import { |
|
shortcut, |
|
Widget, |
|
extend, |
|
isFunction, |
|
createWidget, |
|
toPix, |
|
Controller, |
|
isKey, |
|
isNull, |
|
isEmptyArray, |
|
isEmptyString, |
|
isArray, |
|
find, |
|
contains |
|
} from "@/core"; |
|
import { IconTextValueComboPopup } from "./popup.icontextvalue"; |
|
import { SelectIconTextTrigger } from "../../trigger"; |
|
import { Combo } from "@/base"; |
|
|
|
@shortcut() |
|
export class IconTextValueCombo extends Widget { |
|
static xtype = "bi.icon_text_value_combo"; |
|
|
|
static EVENT_CHANGE = "EVENT_CHANGE"; |
|
|
|
_defaultConfig(config) { |
|
return extend(super._defaultConfig(...arguments), { |
|
baseCls: |
|
`bi-icon-text-value-combo ${ |
|
config.simple |
|
? "bi-border-bottom" |
|
: "bi-border bi-border-radius"}`, |
|
height: 24, |
|
iconHeight: null, |
|
iconWidth: null, |
|
value: "", |
|
}); |
|
} |
|
|
|
_init() { |
|
const o = this.options; |
|
o.value = isFunction(o.value) |
|
? this.__watch(o.value, (context, newValue) => { |
|
this.setValue(newValue); |
|
}) |
|
: o.value; |
|
o.items = isFunction(o.items) |
|
? this.__watch(o.items, (context, newValue) => { |
|
this.populate(newValue); |
|
}) |
|
: o.items; |
|
super._init(...arguments); |
|
this.trigger = createWidget({ |
|
type: SelectIconTextTrigger.xtype, |
|
cls: "icon-text-value-trigger", |
|
items: o.items, |
|
height: toPix(o.height, 2), |
|
text: o.text, |
|
iconCls: o.iconCls, |
|
value: o.value, |
|
iconHeight: o.iconHeight, |
|
iconWidth: o.iconWidth, |
|
iconWrapperWidth: o.iconWrapperWidth, |
|
title: o.title, |
|
warningTitle: o.warningTitle, |
|
}); |
|
this.popup = createWidget({ |
|
type: "bi.icon_text_value_combo_popup", |
|
items: o.items, |
|
value: o.value, |
|
iconHeight: o.iconHeight, |
|
iconWidth: o.iconWidth, |
|
iconWrapperWidth: o.iconWrapperWidth, |
|
}); |
|
this.popup.on(IconTextValueComboPopup.EVENT_CHANGE, (...args) => { |
|
this.setValue(this.popup.getValue()); |
|
this.textIconCombo.hideView(); |
|
this.fireEvent(IconTextValueCombo.EVENT_CHANGE, ...args); |
|
}); |
|
this.popup.on(Controller.EVENT_CHANGE, (...args) => { |
|
this.fireEvent(Controller.EVENT_CHANGE, ...args); |
|
}); |
|
this.textIconCombo = createWidget({ |
|
type: Combo.xtype, |
|
height: toPix(o.height, 2), |
|
width: toPix(o.width, 2), |
|
element: this, |
|
container: o.container, |
|
direction: o.direction, |
|
adjustLength: 2, |
|
el: this.trigger, |
|
popup: { |
|
el: this.popup, |
|
maxHeight: 240, |
|
minHeight: 25, |
|
}, |
|
}); |
|
if (isKey(o.value)) { |
|
this.setValue(o.value); |
|
} |
|
} |
|
|
|
_checkError(v) { |
|
if (isNull(v) || isEmptyArray(v) || isEmptyString(v)) { |
|
this.trigger.options.tipType = "success"; |
|
this.element.removeClass("combo-error"); |
|
} else { |
|
v = isArray(v) ? v : [v]; |
|
const result = find(this.options.items, (idx, item) => contains(v, item.value)); |
|
if (isNull(result)) { |
|
this.trigger.options.tipType = "warning"; |
|
this.element.removeClass("combo-error").addClass("combo-error"); |
|
} else { |
|
this.trigger.options.tipType = "success"; |
|
this.element.removeClass("combo-error"); |
|
} |
|
} |
|
} |
|
|
|
setValue(v) { |
|
this.trigger.setValue(v); |
|
this.popup.setValue(v); |
|
this._checkError(v); |
|
} |
|
|
|
getValue() { |
|
const value = this.popup.getValue(); |
|
|
|
return isNull(value) ? [] : isArray(value) ? value : [value]; |
|
} |
|
|
|
populate(items) { |
|
this.options.items = items; |
|
this.textIconCombo.populate(items); |
|
} |
|
}
|
|
|