Browse Source

trigger尝试

es6
windy 5 years ago
parent
commit
d59f7419fa
  1. 7
      src/css/widget/multiselect/trigger/editor.css
  2. 12
      src/less/widget/multiselect/trigger/editor.block.multiselect.less
  3. 96
      src/widget/multiselect/trigger/editor.block.multiselect.js
  4. 47
      src/widget/multitree/trigger/searcher.list.multi.tree.js

7
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;
}

12
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;
}
}

96
src/widget/multiselect/trigger/editor.block.multiselect.js

@ -7,66 +7,49 @@
BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, { BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, {
props: { props: {
baseCls: "bi-multi-select-editor", baseCls: "bi-multi-select-block-editor",
el: {} el: {}
}, },
render: function () { render: function () {
var self = this;
return { return {
type: "bi.htape", type: "bi.inline_vertical_adapt",
scrollx: false,
items: [{ items: [{
type: "bi.vertical_adapt",
items: [],
width: 24
}, {
el: { 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 () { focus: function () {
this.editor.focus(); this.editor.focus();
}, },
@ -76,24 +59,29 @@ BI.MultiSelectBlockEditor = BI.inherit(BI.Widget, {
}, },
setState: function (state) { 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) { setValue: function (v) {
this.editor.setValue(v); this.editor.setValue(v);
}, },
setTipType: function (v) {
this.editor.setTipType(v);
},
getValue: function () { getValue: function () {
var v = this.editor.getState(); var v = this.editor.getState();
if (BI.isArray(v) && v.length > 0) { if (BI.isArray(v) && v.length > 0) {
return v[v.length - 1]; return v[v.length - 1];
} }
return ""; return "";
}, },
getKeywords: function () { getKeywords: function () {

47
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); BI.MultiListTreeSearcher.superclass._init.apply(this, arguments);
var self = this, o = this.options; var self = this, o = this.options;
this.editor = BI.createWidget({ this.editor = BI.createWidget({
type: "bi.multi_select_editor", type: "bi.multi_select_block_editor",
height: o.height, height: o.height,
el: { el: {
type: "bi.simple_state_editor", type: "bi.simple_state_editor",
@ -108,28 +108,29 @@ BI.MultiListTreeSearcher = BI.inherit(BI.Widget, {
}, },
setState: function (ob) { setState: function (ob) {
var o = this.options; // var o = this.options;
ob || (ob = {}); // ob || (ob = {});
ob.value || (ob.value = []); // ob.value || (ob.value = []);
var count = 0; // var count = 0;
if (BI.isNumber(ob)) { // if (BI.isNumber(ob)) {
this.editor.setState(ob); // this.editor.setState(ob);
} else if (BI.size(ob.value) === 0) { // } else if (BI.size(ob.value) === 0) {
this.editor.setState(BI.Selection.None); // this.editor.setState(BI.Selection.None);
} else { // } else {
var text = ""; // var text = "";
BI.each(ob.value, function (idx, path) { // BI.each(ob.value, function (idx, path) {
var childValue = BI.last(path); // var childValue = BI.last(path);
text += (o.valueFormatter(childValue + "") || childValue) + "; "; // text += (o.valueFormatter(childValue + "") || childValue) + "; ";
count++; // count++;
}); // });
//
if (count > 20) { // if (count > 20) {
this.editor.setState(BI.Selection.Multi); // this.editor.setState(BI.Selection.Multi);
} else { // } else {
this.editor.setState(text); // this.editor.setState(text);
} // }
} // }
this.editor.setState(ob.value);
}, },
setValue: function (ob) { setValue: function (ob) {

Loading…
Cancel
Save