Ares.Lin
/
fineui-start
forked from Teller/fineui-start
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

测试多层级单选下拉树，区分默认值和暂不可用值情况

master
linyang3 3 years ago
parent
6ef395d4de
commit
029d18e683
2 changed files with 101 additions and 75 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 88
      dist/bundle.js
  2. 88
      src/modules/tree/main.js

88
dist/bundle.js vendored
Unescape View File

@ -279,80 +279,93 @@
})();
!(function () {
// 给多层级单选树增加设置错误值时标红状态
/**
* 多层级单选树增加无效值时状态，使用BI.config覆盖原组件，只能调用一次
* 新增defaultText参数，表示空默认值，不传默认值为请选择，注意不能替代text，只是为了跟text区分开，text现在包含空默认值和暂不可用值两种情况。
* value存在且不存在于items中，为无效值，文本框标红
* value不存在，text不为defaultText时，为暂不可用值，文本框不变，去除水印
*/
BI.config("bi.multilayer_single_tree_combo", function (config) {
var ERROR_CLASS = "combo-error";
var WATERMARK_CLASS = "bi-water-mark";
var DEFAULT_TEXT = "请选择";
/**
* 判断是否是有效值
* @param {Object} config
* @param {Array} value setValue传入的值
* @returns {Boolean}
*/
* 判断是否是有效值
* @param {Object} config
* @param {String} value setValue传入的值
* @returns {Boolean}
*/
function isValueValid (options, value) {
value = value || options.value || "";
if (Array.isArray(value)) {
value = value[0];
if (!BI.isObject(options)) {
return true;
}
var items = options.items || [];
var itemIds = [];
if (BI.isNull(value)) {
value = value || options.value;
// null/undefined/空字符串作为空值
if (BI.isNull(value) || (value === "")) {
return true;
}
var items = options.items || [];
var itemIds = [];
// 获取id列表
BI.each(items, function (i, item) {
item && item.value && itemIds.push(item.value);
});
if (BI.contains(itemIds, value)) {
return true;
}
return false;
return BI.contains(itemIds, value);
}
/**
* 增加/去除标红className
* @param {Object} widget
* @param {Array} value setValue传入的值
*/
* 增加/去除标红className
* @param {Object} widget
* @param {String} value setValue传入的值
*/
function changeInvalidClassName (widget, value) {
var combo = widget.combo || {};
var options = widget.options || {};
if (!BI.isObject(widget)) {
return;
}
var combo = widget.combo;
var trigger = widget.textTrigger && widget.textTrigger.trigger && widget.textTrigger.trigger.trigger && widget.textTrigger.trigger.trigger.text && widget.textTrigger.trigger.trigger.text.element;
var options = widget.options;
var defaultText = options.defaultText || DEFAULT_TEXT;
if (isValueValid(options, value)) {
combo && combo.element.removeClass(ERROR_CLASS);
} else {
combo && combo.element.addClass(ERROR_CLASS);
}
if (options.text !== defaultText) {
trigger.removeClass(WATERMARK_CLASS);
}
}
config.listeners = config.listeners || [];
// 新增mount生命周期回调
config.listeners.push({
eventName: BI.Events.MOUNT,
action: function () {
// 覆盖原setValue方法，调用原setValue前，修改样式
// 覆盖原setValue方法，调用原setValue前，修改样式
var _setValue = this.setValue;
this.setValue = function (value) {
changeInvalidClassName(this, value);
_setValue.call(this, value);
changeInvalidClassName(this, value && value[0]);
};
// 立即触发一次样式变更，不需要传value
changeInvalidClassName(this);
}
});
return config;
});
var treeItems = [
{id: -1, pId: -2, value: "根目录", text: "根目录"},
{id: 1, pId: -1, value: "第一级目录1", text: "第一级目录1"},
@ -414,10 +427,10 @@
];
m.items = m.items.concat(newItems);
// 测试修改value
// 测试修改value;
setTimeout(function () {
console.log("setValue");
self.treeRef.setValue("");
self.treeRef.setValue("不存在的值");
}, 3000);
@ -430,7 +443,8 @@
},
{
type: "bi.multilayer_single_tree_combo",
text: "默认值",
text: "无效值",
defaultText: "无效值",
allowEdit: false,
items: self.model.items,
ref: function (ref) {

88
src/modules/tree/main.js
Unescape View File

@ -1,81 +1,92 @@
!(function () {
// 给多层级单选树增加设置错误值时标红状态
/**
* 多层级单选树增加无效值时状态，使用BI.config覆盖原组件，只能调用一次
* 新增defaultText参数，表示空默认值，不传默认值为请选择，注意不能替代text，只是为了跟text区分开，text现在包含空默认值和暂不可用值两种情况。
* value存在且不存在于items中，为无效值，文本框标红
* value不存在，text不为defaultText时，为暂不可用值，文本框不变，去除水印
*/
BI.config("bi.multilayer_single_tree_combo", function (config) {
var ERROR_CLASS = "combo-error";
var WATERMARK_CLASS = "bi-water-mark";
var DEFAULT_TEXT = "请选择";
/**
* 判断是否是有效值
* @param {Object} config
* @param {Array} value setValue传入的值
* @returns {Boolean}
*/
* 判断是否是有效值
* @param {Object} config
* @param {String} value setValue传入的值
* @returns {Boolean}
*/
function isValueValid (options, value) {
if (!BI.isObject(options)) {
return true;
}
value = value || options.value;
if (Array.isArray(value)) {
value = value[0];
// null/undefined/空字符串作为空值
if (BI.isNull(value) || (value === "")) {
return true;
}
value = value || null;
var items = options.items || [];
var itemIds = [];
if (BI.isNull(value)) {
return true;
}
// 获取id列表
BI.each(items, function (i, item) {
item && item.value && itemIds.push(item.value);
});
if (BI.contains(itemIds, value)) {
return true;
}
return false;
return BI.contains(itemIds, value);
}
/**
* 增加/去除标红className
* @param {Object} widget
* @param {Array} value setValue传入的值
*/
* 增加/去除标红className
* @param {Object} widget
* @param {String} value setValue传入的值
*/
function changeInvalidClassName (widget, value) {
var combo = widget.combo || {};
var options = widget.options || {};
if (!BI.isObject(widget)) {
return;
}
var combo = widget.combo;
var trigger = widget.textTrigger && widget.textTrigger.trigger && widget.textTrigger.trigger.trigger && widget.textTrigger.trigger.trigger.text && widget.textTrigger.trigger.trigger.text.element;
var options = widget.options;
var defaultText = options.defaultText || DEFAULT_TEXT;
if (isValueValid(options, value)) {
combo && combo.element.removeClass(ERROR_CLASS);
} else {
combo && combo.element.addClass(ERROR_CLASS);
}
if (options.text !== defaultText) {
trigger.removeClass(WATERMARK_CLASS);
}
}
config.listeners = config.listeners || [];
// 新增mount生命周期回调
config.listeners.push({
eventName: BI.Events.MOUNT,
action: function () {
// 覆盖原setValue方法，调用原setValue前，修改样式
// 覆盖原setValue方法，调用原setValue前，修改样式
var _setValue = this.setValue;
this.setValue = function (value) {
changeInvalidClassName(this, value);
_setValue.call(this, value);
changeInvalidClassName(this, value && value[0]);
};
// 立即触发一次样式变更，不需要传value
changeInvalidClassName(this);
}
});
return config;
});
var treeItems = [
{id: -1, pId: -2, value: "根目录", text: "根目录"},
{id: 1, pId: -1, value: "第一级目录1", text: "第一级目录1"},
@ -137,10 +148,10 @@
];
m.items = m.items.concat(newItems);
// 测试修改value
// 测试修改value;
setTimeout(function () {
console.log("setValue");
self.treeRef.setValue("");
self.treeRef.setValue("不存在的值");
}, 3000);
@ -153,7 +164,8 @@
},
{
type: "bi.multilayer_single_tree_combo",
text: "默认值",
text: "无效值",
defaultText: "无效值",
allowEdit: false,
items: self.model.items,
ref: function (ref) {

Write Preview
Loading…
Cancel
Save