Browse Source

JSY-20326 fix: 【组件问题】带清除按钮的单选下拉框,清除后需要恢复到默认值

es6
zsmj 2 years ago
parent
commit
c829658a1e
  1. 196
      demo/js/case/combo/demo.text_value_combo.js
  2. 7
      src/case/combo/textvaluecombo/combo.textvalue.js
  3. 38
      src/case/trigger/trigger.text.js
  4. 24
      src/case/trigger/trigger.text.select.js

196
demo/js/case/combo/demo.text_value_combo.js

@ -7,57 +7,159 @@ Demo.TextValueCombo = BI.inherit(BI.Widget, {
}, },
render: function () { render: function () {
var combo, wrapper; var combo, wrapper;
var items = [{
text: "MVC-1",
iconCls: "date-font",
value: 1
}, {
text: "MVC-2",
iconCls: "search-font",
value: 2
}, {
text: "MVC-3",
iconCls: "pull-right-font",
value: 3
}];
// 创建下拉框各种场景用例
return { return {
type: "bi.button_group", type: "bi.vertical",
items: [{ vgap: 20,
type: "bi.text_value_combo", hgap: 20,
ref: function () { items: [
combo = this; this.createCombo("无初始值,带提示文字", {
}, type: "bi.text_value_combo",
text: "默认值", ref: function () {
value: 22, combo = this;
width: 300, },
items: [{ defaultText: "请选择",
text: "MVC-1", width: 300,
iconCls: "date-font", items: items,
value: 1 listeners: [
}, { {
text: "MVC-2", eventName: BI.TextValueCombo.EVENT_CHANGE,
iconCls: "search-font", action: function () {
value: 2 console.log(this.getValue());
}
}
]
}),
this.createCombo("自动根据value匹配text", {
type: "bi.text_value_combo",
ref: function () {
combo = this;
},
defaultText: "请选择",
width: 300,
value: 1,
items: items,
listeners: [
{
eventName: BI.TextValueCombo.EVENT_CHANGE,
action: function () {
console.log(this.getValue());
}
}
]
}),
this.createCombo("无初始值,可以清空", {
type: "bi.text_value_combo",
ref: function () {
combo = this;
},
defaultText: "请选择",
width: 300,
items: items,
allowClear: true,
listeners: [
{
eventName: BI.TextValueCombo.EVENT_CHANGE,
action: function () {
console.log(this.getValue());
}
}
]
}),
this.createCombo("有初始值,可以清空", {
type: "bi.text_value_combo",
ref: function () {
combo = this;
},
defaultText: "请选择",
width: 300,
value: 1,
items: items,
allowClear: true,
listeners: [
{
eventName: BI.TextValueCombo.EVENT_CHANGE,
action: function () {
console.log(this.getValue());
}
}
]
}),
this.createCombo("有初始值,value不匹配,自动标红,可以清空", {
type: "bi.text_value_combo",
ref: function () {
combo = this;
},
defaultText: "请选择",
width: 300,
value: 111,
items: items,
allowClear: true,
listeners: [
{
eventName: BI.TextValueCombo.EVENT_CHANGE,
action: function () {
console.log(this.getValue());
}
}
]
}),
this.createCombo("有初始值,value不匹配,自动标红,指定标红文字", {
type: "bi.text_value_combo",
ref: function () {
combo = this;
},
width: 300,
text: "MVC-111",
value: 111,
items: items,
allowClear: true,
defaultText: "df",
listeners: [
{
eventName: BI.TextValueCombo.EVENT_CHANGE,
action: function () {
console.log(this.getValue());
}
}
]
})
]
};
},
createCombo: function (text, combo) {
return {
type: "bi.vertical",
items: [
{
el: {
type: "bi.label",
textAlign: "left",
text,
},
bgap: 10
}, { }, {
text: "MVC-3", el: combo
iconCls: "pull-right-font",
value: 3
}]
}, {
type: "bi.search_multi_text_value_combo",
items: Demo.CONSTANTS.ITEMS,
width: 200,
value: {
type: 1,
value: ["1", "2", "3"]
}
}, {
type: "bi.button",
width: 90,
height: 25,
handler: function () {
wrapper.populate();
} }
}, { ]
type: 'bi.label',
height: 1000
}],
ref: function () {
wrapper = this;
},
layouts: [{
type: "bi.vertical",
vgap: 20
}]
}; };
} }
}); });
BI.shortcut("demo.text_value_combo", Demo.TextValueCombo); BI.shortcut("demo.text_value_combo", Demo.TextValueCombo);

7
src/case/combo/textvaluecombo/combo.textvalue.js

@ -12,6 +12,7 @@ BI.TextValueCombo = BI.inherit(BI.Widget, {
chooseType: BI.ButtonGroup.CHOOSE_TYPE_SINGLE, chooseType: BI.ButtonGroup.CHOOSE_TYPE_SINGLE,
text: "", text: "",
value: "", value: "",
defaultText: "",
allowClear: false, allowClear: false,
}); });
}, },
@ -36,6 +37,7 @@ BI.TextValueCombo = BI.inherit(BI.Widget, {
value: o.value, value: o.value,
warningTitle: o.warningTitle, warningTitle: o.warningTitle,
allowClear: o.allowClear, allowClear: o.allowClear,
defaultText: o.defaultText,
listeners: [ listeners: [
{ {
eventName: BI.SelectTextTrigger.EVENT_CLEAR, eventName: BI.SelectTextTrigger.EVENT_CLEAR,
@ -79,7 +81,10 @@ BI.TextValueCombo = BI.inherit(BI.Widget, {
}, },
_clear: function () { _clear: function () {
this.setValue(); this.trigger.setValue();
this.popup.setValue();
this.element.removeClass("error");
this.trigger.element.removeClass("error");
}, },
_checkError: function (v) { _checkError: function (v) {

38
src/case/trigger/trigger.text.js

@ -17,21 +17,28 @@ BI.TextTrigger = BI.inherit(BI.Trigger, {
allowClear: false, allowClear: false,
title: function () { title: function () {
return self.text.getText(); return self.text.getText();
} },
defaultText: "",
text: "",
}; };
}, },
render: function () { render: function () {
var self = this, o = this.options, c = this._const; var self = this, o = this.options, c = this._const;
var text = {
var text = this.getText();
var defaultText = this.getDefaultText();
var label = {
type: "bi.label", type: "bi.label",
ref: function (_ref) { ref: function (_ref) {
self.text = _ref; self.text = _ref;
}, },
cls: "select-text-label" + (BI.isKey(o.textCls) ? (" " + o.textCls) : ""), cls: `select-text-label ${o.textCls} ${!BI.isNotEmptyString(text) && BI.isNotEmptyString(defaultText) ? "bi-tips" : ""}`,
textAlign: "left", textAlign: "left",
height: o.height, height: o.height,
text: o.text, text: text || o.defaultText,
tipType: o.tipType, tipType: o.tipType,
warningTitle: o.warningTitle, warningTitle: o.warningTitle,
hgap: o.textHgap, hgap: o.textHgap,
@ -56,7 +63,7 @@ BI.TextTrigger = BI.inherit(BI.Trigger, {
columnSize: ["fill", o.triggerWidth || o.height], columnSize: ["fill", o.triggerWidth || o.height],
items: [ items: [
{ {
el: text, el: label,
width: "fill" width: "fill"
}, { }, {
el: o.allowClear ? { el: o.allowClear ? {
@ -89,6 +96,16 @@ BI.TextTrigger = BI.inherit(BI.Trigger, {
}); });
}, },
getText: function () {
var o = this.options;
return BI.isFunction(o.text) ? o.text() : o.text;
},
getDefaultText: function () {
var o = this.options;
return BI.isFunction(o.defaultText) ? o.defaultText() : o.defaultText;
},
getTextor: function () { getTextor: function () {
return this.text; return this.text;
}, },
@ -101,10 +118,19 @@ BI.TextTrigger = BI.inherit(BI.Trigger, {
}, },
setText: function (text) { setText: function (text) {
this.text.setText(text);
if (this.options.allowClear) { if (this.options.allowClear) {
this.clearBtn.setVisible(BI.isNotEmptyString(text)); this.clearBtn.setVisible(BI.isNotEmptyString(text));
} }
if (BI.isKey(text)) {
this.text.setText(text);
this.text.element.removeClass("bi-tips");
} else if (BI.isKey(this.options.defaultText)) {
this.text.setText(this.options.defaultText);
this.text.element.addClass("bi-tips");
} else {
this.text.setText("");
this.text.element.removeClass("bi-tips");
}
}, },
setTipType: function (v) { setTipType: function (v) {

24
src/case/trigger/trigger.text.select.js

@ -13,6 +13,7 @@ BI.SelectTextTrigger = BI.inherit(BI.Trigger, {
height: 24, height: 24,
allowClear: false, allowClear: false,
valueFormatter: BI.emptyFn, valueFormatter: BI.emptyFn,
defaultText: "",
}); });
}, },
@ -26,6 +27,7 @@ BI.SelectTextTrigger = BI.inherit(BI.Trigger, {
height: o.height, height: o.height,
readonly: o.readonly, readonly: o.readonly,
text: obj.text, text: obj.text,
defaultText: o.defaultText,
textCls: obj.textCls, textCls: obj.textCls,
textHgap: o.textHgap, textHgap: o.textHgap,
textVgap: o.textVgap, textVgap: o.textVgap,
@ -48,13 +50,13 @@ BI.SelectTextTrigger = BI.inherit(BI.Trigger, {
}); });
}, },
_digest: function (vals, items) { _digest: function (val, items) {
var o = this.options; var o = this.options;
vals = BI.isArray(vals) ? vals : [vals]; val = BI.isArray(val) ? val[0] : val;
var result = []; var result = [];
var formatItems = BI.Tree.transformToArrayFormat(items); var formatItems = BI.Tree.transformToArrayFormat(items);
BI.each(formatItems, function (i, item) { BI.each(formatItems, function (i, item) {
if (BI.deepContains(vals, item.value) && !BI.contains(result, item.text || item.value)) { if (val === item.value && !BI.contains(result, item.text || item.value)) {
result.push(item.text || item.value); result.push(item.text || item.value);
} }
}); });
@ -62,12 +64,18 @@ BI.SelectTextTrigger = BI.inherit(BI.Trigger, {
if (result.length > 0) { if (result.length > 0) {
return { return {
textCls: "", textCls: "",
text: o.valueFormatter(vals[0]) || result.join(","), // 只保留单个value的场景,后续会把BI.isArray(vals) ? vals : [vals];这种都去掉 text: o.valueFormatter(val) || result.join(","),
}; };
} else { } else {
var text = BI.isFunction(o.text) ? o.text() : o.text;
if (BI.isEmptyString(text)) {
return {
textCls: "bi-tips",
text: ""
};
}
return { return {
textCls: "bi-water-mark", text: o.text
text: BI.isFunction(o.text) ? o.text() : o.text
}; };
} }
}, },
@ -77,8 +85,8 @@ BI.SelectTextTrigger = BI.inherit(BI.Trigger, {
this.trigger.setText(text); this.trigger.setText(text);
}, },
setValue: function (vals) { setValue: function (val) {
var formatValue = this._digest(vals, this.options.items); var formatValue = this._digest(val, this.options.items);
this.trigger.setTextCls(formatValue.textCls); this.trigger.setTextCls(formatValue.textCls);
this.trigger.setText(formatValue.text); this.trigger.setText(formatValue.text);
}, },

Loading…
Cancel
Save