forked from fanruan/fineui
windy
7 years ago
33 changed files with 2812 additions and 39 deletions
@ -0,0 +1,65 @@ |
|||||||
|
Demo.Filter = BI.inherit(BI.Widget, { |
||||||
|
props: {}, |
||||||
|
_createFilter: function () { |
||||||
|
var filter = BI.createWidget({ |
||||||
|
type: "bi.filter", |
||||||
|
width: 600, |
||||||
|
height: 300, |
||||||
|
items: [{ |
||||||
|
id: "3beb41be9c67d80d", |
||||||
|
value: 81, |
||||||
|
children: [{ |
||||||
|
id: 1, |
||||||
|
type: "bi.label", |
||||||
|
value: "节点1" |
||||||
|
}, { |
||||||
|
id: "74cf470c15a7cb23", |
||||||
|
value: 80, |
||||||
|
children: [{ |
||||||
|
id: 2, |
||||||
|
type: "bi.label", |
||||||
|
value: "节点2" |
||||||
|
}, { |
||||||
|
id: 3, |
||||||
|
type: "bi.label", |
||||||
|
value: "节点3" |
||||||
|
}] |
||||||
|
}, { |
||||||
|
id: 4, |
||||||
|
type: "bi.label", |
||||||
|
value: "节点4" |
||||||
|
}] |
||||||
|
}], |
||||||
|
itemCreator: function (item) { |
||||||
|
if(item.value === BI.Filter.FILTER_TYPE.EMPTY_FORMULA || item.value === BI.Filter.FILTER_TYPE.EMPTY_CONDITION) { |
||||||
|
item.type = "bi.label"; |
||||||
|
item.value = "这是一个新添的数据"; |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
return filter; |
||||||
|
}, |
||||||
|
|
||||||
|
render: function () { |
||||||
|
|
||||||
|
var filter = this._createFilter(); |
||||||
|
|
||||||
|
return { |
||||||
|
type: "bi.vertical", |
||||||
|
hgap: 30, |
||||||
|
vgap: 20, |
||||||
|
items: [{ |
||||||
|
el: filter |
||||||
|
}, { |
||||||
|
type: "bi.button", |
||||||
|
text: "过滤结构getValue()", |
||||||
|
height: 30, |
||||||
|
handler: function () { |
||||||
|
BI.Msg.alert("过滤结构", JSON.stringify(filter.getValue())); |
||||||
|
} |
||||||
|
}] |
||||||
|
}; |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.shortcut("demo.filter", Demo.Filter); |
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,4 @@ |
|||||||
|
.bi-filter-item .filter-item-empty-item .empty-filter-item-leaf { |
||||||
|
border: 1px dashed #178cdf; |
||||||
|
background: #eaf2fd; |
||||||
|
} |
||||||
@ -0,0 +1,26 @@ |
|||||||
|
.bi-filter-expander { |
||||||
|
min-width: 100%; |
||||||
|
border-right: 0px; |
||||||
|
border-bottom: 0px; |
||||||
|
} |
||||||
|
.bi-filter-expander > .filter-item-empty-item { |
||||||
|
border-top: 0px; |
||||||
|
border-right: 1px solid #d4dadd; |
||||||
|
border-bottom: 1px solid #d4dadd; |
||||||
|
} |
||||||
|
.bi-filter-expander > table { |
||||||
|
min-width: 100%; |
||||||
|
} |
||||||
|
.bi-filter-expander > table > tbody > tr > td.first-element { |
||||||
|
width: 20px; |
||||||
|
border-right: 1px solid #d4dadd !important; |
||||||
|
border-bottom: 1px solid #d4dadd !important; |
||||||
|
} |
||||||
|
.bi-theme-dark .bi-filter-expander > .filter-item-empty-item { |
||||||
|
border-right: 1px solid #525466; |
||||||
|
border-bottom: 1px solid #525466; |
||||||
|
} |
||||||
|
.bi-theme-dark .bi-filter-expander > table > tbody > tr > td.first-element { |
||||||
|
border-right: 1px solid #525466 !important; |
||||||
|
border-bottom: 1px solid #525466 !important; |
||||||
|
} |
||||||
@ -0,0 +1,4 @@ |
|||||||
|
.bi-filter-operation .operation-trigger.hover, |
||||||
|
.bi-filter-operation .operation-trigger:hover { |
||||||
|
color: #58cc7d; |
||||||
|
} |
||||||
@ -0,0 +1,6 @@ |
|||||||
|
.bi-filter-pane { |
||||||
|
min-width: 100%; |
||||||
|
-webkit-border-radius: 2px; |
||||||
|
-moz-border-radius: 2px; |
||||||
|
border-radius: 2px; |
||||||
|
} |
||||||
@ -0,0 +1,11 @@ |
|||||||
|
@import "../../../index"; |
||||||
|
|
||||||
|
.bi-filter-item { |
||||||
|
//min-width: 470px; |
||||||
|
& .filter-item-empty-item { |
||||||
|
& .empty-filter-item-leaf{ |
||||||
|
border: 1px dashed @color-bi-border-highlight; |
||||||
|
background: @color-bi-background-light-highlight; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,36 @@ |
|||||||
|
@import "../../../index"; |
||||||
|
|
||||||
|
.bi-filter-expander { |
||||||
|
min-width: 100%; |
||||||
|
border-right: 0px; |
||||||
|
border-bottom: 0px; |
||||||
|
& > .filter-item-empty-item { |
||||||
|
border-top: 0px; |
||||||
|
border-right: 1px solid @color-bi-border-line; |
||||||
|
border-bottom: 1px solid @color-bi-border-line; |
||||||
|
} |
||||||
|
& .condition-and-or { |
||||||
|
|
||||||
|
} |
||||||
|
> table { |
||||||
|
min-width: 100%; |
||||||
|
} |
||||||
|
> table > tbody > tr > td.first-element { |
||||||
|
width: 20px; |
||||||
|
border-right: 1px solid @color-bi-border-line !important; |
||||||
|
border-bottom: 1px solid @color-bi-border-line !important; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.bi-theme-dark { |
||||||
|
.bi-filter-expander { |
||||||
|
& > .filter-item-empty-item { |
||||||
|
border-right: 1px solid @color-bi-border-line-theme-dark; |
||||||
|
border-bottom: 1px solid @color-bi-border-line-theme-dark; |
||||||
|
} |
||||||
|
> table > tbody > tr > td.first-element { |
||||||
|
border-right: 1px solid @color-bi-border-line-theme-dark !important; |
||||||
|
border-bottom: 1px solid @color-bi-border-line-theme-dark !important; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,8 @@ |
|||||||
|
@import "../../../index"; |
||||||
|
.bi-filter-operation { |
||||||
|
& .operation-trigger { |
||||||
|
&.hover, &:hover{ |
||||||
|
color: @background-color-dark-success; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,6 @@ |
|||||||
|
@import "../../../index"; |
||||||
|
|
||||||
|
.bi-filter-pane { |
||||||
|
min-width: 100%; |
||||||
|
.border-radius(2px); |
||||||
|
} |
||||||
@ -0,0 +1,51 @@ |
|||||||
|
/** |
||||||
|
* 过滤条件抽象类 |
||||||
|
* |
||||||
|
* @class BI.AbstractFilterItem |
||||||
|
* @extend BI.Widget |
||||||
|
*/ |
||||||
|
BI.AbstractFilterItem = BI.inherit(BI.Widget, { |
||||||
|
|
||||||
|
props: { |
||||||
|
baseCls: "bi-filter-item bi-border-right bi-border-bottom" |
||||||
|
}, |
||||||
|
|
||||||
|
isSelectedCondition: function () { |
||||||
|
return this.emptyItem && this.emptyItem.isVisible(); |
||||||
|
}, |
||||||
|
|
||||||
|
setSelectedCondition: function (b) { |
||||||
|
if (b) { |
||||||
|
if (!this.emptyItem) { |
||||||
|
this.emptyItem = BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
height: 40, |
||||||
|
cls: "filter-item-empty-item bi-border-top", |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.center_adapt", |
||||||
|
cls: "empty-filter-item-leaf" |
||||||
|
} |
||||||
|
}], |
||||||
|
hgap: 10, |
||||||
|
vgap: 5 |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.vertical", |
||||||
|
element: this, |
||||||
|
items: [this.emptyItem], |
||||||
|
scrolly: false |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
||||||
|
this.emptyItem && this.emptyItem.setVisible(b); |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.extend(BI.AbstractFilterItem, { |
||||||
|
FILTER_OPERATION_FORMULA: 1, |
||||||
|
FILTER_OPERATION_CONDITION: 2, |
||||||
|
FILTER_OPERATION_CONDITION_AND: 3, |
||||||
|
FILTER_OPERATION_CONDITION_OR: 4, |
||||||
|
FILTER_OPERATION_FORMULA_AND: 5, |
||||||
|
FILTER_OPERATION_FORMULA_OR: 6 |
||||||
|
}); |
||||||
@ -0,0 +1,46 @@ |
|||||||
|
/** |
||||||
|
* Created by Urthur on 2017/11/21. |
||||||
|
*/ |
||||||
|
!(function () { |
||||||
|
var Expander = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "bi-filter-expander", |
||||||
|
el: {}, |
||||||
|
popup: {} |
||||||
|
}, |
||||||
|
|
||||||
|
render: function () { |
||||||
|
var self = this, o = this.options; |
||||||
|
return { |
||||||
|
type: "bi.filter_expander", |
||||||
|
el: o.el, |
||||||
|
popup: o.popup, |
||||||
|
id: o.id, |
||||||
|
value: o.value, |
||||||
|
listeners: [{ |
||||||
|
eventName: BI.Controller.EVENT_CHANGE, |
||||||
|
action: function () { |
||||||
|
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
||||||
|
} |
||||||
|
}], |
||||||
|
ref: function (_ref) { |
||||||
|
self.expander = _ref; |
||||||
|
} |
||||||
|
}; |
||||||
|
}, |
||||||
|
|
||||||
|
populate: function () { |
||||||
|
this.expander.populate.apply(this.expander, arguments); |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
var val = this.expander.getValue(); |
||||||
|
return { |
||||||
|
filterType: val.type, |
||||||
|
filterValue: val.value, |
||||||
|
id: val.id |
||||||
|
}; |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.shortcut("bi.and.or.filter.expander", Expander); |
||||||
|
}()); |
||||||
@ -0,0 +1,74 @@ |
|||||||
|
/** |
||||||
|
* @class BI.FilterExpander |
||||||
|
* @extend BI.AbstractFilterItem |
||||||
|
* 过滤树的一个expander节点 |
||||||
|
*/ |
||||||
|
!(function () { |
||||||
|
var FilterExpander = BI.inherit(BI.AbstractFilterItem, { |
||||||
|
_constant: { |
||||||
|
EXPANDER_WIDTH: 20 |
||||||
|
}, |
||||||
|
|
||||||
|
props: { |
||||||
|
baseCls: "bi-filter-item bi-filter-expander", |
||||||
|
el: {}, |
||||||
|
popup: {} |
||||||
|
}, |
||||||
|
|
||||||
|
render: function () { |
||||||
|
var self = this, o = this.options; |
||||||
|
var value = o.value, text = ""; |
||||||
|
if (value === BI.Filter.FILTER_TYPE.AND) { |
||||||
|
text = BI.i18nText("BI-Basic_And"); |
||||||
|
} else { |
||||||
|
text = BI.i18nText("BI-Basic_Or"); |
||||||
|
} |
||||||
|
return { |
||||||
|
type: "bi.horizontal_adapt", |
||||||
|
cls: "filter-item-empty-item", |
||||||
|
verticalAlign: BI.VerticalAlign.Middle, |
||||||
|
items: [{ |
||||||
|
type: "bi.text_button", |
||||||
|
cls: "condition-and-or", |
||||||
|
text: text, |
||||||
|
value: value, |
||||||
|
id: o.id, |
||||||
|
width: this._constant.EXPANDER_WIDTH, |
||||||
|
height: "100%", |
||||||
|
ref: function (_ref) { |
||||||
|
self.expander = _ref; |
||||||
|
}, |
||||||
|
listeners: [{ |
||||||
|
eventName: BI.TextButton.EVENT_CHANGE, |
||||||
|
action: function () { |
||||||
|
self.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.CLICK, "", self); |
||||||
|
} |
||||||
|
}] |
||||||
|
}, BI.extend(o.popup, { |
||||||
|
ref: function (_ref) { |
||||||
|
self.conditionsView = _ref; |
||||||
|
}, |
||||||
|
listeners: [{ |
||||||
|
eventName: BI.Controller.EVENT_CHANGE, |
||||||
|
action: function () { |
||||||
|
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
||||||
|
} |
||||||
|
}] |
||||||
|
})] |
||||||
|
}; |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
return { |
||||||
|
type: this.expander.getValue(), |
||||||
|
value: this.conditionsView.getValue(), |
||||||
|
id: this.options.id |
||||||
|
}; |
||||||
|
}, |
||||||
|
|
||||||
|
populate: function () { |
||||||
|
this.conditionsView.populate.apply(this.conditionsView, arguments); |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.shortcut("bi.filter_expander", FilterExpander); |
||||||
|
}()); |
||||||
@ -0,0 +1,21 @@ |
|||||||
|
/** |
||||||
|
* Created by Urthur on 2017/12/21. |
||||||
|
*/ |
||||||
|
!(function () { |
||||||
|
BI.constant("bi.constant.component.filter", { |
||||||
|
FORMULA_COMBO: [{ |
||||||
|
text: BI.i18nText("BI-Conf_Formula_And"), |
||||||
|
value: BI.AbstractFilterItem.FILTER_OPERATION_FORMULA_AND |
||||||
|
}, { |
||||||
|
text: BI.i18nText("BI-Conf_Formula_Or"), |
||||||
|
value: BI.AbstractFilterItem.FILTER_OPERATION_FORMULA_OR |
||||||
|
}], |
||||||
|
CONDITION_COMBO: [{ |
||||||
|
text: BI.i18nText("BI-Conf_Condition_And"), |
||||||
|
value: BI.AbstractFilterItem.FILTER_OPERATION_CONDITION_AND |
||||||
|
}, { |
||||||
|
text: BI.i18nText("BI-Conf_Condition_Or"), |
||||||
|
value: BI.AbstractFilterItem.FILTER_OPERATION_CONDITION_OR |
||||||
|
}] |
||||||
|
}); |
||||||
|
}()); |
||||||
@ -0,0 +1,194 @@ |
|||||||
|
/** |
||||||
|
* 过滤 |
||||||
|
* |
||||||
|
* Created by GUY on 2015/11/20. |
||||||
|
* @class BI.Filter |
||||||
|
* @extend BI.Widget |
||||||
|
*/ |
||||||
|
BI.Filter = BI.inherit(BI.Widget, { |
||||||
|
|
||||||
|
constants: { |
||||||
|
FIELD_TYPE_NUMBER: 1, |
||||||
|
FIELD_TYPE_STRING: 0, |
||||||
|
FIELD_TYPE_DATE: 2 |
||||||
|
}, |
||||||
|
|
||||||
|
props: { |
||||||
|
baseCls: "bi-filter", |
||||||
|
expander: {}, |
||||||
|
items: [], |
||||||
|
el: {}, |
||||||
|
itemCreator: BI.empty |
||||||
|
}, |
||||||
|
|
||||||
|
render: function () { |
||||||
|
var self = this, o = this.options; |
||||||
|
return BI.extend({ |
||||||
|
type: "bi.filter_operation", |
||||||
|
expander: o.expander, |
||||||
|
listeners: [{ |
||||||
|
eventName: "EVENT_OPERATION", |
||||||
|
action: function (type) { |
||||||
|
switch (type) { |
||||||
|
case BI.AbstractFilterItem.FILTER_OPERATION_CONDITION: |
||||||
|
case BI.AbstractFilterItem.FILTER_OPERATION_CONDITION_AND: |
||||||
|
self._addAndOrCondition(BI.Filter.FILTER_TYPE.EMPTY_CONDITION); |
||||||
|
break; |
||||||
|
case BI.AbstractFilterItem.FILTER_OPERATION_CONDITION_OR: |
||||||
|
self._addAndOrCondition(BI.Filter.FILTER_TYPE.EMPTY_CONDITION, 1); |
||||||
|
break; |
||||||
|
case BI.AbstractFilterItem.FILTER_OPERATION_FORMULA: |
||||||
|
case BI.AbstractFilterItem.FILTER_OPERATION_FORMULA_AND: |
||||||
|
self._addAndOrCondition(BI.Filter.FILTER_TYPE.EMPTY_FORMULA); |
||||||
|
break; |
||||||
|
case BI.AbstractFilterItem.FILTER_OPERATION_FORMULA_OR: |
||||||
|
self._addAndOrCondition(BI.Filter.FILTER_TYPE.EMPTY_FORMULA, 1); |
||||||
|
break; |
||||||
|
} |
||||||
|
} |
||||||
|
}, { |
||||||
|
eventName: "BI.FilterOperation.EVENT_DESTROY_ITEM", |
||||||
|
action: function (id) { |
||||||
|
self._removeCondition(id); |
||||||
|
} |
||||||
|
}], |
||||||
|
ref: function (_ref) { |
||||||
|
self.filter = _ref; |
||||||
|
} |
||||||
|
}, o.el); |
||||||
|
}, |
||||||
|
|
||||||
|
mounted: function () { |
||||||
|
this.tree = new BI.Tree(); |
||||||
|
this.tree.initTree(this.options.items); |
||||||
|
this._populate(this.tree.toJSONWithNode()); |
||||||
|
}, |
||||||
|
|
||||||
|
_createEmptyNode: function (type) { |
||||||
|
var node = new BI.Node(BI.UUID()); |
||||||
|
node.set("data", { |
||||||
|
value: type |
||||||
|
}); |
||||||
|
return node; |
||||||
|
}, |
||||||
|
|
||||||
|
_insertAndOrCondition: function (id, formulaOrField, type) { |
||||||
|
var ANDOR = ["AND", "OR"]; |
||||||
|
type || (type = 0); |
||||||
|
var finded = this.tree.search(id); |
||||||
|
if (BI.isNotNull(finded)) { |
||||||
|
var data = finded.get("data"); |
||||||
|
var parent = finded.getParent(); |
||||||
|
var index = parent.getChildIndex(finded.id); |
||||||
|
var pdata = parent.get("data") || {}; |
||||||
|
var node = this._createEmptyNode(formulaOrField); |
||||||
|
if (data.value === BI.Filter.FILTER_TYPE[ANDOR[type]]) { |
||||||
|
this.tree.addNode(finded, node); |
||||||
|
return; |
||||||
|
} |
||||||
|
if (data.value === BI.Filter.FILTER_TYPE[ANDOR[1 - type]]) { |
||||||
|
if (pdata.value === BI.Filter.FILTER_TYPE[ANDOR[type]]) { |
||||||
|
parent.addChild(node, index + 1); |
||||||
|
return; |
||||||
|
} |
||||||
|
} |
||||||
|
if ((data.value === BI.Filter.FILTER_TYPE[ANDOR[1 - type]] && pdata.value !== BI.Filter.FILTER_TYPE[ANDOR[type]]) |
||||||
|
|| pdata.value === BI.Filter.FILTER_TYPE[ANDOR[1 - type]] |
||||||
|
|| (pdata.value !== BI.Filter.FILTER_TYPE.AND && pdata.value !== BI.Filter.FILTER_TYPE.OR)) { |
||||||
|
var andor = new BI.Node(BI.UUID()); |
||||||
|
andor.set("data", { |
||||||
|
value: BI.Filter.FILTER_TYPE[ANDOR[type]], |
||||||
|
children: [finded.get("data"), node.get("data")] |
||||||
|
}); |
||||||
|
parent.removeChildByIndex(index); |
||||||
|
parent.addChild(andor, index); |
||||||
|
andor.addChild(finded); |
||||||
|
andor.addChild(node); |
||||||
|
return; |
||||||
|
} |
||||||
|
parent.addChild(node, index + 1); |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
_removeCondition: function (id) { |
||||||
|
var finded = this.tree.search(id); |
||||||
|
if (BI.isNotNull(finded)) { |
||||||
|
var parent = finded.getParent(); |
||||||
|
parent.removeChild(id); |
||||||
|
if (parent.getChildrenLength() <= 1) { |
||||||
|
var prev = parent.getParent(); |
||||||
|
if (BI.isNotNull(prev)) { |
||||||
|
var index = prev.getChildIndex(parent.id); |
||||||
|
prev.removeChildByIndex(index); |
||||||
|
if (parent.getChildrenLength() === 1) { |
||||||
|
prev.addChild(parent.getFirstChild(), index); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
this._populate(this.tree.toJSONWithNode()); |
||||||
|
this.fireEvent("EVENT_CHANGE"); |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
_addAndOrCondition: function (formulaOrField, type) { |
||||||
|
var ANDOR = ["AND", "OR"]; |
||||||
|
type || (type = 0); |
||||||
|
var currentSelectItem = this.filter.getCurrentSelectItem(); |
||||||
|
if (BI.isNotNull(currentSelectItem)) { |
||||||
|
var id = currentSelectItem.attr("id"); |
||||||
|
this._insertAndOrCondition(id, formulaOrField, type); |
||||||
|
} else { |
||||||
|
var node = this._createEmptyNode(formulaOrField); |
||||||
|
var root = this.tree.getRoot(); |
||||||
|
var child = root.getLastChild(); |
||||||
|
if (BI.isNotNull(child)) { |
||||||
|
var data = child.get("data"); |
||||||
|
if (data.value === BI.Filter.FILTER_TYPE[ANDOR[type]]) { |
||||||
|
this.tree.addNode(child, node); |
||||||
|
} else { |
||||||
|
var andor = new BI.Node(BI.UUID()); |
||||||
|
andor.set("data", { |
||||||
|
value: BI.Filter.FILTER_TYPE[ANDOR[type]], |
||||||
|
children: [child.get("data"), node.get("data")] |
||||||
|
}); |
||||||
|
root.removeChild(child.id); |
||||||
|
this.tree.addNode(andor); |
||||||
|
this.tree.addNode(andor, child); |
||||||
|
this.tree.addNode(andor, node); |
||||||
|
} |
||||||
|
} else { |
||||||
|
this.tree.addNode(node); |
||||||
|
} |
||||||
|
} |
||||||
|
this._populate(this.tree.toJSONWithNode()); |
||||||
|
this.fireEvent("EVENT_CHANGE"); |
||||||
|
}, |
||||||
|
|
||||||
|
_populate: function (items) { |
||||||
|
this.filter.defaultState(); |
||||||
|
var o = this.options; |
||||||
|
o.items = items; |
||||||
|
BI.Tree.traversal(items, function (i, item) { |
||||||
|
o.itemCreator(item); |
||||||
|
}); |
||||||
|
this.filter.populate.apply(this.filter, [items]); |
||||||
|
}, |
||||||
|
|
||||||
|
populate: function (conditions) { |
||||||
|
this.tree.initTree(conditions); |
||||||
|
this._populate(this.tree.toJSONWithNode()); |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
return this.filter.getValue(); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
BI.shortcut("bi.filter", BI.Filter); |
||||||
|
|
||||||
|
BI.Filter.FILTER_TYPE = {}; |
||||||
|
BI.Filter.FILTER_TYPE.FORMULA = 33; |
||||||
|
BI.Filter.FILTER_TYPE.AND = 34; |
||||||
|
BI.Filter.FILTER_TYPE.OR = 35; |
||||||
|
BI.Filter.FILTER_TYPE.EMPTY_FORMULA = 36; |
||||||
|
BI.Filter.FILTER_TYPE.EMPTY_CONDITION = 37; |
||||||
@ -0,0 +1,102 @@ |
|||||||
|
/** |
||||||
|
* Created by windy on 2017/3/28. |
||||||
|
*/ |
||||||
|
!(function () { |
||||||
|
var FilterList = BI.inherit(BI.ButtonTree, { |
||||||
|
props: { |
||||||
|
baseCls: "bi-button-map" |
||||||
|
}, |
||||||
|
|
||||||
|
_createBtns: function (items) { |
||||||
|
var o = this.options; |
||||||
|
var buttons = BI.createWidgets(BI.createItems(items, {type: "bi.text_button", once: o.chooseType === 0})); |
||||||
|
var keys = BI.map(items, function (i, item) { |
||||||
|
item = BI.stripEL(item); |
||||||
|
if (!(item.id || item.value)) { |
||||||
|
throw new Error("item must have 'id' or 'value' as its property"); |
||||||
|
} |
||||||
|
return item.id || item.value; |
||||||
|
}); |
||||||
|
return BI.zipObject(keys, buttons); |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (v) { |
||||||
|
v = BI.isArray(v) ? v : [v]; |
||||||
|
BI.each(this.buttons, function (val, item) { |
||||||
|
if (!BI.isFunction(item.setSelected)) { |
||||||
|
item.setValue(v); |
||||||
|
return; |
||||||
|
} |
||||||
|
if (v.contains(val)) { |
||||||
|
item.setSelected && item.setSelected(true); |
||||||
|
} else { |
||||||
|
item.setSelected && item.setSelected(false); |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
setNotSelectedValue: function (v) { |
||||||
|
v = BI.isArray(v) ? v : [v]; |
||||||
|
BI.each(this.buttons, function (val, item) { |
||||||
|
if (!BI.isFunction(item.setSelected)) { |
||||||
|
item.setNotSelectedValue(v); |
||||||
|
return; |
||||||
|
} |
||||||
|
if (v.contains(val)) { |
||||||
|
item.setSelected && item.setSelected(false); |
||||||
|
} else { |
||||||
|
item.setSelected && item.setSelected(true); |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
populate: function (items) { |
||||||
|
var self = this; |
||||||
|
var args = [].slice.call(arguments); |
||||||
|
var linkHashMap = new BI.LinkHashMap(); |
||||||
|
var val = function (item) { |
||||||
|
return item.id || item.value; |
||||||
|
}; |
||||||
|
if (!this.buttons) { |
||||||
|
this.buttons = {}; |
||||||
|
} |
||||||
|
// 所有已存在的和新添加的
|
||||||
|
var willCreated = []; |
||||||
|
BI.each(items, function (i, item) { |
||||||
|
item = BI.stripEL(item); |
||||||
|
if (self.buttons[val(item)]) { |
||||||
|
var ob = self.buttons[val(item)]; |
||||||
|
args[0] = item.items; |
||||||
|
args[2] = item; |
||||||
|
ob.populate && ob.populate.apply(ob, args); |
||||||
|
} else { |
||||||
|
willCreated.push(item); |
||||||
|
} |
||||||
|
}); |
||||||
|
// 创建新元素
|
||||||
|
args[0] = willCreated; |
||||||
|
var newBtns = this._btnsCreator.apply(this, args); |
||||||
|
|
||||||
|
// 整理
|
||||||
|
var array = []; |
||||||
|
BI.each(items, function (i, item) { |
||||||
|
item = BI.stripEL(item); |
||||||
|
var button = self.buttons[val(item)] || newBtns[val(item)]; |
||||||
|
linkHashMap.add(val(item), button); |
||||||
|
array.push(button); |
||||||
|
}); |
||||||
|
this.buttons = linkHashMap.map; |
||||||
|
|
||||||
|
BI.DOM.hang(this.buttons); |
||||||
|
this.element.empty(); |
||||||
|
|
||||||
|
var packages = this._packageItems(items, this._packageBtns(array)); |
||||||
|
BI.createWidget(BI.extend({element: this}, this._packageLayout(packages))); |
||||||
|
}, |
||||||
|
|
||||||
|
getIndexByValue: function () { |
||||||
|
throw new Error("Can not use getIndexByValue"); |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.shortcut("bi.filter_list", FilterList); |
||||||
|
}()); |
||||||
@ -0,0 +1,245 @@ |
|||||||
|
/** |
||||||
|
* 过滤条件 |
||||||
|
* |
||||||
|
* Created by GUY on 2015/9/25. |
||||||
|
* @class BI.FilterOperation |
||||||
|
* @extend BI.Widget |
||||||
|
*/ |
||||||
|
!(function () { |
||||||
|
var OPERATION_ADD_CONDITION = 0, OPERATION_ADD_ANDOR_CONDITION = 1; |
||||||
|
var FilterOperation = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "bi-filter-operation", |
||||||
|
expander: {}, |
||||||
|
items: [], |
||||||
|
selections: [BI.AbstractFilterItem.FILTER_OPERATION_CONDITION, BI.AbstractFilterItem.FILTER_OPERATION_FORMULA], |
||||||
|
itemsCreator: BI.emptyFn |
||||||
|
}, |
||||||
|
|
||||||
|
render: function () { |
||||||
|
var self = this, o = this.options; |
||||||
|
this.currentSelected = null; |
||||||
|
|
||||||
|
return { |
||||||
|
type: "bi.vtape", |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.tab", |
||||||
|
showIndex: OPERATION_ADD_CONDITION, |
||||||
|
cardCreator: BI.bind(this._createTabs, this), |
||||||
|
ref: function (_ref) { |
||||||
|
self.buttonComboTab = _ref; |
||||||
|
} |
||||||
|
}, |
||||||
|
height: 40 |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: "bi.absolute", |
||||||
|
scrollable: true, |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.left", |
||||||
|
items: [{ |
||||||
|
type: "bi.filter_pane", |
||||||
|
expander: o.expander, |
||||||
|
items: o.items, |
||||||
|
itemsCreator: o.itemsCreator, |
||||||
|
listeners: [{ |
||||||
|
eventName: "EVENT_CHANGE", |
||||||
|
action: function (type, value, obj) { |
||||||
|
if (type === BI.Events.CLICK) { |
||||||
|
if (BI.isNotNull(self.currentSelected) && self.currentSelected === obj) { |
||||||
|
obj.setSelectedCondition(!obj.isSelectedCondition()); |
||||||
|
} else { |
||||||
|
if (BI.isNotNull(self.currentSelected)) { |
||||||
|
self.currentSelected.setSelectedCondition(false); |
||||||
|
} |
||||||
|
self.currentSelected = obj; |
||||||
|
obj.setSelectedCondition(true); |
||||||
|
} |
||||||
|
if (self.currentSelected.isSelectedCondition()) { |
||||||
|
self.buttonComboTab.setSelect(OPERATION_ADD_ANDOR_CONDITION); |
||||||
|
} else { |
||||||
|
self.buttonComboTab.setSelect(OPERATION_ADD_CONDITION); |
||||||
|
} |
||||||
|
} |
||||||
|
if (type === BI.Events.DESTROY) { |
||||||
|
if (self.currentSelected === obj) { |
||||||
|
self.currentSelected = null; |
||||||
|
self.buttonComboTab.setSelect(OPERATION_ADD_CONDITION); |
||||||
|
} |
||||||
|
self.fireEvent("BI.FilterOperation.EVENT_DESTROY_ITEM", value, obj); |
||||||
|
} |
||||||
|
} |
||||||
|
}], |
||||||
|
ref: function (_ref) { |
||||||
|
self.filter = _ref; |
||||||
|
} |
||||||
|
}] |
||||||
|
}, |
||||||
|
top: 0, |
||||||
|
right: 2, |
||||||
|
bottom: 0, |
||||||
|
left: 0 |
||||||
|
}] |
||||||
|
} |
||||||
|
}] |
||||||
|
}; |
||||||
|
}, |
||||||
|
|
||||||
|
_createTabs: function (v) { |
||||||
|
var self = this; |
||||||
|
switch (v) { |
||||||
|
case OPERATION_ADD_CONDITION: |
||||||
|
return { |
||||||
|
type: "bi.button_group", |
||||||
|
items: BI.createItems(self._createButtons(), { |
||||||
|
type: "bi.icon_text_item", |
||||||
|
height: 30, |
||||||
|
width: 100 |
||||||
|
}), |
||||||
|
chooseType: BI.ButtonGroup.CHOOSE_TYPE_DEFAULT, |
||||||
|
layouts: [{ |
||||||
|
type: "bi.left", |
||||||
|
vgap: 5 |
||||||
|
}], |
||||||
|
listeners: [{ |
||||||
|
eventName: BI.ButtonGroup.EVENT_CHANGE, |
||||||
|
action: function (value, obj) { |
||||||
|
if (BI.isEmptyArray(self.filter.getValue())) { |
||||||
|
self.filter.element.addClass("bi-border-top bi-border-left"); |
||||||
|
} |
||||||
|
self.fireEvent("EVENT_OPERATION", obj.getValue()); |
||||||
|
self.defaultState(); |
||||||
|
} |
||||||
|
}] |
||||||
|
}; |
||||||
|
case OPERATION_ADD_ANDOR_CONDITION: |
||||||
|
return { |
||||||
|
type: "bi.button_group", |
||||||
|
chooseType: BI.ButtonGroup.CHOOSE_TYPE_DEFAULT, |
||||||
|
items: self._buildOperationButton(), |
||||||
|
layouts: [{ |
||||||
|
type: "bi.left", |
||||||
|
vgap: 5 |
||||||
|
}] |
||||||
|
}; |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
_createButtons: function () { |
||||||
|
var buttons = []; |
||||||
|
BI.each(this.options.selections, function (i, type) { |
||||||
|
switch (type) { |
||||||
|
case BI.AbstractFilterItem.FILTER_OPERATION_FORMULA: |
||||||
|
buttons.push({ |
||||||
|
text: BI.i18nText("BI-Conf_Add_Formula"), |
||||||
|
value: BI.AbstractFilterItem.FILTER_OPERATION_FORMULA, |
||||||
|
cls: "operation-trigger filter-formula-font" |
||||||
|
}); |
||||||
|
break; |
||||||
|
case BI.AbstractFilterItem.FILTER_OPERATION_CONDITION: |
||||||
|
buttons.push({ |
||||||
|
text: BI.i18nText("BI-Conf_Add_Condition"), |
||||||
|
value: BI.AbstractFilterItem.FILTER_OPERATION_CONDITION, |
||||||
|
cls: "operation-trigger filter-condition-font" |
||||||
|
}); |
||||||
|
break; |
||||||
|
} |
||||||
|
}); |
||||||
|
return buttons; |
||||||
|
}, |
||||||
|
|
||||||
|
_buildOperationButton: function () { |
||||||
|
var self = this, combos = []; |
||||||
|
BI.each(this.options.selections, function (i, type) { |
||||||
|
var text = "", cls = "", items = []; |
||||||
|
switch (type) { |
||||||
|
case BI.AbstractFilterItem.FILTER_OPERATION_FORMULA: |
||||||
|
text = BI.i18nText("BI-Conf_Add_Formula"); |
||||||
|
cls = "filter-formula-font"; |
||||||
|
items = BI.Constants.getConstant("bi.constant.component.filter").FORMULA_COMBO; |
||||||
|
break; |
||||||
|
case BI.AbstractFilterItem.FILTER_OPERATION_CONDITION: |
||||||
|
default: |
||||||
|
text = BI.i18nText("BI-Conf_Add_Condition"); |
||||||
|
cls = "filter-condition-font"; |
||||||
|
items = BI.Constants.getConstant("bi.constant.component.filter").CONDITION_COMBO; |
||||||
|
break; |
||||||
|
} |
||||||
|
|
||||||
|
var trigger = BI.createWidget({ |
||||||
|
type: "bi.icon_text_item", |
||||||
|
cls: "operation-trigger " + cls, |
||||||
|
text: text, |
||||||
|
height: 30, |
||||||
|
width: 100 |
||||||
|
}); |
||||||
|
combos.push({ |
||||||
|
type: "bi.combo", |
||||||
|
el: trigger, |
||||||
|
popup: { |
||||||
|
el: { |
||||||
|
type: "bi.button_group", |
||||||
|
chooseType: BI.ButtonGroup.CHOOSE_TYPE_NONE, |
||||||
|
items: BI.createItems(items, { |
||||||
|
type: "bi.single_select_item", |
||||||
|
height: 25 |
||||||
|
}), |
||||||
|
layouts: [{ |
||||||
|
type: "bi.vertical" |
||||||
|
}] |
||||||
|
} |
||||||
|
}, |
||||||
|
listeners: [{ |
||||||
|
eventName: BI.Combo.EVENT_CHANGE, |
||||||
|
action: function (value, obj) { |
||||||
|
if (BI.isEmptyArray(self.filter.getValue())) { |
||||||
|
self.filter.element.addClass("bi-border-top bi-border-left"); |
||||||
|
} |
||||||
|
|
||||||
|
switch (value) { |
||||||
|
case BI.AbstractFilterItem.FILTER_OPERATION_CONDITION_AND: |
||||||
|
case BI.AbstractFilterItem.FILTER_OPERATION_CONDITION_OR: |
||||||
|
trigger.setText(BI.i18nText("BI-Conf_Add_Condition")); |
||||||
|
break; |
||||||
|
case BI.AbstractFilterItem.FILTER_OPERATION_FORMULA_AND: |
||||||
|
case BI.AbstractFilterItem.FILTER_OPERATION_FORMULA_OR: |
||||||
|
trigger.setText(BI.i18nText("BI-Conf_Add_Formula")); |
||||||
|
break; |
||||||
|
default: |
||||||
|
trigger.setText(); |
||||||
|
} |
||||||
|
self.fireEvent("EVENT_OPERATION", obj.getValue()); |
||||||
|
self.defaultState(); |
||||||
|
this.hideView(); |
||||||
|
} |
||||||
|
}] |
||||||
|
}); |
||||||
|
}); |
||||||
|
return combos; |
||||||
|
}, |
||||||
|
|
||||||
|
defaultState: function () { |
||||||
|
if (BI.isNotNull(this.currentSelected)) { |
||||||
|
this.currentSelected.setSelectedCondition(false); |
||||||
|
} |
||||||
|
this.buttonComboTab.setSelect(OPERATION_ADD_CONDITION); |
||||||
|
}, |
||||||
|
|
||||||
|
getCurrentSelectItem: function () { |
||||||
|
if (BI.isNotNull(this.currentSelected) && this.currentSelected.isSelectedCondition()) { |
||||||
|
return this.currentSelected; |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
populate: function (items) { |
||||||
|
this.filter.populate.apply(this.filter, arguments); |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
return this.filter.getValue(); |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.shortcut("bi.filter_operation", FilterOperation); |
||||||
|
}()); |
||||||
@ -0,0 +1,62 @@ |
|||||||
|
/** |
||||||
|
* @class BI.FilterPane |
||||||
|
* @extend BI.Widget |
||||||
|
* 过滤面板 |
||||||
|
*/ |
||||||
|
!(function () { |
||||||
|
var FilterPane = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "bi-filter-pane", |
||||||
|
expander: {}, |
||||||
|
items: [], |
||||||
|
itemsCreator: BI.emptyFn |
||||||
|
}, |
||||||
|
|
||||||
|
render: function () { |
||||||
|
var self = this, o = this.options; |
||||||
|
return { |
||||||
|
type: "bi.custom_tree", |
||||||
|
cls: BI.isNotEmptyArray(o.items) ? "bi-border-top bi-border-left" : "", |
||||||
|
expander: BI.extend({ |
||||||
|
type: "bi.filter_expander", |
||||||
|
el: {}, |
||||||
|
popup: { |
||||||
|
type: "bi.custom_tree" |
||||||
|
} |
||||||
|
}, o.expander), |
||||||
|
el: { |
||||||
|
type: "bi.filter_list", |
||||||
|
chooseType: BI.ButtonGroup.CHOOSE_TYPE_DEFAULT, |
||||||
|
layouts: [{ |
||||||
|
type: "bi.vertical", |
||||||
|
scrolly: false |
||||||
|
}] |
||||||
|
}, |
||||||
|
items: o.items, |
||||||
|
listeners: [{ |
||||||
|
eventName: BI.Controller.EVENT_CHANGE, |
||||||
|
action: function () { |
||||||
|
self.fireEvent("EVENT_CHANGE", arguments); |
||||||
|
} |
||||||
|
}], |
||||||
|
ref: function (_ref) { |
||||||
|
self.tree = _ref; |
||||||
|
} |
||||||
|
}; |
||||||
|
}, |
||||||
|
|
||||||
|
populate: function (items) { |
||||||
|
if (BI.isNotEmptyArray(items)) { |
||||||
|
this.element.addClass("bi-border-top bi-border-left"); |
||||||
|
} else { |
||||||
|
this.element.removeClass("bi-border-top bi-border-left"); |
||||||
|
} |
||||||
|
this.tree.populate.apply(this.tree, arguments); |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
return this.tree.getValue(); |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.shortcut("bi.filter_pane", FilterPane); |
||||||
|
}()); |
||||||
Loading…
Reference in new issue