From 59b332512a06f79dbfc37b5d999ece082e05f48e Mon Sep 17 00:00:00 2001
From: zsmj <zsmj1994@gmail.com>
Date: Mon, 9 May 2022 17:31:05 +0800
Subject: [PATCH] =?UTF-8?q?DESIGN-4103=20feat:=20=E4=B8=8B=E6=8B=89?=
=?UTF-8?q?=E6=A1=86=E7=BB=84=E4=BB=B6=E6=94=AF=E6=8C=81clear,=E4=B8=8B?=
=?UTF-8?q?=E6=8B=89=E6=A0=91=E6=94=AF=E6=8C=81=E7=BC=BA=E5=A4=B1=E6=A0=87?=
=?UTF-8?q?=E7=BA=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../combo.searchtextvalue.js | 9 +++
.../combo/textvaluecombo/combo.textvalue.js | 10 ++--
src/case/trigger/trigger.text.js | 60 ++++++++-----------
src/case/trigger/trigger.text.select.js | 6 ++
src/less/base/combo/combo.less | 17 +++++-
src/less/base/combo/combo.textvalue.less | 14 -----
src/less/base/trigger/trigger.text.less | 11 ++++
src/less/lib/theme.less | 1 +
src/widget/selecttree/selecttree.combo.js | 42 ++++++++++++-
src/widget/singletree/singletree.combo.js | 42 ++++++++++++-
src/widget/singletree/singletree.trigger.js | 22 ++++++-
11 files changed, 172 insertions(+), 62 deletions(-)
delete mode 100644 src/less/base/combo/combo.textvalue.less
create mode 100644 src/less/base/trigger/trigger.text.less
diff --git a/src/case/combo/searchtextvaluecombo/combo.searchtextvalue.js b/src/case/combo/searchtextvaluecombo/combo.searchtextvalue.js
index ac3fad335..cb4aa29f8 100644
--- a/src/case/combo/searchtextvaluecombo/combo.searchtextvalue.js
+++ b/src/case/combo/searchtextvaluecombo/combo.searchtextvalue.js
@@ -11,6 +11,7 @@ BI.SearchTextValueCombo = BI.inherit(BI.Widget, {
items: [],
tipType: "",
warningTitle: "",
+ allowClear: false,
},
render: function () {
@@ -48,6 +49,7 @@ BI.SearchTextValueCombo = BI.inherit(BI.Widget, {
tipType: o.tipType,
warningTitle: o.warningTitle,
title: o.title,
+ allowClear: o.allowClear,
listeners: [{
eventName: BI.SearchTextValueTrigger.EVENT_CHANGE,
action: function () {
@@ -55,6 +57,13 @@ BI.SearchTextValueCombo = BI.inherit(BI.Widget, {
self.combo.hideView();
self.fireEvent(BI.SearchTextValueCombo.EVENT_CHANGE);
}
+ }, {
+ eventName: BI.SearchTextValueTrigger.EVENT_CLEAR,
+ action: function () {
+ self.setValue();
+ self.combo.hideView();
+ self.fireEvent(BI.SearchTextValueCombo.EVENT_CHANGE);
+ }
}]
},
popup: {
diff --git a/src/case/combo/textvaluecombo/combo.textvalue.js b/src/case/combo/textvaluecombo/combo.textvalue.js
index 75f2fd41f..69075f739 100644
--- a/src/case/combo/textvaluecombo/combo.textvalue.js
+++ b/src/case/combo/textvaluecombo/combo.textvalue.js
@@ -78,14 +78,14 @@ BI.TextValueCombo = BI.inherit(BI.Widget, {
},
_clear: function () {
- this.trigger.attr("text", "");
this.setValue();
},
_checkError: function (v) {
if (BI.isNull(v) || BI.isEmptyArray(v) || BI.isEmptyString(v)) {
this.trigger.options.tipType = "success";
- this.element.removeClass("combo-error");
+ this.element.removeClass("error");
+ this.trigger.element.removeClass("error");
} else {
v = BI.isArray(v) ? v : [v];
var result = BI.find(this.options.items, function (idx, item) {
@@ -93,10 +93,12 @@ BI.TextValueCombo = BI.inherit(BI.Widget, {
});
if (BI.isNull(result)) {
this.trigger.setTipType("warning");
- this.element.removeClass("combo-error").addClass("combo-error");
+ this.element.addClass("error");
+ this.trigger.element.addClass("error");
} else {
this.trigger.setTipType("success");
- this.element.removeClass("combo-error");
+ this.element.removeClass("error");
+ this.trigger.element.removeClass("error");
}
}
},
diff --git a/src/case/trigger/trigger.text.js b/src/case/trigger/trigger.text.js
index a85506c95..b9a51cc6f 100644
--- a/src/case/trigger/trigger.text.js
+++ b/src/case/trigger/trigger.text.js
@@ -53,52 +53,39 @@ BI.TextTrigger = BI.inherit(BI.Trigger, {
return ({
type: "bi.horizontal_fill",
+ columnSize: ["fill", o.triggerWidth || o.height],
items: [
{
el: text,
width: "fill"
}, {
- type: "bi.vertical_adapt",
- horizontalAlign: "left",
- width: o.triggerWidth || o.height,
- scrollable: false,
- items: [
- {
- el: {
- type: "bi.icon_button",
- ref: function (_ref) {
- self.clearBtn = _ref;
+ el: o.allowClear ? {
+ type: "bi.vertical_adapt",
+ horizontalAlign: "left",
+ scrollable: false,
+ items: [
+ {
+ el: {
+ type: "bi.icon_button",
+ ref: function (_ref) {
+ self.clearBtn = _ref;
+ },
+ cls: "close-h-font " + (o.allowClear ? "clear-button" : ""),
+ stopPropagation: true,
+ handler: function () {
+ self.fireEvent(BI.TextTrigger.EVENT_CLEAR);
+ },
},
- cls: "close-h-font",
- stopPropagation: true,
- handler: function () {
- self.fireEvent(BI.TextTrigger.EVENT_CLEAR);
- self.clearBtn.setVisible(false);
- },
- invisible: true,
- },
- width: o.triggerWidth || o.height
- }, {
- el: triggerButton,
- width: o.triggerWidth || o.height
- }
- ]
+ }, {
+ el: triggerButton,
+ }
+ ]
+ } : triggerButton,
}
]
});
},
- mounted: function () {
- var self = this;
- if (this.options.allowClear) {
- this.element.hover(function () {
- BI.isKey(self.text.getText()) && self.clearBtn.setVisible(true);
- }, function () {
- self.clearBtn.setVisible(false);
- });
- }
- },
-
getTextor: function () {
return this.text;
},
@@ -112,6 +99,9 @@ BI.TextTrigger = BI.inherit(BI.Trigger, {
setText: function (text) {
this.text.setText(text);
+ if (this.options.allowClear) {
+ this.clearBtn.setVisible(BI.isNotEmptyString(text));
+ }
},
setTipType: function (v) {
diff --git a/src/case/trigger/trigger.text.select.js b/src/case/trigger/trigger.text.select.js
index f9b8a770e..a63fc4bb0 100644
--- a/src/case/trigger/trigger.text.select.js
+++ b/src/case/trigger/trigger.text.select.js
@@ -39,6 +39,7 @@ BI.SelectTextTrigger = BI.inherit(BI.Trigger, {
{
eventName: BI.TextTrigger.EVENT_CLEAR,
action: function () {
+ self.setText("");
self.fireEvent(BI.SelectTextTrigger.EVENT_CLEAR);
}
}
@@ -70,6 +71,11 @@ BI.SelectTextTrigger = BI.inherit(BI.Trigger, {
}
},
+ setText: function (text) {
+ this.options.text = text;
+ this.trigger.setText(text);
+ },
+
setValue: function (vals) {
var formatValue = this._digest(vals, this.options.items);
this.trigger.setTextCls(formatValue.textCls);
diff --git a/src/less/base/combo/combo.less b/src/less/base/combo/combo.less
index 9725ac58a..f96f4b008 100644
--- a/src/less/base/combo/combo.less
+++ b/src/less/base/combo/combo.less
@@ -1,19 +1,22 @@
@import "../../index.less";
+
@val: transform .3s ease;
.bi-combo {
& > .bi-trigger {
- & .bi-trigger-icon-button{
+ & .bi-trigger-icon-button {
& .x-icon {
.rotate(0deg);
.transition(@val);
}
}
}
+
&.bi-combo-popup {
display: block !important;
visibility: visible !important;
+
& > .bi-trigger {
- & .bi-trigger-icon-button{
+ & .bi-trigger-icon-button {
& .x-icon {
.rotate(180deg);
.transition(@val);
@@ -21,11 +24,13 @@
}
}
}
+
&.bi-combo-popup, &.bi-combo-hover, &:hover {
&.bi-border, &.bi-border-bottom {
border-color: @color-bi-border-hover-combo;
}
}
+
&.disabled {
&.bi-combo-hover, &:hover {
&.bi-border, &.bi-border-bottom {
@@ -33,6 +38,14 @@
}
}
}
+
+ &.error {
+ &.bi-combo-hover, &:hover {
+ &.bi-border, &.bi-border-bottom {
+ border-color: @border-color-negative;
+ }
+ }
+ }
}
.bi-theme-dark {
diff --git a/src/less/base/combo/combo.textvalue.less b/src/less/base/combo/combo.textvalue.less
deleted file mode 100644
index 1feec1972..000000000
--- a/src/less/base/combo/combo.textvalue.less
+++ /dev/null
@@ -1,14 +0,0 @@
-@import "../../index.less";
-
-.bi-text-value-combo {
- &.combo-error {
- & .bi-select-text-trigger {
- & .select-text-label {
- color: @color-bi-text-error-hover-text-value-combo;
- }
- }
- &.bi-border, &.bi-border-bottom {
- border-color: @border-color-negative;
- }
- }
-}
\ No newline at end of file
diff --git a/src/less/base/trigger/trigger.text.less b/src/less/base/trigger/trigger.text.less
new file mode 100644
index 000000000..9e2040512
--- /dev/null
+++ b/src/less/base/trigger/trigger.text.less
@@ -0,0 +1,11 @@
+@import "../../index.less";
+
+.bi-text-trigger {
+ &.error .select-text-label {
+ color: @color-bi-text-error-text-trigger;
+ }
+
+ &:where(:not(&:hover)) .clear-button {
+ display: none;
+ }
+}
diff --git a/src/less/lib/theme.less b/src/less/lib/theme.less
index db42c9ef4..3c85b8031 100644
--- a/src/less/lib/theme.less
+++ b/src/less/lib/theme.less
@@ -179,6 +179,7 @@
@color-bi-border-hover-text-value-down-list-combo: @color-bi-border-highlight;
@color-bi-border-hover-text-value-check-combo: @color-bi-border-highlight;
@color-bi-text-error-hover-text-value-combo: @color-bi-text-failure;
+@color-bi-text-error-text-trigger: @color-bi-text-failure;
@color-bi-text-error-hover-text-value-icon-combo: @color-bi-text-failure;
@color-bi-text-error-hover-search-text-value-combo: @color-bi-text-failure;
@color-bi-background-bubble-combo-triangle: @color-bi-background-default;
diff --git a/src/widget/selecttree/selecttree.combo.js b/src/widget/selecttree/selecttree.combo.js
index 98c542686..c6aca0c62 100644
--- a/src/widget/selecttree/selecttree.combo.js
+++ b/src/widget/selecttree/selecttree.combo.js
@@ -11,6 +11,7 @@ BI.SelectTreeCombo = BI.inherit(BI.Widget, {
text: "",
items: [],
value: "",
+ allowClear: false,
});
},
@@ -25,7 +26,13 @@ BI.SelectTreeCombo = BI.inherit(BI.Widget, {
text: o.text,
height: o.height,
items: o.items,
- value: o.value
+ value: o.value,
+ allowClear: o.allowClear,
+ warningTitle: o.warningTitle,
+ });
+
+ this.trigger.on(BI.SingleTreeTrigger.EVENT_CLEAR, function () {
+ self._clear();
});
this.popup = BI.createWidget({
@@ -53,12 +60,43 @@ BI.SelectTreeCombo = BI.inherit(BI.Widget, {
self.setValue(self.popup.getValue());
self.combo.hideView();
});
+
+ if (BI.isKey(o.value)) {
+ this._checkError(o.value);
+ }
+ },
+
+ _checkError: function (v) {
+ if (BI.isNull(v) || BI.isEmptyArray(v) || BI.isEmptyString(v)) {
+ this.trigger.options.tipType = "success";
+ this.trigger.element.removeClass("error");
+ this.element.removeClass("error");
+ } else {
+ v = BI.isArray(v) ? v : [v];
+ var result = BI.find(this.options.items, function (idx, item) {
+ return BI.contains(v, item.value);
+ });
+ if (BI.isNull(result)) {
+ this.trigger.setTipType("warning");
+ this.element.removeClass("error").addClass("error");
+ this.trigger.element.removeClass("error").addClass("error");
+ } else {
+ this.trigger.setTipType("success");
+ this.trigger.element.removeClass("error");
+ this.element.removeClass("error");
+ }
+ }
+ },
+
+ _clear: function () {
+ this.setValue([]);
},
setValue: function (v) {
v = BI.isArray(v) ? v : [v];
this.trigger.setValue(v);
this.popup.setValue(v);
+ this._checkError(v);
},
getValue: function () {
@@ -71,4 +109,4 @@ BI.SelectTreeCombo = BI.inherit(BI.Widget, {
});
-BI.shortcut("bi.select_tree_combo", BI.SelectTreeCombo);
\ No newline at end of file
+BI.shortcut("bi.select_tree_combo", BI.SelectTreeCombo);
diff --git a/src/widget/singletree/singletree.combo.js b/src/widget/singletree/singletree.combo.js
index ce6d255d4..32d39d338 100644
--- a/src/widget/singletree/singletree.combo.js
+++ b/src/widget/singletree/singletree.combo.js
@@ -12,6 +12,7 @@ BI.SingleTreeCombo = BI.inherit(BI.Widget, {
text: "",
items: [],
value: "",
+ allowClear: false,
});
},
@@ -26,9 +27,15 @@ BI.SingleTreeCombo = BI.inherit(BI.Widget, {
text: o.text,
height: o.height,
items: o.items,
- value: o.value
+ value: o.value,
+ allowClear: o.allowClear,
+ warningTitle: o.warningTitle,
}, o.trigger));
+ this.trigger.on(BI.SingleTreeTrigger.EVENT_CLEAR, function () {
+ self._clear();
+ });
+
this.popup = BI.createWidget({
type: "bi.single_level_tree",
items: o.items,
@@ -58,6 +65,36 @@ BI.SingleTreeCombo = BI.inherit(BI.Widget, {
self.combo.hideView();
self.fireEvent(BI.SingleTreeCombo.EVENT_CHANGE);
});
+
+ if (BI.isKey(o.value)) {
+ this._checkError(o.value);
+ }
+ },
+
+ _checkError: function (v) {
+ if (BI.isNull(v) || BI.isEmptyArray(v) || BI.isEmptyString(v)) {
+ this.trigger.options.tipType = "success";
+ this.trigger.element.removeClass("error");
+ this.element.removeClass("error");
+ } else {
+ v = BI.isArray(v) ? v : [v];
+ var result = BI.find(this.options.items, function (idx, item) {
+ return BI.contains(v, item.value);
+ });
+ if (BI.isNull(result)) {
+ this.trigger.setTipType("warning");
+ this.element.removeClass("error").addClass("error");
+ this.trigger.element.removeClass("error").addClass("error");
+ } else {
+ this.trigger.setTipType("success");
+ this.trigger.element.removeClass("error");
+ this.element.removeClass("error");
+ }
+ }
+ },
+
+ _clear: function () {
+ this.setValue([]);
},
populate: function (items) {
@@ -68,6 +105,7 @@ BI.SingleTreeCombo = BI.inherit(BI.Widget, {
v = BI.isArray(v) ? v : [v];
this.trigger.setValue(v);
this.popup.setValue(v);
+ this._checkError(v);
},
getValue: function () {
@@ -77,4 +115,4 @@ BI.SingleTreeCombo = BI.inherit(BI.Widget, {
BI.SingleTreeCombo.EVENT_CHANGE = "EVENT_CHANGE";
BI.SingleTreeCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
-BI.shortcut("bi.single_tree_combo", BI.SingleTreeCombo);
\ No newline at end of file
+BI.shortcut("bi.single_tree_combo", BI.SingleTreeCombo);
diff --git a/src/widget/singletree/singletree.trigger.js b/src/widget/singletree/singletree.trigger.js
index 91183c033..d8dd3f69c 100644
--- a/src/widget/singletree/singletree.trigger.js
+++ b/src/widget/singletree/singletree.trigger.js
@@ -11,7 +11,8 @@ BI.SingleTreeTrigger = BI.inherit(BI.Trigger, {
height: 24,
text: "",
items: [],
- value: ""
+ value: "",
+ allowClear: false,
});
},
@@ -26,7 +27,17 @@ BI.SingleTreeTrigger = BI.inherit(BI.Trigger, {
text: o.text,
items: o.items,
height: o.height,
- value: o.value
+ warningTitle: o.warningTitle,
+ value: o.value,
+ allowClear: o.allowClear,
+ listeners: [
+ {
+ eventName: BI.SelectTextTrigger.EVENT_CLEAR,
+ action: function () {
+ self.fireEvent(BI.SingleTreeTrigger.EVENT_CLEAR);
+ }
+ }
+ ]
});
},
@@ -47,11 +58,15 @@ BI.SingleTreeTrigger = BI.inherit(BI.Trigger, {
this._checkTitle();
},
+ setTipType: function (v) {
+ this.trigger.setTipType(v);
+ },
+
getValue: function () {
return this.options.value || [];
},
- getTextor: function() {
+ getTextor: function () {
return this.trigger.getTextor();
},
@@ -61,4 +76,5 @@ BI.SingleTreeTrigger = BI.inherit(BI.Trigger, {
});
+BI.SingleTreeTrigger.EVENT_CLEAR = "EVENT_CLEAR";
BI.shortcut("bi.single_tree_trigger", BI.SingleTreeTrigger);