56 changed files with 5709 additions and 4527 deletions
@ -1,113 +1,121 @@ |
|||||||
/** |
import { |
||||||
* |
shortcut, |
||||||
* @class BI.MultiSelectCheckPane |
Widget, |
||||||
* @extends BI.Widget |
extend, |
||||||
*/ |
emptyFn, |
||||||
BI.MultiSelectCheckPane = BI.inherit(BI.Widget, { |
createWidget, |
||||||
|
map, |
||||||
|
i18nText, |
||||||
|
VerticalAdaptLayout, VTapeLayout |
||||||
|
} from "@/core"; |
||||||
|
import { TextButton, Label } from "@/base"; |
||||||
|
import { DisplaySelectedList } from "./multiselect.display"; |
||||||
|
|
||||||
constants: { |
@shortcut() |
||||||
height: 12, |
export class MultiSelectCheckPane extends Widget { |
||||||
lgap: 10, |
static xtype = "bi.multi_select_check_pane"; |
||||||
tgap: 10, |
|
||||||
bgap: 5 |
constants = { height: 12, lgap: 10, tgap: 10, bgap: 5 }; |
||||||
}, |
|
||||||
|
|
||||||
_defaultConfig: function () { |
_defaultConfig() { |
||||||
return BI.extend(BI.MultiSelectCheckPane.superclass._defaultConfig.apply(this, arguments), { |
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-multi-select-check-pane bi-background", |
baseCls: "bi-multi-select-check-pane bi-background", |
||||||
items: [], |
items: [], |
||||||
itemsCreator: BI.emptyFn, |
itemsCreator: emptyFn, |
||||||
valueFormatter: BI.emptyFn, |
valueFormatter: emptyFn, |
||||||
onClickContinueSelect: BI.emptyFn |
onClickContinueSelect: emptyFn, |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.MultiSelectCheckPane.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
|
|
||||||
var self = this, opts = this.options; |
const self = this, |
||||||
|
opts = this.options; |
||||||
|
|
||||||
this.storeValue = opts.value || {}; |
this.storeValue = opts.value || {}; |
||||||
this.display = BI.createWidget({ |
this.display = createWidget({ |
||||||
type: "bi.display_selected_list", |
type: DisplaySelectedList.xtype, |
||||||
items: opts.items, |
items: opts.items, |
||||||
itemsCreator: function (op, callback) { |
itemsCreator(op, callback) { |
||||||
op = BI.extend(op || {}, { |
op = extend(op || {}, { |
||||||
selectedValues: self.storeValue.value |
selectedValues: self.storeValue.value, |
||||||
}); |
}); |
||||||
if (self.storeValue.type === BI.Selection.Multi) { |
if (self.storeValue.type === BI.Selection.Multi) { |
||||||
callback({ |
callback({ |
||||||
items: BI.map(self.storeValue.value, function (i, v) { |
items: map(self.storeValue.value, (i, v) => { |
||||||
var txt = opts.valueFormatter(v) || v; |
const txt = opts.valueFormatter(v) || v; |
||||||
|
|
||||||
return { |
return { |
||||||
text: txt, |
text: txt, |
||||||
value: v, |
value: v, |
||||||
title: txt |
title: txt, |
||||||
}; |
}; |
||||||
}) |
}), |
||||||
}); |
}); |
||||||
|
|
||||||
return; |
return; |
||||||
} |
} |
||||||
opts.itemsCreator(op, callback); |
opts.itemsCreator(op, callback); |
||||||
} |
}, |
||||||
}); |
}); |
||||||
|
|
||||||
this.continueSelect = BI.createWidget({ |
this.continueSelect = createWidget({ |
||||||
type: "bi.text_button", |
type: TextButton.xtype, |
||||||
title: BI.i18nText("BI-Continue_Select"), |
title: i18nText("BI-Continue_Select"), |
||||||
text: BI.i18nText("BI-Continue_Select"), |
text: i18nText("BI-Continue_Select"), |
||||||
cls: "multi-select-check-selected bi-high-light" |
cls: "multi-select-check-selected bi-high-light", |
||||||
}); |
}); |
||||||
|
|
||||||
this.continueSelect.on(BI.TextButton.EVENT_CHANGE, function () { |
this.continueSelect.on(TextButton.EVENT_CHANGE, () => { |
||||||
opts.onClickContinueSelect(); |
opts.onClickContinueSelect(); |
||||||
}); |
}); |
||||||
|
|
||||||
BI.createWidget({ |
createWidget({ |
||||||
type: "bi.vtape", |
type: VTapeLayout.xtype, |
||||||
element: this, |
element: this, |
||||||
items: [{ |
items: [ |
||||||
|
{ |
||||||
height: this.constants.height, |
height: this.constants.height, |
||||||
el: { |
el: { |
||||||
type: "bi.vertical_adapt", |
type: VerticalAdaptLayout.xtype, |
||||||
columnSize: ["auto", "auto"], |
columnSize: ["auto", "auto"], |
||||||
cls: "multi-select-continue-select", |
cls: "multi-select-continue-select", |
||||||
items: [ |
items: [ |
||||||
{ |
{ |
||||||
el: { |
el: { |
||||||
type: "bi.label", |
type: Label.xtype, |
||||||
title: BI.i18nText("BI-Selected_Data"), |
title: i18nText("BI-Selected_Data"), |
||||||
text: BI.i18nText("BI-Selected_Data") |
text: i18nText("BI-Selected_Data"), |
||||||
}, |
}, |
||||||
lgap: this.constants.lgap |
lgap: this.constants.lgap, |
||||||
}, |
}, |
||||||
{ |
{ |
||||||
el: this.continueSelect, |
el: this.continueSelect, |
||||||
hgap: this.constants.lgap |
hgap: this.constants.lgap, |
||||||
}] |
} |
||||||
|
], |
||||||
|
}, |
||||||
|
tgap: this.constants.tgap, |
||||||
}, |
}, |
||||||
tgap: this.constants.tgap |
{ |
||||||
}, { |
|
||||||
height: "fill", |
height: "fill", |
||||||
el: this.display, |
el: this.display, |
||||||
tgap: this.constants.bgap |
tgap: this.constants.bgap, |
||||||
}] |
} |
||||||
|
], |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
this.storeValue = v || {}; |
this.storeValue = v || {}; |
||||||
}, |
} |
||||||
|
|
||||||
empty: function () { |
empty() { |
||||||
this.display.empty(); |
this.display.empty(); |
||||||
}, |
|
||||||
|
|
||||||
populate: function () { |
|
||||||
this.display.populate.apply(this.display, arguments); |
|
||||||
} |
} |
||||||
}); |
|
||||||
|
|
||||||
BI.shortcut("bi.multi_select_check_pane", BI.MultiSelectCheckPane); |
populate() { |
||||||
|
this.display.populate(...arguments); |
||||||
|
} |
||||||
|
} |
||||||
|
@ -1,106 +1,112 @@ |
|||||||
/** |
import { |
||||||
* |
shortcut, |
||||||
* |
extend, |
||||||
* 查看已选弹出层的展示面板 |
emptyFn, |
||||||
* @class BI.DisplaySelectedList |
createWidget, |
||||||
* @extends BI.Widget |
VerticalLayout, |
||||||
*/ |
createItems |
||||||
BI.DisplaySelectedList = BI.inherit(BI.Pane, { |
} from "@/core"; |
||||||
|
import { Pane, ButtonGroup, Loader, IconTextItem } from "@/base"; |
||||||
|
import { ListPane } from "@/case"; |
||||||
|
|
||||||
constants: { |
@shortcut() |
||||||
height: 24, |
export class DisplaySelectedList extends Pane { |
||||||
lgap: 10 |
static xtype = "bi.display_selected_list"; |
||||||
}, |
|
||||||
|
constants = { height: 24, lgap: 10 }; |
||||||
|
|
||||||
_defaultConfig: function () { |
_defaultConfig() { |
||||||
return BI.extend(BI.DisplaySelectedList.superclass._defaultConfig.apply(this, arguments), { |
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-display-list", |
baseCls: "bi-display-list", |
||||||
itemsCreator: BI.emptyFn, |
itemsCreator: emptyFn, |
||||||
items: [] |
items: [], |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.DisplaySelectedList.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
|
|
||||||
var self = this, opts = this.options; |
const self = this, |
||||||
|
opts = this.options; |
||||||
|
|
||||||
this.hasNext = false; |
this.hasNext = false; |
||||||
var cacheItems = []; |
let cacheItems = []; |
||||||
|
|
||||||
this.button_group = BI.createWidget({ |
this.button_group = createWidget({ |
||||||
type: "bi.list_pane", |
type: ListPane.xtype, |
||||||
element: this, |
element: this, |
||||||
el: { |
el: { |
||||||
type: "bi.loader", |
type: Loader.xtype, |
||||||
isDefaultInit: false, |
isDefaultInit: false, |
||||||
logic: { |
logic: { |
||||||
dynamic: true, |
dynamic: true, |
||||||
scrolly: true |
scrolly: true, |
||||||
}, |
}, |
||||||
items: this._createItems(opts.items), |
items: this._createItems(opts.items), |
||||||
chooseType: BI.ButtonGroup.CHOOSE_TYPE_MULTI, |
chooseType: ButtonGroup.CHOOSE_TYPE_MULTI, |
||||||
layouts: [ |
layouts: [ |
||||||
{ |
{ |
||||||
type: "bi.vertical", |
type: VerticalLayout.xtype, |
||||||
lgap: 10 |
lgap: 10, |
||||||
} |
} |
||||||
] |
], |
||||||
}, |
}, |
||||||
itemsCreator: function (options, callback) { |
itemsCreator (options, callback) { |
||||||
if (options.times === 1) { |
if (options.times === 1) { |
||||||
cacheItems = []; |
cacheItems = []; |
||||||
} |
} |
||||||
|
|
||||||
if (cacheItems.length > 0) { |
if (cacheItems.length > 0) { |
||||||
var renderedItems = cacheItems.slice(0, 100); |
const renderedItems = cacheItems.slice(0, 100); |
||||||
cacheItems = cacheItems.slice(100); |
cacheItems = cacheItems.slice(100); |
||||||
self.hasNext = cacheItems.length > 0; |
self.hasNext = cacheItems.length > 0; |
||||||
callback(self._createItems(renderedItems)); |
callback(self._createItems(renderedItems)); |
||||||
|
|
||||||
return; |
return; |
||||||
} |
} |
||||||
|
|
||||||
opts.itemsCreator(options, function (ob) { |
opts.itemsCreator(options, ob => { |
||||||
self.hasNext = !!ob.hasNext; |
self.hasNext = !!ob.hasNext; |
||||||
var firstItemsCount = 100 + ob.items.length % 100; |
const firstItemsCount = 100 + (ob.items.length % 100); |
||||||
if (ob.items.length > 100) { |
if (ob.items.length > 100) { |
||||||
cacheItems = ob.items.slice(firstItemsCount); |
cacheItems = ob.items.slice(firstItemsCount); |
||||||
self.hasNext = (firstItemsCount === ob.items.length) ? false : true; |
self.hasNext = |
||||||
|
firstItemsCount !== ob.items.length; |
||||||
} |
} |
||||||
callback(self._createItems(ob.items.slice(0, firstItemsCount))); |
callback( |
||||||
|
self._createItems(ob.items.slice(0, firstItemsCount)) |
||||||
|
); |
||||||
}); |
}); |
||||||
}, |
}, |
||||||
hasNext: function () { |
hasNext () { |
||||||
return self.hasNext; |
return self.hasNext; |
||||||
} |
|
||||||
}); |
|
||||||
}, |
}, |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
_createItems: function (items) { |
_createItems(items) { |
||||||
return BI.createItems(items, { |
return createItems(items, { |
||||||
type: "bi.icon_text_item", |
type: IconTextItem.xtype, |
||||||
cls: "cursor-default check-font icon-size-12 display-list-item bi-tips", |
cls: "cursor-default check-font icon-size-12 display-list-item bi-tips", |
||||||
once: true, |
once: true, |
||||||
invalid: true, |
invalid: true, |
||||||
selected: true, |
selected: true, |
||||||
height: this.constants.height, |
height: this.constants.height, |
||||||
logic: { |
logic: { |
||||||
dynamic: true |
dynamic: true, |
||||||
} |
|
||||||
}); |
|
||||||
}, |
}, |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
empty: function () { |
empty() { |
||||||
this.button_group.empty(); |
this.button_group.empty(); |
||||||
}, |
} |
||||||
|
|
||||||
populate: function (items) { |
populate(items) { |
||||||
if (arguments.length === 0) { |
if (arguments.length === 0) { |
||||||
this.button_group.populate(); |
this.button_group.populate(); |
||||||
} else { |
} else { |
||||||
this.button_group.populate(this._createItems(items)); |
this.button_group.populate(this._createItems(items)); |
||||||
} |
} |
||||||
} |
} |
||||||
}); |
} |
||||||
|
|
||||||
BI.shortcut("bi.display_selected_list", BI.DisplaySelectedList); |
|
||||||
|
@ -1,185 +1,242 @@ |
|||||||
/** |
import { |
||||||
* 多选加载数据面板 |
shortcut, |
||||||
* Created by guy on 15/11/2. |
Widget, |
||||||
* @class BI.MultiSelectNoBarLoader |
extend, |
||||||
* @extends Widget |
emptyFn, |
||||||
*/ |
createWidget, |
||||||
BI.MultiSelectNoBarLoader = BI.inherit(BI.Widget, { |
isKey, |
||||||
|
map, |
||||||
_defaultConfig: function () { |
contains, |
||||||
return BI.extend(BI.MultiSelectNoBarLoader.superclass._defaultConfig.apply(this, arguments), { |
remove, |
||||||
|
Controller, |
||||||
|
VerticalLayout, |
||||||
|
delay, |
||||||
|
isNotNull, |
||||||
|
toPix, |
||||||
|
Selection, |
||||||
|
pushDistinct |
||||||
|
} from "@/core"; |
||||||
|
import { ButtonGroup, Loader } from "@/base"; |
||||||
|
import { SelectList, ListPane, MultiSelectItem } from "@/case"; |
||||||
|
|
||||||
|
@shortcut() |
||||||
|
export class MultiSelectNoBarLoader extends Widget { |
||||||
|
static xtype = "bi.multi_select_no_bar_loader"; |
||||||
|
|
||||||
|
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
|
||||||
|
_defaultConfig() { |
||||||
|
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-multi-select-loader", |
baseCls: "bi-multi-select-loader", |
||||||
logic: { |
logic: { |
||||||
dynamic: true |
dynamic: true, |
||||||
}, |
}, |
||||||
el: { |
el: { |
||||||
height: 400 |
height: 400, |
||||||
}, |
}, |
||||||
valueFormatter: BI.emptyFn, |
valueFormatter: emptyFn, |
||||||
itemsCreator: BI.emptyFn, |
itemsCreator: emptyFn, |
||||||
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, |
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, |
||||||
onLoaded: BI.emptyFn, |
onLoaded: emptyFn, |
||||||
itemFormatter: BI.emptyFn, |
itemFormatter: emptyFn, |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.MultiSelectNoBarLoader.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
|
|
||||||
var self = this, opts = this.options; |
const self = this, |
||||||
var hasNext = false; |
opts = this.options; |
||||||
|
let hasNext = false; |
||||||
|
|
||||||
this.storeValue = opts.value || {}; |
this.storeValue = opts.value || {}; |
||||||
this._assertValue(this.storeValue); |
this._assertValue(this.storeValue); |
||||||
|
|
||||||
this.button_group = BI.createWidget(BI.extend({ |
this.button_group = createWidget( |
||||||
type: "bi.list_pane", |
extend( |
||||||
|
{ |
||||||
|
type: ListPane.xtype, |
||||||
onLoaded: opts.onLoaded, |
onLoaded: opts.onLoaded, |
||||||
el: { |
el: { |
||||||
type: "bi.loader", |
type: Loader.xtype, |
||||||
isDefaultInit: false, |
isDefaultInit: false, |
||||||
logic: { |
logic: { |
||||||
dynamic: true, |
dynamic: true, |
||||||
scrolly: true |
scrolly: true, |
||||||
}, |
}, |
||||||
el: { |
el: { |
||||||
chooseType: BI.ButtonGroup.CHOOSE_TYPE_MULTI, |
chooseType: ButtonGroup.CHOOSE_TYPE_MULTI, |
||||||
behaviors: { |
behaviors: { |
||||||
redmark: function () { |
redmark() { |
||||||
return true; |
return true; |
||||||
} |
|
||||||
}, |
}, |
||||||
layouts: [{ |
|
||||||
type: "bi.vertical" |
|
||||||
}] |
|
||||||
} |
|
||||||
}, |
}, |
||||||
itemsCreator: function (op, callback) { |
layouts: [ |
||||||
var startValue = self._startValue; |
{ |
||||||
self.storeValue && (op = BI.extend(op || {}, { |
type: VerticalLayout.xtype, |
||||||
selectedValues: BI.isKey(startValue) && self.storeValue.type === BI.Selection.Multi |
} |
||||||
? self.storeValue.value.concat(startValue) : self.storeValue.value |
], |
||||||
|
}, |
||||||
|
}, |
||||||
|
itemsCreator(op, callback) { |
||||||
|
const startValue = self._startValue; |
||||||
|
self.storeValue && |
||||||
|
(op = extend(op || {}, { |
||||||
|
selectedValues: |
||||||
|
isKey(startValue) && |
||||||
|
self.storeValue.type === Selection.Multi |
||||||
|
? self.storeValue.value.concat( |
||||||
|
startValue |
||||||
|
) |
||||||
|
: self.storeValue.value, |
||||||
})); |
})); |
||||||
opts.itemsCreator(op, function (ob) { |
opts.itemsCreator(op, ob => { |
||||||
hasNext = ob.hasNext; |
hasNext = ob.hasNext; |
||||||
var firstItems = []; |
let firstItems = []; |
||||||
if (op.times === 1 && self.storeValue) { |
if (op.times === 1 && self.storeValue) { |
||||||
var json = BI.map(self.storeValue.value, function (i, v) { |
const json = map( |
||||||
var txt = opts.valueFormatter(v) || v; |
self.storeValue.value, |
||||||
|
(i, v) => { |
||||||
|
const txt = opts.valueFormatter(v) || v; |
||||||
|
|
||||||
return { |
return { |
||||||
text: txt, |
text: txt, |
||||||
value: v, |
value: v, |
||||||
title: txt, |
title: txt, |
||||||
selected: self.storeValue.type === BI.Selection.Multi |
selected: |
||||||
|
self.storeValue.type === |
||||||
|
Selection.Multi, |
||||||
}; |
}; |
||||||
}); |
} |
||||||
if (BI.isKey(self._startValue) && !BI.contains(self.storeValue.value, self._startValue)) { |
); |
||||||
var txt = opts.valueFormatter(startValue) || startValue; |
if ( |
||||||
|
isKey(self._startValue) && |
||||||
|
!contains( |
||||||
|
self.storeValue.value, |
||||||
|
self._startValue |
||||||
|
) |
||||||
|
) { |
||||||
|
const txt = |
||||||
|
opts.valueFormatter(startValue) || |
||||||
|
startValue; |
||||||
json.unshift({ |
json.unshift({ |
||||||
text: txt, |
text: txt, |
||||||
value: startValue, |
value: startValue, |
||||||
title: txt, |
title: txt, |
||||||
selected: true |
selected: true, |
||||||
}); |
}); |
||||||
} |
} |
||||||
firstItems = self._createItems(json); |
firstItems = self._createItems(json); |
||||||
} |
} |
||||||
callback(firstItems.concat(self._createItems(ob.items)), ob.keyword || ""); |
callback( |
||||||
|
firstItems.concat(self._createItems(ob.items)), |
||||||
|
ob.keyword || "" |
||||||
|
); |
||||||
if (op.times === 1 && self.storeValue) { |
if (op.times === 1 && self.storeValue) { |
||||||
BI.isKey(startValue) && (self.storeValue.type === BI.Selection.All ? BI.remove(self.storeValue.value, startValue) : BI.pushDistinct(self.storeValue.value, startValue)); |
isKey(startValue) && |
||||||
|
(self.storeValue.type === Selection.All |
||||||
|
? remove( |
||||||
|
self.storeValue.value, |
||||||
|
startValue |
||||||
|
) |
||||||
|
: pushDistinct( |
||||||
|
self.storeValue.value, |
||||||
|
startValue |
||||||
|
)); |
||||||
self.setValue(self.storeValue); |
self.setValue(self.storeValue); |
||||||
} |
} |
||||||
(op.times === 1) && self._scrollToTop(); |
op.times === 1 && self._scrollToTop(); |
||||||
}); |
}); |
||||||
}, |
}, |
||||||
hasNext: function () { |
hasNext() { |
||||||
return hasNext; |
return hasNext; |
||||||
}, |
}, |
||||||
value: this.storeValue |
value: this.storeValue, |
||||||
}, opts.el)); |
}, |
||||||
|
opts.el |
||||||
|
) |
||||||
|
); |
||||||
|
|
||||||
BI.createWidget({ |
createWidget({ |
||||||
type: "bi.vertical", |
type: VerticalLayout.xtype, |
||||||
element: this, |
element: this, |
||||||
items: [this.button_group], |
items: [this.button_group], |
||||||
vgap: 5 |
vgap: 5, |
||||||
}); |
}); |
||||||
|
|
||||||
this.button_group.on(BI.Controller.EVENT_CHANGE, function () { |
this.button_group.on(Controller.EVENT_CHANGE, function () { |
||||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
self.fireEvent(Controller.EVENT_CHANGE, arguments); |
||||||
}); |
}); |
||||||
this.button_group.on(BI.SelectList.EVENT_CHANGE, function () { |
this.button_group.on(SelectList.EVENT_CHANGE, function () { |
||||||
self.fireEvent(BI.MultiSelectNoBarLoader.EVENT_CHANGE, arguments); |
self.fireEvent(MultiSelectNoBarLoader.EVENT_CHANGE, arguments); |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_createItems: function (items) { |
_createItems(items) { |
||||||
return BI.map(items, (index, item) => { |
return map(items, (index, item) => { |
||||||
return { |
return { |
||||||
type: "bi.multi_select_item", |
type: MultiSelectItem.xtype, |
||||||
cls: "bi-list-item-active", |
cls: "bi-list-item-active", |
||||||
logic: this.options.logic, |
logic: this.options.logic, |
||||||
height: this.options.itemHeight || BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, |
height: |
||||||
|
this.options.itemHeight || |
||||||
|
BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, |
||||||
iconWrapperWidth: 36, |
iconWrapperWidth: 36, |
||||||
...item, |
...item, |
||||||
...this.options.itemFormatter(item), |
...this.options.itemFormatter(item), |
||||||
}; |
}; |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_scrollToTop: function () { |
_scrollToTop() { |
||||||
var self = this; |
const self = this; |
||||||
BI.delay(function () { |
delay(() => { |
||||||
self.button_group.element.scrollTop(0); |
self.button_group.element.scrollTop(0); |
||||||
}, 30); |
}, 30); |
||||||
}, |
} |
||||||
|
|
||||||
_assertValue: function (val) { |
_assertValue(val) { |
||||||
val || (val = {}); |
val || (val = {}); |
||||||
val.type || (val.type = BI.Selection.Multi); |
val.type || (val.type = Selection.Multi); |
||||||
val.value || (val.value = []); |
val.value || (val.value = []); |
||||||
}, |
} |
||||||
|
|
||||||
setStartValue: function (v) { |
setStartValue(v) { |
||||||
this._startValue = v; |
this._startValue = v; |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
this.storeValue = v || {}; |
this.storeValue = v || {}; |
||||||
this._assertValue(this.storeValue); |
this._assertValue(this.storeValue); |
||||||
this.button_group.setValue(this.storeValue.value); |
this.button_group.setValue(this.storeValue.value); |
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
return { |
return { |
||||||
type: BI.Selection.Multi, |
type: Selection.Multi, |
||||||
value: this.button_group.getValue() |
value: this.button_group.getValue(), |
||||||
}; |
}; |
||||||
}, |
} |
||||||
|
|
||||||
getAllButtons: function () { |
getAllButtons() { |
||||||
return this.button_group.getAllButtons(); |
return this.button_group.getAllButtons(); |
||||||
}, |
} |
||||||
|
|
||||||
empty: function () { |
empty() { |
||||||
this.button_group.empty(); |
this.button_group.empty(); |
||||||
}, |
} |
||||||
|
|
||||||
populate: function (items) { |
populate(items) { |
||||||
if (BI.isNotNull(items)) { |
if (isNotNull(items)) { |
||||||
arguments[0] = this._createItems(items); |
arguments[0] = this._createItems(items); |
||||||
} |
} |
||||||
this.button_group.populate.apply(this.button_group, arguments); |
this.button_group.populate(...arguments); |
||||||
}, |
} |
||||||
|
|
||||||
resetHeight: function (h) { |
|
||||||
this.button_group.element.css({ "max-height": BI.toPix(h) }); |
|
||||||
}, |
|
||||||
|
|
||||||
resetWidth: function () { |
|
||||||
|
|
||||||
|
resetHeight(h) { |
||||||
|
this.button_group.element.css({ "max-height": toPix(h) }); |
||||||
} |
} |
||||||
}); |
|
||||||
|
|
||||||
BI.MultiSelectNoBarLoader.EVENT_CHANGE = "EVENT_CHANGE"; |
resetWidth() { |
||||||
BI.shortcut("bi.multi_select_no_bar_loader", BI.MultiSelectNoBarLoader); |
} |
||||||
|
} |
||||||
|
@ -1,100 +1,113 @@ |
|||||||
/** |
import { |
||||||
* 带加载的多选下拉面板 |
shortcut, |
||||||
* @class BI.MultiSelectPopupView |
Widget, |
||||||
* @extends Widget |
extend, |
||||||
*/ |
emptyFn, |
||||||
BI.MultiSelectPopupView = BI.inherit(BI.Widget, { |
createWidget, |
||||||
|
i18nText |
||||||
_defaultConfig: function () { |
} from "@/core"; |
||||||
return BI.extend(BI.MultiSelectPopupView.superclass._defaultConfig.apply(this, arguments), { |
import { MultiPopupView } from "@/case"; |
||||||
|
import { MultiSelectLoader } from "./multiselect.loader"; |
||||||
|
|
||||||
|
@shortcut() |
||||||
|
export class MultiSelectPopupView extends Widget { |
||||||
|
static xtype = "bi.multi_select_popup_view"; |
||||||
|
|
||||||
|
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
static EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM"; |
||||||
|
static EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR"; |
||||||
|
|
||||||
|
_defaultConfig() { |
||||||
|
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-multi-select-popup-view", |
baseCls: "bi-multi-select-popup-view", |
||||||
maxWidth: "auto", |
maxWidth: "auto", |
||||||
minWidth: 135, |
minWidth: 135, |
||||||
maxHeight: 400, |
maxHeight: 400, |
||||||
valueFormatter: BI.emptyFn, |
valueFormatter: emptyFn, |
||||||
itemsCreator: BI.emptyFn, |
itemsCreator: emptyFn, |
||||||
onLoaded: BI.emptyFn, |
onLoaded: emptyFn, |
||||||
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, |
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.MultiSelectPopupView.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
var self = this, opts = this.options; |
const self = this, |
||||||
|
opts = this.options; |
||||||
|
|
||||||
this.loader = BI.createWidget({ |
this.loader = createWidget({ |
||||||
type: "bi.multi_select_loader", |
type: MultiSelectLoader.xtype, |
||||||
itemsCreator: opts.itemsCreator, |
itemsCreator: opts.itemsCreator, |
||||||
itemHeight: opts.itemHeight, |
itemHeight: opts.itemHeight, |
||||||
valueFormatter: opts.valueFormatter, |
valueFormatter: opts.valueFormatter, |
||||||
itemFormatter: opts.itemFormatter, |
itemFormatter: opts.itemFormatter, |
||||||
onLoaded: opts.onLoaded, |
onLoaded: opts.onLoaded, |
||||||
value: opts.value |
value: opts.value, |
||||||
}); |
}); |
||||||
|
|
||||||
this.popupView = BI.createWidget({ |
this.popupView = createWidget({ |
||||||
type: "bi.multi_popup_view", |
type: MultiPopupView.xtype, |
||||||
stopPropagation: false, |
stopPropagation: false, |
||||||
maxWidth: opts.maxWidth, |
maxWidth: opts.maxWidth, |
||||||
minWidth: opts.minWidth, |
minWidth: opts.minWidth, |
||||||
maxHeight: opts.maxHeight, |
maxHeight: opts.maxHeight, |
||||||
element: this, |
element: this, |
||||||
buttons: [BI.i18nText("BI-Basic_Clears"), BI.i18nText("BI-Basic_OK")], |
buttons: [i18nText("BI-Basic_Clears"), i18nText("BI-Basic_OK")], |
||||||
el: this.loader, |
el: this.loader, |
||||||
value: opts.value |
value: opts.value, |
||||||
}); |
}); |
||||||
|
|
||||||
this.popupView.on(BI.MultiPopupView.EVENT_CHANGE, function () { |
this.popupView.on(MultiPopupView.EVENT_CHANGE, () => { |
||||||
self.fireEvent(BI.MultiSelectPopupView.EVENT_CHANGE); |
self.fireEvent(MultiSelectPopupView.EVENT_CHANGE); |
||||||
}); |
}); |
||||||
this.popupView.on(BI.MultiPopupView.EVENT_CLICK_TOOLBAR_BUTTON, function (index) { |
this.popupView.on( |
||||||
|
MultiPopupView.EVENT_CLICK_TOOLBAR_BUTTON, |
||||||
|
index => { |
||||||
switch (index) { |
switch (index) { |
||||||
case 0: |
case 0: |
||||||
self.fireEvent(BI.MultiSelectPopupView.EVENT_CLICK_CLEAR); |
self.fireEvent(MultiSelectPopupView.EVENT_CLICK_CLEAR); |
||||||
break; |
break; |
||||||
case 1: |
case 1: |
||||||
self.fireEvent(BI.MultiSelectPopupView.EVENT_CLICK_CONFIRM); |
self.fireEvent( |
||||||
|
MultiSelectPopupView.EVENT_CLICK_CONFIRM |
||||||
|
); |
||||||
|
break; |
||||||
|
default: |
||||||
break; |
break; |
||||||
} |
} |
||||||
}); |
} |
||||||
}, |
); |
||||||
|
} |
||||||
|
|
||||||
isAllSelected: function () { |
isAllSelected() { |
||||||
return this.loader.isAllSelected(); |
return this.loader.isAllSelected(); |
||||||
}, |
} |
||||||
|
|
||||||
setStartValue: function (v) { |
setStartValue(v) { |
||||||
this.loader.setStartValue(v); |
this.loader.setStartValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
this.popupView.setValue(v); |
this.popupView.setValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
return this.popupView.getValue(); |
return this.popupView.getValue(); |
||||||
}, |
} |
||||||
|
|
||||||
populate: function (items) { |
populate(items) { |
||||||
this.popupView.populate.apply(this.popupView, arguments); |
this.popupView.populate(...arguments); |
||||||
}, |
} |
||||||
|
|
||||||
resetHeight: function (h) { |
resetHeight(h) { |
||||||
this.popupView.resetHeight(h); |
this.popupView.resetHeight(h); |
||||||
}, |
} |
||||||
|
|
||||||
resetWidth: function (w) { |
resetWidth(w) { |
||||||
this.popupView.resetWidth(w); |
this.popupView.resetWidth(w); |
||||||
}, |
} |
||||||
|
|
||||||
setDirection: function (direction, position) { |
setDirection(direction, position) { |
||||||
this.popupView.setDirection(direction, position); |
this.popupView.setDirection(direction, position); |
||||||
}, |
} |
||||||
}); |
} |
||||||
|
|
||||||
BI.MultiSelectPopupView.EVENT_CHANGE = "EVENT_CHANGE"; |
|
||||||
BI.MultiSelectPopupView.EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM"; |
|
||||||
BI.MultiSelectPopupView.EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR"; |
|
||||||
|
|
||||||
|
|
||||||
BI.shortcut("bi.multi_select_popup_view", BI.MultiSelectPopupView); |
|
||||||
|
@ -1,96 +1,109 @@ |
|||||||
/** |
import { |
||||||
* 带加载的多选下拉面板 |
shortcut, |
||||||
* @class BI.MultiSelectPopupView |
Widget, |
||||||
* @extends Widget |
extend, |
||||||
*/ |
emptyFn, |
||||||
BI.MultiSelectNoBarPopupView = BI.inherit(BI.Widget, { |
createWidget, |
||||||
|
i18nText |
||||||
|
} from "@/core"; |
||||||
|
import { MultiPopupView } from "@/case"; |
||||||
|
import { MultiSelectNoBarLoader } from "./multiselect.loader.nobar"; |
||||||
|
|
||||||
_defaultConfig: function () { |
@shortcut() |
||||||
return BI.extend(BI.MultiSelectNoBarPopupView.superclass._defaultConfig.apply(this, arguments), { |
export class MultiSelectNoBarPopupView extends Widget { |
||||||
|
static xtype = "bi.multi_select_no_bar_popup_view"; |
||||||
|
|
||||||
|
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
static EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM"; |
||||||
|
static EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR"; |
||||||
|
|
||||||
|
_defaultConfig() { |
||||||
|
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-multi-select-popup-view", |
baseCls: "bi-multi-select-popup-view", |
||||||
maxWidth: "auto", |
maxWidth: "auto", |
||||||
minWidth: 135, |
minWidth: 135, |
||||||
maxHeight: 400, |
maxHeight: 400, |
||||||
valueFormatter: BI.emptyFn, |
valueFormatter: emptyFn, |
||||||
itemsCreator: BI.emptyFn, |
itemsCreator: emptyFn, |
||||||
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, |
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, |
||||||
onLoaded: BI.emptyFn |
onLoaded: emptyFn, |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.MultiSelectNoBarPopupView.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
var self = this, opts = this.options; |
const self = this, |
||||||
|
opts = this.options; |
||||||
|
|
||||||
this.loader = BI.createWidget({ |
this.loader = createWidget({ |
||||||
type: "bi.multi_select_no_bar_loader", |
type: MultiSelectNoBarLoader.xtype, |
||||||
itemsCreator: opts.itemsCreator, |
itemsCreator: opts.itemsCreator, |
||||||
itemHeight: opts.itemHeight, |
itemHeight: opts.itemHeight, |
||||||
valueFormatter: opts.valueFormatter, |
valueFormatter: opts.valueFormatter, |
||||||
itemFormatter: opts.itemFormatter, |
itemFormatter: opts.itemFormatter, |
||||||
onLoaded: opts.onLoaded, |
onLoaded: opts.onLoaded, |
||||||
value: opts.value |
value: opts.value, |
||||||
}); |
}); |
||||||
|
|
||||||
this.popupView = BI.createWidget({ |
this.popupView = createWidget({ |
||||||
type: "bi.multi_popup_view", |
type: MultiPopupView.xtype, |
||||||
stopPropagation: false, |
stopPropagation: false, |
||||||
maxWidth: opts.maxWidth, |
maxWidth: opts.maxWidth, |
||||||
minWidth: opts.minWidth, |
minWidth: opts.minWidth, |
||||||
maxHeight: opts.maxHeight, |
maxHeight: opts.maxHeight, |
||||||
element: this, |
element: this, |
||||||
buttons: [BI.i18nText("BI-Basic_Clears"), BI.i18nText("BI-Basic_OK")], |
buttons: [i18nText("BI-Basic_Clears"), i18nText("BI-Basic_OK")], |
||||||
el: this.loader, |
el: this.loader, |
||||||
value: opts.value |
value: opts.value, |
||||||
}); |
}); |
||||||
|
|
||||||
this.popupView.on(BI.MultiPopupView.EVENT_CHANGE, function () { |
this.popupView.on(MultiPopupView.EVENT_CHANGE, () => { |
||||||
self.fireEvent(BI.MultiSelectNoBarPopupView.EVENT_CHANGE); |
self.fireEvent(MultiSelectNoBarPopupView.EVENT_CHANGE); |
||||||
}); |
}); |
||||||
this.popupView.on(BI.MultiPopupView.EVENT_CLICK_TOOLBAR_BUTTON, function (index) { |
this.popupView.on( |
||||||
|
MultiPopupView.EVENT_CLICK_TOOLBAR_BUTTON, |
||||||
|
index => { |
||||||
switch (index) { |
switch (index) { |
||||||
case 0: |
case 0: |
||||||
self.fireEvent(BI.MultiSelectNoBarPopupView.EVENT_CLICK_CLEAR); |
self.fireEvent( |
||||||
|
MultiSelectNoBarPopupView.EVENT_CLICK_CLEAR |
||||||
|
); |
||||||
break; |
break; |
||||||
case 1: |
case 1: |
||||||
self.fireEvent(BI.MultiSelectNoBarPopupView.EVENT_CLICK_CONFIRM); |
self.fireEvent( |
||||||
|
MultiSelectNoBarPopupView.EVENT_CLICK_CONFIRM |
||||||
|
); |
||||||
break; |
break; |
||||||
} |
} |
||||||
}); |
} |
||||||
}, |
); |
||||||
|
} |
||||||
|
|
||||||
setStartValue: function (v) { |
setStartValue(v) { |
||||||
this.loader.setStartValue(v); |
this.loader.setStartValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
this.popupView.setValue(v); |
this.popupView.setValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
return this.popupView.getValue(); |
return this.popupView.getValue(); |
||||||
}, |
} |
||||||
|
|
||||||
populate: function (items) { |
populate(items) { |
||||||
this.popupView.populate.apply(this.popupView, arguments); |
this.popupView.populate(...arguments); |
||||||
}, |
} |
||||||
|
|
||||||
resetHeight: function (h) { |
resetHeight(h) { |
||||||
this.popupView.resetHeight(h); |
this.popupView.resetHeight(h); |
||||||
}, |
} |
||||||
|
|
||||||
resetWidth: function (w) { |
resetWidth(w) { |
||||||
this.popupView.resetWidth(w); |
this.popupView.resetWidth(w); |
||||||
}, |
} |
||||||
|
|
||||||
setDirection: function (direction, position) { |
setDirection(direction, position) { |
||||||
this.popupView.setDirection(direction, position); |
this.popupView.setDirection(direction, position); |
||||||
}, |
} |
||||||
}); |
} |
||||||
|
|
||||||
BI.MultiSelectNoBarPopupView.EVENT_CHANGE = "EVENT_CHANGE"; |
|
||||||
BI.MultiSelectNoBarPopupView.EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM"; |
|
||||||
BI.MultiSelectNoBarPopupView.EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR"; |
|
||||||
|
|
||||||
|
|
||||||
BI.shortcut("bi.multi_select_no_bar_popup_view", BI.MultiSelectNoBarPopupView); |
|
||||||
|
@ -1,99 +1,109 @@ |
|||||||
/** |
import { |
||||||
* |
shortcut, |
||||||
* 在搜索框中输入文本弹出的面板 |
Widget, |
||||||
* @class BI.MultiSelectSearchInsertPane |
extend, |
||||||
* @extends Widget |
emptyFn, |
||||||
*/ |
createWidget, |
||||||
|
i18nText, |
||||||
BI.MultiSelectSearchInsertPane = BI.inherit(BI.Widget, { |
Controller, VerticalFillLayout |
||||||
|
} from "@/core"; |
||||||
constants: { |
import { Label } from "@/base"; |
||||||
height: 24, |
import { MultiSelectSearchLoader } from "./multiselect.search.loader"; |
||||||
lgap: 10, |
|
||||||
tgap: 5 |
@shortcut() |
||||||
}, |
export class MultiSelectSearchInsertPane extends Widget { |
||||||
|
static xtype = "bi.multi_select_search_insert_pane"; |
||||||
_defaultConfig: function () { |
|
||||||
return BI.extend(BI.MultiSelectSearchInsertPane.superclass._defaultConfig.apply(this, arguments), { |
constants = { height: 24, lgap: 10, tgap: 5 }; |
||||||
|
|
||||||
|
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
|
||||||
|
_defaultConfig() { |
||||||
|
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-multi-select-search-pane bi-card", |
baseCls: "bi-multi-select-search-pane bi-card", |
||||||
itemsCreator: BI.emptyFn, |
itemsCreator: emptyFn, |
||||||
valueFormatter: BI.emptyFn, |
valueFormatter: emptyFn, |
||||||
keywordGetter: BI.emptyFn, |
keywordGetter: emptyFn, |
||||||
itemHeight: 24 |
itemHeight: 24, |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.MultiSelectSearchInsertPane.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
var self = this, o = this.options; |
const self = this, |
||||||
|
o = this.options; |
||||||
|
|
||||||
this.addNotMatchTip = BI.createWidget({ |
this.addNotMatchTip = createWidget({ |
||||||
type: "bi.label", |
type: Label.xtype, |
||||||
text: BI.i18nText("BI-Basic_Press_Enter_To_Add_Text", ""), |
text: i18nText("BI-Basic_Press_Enter_To_Add_Text", ""), |
||||||
height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, |
height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, |
||||||
cls: "bi-keyword-red-mark", |
cls: "bi-keyword-red-mark", |
||||||
hgap: 5, |
hgap: 5, |
||||||
}); |
}); |
||||||
|
|
||||||
this.loader = BI.createWidget({ |
this.loader = createWidget({ |
||||||
type: "bi.multi_select_search_loader", |
type: MultiSelectSearchLoader.xtype, |
||||||
keywordGetter: o.keywordGetter, |
keywordGetter: o.keywordGetter, |
||||||
valueFormatter: o.valueFormatter, |
valueFormatter: o.valueFormatter, |
||||||
itemFormatter: o.itemFormatter, |
itemFormatter: o.itemFormatter, |
||||||
itemsCreator: function (op, callback) { |
itemsCreator(op, callback) { |
||||||
o.itemsCreator.apply(self, [op, function (res) { |
o.itemsCreator.apply(self, [ |
||||||
|
op, |
||||||
|
function (res) { |
||||||
callback(res); |
callback(res); |
||||||
self.setKeyword(o.keywordGetter()); |
self.setKeyword(o.keywordGetter()); |
||||||
}]); |
} |
||||||
|
]); |
||||||
}, |
}, |
||||||
itemHeight: o.itemHeight, |
itemHeight: o.itemHeight, |
||||||
value: o.value |
value: o.value, |
||||||
}); |
}); |
||||||
this.loader.on(BI.Controller.EVENT_CHANGE, function () { |
this.loader.on(Controller.EVENT_CHANGE, function () { |
||||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
self.fireEvent(Controller.EVENT_CHANGE, arguments); |
||||||
}); |
}); |
||||||
|
|
||||||
this.resizer = BI.createWidget({ |
this.resizer = createWidget({ |
||||||
type: "bi.vertical_fill", |
type: VerticalFillLayout.xtype, |
||||||
rowSize: ["", "fill"], |
rowSize: ["", "fill"], |
||||||
element: this, |
element: this, |
||||||
items: [{ |
items: [ |
||||||
|
{ |
||||||
el: this.addNotMatchTip, |
el: this.addNotMatchTip, |
||||||
}, { |
}, |
||||||
|
{ |
||||||
el: this.loader, |
el: this.loader, |
||||||
}], |
} |
||||||
|
], |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
setKeyword: function (keyword) { |
setKeyword(keyword) { |
||||||
this.addNotMatchTip.setText(BI.i18nText("BI-Basic_Press_Enter_To_Add_Text", keyword)); |
this.addNotMatchTip.setText( |
||||||
}, |
i18nText("BI-Basic_Press_Enter_To_Add_Text", keyword) |
||||||
|
); |
||||||
|
} |
||||||
|
|
||||||
isAllSelected: function () { |
isAllSelected() { |
||||||
return this.loader.isAllSelected(); |
return this.loader.isAllSelected(); |
||||||
}, |
} |
||||||
|
|
||||||
hasMatched: function () { |
hasMatched() { |
||||||
return false; |
return false; |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
this.loader.setValue(v); |
this.loader.setValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
return this.loader.getValue(); |
return this.loader.getValue(); |
||||||
}, |
} |
||||||
|
|
||||||
empty: function () { |
empty() { |
||||||
this.loader.empty(); |
this.loader.empty(); |
||||||
}, |
|
||||||
|
|
||||||
populate: function (items) { |
|
||||||
this.loader.populate.apply(this.loader, arguments); |
|
||||||
} |
} |
||||||
}); |
|
||||||
|
|
||||||
BI.MultiSelectSearchInsertPane.EVENT_CHANGE = "EVENT_CHANGE"; |
|
||||||
|
|
||||||
BI.shortcut("bi.multi_select_search_insert_pane", BI.MultiSelectSearchInsertPane); |
populate(items) { |
||||||
|
this.loader.populate(...arguments); |
||||||
|
} |
||||||
|
} |
||||||
|
@ -1,86 +1,92 @@ |
|||||||
/** |
import { |
||||||
* |
shortcut, |
||||||
* 在搜索框中输入文本弹出的面板 |
Widget, |
||||||
* @class BI.MultiSelectSearchPane |
extend, |
||||||
* @extends Widget |
emptyFn, |
||||||
*/ |
createWidget, |
||||||
|
Controller, |
||||||
|
AbsoluteLayout |
||||||
|
} from "@/core"; |
||||||
|
import { MultiSelectSearchLoader } from "./multiselect.search.loader"; |
||||||
|
|
||||||
BI.MultiSelectSearchPane = BI.inherit(BI.Widget, { |
@shortcut() |
||||||
|
export class MultiSelectSearchPane extends Widget { |
||||||
|
static xtype = "bi.multi_select_search_pane"; |
||||||
|
|
||||||
constants: { |
constants = { height: 24, lgap: 10, tgap: 5 }; |
||||||
height: 24, |
|
||||||
lgap: 10, |
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
tgap: 5 |
|
||||||
}, |
|
||||||
|
|
||||||
_defaultConfig: function () { |
_defaultConfig() { |
||||||
return BI.extend(BI.MultiSelectSearchPane.superclass._defaultConfig.apply(this, arguments), { |
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-multi-select-search-pane bi-card", |
baseCls: "bi-multi-select-search-pane bi-card", |
||||||
itemsCreator: BI.emptyFn, |
itemsCreator: emptyFn, |
||||||
valueFormatter: BI.emptyFn, |
valueFormatter: emptyFn, |
||||||
keywordGetter: BI.emptyFn, |
keywordGetter: emptyFn, |
||||||
itemHeight: 24, |
itemHeight: 24, |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.MultiSelectSearchPane.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
var self = this, o = this.options; |
const self = this, |
||||||
|
o = this.options; |
||||||
|
|
||||||
this.loader = BI.createWidget({ |
this.loader = createWidget({ |
||||||
type: "bi.multi_select_search_loader", |
type: MultiSelectSearchLoader.xtype, |
||||||
keywordGetter: o.keywordGetter, |
keywordGetter: o.keywordGetter, |
||||||
valueFormatter: o.valueFormatter, |
valueFormatter: o.valueFormatter, |
||||||
itemFormatter: o.itemFormatter, |
itemFormatter: o.itemFormatter, |
||||||
itemsCreator: function (op, callback) { |
itemsCreator(op, callback) { |
||||||
o.itemsCreator.apply(self, [op, function (res) { |
o.itemsCreator.apply(self, [ |
||||||
|
op, |
||||||
|
function (res) { |
||||||
callback(res); |
callback(res); |
||||||
}]); |
} |
||||||
|
]); |
||||||
}, |
}, |
||||||
itemHeight: o.itemHeight, |
itemHeight: o.itemHeight, |
||||||
value: o.value |
value: o.value, |
||||||
}); |
}); |
||||||
this.loader.on(BI.Controller.EVENT_CHANGE, function () { |
this.loader.on(Controller.EVENT_CHANGE, function () { |
||||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
self.fireEvent(Controller.EVENT_CHANGE, arguments); |
||||||
}); |
}); |
||||||
|
|
||||||
this.resizer = BI.createWidget({ |
this.resizer = createWidget({ |
||||||
type: "bi.absolute", |
type: AbsoluteLayout.xtype, |
||||||
element: this, |
element: this, |
||||||
items: [{ |
items: [ |
||||||
|
{ |
||||||
el: this.loader, |
el: this.loader, |
||||||
left: 0, |
left: 0, |
||||||
right: 0, |
right: 0, |
||||||
bottom: 0, |
bottom: 0, |
||||||
top: 0, |
top: 0, |
||||||
}], |
} |
||||||
|
], |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
isAllSelected: function () { |
isAllSelected() { |
||||||
return this.loader.isAllSelected(); |
return this.loader.isAllSelected(); |
||||||
}, |
} |
||||||
|
|
||||||
hasMatched: function () { |
hasMatched() { |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
this.loader.setValue(v); |
this.loader.setValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
return this.loader.getValue(); |
return this.loader.getValue(); |
||||||
}, |
} |
||||||
|
|
||||||
empty: function () { |
empty() { |
||||||
this.loader.empty(); |
this.loader.empty(); |
||||||
}, |
|
||||||
|
|
||||||
populate: function (items) { |
|
||||||
this.loader.populate.apply(this.loader, arguments); |
|
||||||
} |
} |
||||||
}); |
|
||||||
|
|
||||||
BI.MultiSelectSearchPane.EVENT_CHANGE = "EVENT_CHANGE"; |
populate(items) { |
||||||
|
this.loader.populate(...arguments); |
||||||
BI.shortcut("bi.multi_select_search_pane", BI.MultiSelectSearchPane); |
} |
||||||
|
} |
||||||
|
@ -1,102 +1,124 @@ |
|||||||
/** |
import { |
||||||
* 查看已选按钮 |
shortcut, |
||||||
* Created by guy on 15/11/3. |
extend, |
||||||
* @class BI.MultiSelectCheckSelectedButton |
emptyFn, |
||||||
* @extends BI.Single |
createWidget, |
||||||
*/ |
Controller, |
||||||
BI.MultiSelectCheckSelectedButton = BI.inherit(BI.Single, { |
i18nText, |
||||||
|
isNotNull, |
||||||
|
isNotEmptyString, |
||||||
|
nextTick, |
||||||
|
Selection |
||||||
|
} from "@/core"; |
||||||
|
import { Single, TextButton } from "@/base"; |
||||||
|
import { MultiSelectCombo } from "../multiselect.combo"; |
||||||
|
|
||||||
_defaultConfig: function () { |
@shortcut() |
||||||
return BI.extend(BI.MultiSelectCheckSelectedButton.superclass._defaultConfig.apply(this, arguments), { |
export class MultiSelectCheckSelectedButton extends Single { |
||||||
|
static xtype = "bi.multi_select_check_selected_button"; |
||||||
|
|
||||||
|
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
|
||||||
|
_defaultConfig() { |
||||||
|
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-multi-select-check-selected-button", |
baseCls: "bi-multi-select-check-selected-button", |
||||||
itemsCreator: BI.emptyFn |
itemsCreator: emptyFn, |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.MultiSelectCheckSelectedButton.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
var self = this, o = this.options; |
const self = this, |
||||||
this.numberCounter = BI.createWidget({ |
o = this.options; |
||||||
type: "bi.text_button", |
this.numberCounter = createWidget({ |
||||||
|
type: TextButton.xtype, |
||||||
element: this, |
element: this, |
||||||
hgap: 4, |
hgap: 4, |
||||||
text: "0", |
text: "0", |
||||||
textAlign: "center", |
textAlign: "center", |
||||||
textHeight: 16, |
textHeight: 16, |
||||||
cls: "bi-high-light-background count-tip" |
cls: "bi-high-light-background count-tip", |
||||||
}); |
}); |
||||||
this.numberCounter.on(BI.Controller.EVENT_CHANGE, function () { |
this.numberCounter.on(Controller.EVENT_CHANGE, function () { |
||||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
self.fireEvent(Controller.EVENT_CHANGE, arguments); |
||||||
}); |
}); |
||||||
|
|
||||||
this.numberCounter.on(BI.TextButton.EVENT_CHANGE, function () { |
this.numberCounter.on(TextButton.EVENT_CHANGE, function () { |
||||||
self.fireEvent(BI.MultiSelectCheckSelectedButton.EVENT_CHANGE, arguments); |
self.fireEvent( |
||||||
|
MultiSelectCheckSelectedButton.EVENT_CHANGE, |
||||||
|
arguments |
||||||
|
); |
||||||
}); |
}); |
||||||
|
|
||||||
this.numberCounter.element.hover(function () { |
this.numberCounter.element.hover( |
||||||
|
() => { |
||||||
self.numberCounter.setTag(self.numberCounter.getText()); |
self.numberCounter.setTag(self.numberCounter.getText()); |
||||||
self.numberCounter.setText(BI.i18nText("BI-Check_Selected")); |
self.numberCounter.setText(i18nText("BI-Check_Selected")); |
||||||
}, function () { |
}, |
||||||
|
() => { |
||||||
self.numberCounter.setText(self.numberCounter.getTag()); |
self.numberCounter.setText(self.numberCounter.getTag()); |
||||||
}); |
} |
||||||
|
); |
||||||
this.setVisible(false); |
this.setVisible(false); |
||||||
if (BI.isNotNull(o.value)) { |
if (isNotNull(o.value)) { |
||||||
this.setValue(o.value); |
this.setValue(o.value); |
||||||
} |
} |
||||||
}, |
} |
||||||
|
|
||||||
_populate: function (ob) { |
_populate(ob) { |
||||||
var self = this, o = this.options; |
const self = this, |
||||||
if (ob.type === BI.Selection.All) { |
o = this.options; |
||||||
o.itemsCreator({ |
if (ob.type === Selection.All) { |
||||||
type: BI.MultiSelectCombo.REQ_GET_DATA_LENGTH |
o.itemsCreator( |
||||||
}, function (res) { |
{ |
||||||
if (self.options.value.type !== BI.Selection.All) { |
type: MultiSelectCombo.REQ_GET_DATA_LENGTH, |
||||||
|
}, |
||||||
|
res => { |
||||||
|
if (self.options.value.type !== Selection.All) { |
||||||
return; |
return; |
||||||
} |
} |
||||||
if (BI.isNotEmptyString(res.count)) { |
if (isNotEmptyString(res.count)) { |
||||||
BI.nextTick(function () { |
nextTick(() => { |
||||||
self.numberCounter.setText(res.count); |
self.numberCounter.setText(res.count); |
||||||
self.setVisible(true); |
self.setVisible(true); |
||||||
}); |
}); |
||||||
|
|
||||||
return; |
return; |
||||||
} |
} |
||||||
var length = res.count - ob.value.length; |
const length = res.count - ob.value.length; |
||||||
BI.nextTick(function () { |
nextTick(() => { |
||||||
self.numberCounter.setText(length); |
self.numberCounter.setText(length); |
||||||
self.setVisible(length > 0); |
self.setVisible(length > 0); |
||||||
}); |
}); |
||||||
}); |
} |
||||||
|
); |
||||||
|
|
||||||
return; |
return; |
||||||
} |
} |
||||||
BI.nextTick(function () { |
nextTick(() => { |
||||||
self.numberCounter.setText(ob.value.length); |
self.numberCounter.setText(ob.value.length); |
||||||
self.setVisible(ob.value.length > 0); |
self.setVisible(ob.value.length > 0); |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_assertValue: function (ob) { |
_assertValue(ob) { |
||||||
ob || (ob = {}); |
ob || (ob = {}); |
||||||
ob.type || (ob.type = BI.Selection.Multi); |
ob.type || (ob.type = BI.Selection.Multi); |
||||||
ob.value || (ob.value = []); |
ob.value || (ob.value = []); |
||||||
|
|
||||||
return ob; |
return ob; |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (ob) { |
setValue(ob) { |
||||||
ob = this._assertValue(ob); |
ob = this._assertValue(ob); |
||||||
this.options.value = ob; |
this.options.value = ob; |
||||||
this._populate(ob); |
this._populate(ob); |
||||||
}, |
} |
||||||
|
|
||||||
populate: function () { |
populate() { |
||||||
this._populate(this._assertValue(this.options.value)); |
this._populate(this._assertValue(this.options.value)); |
||||||
}, |
|
||||||
|
|
||||||
getValue: function () { |
|
||||||
|
|
||||||
} |
} |
||||||
}); |
|
||||||
|
|
||||||
BI.MultiSelectCheckSelectedButton.EVENT_CHANGE = "EVENT_CHANGE"; |
getValue() { |
||||||
BI.shortcut("bi.multi_select_check_selected_button", BI.MultiSelectCheckSelectedButton); |
} |
||||||
|
} |
||||||
|
@ -1,112 +1,128 @@ |
|||||||
/** |
import { |
||||||
* 查看已选switcher |
shortcut, |
||||||
* Created by guy on 15/11/3. |
Widget, |
||||||
* @class BI.MultiSelectCheckSelectedSwitcher |
extend, |
||||||
* @extends Widget |
emptyFn, |
||||||
*/ |
createWidget, |
||||||
BI.MultiSelectCheckSelectedSwitcher = BI.inherit(BI.Widget, { |
Events, |
||||||
|
nextTick |
||||||
|
} from "@/core"; |
||||||
|
import { Switcher } from "@/base"; |
||||||
|
import { MultiSelectCheckSelectedButton } from "./button.checkselected"; |
||||||
|
import { MultiSelectCheckPane } from "../check/multiselect.check.pane"; |
||||||
|
|
||||||
_defaultConfig: function () { |
@shortcut() |
||||||
return BI.extend(BI.MultiSelectCheckSelectedSwitcher.superclass._defaultConfig.apply(this, arguments), { |
export class MultiSelectCheckSelectedSwitcher extends Widget { |
||||||
|
static xtype = "bi.multi_select_check_selected_switcher"; |
||||||
|
|
||||||
|
static EVENT_TRIGGER_CHANGE = "EVENT_TRIGGER_CHANGE"; |
||||||
|
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; |
||||||
|
static EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW"; |
||||||
|
|
||||||
|
_defaultConfig() { |
||||||
|
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-multi-select-check-selected-switcher", |
baseCls: "bi-multi-select-check-selected-switcher", |
||||||
itemsCreator: BI.emptyFn, |
itemsCreator: emptyFn, |
||||||
valueFormatter: BI.emptyFn, |
valueFormatter: emptyFn, |
||||||
el: {}, |
el: {}, |
||||||
popup: {}, |
popup: {}, |
||||||
adapter: null, |
adapter: null, |
||||||
masker: {} |
masker: {}, |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.MultiSelectCheckSelectedSwitcher.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
var self = this, o = this.options; |
const self = this, |
||||||
|
o = this.options; |
||||||
|
|
||||||
this.button = BI.createWidget(o.el, { |
this.button = createWidget(o.el, { |
||||||
type: "bi.multi_select_check_selected_button", |
type: MultiSelectCheckSelectedButton.xtype, |
||||||
itemsCreator: o.itemsCreator, |
itemsCreator: o.itemsCreator, |
||||||
value: o.value |
value: o.value, |
||||||
}); |
}); |
||||||
this.button.on(BI.Events.VIEW, function () { |
this.button.on(Events.VIEW, function () { |
||||||
self.fireEvent(BI.Events.VIEW, arguments); |
self.fireEvent(Events.VIEW, arguments); |
||||||
}); |
}); |
||||||
this.switcher = BI.createWidget({ |
this.switcher = createWidget({ |
||||||
type: "bi.switcher", |
type: Switcher.xtype, |
||||||
toggle: false, |
toggle: false, |
||||||
element: this, |
element: this, |
||||||
el: this.button, |
el: this.button, |
||||||
popup: BI.extend({ |
popup: extend( |
||||||
type: "bi.multi_select_check_pane", |
{ |
||||||
|
type: MultiSelectCheckPane.xtype, |
||||||
valueFormatter: o.valueFormatter, |
valueFormatter: o.valueFormatter, |
||||||
itemsCreator: o.itemsCreator, |
itemsCreator: o.itemsCreator, |
||||||
onClickContinueSelect: function () { |
onClickContinueSelect() { |
||||||
self.switcher.hideView(); |
self.switcher.hideView(); |
||||||
}, |
}, |
||||||
ref: function (_ref) { |
ref(_ref) { |
||||||
self.checkPane = _ref; |
self.checkPane = _ref; |
||||||
}, |
}, |
||||||
value: o.value |
value: o.value, |
||||||
}, o.popup), |
}, |
||||||
|
o.popup |
||||||
|
), |
||||||
adapter: o.adapter, |
adapter: o.adapter, |
||||||
masker: o.masker |
masker: o.masker, |
||||||
}); |
}); |
||||||
this.switcher.on(BI.Switcher.EVENT_TRIGGER_CHANGE, function () { |
this.switcher.on(Switcher.EVENT_TRIGGER_CHANGE, () => { |
||||||
self.fireEvent(BI.MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE); |
self.fireEvent( |
||||||
|
MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE |
||||||
|
); |
||||||
}); |
}); |
||||||
this.switcher.on(BI.Switcher.EVENT_BEFORE_POPUPVIEW, function () { |
this.switcher.on(Switcher.EVENT_BEFORE_POPUPVIEW, () => { |
||||||
self.fireEvent(BI.MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW); |
self.fireEvent( |
||||||
|
MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW |
||||||
|
); |
||||||
}); |
}); |
||||||
this.switcher.on(BI.Switcher.EVENT_AFTER_HIDEVIEW, function () { |
this.switcher.on(Switcher.EVENT_AFTER_HIDEVIEW, () => { |
||||||
self.fireEvent(BI.MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW); |
self.fireEvent( |
||||||
|
MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW |
||||||
|
); |
||||||
}); |
}); |
||||||
this.switcher.on(BI.Switcher.EVENT_AFTER_POPUPVIEW, function () { |
this.switcher.on(Switcher.EVENT_AFTER_POPUPVIEW, function () { |
||||||
var me = this; |
const me = this; |
||||||
BI.nextTick(function () { |
nextTick(() => { |
||||||
me._populate(); |
me._populate(); |
||||||
}); |
}); |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
adjustView: function () { |
adjustView() { |
||||||
this.switcher.adjustView(); |
this.switcher.adjustView(); |
||||||
}, |
} |
||||||
|
|
||||||
hideView: function () { |
hideView() { |
||||||
this.switcher.empty(); |
this.switcher.empty(); |
||||||
this.switcher.hideView(); |
this.switcher.hideView(); |
||||||
}, |
} |
||||||
|
|
||||||
setAdapter: function (adapter) { |
setAdapter(adapter) { |
||||||
this.switcher.setAdapter(adapter); |
this.switcher.setAdapter(adapter); |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
this.switcher.setValue(v); |
this.switcher.setValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
// 与setValue的区别是只更新查看已选面板的的selectedValue, 不会更新按钮的计数
|
updateSelectedValue(v) { |
||||||
updateSelectedValue: function (v) { |
|
||||||
this.checkPane.setValue(v); |
this.checkPane.setValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
setButtonChecked: function (v) { |
setButtonChecked(v) { |
||||||
this.button.setValue(v); |
this.button.setValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
|
||||||
|
|
||||||
}, |
getValue() { |
||||||
|
} |
||||||
|
|
||||||
populate: function (items) { |
populate(items) { |
||||||
this.switcher.populate.apply(this.switcher, arguments); |
this.switcher.populate.apply(this.switcher, arguments); |
||||||
}, |
} |
||||||
|
|
||||||
populateSwitcher: function () { |
populateSwitcher() { |
||||||
this.button.populate.apply(this.button, arguments); |
this.button.populate.apply(this.button, arguments); |
||||||
} |
} |
||||||
}); |
} |
||||||
|
|
||||||
BI.MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE = "EVENT_TRIGGER_CHANGE"; |
|
||||||
BI.MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; |
|
||||||
BI.MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW"; |
|
||||||
BI.shortcut("bi.multi_select_check_selected_switcher", BI.MultiSelectCheckSelectedSwitcher); |
|
||||||
|
@ -1,171 +1,193 @@ |
|||||||
/** |
import { |
||||||
* Created by zcf_1 on 2017/5/11. |
shortcut, |
||||||
*/ |
extend, |
||||||
BI.MultiSelectTree = BI.inherit(BI.Single, { |
emptyFn, |
||||||
_constant: { |
createWidget, |
||||||
EDITOR_HEIGHT: 24 |
nextTick, |
||||||
}, |
AbsoluteLayout |
||||||
|
} from "@/core"; |
||||||
_defaultConfig: function () { |
import { Single, Searcher } from "@/base"; |
||||||
return BI.extend(BI.MultiSelectTree.superclass._defaultConfig.apply(this, arguments), { |
import { MultiSelectTreePopup } from "./multiselecttree.popup"; |
||||||
|
|
||||||
|
@shortcut() |
||||||
|
export class MultiSelectTree extends Single { |
||||||
|
static xtype = "bi.multi_select_tree"; |
||||||
|
|
||||||
|
_constant = { EDITOR_HEIGHT: 24 }; |
||||||
|
|
||||||
|
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
|
||||||
|
_defaultConfig() { |
||||||
|
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-multi-select-tree", |
baseCls: "bi-multi-select-tree", |
||||||
itemsCreator: BI.emptyFn |
itemsCreator: emptyFn, |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.MultiSelectTree.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
var self = this, o = this.options; |
const self = this, |
||||||
this.storeValue = {value: {}}; |
o = this.options; |
||||||
|
this.storeValue = { value: {} }; |
||||||
|
|
||||||
this.adapter = BI.createWidget({ |
this.adapter = createWidget({ |
||||||
type: "bi.multi_select_tree_popup", |
type: MultiSelectTreePopup.xtype, |
||||||
itemsCreator: o.itemsCreator, |
itemsCreator: o.itemsCreator, |
||||||
showLine: o.showLine |
showLine: o.showLine, |
||||||
}); |
}); |
||||||
this.adapter.on(BI.MultiSelectTreePopup.EVENT_CHANGE, function () { |
this.adapter.on(MultiSelectTreePopup.EVENT_CHANGE, () => { |
||||||
if (self.searcher.isSearching()) { |
if (self.searcher.isSearching()) { |
||||||
self.storeValue = {value: self.searcherPane.getValue()}; |
self.storeValue = { value: self.searcherPane.getValue() }; |
||||||
} else { |
} else { |
||||||
self.storeValue = {value: self.adapter.getValue()}; |
self.storeValue = { value: self.adapter.getValue() }; |
||||||
} |
} |
||||||
self.setSelectedValue(self.storeValue.value); |
self.setSelectedValue(self.storeValue.value); |
||||||
self.fireEvent(BI.MultiSelectTree.EVENT_CHANGE); |
self.fireEvent(MultiSelectTree.EVENT_CHANGE); |
||||||
}); |
}); |
||||||
|
|
||||||
// 搜索中的时候用的是parttree,同adapter中的synctree不一样
|
// 搜索中的时候用的是parttree,同adapter中的synctree不一样
|
||||||
this.searcherPane = BI.createWidget({ |
this.searcherPane = createWidget({ |
||||||
type: "bi.multi_tree_search_pane", |
type: "bi.multi_tree_search_pane", |
||||||
cls: "bi-border-left bi-border-right bi-border-bottom", |
cls: "bi-border-left bi-border-right bi-border-bottom", |
||||||
keywordGetter: function () { |
keywordGetter() { |
||||||
return self.searcher.getKeyword(); |
return self.searcher.getKeyword(); |
||||||
}, |
}, |
||||||
itemsCreator: function (op, callback) { |
itemsCreator(op, callback) { |
||||||
op.keyword = self.searcher.getKeyword(); |
op.keyword = self.searcher.getKeyword(); |
||||||
o.itemsCreator(op, callback); |
o.itemsCreator(op, callback); |
||||||
} |
}, |
||||||
}); |
}); |
||||||
this.searcherPane.setVisible(false); |
this.searcherPane.setVisible(false); |
||||||
|
|
||||||
this.searcher = BI.createWidget({ |
this.searcher = createWidget({ |
||||||
type: "bi.searcher", |
type: Searcher.xtype, |
||||||
isAutoSearch: false, |
isAutoSearch: false, |
||||||
isAutoSync: false, |
isAutoSync: false, |
||||||
onSearch: function (op, callback) { |
onSearch(op, callback) { |
||||||
callback({ |
callback({ |
||||||
keyword: self.searcher.getKeyword() |
keyword: self.searcher.getKeyword(), |
||||||
}); |
}); |
||||||
}, |
}, |
||||||
adapter: this.adapter, |
adapter: this.adapter, |
||||||
popup: this.searcherPane, |
popup: this.searcherPane, |
||||||
masker: false, |
masker: false, |
||||||
listeners: [{ |
listeners: [ |
||||||
eventName: BI.Searcher.EVENT_START, |
{ |
||||||
action: function () { |
eventName: Searcher.EVENT_START, |
||||||
|
action() { |
||||||
self._showSearcherPane(); |
self._showSearcherPane(); |
||||||
// self.storeValue = {value: self.adapter.getValue()};
|
// self.storeValue = {value: self.adapter.getValue()};
|
||||||
// self.searcherPane.setSelectedValue(self.storeValue.value);
|
// self.searcherPane.setSelectedValue(self.storeValue.value);
|
||||||
} |
}, |
||||||
}, { |
}, |
||||||
eventName: BI.Searcher.EVENT_STOP, |
{ |
||||||
action: function () { |
eventName: Searcher.EVENT_STOP, |
||||||
|
action() { |
||||||
self._showAdapter(); |
self._showAdapter(); |
||||||
// self.storeValue = {value: self.searcherPane.getValue()};
|
// self.storeValue = {value: self.searcherPane.getValue()};
|
||||||
// self.adapter.setSelectedValue(self.storeValue.value);
|
// self.adapter.setSelectedValue(self.storeValue.value);
|
||||||
BI.nextTick(function () { |
nextTick(() => { |
||||||
self.adapter.populate(); |
self.adapter.populate(); |
||||||
}); |
}); |
||||||
} |
}, |
||||||
}, { |
}, |
||||||
eventName: BI.Searcher.EVENT_CHANGE, |
{ |
||||||
action: function () { |
eventName: Searcher.EVENT_CHANGE, |
||||||
|
action() { |
||||||
if (self.searcher.isSearching()) { |
if (self.searcher.isSearching()) { |
||||||
self.storeValue = {value: self.searcherPane.getValue()}; |
self.storeValue = { |
||||||
|
value: self.searcherPane.getValue(), |
||||||
|
}; |
||||||
} else { |
} else { |
||||||
self.storeValue = {value: self.adapter.getValue()}; |
self.storeValue = { |
||||||
|
value: self.adapter.getValue(), |
||||||
|
}; |
||||||
} |
} |
||||||
self.setSelectedValue(self.storeValue.value); |
self.setSelectedValue(self.storeValue.value); |
||||||
self.fireEvent(BI.MultiSelectTree.EVENT_CHANGE); |
self.fireEvent(MultiSelectTree.EVENT_CHANGE); |
||||||
} |
}, |
||||||
}, { |
}, |
||||||
eventName: BI.Searcher.EVENT_PAUSE, |
{ |
||||||
action: function () { |
eventName: Searcher.EVENT_PAUSE, |
||||||
|
action() { |
||||||
self._showAdapter(); |
self._showAdapter(); |
||||||
// BI-64732 pause 和stop一致, 都应该刷新adapter
|
// BI-64732 pause 和stop一致, 都应该刷新adapter
|
||||||
BI.nextTick(function () { |
nextTick(() => { |
||||||
self.adapter.populate(); |
self.adapter.populate(); |
||||||
}); |
}); |
||||||
|
}, |
||||||
} |
} |
||||||
}] |
], |
||||||
}); |
}); |
||||||
|
|
||||||
BI.createWidget({ |
createWidget({ |
||||||
type: "bi.vertical_fill", |
type: "bi.vertical_fill", |
||||||
element: this, |
element: this, |
||||||
items: [{ |
items: [ |
||||||
|
{ |
||||||
el: this.searcher, |
el: this.searcher, |
||||||
height: "" |
height: "", |
||||||
}, { |
}, |
||||||
|
{ |
||||||
el: this.adapter, |
el: this.adapter, |
||||||
height: "fill" |
height: "fill", |
||||||
}] |
} |
||||||
|
], |
||||||
}); |
}); |
||||||
BI.createWidget({ |
createWidget({ |
||||||
type: "bi.absolute", |
type: AbsoluteLayout.xtype, |
||||||
element: this, |
element: this, |
||||||
items: [{ |
items: [ |
||||||
|
{ |
||||||
el: this.searcherPane, |
el: this.searcherPane, |
||||||
top: this._constant.EDITOR_HEIGHT, |
top: this._constant.EDITOR_HEIGHT, |
||||||
bottom: 0, |
bottom: 0, |
||||||
left: 0, |
left: 0, |
||||||
right: 0 |
right: 0, |
||||||
}] |
} |
||||||
|
], |
||||||
}); |
}); |
||||||
|
} |
||||||
|
|
||||||
}, |
_showAdapter() { |
||||||
|
|
||||||
_showAdapter: function () { |
|
||||||
this.adapter.setVisible(true); |
this.adapter.setVisible(true); |
||||||
this.searcherPane.setVisible(false); |
this.searcherPane.setVisible(false); |
||||||
}, |
} |
||||||
|
|
||||||
_showSearcherPane: function () { |
_showSearcherPane() { |
||||||
this.searcherPane.setVisible(true); |
this.searcherPane.setVisible(true); |
||||||
this.adapter.setVisible(false); |
this.adapter.setVisible(false); |
||||||
}, |
} |
||||||
|
|
||||||
resize: function () { |
|
||||||
|
|
||||||
}, |
resize() { |
||||||
|
} |
||||||
|
|
||||||
setSelectedValue: function (v) { |
setSelectedValue(v) { |
||||||
this.storeValue.value = v || {}; |
this.storeValue.value = v || {}; |
||||||
this.adapter.setSelectedValue(v); |
this.adapter.setSelectedValue(v); |
||||||
this.searcherPane.setSelectedValue(v); |
this.searcherPane.setSelectedValue(v); |
||||||
this.searcher.setValue({ |
this.searcher.setValue({ |
||||||
value: v || {} |
value: v || {}, |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
this.adapter.setValue(v); |
this.adapter.setValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
stopSearch: function () { |
stopSearch() { |
||||||
this.searcher.stopSearch(); |
this.searcher.stopSearch(); |
||||||
}, |
} |
||||||
|
|
||||||
updateValue: function (v) { |
updateValue(v) { |
||||||
this.adapter.updateValue(v); |
this.adapter.updateValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
return this.storeValue.value; |
return this.storeValue.value; |
||||||
}, |
} |
||||||
|
|
||||||
populate: function () { |
populate() { |
||||||
this.adapter.populate(); |
this.adapter.populate(); |
||||||
} |
} |
||||||
}); |
} |
||||||
BI.MultiSelectTree.EVENT_CHANGE = "EVENT_CHANGE"; |
|
||||||
BI.shortcut("bi.multi_select_tree", BI.MultiSelectTree); |
|
||||||
|
@ -1,58 +1,63 @@ |
|||||||
/** |
import { shortcut, Widget, extend, emptyFn, createWidget } from "@/core"; |
||||||
* Created by zcf on 2016/12/21. |
import { TreeView, Asynctree } from "@/case"; |
||||||
*/ |
|
||||||
BI.MultiSelectTreePopup = BI.inherit(BI.Widget, { |
@shortcut() |
||||||
_defaultConfig: function () { |
export class MultiSelectTreePopup extends Widget { |
||||||
return BI.extend(BI.MultiSelectTreePopup.superclass._defaultConfig.apply(this, arguments), { |
static xtype = "bi.multi_select_tree_popup"; |
||||||
baseCls: "bi-multi-select-tree-popup bi-border-left bi-border-right bi-border-bottom", |
|
||||||
itemsCreator: BI.emptyFn |
static EVENT_AFTER_INIT = "EVENT_AFTER_INIT"; |
||||||
|
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
|
||||||
|
_defaultConfig() { |
||||||
|
return extend(super._defaultConfig(...arguments), { |
||||||
|
baseCls: |
||||||
|
"bi-multi-select-tree-popup bi-border-left bi-border-right bi-border-bottom", |
||||||
|
itemsCreator: emptyFn, |
||||||
}); |
}); |
||||||
}, |
} |
||||||
_init: function () { |
|
||||||
BI.MultiSelectTreePopup.superclass._init.apply(this, arguments); |
_init() { |
||||||
var self = this, o = this.options; |
super._init(...arguments); |
||||||
this.popup = BI.createWidget({ |
const self = this, |
||||||
type: "bi.async_tree", |
o = this.options; |
||||||
|
this.popup = createWidget({ |
||||||
|
type: Asynctree.xtype, |
||||||
showLine: o.showLine, |
showLine: o.showLine, |
||||||
element: this, |
element: this, |
||||||
itemsCreator: o.itemsCreator |
itemsCreator: o.itemsCreator, |
||||||
}); |
}); |
||||||
this.popup.on(BI.TreeView.EVENT_AFTERINIT, function () { |
this.popup.on(TreeView.EVENT_AFTERINIT, () => { |
||||||
self.fireEvent(BI.MultiSelectTreePopup.EVENT_AFTER_INIT); |
self.fireEvent(MultiSelectTreePopup.EVENT_AFTER_INIT); |
||||||
}); |
}); |
||||||
this.popup.on(BI.TreeView.EVENT_CHANGE, function () { |
this.popup.on(TreeView.EVENT_CHANGE, () => { |
||||||
self.fireEvent(BI.MultiSelectTreePopup.EVENT_CHANGE); |
self.fireEvent(MultiSelectTreePopup.EVENT_CHANGE); |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
hasChecked: function () { |
hasChecked() { |
||||||
return this.popup.hasChecked(); |
return this.popup.hasChecked(); |
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
return this.popup.getValue(); |
return this.popup.getValue(); |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
v || (v = {}); |
v || (v = {}); |
||||||
this.popup.setValue(v); |
this.popup.setValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
setSelectedValue: function (v) { |
setSelectedValue(v) { |
||||||
v || (v = {}); |
v || (v = {}); |
||||||
this.popup.setSelectedValue(v); |
this.popup.setSelectedValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
updateValue: function (v) { |
updateValue(v) { |
||||||
this.popup.updateValue(v); |
this.popup.updateValue(v); |
||||||
this.popup.refresh(); |
this.popup.refresh(); |
||||||
}, |
} |
||||||
|
|
||||||
populate: function (config) { |
populate(config) { |
||||||
this.popup.stroke(config); |
this.popup.stroke(config); |
||||||
} |
} |
||||||
|
} |
||||||
}); |
|
||||||
BI.MultiSelectTreePopup.EVENT_AFTER_INIT = "EVENT_AFTER_INIT"; |
|
||||||
BI.MultiSelectTreePopup.EVENT_CHANGE = "EVENT_CHANGE"; |
|
||||||
BI.shortcut("bi.multi_select_tree_popup", BI.MultiSelectTreePopup); |
|
||||||
|
@ -1,121 +1,128 @@ |
|||||||
/** |
import { |
||||||
* |
shortcut, |
||||||
* @class BI.MultiTreeCheckPane |
extend, |
||||||
* @extends BI.Pane |
emptyFn, |
||||||
*/ |
createWidget, |
||||||
BI.MultiTreeCheckPane = BI.inherit(BI.Pane, { |
i18nText, |
||||||
|
nextTick, |
||||||
constants: { |
Events, |
||||||
height: 25, |
VerticalAdaptLayout, VTapeLayout |
||||||
lgap: 10, |
} from "@/core"; |
||||||
tgap: 5 |
import { Pane, TextButton, Label } from "@/base"; |
||||||
}, |
import { DisplayTree, TreeView } from "@/case"; |
||||||
|
|
||||||
_defaultConfig: function () { |
@shortcut() |
||||||
return BI.extend(BI.MultiTreeCheckPane.superclass._defaultConfig.apply(this, arguments), { |
export class MultiTreeCheckPane extends Pane { |
||||||
|
static xtype = "bi.multi_tree_check_pane"; |
||||||
|
|
||||||
|
constants = { height: 25, lgap: 10, tgap: 5 }; |
||||||
|
|
||||||
|
static EVENT_CONTINUE_CLICK = "EVENT_CONTINUE_CLICK"; |
||||||
|
|
||||||
|
_defaultConfig() { |
||||||
|
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-multi-tree-check-pane bi-background", |
baseCls: "bi-multi-tree-check-pane bi-background", |
||||||
onClickContinueSelect: BI.emptyFn, |
onClickContinueSelect: emptyFn, |
||||||
el: { |
el: { |
||||||
type: "bi.display_tree" |
type: DisplayTree.xtype, |
||||||
} |
|
||||||
}); |
|
||||||
}, |
}, |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.MultiTreeCheckPane.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
|
|
||||||
var self = this, opts = this.options; |
const self = this, |
||||||
|
opts = this.options; |
||||||
|
|
||||||
this.selectedValues = {}; |
this.selectedValues = {}; |
||||||
|
|
||||||
var continueSelect = BI.createWidget({ |
const continueSelect = createWidget({ |
||||||
type: "bi.text_button", |
type: TextButton.xtype, |
||||||
title: BI.i18nText("BI-Continue_Select"), |
title: i18nText("BI-Continue_Select"), |
||||||
text: BI.i18nText("BI-Continue_Select"), |
text: i18nText("BI-Continue_Select"), |
||||||
cls: "multi-tree-check-selected" |
cls: "multi-tree-check-selected", |
||||||
}); |
}); |
||||||
continueSelect.on(BI.TextButton.EVENT_CHANGE, function () { |
continueSelect.on(TextButton.EVENT_CHANGE, () => { |
||||||
opts.onClickContinueSelect(); |
opts.onClickContinueSelect(); |
||||||
BI.nextTick(function () { |
nextTick(() => { |
||||||
self.empty(); |
self.empty(); |
||||||
}); |
}); |
||||||
}); |
}); |
||||||
|
|
||||||
var backToPopup = BI.createWidget({ |
const backToPopup = createWidget({ |
||||||
type: "bi.vertical_adapt", |
type: VerticalAdaptLayout.xtype, |
||||||
columnSize: ["auto", "auto"], |
columnSize: ["auto", "auto"], |
||||||
cls: "multi-tree-continue-select", |
cls: "multi-tree-continue-select", |
||||||
items: [ |
items: [ |
||||||
{ |
{ |
||||||
el: { |
el: { |
||||||
type: "bi.label", |
type: Label.xtype, |
||||||
title: BI.i18nText("BI-Selected_Data"), |
title: i18nText("BI-Selected_Data"), |
||||||
text: BI.i18nText("BI-Selected_Data") |
text: i18nText("BI-Selected_Data"), |
||||||
}, |
}, |
||||||
lgap: this.constants.lgap, |
lgap: this.constants.lgap, |
||||||
tgap: this.constants.tgap |
tgap: this.constants.tgap, |
||||||
}, |
}, |
||||||
{ |
{ |
||||||
el: continueSelect, |
el: continueSelect, |
||||||
hgap: this.constants.lgap, |
hgap: this.constants.lgap, |
||||||
tgap: this.constants.tgap |
tgap: this.constants.tgap, |
||||||
}] |
} |
||||||
|
], |
||||||
}); |
}); |
||||||
|
|
||||||
this.display = BI.createWidget(opts.el, { |
this.display = createWidget(opts.el, { |
||||||
type: "bi.display_tree", |
type: DisplayTree.xtype, |
||||||
cls: "bi-multi-tree-display", |
cls: "bi-multi-tree-display", |
||||||
itemsCreator: function (op, callback) { |
itemsCreator(op, callback) { |
||||||
op.type = BI.TreeView.REQ_TYPE_GET_SELECTED_DATA; |
op.type = TreeView.REQ_TYPE_GET_SELECTED_DATA; |
||||||
opts.itemsCreator(op, callback); |
opts.itemsCreator(op, callback); |
||||||
}, |
}, |
||||||
value: (opts.value || {}).value |
value: (opts.value || {}).value, |
||||||
}); |
}); |
||||||
|
|
||||||
this.display.on(BI.Events.AFTERINIT, function () { |
this.display.on(Events.AFTERINIT, () => { |
||||||
self.fireEvent(BI.Events.AFTERINIT); |
self.fireEvent(Events.AFTERINIT); |
||||||
}); |
}); |
||||||
|
|
||||||
this.display.on(BI.TreeView.EVENT_INIT, function () { |
this.display.on(TreeView.EVENT_INIT, () => { |
||||||
backToPopup.setVisible(false); |
backToPopup.setVisible(false); |
||||||
}); |
}); |
||||||
|
|
||||||
this.display.on(BI.TreeView.EVENT_AFTERINIT, function () { |
this.display.on(TreeView.EVENT_AFTERINIT, () => { |
||||||
backToPopup.setVisible(true); |
backToPopup.setVisible(true); |
||||||
}); |
}); |
||||||
|
|
||||||
BI.createWidget({ |
createWidget({ |
||||||
type: "bi.vtape", |
type: VTapeLayout.xtype, |
||||||
element: this, |
element: this, |
||||||
items: [{ |
items: [ |
||||||
|
{ |
||||||
height: this.constants.height, |
height: this.constants.height, |
||||||
el: backToPopup |
el: backToPopup, |
||||||
}, { |
}, |
||||||
|
{ |
||||||
height: "fill", |
height: "fill", |
||||||
el: this.display |
el: this.display, |
||||||
}] |
} |
||||||
|
], |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
empty: function () { |
empty() { |
||||||
this.display.empty(); |
this.display.empty(); |
||||||
}, |
} |
||||||
|
|
||||||
populate: function (configs) { |
populate(configs) { |
||||||
this.display.stroke(configs); |
this.display.stroke(configs); |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
v || (v = {}); |
v || (v = {}); |
||||||
this.display.setSelectedValue(v.value); |
this.display.setSelectedValue(v.value); |
||||||
}, |
|
||||||
|
|
||||||
getValue: function () { |
|
||||||
|
|
||||||
} |
} |
||||||
}); |
|
||||||
|
|
||||||
BI.MultiTreeCheckPane.EVENT_CONTINUE_CLICK = "EVENT_CONTINUE_CLICK"; |
getValue() { |
||||||
|
} |
||||||
|
} |
||||||
BI.shortcut("bi.multi_tree_check_pane", BI.MultiTreeCheckPane); |
|
||||||
|
@ -1,106 +1,108 @@ |
|||||||
/** |
import { shortcut, extend, emptyFn, createWidget, i18nText } from "@/core"; |
||||||
* 带加载的多选下拉面板 |
import { Pane } from "@/base"; |
||||||
* @class BI.MultiTreePopup |
import { Asynctree, MultiPopupView, TreeView } from "@/case"; |
||||||
* @extends BI.Pane |
|
||||||
*/ |
@shortcut() |
||||||
BI.MultiTreePopup = BI.inherit(BI.Pane, { |
export class MultiTreePopup extends Pane { |
||||||
|
static xtype = "bi.multi_tree_popup_view"; |
||||||
_defaultConfig: function () { |
|
||||||
return BI.extend(BI.MultiTreePopup.superclass._defaultConfig.apply(this, arguments), { |
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
static EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM"; |
||||||
|
static EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR"; |
||||||
|
static EVENT_AFTERINIT = "EVENT_AFTERINIT"; |
||||||
|
|
||||||
|
_defaultConfig() { |
||||||
|
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-multi-tree-popup", |
baseCls: "bi-multi-tree-popup", |
||||||
maxWidth: "auto", |
maxWidth: "auto", |
||||||
minWidth: 140, |
minWidth: 140, |
||||||
maxHeight: 400, |
maxHeight: 400, |
||||||
onLoaded: BI.emptyFn, |
onLoaded: emptyFn, |
||||||
el: { |
el: { |
||||||
type: "bi.async_tree" |
type: Asynctree.xtype, |
||||||
} |
|
||||||
}); |
|
||||||
}, |
}, |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.MultiTreePopup.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
|
|
||||||
var self = this, opts = this.options, v = opts.value; |
const self = this, |
||||||
|
opts = this.options, |
||||||
|
v = opts.value; |
||||||
|
|
||||||
this.selectedValues = {}; |
this.selectedValues = {}; |
||||||
|
|
||||||
this.tree = BI.createWidget(opts.el, { |
this.tree = createWidget(opts.el, { |
||||||
type: "bi.async_tree", |
type: Asynctree.xtype, |
||||||
showLine: opts.showLine, |
showLine: opts.showLine, |
||||||
height: 400, |
height: 400, |
||||||
cls: "popup-view-tree", |
cls: "popup-view-tree", |
||||||
itemsCreator: opts.itemsCreator, |
itemsCreator: opts.itemsCreator, |
||||||
onLoaded: opts.onLoaded, |
onLoaded: opts.onLoaded, |
||||||
value: v.value || {} |
value: v.value || {}, |
||||||
}); |
}); |
||||||
|
|
||||||
this.popupView = BI.createWidget({ |
this.popupView = createWidget({ |
||||||
type: "bi.multi_popup_view", |
type: MultiPopupView.xtype, |
||||||
element: this, |
element: this, |
||||||
stopPropagation: false, |
stopPropagation: false, |
||||||
maxWidth: opts.maxWidth, |
maxWidth: opts.maxWidth, |
||||||
minWidth: opts.minWidth, |
minWidth: opts.minWidth, |
||||||
maxHeight: opts.maxHeight, |
maxHeight: opts.maxHeight, |
||||||
buttons: [BI.i18nText("BI-Basic_Clears"), BI.i18nText("BI-Basic_OK")], |
buttons: [i18nText("BI-Basic_Clears"), i18nText("BI-Basic_OK")], |
||||||
el: this.tree |
el: this.tree, |
||||||
}); |
}); |
||||||
|
|
||||||
this.popupView.on(BI.MultiPopupView.EVENT_CLICK_TOOLBAR_BUTTON, function (index) { |
this.popupView.on( |
||||||
|
MultiPopupView.EVENT_CLICK_TOOLBAR_BUTTON, |
||||||
|
index => { |
||||||
switch (index) { |
switch (index) { |
||||||
case 0: |
case 0: |
||||||
self.fireEvent(BI.MultiTreePopup.EVENT_CLICK_CLEAR); |
self.fireEvent(MultiTreePopup.EVENT_CLICK_CLEAR); |
||||||
break; |
break; |
||||||
case 1: |
case 1: |
||||||
self.fireEvent(BI.MultiTreePopup.EVENT_CLICK_CONFIRM); |
self.fireEvent(MultiTreePopup.EVENT_CLICK_CONFIRM); |
||||||
break; |
break; |
||||||
} |
} |
||||||
}); |
} |
||||||
|
); |
||||||
|
|
||||||
this.tree.on(BI.TreeView.EVENT_CHANGE, function () { |
this.tree.on(TreeView.EVENT_CHANGE, () => { |
||||||
self.fireEvent(BI.MultiTreePopup.EVENT_CHANGE); |
self.fireEvent(MultiTreePopup.EVENT_CHANGE); |
||||||
}); |
}); |
||||||
|
|
||||||
this.tree.on(BI.TreeView.EVENT_AFTERINIT, function () { |
this.tree.on(TreeView.EVENT_AFTERINIT, () => { |
||||||
self.fireEvent(BI.MultiTreePopup.EVENT_AFTERINIT); |
self.fireEvent(MultiTreePopup.EVENT_AFTERINIT); |
||||||
}); |
}); |
||||||
|
} |
||||||
|
|
||||||
}, |
getValue() { |
||||||
|
|
||||||
getValue: function () { |
|
||||||
return this.tree.getValue(); |
return this.tree.getValue(); |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
v || (v = {}); |
v || (v = {}); |
||||||
this.tree.setSelectedValue(v.value); |
this.tree.setSelectedValue(v.value); |
||||||
}, |
} |
||||||
|
|
||||||
populate: function (config) { |
populate(config) { |
||||||
this.tree.stroke(config); |
this.tree.stroke(config); |
||||||
}, |
} |
||||||
|
|
||||||
hasChecked: function () { |
hasChecked() { |
||||||
return this.tree.hasChecked(); |
return this.tree.hasChecked(); |
||||||
}, |
} |
||||||
|
|
||||||
setDirection: function (direction, position) { |
setDirection(direction, position) { |
||||||
this.popupView.setDirection(direction, position); |
this.popupView.setDirection(direction, position); |
||||||
}, |
} |
||||||
|
|
||||||
resetHeight: function (h) { |
resetHeight(h) { |
||||||
this.popupView.resetHeight(h); |
this.popupView.resetHeight(h); |
||||||
}, |
} |
||||||
|
|
||||||
resetWidth: function (w) { |
resetWidth(w) { |
||||||
this.popupView.resetWidth(w); |
this.popupView.resetWidth(w); |
||||||
} |
} |
||||||
}); |
} |
||||||
|
|
||||||
BI.MultiTreePopup.EVENT_CHANGE = "EVENT_CHANGE"; |
|
||||||
BI.MultiTreePopup.EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM"; |
|
||||||
BI.MultiTreePopup.EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR"; |
|
||||||
BI.MultiTreePopup.EVENT_AFTERINIT = "EVENT_AFTERINIT"; |
|
||||||
|
|
||||||
|
|
||||||
BI.shortcut("bi.multi_tree_popup_view", BI.MultiTreePopup); |
|
||||||
|
@ -1,67 +1,80 @@ |
|||||||
/** |
import { |
||||||
* 查看已选按钮 |
shortcut, |
||||||
* Created by guy on 15/11/3. |
extend, |
||||||
* @class BI.MultiTreeCheckSelectedButton |
emptyFn, |
||||||
* @extends BI.Single |
createWidget, |
||||||
*/ |
i18nText, |
||||||
BI.MultiTreeCheckSelectedButton = BI.inherit(BI.Single, { |
Controller, |
||||||
|
size |
||||||
|
} from "@/core"; |
||||||
|
import { Single, TextButton, IconButton } from "@/base"; |
||||||
|
import { MultiSelectCheckSelectedButton } from "../../multiselect/trigger/button.checkselected"; |
||||||
|
|
||||||
_defaultConfig: function () { |
@shortcut() |
||||||
return BI.extend(BI.MultiTreeCheckSelectedButton.superclass._defaultConfig.apply(this, arguments), { |
export class MultiTreeCheckSelectedButton extends Single { |
||||||
|
static xtype = "bi.multi_tree_check_selected_button"; |
||||||
|
|
||||||
|
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
|
||||||
|
_defaultConfig() { |
||||||
|
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-multi-tree-check-selected-button", |
baseCls: "bi-multi-tree-check-selected-button", |
||||||
itemsCreator: BI.emptyFn |
itemsCreator: emptyFn, |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.MultiTreeCheckSelectedButton.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
var self = this; |
const self = this; |
||||||
this.indicator = BI.createWidget({ |
this.indicator = createWidget({ |
||||||
type: "bi.icon_button", |
type: IconButton.xtype, |
||||||
cls: "check-font trigger-check-selected icon-size-12", |
cls: "check-font trigger-check-selected icon-size-12", |
||||||
width: 16, |
width: 16, |
||||||
height: 16, |
height: 16, |
||||||
stopPropagation: true |
stopPropagation: true, |
||||||
}); |
}); |
||||||
|
|
||||||
this.checkSelected = BI.createWidget({ |
this.checkSelected = createWidget({ |
||||||
type: "bi.text_button", |
type: TextButton.xtype, |
||||||
cls: "bi-high-light-background trigger-check-text", |
cls: "bi-high-light-background trigger-check-text", |
||||||
invisible: true, |
invisible: true, |
||||||
hgap: 4, |
hgap: 4, |
||||||
text: BI.i18nText("BI-Check_Selected"), |
text: i18nText("BI-Check_Selected"), |
||||||
textAlign: "center", |
textAlign: "center", |
||||||
}); |
}); |
||||||
this.checkSelected.on(BI.Controller.EVENT_CHANGE, function () { |
this.checkSelected.on(Controller.EVENT_CHANGE, function () { |
||||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
self.fireEvent(Controller.EVENT_CHANGE, arguments); |
||||||
}); |
}); |
||||||
|
|
||||||
this.checkSelected.on(BI.TextButton.EVENT_CHANGE, function () { |
this.checkSelected.on(TextButton.EVENT_CHANGE, function () { |
||||||
self.fireEvent(BI.MultiSelectCheckSelectedButton.EVENT_CHANGE, arguments); |
self.fireEvent( |
||||||
|
MultiSelectCheckSelectedButton.EVENT_CHANGE, |
||||||
|
arguments |
||||||
|
); |
||||||
}); |
}); |
||||||
|
|
||||||
BI.createWidget({ |
createWidget({ |
||||||
type: "bi.horizontal", |
type: "bi.horizontal", |
||||||
element: this, |
element: this, |
||||||
items: [this.indicator, this.checkSelected] |
items: [this.indicator, this.checkSelected], |
||||||
}); |
}); |
||||||
|
|
||||||
this.element.hover(function () { |
this.element.hover( |
||||||
|
() => { |
||||||
self.indicator.setVisible(false); |
self.indicator.setVisible(false); |
||||||
self.checkSelected.setVisible(true); |
self.checkSelected.setVisible(true); |
||||||
}, function () { |
}, |
||||||
|
() => { |
||||||
self.indicator.setVisible(true); |
self.indicator.setVisible(true); |
||||||
self.checkSelected.setVisible(false); |
self.checkSelected.setVisible(false); |
||||||
}); |
} |
||||||
|
); |
||||||
this.setVisible(false); |
this.setVisible(false); |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
v || (v = {}); |
v || (v = {}); |
||||||
var show = BI.size(v.value) > 0; |
const show = size(v.value) > 0; |
||||||
this.setVisible(show); |
this.setVisible(show); |
||||||
} |
} |
||||||
}); |
} |
||||||
|
|
||||||
BI.MultiTreeCheckSelectedButton.EVENT_CHANGE = "EVENT_CHANGE"; |
|
||||||
BI.shortcut("bi.multi_tree_check_selected_button", BI.MultiTreeCheckSelectedButton); |
|
||||||
|
@ -1,129 +1,148 @@ |
|||||||
/** |
import { |
||||||
* |
shortcut, |
||||||
* 在搜索框中输入文本弹出的面板 |
Widget, |
||||||
* @class BI.MultiTreeSearchInsertPane |
i18nText, |
||||||
* @extends BI.Pane |
extend, |
||||||
*/ |
Controller, |
||||||
|
AbsoluteLayout, |
||||||
|
isEmptyArray |
||||||
|
} from "@/core"; |
||||||
|
import { TreeView, PartTree } from "@/case"; |
||||||
|
import { TextButton } from "@/base"; |
||||||
|
|
||||||
BI.MultiTreeSearchInsertPane = BI.inherit(BI.Widget, { |
@shortcut() |
||||||
|
export class MultiTreeSearchInsertPane extends Widget { |
||||||
|
static xtype = "bi.multi_tree_search_insert_pane"; |
||||||
|
|
||||||
constants: { |
props = { |
||||||
height: 24, |
|
||||||
}, |
|
||||||
|
|
||||||
props: { |
|
||||||
baseCls: "bi-multi-tree-search-insert-pane bi-card", |
baseCls: "bi-multi-tree-search-insert-pane bi-card", |
||||||
itemsCreator: BI.emptyFn, |
el: { type: PartTree.xtype }, |
||||||
keywordGetter: BI.emptyFn, |
}; |
||||||
el: { |
|
||||||
type: "bi.part_tree" |
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
} |
static EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM"; |
||||||
}, |
static EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR"; |
||||||
|
static EVENT_ADD_ITEM = "EVENT_ADD_ITEM"; |
||||||
|
static EVENT_CLICK_TREE_NODE = "EVENT_CLICK_TREE_NODE"; |
||||||
|
|
||||||
render: function () { |
render() { |
||||||
var self = this, opts = this.options; |
const self = this, |
||||||
|
opts = this.options; |
||||||
|
|
||||||
return { |
return { |
||||||
type: "bi.absolute", |
type: AbsoluteLayout.xtype, |
||||||
items: [ |
items: [ |
||||||
{ |
{ |
||||||
el: { |
el: { |
||||||
type: "bi.text_button", |
type: TextButton.xtype, |
||||||
invisible: true, |
invisible: true, |
||||||
ref: function (_ref) { |
ref(_ref) { |
||||||
self.addTip = _ref; |
self.addTip = _ref; |
||||||
}, |
}, |
||||||
text: BI.i18nText("BI-Basic_Click_To_Add_Text", ""), |
text: i18nText("BI-Basic_Click_To_Add_Text", ""), |
||||||
height: this.constants.height, |
height: this.constants.height, |
||||||
cls: "bi-high-light", |
cls: "bi-high-light", |
||||||
handler: function () { |
handler() { |
||||||
self.fireEvent(BI.MultiTreeSearchInsertPane.EVENT_ADD_ITEM, opts.keywordGetter()); |
self.fireEvent( |
||||||
} |
MultiTreeSearchInsertPane.EVENT_ADD_ITEM, |
||||||
|
opts.keywordGetter() |
||||||
|
); |
||||||
|
}, |
||||||
}, |
}, |
||||||
top: 5, |
top: 5, |
||||||
left: 0, |
left: 0, |
||||||
right: 0 |
right: 0, |
||||||
}, { |
}, |
||||||
el: BI.extend({ |
{ |
||||||
type: "bi.part_tree", |
el: extend( |
||||||
tipText: BI.i18nText("BI-No_Select"), |
{ |
||||||
itemsCreator: function (op, callback) { |
type: PartTree.xtype, |
||||||
|
tipText: i18nText("BI-No_Select"), |
||||||
|
itemsCreator(op, callback) { |
||||||
op.keyword = opts.keywordGetter(); |
op.keyword = opts.keywordGetter(); |
||||||
opts.itemsCreator(op, function (res) { |
opts.itemsCreator(op, res => { |
||||||
callback(res); |
callback(res); |
||||||
self.setKeyword(opts.keywordGetter(), res.items); |
self.setKeyword( |
||||||
|
opts.keywordGetter(), |
||||||
|
res.items |
||||||
|
); |
||||||
}); |
}); |
||||||
}, |
}, |
||||||
ref: function (_ref) { |
ref(_ref) { |
||||||
self.partTree = _ref; |
self.partTree = _ref; |
||||||
}, |
}, |
||||||
value: opts.value, |
value: opts.value, |
||||||
listeners: [ |
listeners: [ |
||||||
{ |
{ |
||||||
eventName: BI.Controller.EVENT_CHANGE, |
eventName: Controller.EVENT_CHANGE, |
||||||
action: function () { |
action() { |
||||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
self.fireEvent( |
||||||
} |
Controller.EVENT_CHANGE, |
||||||
}, { |
arguments |
||||||
eventName: BI.TreeView.EVENT_CHANGE, |
); |
||||||
action: function () { |
}, |
||||||
self.fireEvent(BI.MultiTreeSearchInsertPane.EVENT_CHANGE); |
}, |
||||||
} |
{ |
||||||
}, { |
eventName: TreeView.EVENT_CHANGE, |
||||||
eventName: BI.PartTree.EVENT_CLICK_TREE_NODE, |
action() { |
||||||
action: function () { |
self.fireEvent( |
||||||
self.fireEvent(BI.MultiTreeSearchInsertPane.EVENT_CLICK_TREE_NODE); |
MultiTreeSearchInsertPane.EVENT_CHANGE |
||||||
} |
); |
||||||
|
}, |
||||||
|
}, |
||||||
|
{ |
||||||
|
eventName: PartTree.EVENT_CLICK_TREE_NODE, |
||||||
|
action() { |
||||||
|
self.fireEvent( |
||||||
|
MultiTreeSearchInsertPane.EVENT_CLICK_TREE_NODE |
||||||
|
); |
||||||
|
}, |
||||||
} |
} |
||||||
] |
], |
||||||
}, opts.el), |
}, |
||||||
|
opts.el |
||||||
|
), |
||||||
left: 0, |
left: 0, |
||||||
top: 0, |
top: 0, |
||||||
bottom: 0, |
bottom: 0, |
||||||
right: 0 |
right: 0, |
||||||
} |
} |
||||||
] |
], |
||||||
}; |
}; |
||||||
}, |
} |
||||||
|
|
||||||
setKeyword: function (keyword, nodes) { |
setKeyword(keyword, nodes) { |
||||||
var isAddTipVisible = BI.isEmptyArray(nodes); |
const isAddTipVisible = isEmptyArray(nodes); |
||||||
this.addTip.setVisible(isAddTipVisible); |
this.addTip.setVisible(isAddTipVisible); |
||||||
this.partTree.setVisible(!isAddTipVisible); |
this.partTree.setVisible(!isAddTipVisible); |
||||||
isAddTipVisible && this.addTip.setText(BI.i18nText("BI-Basic_Click_To_Add_Text", keyword)); |
isAddTipVisible && |
||||||
}, |
this.addTip.setText( |
||||||
|
i18nText("BI-Basic_Click_To_Add_Text", keyword) |
||||||
|
); |
||||||
|
} |
||||||
|
|
||||||
hasChecked: function () { |
hasChecked() { |
||||||
return this.partTree.hasChecked(); |
return this.partTree.hasChecked(); |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
this.setSelectedValue(v.value); |
this.setSelectedValue(v.value); |
||||||
}, |
} |
||||||
|
|
||||||
setSelectedValue: function (v) { |
setSelectedValue(v) { |
||||||
v || (v = {}); |
v || (v = {}); |
||||||
this.partTree.setSelectedValue(v); |
this.partTree.setSelectedValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
return this.partTree.getValue(); |
return this.partTree.getValue(); |
||||||
}, |
} |
||||||
|
|
||||||
empty: function () { |
empty() { |
||||||
this.partTree.empty(); |
this.partTree.empty(); |
||||||
}, |
|
||||||
|
|
||||||
populate: function (op) { |
|
||||||
this.partTree.stroke.apply(this.partTree, arguments); |
|
||||||
} |
} |
||||||
}); |
|
||||||
|
|
||||||
BI.MultiTreeSearchInsertPane.EVENT_CHANGE = "EVENT_CHANGE"; |
|
||||||
|
|
||||||
BI.MultiTreeSearchInsertPane.EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM"; |
populate(op) { |
||||||
BI.MultiTreeSearchInsertPane.EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR"; |
this.partTree.stroke(...arguments); |
||||||
BI.MultiTreeSearchInsertPane.EVENT_ADD_ITEM = "EVENT_ADD_ITEM"; |
} |
||||||
BI.MultiTreeSearchInsertPane.EVENT_CLICK_TREE_NODE = "EVENT_CLICK_TREE_NODE"; |
} |
||||||
|
|
||||||
BI.shortcut("bi.multi_tree_search_insert_pane", BI.MultiTreeSearchInsertPane); |
|
||||||
|
@ -1,84 +1,84 @@ |
|||||||
/** |
import { shortcut, extend, i18nText, Controller } from "@/core"; |
||||||
* |
import { Pane } from "@/base"; |
||||||
* 在搜索框中输入文本弹出的面板 |
import { TreeView, PartTree } from "@/case"; |
||||||
* @class BI.MultiTreeSearchPane |
|
||||||
* @extends BI.Pane |
|
||||||
*/ |
|
||||||
|
|
||||||
BI.MultiTreeSearchPane = BI.inherit(BI.Pane, { |
@shortcut() |
||||||
|
export class MultiTreeSearchPane extends Pane { |
||||||
|
static xtype = "bi.multi_tree_search_pane"; |
||||||
|
|
||||||
props: { |
props = { baseCls: "bi-multi-tree-search-pane bi-card" }; |
||||||
baseCls: "bi-multi-tree-search-pane bi-card", |
|
||||||
itemsCreator: BI.emptyFn, |
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
keywordGetter: BI.emptyFn |
static EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM"; |
||||||
}, |
static EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR"; |
||||||
|
static EVENT_CLICK_TREE_NODE = "EVENT_CLICK_TREE_NODE"; |
||||||
|
|
||||||
render: function () { |
render() { |
||||||
var self = this, opts = this.options; |
const self = this, |
||||||
|
opts = this.options; |
||||||
|
|
||||||
return BI.extend({ |
return extend( |
||||||
type: "bi.part_tree", |
{ |
||||||
|
type: PartTree.xtype, |
||||||
element: this, |
element: this, |
||||||
tipText: BI.i18nText("BI-No_Select"), |
tipText: i18nText("BI-No_Select"), |
||||||
itemsCreator: function (op, callback) { |
itemsCreator(op, callback) { |
||||||
op.keyword = opts.keywordGetter(); |
op.keyword = opts.keywordGetter(); |
||||||
opts.itemsCreator(op, callback); |
opts.itemsCreator(op, callback); |
||||||
}, |
}, |
||||||
value: opts.value, |
value: opts.value, |
||||||
listeners: [ |
listeners: [ |
||||||
{ |
{ |
||||||
eventName: BI.Controller.EVENT_CHANGE, |
eventName: Controller.EVENT_CHANGE, |
||||||
action: function () { |
action() { |
||||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
self.fireEvent(Controller.EVENT_CHANGE, arguments); |
||||||
} |
}, |
||||||
}, { |
}, |
||||||
eventName: BI.TreeView.EVENT_CHANGE, |
{ |
||||||
action: function () { |
eventName: TreeView.EVENT_CHANGE, |
||||||
self.fireEvent(BI.MultiTreeSearchPane.EVENT_CHANGE); |
action() { |
||||||
} |
self.fireEvent(MultiTreeSearchPane.EVENT_CHANGE); |
||||||
}, { |
}, |
||||||
eventName: BI.PartTree.EVENT_CLICK_TREE_NODE, |
}, |
||||||
action: function () { |
{ |
||||||
self.fireEvent(BI.MultiTreeSearchPane.EVENT_CLICK_TREE_NODE); |
eventName: PartTree.EVENT_CLICK_TREE_NODE, |
||||||
} |
action() { |
||||||
|
self.fireEvent( |
||||||
|
MultiTreeSearchPane.EVENT_CLICK_TREE_NODE |
||||||
|
); |
||||||
|
}, |
||||||
} |
} |
||||||
], |
], |
||||||
ref: function (_ref) { |
ref(_ref) { |
||||||
self.partTree = _ref; |
self.partTree = _ref; |
||||||
} |
|
||||||
}, opts.el); |
|
||||||
}, |
}, |
||||||
|
}, |
||||||
|
opts.el |
||||||
|
); |
||||||
|
} |
||||||
|
|
||||||
hasChecked: function () { |
hasChecked() { |
||||||
return this.partTree.hasChecked(); |
return this.partTree.hasChecked(); |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
this.setSelectedValue(v.value); |
this.setSelectedValue(v.value); |
||||||
}, |
} |
||||||
|
|
||||||
setSelectedValue: function (v) { |
setSelectedValue(v) { |
||||||
v || (v = {}); |
v || (v = {}); |
||||||
this.partTree.setSelectedValue(v); |
this.partTree.setSelectedValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
return this.partTree.getValue(); |
return this.partTree.getValue(); |
||||||
}, |
} |
||||||
|
|
||||||
empty: function () { |
empty() { |
||||||
this.partTree.empty(); |
this.partTree.empty(); |
||||||
}, |
|
||||||
|
|
||||||
populate: function (op) { |
|
||||||
this.partTree.stroke.apply(this.partTree, arguments); |
|
||||||
} |
} |
||||||
}); |
|
||||||
|
|
||||||
BI.MultiTreeSearchPane.EVENT_CHANGE = "EVENT_CHANGE"; |
populate(op) { |
||||||
|
this.partTree.stroke(...arguments); |
||||||
BI.MultiTreeSearchPane.EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM"; |
} |
||||||
BI.MultiTreeSearchPane.EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR"; |
} |
||||||
BI.MultiTreeSearchPane.EVENT_CLICK_TREE_NODE = "EVENT_CLICK_TREE_NODE"; |
|
||||||
|
|
||||||
BI.shortcut("bi.multi_tree_search_pane", BI.MultiTreeSearchPane); |
|
||||||
|
@ -1,220 +1,260 @@ |
|||||||
/** |
import { |
||||||
* searcher |
shortcut, |
||||||
* Created by guy on 15/11/3. |
Widget, |
||||||
* @class BI.MultiTreeSearcher |
extend, |
||||||
* @extends Widget |
emptyFn, |
||||||
*/ |
createWidget, |
||||||
BI.MultiTreeSearcher = BI.inherit(BI.Widget, { |
isNotNull, |
||||||
|
isNumber, |
||||||
_defaultConfig: function () { |
size, |
||||||
return BI.extend(BI.MultiTreeSearcher.superclass._defaultConfig.apply(this, arguments), { |
keys, |
||||||
|
each, |
||||||
|
isEmptyObject, Func |
||||||
|
} from "@/core"; |
||||||
|
import { MultiSelectEditor } from "../../multiselect/trigger/editor.multiselect"; |
||||||
|
import { MultiSelectSearcher } from "../../multiselect/trigger/searcher.multiselect"; |
||||||
|
import { MultiTreeSearchPane } from "./multi.tree.search.pane"; |
||||||
|
import { Searcher } from "@/base"; |
||||||
|
import { SimpleStateEditor } from "@/case"; |
||||||
|
|
||||||
|
@shortcut() |
||||||
|
export class MultiTreeSearcher extends Widget { |
||||||
|
static xtype = "bi.multi_tree_searcher"; |
||||||
|
|
||||||
|
static EVENT_SEARCHING = "EVENT_SEARCHING"; |
||||||
|
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; |
||||||
|
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
static EVENT_START = "EVENT_START"; |
||||||
|
static EVENT_STOP = "EVENT_STOP"; |
||||||
|
static EVENT_PAUSE = "EVENT_PAUSE"; |
||||||
|
static EVENT_CLICK_TREE_NODE = "EVENT_CLICK_TREE_NODE"; |
||||||
|
|
||||||
|
_defaultConfig() { |
||||||
|
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-multi-tree-searcher", |
baseCls: "bi-multi-tree-searcher", |
||||||
itemsCreator: BI.emptyFn, |
itemsCreator: emptyFn, |
||||||
valueFormatter: function (v) { |
valueFormatter(v) { |
||||||
return v; |
return v; |
||||||
}, |
}, |
||||||
popup: {}, |
popup: {}, |
||||||
|
|
||||||
adapter: null, |
adapter: null, |
||||||
masker: {} |
masker: {}, |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.MultiTreeSearcher.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
var self = this, o = this.options; |
const self = this, |
||||||
this.editor = BI.createWidget({ |
o = this.options; |
||||||
|
this.editor = createWidget({ |
||||||
type: "bi.multi_select_editor", |
type: "bi.multi_select_editor", |
||||||
watermark: o.watermark, |
watermark: o.watermark, |
||||||
height: o.height, |
height: o.height, |
||||||
el: { |
el: { |
||||||
type: "bi.simple_state_editor", |
type: SimpleStateEditor.xtype, |
||||||
text: o.text, |
text: o.text, |
||||||
defaultText: o.defaultText, |
defaultText: o.defaultText, |
||||||
height: o.height |
height: o.height, |
||||||
}, |
}, |
||||||
listeners: [ |
listeners: [ |
||||||
{ |
{ |
||||||
eventName: BI.MultiSelectEditor.EVENT_FOCUS, |
eventName: MultiSelectEditor.EVENT_FOCUS, |
||||||
action: function () { |
action() { |
||||||
self.fireEvent(BI.MultiSelectSearcher.EVENT_FOCUS); |
self.fireEvent(MultiSelectSearcher.EVENT_FOCUS); |
||||||
} |
}, |
||||||
}, { |
}, |
||||||
eventName: BI.MultiSelectEditor.EVENT_BLUR, |
{ |
||||||
action: function () { |
eventName: MultiSelectEditor.EVENT_BLUR, |
||||||
self.fireEvent(BI.MultiSelectSearcher.EVENT_BLUR); |
action() { |
||||||
} |
self.fireEvent(MultiSelectSearcher.EVENT_BLUR); |
||||||
|
}, |
||||||
} |
} |
||||||
] |
], |
||||||
}); |
}); |
||||||
|
|
||||||
this.searcher = BI.createWidget({ |
this.searcher = createWidget({ |
||||||
type: "bi.searcher", |
type: Searcher.xtype, |
||||||
element: this, |
element: this, |
||||||
isAutoSearch: false, |
isAutoSearch: false, |
||||||
isAutoSync: false, |
isAutoSync: false, |
||||||
onSearch: function (op, callback) { |
onSearch(op, callback) { |
||||||
callback({ |
callback({ |
||||||
keyword: self.editor.getValue() |
keyword: self.editor.getValue(), |
||||||
}); |
}); |
||||||
}, |
}, |
||||||
el: this.editor, |
el: this.editor, |
||||||
|
|
||||||
popup: BI.extend({ |
popup: extend( |
||||||
type: "bi.multi_tree_search_pane", |
{ |
||||||
keywordGetter: function () { |
type: MultiTreeSearchPane.xtype, |
||||||
|
keywordGetter() { |
||||||
return self.editor.getValue(); |
return self.editor.getValue(); |
||||||
}, |
}, |
||||||
itemsCreator: function (op, callback) { |
itemsCreator(op, callback) { |
||||||
op.keyword = self.editor.getValue(); |
op.keyword = self.editor.getValue(); |
||||||
o.itemsCreator(op, callback); |
o.itemsCreator(op, callback); |
||||||
}, |
}, |
||||||
listeners: [ |
listeners: [ |
||||||
{ |
{ |
||||||
eventName: BI.MultiTreeSearchPane.EVENT_CLICK_TREE_NODE, |
eventName: |
||||||
action: function () { |
MultiTreeSearchPane.EVENT_CLICK_TREE_NODE, |
||||||
self.fireEvent(BI.MultiTreeSearcher.EVENT_CLICK_TREE_NODE, arguments); |
action() { |
||||||
} |
self.fireEvent( |
||||||
|
MultiTreeSearcher.EVENT_CLICK_TREE_NODE, |
||||||
|
arguments |
||||||
|
); |
||||||
|
}, |
||||||
} |
} |
||||||
], |
], |
||||||
value: o.value |
value: o.value, |
||||||
}, o.popup), |
}, |
||||||
|
o.popup |
||||||
|
), |
||||||
|
|
||||||
adapter: o.adapter, |
adapter: o.adapter, |
||||||
masker: o.masker |
masker: o.masker, |
||||||
}); |
}); |
||||||
this.searcher.on(BI.Searcher.EVENT_START, function () { |
this.searcher.on(Searcher.EVENT_START, () => { |
||||||
self.fireEvent(BI.MultiTreeSearcher.EVENT_START); |
self.fireEvent(MultiTreeSearcher.EVENT_START); |
||||||
}); |
}); |
||||||
this.searcher.on(BI.Searcher.EVENT_PAUSE, function () { |
this.searcher.on(Searcher.EVENT_PAUSE, () => { |
||||||
self.fireEvent(BI.MultiTreeSearcher.EVENT_PAUSE); |
self.fireEvent(MultiTreeSearcher.EVENT_PAUSE); |
||||||
}); |
}); |
||||||
this.searcher.on(BI.Searcher.EVENT_STOP, function () { |
this.searcher.on(Searcher.EVENT_STOP, () => { |
||||||
self.fireEvent(BI.MultiTreeSearcher.EVENT_STOP); |
self.fireEvent(MultiTreeSearcher.EVENT_STOP); |
||||||
}); |
}); |
||||||
this.searcher.on(BI.Searcher.EVENT_CHANGE, function () { |
this.searcher.on(Searcher.EVENT_CHANGE, function () { |
||||||
self.fireEvent(BI.MultiTreeSearcher.EVENT_CHANGE, arguments); |
self.fireEvent(MultiTreeSearcher.EVENT_CHANGE, arguments); |
||||||
}); |
}); |
||||||
this.searcher.on(BI.Searcher.EVENT_SEARCHING, function () { |
this.searcher.on(Searcher.EVENT_SEARCHING, function () { |
||||||
var keywords = this.getKeywords(); |
const keywords = this.getKeywords(); |
||||||
self.fireEvent(BI.MultiTreeSearcher.EVENT_SEARCHING, keywords); |
self.fireEvent(MultiTreeSearcher.EVENT_SEARCHING, keywords); |
||||||
}); |
}); |
||||||
if (BI.isNotNull(o.value)) { |
if (isNotNull(o.value)) { |
||||||
this.setState(o.value); |
this.setState(o.value); |
||||||
} |
} |
||||||
}, |
} |
||||||
|
|
||||||
adjustView: function () { |
adjustView() { |
||||||
this.searcher.adjustView(); |
this.searcher.adjustView(); |
||||||
}, |
} |
||||||
|
|
||||||
setAdapter: function (adapter) { |
setAdapter(adapter) { |
||||||
this.searcher.setAdapter(adapter); |
this.searcher.setAdapter(adapter); |
||||||
}, |
} |
||||||
|
|
||||||
isSearching: function () { |
isSearching() { |
||||||
return this.searcher.isSearching(); |
return this.searcher.isSearching(); |
||||||
}, |
} |
||||||
|
|
||||||
stopSearch: function () { |
stopSearch() { |
||||||
this.searcher.stopSearch(); |
this.searcher.stopSearch(); |
||||||
}, |
} |
||||||
|
|
||||||
getKeyword: function () { |
getKeyword() { |
||||||
return this.editor.getValue(); |
return this.editor.getValue(); |
||||||
}, |
} |
||||||
|
|
||||||
hasMatched: function () { |
hasMatched() { |
||||||
return this.searcher.hasMatched(); |
return this.searcher.hasMatched(); |
||||||
}, |
} |
||||||
|
|
||||||
hasChecked: function () { |
hasChecked() { |
||||||
return this.searcher.getView() && this.searcher.getView().hasChecked(); |
return this.searcher.getView() && this.searcher.getView().hasChecked(); |
||||||
}, |
} |
||||||
|
|
||||||
setState: function (ob) { |
setState(ob) { |
||||||
var o = this.options; |
const o = this.options; |
||||||
ob || (ob = {}); |
ob || (ob = {}); |
||||||
ob.value || (ob.value = {}); |
ob.value || (ob.value = {}); |
||||||
var count = 0; |
let count = 0; |
||||||
if (BI.isNumber(ob)) { |
if (isNumber(ob)) { |
||||||
this.editor.setState(ob); |
this.editor.setState(ob); |
||||||
} else if (BI.size(ob.value) === 0) { |
} else if (size(ob.value) === 0) { |
||||||
this.editor.setState(BI.Selection.None); |
this.editor.setState(BI.Selection.None); |
||||||
} else { |
} else { |
||||||
var text = ""; |
let text = ""; |
||||||
var value = ob.value; |
const value = ob.value; |
||||||
var names = BI.Func.getSortedResult(BI.keys(value)); |
const names = BI.Func.getSortedResult(keys(value)); |
||||||
BI.each(names, function (idx, name) { |
each(names, (idx, name) => { |
||||||
var childNodes = getChildrenNode(value[name]); |
const childNodes = getChildrenNode(value[name]); |
||||||
text += (name === "null" ? "" : (o.valueFormatter(name + "") || name)) + (childNodes === "" ? (BI.isEmptyObject(value[name]) ? "" : ":") : (":" + childNodes)) + "; "; |
text += |
||||||
|
`${(name === "null" |
||||||
|
? "" |
||||||
|
: o.valueFormatter(`${name}`) || name) + |
||||||
|
(childNodes === "" |
||||||
|
? isEmptyObject(value[name]) |
||||||
|
? "" |
||||||
|
: ":" |
||||||
|
: `:${childNodes}`) |
||||||
|
}; `;
|
||||||
if (childNodes === "") { |
if (childNodes === "") { |
||||||
count++; |
count++; |
||||||
} |
} |
||||||
}); |
}); |
||||||
|
|
||||||
if (count > 20) { |
if (count > 20) { |
||||||
this.editor.setState(BI.Selection.Multi); |
this.editor.setState(Selection.Multi); |
||||||
} else { |
} else { |
||||||
this.editor.setState(text); |
this.editor.setState(text); |
||||||
} |
} |
||||||
} |
} |
||||||
|
|
||||||
function getChildrenNode(ob) { |
function getChildrenNode(ob) { |
||||||
var text = ""; |
let text = ""; |
||||||
var index = 0, size = BI.size(ob); |
const size = size(ob); |
||||||
var names = BI.Func.getSortedResult(BI.keys(ob)); |
let index = 0; |
||||||
BI.each(names, function (idx, name) { |
|
||||||
|
const names = Func.getSortedResult(keys(ob)); |
||||||
|
each(names, (idx, name) => { |
||||||
index++; |
index++; |
||||||
var childNodes = getChildrenNode(ob[name]); |
const childNodes = getChildrenNode(ob[name]); |
||||||
text += (name === "null" ? "" : (o.valueFormatter(name + "") || name)) + (childNodes === "" ? "" : (":" + childNodes)) + (index === size ? "" : ","); |
text += |
||||||
|
(name === "null" |
||||||
|
? "" |
||||||
|
: o.valueFormatter(`${name}`) || name) + |
||||||
|
(childNodes === "" ? "" : `:${childNodes}`) + |
||||||
|
(index === size ? "" : ","); |
||||||
if (childNodes === "") { |
if (childNodes === "") { |
||||||
count++; |
count++; |
||||||
} |
} |
||||||
}); |
}); |
||||||
|
|
||||||
return text; |
return text; |
||||||
} |
} |
||||||
}, |
} |
||||||
|
|
||||||
getState: function () { |
getState() { |
||||||
return this.editor.getState(); |
return this.editor.getState(); |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (ob) { |
setValue(ob) { |
||||||
this.setState(ob); |
this.setState(ob); |
||||||
this.searcher.setValue(ob); |
this.searcher.setValue(ob); |
||||||
}, |
} |
||||||
|
|
||||||
getKey: function () { |
getKey() { |
||||||
return this.editor.getValue(); |
return this.editor.getValue(); |
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
return this.searcher.getValue(); |
return this.searcher.getValue(); |
||||||
}, |
} |
||||||
|
|
||||||
populate: function (items) { |
populate(items) { |
||||||
this.searcher.populate.apply(this.searcher, arguments); |
this.searcher.populate(...arguments); |
||||||
}, |
} |
||||||
|
|
||||||
focus: function () { |
focus() { |
||||||
this.editor.focus(); |
this.editor.focus(); |
||||||
}, |
} |
||||||
|
|
||||||
blur: function () { |
blur() { |
||||||
this.editor.blur(); |
this.editor.blur(); |
||||||
}, |
} |
||||||
|
|
||||||
setWaterMark: function (v) { |
setWaterMark(v) { |
||||||
this.editor.setWaterMark(v); |
this.editor.setWaterMark(v); |
||||||
} |
} |
||||||
}); |
} |
||||||
|
|
||||||
BI.MultiTreeSearcher.EVENT_SEARCHING = "EVENT_SEARCHING"; |
|
||||||
BI.MultiTreeSearcher.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; |
|
||||||
BI.MultiTreeSearcher.EVENT_CHANGE = "EVENT_CHANGE"; |
|
||||||
BI.MultiTreeSearcher.EVENT_START = "EVENT_START"; |
|
||||||
BI.MultiTreeSearcher.EVENT_STOP = "EVENT_STOP"; |
|
||||||
BI.MultiTreeSearcher.EVENT_PAUSE = "EVENT_PAUSE"; |
|
||||||
BI.MultiTreeSearcher.EVENT_CLICK_TREE_NODE = "EVENT_CLICK_TREE_NODE"; |
|
||||||
BI.shortcut("bi.multi_tree_searcher", BI.MultiTreeSearcher); |
|
||||||
|
@ -1,77 +1,86 @@ |
|||||||
/** |
import { |
||||||
* @class BI.SelectTreeExpander |
shortcut, |
||||||
* @extends BI.Widget |
Widget, |
||||||
*/ |
extend, |
||||||
BI.SelectTreeExpander = BI.inherit(BI.Widget, { |
createWidget, |
||||||
|
Controller, |
||||||
|
Events, |
||||||
|
contains |
||||||
|
} from "@/core"; |
||||||
|
import { Expander } from "@/base"; |
||||||
|
|
||||||
_defaultConfig: function () { |
@shortcut() |
||||||
return BI.extend(BI.SelectTreeExpander.superclass._defaultConfig.apply(this, arguments), { |
export class SelectTreeExpander extends Widget { |
||||||
|
static xtype = "bi.select_tree_expander"; |
||||||
|
|
||||||
|
_defaultConfig() { |
||||||
|
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-select-tree-expander", |
baseCls: "bi-select-tree-expander", |
||||||
trigger: "", |
trigger: "", |
||||||
toggle: true, |
toggle: true, |
||||||
direction: "bottom", |
direction: "bottom", |
||||||
isDefaultInit: true, |
isDefaultInit: true, |
||||||
el: {}, |
el: {}, |
||||||
popup: {} |
popup: {}, |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.SelectTreeExpander.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
var self = this, o = this.options; |
const self = this, |
||||||
|
o = this.options; |
||||||
|
|
||||||
this.trigger = BI.createWidget(o.el); |
this.trigger = createWidget(o.el); |
||||||
this.trigger.on(BI.Controller.EVENT_CHANGE, function (type) { |
this.trigger.on(Controller.EVENT_CHANGE, function (type) { |
||||||
if (type === BI.Events.CLICK) { |
if (type === Events.CLICK) { |
||||||
if (this.isSelected()) { |
if (this.isSelected()) { |
||||||
self.expander.setValue([]); |
self.expander.setValue([]); |
||||||
} |
} |
||||||
} |
} |
||||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
self.fireEvent(Controller.EVENT_CHANGE, arguments); |
||||||
}); |
}); |
||||||
|
|
||||||
this.expander = BI.createWidget({ |
this.expander = createWidget({ |
||||||
type: "bi.expander", |
type: Expander.xtype, |
||||||
element: this, |
element: this, |
||||||
trigger: o.trigger, |
trigger: o.trigger, |
||||||
toggle: o.toggle, |
toggle: o.toggle, |
||||||
direction: o.direction, |
direction: o.direction, |
||||||
isDefaultInit: o.isDefaultInit, |
isDefaultInit: o.isDefaultInit, |
||||||
el: this.trigger, |
el: this.trigger, |
||||||
popup: o.popup |
popup: o.popup, |
||||||
}); |
}); |
||||||
this.expander.on(BI.Controller.EVENT_CHANGE, function (type) { |
this.expander.on(Controller.EVENT_CHANGE, function (type) { |
||||||
if (type === BI.Events.CLICK) { |
if (type === Events.CLICK) { |
||||||
self.trigger.setSelected(false); |
self.trigger.setSelected(false); |
||||||
} |
} |
||||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
self.fireEvent(Controller.EVENT_CHANGE, arguments); |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
getAllLeaves: function () { |
getAllLeaves() { |
||||||
return this.expander.getAllLeaves(); |
return this.expander.getAllLeaves(); |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
if (BI.contains(v, this.trigger.getValue())) { |
if (contains(v, this.trigger.getValue())) { |
||||||
this.trigger.setSelected(true); |
this.trigger.setSelected(true); |
||||||
this.expander.setValue([]); |
this.expander.setValue([]); |
||||||
} else { |
} else { |
||||||
this.trigger.setSelected(false); |
this.trigger.setSelected(false); |
||||||
this.expander.setValue(v); |
this.expander.setValue(v); |
||||||
} |
} |
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
if (this.trigger.isSelected()) { |
if (this.trigger.isSelected()) { |
||||||
return [this.trigger.getValue()]; |
return [this.trigger.getValue()]; |
||||||
} |
} |
||||||
|
|
||||||
return this.expander.getValue(); |
return this.expander.getValue(); |
||||||
}, |
} |
||||||
|
|
||||||
populate: function (items) { |
populate(items) { |
||||||
this.expander.populate(items); |
this.expander.populate(items); |
||||||
} |
} |
||||||
}); |
} |
||||||
|
|
||||||
BI.shortcut("bi.select_tree_expander", BI.SelectTreeExpander); |
|
||||||
|
@ -1,94 +1,109 @@ |
|||||||
/** |
import { |
||||||
* @class BI.SelectTreePopup |
shortcut, |
||||||
* @extends BI.Pane |
extend, |
||||||
*/ |
i18nText, |
||||||
|
each, |
||||||
BI.SelectTreePopup = BI.inherit(BI.Pane, { |
createWidget, |
||||||
|
Controller, |
||||||
_defaultConfig: function () { |
isArray, isNotEmptyArray, UUID, defaults, Tree, VerticalLayout |
||||||
return BI.extend(BI.SelectTreePopup.superclass._defaultConfig.apply(this, arguments), { |
} from "@/core"; |
||||||
|
import { Pane } from "@/base"; |
||||||
|
import { BasicTreeItem, BasicTreeNode, LevelTree, TreeExpander } from "@/case"; |
||||||
|
|
||||||
|
@shortcut() |
||||||
|
export class SelectTreePopup extends Pane { |
||||||
|
static xtype = "bi.select_level_tree"; |
||||||
|
|
||||||
|
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
|
||||||
|
_defaultConfig() { |
||||||
|
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-select-level-tree", |
baseCls: "bi-select-level-tree", |
||||||
tipText: BI.i18nText("BI-No_Selected_Item"), |
tipText: i18nText("BI-No_Selected_Item"), |
||||||
items: [], |
items: [], |
||||||
value: "" |
value: "", |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_formatItems: function (nodes, layer, pNode) { |
_formatItems(nodes, layer, pNode) { |
||||||
var self = this; |
const self = this; |
||||||
BI.each(nodes, function (i, node) { |
each(nodes, (i, node) => { |
||||||
var extend = { |
const extend = { |
||||||
layer: layer, |
layer, |
||||||
isFirstNode: i === 0, |
isFirstNode: i === 0, |
||||||
isLastNode: i === nodes.length - 1, |
isLastNode: i === nodes.length - 1, |
||||||
height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, |
height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, |
||||||
pNode: pNode, |
pNode, |
||||||
}; |
}; |
||||||
node.id = node.id || BI.UUID(); |
node.id = node.id || UUID(); |
||||||
|
|
||||||
if (node.isParent === true || node.parent === true || BI.isNotEmptyArray(node.children)) { |
if ( |
||||||
|
node.isParent === true || |
||||||
extend.type = "bi.tree_node"; |
node.parent === true || |
||||||
|
isNotEmptyArray(node.children) |
||||||
|
) { |
||||||
|
extend.type = BasicTreeNode.xtype; |
||||||
extend.selectable = true; |
extend.selectable = true; |
||||||
BI.defaults(node, extend); |
defaults(node, extend); |
||||||
self._formatItems(node.children, layer + 1, node); |
self._formatItems(node.children, layer + 1, node); |
||||||
} else { |
} else { |
||||||
extend.type = "bi.tree_item"; |
extend.type = BasicTreeItem.xtype; |
||||||
BI.defaults(node, extend); |
defaults(node, extend); |
||||||
} |
} |
||||||
}); |
}); |
||||||
|
|
||||||
return nodes; |
return nodes; |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.SelectTreePopup.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
|
|
||||||
var self = this, o = this.options; |
const self = this, |
||||||
|
o = this.options; |
||||||
|
|
||||||
this.tree = BI.createWidget({ |
this.tree = createWidget({ |
||||||
type: "bi.level_tree", |
type: LevelTree.xtype, |
||||||
expander: { |
expander: { |
||||||
type: "bi.tree_expander", |
type: TreeExpander.xtype, |
||||||
// isDefaultInit: true,
|
// isDefaultInit: true,
|
||||||
selectable: true, |
selectable: true, |
||||||
}, |
}, |
||||||
items: this._formatItems(BI.Tree.transformToTreeFormat(o.items), 0), |
items: this._formatItems(Tree.transformToTreeFormat(o.items), 0), |
||||||
value: o.value, |
value: o.value, |
||||||
chooseType: BI.Selection.Single |
chooseType: Selection.Single, |
||||||
}); |
}); |
||||||
|
|
||||||
BI.createWidget({ |
createWidget({ |
||||||
type: "bi.vertical", |
type: VerticalLayout.xtype, |
||||||
element: this, |
element: this, |
||||||
vgap: 5, |
vgap: 5, |
||||||
items: [this.tree] |
items: [this.tree], |
||||||
}); |
}); |
||||||
|
|
||||||
this.tree.on(BI.Controller.EVENT_CHANGE, function () { |
this.tree.on(Controller.EVENT_CHANGE, function () { |
||||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
self.fireEvent(Controller.EVENT_CHANGE, arguments); |
||||||
}); |
}); |
||||||
|
|
||||||
this.tree.on(BI.LevelTree.EVENT_CHANGE, function () { |
this.tree.on(LevelTree.EVENT_CHANGE, () => { |
||||||
self.fireEvent(BI.SelectTreePopup.EVENT_CHANGE); |
self.fireEvent(SelectTreePopup.EVENT_CHANGE); |
||||||
}); |
}); |
||||||
|
|
||||||
this.check(); |
this.check(); |
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
return this.tree.getValue(); |
return this.tree.getValue(); |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
v = BI.isArray(v) ? v : [v]; |
v = isArray(v) ? v : [v]; |
||||||
this.tree.setValue(v); |
this.tree.setValue(v); |
||||||
}, |
|
||||||
|
|
||||||
populate: function (items) { |
|
||||||
BI.SelectTreePopup.superclass.populate.apply(this, arguments); |
|
||||||
this.tree.populate(this._formatItems(BI.Tree.transformToTreeFormat(items))); |
|
||||||
} |
} |
||||||
}); |
|
||||||
|
|
||||||
BI.SelectTreePopup.EVENT_CHANGE = "EVENT_CHANGE"; |
populate(items) { |
||||||
BI.shortcut("bi.select_level_tree", BI.SelectTreePopup); |
super.populate(...arguments); |
||||||
|
this.tree.populate( |
||||||
|
this._formatItems(Tree.transformToTreeFormat(items)) |
||||||
|
); |
||||||
|
} |
||||||
|
} |
||||||
|
@ -1,66 +1,74 @@ |
|||||||
/** |
import { |
||||||
* @class BI.SingleTreePopup |
shortcut, |
||||||
* @extends BI.Pane |
extend, |
||||||
*/ |
i18nText, |
||||||
|
createWidget, |
||||||
|
Controller, |
||||||
|
isArray, VerticalLayout |
||||||
|
} from "@/core"; |
||||||
|
import { Pane } from "@/base"; |
||||||
|
import { LevelTree } from "@/case"; |
||||||
|
|
||||||
BI.SingleTreePopup = BI.inherit(BI.Pane, { |
@shortcut() |
||||||
|
export class SingleTreePopup extends Pane { |
||||||
|
static xtype = "bi.single_level_tree"; |
||||||
|
|
||||||
_defaultConfig: function () { |
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
return BI.extend(BI.SingleTreePopup.superclass._defaultConfig.apply(this, arguments), { |
|
||||||
|
_defaultConfig() { |
||||||
|
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-single-level-tree", |
baseCls: "bi-single-level-tree", |
||||||
tipText: BI.i18nText("BI-No_Selected_Item"), |
tipText: i18nText("BI-No_Selected_Item"), |
||||||
items: [], |
items: [], |
||||||
value: "" |
value: "", |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.SingleTreePopup.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
|
|
||||||
var self = this, o = this.options; |
const self = this, |
||||||
|
o = this.options; |
||||||
|
|
||||||
this.tree = BI.createWidget({ |
this.tree = createWidget({ |
||||||
type: "bi.level_tree", |
type: "bi.level_tree", |
||||||
expander: { |
expander: { |
||||||
isDefaultInit: true |
isDefaultInit: true, |
||||||
}, |
}, |
||||||
items: o.items, |
items: o.items, |
||||||
value: o.value, |
value: o.value, |
||||||
chooseType: BI.Selection.Single |
chooseType: Selection.Single, |
||||||
}); |
}); |
||||||
|
|
||||||
BI.createWidget({ |
createWidget({ |
||||||
type: "bi.vertical", |
type: VerticalLayout.xtype, |
||||||
element: this, |
element: this, |
||||||
vgap: 5, |
vgap: 5, |
||||||
items: [this.tree] |
items: [this.tree], |
||||||
}); |
}); |
||||||
|
|
||||||
this.tree.on(BI.Controller.EVENT_CHANGE, function () { |
this.tree.on(Controller.EVENT_CHANGE, function () { |
||||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
self.fireEvent(Controller.EVENT_CHANGE, arguments); |
||||||
}); |
}); |
||||||
|
|
||||||
this.tree.on(BI.LevelTree.EVENT_CHANGE, function () { |
this.tree.on(LevelTree.EVENT_CHANGE, () => { |
||||||
self.fireEvent(BI.SingleTreePopup.EVENT_CHANGE); |
self.fireEvent(SingleTreePopup.EVENT_CHANGE); |
||||||
}); |
}); |
||||||
|
|
||||||
this.check(); |
this.check(); |
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
return this.tree.getValue(); |
return this.tree.getValue(); |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
v = BI.isArray(v) ? v : [v]; |
v = isArray(v) ? v : [v]; |
||||||
this.tree.setValue(v); |
this.tree.setValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
populate: function (items) { |
populate(items) { |
||||||
BI.SingleTreePopup.superclass.populate.apply(this, arguments); |
super.populate(...arguments); |
||||||
this.tree.populate(items); |
this.tree.populate(items); |
||||||
} |
} |
||||||
}); |
} |
||||||
|
|
||||||
BI.SingleTreePopup.EVENT_CHANGE = "EVENT_CHANGE"; |
|
||||||
BI.shortcut("bi.single_level_tree", BI.SingleTreePopup); |
|
||||||
|
Loading…
Reference in new issue