From 18efc094f2435e582caf4fe44eeea50025d14871 Mon Sep 17 00:00:00 2001 From: windy <1374721899@qq.com> Date: Wed, 8 May 2019 09:22:09 +0800 Subject: [PATCH 1/7] =?UTF-8?q?=E5=88=9D=E6=AD=A5=E8=AF=95=E6=8E=A2?= =?UTF-8?q?=E4=B8=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../trigger/editor.block.multiselect.js | 113 ++++++++++++++++++ 1 file changed, 113 insertions(+) create mode 100644 src/widget/multiselect/trigger/editor.block.multiselect.js diff --git a/src/widget/multiselect/trigger/editor.block.multiselect.js b/src/widget/multiselect/trigger/editor.block.multiselect.js new file mode 100644 index 000000000..1f42f8d36 --- /dev/null +++ b/src/widget/multiselect/trigger/editor.block.multiselect.js @@ -0,0 +1,113 @@ +/** + * 多选输入框, 选中项将会以块状形式出现, 可以在触发器中删除item + * @author windy + * @class BI.MultiSelectBlockEditor + * @extends Widget + */ +BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { + + props: { + baseCls: "bi-multi-select-editor", + el: {} + }, + + render: function () { + return { + type: "bi.htape", + items: [{ + type: "bi.vertical_adapt", + items: [], + width: 24 + }, { + el: { + type: "bi.editor" + }, + + }] + }; + }, + + mounted: function () { + this._checkSize(); + }, + + getBlockSize: function() { + // return BI.redu + }, + + _checkSize: function () { + this.comboWrapper.attr("items")[0].width = o.height; + this.comboWrapper.resize(); + }, + + _init: function () { + BI.MultiSelectBlockEditor.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.editor = BI.createWidget(o.el, { + type: "bi.state_editor", + element: this, + height: o.height, + watermark: BI.i18nText("BI-Basic_Search"), + allowBlank: true, + value: o.value, + text: o.text, + tipType: o.tipType, + warningTitle: o.warningTitle, + }); + + this.editor.on(BI.Controller.EVENT_CHANGE, function () { + self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); + }); + + this.editor.on(BI.StateEditor.EVENT_PAUSE, function () { + self.fireEvent(BI.MultiSelectBlockEditor.EVENT_PAUSE); + }); + this.editor.on(BI.StateEditor.EVENT_CLICK_LABEL, function () { + + }); + }, + + focus: function () { + this.editor.focus(); + }, + + blur: function () { + this.editor.blur(); + }, + + setState: function (state) { + this.editor.setState(state); + }, + + setValue: function (v) { + this.editor.setValue(v); + }, + + setTipType: function (v) { + this.editor.setTipType(v); + }, + + getValue: function () { + var v = this.editor.getState(); + if (BI.isArray(v) && v.length > 0) { + return v[v.length - 1]; + } + return ""; + + }, + + getKeywords: function () { + var val = this.editor.getLastValidValue(); + var keywords = val.match(/[\S]+/g); + if (BI.isEndWithBlank(val)) { + return keywords.concat([" "]); + } + return keywords; + }, + + populate: function (items) { + + } +}); +BI.MultiSelectBlockEditor.EVENT_PAUSE = "MultiSelectBlockEditor.EVENT_PAUSE"; +BI.shortcut("bi.multi_select_block_editor", BI.MultiSelectBlockEditor); From d59f7419fa9884d57bf2596459ec757783002bbb Mon Sep 17 00:00:00 2001 From: windy <1374721899@qq.com> Date: Thu, 9 May 2019 11:09:21 +0800 Subject: [PATCH 2/7] =?UTF-8?q?trigger=E5=B0=9D=E8=AF=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/css/widget/multiselect/trigger/editor.css | 7 ++ .../trigger/editor.block.multiselect.less | 12 +++ .../trigger/editor.block.multiselect.js | 96 ++++++++----------- .../trigger/searcher.list.multi.tree.js | 47 ++++----- 4 files changed, 85 insertions(+), 77 deletions(-) create mode 100644 src/css/widget/multiselect/trigger/editor.css create mode 100644 src/less/widget/multiselect/trigger/editor.block.multiselect.less diff --git a/src/css/widget/multiselect/trigger/editor.css b/src/css/widget/multiselect/trigger/editor.css new file mode 100644 index 000000000..0e02317b1 --- /dev/null +++ b/src/css/widget/multiselect/trigger/editor.css @@ -0,0 +1,7 @@ +.bi-multi-select-block-editor .label-wrapper .label-item { + background-color: rgba(54, 133, 242, 0.06); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0f3685f2,endColorstr=#0f3685f2); +} +.bi-multi-select-block-editor .search-editor { + min-width: 40px; +} diff --git a/src/less/widget/multiselect/trigger/editor.block.multiselect.less b/src/less/widget/multiselect/trigger/editor.block.multiselect.less new file mode 100644 index 000000000..4927905f3 --- /dev/null +++ b/src/less/widget/multiselect/trigger/editor.block.multiselect.less @@ -0,0 +1,12 @@ +@import "../../../index"; + +.bi-multi-select-block-editor { + & .label-wrapper { + & .label-item { + .background-color(@color-bi-background-highlight, 6%); + } + } + & .search-editor { + min-width: 40px; + } +} \ No newline at end of file diff --git a/src/widget/multiselect/trigger/editor.block.multiselect.js b/src/widget/multiselect/trigger/editor.block.multiselect.js index 1f42f8d36..ef42a98e0 100644 --- a/src/widget/multiselect/trigger/editor.block.multiselect.js +++ b/src/widget/multiselect/trigger/editor.block.multiselect.js @@ -7,66 +7,49 @@ BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { props: { - baseCls: "bi-multi-select-editor", + baseCls: "bi-multi-select-block-editor", el: {} }, render: function () { + var self = this; return { - type: "bi.htape", + type: "bi.inline_vertical_adapt", + scrollx: false, items: [{ - type: "bi.vertical_adapt", - items: [], - width: 24 - }, { el: { - type: "bi.editor" + type: "bi.inline_vertical_adapt", + tagName: "ul", + cls: "label-wrapper", + ref: function (_ref) { + self.labelWrapper = _ref; + }, + items: [], + hgap: 5 + } + }, { + type: "bi.sign_editor", + allowBlank: true, + cls: "search-editor", + ref: function (_ref) { + self.editor = _ref; }, - + listeners: [{ + eventName: BI.Controller.EVENT_CHANGE, + action: function () { + self.fireEvent(BI.Controller.EVENT_CHANGE); + } + }, { + eventName: BI.Editor.EVENT_PAUSE, + action: function () { + self.fireEvent(BI.MultiSelectBlockEditor.EVENT_PAUSE); + } + }], + height: 22 }] }; }, - mounted: function () { - this._checkSize(); - }, - - getBlockSize: function() { - // return BI.redu - }, - - _checkSize: function () { - this.comboWrapper.attr("items")[0].width = o.height; - this.comboWrapper.resize(); - }, - - _init: function () { - BI.MultiSelectBlockEditor.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.editor = BI.createWidget(o.el, { - type: "bi.state_editor", - element: this, - height: o.height, - watermark: BI.i18nText("BI-Basic_Search"), - allowBlank: true, - value: o.value, - text: o.text, - tipType: o.tipType, - warningTitle: o.warningTitle, - }); - - this.editor.on(BI.Controller.EVENT_CHANGE, function () { - self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); - }); - - this.editor.on(BI.StateEditor.EVENT_PAUSE, function () { - self.fireEvent(BI.MultiSelectBlockEditor.EVENT_PAUSE); - }); - this.editor.on(BI.StateEditor.EVENT_CLICK_LABEL, function () { - - }); - }, - focus: function () { this.editor.focus(); }, @@ -76,24 +59,29 @@ BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { }, setState: function (state) { - this.editor.setState(state); + var values = BI.map(state, function (idx, path) { + return BI.last(path); + }); + this.labelWrapper.populate(BI.map(values, function (idx, value) { + return { + type: "bi.text_button", + tagName: "li", + cls: "bi-border-radius bi-list-item-select label-item", + text: value + }; + })); }, setValue: function (v) { this.editor.setValue(v); }, - setTipType: function (v) { - this.editor.setTipType(v); - }, - getValue: function () { var v = this.editor.getState(); if (BI.isArray(v) && v.length > 0) { return v[v.length - 1]; } return ""; - }, getKeywords: function () { diff --git a/src/widget/multitree/trigger/searcher.list.multi.tree.js b/src/widget/multitree/trigger/searcher.list.multi.tree.js index acfe1cf45..dbbd48625 100644 --- a/src/widget/multitree/trigger/searcher.list.multi.tree.js +++ b/src/widget/multitree/trigger/searcher.list.multi.tree.js @@ -24,7 +24,7 @@ BI.MultiListTreeSearcher = BI.inherit(BI.Widget, { BI.MultiListTreeSearcher.superclass._init.apply(this, arguments); var self = this, o = this.options; this.editor = BI.createWidget({ - type: "bi.multi_select_editor", + type: "bi.multi_select_block_editor", height: o.height, el: { type: "bi.simple_state_editor", @@ -108,28 +108,29 @@ BI.MultiListTreeSearcher = BI.inherit(BI.Widget, { }, setState: function (ob) { - var o = this.options; - ob || (ob = {}); - ob.value || (ob.value = []); - var count = 0; - if (BI.isNumber(ob)) { - this.editor.setState(ob); - } else if (BI.size(ob.value) === 0) { - this.editor.setState(BI.Selection.None); - } else { - var text = ""; - BI.each(ob.value, function (idx, path) { - var childValue = BI.last(path); - text += (o.valueFormatter(childValue + "") || childValue) + "; "; - count++; - }); - - if (count > 20) { - this.editor.setState(BI.Selection.Multi); - } else { - this.editor.setState(text); - } - } + // var o = this.options; + // ob || (ob = {}); + // ob.value || (ob.value = []); + // var count = 0; + // if (BI.isNumber(ob)) { + // this.editor.setState(ob); + // } else if (BI.size(ob.value) === 0) { + // this.editor.setState(BI.Selection.None); + // } else { + // var text = ""; + // BI.each(ob.value, function (idx, path) { + // var childValue = BI.last(path); + // text += (o.valueFormatter(childValue + "") || childValue) + "; "; + // count++; + // }); + // + // if (count > 20) { + // this.editor.setState(BI.Selection.Multi); + // } else { + // this.editor.setState(text); + // } + // } + this.editor.setState(ob.value); }, setValue: function (ob) { From 33b2a502933e28fce4c305fcfc515ab86c23ed9a Mon Sep 17 00:00:00 2001 From: windy <1374721899@qq.com> Date: Wed, 15 May 2019 11:48:41 +0800 Subject: [PATCH 3/7] =?UTF-8?q?feat:=20=E6=8F=90=E4=BA=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../component/demo.treevaluechoosercombo.js | 16 ++++++++-- src/base/single/input/input.js | 2 +- src/css/widget/multiselect/trigger/editor.css | 2 +- .../trigger/editor.block.multiselect.less | 2 +- .../trigger/editor.block.multiselect.js | 32 +++++++++++++++++-- .../trigger/searcher.list.multi.tree.js | 8 ++++- 6 files changed, 53 insertions(+), 9 deletions(-) diff --git a/demo/js/component/demo.treevaluechoosercombo.js b/demo/js/component/demo.treevaluechoosercombo.js index 8fa557ee1..e104e9eda 100644 --- a/demo/js/component/demo.treevaluechoosercombo.js +++ b/demo/js/component/demo.treevaluechoosercombo.js @@ -4,8 +4,8 @@ Demo.TreeValueChooser = BI.inherit(BI.Widget, { }, render: function () { - var widget = BI.createWidget({ - type: "bi.tree_value_chooser_combo", + this.widget = BI.createWidget({ + type: "bi.list_tree_value_chooser_insert_combo", width: 300, // items: BI.deepClone(Demo.CONSTANTS.TREEITEMS), itemsCreator: function (op, callback) { @@ -16,8 +16,18 @@ Demo.TreeValueChooser = BI.inherit(BI.Widget, { type: "bi.vertical", hgap: 200, vgap: 10, - items: [widget] + items: [this.widget] }; + }, + + mounted: function () { + this.widget.setValue([ + ["中国", "安徽省"], + ["中国", "澳门特别行政区"], + ["中国", "北京市"], + ["中国", "福建省"], + ["中国", "甘肃省"] + ]); } }); BI.shortcut("demo.tree_value_chooser_combo", Demo.TreeValueChooser); diff --git a/src/base/single/input/input.js b/src/base/single/input/input.js index bf301e15f..cd7e8c78c 100644 --- a/src/base/single/input/input.js +++ b/src/base/single/input/input.js @@ -164,7 +164,7 @@ BI.Input = BI.inherit(BI.Single, { this.fireEvent(BI.Input.EVENT_BACKSPACE); } } - this.fireEvent(BI.Input.EVENT_KEY_DOWN); + this.fireEvent(BI.Input.EVENT_KEY_DOWN, keyCode); if (BI.isEndWithBlank(this.getValue())) { this._pause = true; diff --git a/src/css/widget/multiselect/trigger/editor.css b/src/css/widget/multiselect/trigger/editor.css index 0e02317b1..35572c150 100644 --- a/src/css/widget/multiselect/trigger/editor.css +++ b/src/css/widget/multiselect/trigger/editor.css @@ -3,5 +3,5 @@ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0f3685f2,endColorstr=#0f3685f2); } .bi-multi-select-block-editor .search-editor { - min-width: 40px; + min-width: 25px; } diff --git a/src/less/widget/multiselect/trigger/editor.block.multiselect.less b/src/less/widget/multiselect/trigger/editor.block.multiselect.less index 4927905f3..c7383d3f2 100644 --- a/src/less/widget/multiselect/trigger/editor.block.multiselect.less +++ b/src/less/widget/multiselect/trigger/editor.block.multiselect.less @@ -7,6 +7,6 @@ } } & .search-editor { - min-width: 40px; + min-width: 25px; } } \ No newline at end of file diff --git a/src/widget/multiselect/trigger/editor.block.multiselect.js b/src/widget/multiselect/trigger/editor.block.multiselect.js index ef42a98e0..ba00f6291 100644 --- a/src/widget/multiselect/trigger/editor.block.multiselect.js +++ b/src/widget/multiselect/trigger/editor.block.multiselect.js @@ -19,6 +19,7 @@ BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { items: [{ el: { type: "bi.inline_vertical_adapt", + scrollable: false, tagName: "ul", cls: "label-wrapper", ref: function (_ref) { @@ -40,16 +41,38 @@ BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { self.fireEvent(BI.Controller.EVENT_CHANGE); } }, { - eventName: BI.Editor.EVENT_PAUSE, + eventName: BI.SignEditor.EVENT_PAUSE, action: function () { self.fireEvent(BI.MultiSelectBlockEditor.EVENT_PAUSE); } + }, { + eventName: BI.SignEditor.EVENT_STOP, + action: function () { + self.fireEvent(BI.MultiSelectBlockEditor.EVENT_STOP); + } + }, { + eventName: BI.SignEditor.EVENT_KEY_DOWN, + action: function (keyCode) { + // if(keyCode === ) { + // + // } + self.fireEvent(BI.MultiSelectBlockEditor.EVENT_KEY_DOWN); + } }], height: 22 }] }; }, + _checkPosition: function () { + var width = this.element.width(); + var blockRegionWidth = width - 25 > 0 ? width - 25 : 0; + var blockWrapWidth = this.labelWrapper.element.width(); + if (blockRegionWidth < blockWrapWidth) { + this.labelWrapper.element.width(blockRegionWidth); + } + }, + focus: function () { this.editor.focus(); }, @@ -59,6 +82,7 @@ BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { }, setState: function (state) { + var self = this; var values = BI.map(state, function (idx, path) { return BI.last(path); }); @@ -70,6 +94,9 @@ BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { text: value }; })); + BI.defer(function () { + self._checkPosition(); + }); }, setValue: function (v) { @@ -97,5 +124,6 @@ BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { } }); -BI.MultiSelectBlockEditor.EVENT_PAUSE = "MultiSelectBlockEditor.EVENT_PAUSE"; +BI.MultiSelectBlockEditor.EVENT_PAUSE = "EVENT_PAUSE"; +BI.MultiSelectBlockEditor.EVENT_STOP = "EVENT_STOP"; BI.shortcut("bi.multi_select_block_editor", BI.MultiSelectBlockEditor); diff --git a/src/widget/multitree/trigger/searcher.list.multi.tree.js b/src/widget/multitree/trigger/searcher.list.multi.tree.js index dbbd48625..8ddcffb52 100644 --- a/src/widget/multitree/trigger/searcher.list.multi.tree.js +++ b/src/widget/multitree/trigger/searcher.list.multi.tree.js @@ -29,7 +29,13 @@ BI.MultiListTreeSearcher = BI.inherit(BI.Widget, { el: { type: "bi.simple_state_editor", height: o.height - } + }, + listeners: [{ + eventName: BI.MultiSelectBlockEditor.EVENT_STOP, + action: function (v) { + self.fireEvent(BI.MultiListTreeSearcher.EVENT_REMOVE, v); + } + }] }); this.searcher = BI.createWidget({ From 720f711828ac3f5b0640d1b6d3cb609215b9b16d Mon Sep 17 00:00:00 2001 From: windy <1374721899@qq.com> Date: Thu, 16 May 2019 17:28:50 +0800 Subject: [PATCH 4/7] =?UTF-8?q?feat:=20=E6=B5=8B=E8=AF=95=E5=88=A0?= =?UTF-8?q?=E9=99=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../trigger/editor.block.multiselect.js | 102 +++++++++++++++--- .../trigger/searcher.list.multi.tree.js | 1 + 2 files changed, 86 insertions(+), 17 deletions(-) diff --git a/src/widget/multiselect/trigger/editor.block.multiselect.js b/src/widget/multiselect/trigger/editor.block.multiselect.js index ba00f6291..d884fc564 100644 --- a/src/widget/multiselect/trigger/editor.block.multiselect.js +++ b/src/widget/multiselect/trigger/editor.block.multiselect.js @@ -8,7 +8,10 @@ BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { props: { baseCls: "bi-multi-select-block-editor", - el: {} + el: {}, + valueFormatter: function (v) { + return v; + } }, render: function () { @@ -17,17 +20,25 @@ BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { type: "bi.inline_vertical_adapt", scrollx: false, items: [{ - el: { + type: "bi.button_group", + cls: "label-wrapper", + ref: function (_ref) { + self.labelWrapper = _ref; + }, + items: [], + layouts: [{ type: "bi.inline_vertical_adapt", scrollable: false, tagName: "ul", - cls: "label-wrapper", - ref: function (_ref) { - self.labelWrapper = _ref; - }, - items: [], hgap: 5 - } + }], + listeners: [{ + eventName: BI.ButtonGroup.EVENT_CHANGE, + action: function () { + self.selection = this.getIndexByValue(this.getValue()[0]); + self._bindKeyDownEvent(); + } + }] }, { type: "bi.sign_editor", allowBlank: true, @@ -51,12 +62,14 @@ BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { self.fireEvent(BI.MultiSelectBlockEditor.EVENT_STOP); } }, { - eventName: BI.SignEditor.EVENT_KEY_DOWN, - action: function (keyCode) { - // if(keyCode === ) { - // - // } - self.fireEvent(BI.MultiSelectBlockEditor.EVENT_KEY_DOWN); + eventName: BI.SignEditor.EVENT_FOCUS, + action: function () { + // self._bindKeyDownEvent(); + } + }, { + eventName: BI.SignEditor.EVENT_BLUR, + action: function () { + self._unbindKeyDownEvent(); } }], height: 22 @@ -64,6 +77,56 @@ BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { }; }, + _bindKeyDownEvent: function () { + console.log("bind"); + BI.Widget._renderEngine.createElement(document).unbind("keydown." + this.getName()); + BI.Widget._renderEngine.createElement(document).bind("keydown." + this.getName(), BI.bind(this._dealBlockByKey, this)); + }, + + _unbindKeyDownEvent: function () { + console.log("unbind"); + BI.Widget._renderEngine.createElement(document).unbind("keydown." + this.getName()); + }, + + _dealBlockByKey: function (e) { + switch (e.keyCode) { + case BI.KeyCode.LEFT: + this._selectBlock(-1); + break; + case BI.KeyCode.RIGHT: + this._selectBlock(1); + break; + case BI.KeyCode.BACKSPACE: + case BI.KeyCode.DELETE: + !this.editor.isEditing() && this._deleteBlock(); + break; + default: + break; + } + }, + + _deleteBlock: function () { + this.fireEvent(BI.MultiSelectBlockEditor.EVENT_DELETE); + }, + + _selectBlock: function (direction) { + var self = this; + var length = this._getBlocksLength(); + if (length === 0) { + this.selection = null; + } else { + this.selection = BI.clamp(BI.isNull(this.selection) ? length - 1 : this.selection + direction, 0, length - 1); + } + var button = BI.find(this.labelWrapper.getAllButtons(), function (idx) { + return idx === self.selection; + }); + BI.isNotNull(button) && this.labelWrapper.setValue(button.getValue()); + }, + + _getBlocksLength: function () { + return this.labelWrapper.getAllButtons().length; + }, + _checkPosition: function () { var width = this.element.width(); var blockRegionWidth = width - 25 > 0 ? width - 25 : 0; @@ -82,7 +145,9 @@ BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { }, setState: function (state) { - var self = this; + var self = this, o = this.options; + this.selection = null; + this.editor.isEditing() ? this._bindKeyDownEvent() : this._unbindKeyDownEvent(); var values = BI.map(state, function (idx, path) { return BI.last(path); }); @@ -90,8 +155,10 @@ BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { return { type: "bi.text_button", tagName: "li", - cls: "bi-border-radius bi-list-item-select label-item", - text: value + cls: "bi-border-radius bi-list-item-select", + text: o.valueFormatter(value), + value: value, + stopPropagation: true }; })); BI.defer(function () { @@ -126,4 +193,5 @@ BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { }); BI.MultiSelectBlockEditor.EVENT_PAUSE = "EVENT_PAUSE"; BI.MultiSelectBlockEditor.EVENT_STOP = "EVENT_STOP"; +BI.MultiSelectBlockEditor.EVENT_DELETE = "EVENT_DELETE"; BI.shortcut("bi.multi_select_block_editor", BI.MultiSelectBlockEditor); diff --git a/src/widget/multitree/trigger/searcher.list.multi.tree.js b/src/widget/multitree/trigger/searcher.list.multi.tree.js index 8ddcffb52..4cd242909 100644 --- a/src/widget/multitree/trigger/searcher.list.multi.tree.js +++ b/src/widget/multitree/trigger/searcher.list.multi.tree.js @@ -25,6 +25,7 @@ BI.MultiListTreeSearcher = BI.inherit(BI.Widget, { var self = this, o = this.options; this.editor = BI.createWidget({ type: "bi.multi_select_block_editor", + valueFormatter: o.valueFormatter, height: o.height, el: { type: "bi.simple_state_editor", From 22a1a70e9990c113006218b71d203510aa15b252 Mon Sep 17 00:00:00 2001 From: windy <1374721899@qq.com> Date: Mon, 20 May 2019 16:50:17 +0800 Subject: [PATCH 5/7] =?UTF-8?q?=E6=97=A0JIRA=E4=BB=BB=E5=8A=A1=20fix:=20?= =?UTF-8?q?=E5=A4=9A=E8=A1=8Ctitle=E5=8F=AA=E6=98=BE=E7=A4=BA=E4=B8=80?= =?UTF-8?q?=E9=83=A8=E5=88=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/base/single/tip/tip.js | 2 +- src/base/single/tip/tip.tooltip.js | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/base/single/tip/tip.js b/src/base/single/tip/tip.js index 75e7f7d06..c792b91b3 100644 --- a/src/base/single/tip/tip.js +++ b/src/base/single/tip/tip.js @@ -8,7 +8,7 @@ */ BI.Tip = BI.inherit(BI.Single, { _defaultConfig: function () { - var conf = BI.Link.superclass._defaultConfig.apply(this, arguments); + var conf = BI.Tip.superclass._defaultConfig.apply(this, arguments); return BI.extend(conf, { _baseCls: (conf._baseCls || "") + " bi-tip", zIndex: BI.zIndex_tip diff --git a/src/base/single/tip/tip.tooltip.js b/src/base/single/tip/tip.tooltip.js index f319d12d5..22c72ace0 100644 --- a/src/base/single/tip/tip.tooltip.js +++ b/src/base/single/tip/tip.tooltip.js @@ -47,22 +47,22 @@ BI.Tooltip = BI.inherit(BI.Tip, { hgap: this._const.hgap, items: BI.map(texts, function (i, text) { return { - type: "bi.label", + type: "bi.text", textAlign: "left", whiteSpace: "normal", text: text, - textHeight: 18 + height: 18 }; }) }); } else { this.text = BI.createWidget({ - type: "bi.label", + type: "bi.text", element: this, textAlign: "left", whiteSpace: "normal", text: o.text, - textHeight: 16, + height: 16, hgap: this._const.hgap }); } From 8f5461666799c5d5d36f320ed5ca89af74e994ca Mon Sep 17 00:00:00 2001 From: windy <1374721899@qq.com> Date: Mon, 20 May 2019 17:26:50 +0800 Subject: [PATCH 6/7] revert --- .../component/demo.treevaluechoosercombo.js | 16 +- src/base/single/input/input.js | 2 +- .../trigger/editor.block.multiselect.less | 12 -- .../trigger/editor.block.multiselect.js | 197 ------------------ .../trigger/searcher.list.multi.tree.js | 56 +++-- 5 files changed, 28 insertions(+), 255 deletions(-) delete mode 100644 src/less/widget/multiselect/trigger/editor.block.multiselect.less delete mode 100644 src/widget/multiselect/trigger/editor.block.multiselect.js diff --git a/demo/js/component/demo.treevaluechoosercombo.js b/demo/js/component/demo.treevaluechoosercombo.js index e104e9eda..8fa557ee1 100644 --- a/demo/js/component/demo.treevaluechoosercombo.js +++ b/demo/js/component/demo.treevaluechoosercombo.js @@ -4,8 +4,8 @@ Demo.TreeValueChooser = BI.inherit(BI.Widget, { }, render: function () { - this.widget = BI.createWidget({ - type: "bi.list_tree_value_chooser_insert_combo", + var widget = BI.createWidget({ + type: "bi.tree_value_chooser_combo", width: 300, // items: BI.deepClone(Demo.CONSTANTS.TREEITEMS), itemsCreator: function (op, callback) { @@ -16,18 +16,8 @@ Demo.TreeValueChooser = BI.inherit(BI.Widget, { type: "bi.vertical", hgap: 200, vgap: 10, - items: [this.widget] + items: [widget] }; - }, - - mounted: function () { - this.widget.setValue([ - ["中国", "安徽省"], - ["中国", "澳门特别行政区"], - ["中国", "北京市"], - ["中国", "福建省"], - ["中国", "甘肃省"] - ]); } }); BI.shortcut("demo.tree_value_chooser_combo", Demo.TreeValueChooser); diff --git a/src/base/single/input/input.js b/src/base/single/input/input.js index e544b5bf6..4cf79ae89 100644 --- a/src/base/single/input/input.js +++ b/src/base/single/input/input.js @@ -168,7 +168,7 @@ BI.Input = BI.inherit(BI.Single, { this.fireEvent(BI.Input.EVENT_BACKSPACE); } } - this.fireEvent(BI.Input.EVENT_KEY_DOWN, keyCode); + this.fireEvent(BI.Input.EVENT_KEY_DOWN); if (BI.isEndWithBlank(this.getValue())) { this._pause = true; diff --git a/src/less/widget/multiselect/trigger/editor.block.multiselect.less b/src/less/widget/multiselect/trigger/editor.block.multiselect.less deleted file mode 100644 index c7383d3f2..000000000 --- a/src/less/widget/multiselect/trigger/editor.block.multiselect.less +++ /dev/null @@ -1,12 +0,0 @@ -@import "../../../index"; - -.bi-multi-select-block-editor { - & .label-wrapper { - & .label-item { - .background-color(@color-bi-background-highlight, 6%); - } - } - & .search-editor { - min-width: 25px; - } -} \ No newline at end of file diff --git a/src/widget/multiselect/trigger/editor.block.multiselect.js b/src/widget/multiselect/trigger/editor.block.multiselect.js deleted file mode 100644 index d884fc564..000000000 --- a/src/widget/multiselect/trigger/editor.block.multiselect.js +++ /dev/null @@ -1,197 +0,0 @@ -/** - * 多选输入框, 选中项将会以块状形式出现, 可以在触发器中删除item - * @author windy - * @class BI.MultiSelectBlockEditor - * @extends Widget - */ -BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { - - props: { - baseCls: "bi-multi-select-block-editor", - el: {}, - valueFormatter: function (v) { - return v; - } - }, - - render: function () { - var self = this; - return { - type: "bi.inline_vertical_adapt", - scrollx: false, - items: [{ - type: "bi.button_group", - cls: "label-wrapper", - ref: function (_ref) { - self.labelWrapper = _ref; - }, - items: [], - layouts: [{ - type: "bi.inline_vertical_adapt", - scrollable: false, - tagName: "ul", - hgap: 5 - }], - listeners: [{ - eventName: BI.ButtonGroup.EVENT_CHANGE, - action: function () { - self.selection = this.getIndexByValue(this.getValue()[0]); - self._bindKeyDownEvent(); - } - }] - }, { - type: "bi.sign_editor", - allowBlank: true, - cls: "search-editor", - ref: function (_ref) { - self.editor = _ref; - }, - listeners: [{ - eventName: BI.Controller.EVENT_CHANGE, - action: function () { - self.fireEvent(BI.Controller.EVENT_CHANGE); - } - }, { - eventName: BI.SignEditor.EVENT_PAUSE, - action: function () { - self.fireEvent(BI.MultiSelectBlockEditor.EVENT_PAUSE); - } - }, { - eventName: BI.SignEditor.EVENT_STOP, - action: function () { - self.fireEvent(BI.MultiSelectBlockEditor.EVENT_STOP); - } - }, { - eventName: BI.SignEditor.EVENT_FOCUS, - action: function () { - // self._bindKeyDownEvent(); - } - }, { - eventName: BI.SignEditor.EVENT_BLUR, - action: function () { - self._unbindKeyDownEvent(); - } - }], - height: 22 - }] - }; - }, - - _bindKeyDownEvent: function () { - console.log("bind"); - BI.Widget._renderEngine.createElement(document).unbind("keydown." + this.getName()); - BI.Widget._renderEngine.createElement(document).bind("keydown." + this.getName(), BI.bind(this._dealBlockByKey, this)); - }, - - _unbindKeyDownEvent: function () { - console.log("unbind"); - BI.Widget._renderEngine.createElement(document).unbind("keydown." + this.getName()); - }, - - _dealBlockByKey: function (e) { - switch (e.keyCode) { - case BI.KeyCode.LEFT: - this._selectBlock(-1); - break; - case BI.KeyCode.RIGHT: - this._selectBlock(1); - break; - case BI.KeyCode.BACKSPACE: - case BI.KeyCode.DELETE: - !this.editor.isEditing() && this._deleteBlock(); - break; - default: - break; - } - }, - - _deleteBlock: function () { - this.fireEvent(BI.MultiSelectBlockEditor.EVENT_DELETE); - }, - - _selectBlock: function (direction) { - var self = this; - var length = this._getBlocksLength(); - if (length === 0) { - this.selection = null; - } else { - this.selection = BI.clamp(BI.isNull(this.selection) ? length - 1 : this.selection + direction, 0, length - 1); - } - var button = BI.find(this.labelWrapper.getAllButtons(), function (idx) { - return idx === self.selection; - }); - BI.isNotNull(button) && this.labelWrapper.setValue(button.getValue()); - }, - - _getBlocksLength: function () { - return this.labelWrapper.getAllButtons().length; - }, - - _checkPosition: function () { - var width = this.element.width(); - var blockRegionWidth = width - 25 > 0 ? width - 25 : 0; - var blockWrapWidth = this.labelWrapper.element.width(); - if (blockRegionWidth < blockWrapWidth) { - this.labelWrapper.element.width(blockRegionWidth); - } - }, - - focus: function () { - this.editor.focus(); - }, - - blur: function () { - this.editor.blur(); - }, - - setState: function (state) { - var self = this, o = this.options; - this.selection = null; - this.editor.isEditing() ? this._bindKeyDownEvent() : this._unbindKeyDownEvent(); - var values = BI.map(state, function (idx, path) { - return BI.last(path); - }); - this.labelWrapper.populate(BI.map(values, function (idx, value) { - return { - type: "bi.text_button", - tagName: "li", - cls: "bi-border-radius bi-list-item-select", - text: o.valueFormatter(value), - value: value, - stopPropagation: true - }; - })); - BI.defer(function () { - self._checkPosition(); - }); - }, - - setValue: function (v) { - this.editor.setValue(v); - }, - - getValue: function () { - var v = this.editor.getState(); - if (BI.isArray(v) && v.length > 0) { - return v[v.length - 1]; - } - return ""; - }, - - getKeywords: function () { - var val = this.editor.getLastValidValue(); - var keywords = val.match(/[\S]+/g); - if (BI.isEndWithBlank(val)) { - return keywords.concat([" "]); - } - return keywords; - }, - - populate: function (items) { - - } -}); -BI.MultiSelectBlockEditor.EVENT_PAUSE = "EVENT_PAUSE"; -BI.MultiSelectBlockEditor.EVENT_STOP = "EVENT_STOP"; -BI.MultiSelectBlockEditor.EVENT_DELETE = "EVENT_DELETE"; -BI.shortcut("bi.multi_select_block_editor", BI.MultiSelectBlockEditor); diff --git a/src/widget/multitree/trigger/searcher.list.multi.tree.js b/src/widget/multitree/trigger/searcher.list.multi.tree.js index 4cd242909..acfe1cf45 100644 --- a/src/widget/multitree/trigger/searcher.list.multi.tree.js +++ b/src/widget/multitree/trigger/searcher.list.multi.tree.js @@ -24,19 +24,12 @@ BI.MultiListTreeSearcher = BI.inherit(BI.Widget, { BI.MultiListTreeSearcher.superclass._init.apply(this, arguments); var self = this, o = this.options; this.editor = BI.createWidget({ - type: "bi.multi_select_block_editor", - valueFormatter: o.valueFormatter, + type: "bi.multi_select_editor", height: o.height, el: { type: "bi.simple_state_editor", height: o.height - }, - listeners: [{ - eventName: BI.MultiSelectBlockEditor.EVENT_STOP, - action: function (v) { - self.fireEvent(BI.MultiListTreeSearcher.EVENT_REMOVE, v); - } - }] + } }); this.searcher = BI.createWidget({ @@ -115,29 +108,28 @@ BI.MultiListTreeSearcher = BI.inherit(BI.Widget, { }, setState: function (ob) { - // var o = this.options; - // ob || (ob = {}); - // ob.value || (ob.value = []); - // var count = 0; - // if (BI.isNumber(ob)) { - // this.editor.setState(ob); - // } else if (BI.size(ob.value) === 0) { - // this.editor.setState(BI.Selection.None); - // } else { - // var text = ""; - // BI.each(ob.value, function (idx, path) { - // var childValue = BI.last(path); - // text += (o.valueFormatter(childValue + "") || childValue) + "; "; - // count++; - // }); - // - // if (count > 20) { - // this.editor.setState(BI.Selection.Multi); - // } else { - // this.editor.setState(text); - // } - // } - this.editor.setState(ob.value); + var o = this.options; + ob || (ob = {}); + ob.value || (ob.value = []); + var count = 0; + if (BI.isNumber(ob)) { + this.editor.setState(ob); + } else if (BI.size(ob.value) === 0) { + this.editor.setState(BI.Selection.None); + } else { + var text = ""; + BI.each(ob.value, function (idx, path) { + var childValue = BI.last(path); + text += (o.valueFormatter(childValue + "") || childValue) + "; "; + count++; + }); + + if (count > 20) { + this.editor.setState(BI.Selection.Multi); + } else { + this.editor.setState(text); + } + } }, setValue: function (ob) { From 040a6bb0f7c8d75576e36d33471836950061b897 Mon Sep 17 00:00:00 2001 From: windy <1374721899@qq.com> Date: Mon, 20 May 2019 17:27:56 +0800 Subject: [PATCH 7/7] revert --- src/css/widget/multiselect/trigger/editor.css | 7 ------- 1 file changed, 7 deletions(-) delete mode 100644 src/css/widget/multiselect/trigger/editor.css diff --git a/src/css/widget/multiselect/trigger/editor.css b/src/css/widget/multiselect/trigger/editor.css deleted file mode 100644 index 35572c150..000000000 --- a/src/css/widget/multiselect/trigger/editor.css +++ /dev/null @@ -1,7 +0,0 @@ -.bi-multi-select-block-editor .label-wrapper .label-item { - background-color: rgba(54, 133, 242, 0.06); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0f3685f2,endColorstr=#0f3685f2); -} -.bi-multi-select-block-editor .search-editor { - min-width: 25px; -}