From 841bf6db55cfd446e9648251eb50ad43e84cc5a3 Mon Sep 17 00:00:00 2001 From: windy <1374721899@qq.com> Date: Fri, 9 Mar 2018 09:44:34 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A4=9A=E5=B1=82downlistcombo?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- demo/js/widget/downlist/demo.downlist.js | 155 ++++--- dist/bundle.js | 412 ++++++++++++++++++ dist/demo.js | 155 ++++--- dist/fineui.js | 412 ++++++++++++++++++ dist/widget.js | 412 ++++++++++++++++++ .../multilayerdownlist/combo.downlist.js | 90 ++++ .../multilayerdownlist/popup.downlist.js | 324 ++++++++++++++ 7 files changed, 1820 insertions(+), 140 deletions(-) create mode 100644 src/widget/multilayerdownlist/combo.downlist.js create mode 100644 src/widget/multilayerdownlist/popup.downlist.js diff --git a/demo/js/widget/downlist/demo.downlist.js b/demo/js/widget/downlist/demo.downlist.js index 4225a19ae..ff2ef89a7 100644 --- a/demo/js/widget/downlist/demo.downlist.js +++ b/demo/js/widget/downlist/demo.downlist.js @@ -34,6 +34,10 @@ Demo.Downlist = BI.inherit(BI.Widget, { mounted: function () { var downlist = this.downlist; var label = this.label; + this.downlist.setValue([{ + value: [11, 6], + childValue: 67 + }]); downlist.on(BI.DownListCombo.EVENT_CHANGE, function (value, fatherValue) { label.setValue(JSON.stringify(downlist.getValue())); }); @@ -54,95 +58,106 @@ Demo.Downlist = BI.inherit(BI.Widget, { self.downlist = _ref; }, cls: "layout-bg3", - value: [{"childValue":22,"value":11},{"value":18},{"value":20}], + // value: [{"childValue":22,"value":11},{"value":18},{"value":20}], height: 30, width: 100, - items: [[{text: "temp", value: 1111111}], + items: [ [{ el: { text: "column 1111", - iconCls1: "check-mark-e-font", - value: 11 + iconCls1: "dot-e-font", + value: 12 }, children: [{ text: "column 1.1", value: 21, cls: "dot-e-font" }, { - text: "column 1.222222222222222222222222222222222222", - cls: "dot-e-font", - value: 22 + text: "column 1.2", + value: 22, + cls: "dot-e-font" }] }], [{ el: { - type: "bi.icon_text_icon_item", - text: "column 2", - iconCls1: "chart-type-e-font", - cls: "dot-e-font", - value: 12 + text: "column 1111", + iconCls1: "dot-e-font", + value: 11 }, children: [{ - type: "bi.icon_text_item", - cls: "dot-e-font", - height: 25, - text: "column 2.1", - value: 11 + text: "column 1.1", + value: 21, + cls: "dot-e-font" }, { - text: "column 2.2", - value: 12, + text: "column 1.2", + value: 22, cls: "dot-e-font" }] - }], - [{ - text: "column 8", - value: 18, - cls: "dot-e-font" - }, - { - - text: "column 9", - cls: "dot-e-font", - value: 19 - } - ], - [{ - text: "column 10", - value: 20, - cls: "dot-e-font" - }, - { - - text: "column 11", - cls: "dot-e-font", - value: 21 - }, - { - - text: "column 12", - cls: "dot-e-font", - value: 22 - }, - { - - text: "column 13", - cls: "dot-e-font", - value: 23 - }, - { - - text: "column 14", - cls: "dot-e-font", - value: 24 - }, - { - - text: "column 15", - cls: "dot-e-font", - value: 25, - bubble: "hahahaha" - } - ] + // children: [{ + // text: BI.i18nText("BI-Basic_None"), + // cls: "dot-e-font", + // value: 1 + // }, { + // text: BI.i18nText("BI-Basic_Calculate_Same_Period"), + // cls: "dot-e-font", + // value: 2 + // }, { + // text: BI.i18nText("BI-Basic_Calculate_Same_Ring"), + // cls: "dot-e-font", + // value: 3 + // }, { + // text: BI.i18nText("BI-Basic_Calculate_Same_Period_Rate"), + // cls: "dot-e-font", + // value: 4 + // }, { + // text: BI.i18nText("BI-Basic_Calculate_Same_Ring_Rate"), + // cls: "dot-e-font", + // value: 5 + // }, { + // el: { + // text: BI.i18nText("BI-Basic_Rank"), + // iconCls1: "dot-e-font", + // value: 6 + // }, + // children: [{ + // text: "test1", + // cls: "dot-e-font", + // value: 67 + // }, { + // text: "test2", + // cls: "dot-e-font", + // value: 68 + // }] + // }, { + // text: BI.i18nText("BI-Basic_Rank_In_Group"), + // cls: "dot-e-font", + // value: 7 + // }, { + // text: BI.i18nText("BI-Basic_Sum_Of_All"), + // cls: "dot-e-font", + // value: 8 + // }, { + // text: BI.i18nText("BI-Basic_Sum_Of_All_In_Group"), + // cls: "dot-e-font", + // value: 9 + // }, { + // text: BI.i18nText("BI-Basic_Sum_Of_Above"), + // cls: "dot-e-font", + // value: 10 + // }, { + // text: BI.i18nText("BI-Basic_Sum_Of_Above_In_Group"), + // cls: "dot-e-font", + // value: 11 + // }, { + // text: BI.i18nText("BI-Design_Current_Dimension_Percent"), + // cls: "dot-e-font", + // value: 12 + // }, { + // text: BI.i18nText("BI-Design_Current_Target_Percent"), + // cls: "dot-e-font", + // value: 13 + // }] + }] ] }, { @@ -156,7 +171,7 @@ Demo.Downlist = BI.inherit(BI.Widget, { }], vgap: 20 }; - } + }, }); BI.shortcut("demo.down_list", Demo.Downlist); \ No newline at end of file diff --git a/dist/bundle.js b/dist/bundle.js index d1c5abaa6..1f9609885 100644 --- a/dist/bundle.js +++ b/dist/bundle.js @@ -90457,6 +90457,418 @@ BI.YearCard = BI.inherit(BI.MultiDateCard, { BI.YearCard.EVENT_CHANGE = "EVENT_CHANGE"; BI.shortcut("bi.yearcard", BI.YearCard); /** + * Created by roy on 15/8/14. + */ +BI.DownListCombo = BI.inherit(BI.Widget, { + _defaultConfig: function () { + return BI.extend(BI.DownListCombo.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-multilayer-down-list-combo", + height: 24, + items: [], + adjustLength: 0, + direction: "bottom", + trigger: "click", + container: null, + stopPropagation: false, + el: {} + }); + }, + + _init: function () { + BI.DownListCombo.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.popupview = BI.createWidget({ + type: "bi.multi_layer_down_list_popup", + items: o.items, + chooseType: o.chooseType, + value: o.value + }); + + this.popupview.on(BI.DownListPopup.EVENT_CHANGE, function (value) { + self.fireEvent(BI.DownListCombo.EVENT_CHANGE, value); + self.downlistcombo.hideView(); + }); + + this.popupview.on(BI.DownListPopup.EVENT_SON_VALUE_CHANGE, function (value, fatherValue) { + self.fireEvent(BI.DownListCombo.EVENT_SON_VALUE_CHANGE, value, fatherValue); + self.downlistcombo.hideView(); + }); + + + this.downlistcombo = BI.createWidget({ + element: this, + type: "bi.combo", + trigger: o.trigger, + isNeedAdjustWidth: false, + container: o.container, + adjustLength: o.adjustLength, + direction: o.direction, + stopPropagation: o.stopPropagation, + el: BI.createWidget(o.el, { + type: "bi.icon_trigger", + extraCls: o.iconCls ? o.iconCls : "pull-down-font", + width: o.width, + height: o.height + }), + popup: { + el: this.popupview, + stopPropagation: true, + maxHeight: 1000 + } + }); + + this.downlistcombo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () { + self.fireEvent(BI.DownListCombo.EVENT_BEFORE_POPUPVIEW); + }); + }, + + hideView: function () { + this.downlistcombo.hideView(); + }, + + showView: function () { + this.downlistcombo.showView(); + }, + + populate: function (items) { + this.popupview.populate(items); + }, + + setValue: function (v) { + this.popupview.setValue(v); + }, + getValue: function () { + return this.popupview.getValue(); + } +}); +BI.DownListCombo.EVENT_CHANGE = "EVENT_CHANGE"; +BI.DownListCombo.EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE"; +BI.DownListCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; + +BI.shortcut("bi.multi_layer_down_list_combo", BI.DownListCombo);/** + * Created by roy on 15/9/8. + * 处理popup中的item分组样式 + * 一个item分组中的成员大于一时，该分组设置为单选，并且默认状态第一个成员设置为已选择项 + */ +BI.MultiLayerDownListPopup = BI.inherit(BI.Pane, { + constants: { + nextIcon: "pull-right-e-font", + height: 25, + iconHeight: 12, + iconWidth: 12, + hgap: 0, + vgap: 0, + border: 1 + }, + _defaultConfig: function () { + var conf = BI.MultiLayerDownListPopup.superclass._defaultConfig.apply(this, arguments); + return BI.extend(conf, { + baseCls: "bi-down-list-popup", + items: [], + chooseType: BI.Selection.Multi + }); + }, + _init: function () { + BI.MultiLayerDownListPopup.superclass._init.apply(this, arguments); + this.singleValues = []; + this.childValueMap = {}; + this.fatherValueMap = {}; + var self = this, o = this.options, children = this._createPopupItems(o.items); + this.popup = BI.createWidget({ + type: "bi.button_tree", + items: BI.createItems(children, + {}, { + adjustLength: -2 + } + ), + layouts: [{ + type: "bi.vertical", + hgap: this.constants.hgap, + vgap: this.constants.vgap + }], + value: this._digest(o.value), + chooseType: o.chooseType + }); + + this.popup.on(BI.ButtonTree.EVENT_CHANGE, function (value, object) { + var changedValue = value; + if (BI.isNotNull(self.childValueMap[value])) { + changedValue = self.childValueMap[value]; + self.fireEvent(BI.MultiLayerDownListPopup.EVENT_SON_VALUE_CHANGE, changedValue, self.fatherValueMap[value]); + } else { + self.fireEvent(BI.MultiLayerDownListPopup.EVENT_CHANGE, changedValue, object); + } + + + if (!self.singleValues.contains(changedValue)) { + var item = self.getValue(); + var result = []; + BI.each(item, function (i, valueObject) { + if (valueObject.value != changedValue) { + result.push(valueObject); + } + }); + self.setValue(result); + } + + }); + + BI.createWidget({ + type: "bi.vertical", + element: this, + items: [this.popup] + }); + + }, + _createPopupItems: function (items) { + var self = this, result = []; + BI.each(items, function (i, it) { + var item_done = { + type: "bi.down_list_group", + items: [] + }; + + BI.each(it, function (i, item) { + if (BI.isNotEmptyArray(item.children) && !BI.isEmpty(item.el)) { + item.type = "bi.combo_group"; + item.cls = "down-list-group"; + item.trigger = "hover"; + item.isNeedAdjustWidth = false; + item.el.title = item.el.title || item.el.text; + item.el.type = "bi.down_list_group_item"; + item.el.logic = { + dynamic: true + }; + item.el.height = self.constants.height; + item.el.iconCls2 = self.constants.nextIcon; + item.popup = { + lgap: 4, + el: { + type: "bi.button_tree", + chooseType: 0, + layouts: [{ + type: "bi.vertical" + }] + + } + }; + item.el.childValues = []; + BI.each(item.children, function (i, child) { + child = child.el ? BI.extend(child.el, {children: child.children}) : child; + var fatherValue = BI.deepClone(item.el.value); + var childValue = BI.deepClone(child.value); + self.singleValues.push(child.value); + child.type = "bi.down_list_item"; + child.extraCls = " child-down-list-item"; + child.title = child.title || child.text; + child.textRgap = 10; + child.isNeedAdjustWidth = false; + child.logic = { + dynamic: true + }; + child.father = fatherValue; + self.fatherValueMap[self._createChildValue(fatherValue, childValue)] = fatherValue; + self.childValueMap[self._createChildValue(fatherValue, childValue)] = childValue; + child.value = self._createChildValue(fatherValue, childValue); + item.el.childValues.push(child.value); + if (BI.isNotEmptyArray(child.children)) { + child.type = "bi.down_list_group_item"; + self._createChildren(child); + child.height = self.constants.height; + child.iconCls2 = self.constants.nextIcon; + item.el.childValues = BI.concat(item.el.childValues, child.childValues); + } + }); + } else { + item.type = "bi.down_list_item"; + item.title = item.title || item.text; + item.textRgap = 10; + item.isNeedAdjustWidth = false; + item.logic = { + dynamic: true + }; + } + var el_done = {}; + el_done.el = item; + item_done.items.push(el_done); + }); + if (self._isGroup(item_done.items)) { + BI.each(item_done.items, function (i, item) { + self.singleValues.push(item.el.value); + }); + } + + result.push(item_done); + if (self._needSpliter(i, items.length)) { + var spliter_container = BI.createWidget({ + type: "bi.vertical", + items: [{ + el: { + type: "bi.layout", + cls: "bi-down-list-spliter bi-border-top cursor-pointer", + height: 0 + } + + }], + cls: "bi-down-list-spliter-container cursor-pointer", + lgap: 10, + rgap: 10 + }); + result.push(spliter_container); + } + }); + return result; + }, + + _createChildren: function (child) { + var self = this; + child.childValues = []; + BI.each(child.children, function (i, c) { + var fatherValue = BI.deepClone(child.value); + var childValue = BI.deepClone(c.value); + c.type = "bi.down_list_item"; + c.title = c.title || c.text; + c.textRgap = 10; + c.isNeedAdjustWidth = false; + c.logic = { + dynamic: true + }; + c.father = fatherValue; + self.fatherValueMap[self._createChildValue(fatherValue, childValue)] = fatherValue; + self.childValueMap[self._createChildValue(fatherValue, childValue)] = childValue; + c.value = self._createChildValue(fatherValue, childValue); + child.childValues.push(c.value); + }); + }, + + _isGroup: function (i) { + return i.length > 1; + }, + + _needSpliter: function (i, itemLength) { + return i < itemLength - 1; + }, + + _createChildValue: function (fatherValue, childValue) { + var fValue = fatherValue; + if(BI.isArray(fatherValue)) { + fValue = fatherValue.join("_"); + } + return fValue + "_" + childValue; + }, + + _digest: function (valueItem) { + var self = this; + var valueArray = []; + BI.each(valueItem, function (i, item) { + var value; + if (BI.isNotNull(item.childValue)) { + value = self._createChildValue(item.value, item.childValue); + } else { + value = item.value; + } + valueArray.push(value); + } + ); + return valueArray; + }, + + _checkValues: function (values) { + var self = this, o = this.options; + var value = []; + BI.each(o.items, function (idx, itemGroup) { + BI.each(itemGroup, function (id, item) { + if(BI.isNotNull(item.children)) { + var childValues = getChildrenValue(item); + var v = joinValue(childValues, values[idx]); + if(BI.isNotEmptyString(v)) { + value.push(v); + } + }else{ + if(item.value === values[idx][0]) { + value.push(values[idx][0]); + } + } + }); + }); + return value; + + function joinValue (sources, targets) { + var value = ""; + BI.some(sources, function (idx, s) { + return BI.some(targets, function (id, t) { + if(s === t) { + value = s; + return true; + } + }); + }); + return value; + } + + function getChildrenValue (item) { + var children = []; + if(BI.isNotNull(item.children)) { + BI.each(item.children, function (idx, child) { + children = BI.concat(children, getChildrenValue(child)); + }); + } else { + children.push(item.value); + } + return children; + } + }, + + populate: function (items) { + BI.MultiLayerDownListPopup.superclass.populate.apply(this, arguments); + var self = this; + self.childValueMap = {}; + self.fatherValueMap = {}; + self.singleValues = []; + var children = self._createPopupItems(items); + var popupItem = BI.createItems(children, + {}, { + adjustLength: -2 + } + ); + self.popup.populate(popupItem); + }, + + setValue: function (valueItem) { + this.popup.setValue(this._digest(valueItem)); + }, + + _getValue: function () { + var v = []; + BI.each(this.popup.getAllButtons(), function (i, item) { + i % 2 === 0 && v.push(item.getValue()); + }); + return v; + }, + + getValue: function () { + var self = this, result = []; + var values = this._checkValues(this._getValue()); + BI.each(values, function (i, value) { + var valueItem = {}; + if (BI.isNotNull(self.childValueMap[value])) { + var fartherValue = self.fatherValueMap[value]; + valueItem.childValue = self.childValueMap[value]; + valueItem.value = fartherValue.split("_"); + } else { + valueItem.value = value; + } + result.push(valueItem); + }); + return result; + } + + +}); + +BI.MultiLayerDownListPopup.EVENT_CHANGE = "EVENT_CHANGE"; +BI.MultiLayerDownListPopup.EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE"; +BI.shortcut("bi.multi_layer_down_list_popup", BI.MultiLayerDownListPopup);/** * @class BI.MultiLayerSelectTreeCombo * @extends BI.Widget */ diff --git a/dist/demo.js b/dist/demo.js index f49f17654..580ce849f 100644 --- a/dist/demo.js +++ b/dist/demo.js @@ -12050,6 +12050,10 @@ Demo.Downlist = BI.inherit(BI.Widget, { mounted: function () { var downlist = this.downlist; var label = this.label; + this.downlist.setValue([{ + value: [11, 6], + childValue: 67 + }]); downlist.on(BI.DownListCombo.EVENT_CHANGE, function (value, fatherValue) { label.setValue(JSON.stringify(downlist.getValue())); }); @@ -12070,95 +12074,106 @@ Demo.Downlist = BI.inherit(BI.Widget, { self.downlist = _ref; }, cls: "layout-bg3", - value: [{"childValue":22,"value":11},{"value":18},{"value":20}], + // value: [{"childValue":22,"value":11},{"value":18},{"value":20}], height: 30, width: 100, - items: [[{text: "temp", value: 1111111}], + items: [ [{ el: { text: "column 1111", - iconCls1: "check-mark-e-font", - value: 11 + iconCls1: "dot-e-font", + value: 12 }, children: [{ text: "column 1.1", value: 21, cls: "dot-e-font" }, { - text: "column 1.222222222222222222222222222222222222", - cls: "dot-e-font", - value: 22 + text: "column 1.2", + value: 22, + cls: "dot-e-font" }] }], [{ el: { - type: "bi.icon_text_icon_item", - text: "column 2", - iconCls1: "chart-type-e-font", - cls: "dot-e-font", - value: 12 + text: "column 1111", + iconCls1: "dot-e-font", + value: 11 }, children: [{ - type: "bi.icon_text_item", - cls: "dot-e-font", - height: 25, - text: "column 2.1", - value: 11 + text: "column 1.1", + value: 21, + cls: "dot-e-font" }, { - text: "column 2.2", - value: 12, + text: "column 1.2", + value: 22, cls: "dot-e-font" }] - }], - [{ - text: "column 8", - value: 18, - cls: "dot-e-font" - }, - { - - text: "column 9", - cls: "dot-e-font", - value: 19 - } - ], - [{ - text: "column 10", - value: 20, - cls: "dot-e-font" - }, - { - - text: "column 11", - cls: "dot-e-font", - value: 21 - }, - { - - text: "column 12", - cls: "dot-e-font", - value: 22 - }, - { - - text: "column 13", - cls: "dot-e-font", - value: 23 - }, - { - - text: "column 14", - cls: "dot-e-font", - value: 24 - }, - { - - text: "column 15", - cls: "dot-e-font", - value: 25, - bubble: "hahahaha" - } - ] + // children: [{ + // text: BI.i18nText("BI-Basic_None"), + // cls: "dot-e-font", + // value: 1 + // }, { + // text: BI.i18nText("BI-Basic_Calculate_Same_Period"), + // cls: "dot-e-font", + // value: 2 + // }, { + // text: BI.i18nText("BI-Basic_Calculate_Same_Ring"), + // cls: "dot-e-font", + // value: 3 + // }, { + // text: BI.i18nText("BI-Basic_Calculate_Same_Period_Rate"), + // cls: "dot-e-font", + // value: 4 + // }, { + // text: BI.i18nText("BI-Basic_Calculate_Same_Ring_Rate"), + // cls: "dot-e-font", + // value: 5 + // }, { + // el: { + // text: BI.i18nText("BI-Basic_Rank"), + // iconCls1: "dot-e-font", + // value: 6 + // }, + // children: [{ + // text: "test1", + // cls: "dot-e-font", + // value: 67 + // }, { + // text: "test2", + // cls: "dot-e-font", + // value: 68 + // }] + // }, { + // text: BI.i18nText("BI-Basic_Rank_In_Group"), + // cls: "dot-e-font", + // value: 7 + // }, { + // text: BI.i18nText("BI-Basic_Sum_Of_All"), + // cls: "dot-e-font", + // value: 8 + // }, { + // text: BI.i18nText("BI-Basic_Sum_Of_All_In_Group"), + // cls: "dot-e-font", + // value: 9 + // }, { + // text: BI.i18nText("BI-Basic_Sum_Of_Above"), + // cls: "dot-e-font", + // value: 10 + // }, { + // text: BI.i18nText("BI-Basic_Sum_Of_Above_In_Group"), + // cls: "dot-e-font", + // value: 11 + // }, { + // text: BI.i18nText("BI-Design_Current_Dimension_Percent"), + // cls: "dot-e-font", + // value: 12 + // }, { + // text: BI.i18nText("BI-Design_Current_Target_Percent"), + // cls: "dot-e-font", + // value: 13 + // }] + }] ] }, { @@ -12172,7 +12187,7 @@ Demo.Downlist = BI.inherit(BI.Widget, { }], vgap: 20 }; - } + }, }); BI.shortcut("demo.down_list", Demo.Downlist);/** diff --git a/dist/fineui.js b/dist/fineui.js index a708496b5..2b8e90d7f 100644 --- a/dist/fineui.js +++ b/dist/fineui.js @@ -92263,6 +92263,418 @@ BI.YearCard = BI.inherit(BI.MultiDateCard, { BI.YearCard.EVENT_CHANGE = "EVENT_CHANGE"; BI.shortcut("bi.yearcard", BI.YearCard); /** + * Created by roy on 15/8/14. + */ +BI.DownListCombo = BI.inherit(BI.Widget, { + _defaultConfig: function () { + return BI.extend(BI.DownListCombo.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-multilayer-down-list-combo", + height: 24, + items: [], + adjustLength: 0, + direction: "bottom", + trigger: "click", + container: null, + stopPropagation: false, + el: {} + }); + }, + + _init: function () { + BI.DownListCombo.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.popupview = BI.createWidget({ + type: "bi.multi_layer_down_list_popup", + items: o.items, + chooseType: o.chooseType, + value: o.value + }); + + this.popupview.on(BI.DownListPopup.EVENT_CHANGE, function (value) { + self.fireEvent(BI.DownListCombo.EVENT_CHANGE, value); + self.downlistcombo.hideView(); + }); + + this.popupview.on(BI.DownListPopup.EVENT_SON_VALUE_CHANGE, function (value, fatherValue) { + self.fireEvent(BI.DownListCombo.EVENT_SON_VALUE_CHANGE, value, fatherValue); + self.downlistcombo.hideView(); + }); + + + this.downlistcombo = BI.createWidget({ + element: this, + type: "bi.combo", + trigger: o.trigger, + isNeedAdjustWidth: false, + container: o.container, + adjustLength: o.adjustLength, + direction: o.direction, + stopPropagation: o.stopPropagation, + el: BI.createWidget(o.el, { + type: "bi.icon_trigger", + extraCls: o.iconCls ? o.iconCls : "pull-down-font", + width: o.width, + height: o.height + }), + popup: { + el: this.popupview, + stopPropagation: true, + maxHeight: 1000 + } + }); + + this.downlistcombo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () { + self.fireEvent(BI.DownListCombo.EVENT_BEFORE_POPUPVIEW); + }); + }, + + hideView: function () { + this.downlistcombo.hideView(); + }, + + showView: function () { + this.downlistcombo.showView(); + }, + + populate: function (items) { + this.popupview.populate(items); + }, + + setValue: function (v) { + this.popupview.setValue(v); + }, + getValue: function () { + return this.popupview.getValue(); + } +}); +BI.DownListCombo.EVENT_CHANGE = "EVENT_CHANGE"; +BI.DownListCombo.EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE"; +BI.DownListCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; + +BI.shortcut("bi.multi_layer_down_list_combo", BI.DownListCombo);/** + * Created by roy on 15/9/8. + * 处理popup中的item分组样式 + * 一个item分组中的成员大于一时，该分组设置为单选，并且默认状态第一个成员设置为已选择项 + */ +BI.MultiLayerDownListPopup = BI.inherit(BI.Pane, { + constants: { + nextIcon: "pull-right-e-font", + height: 25, + iconHeight: 12, + iconWidth: 12, + hgap: 0, + vgap: 0, + border: 1 + }, + _defaultConfig: function () { + var conf = BI.MultiLayerDownListPopup.superclass._defaultConfig.apply(this, arguments); + return BI.extend(conf, { + baseCls: "bi-down-list-popup", + items: [], + chooseType: BI.Selection.Multi + }); + }, + _init: function () { + BI.MultiLayerDownListPopup.superclass._init.apply(this, arguments); + this.singleValues = []; + this.childValueMap = {}; + this.fatherValueMap = {}; + var self = this, o = this.options, children = this._createPopupItems(o.items); + this.popup = BI.createWidget({ + type: "bi.button_tree", + items: BI.createItems(children, + {}, { + adjustLength: -2 + } + ), + layouts: [{ + type: "bi.vertical", + hgap: this.constants.hgap, + vgap: this.constants.vgap + }], + value: this._digest(o.value), + chooseType: o.chooseType + }); + + this.popup.on(BI.ButtonTree.EVENT_CHANGE, function (value, object) { + var changedValue = value; + if (BI.isNotNull(self.childValueMap[value])) { + changedValue = self.childValueMap[value]; + self.fireEvent(BI.MultiLayerDownListPopup.EVENT_SON_VALUE_CHANGE, changedValue, self.fatherValueMap[value]); + } else { + self.fireEvent(BI.MultiLayerDownListPopup.EVENT_CHANGE, changedValue, object); + } + + + if (!self.singleValues.contains(changedValue)) { + var item = self.getValue(); + var result = []; + BI.each(item, function (i, valueObject) { + if (valueObject.value != changedValue) { + result.push(valueObject); + } + }); + self.setValue(result); + } + + }); + + BI.createWidget({ + type: "bi.vertical", + element: this, + items: [this.popup] + }); + + }, + _createPopupItems: function (items) { + var self = this, result = []; + BI.each(items, function (i, it) { + var item_done = { + type: "bi.down_list_group", + items: [] + }; + + BI.each(it, function (i, item) { + if (BI.isNotEmptyArray(item.children) && !BI.isEmpty(item.el)) { + item.type = "bi.combo_group"; + item.cls = "down-list-group"; + item.trigger = "hover"; + item.isNeedAdjustWidth = false; + item.el.title = item.el.title || item.el.text; + item.el.type = "bi.down_list_group_item"; + item.el.logic = { + dynamic: true + }; + item.el.height = self.constants.height; + item.el.iconCls2 = self.constants.nextIcon; + item.popup = { + lgap: 4, + el: { + type: "bi.button_tree", + chooseType: 0, + layouts: [{ + type: "bi.vertical" + }] + + } + }; + item.el.childValues = []; + BI.each(item.children, function (i, child) { + child = child.el ? BI.extend(child.el, {children: child.children}) : child; + var fatherValue = BI.deepClone(item.el.value); + var childValue = BI.deepClone(child.value); + self.singleValues.push(child.value); + child.type = "bi.down_list_item"; + child.extraCls = " child-down-list-item"; + child.title = child.title || child.text; + child.textRgap = 10; + child.isNeedAdjustWidth = false; + child.logic = { + dynamic: true + }; + child.father = fatherValue; + self.fatherValueMap[self._createChildValue(fatherValue, childValue)] = fatherValue; + self.childValueMap[self._createChildValue(fatherValue, childValue)] = childValue; + child.value = self._createChildValue(fatherValue, childValue); + item.el.childValues.push(child.value); + if (BI.isNotEmptyArray(child.children)) { + child.type = "bi.down_list_group_item"; + self._createChildren(child); + child.height = self.constants.height; + child.iconCls2 = self.constants.nextIcon; + item.el.childValues = BI.concat(item.el.childValues, child.childValues); + } + }); + } else { + item.type = "bi.down_list_item"; + item.title = item.title || item.text; + item.textRgap = 10; + item.isNeedAdjustWidth = false; + item.logic = { + dynamic: true + }; + } + var el_done = {}; + el_done.el = item; + item_done.items.push(el_done); + }); + if (self._isGroup(item_done.items)) { + BI.each(item_done.items, function (i, item) { + self.singleValues.push(item.el.value); + }); + } + + result.push(item_done); + if (self._needSpliter(i, items.length)) { + var spliter_container = BI.createWidget({ + type: "bi.vertical", + items: [{ + el: { + type: "bi.layout", + cls: "bi-down-list-spliter bi-border-top cursor-pointer", + height: 0 + } + + }], + cls: "bi-down-list-spliter-container cursor-pointer", + lgap: 10, + rgap: 10 + }); + result.push(spliter_container); + } + }); + return result; + }, + + _createChildren: function (child) { + var self = this; + child.childValues = []; + BI.each(child.children, function (i, c) { + var fatherValue = BI.deepClone(child.value); + var childValue = BI.deepClone(c.value); + c.type = "bi.down_list_item"; + c.title = c.title || c.text; + c.textRgap = 10; + c.isNeedAdjustWidth = false; + c.logic = { + dynamic: true + }; + c.father = fatherValue; + self.fatherValueMap[self._createChildValue(fatherValue, childValue)] = fatherValue; + self.childValueMap[self._createChildValue(fatherValue, childValue)] = childValue; + c.value = self._createChildValue(fatherValue, childValue); + child.childValues.push(c.value); + }); + }, + + _isGroup: function (i) { + return i.length > 1; + }, + + _needSpliter: function (i, itemLength) { + return i < itemLength - 1; + }, + + _createChildValue: function (fatherValue, childValue) { + var fValue = fatherValue; + if(BI.isArray(fatherValue)) { + fValue = fatherValue.join("_"); + } + return fValue + "_" + childValue; + }, + + _digest: function (valueItem) { + var self = this; + var valueArray = []; + BI.each(valueItem, function (i, item) { + var value; + if (BI.isNotNull(item.childValue)) { + value = self._createChildValue(item.value, item.childValue); + } else { + value = item.value; + } + valueArray.push(value); + } + ); + return valueArray; + }, + + _checkValues: function (values) { + var self = this, o = this.options; + var value = []; + BI.each(o.items, function (idx, itemGroup) { + BI.each(itemGroup, function (id, item) { + if(BI.isNotNull(item.children)) { + var childValues = getChildrenValue(item); + var v = joinValue(childValues, values[idx]); + if(BI.isNotEmptyString(v)) { + value.push(v); + } + }else{ + if(item.value === values[idx][0]) { + value.push(values[idx][0]); + } + } + }); + }); + return value; + + function joinValue (sources, targets) { + var value = ""; + BI.some(sources, function (idx, s) { + return BI.some(targets, function (id, t) { + if(s === t) { + value = s; + return true; + } + }); + }); + return value; + } + + function getChildrenValue (item) { + var children = []; + if(BI.isNotNull(item.children)) { + BI.each(item.children, function (idx, child) { + children = BI.concat(children, getChildrenValue(child)); + }); + } else { + children.push(item.value); + } + return children; + } + }, + + populate: function (items) { + BI.MultiLayerDownListPopup.superclass.populate.apply(this, arguments); + var self = this; + self.childValueMap = {}; + self.fatherValueMap = {}; + self.singleValues = []; + var children = self._createPopupItems(items); + var popupItem = BI.createItems(children, + {}, { + adjustLength: -2 + } + ); + self.popup.populate(popupItem); + }, + + setValue: function (valueItem) { + this.popup.setValue(this._digest(valueItem)); + }, + + _getValue: function () { + var v = []; + BI.each(this.popup.getAllButtons(), function (i, item) { + i % 2 === 0 && v.push(item.getValue()); + }); + return v; + }, + + getValue: function () { + var self = this, result = []; + var values = this._checkValues(this._getValue()); + BI.each(values, function (i, value) { + var valueItem = {}; + if (BI.isNotNull(self.childValueMap[value])) { + var fartherValue = self.fatherValueMap[value]; + valueItem.childValue = self.childValueMap[value]; + valueItem.value = fartherValue.split("_"); + } else { + valueItem.value = value; + } + result.push(valueItem); + }); + return result; + } + + +}); + +BI.MultiLayerDownListPopup.EVENT_CHANGE = "EVENT_CHANGE"; +BI.MultiLayerDownListPopup.EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE"; +BI.shortcut("bi.multi_layer_down_list_popup", BI.MultiLayerDownListPopup);/** * @class BI.MultiLayerSelectTreeCombo * @extends BI.Widget */ diff --git a/dist/widget.js b/dist/widget.js index 0d39d10db..5e5e47efa 100644 --- a/dist/widget.js +++ b/dist/widget.js @@ -5612,6 +5612,418 @@ BI.YearCard = BI.inherit(BI.MultiDateCard, { BI.YearCard.EVENT_CHANGE = "EVENT_CHANGE"; BI.shortcut("bi.yearcard", BI.YearCard); /** + * Created by roy on 15/8/14. + */ +BI.DownListCombo = BI.inherit(BI.Widget, { + _defaultConfig: function () { + return BI.extend(BI.DownListCombo.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-multilayer-down-list-combo", + height: 24, + items: [], + adjustLength: 0, + direction: "bottom", + trigger: "click", + container: null, + stopPropagation: false, + el: {} + }); + }, + + _init: function () { + BI.DownListCombo.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.popupview = BI.createWidget({ + type: "bi.multi_layer_down_list_popup", + items: o.items, + chooseType: o.chooseType, + value: o.value + }); + + this.popupview.on(BI.DownListPopup.EVENT_CHANGE, function (value) { + self.fireEvent(BI.DownListCombo.EVENT_CHANGE, value); + self.downlistcombo.hideView(); + }); + + this.popupview.on(BI.DownListPopup.EVENT_SON_VALUE_CHANGE, function (value, fatherValue) { + self.fireEvent(BI.DownListCombo.EVENT_SON_VALUE_CHANGE, value, fatherValue); + self.downlistcombo.hideView(); + }); + + + this.downlistcombo = BI.createWidget({ + element: this, + type: "bi.combo", + trigger: o.trigger, + isNeedAdjustWidth: false, + container: o.container, + adjustLength: o.adjustLength, + direction: o.direction, + stopPropagation: o.stopPropagation, + el: BI.createWidget(o.el, { + type: "bi.icon_trigger", + extraCls: o.iconCls ? o.iconCls : "pull-down-font", + width: o.width, + height: o.height + }), + popup: { + el: this.popupview, + stopPropagation: true, + maxHeight: 1000 + } + }); + + this.downlistcombo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () { + self.fireEvent(BI.DownListCombo.EVENT_BEFORE_POPUPVIEW); + }); + }, + + hideView: function () { + this.downlistcombo.hideView(); + }, + + showView: function () { + this.downlistcombo.showView(); + }, + + populate: function (items) { + this.popupview.populate(items); + }, + + setValue: function (v) { + this.popupview.setValue(v); + }, + getValue: function () { + return this.popupview.getValue(); + } +}); +BI.DownListCombo.EVENT_CHANGE = "EVENT_CHANGE"; +BI.DownListCombo.EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE"; +BI.DownListCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; + +BI.shortcut("bi.multi_layer_down_list_combo", BI.DownListCombo);/** + * Created by roy on 15/9/8. + * 处理popup中的item分组样式 + * 一个item分组中的成员大于一时，该分组设置为单选，并且默认状态第一个成员设置为已选择项 + */ +BI.MultiLayerDownListPopup = BI.inherit(BI.Pane, { + constants: { + nextIcon: "pull-right-e-font", + height: 25, + iconHeight: 12, + iconWidth: 12, + hgap: 0, + vgap: 0, + border: 1 + }, + _defaultConfig: function () { + var conf = BI.MultiLayerDownListPopup.superclass._defaultConfig.apply(this, arguments); + return BI.extend(conf, { + baseCls: "bi-down-list-popup", + items: [], + chooseType: BI.Selection.Multi + }); + }, + _init: function () { + BI.MultiLayerDownListPopup.superclass._init.apply(this, arguments); + this.singleValues = []; + this.childValueMap = {}; + this.fatherValueMap = {}; + var self = this, o = this.options, children = this._createPopupItems(o.items); + this.popup = BI.createWidget({ + type: "bi.button_tree", + items: BI.createItems(children, + {}, { + adjustLength: -2 + } + ), + layouts: [{ + type: "bi.vertical", + hgap: this.constants.hgap, + vgap: this.constants.vgap + }], + value: this._digest(o.value), + chooseType: o.chooseType + }); + + this.popup.on(BI.ButtonTree.EVENT_CHANGE, function (value, object) { + var changedValue = value; + if (BI.isNotNull(self.childValueMap[value])) { + changedValue = self.childValueMap[value]; + self.fireEvent(BI.MultiLayerDownListPopup.EVENT_SON_VALUE_CHANGE, changedValue, self.fatherValueMap[value]); + } else { + self.fireEvent(BI.MultiLayerDownListPopup.EVENT_CHANGE, changedValue, object); + } + + + if (!self.singleValues.contains(changedValue)) { + var item = self.getValue(); + var result = []; + BI.each(item, function (i, valueObject) { + if (valueObject.value != changedValue) { + result.push(valueObject); + } + }); + self.setValue(result); + } + + }); + + BI.createWidget({ + type: "bi.vertical", + element: this, + items: [this.popup] + }); + + }, + _createPopupItems: function (items) { + var self = this, result = []; + BI.each(items, function (i, it) { + var item_done = { + type: "bi.down_list_group", + items: [] + }; + + BI.each(it, function (i, item) { + if (BI.isNotEmptyArray(item.children) && !BI.isEmpty(item.el)) { + item.type = "bi.combo_group"; + item.cls = "down-list-group"; + item.trigger = "hover"; + item.isNeedAdjustWidth = false; + item.el.title = item.el.title || item.el.text; + item.el.type = "bi.down_list_group_item"; + item.el.logic = { + dynamic: true + }; + item.el.height = self.constants.height; + item.el.iconCls2 = self.constants.nextIcon; + item.popup = { + lgap: 4, + el: { + type: "bi.button_tree", + chooseType: 0, + layouts: [{ + type: "bi.vertical" + }] + + } + }; + item.el.childValues = []; + BI.each(item.children, function (i, child) { + child = child.el ? BI.extend(child.el, {children: child.children}) : child; + var fatherValue = BI.deepClone(item.el.value); + var childValue = BI.deepClone(child.value); + self.singleValues.push(child.value); + child.type = "bi.down_list_item"; + child.extraCls = " child-down-list-item"; + child.title = child.title || child.text; + child.textRgap = 10; + child.isNeedAdjustWidth = false; + child.logic = { + dynamic: true + }; + child.father = fatherValue; + self.fatherValueMap[self._createChildValue(fatherValue, childValue)] = fatherValue; + self.childValueMap[self._createChildValue(fatherValue, childValue)] = childValue; + child.value = self._createChildValue(fatherValue, childValue); + item.el.childValues.push(child.value); + if (BI.isNotEmptyArray(child.children)) { + child.type = "bi.down_list_group_item"; + self._createChildren(child); + child.height = self.constants.height; + child.iconCls2 = self.constants.nextIcon; + item.el.childValues = BI.concat(item.el.childValues, child.childValues); + } + }); + } else { + item.type = "bi.down_list_item"; + item.title = item.title || item.text; + item.textRgap = 10; + item.isNeedAdjustWidth = false; + item.logic = { + dynamic: true + }; + } + var el_done = {}; + el_done.el = item; + item_done.items.push(el_done); + }); + if (self._isGroup(item_done.items)) { + BI.each(item_done.items, function (i, item) { + self.singleValues.push(item.el.value); + }); + } + + result.push(item_done); + if (self._needSpliter(i, items.length)) { + var spliter_container = BI.createWidget({ + type: "bi.vertical", + items: [{ + el: { + type: "bi.layout", + cls: "bi-down-list-spliter bi-border-top cursor-pointer", + height: 0 + } + + }], + cls: "bi-down-list-spliter-container cursor-pointer", + lgap: 10, + rgap: 10 + }); + result.push(spliter_container); + } + }); + return result; + }, + + _createChildren: function (child) { + var self = this; + child.childValues = []; + BI.each(child.children, function (i, c) { + var fatherValue = BI.deepClone(child.value); + var childValue = BI.deepClone(c.value); + c.type = "bi.down_list_item"; + c.title = c.title || c.text; + c.textRgap = 10; + c.isNeedAdjustWidth = false; + c.logic = { + dynamic: true + }; + c.father = fatherValue; + self.fatherValueMap[self._createChildValue(fatherValue, childValue)] = fatherValue; + self.childValueMap[self._createChildValue(fatherValue, childValue)] = childValue; + c.value = self._createChildValue(fatherValue, childValue); + child.childValues.push(c.value); + }); + }, + + _isGroup: function (i) { + return i.length > 1; + }, + + _needSpliter: function (i, itemLength) { + return i < itemLength - 1; + }, + + _createChildValue: function (fatherValue, childValue) { + var fValue = fatherValue; + if(BI.isArray(fatherValue)) { + fValue = fatherValue.join("_"); + } + return fValue + "_" + childValue; + }, + + _digest: function (valueItem) { + var self = this; + var valueArray = []; + BI.each(valueItem, function (i, item) { + var value; + if (BI.isNotNull(item.childValue)) { + value = self._createChildValue(item.value, item.childValue); + } else { + value = item.value; + } + valueArray.push(value); + } + ); + return valueArray; + }, + + _checkValues: function (values) { + var self = this, o = this.options; + var value = []; + BI.each(o.items, function (idx, itemGroup) { + BI.each(itemGroup, function (id, item) { + if(BI.isNotNull(item.children)) { + var childValues = getChildrenValue(item); + var v = joinValue(childValues, values[idx]); + if(BI.isNotEmptyString(v)) { + value.push(v); + } + }else{ + if(item.value === values[idx][0]) { + value.push(values[idx][0]); + } + } + }); + }); + return value; + + function joinValue (sources, targets) { + var value = ""; + BI.some(sources, function (idx, s) { + return BI.some(targets, function (id, t) { + if(s === t) { + value = s; + return true; + } + }); + }); + return value; + } + + function getChildrenValue (item) { + var children = []; + if(BI.isNotNull(item.children)) { + BI.each(item.children, function (idx, child) { + children = BI.concat(children, getChildrenValue(child)); + }); + } else { + children.push(item.value); + } + return children; + } + }, + + populate: function (items) { + BI.MultiLayerDownListPopup.superclass.populate.apply(this, arguments); + var self = this; + self.childValueMap = {}; + self.fatherValueMap = {}; + self.singleValues = []; + var children = self._createPopupItems(items); + var popupItem = BI.createItems(children, + {}, { + adjustLength: -2 + } + ); + self.popup.populate(popupItem); + }, + + setValue: function (valueItem) { + this.popup.setValue(this._digest(valueItem)); + }, + + _getValue: function () { + var v = []; + BI.each(this.popup.getAllButtons(), function (i, item) { + i % 2 === 0 && v.push(item.getValue()); + }); + return v; + }, + + getValue: function () { + var self = this, result = []; + var values = this._checkValues(this._getValue()); + BI.each(values, function (i, value) { + var valueItem = {}; + if (BI.isNotNull(self.childValueMap[value])) { + var fartherValue = self.fatherValueMap[value]; + valueItem.childValue = self.childValueMap[value]; + valueItem.value = fartherValue.split("_"); + } else { + valueItem.value = value; + } + result.push(valueItem); + }); + return result; + } + + +}); + +BI.MultiLayerDownListPopup.EVENT_CHANGE = "EVENT_CHANGE"; +BI.MultiLayerDownListPopup.EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE"; +BI.shortcut("bi.multi_layer_down_list_popup", BI.MultiLayerDownListPopup);/** * @class BI.MultiLayerSelectTreeCombo * @extends BI.Widget */ diff --git a/src/widget/multilayerdownlist/combo.downlist.js b/src/widget/multilayerdownlist/combo.downlist.js new file mode 100644 index 000000000..dff06a23d --- /dev/null +++ b/src/widget/multilayerdownlist/combo.downlist.js @@ -0,0 +1,90 @@ +/** + * Created by roy on 15/8/14. + */ +BI.DownListCombo = BI.inherit(BI.Widget, { + _defaultConfig: function () { + return BI.extend(BI.DownListCombo.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-multilayer-down-list-combo", + height: 24, + items: [], + adjustLength: 0, + direction: "bottom", + trigger: "click", + container: null, + stopPropagation: false, + el: {} + }); + }, + + _init: function () { + BI.DownListCombo.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.popupview = BI.createWidget({ + type: "bi.multi_layer_down_list_popup", + items: o.items, + chooseType: o.chooseType, + value: o.value + }); + + this.popupview.on(BI.DownListPopup.EVENT_CHANGE, function (value) { + self.fireEvent(BI.DownListCombo.EVENT_CHANGE, value); + self.downlistcombo.hideView(); + }); + + this.popupview.on(BI.DownListPopup.EVENT_SON_VALUE_CHANGE, function (value, fatherValue) { + self.fireEvent(BI.DownListCombo.EVENT_SON_VALUE_CHANGE, value, fatherValue); + self.downlistcombo.hideView(); + }); + + + this.downlistcombo = BI.createWidget({ + element: this, + type: "bi.combo", + trigger: o.trigger, + isNeedAdjustWidth: false, + container: o.container, + adjustLength: o.adjustLength, + direction: o.direction, + stopPropagation: o.stopPropagation, + el: BI.createWidget(o.el, { + type: "bi.icon_trigger", + extraCls: o.iconCls ? o.iconCls : "pull-down-font", + width: o.width, + height: o.height + }), + popup: { + el: this.popupview, + stopPropagation: true, + maxHeight: 1000 + } + }); + + this.downlistcombo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () { + self.fireEvent(BI.DownListCombo.EVENT_BEFORE_POPUPVIEW); + }); + }, + + hideView: function () { + this.downlistcombo.hideView(); + }, + + showView: function () { + this.downlistcombo.showView(); + }, + + populate: function (items) { + this.popupview.populate(items); + }, + + setValue: function (v) { + this.popupview.setValue(v); + }, + getValue: function () { + return this.popupview.getValue(); + } +}); +BI.DownListCombo.EVENT_CHANGE = "EVENT_CHANGE"; +BI.DownListCombo.EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE"; +BI.DownListCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; + +BI.shortcut("bi.multi_layer_down_list_combo", BI.DownListCombo); \ No newline at end of file diff --git a/src/widget/multilayerdownlist/popup.downlist.js b/src/widget/multilayerdownlist/popup.downlist.js new file mode 100644 index 000000000..5bf5b9a52 --- /dev/null +++ b/src/widget/multilayerdownlist/popup.downlist.js @@ -0,0 +1,324 @@ +/** + * Created by roy on 15/9/8. + * 处理popup中的item分组样式 + * 一个item分组中的成员大于一时，该分组设置为单选，并且默认状态第一个成员设置为已选择项 + */ +BI.MultiLayerDownListPopup = BI.inherit(BI.Pane, { + constants: { + nextIcon: "pull-right-e-font", + height: 25, + iconHeight: 12, + iconWidth: 12, + hgap: 0, + vgap: 0, + border: 1 + }, + _defaultConfig: function () { + var conf = BI.MultiLayerDownListPopup.superclass._defaultConfig.apply(this, arguments); + return BI.extend(conf, { + baseCls: "bi-down-list-popup", + items: [], + chooseType: BI.Selection.Multi + }); + }, + _init: function () { + BI.MultiLayerDownListPopup.superclass._init.apply(this, arguments); + this.singleValues = []; + this.childValueMap = {}; + this.fatherValueMap = {}; + var self = this, o = this.options, children = this._createPopupItems(o.items); + this.popup = BI.createWidget({ + type: "bi.button_tree", + items: BI.createItems(children, + {}, { + adjustLength: -2 + } + ), + layouts: [{ + type: "bi.vertical", + hgap: this.constants.hgap, + vgap: this.constants.vgap + }], + value: this._digest(o.value), + chooseType: o.chooseType + }); + + this.popup.on(BI.ButtonTree.EVENT_CHANGE, function (value, object) { + var changedValue = value; + if (BI.isNotNull(self.childValueMap[value])) { + changedValue = self.childValueMap[value]; + self.fireEvent(BI.MultiLayerDownListPopup.EVENT_SON_VALUE_CHANGE, changedValue, self.fatherValueMap[value]); + } else { + self.fireEvent(BI.MultiLayerDownListPopup.EVENT_CHANGE, changedValue, object); + } + + + if (!self.singleValues.contains(changedValue)) { + var item = self.getValue(); + var result = []; + BI.each(item, function (i, valueObject) { + if (valueObject.value != changedValue) { + result.push(valueObject); + } + }); + self.setValue(result); + } + + }); + + BI.createWidget({ + type: "bi.vertical", + element: this, + items: [this.popup] + }); + + }, + _createPopupItems: function (items) { + var self = this, result = []; + BI.each(items, function (i, it) { + var item_done = { + type: "bi.down_list_group", + items: [] + }; + + BI.each(it, function (i, item) { + if (BI.isNotEmptyArray(item.children) && !BI.isEmpty(item.el)) { + item.type = "bi.combo_group"; + item.cls = "down-list-group"; + item.trigger = "hover"; + item.isNeedAdjustWidth = false; + item.el.title = item.el.title || item.el.text; + item.el.type = "bi.down_list_group_item"; + item.el.logic = { + dynamic: true + }; + item.el.height = self.constants.height; + item.el.iconCls2 = self.constants.nextIcon; + item.popup = { + lgap: 4, + el: { + type: "bi.button_tree", + chooseType: 0, + layouts: [{ + type: "bi.vertical" + }] + + } + }; + item.el.childValues = []; + BI.each(item.children, function (i, child) { + child = child.el ? BI.extend(child.el, {children: child.children}) : child; + var fatherValue = BI.deepClone(item.el.value); + var childValue = BI.deepClone(child.value); + self.singleValues.push(child.value); + child.type = "bi.down_list_item"; + child.extraCls = " child-down-list-item"; + child.title = child.title || child.text; + child.textRgap = 10; + child.isNeedAdjustWidth = false; + child.logic = { + dynamic: true + }; + child.father = fatherValue; + self.fatherValueMap[self._createChildValue(fatherValue, childValue)] = fatherValue; + self.childValueMap[self._createChildValue(fatherValue, childValue)] = childValue; + child.value = self._createChildValue(fatherValue, childValue); + item.el.childValues.push(child.value); + if (BI.isNotEmptyArray(child.children)) { + child.type = "bi.down_list_group_item"; + self._createChildren(child); + child.height = self.constants.height; + child.iconCls2 = self.constants.nextIcon; + item.el.childValues = BI.concat(item.el.childValues, child.childValues); + } + }); + } else { + item.type = "bi.down_list_item"; + item.title = item.title || item.text; + item.textRgap = 10; + item.isNeedAdjustWidth = false; + item.logic = { + dynamic: true + }; + } + var el_done = {}; + el_done.el = item; + item_done.items.push(el_done); + }); + if (self._isGroup(item_done.items)) { + BI.each(item_done.items, function (i, item) { + self.singleValues.push(item.el.value); + }); + } + + result.push(item_done); + if (self._needSpliter(i, items.length)) { + var spliter_container = BI.createWidget({ + type: "bi.vertical", + items: [{ + el: { + type: "bi.layout", + cls: "bi-down-list-spliter bi-border-top cursor-pointer", + height: 0 + } + + }], + cls: "bi-down-list-spliter-container cursor-pointer", + lgap: 10, + rgap: 10 + }); + result.push(spliter_container); + } + }); + return result; + }, + + _createChildren: function (child) { + var self = this; + child.childValues = []; + BI.each(child.children, function (i, c) { + var fatherValue = BI.deepClone(child.value); + var childValue = BI.deepClone(c.value); + c.type = "bi.down_list_item"; + c.title = c.title || c.text; + c.textRgap = 10; + c.isNeedAdjustWidth = false; + c.logic = { + dynamic: true + }; + c.father = fatherValue; + self.fatherValueMap[self._createChildValue(fatherValue, childValue)] = fatherValue; + self.childValueMap[self._createChildValue(fatherValue, childValue)] = childValue; + c.value = self._createChildValue(fatherValue, childValue); + child.childValues.push(c.value); + }); + }, + + _isGroup: function (i) { + return i.length > 1; + }, + + _needSpliter: function (i, itemLength) { + return i < itemLength - 1; + }, + + _createChildValue: function (fatherValue, childValue) { + var fValue = fatherValue; + if(BI.isArray(fatherValue)) { + fValue = fatherValue.join("_"); + } + return fValue + "_" + childValue; + }, + + _digest: function (valueItem) { + var self = this; + var valueArray = []; + BI.each(valueItem, function (i, item) { + var value; + if (BI.isNotNull(item.childValue)) { + value = self._createChildValue(item.value, item.childValue); + } else { + value = item.value; + } + valueArray.push(value); + } + ); + return valueArray; + }, + + _checkValues: function (values) { + var self = this, o = this.options; + var value = []; + BI.each(o.items, function (idx, itemGroup) { + BI.each(itemGroup, function (id, item) { + if(BI.isNotNull(item.children)) { + var childValues = getChildrenValue(item); + var v = joinValue(childValues, values[idx]); + if(BI.isNotEmptyString(v)) { + value.push(v); + } + }else{ + if(item.value === values[idx][0]) { + value.push(values[idx][0]); + } + } + }); + }); + return value; + + function joinValue (sources, targets) { + var value = ""; + BI.some(sources, function (idx, s) { + return BI.some(targets, function (id, t) { + if(s === t) { + value = s; + return true; + } + }); + }); + return value; + } + + function getChildrenValue (item) { + var children = []; + if(BI.isNotNull(item.children)) { + BI.each(item.children, function (idx, child) { + children = BI.concat(children, getChildrenValue(child)); + }); + } else { + children.push(item.value); + } + return children; + } + }, + + populate: function (items) { + BI.MultiLayerDownListPopup.superclass.populate.apply(this, arguments); + var self = this; + self.childValueMap = {}; + self.fatherValueMap = {}; + self.singleValues = []; + var children = self._createPopupItems(items); + var popupItem = BI.createItems(children, + {}, { + adjustLength: -2 + } + ); + self.popup.populate(popupItem); + }, + + setValue: function (valueItem) { + this.popup.setValue(this._digest(valueItem)); + }, + + _getValue: function () { + var v = []; + BI.each(this.popup.getAllButtons(), function (i, item) { + i % 2 === 0 && v.push(item.getValue()); + }); + return v; + }, + + getValue: function () { + var self = this, result = []; + var values = this._checkValues(this._getValue()); + BI.each(values, function (i, value) { + var valueItem = {}; + if (BI.isNotNull(self.childValueMap[value])) { + var fartherValue = self.fatherValueMap[value]; + valueItem.childValue = self.childValueMap[value]; + valueItem.value = fartherValue.split("_"); + } else { + valueItem.value = value; + } + result.push(valueItem); + }); + return result; + } + + +}); + +BI.MultiLayerDownListPopup.EVENT_CHANGE = "EVENT_CHANGE"; +BI.MultiLayerDownListPopup.EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE"; +BI.shortcut("bi.multi_layer_down_list_popup", BI.MultiLayerDownListPopup); \ No newline at end of file