diff --git a/src/case/calendar/calendar.date.item.js b/src/case/calendar/calendar.date.item.js index 3322de754..b1b4ef5c5 100644 --- a/src/case/calendar/calendar.date.item.js +++ b/src/case/calendar/calendar.date.item.js @@ -1,9 +1,9 @@ +import { shortcut } from "@/core"; +import { BasicButton } from "@/base"; + /** * 专门为calendar的视觉加的button，作为私有button,不能配置任何属性，也不要用这个玩意 */ - -import { shortcut } from "@/core"; -import { BasicButton } from "@/base"; @shortcut() export class CalendarDateItem extends BasicButton { props() { @@ -17,7 +17,7 @@ export class CalendarDateItem extends BasicButton { render () { const { text, value, lgap, rgap, tgap, bgap } = this.options; - + return { type: "bi.absolute", items: [{ diff --git a/src/case/calendar/calendar.js b/src/case/calendar/calendar.js index da9a41442..b656a271e 100644 --- a/src/case/calendar/calendar.js +++ b/src/case/calendar/calendar.js @@ -1,12 +1,41 @@ +import { shortcut, Widget, getDate, each, range, extend, isLeapYear, Date, StartOfWeek, checkDateVoid, map, createWidget, createItems, LogicFactory, Controller, getShortDayName, getOffsetDate, isNotEmptyString, parseInt } from "@/core"; + /** * Created by GUY on 2015/8/28. - * @class BI.Calendar - * @extends BI.Widget + * @class Calendar + * @extends Widget */ -import { shortcut, Widget, getDate, each, range, extend, isLeapYear, Date, StartOfWeek, checkDateVoid, map, createWidget, createItems, LogicFactory, Controller, getShortDayName, getOffsetDate, isNotEmptyString, parseInt } from "@/core"; @shortcut() export class Calendar extends Widget { static xtype = "bi.calendar"; + + static getPageByDateJSON (json) { + const year = getDate().getFullYear(); + const month = getDate().getMonth(); + let page = (json.year - year) * 12; + page += json.month - 1 - month; + + return page; + } + + static getDateJSONByPage (v) { + const months = getDate().getMonth(); + let page = v; + + // 对当前page做偏移,使到当前年初 + page = page + months; + + let year = parseInt(page / 12); + if (page < 0 && page % 12 !== 0) { + year--; + } + const month = page >= 0 ? (page % 12) : ((12 + page % 12) % 12); + + return { + year: getDate().getFullYear() + year, + month: month + 1, + }; + } _defaultConfig () { const conf = super._defaultConfig(...arguments); @@ -222,33 +251,3 @@ export class Calendar extends Widget { }; } } - -extend(Calendar, { - getPageByDateJSON (json) { - const year = getDate().getFullYear(); - const month = getDate().getMonth(); - let page = (json.year - year) * 12; - page += json.month - 1 - month; - - return page; - }, - getDateJSONByPage (v) { - const months = getDate().getMonth(); - let page = v; - - // 对当前page做偏移,使到当前年初 - page = page + months; - - let year = parseInt(page / 12); - if (page < 0 && page % 12 !== 0) { - year--; - } - const month = page >= 0 ? (page % 12) : ((12 + page % 12) % 12); - - return { - year: getDate().getFullYear() + year, - month: month + 1, - }; - }, -}); - diff --git a/src/case/calendar/calendar.year.js b/src/case/calendar/calendar.year.js index 4c782da5b..c8ebc58b0 100644 --- a/src/case/calendar/calendar.year.js +++ b/src/case/calendar/calendar.year.js @@ -1,12 +1,33 @@ +import { shortcut, Widget, extend, parseDateTime, range, checkDateVoid, print, getDate, each, createWidget, createItems, LogicFactory, Controller, makeArray, map, isNotEmptyString } from "@/core"; + /** * Created by GUY on 2015/8/28. - * @class BI.YearCalendar - * @extends BI.Widget + * @class YearCalendar + * @extends Widget */ -import { shortcut, Widget, extend, parseDateTime, range, checkDateVoid, print, getDate, each, createWidget, createItems, LogicFactory, Controller, makeArray, map, isNotEmptyString } from "@/core"; @shortcut() export class YearCalendar extends Widget { static xtype = "bi.year_calendar"; + static INTERVAL = 12; + + // 获取显示的第一年 + static getStartYear (year) { + const cur = getDate().getFullYear(); + + return year - ((year - cur + 3) % YearCalendar.INTERVAL + 12) % YearCalendar.INTERVAL; + } + + static getEndYear (year) { + return YearCalendar.getStartYear(year) + YearCalendar.INTERVAL - 1; + } + + static getPageByYear (year) { + const cur = getDate().getFullYear(); + year = YearCalendar.getStartYear(year); + + return (year - cur + 3) / YearCalendar.INTERVAL; + } + _defaultConfig () { const conf = super._defaultConfig(...arguments); @@ -150,28 +171,3 @@ export class YearCalendar extends Widget { return this.years.getValue()[0]; } } - -// 类方法 -extend(YearCalendar, { - INTERVAL: 12, - - // 获取显示的第一年 - getStartYear (year) { - const cur = getDate().getFullYear(); - - return year - ((year - cur + 3) % YearCalendar.INTERVAL + 12) % YearCalendar.INTERVAL; - }, - - getEndYear (year) { - return YearCalendar.getStartYear(year) + YearCalendar.INTERVAL - 1; - }, - - getPageByYear (year) { - const cur = getDate().getFullYear(); - year = YearCalendar.getStartYear(year); - - return (year - cur + 3) / YearCalendar.INTERVAL; - }, -}); - - diff --git a/src/case/list/list.select.js b/src/case/list/list.select.js index a6fb459db..e9fce794a 100644 --- a/src/case/list/list.select.js +++ b/src/case/list/list.select.js @@ -1,16 +1,32 @@ /* eslint-disable no-mixed-spaces-and-tabs */ -import { shortcut, Widget, extend, emptyFn, Controller, createWidget, Events, isNotNull, isEmptyString, isEmptyArray, Direction, get, LogicFactory, each, pixFormat } from "@/core"; +import { + shortcut, + Widget, + extend, + emptyFn, + Controller, + createWidget, + Events, + isNotNull, + isEmptyString, + isEmptyArray, + Direction, + get, + LogicFactory, + each, + pixFormat +} from "@/core"; import { ButtonGroup } from "@/base"; +import { MultiSelectBar } from "../toolbar/toolbar.multiselect"; +import { ListPane } from "../layer/pane.list"; + @shortcut() export class SelectList extends Widget { static xtype = "bi.select_list"; - - static EVENT_CHANGE = "EVENT_CHANGE"; - _defaultConfig() { return extend(super._defaultConfig(...arguments), { baseCls: "bi-select-list", @@ -23,11 +39,11 @@ export class SelectList extends Widget { hasNext: emptyFn, onLoaded: emptyFn, toolbar: { - type: "bi.multi_select_bar", + type: MultiSelectBar.xtype, iconWrapperWidth: 36, }, el: { - type: "bi.list_pane", + type: ListPane.xtype, }, }); } @@ -49,7 +65,7 @@ export class SelectList extends Widget { }); this.list = createWidget(o.el, { - type: "bi.list_pane", + type: ListPane.xtype, items: o.items, itemsCreator(op, callback) { op.times === 1 && this.toolbar.setVisible(false); diff --git a/src/core/logic/index.js b/src/core/logic/index.js index 0397ce345..5b04dfe21 100644 --- a/src/core/logic/index.js +++ b/src/core/logic/index.js @@ -1,3 +1,5 @@ +import { map, isWidget } from "../2.base"; +import { Direction } from "../constant"; import { Logic } from "./logic"; import { VerticalLayoutLogic, HorizontalLayoutLogic, TableLayoutLogic, HorizontalFillLayoutLogic } from "./logic.layout"; @@ -33,21 +35,21 @@ export const LogicFactory = { createLogicTypeByDirection (direction) { switch (direction) { - case BI.Direction.Top: - case BI.Direction.Bottom: - case BI.Direction.Custom: - return BI.LogicFactory.Type.Vertical; - case BI.Direction.Left: - case BI.Direction.Right: - return BI.LogicFactory.Type.Horizontal; + case Direction.Top: + case Direction.Bottom: + case Direction.Custom: + return LogicFactory.Type.Vertical; + case Direction.Left: + case Direction.Right: + return LogicFactory.Type.Horizontal; default: } }, createLogicItemsByDirection (direction) { let items = Array.prototype.slice.call(arguments, 1); - items = BI.map(items, (i, item) => { - if (BI.isWidget(item)) { + items = map(items, (i, item) => { + if (isWidget(item)) { return { el: item, width: item.options.width, @@ -58,13 +60,13 @@ export const LogicFactory = { return item; }); switch (direction) { - case BI.Direction.Bottom: + case Direction.Bottom: items.reverse(); break; - case BI.Direction.Right: + case Direction.Right: items.reverse(); break; - case BI.Direction.Custom: + case Direction.Custom: items = items.slice(1); break; default: diff --git a/src/widget/date/calendar/popup.year.js b/src/widget/date/calendar/popup.year.js index c7b8f0491..872f35a73 100644 --- a/src/widget/date/calendar/popup.year.js +++ b/src/widget/date/calendar/popup.year.js @@ -79,7 +79,7 @@ export class YearPopup extends Widget { }, cardCreator: bind(this._createYearCalendar, this), afterCardCreated: () => { - this.setValue(this.selectedYear); + this.navigation.setValue(this.selectedYear); }, }); diff --git a/src/widget/dynamicdate/dynamicdate.combo.js b/src/widget/dynamicdate/dynamicdate.combo.js index 7cb7165dc..173327f56 100644 --- a/src/widget/dynamicdate/dynamicdate.combo.js +++ b/src/widget/dynamicdate/dynamicdate.combo.js @@ -7,6 +7,14 @@ import { DynamicDatePopup } from "./dynamicdate.popup"; export class DynamicDateCombo extends Single { static xtype = "bi.dynamic_date_combo" + constants = { + popupHeight: 259, + popupWidth: 270, + comboAdjustHeight: 1, + border: 1, + iconWidth: 24, + } + props = { baseCls: "bi-dynamic-date-combo", height: 24, diff --git a/src/widget/dynamicdate/dynamicdate.popup.js b/src/widget/dynamicdate/dynamicdate.popup.js index f241f9597..4e8a8d157 100644 --- a/src/widget/dynamicdate/dynamicdate.popup.js +++ b/src/widget/dynamicdate/dynamicdate.popup.js @@ -8,6 +8,10 @@ import { DynamicDateHelper } from "./dynamicdate.caculate"; export class DynamicDatePopup extends Widget { static xtype = "bi.dynamic_date_popup" + constants = { + tabHeight: 40, + } + props = { baseCls: "bi-dynamic-date-popup", width: 272, diff --git a/src/widget/dynamicdate/dynamicdate.trigger.js b/src/widget/dynamicdate/dynamicdate.trigger.js index 8e24b81d5..adad56bf7 100644 --- a/src/widget/dynamicdate/dynamicdate.trigger.js +++ b/src/widget/dynamicdate/dynamicdate.trigger.js @@ -303,16 +303,16 @@ export class DynamicDateTrigger extends Trigger { } setValue(v) { - let type, value; + let type, value, text; let date = getDate(); this.storeValue = v; if (isNotNull(v)) { type = v.type || DynamicDateCombo.Static; value = v.value || v; } - const text = this._getText(value); switch (type) { case DynamicDateCombo.Dynamic: + text = this._getText(value); date = DynamicDateHelper.getCalculation(value); this._setInnerValue(date, text); break; diff --git a/src/widget/dynamicdatetime/dynamicdatetime.combo.js b/src/widget/dynamicdatetime/dynamicdatetime.combo.js index 2e41c32a6..0d88cf567 100644 --- a/src/widget/dynamicdatetime/dynamicdatetime.combo.js +++ b/src/widget/dynamicdatetime/dynamicdatetime.combo.js @@ -11,6 +11,14 @@ export class DynamicDateTimeCombo extends Single { static Static = 1 static Dynamic = 2 + constants = { + popupHeight: 259, + popupWidth: 270, + comboAdjustHeight: 1, + border: 1, + iconWidth: 24, + } + props = { baseCls: "bi-dynamic-date--time-combo", height: 24, diff --git a/src/widget/dynamicdatetime/dynamicdatetime.popup.js b/src/widget/dynamicdatetime/dynamicdatetime.popup.js index 7f8bb6982..a69aaabb1 100644 --- a/src/widget/dynamicdatetime/dynamicdatetime.popup.js +++ b/src/widget/dynamicdatetime/dynamicdatetime.popup.js @@ -8,6 +8,11 @@ import { DynamicDateTimeCombo } from "./dynamicdatetime.combo"; export class DynamicDateTimePopup extends Widget { static xtype = "bi.dynamic_date_time_popup" + constants = { + tabHeight: 40, + buttonHeight: 24, + } + props = { baseCls: "bi-dynamic-date-time-popup", width: 272, diff --git a/src/widget/editor/editor.search.js b/src/widget/editor/editor.search.js index bd40ae5a9..aef7cff33 100644 --- a/src/widget/editor/editor.search.js +++ b/src/widget/editor/editor.search.js @@ -1,26 +1,51 @@ -/** - * Created by roy on 15/9/14. - */ -BI.SearchEditor = BI.inherit(BI.Widget, { - _defaultConfig: function (config) { - var conf = BI.SearchEditor.superclass._defaultConfig.apply(this, arguments); - return BI.extend(conf, { - baseCls: "bi-search-editor bi-focus-shadow " + (config.simple ? "bi-border-bottom" : "bi-border bi-border-radius"), +import { shortcut, Widget, extend, i18nText, emptyFn, createWidget, toPix, isKey, Controller, Events, HTapeLayout, isEndWithBlank } from "@/core"; +import { IconButton, Editor, IconLabel } from "@/base"; + +@shortcut() +export class SearchEditor extends Widget { + static xtype = "bi.search_editor" + + static EVENT_CHANGE = "EVENT_CHANGE" + static EVENT_FOCUS = "EVENT_FOCUS" + static EVENT_BLUR = "EVENT_BLUR" + static EVENT_CLICK = "EVENT_CLICK" + static EVENT_KEY_DOWN = "EVENT_KEY_DOWN" + static EVENT_SPACE = "EVENT_SPACE" + static EVENT_BACKSPACE = "EVENT_BACKSPACE" + static EVENT_CLEAR = "EVENT_CLEAR" + static EVENT_START = "EVENT_START" + static EVENT_PAUSE = "EVENT_PAUSE" + static EVENT_STOP = "EVENT_STOP" + static EVENT_CONFIRM = "EVENT_CONFIRM" + static EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM" + static EVENT_VALID = "EVENT_VALID" + static EVENT_ERROR = "EVENT_ERROR" + static EVENT_ENTER = "EVENT_ENTER" + static EVENT_RESTRICT = "EVENT_RESTRICT" + static EVENT_REMOVE = "EVENT_REMOVE" + static EVENT_EMPTY = "EVENT_EMPTY" + + _defaultConfig(config) { + const conf = super._defaultConfig(...arguments); + + return extend(conf, { + baseCls: `bi-search-editor bi-focus-shadow ${config.simple ? "bi-border-bottom" : "bi-border bi-border-radius"}`, height: 24, errorText: "", - watermark: BI.i18nText("BI-Basic_Search"), - validationChecker: BI.emptyFn, - quitChecker: BI.emptyFn, - value: "" - }); - }, - _init: function () { - BI.SearchEditor.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.editor = BI.createWidget(o.el, { - type: "bi.editor", + watermark: i18nText("BI-Basic_Search"), + validationChecker: emptyFn, + quitChecker: emptyFn, + value: "", + }); + } + + _init() { + super._init(...arguments); + const o = this.options; + this.editor = createWidget(o.el, { + type: Editor.xtype, simple: o.simple, - height: BI.toPix(o.height, o.simple ? 1 : 2), + height: toPix(o.height, o.simple ? 1 : 2), watermark: o.watermark, allowBlank: true, hgap: 1, @@ -30,189 +55,168 @@ BI.SearchEditor = BI.inherit(BI.Widget, { value: o.value, autoTrim: o.autoTrim, }); - this.clear = BI.createWidget({ - type: "bi.icon_button", + this.clear = createWidget({ + type: IconButton.xtype, stopEvent: true, cls: "close-font", - invisible: !BI.isKey(o.value) + invisible: !isKey(o.value), }); - this.clear.on(BI.IconButton.EVENT_CHANGE, function () { - self.setValue(""); - self.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.STOPEDIT, self.getValue()); + this.clear.on(IconButton.EVENT_CHANGE, () => { + this.setValue(""); + this.fireEvent(Controller.EVENT_CHANGE, Events.STOPEDIT, this.getValue()); // 从有内容到无内容的清空也是一次change - self.fireEvent(BI.SearchEditor.EVENT_CHANGE); - self.fireEvent(BI.SearchEditor.EVENT_CLEAR); + this.fireEvent(SearchEditor.EVENT_CHANGE); + this.fireEvent(SearchEditor.EVENT_CLEAR); }); - BI.createWidget({ + createWidget({ element: this, - height: BI.toPix(o.height, o.simple ? 1 : 2), - type: "bi.htape", - items: [ - { - el: { - type: "bi.icon_label", - cls: "search-font" - }, - width: 24 + height: toPix(o.height, o.simple ? 1 : 2), + type: HTapeLayout.xtype, + items: [{ + el: { + type: IconLabel.xtype, + cls: "search-font", }, - { - el: self.editor - }, - { - el: this.clear, - width: 24 - } - ] + width: 24, + }, + { + el: this.editor, + }, + { + el: this.clear, + width: 24, + } + ], }); - this.editor.on(BI.Controller.EVENT_CHANGE, function () { - self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); + this.editor.on(Controller.EVENT_CHANGE, (...args) => { + this.fireEvent(Controller.EVENT_CHANGE, ...args); }); - this.editor.on(BI.Editor.EVENT_FOCUS, function () { - self.fireEvent(BI.SearchEditor.EVENT_FOCUS); + this.editor.on(Editor.EVENT_FOCUS, () => { + this.fireEvent(SearchEditor.EVENT_FOCUS); }); - this.editor.on(BI.Editor.EVENT_BLUR, function () { - self.fireEvent(BI.SearchEditor.EVENT_BLUR); + this.editor.on(Editor.EVENT_BLUR, () => { + this.fireEvent(SearchEditor.EVENT_BLUR); }); - this.editor.on(BI.Editor.EVENT_CLICK, function () { - self.fireEvent(BI.SearchEditor.EVENT_CLICK); + this.editor.on(Editor.EVENT_CLICK, () => { + this.fireEvent(SearchEditor.EVENT_CLICK); }); - this.editor.on(BI.Editor.EVENT_CHANGE, function () { - self._checkClear(); - self.fireEvent(BI.SearchEditor.EVENT_CHANGE); + this.editor.on(Editor.EVENT_CHANGE, () => { + this._checkClear(); + this.fireEvent(SearchEditor.EVENT_CHANGE); }); - this.editor.on(BI.Editor.EVENT_KEY_DOWN, function (v) { - self.fireEvent(BI.SearchEditor.EVENT_KEY_DOWN, v); + this.editor.on(Editor.EVENT_KEY_DOWN, v => { + this.fireEvent(SearchEditor.EVENT_KEY_DOWN, v); }); - this.editor.on(BI.Editor.EVENT_SPACE, function () { - self.fireEvent(BI.SearchEditor.EVENT_SPACE); + this.editor.on(Editor.EVENT_SPACE, () => { + this.fireEvent(SearchEditor.EVENT_SPACE); }); - this.editor.on(BI.Editor.EVENT_BACKSPACE, function () { - self.fireEvent(BI.SearchEditor.EVENT_BACKSPACE); + this.editor.on(Editor.EVENT_BACKSPACE, () => { + this.fireEvent(SearchEditor.EVENT_BACKSPACE); }); - this.editor.on(BI.Editor.EVENT_VALID, function () { - self.fireEvent(BI.SearchEditor.EVENT_VALID); + this.editor.on(Editor.EVENT_VALID, () => { + this.fireEvent(SearchEditor.EVENT_VALID); }); - this.editor.on(BI.Editor.EVENT_ERROR, function () { - self.fireEvent(BI.SearchEditor.EVENT_ERROR); + this.editor.on(Editor.EVENT_ERROR, () => { + this.fireEvent(SearchEditor.EVENT_ERROR); }); - this.editor.on(BI.Editor.EVENT_ENTER, function () { - self.fireEvent(BI.SearchEditor.EVENT_ENTER); + this.editor.on(Editor.EVENT_ENTER, () => { + this.fireEvent(SearchEditor.EVENT_ENTER); }); - this.editor.on(BI.Editor.EVENT_RESTRICT, function () { - self.fireEvent(BI.SearchEditor.EVENT_RESTRICT); + this.editor.on(Editor.EVENT_RESTRICT, () => { + this.fireEvent(SearchEditor.EVENT_RESTRICT); }); - this.editor.on(BI.Editor.EVENT_EMPTY, function () { - self._checkClear(); - self.fireEvent(BI.SearchEditor.EVENT_EMPTY); + this.editor.on(Editor.EVENT_EMPTY, () => { + this._checkClear(); + this.fireEvent(SearchEditor.EVENT_EMPTY); }); - this.editor.on(BI.Editor.EVENT_REMOVE, function () { - self.fireEvent(BI.SearchEditor.EVENT_REMOVE); + this.editor.on(Editor.EVENT_REMOVE, () => { + this.fireEvent(SearchEditor.EVENT_REMOVE); }); - this.editor.on(BI.Editor.EVENT_CONFIRM, function () { - self.fireEvent(BI.SearchEditor.EVENT_CONFIRM); + this.editor.on(Editor.EVENT_CONFIRM, () => { + this.fireEvent(SearchEditor.EVENT_CONFIRM); }); - this.editor.on(BI.Editor.EVENT_CHANGE_CONFIRM, function () { - self.fireEvent(BI.SearchEditor.EVENT_CHANGE_CONFIRM); + this.editor.on(Editor.EVENT_CHANGE_CONFIRM, () => { + this.fireEvent(SearchEditor.EVENT_CHANGE_CONFIRM); }); - this.editor.on(BI.Editor.EVENT_START, function () { - self.fireEvent(BI.SearchEditor.EVENT_START); + this.editor.on(Editor.EVENT_START, () => { + this.fireEvent(SearchEditor.EVENT_START); }); - this.editor.on(BI.Editor.EVENT_PAUSE, function () { - self.fireEvent(BI.SearchEditor.EVENT_PAUSE); + this.editor.on(Editor.EVENT_PAUSE, () => { + this.fireEvent(SearchEditor.EVENT_PAUSE); }); - this.editor.on(BI.Editor.EVENT_STOP, function () { - self.fireEvent(BI.SearchEditor.EVENT_STOP); + this.editor.on(Editor.EVENT_STOP, () => { + this.fireEvent(SearchEditor.EVENT_STOP); }); - }, + } - _checkClear: function () { + _checkClear() { if (!this.getValue()) { this.clear.invisible(); } else { this.clear.visible(); } - }, + } - setWaterMark: function (v) { + setWaterMark(v) { this.options.watermark = v; this.editor.setWaterMark(v); - }, + } - focus: function () { + focus() { this.editor.focus(); - }, + } - blur: function () { + blur() { this.editor.blur(); - }, + } - getValue: function () { + getValue() { if (this.isValid()) { return this.editor.getValue(); } - }, + } - getKeywords: function () { - var val = this.editor.getLastChangedValue(); - var keywords = val.match(/[\S]+/g); - if (BI.isEndWithBlank(val)) { + getKeywords() { + const val = this.editor.getLastChangedValue(); + const keywords = val.match(/[\S]+/g); + if (isEndWithBlank(val)) { return keywords.concat([" "]); } + return keywords; - }, + } - getLastValidValue: function () { + getLastValidValue() { return this.editor.getLastValidValue(); - }, + } - getLastChangedValue: function () { + getLastChangedValue() { return this.editor.getLastChangedValue(); - }, + } - setValue: function (v) { + setValue(v) { this.editor.setValue(v); - if (BI.isKey(v)) { + if (isKey(v)) { this.clear.visible(); } - }, + } - isEditing: function () { + isEditing() { return this.editor.isEditing(); - }, + } - isValid: function () { + isValid() { return this.editor.isValid(); - }, + } - showClearIcon: function () { + showClearIcon() { this.clear.visible(); - }, + } - hideClearIcon: function () { + hideClearIcon() { this.clear.invisible(); } -}); -BI.SearchEditor.EVENT_CHANGE = "EVENT_CHANGE"; -BI.SearchEditor.EVENT_FOCUS = "EVENT_FOCUS"; -BI.SearchEditor.EVENT_BLUR = "EVENT_BLUR"; -BI.SearchEditor.EVENT_CLICK = "EVENT_CLICK"; -BI.SearchEditor.EVENT_KEY_DOWN = "EVENT_KEY_DOWN"; -BI.SearchEditor.EVENT_SPACE = "EVENT_SPACE"; -BI.SearchEditor.EVENT_BACKSPACE = "EVENT_BACKSPACE"; -BI.SearchEditor.EVENT_CLEAR = "EVENT_CLEAR"; - -BI.SearchEditor.EVENT_START = "EVENT_START"; -BI.SearchEditor.EVENT_PAUSE = "EVENT_PAUSE"; -BI.SearchEditor.EVENT_STOP = "EVENT_STOP"; -BI.SearchEditor.EVENT_CONFIRM = "EVENT_CONFIRM"; -BI.SearchEditor.EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM"; -BI.SearchEditor.EVENT_VALID = "EVENT_VALID"; -BI.SearchEditor.EVENT_ERROR = "EVENT_ERROR"; -BI.SearchEditor.EVENT_ENTER = "EVENT_ENTER"; -BI.SearchEditor.EVENT_RESTRICT = "EVENT_RESTRICT"; -BI.SearchEditor.EVENT_REMOVE = "EVENT_REMOVE"; -BI.SearchEditor.EVENT_EMPTY = "EVENT_EMPTY"; -BI.shortcut("bi.search_editor", BI.SearchEditor); +} diff --git a/src/widget/editor/editor.search.small.js b/src/widget/editor/editor.search.small.js index 145108f0d..890a1499f 100644 --- a/src/widget/editor/editor.search.small.js +++ b/src/widget/editor/editor.search.small.js @@ -1,20 +1,20 @@ -/** - * 小号搜索框 - * Created by GUY on 2015/9/29. - * @class BI.SmallSearchEditor - * @extends BI.SearchEditor - */ -BI.SmallSearchEditor = BI.inherit(BI.SearchEditor, { - _defaultConfig: function () { - var conf = BI.SmallSearchEditor.superclass._defaultConfig.apply(this, arguments); - return BI.extend(conf, { - baseCls: (conf.baseCls || "") + " bi-small-search-editor", - height: 20 +import { shortcut, extend } from "@/core"; +import { SearchEditor } from "./editor.search"; + +@shortcut() +export class SmallSearchEditor extends SearchEditor { + static xtype = "bi.small_search_editor" + + _defaultConfig() { + const conf = super._defaultConfig(...arguments); + + return extend(conf, { + baseCls: `${conf.baseCls || ""} bi-small-search-editor`, + height: 20, }); - }, + } - _init: function () { - BI.SmallSearchEditor.superclass._init.apply(this, arguments); + _init() { + super._init(...arguments); } -}); -BI.shortcut("bi.small_search_editor", BI.SmallSearchEditor); \ No newline at end of file +} diff --git a/src/widget/editor/editor.text.js b/src/widget/editor/editor.text.js index 022b5f2ad..8841eb339 100644 --- a/src/widget/editor/editor.text.js +++ b/src/widget/editor/editor.text.js @@ -1,36 +1,57 @@ -/** - * guy - * @class BI.TextEditor - * @extends BI.Single - */ -BI.TextEditor = BI.inherit(BI.Widget, { - _defaultConfig: function (config) { - var conf = BI.TextEditor.superclass._defaultConfig.apply(this, arguments); - return BI.extend(conf, { - extraCls: "bi-text-editor bi-focus-shadow " + (config.simple ? "bi-border-bottom" : "bi-border"), +import { shortcut, Widget, extend, emptyFn, createWidget, toPix, Controller } from "@/core"; +import { Editor } from "@/base"; + +@shortcut() +export class TextEditor extends Widget { + static xtype = "bi.text_editor" + + static EVENT_CHANGE = "EVENT_CHANGE" + static EVENT_FOCUS = "EVENT_FOCUS" + static EVENT_BLUR = "EVENT_BLUR" + static EVENT_CLICK = "EVENT_CLICK" + static EVENT_KEY_DOWN = "EVENT_KEY_DOWN" + static EVENT_SPACE = "EVENT_SPACE" + static EVENT_BACKSPACE = "EVENT_BACKSPACE" + static EVENT_START = "EVENT_START" + static EVENT_PAUSE = "EVENT_PAUSE" + static EVENT_STOP = "EVENT_STOP" + static EVENT_CONFIRM = "EVENT_CONFIRM" + static EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM" + static EVENT_VALID = "EVENT_VALID" + static EVENT_ERROR = "EVENT_ERROR" + static EVENT_ENTER = "EVENT_ENTER" + static EVENT_RESTRICT = "EVENT_RESTRICT" + static EVENT_REMOVE = "EVENT_REMOVE" + static EVENT_EMPTY = "EVENT_EMPTY" + + _defaultConfig(config) { + const conf = super._defaultConfig(...arguments); + + return extend(conf, { + extraCls: `bi-text-editor bi-focus-shadow ${config.simple ? "bi-border-bottom" : "bi-border"}`, hgap: 4, vgap: 2, lgap: 0, rgap: 0, tgap: 0, bgap: 0, - validationChecker: BI.emptyFn, - quitChecker: BI.emptyFn, + validationChecker: emptyFn, + quitChecker: emptyFn, allowBlank: false, watermark: "", errorText: "", - height: 24 + height: 24, }); - }, + } - render: function () { - var self = this, o = this.options; - var border = o.simple ? 1 : 2; - this.editor = BI.createWidget({ - type: "bi.editor", + render() { + const o = this.options; + const border = o.simple ? 1 : 2; + this.editor = createWidget({ + type: Editor.xtype, element: this, - width: BI.toPix(o.width, border), - height: BI.toPix(o.height, border), + width: toPix(o.width, border), + height: toPix(o.height, border), simple: o.simple, hgap: o.hgap, vgap: o.vgap, @@ -50,121 +71,100 @@ BI.TextEditor = BI.inherit(BI.Widget, { autocomplete: o.autocomplete, autoTrim: o.autoTrim, }); - this.editor.on(BI.Controller.EVENT_CHANGE, function () { - self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); + this.editor.on(Controller.EVENT_CHANGE, (...args) => { + this.fireEvent(Controller.EVENT_CHANGE, ...args); }); - this.editor.on(BI.Editor.EVENT_FOCUS, function () { - self.fireEvent(BI.TextEditor.EVENT_FOCUS); + this.editor.on(Editor.EVENT_FOCUS, () => { + this.fireEvent(TextEditor.EVENT_FOCUS); }); - this.editor.on(BI.Editor.EVENT_BLUR, function () { - self.fireEvent(BI.TextEditor.EVENT_BLUR); + this.editor.on(Editor.EVENT_BLUR, () => { + this.fireEvent(TextEditor.EVENT_BLUR); }); - this.editor.on(BI.Editor.EVENT_CLICK, function () { - self.fireEvent(BI.TextEditor.EVENT_CLICK); + this.editor.on(Editor.EVENT_CLICK, () => { + this.fireEvent(TextEditor.EVENT_CLICK); }); - this.editor.on(BI.Editor.EVENT_CHANGE, function () { - self.fireEvent(BI.TextEditor.EVENT_CHANGE); + this.editor.on(Editor.EVENT_CHANGE, () => { + this.fireEvent(TextEditor.EVENT_CHANGE); }); - this.editor.on(BI.Editor.EVENT_KEY_DOWN, function (v) { - self.fireEvent(BI.TextEditor.EVENT_KEY_DOWN); + this.editor.on(Editor.EVENT_KEY_DOWN, v => { + this.fireEvent(TextEditor.EVENT_KEY_DOWN); }); - this.editor.on(BI.Editor.EVENT_SPACE, function (v) { - self.fireEvent(BI.TextEditor.EVENT_SPACE); + this.editor.on(Editor.EVENT_SPACE, v => { + this.fireEvent(TextEditor.EVENT_SPACE); }); - this.editor.on(BI.Editor.EVENT_BACKSPACE, function (v) { - self.fireEvent(BI.TextEditor.EVENT_BACKSPACE); + this.editor.on(Editor.EVENT_BACKSPACE, v => { + this.fireEvent(TextEditor.EVENT_BACKSPACE); }); - this.editor.on(BI.Editor.EVENT_VALID, function () { - self.element.removeClass("error"); - self.fireEvent(BI.TextEditor.EVENT_VALID); + this.editor.on(Editor.EVENT_VALID, () => { + this.element.removeClass("error"); + this.fireEvent(TextEditor.EVENT_VALID); }); - this.editor.on(BI.Editor.EVENT_CONFIRM, function () { - self.fireEvent(BI.TextEditor.EVENT_CONFIRM); + this.editor.on(Editor.EVENT_CONFIRM, () => { + this.fireEvent(TextEditor.EVENT_CONFIRM); }); - this.editor.on(BI.Editor.EVENT_CHANGE_CONFIRM, function () { - self.fireEvent(BI.TextEditor.EVENT_CHANGE_CONFIRM); + this.editor.on(Editor.EVENT_CHANGE_CONFIRM, () => { + this.fireEvent(TextEditor.EVENT_CHANGE_CONFIRM); }); - this.editor.on(BI.Editor.EVENT_REMOVE, function (v) { - self.fireEvent(BI.TextEditor.EVENT_REMOVE); + this.editor.on(Editor.EVENT_REMOVE, v => { + this.fireEvent(TextEditor.EVENT_REMOVE); }); - this.editor.on(BI.Editor.EVENT_START, function () { - self.fireEvent(BI.TextEditor.EVENT_START); + this.editor.on(Editor.EVENT_START, () => { + this.fireEvent(TextEditor.EVENT_START); }); - this.editor.on(BI.Editor.EVENT_PAUSE, function () { - self.fireEvent(BI.TextEditor.EVENT_PAUSE); + this.editor.on(Editor.EVENT_PAUSE, () => { + this.fireEvent(TextEditor.EVENT_PAUSE); }); - this.editor.on(BI.Editor.EVENT_STOP, function () { - self.fireEvent(BI.TextEditor.EVENT_STOP); + this.editor.on(Editor.EVENT_STOP, () => { + this.fireEvent(TextEditor.EVENT_STOP); }); - this.editor.on(BI.Editor.EVENT_ERROR, function () { - self.element.addClass("error"); - self.fireEvent(BI.TextEditor.EVENT_ERROR, arguments); + this.editor.on(Editor.EVENT_ERROR, (...args) => { + this.element.addClass("error"); + this.fireEvent(TextEditor.EVENT_ERROR, ...args); }); - this.editor.on(BI.Editor.EVENT_ENTER, function () { - self.fireEvent(BI.TextEditor.EVENT_ENTER); + this.editor.on(Editor.EVENT_ENTER, () => { + this.fireEvent(TextEditor.EVENT_ENTER); }); - this.editor.on(BI.Editor.EVENT_RESTRICT, function () { - self.fireEvent(BI.TextEditor.EVENT_RESTRICT); + this.editor.on(Editor.EVENT_RESTRICT, () => { + this.fireEvent(TextEditor.EVENT_RESTRICT); }); - this.editor.on(BI.Editor.EVENT_EMPTY, function () { - self.fireEvent(BI.TextEditor.EVENT_EMPTY); + this.editor.on(Editor.EVENT_EMPTY, () => { + this.fireEvent(TextEditor.EVENT_EMPTY); }); - }, + } - setWaterMark: function (v) { + setWaterMark(v) { this.options.watermark = v; this.editor.setWaterMark(v); - }, + } - focus: function () { + focus() { this.editor.focus(); - }, + } - blur: function () { + blur() { this.editor.blur(); - }, + } - setErrorText: function (text) { + setErrorText(text) { this.editor.setErrorText(text); - }, + } - getErrorText: function () { + getErrorText() { return this.editor.getErrorText(); - }, + } - isValid: function () { + isValid() { return this.editor.isValid(); - }, + } - setValue: function (v) { + setValue(v) { this.editor.setValue(v); - }, + } - getValue: function () { + getValue() { return this.editor.getValue(); } -}); -BI.TextEditor.EVENT_CHANGE = "EVENT_CHANGE"; -BI.TextEditor.EVENT_FOCUS = "EVENT_FOCUS"; -BI.TextEditor.EVENT_BLUR = "EVENT_BLUR"; -BI.TextEditor.EVENT_CLICK = "EVENT_CLICK"; -BI.TextEditor.EVENT_KEY_DOWN = "EVENT_KEY_DOWN"; -BI.TextEditor.EVENT_SPACE = "EVENT_SPACE"; -BI.TextEditor.EVENT_BACKSPACE = "EVENT_BACKSPACE"; - -BI.TextEditor.EVENT_START = "EVENT_START"; -BI.TextEditor.EVENT_PAUSE = "EVENT_PAUSE"; -BI.TextEditor.EVENT_STOP = "EVENT_STOP"; -BI.TextEditor.EVENT_CONFIRM = "EVENT_CONFIRM"; -BI.TextEditor.EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM"; -BI.TextEditor.EVENT_VALID = "EVENT_VALID"; -BI.TextEditor.EVENT_ERROR = "EVENT_ERROR"; -BI.TextEditor.EVENT_ENTER = "EVENT_ENTER"; -BI.TextEditor.EVENT_RESTRICT = "EVENT_RESTRICT"; -BI.TextEditor.EVENT_REMOVE = "EVENT_REMOVE"; -BI.TextEditor.EVENT_EMPTY = "EVENT_EMPTY"; - -BI.shortcut("bi.text_editor", BI.TextEditor); +} diff --git a/src/widget/editor/editor.text.small.js b/src/widget/editor/editor.text.small.js index cb7a9eb96..0d79c8c22 100644 --- a/src/widget/editor/editor.text.small.js +++ b/src/widget/editor/editor.text.small.js @@ -1,20 +1,20 @@ -/** - * 小号搜索框 - * Created by GUY on 2015/9/29. - * @class BI.SmallTextEditor - * @extends BI.SearchEditor - */ -BI.SmallTextEditor = BI.inherit(BI.TextEditor, { - _defaultConfig: function () { - var conf = BI.SmallTextEditor.superclass._defaultConfig.apply(this, arguments); - return BI.extend(conf, { - baseCls: (conf.baseCls || "") + " bi-small-text-editor", - height: 20 +import { shortcut, extend } from "@/core"; +import { TextEditor } from "./editor.text"; + +@shortcut() +export class SmallTextEditor extends TextEditor { + static xtype = "bi.small_text_editor" + + _defaultConfig() { + const conf = super._defaultConfig(...arguments); + + return extend(conf, { + baseCls: `${conf.baseCls || ""} bi-small-text-editor`, + height: 20, }); - }, + } - _init: function () { - BI.SmallTextEditor.superclass._init.apply(this, arguments); + _init() { + super._init(...arguments); } -}); -BI.shortcut("bi.small_text_editor", BI.SmallTextEditor); \ No newline at end of file +} diff --git a/src/widget/editor/index.js b/src/widget/editor/index.js new file mode 100644 index 000000000..f5b7bed83 --- /dev/null +++ b/src/widget/editor/index.js @@ -0,0 +1,4 @@ +export { SearchEditor } from "./editor.search"; +export { SmallSearchEditor } from "./editor.search.small"; +export { TextEditor } from "./editor.text"; +export { SmallTextEditor } from "./editor.text.small"; diff --git a/src/widget/index.js b/src/widget/index.js index d2284b0b8..327f708f8 100644 --- a/src/widget/index.js +++ b/src/widget/index.js @@ -6,12 +6,16 @@ import * as datetime from "./datetime"; import * as datetimepane from "./datetimepane"; import * as dynamicdatetime from "./dynamicdatetime"; import * as time from "./time"; +import * as editor from "./editor"; import { SelectTreeCombo } from "./selecttree/selecttree.combo"; import { SingleTreeCombo } from "./singletree/singletree.combo"; import { MultiTreeCombo } from "./multitree/multi.tree.combo"; import { MultiTreeInsertCombo } from "./multitree/multi.tree.insert.combo"; import { MultiTreeListCombo } from "./multitree/multi.tree.list.combo"; +import { NumberEditor } from "./numbereditor/number.editor"; +import { NumberInterval } from "./numberinterval/numberinterval"; import * as multiselect from "./multiselect"; +import * as multiselectlist from "./multiselectlist"; Object.assign(BI, { Collapse, @@ -22,12 +26,16 @@ Object.assign(BI, { ...datetimepane, ...dynamicdatetime, ...time, + ...editor, SelectTreeCombo, SingleTreeCombo, MultiTreeCombo, MultiTreeInsertCombo, MultiTreeListCombo, + NumberEditor, + NumberInterval, ...multiselect, + ...multiselectlist, }); export * from "./date/calendar"; @@ -36,14 +44,23 @@ export * from "./datepane"; export * from "./datetime"; export * from "./datetimepane"; export * from "./dynamicdatetime"; -export * from "./time"; +export * from "./time +export * from "./editor"; export { SelectTreeCombo } from "./selecttree/selecttree.combo"; export { SingleTreeCombo } from "./singletree/singletree.combo"; export { MultiTreeCombo } from "./multitree/multi.tree.combo"; export { MultiTreeInsertCombo } from "./multitree/multi.tree.insert.combo"; export { MultiTreeListCombo } from "./multitree/multi.tree.list.combo"; export * from "./multiselect"; - +export * from "./multiselectlist"; + export { - Collapse + Collapse, + NumberEditor, + NumberInterval, + SelectTreeCombo, + SingleTreeCombo, + MultiTreeCombo, + MultiTreeInsertCombo, + MultiTreeListCombo }; diff --git a/src/widget/multiselect/index.js b/src/widget/multiselect/index.js index e69de29bb..9d15e06a0 100644 --- a/src/widget/multiselect/index.js +++ b/src/widget/multiselect/index.js @@ -0,0 +1,4 @@ +export { MultiSelectCombo } from "./multiselect.combo"; +export { MultiSelectNoBarCombo } from "./multiselect.combo.nobar"; +export { MultiSelectInsertCombo } from "./multiselect.insert.combo"; +export { MultiSelectInsertNoBarCombo } from "./multiselect.insert.combo.nobar"; diff --git a/src/widget/multiselectlist/index.js b/src/widget/multiselectlist/index.js new file mode 100644 index 000000000..416458b1f --- /dev/null +++ b/src/widget/multiselectlist/index.js @@ -0,0 +1,3 @@ +export * from "./multiselectlist.insert"; +export * from "./multiselectlist.insert.nobar"; +export * from "./multiselectlist"; diff --git a/src/widget/multiselectlist/multiselectlist.insert.js b/src/widget/multiselectlist/multiselectlist.insert.js index 8b6e8785f..71616ccb3 100644 --- a/src/widget/multiselectlist/multiselectlist.insert.js +++ b/src/widget/multiselectlist/multiselectlist.insert.js @@ -1,59 +1,105 @@ -/** - * Created by zcf_1 on 2017/5/2. - */ -BI.MultiSelectInsertList = BI.inherit(BI.Single, { - _defaultConfig: function () { - return BI.extend(BI.MultiSelectInsertList.superclass._defaultConfig.apply(this, arguments), { +import { + shortcut, + extend, + emptyFn, + deepClone, + isKey, + Selection, + remove, + pushDistinct, + createWidget, + isNotEmptyString, + i18nText, + isEmptyArray, + last, + initial, + endWith, + AbsoluteLayout, + isEmptyString, + makeObject, + each, + Func, + map, + concat, + isNotNull, + values, + filter, + contains, + isNull, VerticalFillLayout +} from "@/core"; +import { Single, Searcher } from "@/base"; +import { MultiSelectBar } from "@/case"; +import { SelectPatchEditor } from "../multiselect/trigger/editor/editor.patch"; +import { MultiSelectLoader } from "../multiselect/multiselect.loader"; +import { MultiSelectSearchInsertPane } from "../multiselect/search/multiselect.search.insert.pane"; +import { SearchEditor } from "@/widget/editor/editor.search"; + + +@shortcut() +export class MultiSelectInsertList extends Single { + static xtype = "bi.multi_select_insert_list"; + + static REQ_GET_DATA_LENGTH = "1"; + static REQ_GET_ALL_DATA = "-1"; + static EVENT_CHANGE = "EVENT_CHANGE"; + + _defaultConfig() { + return extend(super._defaultConfig(...arguments), { baseCls: "bi-multi-select-insert-list", - itemsCreator: BI.emptyFn, - valueFormatter: BI.emptyFn, + itemsCreator: emptyFn, + valueFormatter: emptyFn, searcherHeight: BI.SIZE_CONSANTS.TRIGGER_HEIGHT, itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, }); - }, - _init: function () { - BI.MultiSelectInsertList.superclass._init.apply(this, arguments); + } - var self = this, o = this.options; - this.storeValue = this._assertValue(BI.deepClone(o.value) || {}); + _init() { + super._init(...arguments); - var assertShowValue = function () { - BI.isKey(self._startValue) && (self.storeValue.type === BI.Selection.All ? BI.remove(self.storeValue.value, self._startValue) : BI.pushDistinct(self.storeValue.value, self._startValue)); + const self = this, + o = this.options; + this.storeValue = this._assertValue(deepClone(o.value) || {}); + + function assertShowValue() { + isKey(self._startValue) && + (self.storeValue.type === Selection.All + ? remove(self.storeValue.value, self._startValue) + : pushDistinct(self.storeValue.value, self._startValue)); // self.trigger.setValue(self.storeValue); - }; + } - this.adapter = BI.createWidget({ - type: "bi.multi_select_loader", + this.adapter = createWidget({ + type: MultiSelectLoader.xtype, cls: "popup-multi-select-list bi-border-left bi-border-right bi-border-bottom", itemsCreator: o.itemsCreator, itemHeight: o.itemHeight, valueFormatter: o.valueFormatter, itemFormatter: o.itemFormatter, logic: { - dynamic: false + dynamic: false, }, // onLoaded: o.onLoaded, el: {}, isDefaultInit: true, - value: o.value + value: o.value, }); - this.adapter.on(BI.MultiSelectLoader.EVENT_CHANGE, function () { + this.adapter.on(MultiSelectLoader.EVENT_CHANGE, function () { self.storeValue = this.getValue(); assertShowValue(); - self.fireEvent(BI.MultiSelectInsertList.EVENT_CHANGE); + self.fireEvent(MultiSelectInsertList.EVENT_CHANGE); }); - this.searcherPane = BI.createWidget({ - type: "bi.multi_select_search_insert_pane", + this.searcherPane = createWidget({ + type: MultiSelectSearchInsertPane.xtype, cls: "bi-border-left bi-border-right bi-border-bottom", valueFormatter: o.valueFormatter, itemFormatter: o.itemFormatter, - keywordGetter: function () { + keywordGetter() { return self.trigger.getKeyword(); }, - itemsCreator: function (op, callback) { - var keyword = self.trigger.getKeyword(); - if (BI.isNotEmptyString(keyword)) { + itemsCreator(op, callback) { + const keyword = self.trigger.getKeyword(); + if (isNotEmptyString(keyword)) { op.keywords = [keyword]; this.setKeyword(op.keywords[0]); o.itemsCreator(op, callback); @@ -63,298 +109,338 @@ BI.MultiSelectInsertList = BI.inherit(BI.Single, { }); this.searcherPane.setVisible(false); - this.trigger = BI.createWidget({ - type: "bi.searcher", + this.trigger = createWidget({ + type: Searcher.xtype, el: { - type: "bi.select_patch_editor", + type: SelectPatchEditor.xtype, el: { - type: "bi.search_editor", - watermark: BI.i18nText("BI-Basic_Search_And_Patch_Paste"), + type: SearchEditor.xtype, + watermark: i18nText("BI-Basic_Search_And_Patch_Paste"), }, - ref: function (ref) { + ref(ref) { self.editor = ref; }, }, isAutoSearch: false, isAutoSync: false, - onSearch: function (op, callback) { + onSearch(op, callback) { callback(); }, adapter: this.adapter, popup: this.searcherPane, masker: false, - listeners: [{ - eventName: BI.Searcher.EVENT_START, - action: function () { - self._showSearcherPane(); - self._setStartValue(""); - this.setValue(BI.deepClone(self.storeValue)); - } - }, { - eventName: BI.Searcher.EVENT_STOP, - action: function () { - self._showAdapter(); - self._setStartValue(""); - self.adapter.setValue(self.storeValue); - // 需要刷新回到初始界面，否则搜索的结果不能放在最前面 - self.adapter.populate(); - } - }, { - eventName: BI.Searcher.EVENT_PAUSE, - action: function () { - var keywords = self._getKeywords(); - if (keywords[keywords.length - 1] === BI.BlankSplitChar) { - keywords = keywords.slice(0, keywords.length - 1); - } - var keyword = BI.isEmptyArray(keywords) ? "" : keywords[keywords.length - 1]; - self._join({ - type: BI.Selection.Multi, - value: [keyword] - }, function () { - if (self.storeValue.type === BI.Selection.Multi) { - BI.pushDistinct(self.storeValue.value, keyword); - } + listeners: [ + { + eventName: Searcher.EVENT_START, + action() { + self._showSearcherPane(); + self._setStartValue(""); + this.setValue(deepClone(self.storeValue)); + }, + }, + { + eventName: Searcher.EVENT_STOP, + action() { self._showAdapter(); + self._setStartValue(""); self.adapter.setValue(self.storeValue); - self._setStartValue(keyword); - assertShowValue(); + // 需要刷新回到初始界面，否则搜索的结果不能放在最前面 self.adapter.populate(); - self._setStartValue(""); - self.fireEvent(BI.MultiSelectInsertList.EVENT_CHANGE); - }); - self._showAdapter(); - } - }, { - eventName: BI.Searcher.EVENT_SEARCHING, - action: function () { - var keywords = self._getKeywords(); - var last = BI.last(keywords); - keywords = BI.initial(keywords || []); - if (keywords.length > 0) { - self._joinKeywords(keywords, function () { - if (BI.endWith(last, BI.BlankSplitChar)) { + }, + }, + { + eventName: Searcher.EVENT_PAUSE, + action() { + let keywords = self._getKeywords(); + if ( + keywords[keywords.length - 1] === BI.BlankSplitChar + ) { + keywords = keywords.slice(0, keywords.length - 1); + } + const keyword = isEmptyArray(keywords) + ? "" + : keywords[keywords.length - 1]; + self._join( + { + type: Selection.Multi, + value: [keyword], + }, + () => { + if (self.storeValue.type === Selection.Multi) { + pushDistinct( + self.storeValue.value, + keyword + ); + } + self._showAdapter(); self.adapter.setValue(self.storeValue); + self._setStartValue(keyword); assertShowValue(); self.adapter.populate(); self._setStartValue(""); - } else { - self.adapter.setValue(self.storeValue); - assertShowValue(); + self.fireEvent( + MultiSelectInsertList.EVENT_CHANGE + ); } - self.fireEvent(BI.MultiSelectInsertList.EVENT_CHANGE); - }); - self._getKeywordsLength() > 2000 && BI.Msg.alert(BI.i18nText("BI-Basic_Prompt"), BI.i18nText("BI-Basic_Too_Much_Value_Get_Two_Thousand")); - } - } - }, { - eventName: BI.Searcher.EVENT_CHANGE, - action: function (value, obj) { - if (obj instanceof BI.MultiSelectBar) { - self._joinAll(this.getValue(), function () { - assertShowValue(); - self.fireEvent(BI.MultiSelectInsertList.EVENT_CHANGE); - }); - } else { - self._join(this.getValue(), function () { - assertShowValue(); - self.fireEvent(BI.MultiSelectInsertList.EVENT_CHANGE); - }); - } + ); + self._showAdapter(); + }, + }, + { + eventName: Searcher.EVENT_SEARCHING, + action() { + let keywords = self._getKeywords(); + const lastKeyword = last(keywords); + keywords = initial(keywords || []); + if (keywords.length > 0) { + self._joinKeywords(keywords, () => { + if (endWith(lastKeyword, BI.BlankSplitChar)) { + self.adapter.setValue(self.storeValue); + assertShowValue(); + self.adapter.populate(); + self._setStartValue(""); + } else { + self.adapter.setValue(self.storeValue); + assertShowValue(); + } + self.fireEvent( + MultiSelectInsertList.EVENT_CHANGE + ); + }); + self._getKeywordsLength() > 2000 && + BI.Msg.alert( + i18nText("BI-Basic_Prompt"), + i18nText( + "BI-Basic_Too_Much_Value_Get_Two_Thousand" + ) + ); + } + }, + }, + { + eventName: Searcher.EVENT_CHANGE, + action(value, obj) { + if (obj instanceof MultiSelectBar) { + self._joinAll(this.getValue(), () => { + assertShowValue(); + self.fireEvent( + MultiSelectInsertList.EVENT_CHANGE + ); + }); + } else { + self._join(this.getValue(), () => { + assertShowValue(); + self.fireEvent( + MultiSelectInsertList.EVENT_CHANGE + ); + }); + } + }, } - }], - value: o.value + ], + value: o.value, }); - BI.createWidget({ - type: "bi.vertical_fill", + createWidget({ + type: VerticalFillLayout.xtype, rowSize: ["", "fill"], element: this, - items: [{ - el: this.trigger, - }, { - el: this.adapter, - }] + items: [ + { + el: this.trigger, + }, + { + el: this.adapter, + } + ], }); - BI.createWidget({ - type: "bi.absolute", + createWidget({ + type: AbsoluteLayout.xtype, element: this, - items: [{ - el: this.searcherPane, - top: o.searcherHeight || BI.SIZE_CONSANTS.TRIGGER_HEIGHT, - bottom: 0, - left: 0, - right: 0 - }] + items: [ + { + el: this.searcherPane, + top: o.searcherHeight || BI.SIZE_CONSANTS.TRIGGER_HEIGHT, + bottom: 0, + left: 0, + right: 0, + } + ], }); - }, + } - _getKeywords: function () { - var val = this.editor.getValue(); - var keywords = val.split(/\u200b\s\u200b/); - if (BI.isEmptyString(keywords[keywords.length - 1])) { + _getKeywords() { + const val = this.editor.getValue(); + let keywords = val.split(/\u200b\s\u200b/); + if (isEmptyString(keywords[keywords.length - 1])) { keywords = keywords.slice(0, keywords.length - 1); } if (/\u200b\s\u200b$/.test(val)) { keywords = keywords.concat([BI.BlankSplitChar]); } - return keywords.length > 2000 ? keywords.slice(0, 2000).concat([BI.BlankSplitChar]) : keywords.slice(0, 2000); - }, + return keywords.length > 2000 + ? keywords.slice(0, 2000).concat([BI.BlankSplitChar]) + : keywords.slice(0, 2000); + } - _getKeywordsLength: function () { - var val = this.editor.getValue(); - var keywords = val.split(/\u200b\s\u200b/); + _getKeywordsLength() { + const val = this.editor.getValue(); + const keywords = val.split(/\u200b\s\u200b/); return keywords.length - 1; - }, + } - _showAdapter: function () { + _showAdapter() { this.adapter.setVisible(true); this.searcherPane.setVisible(false); - }, + } - _showSearcherPane: function () { + _showSearcherPane() { this.searcherPane.setVisible(true); this.adapter.setVisible(false); - }, + } - _defaultState: function () { + _defaultState() { this.trigger.stopEditing(); - }, + } - _assertValue: function (val) { + _assertValue(val) { val || (val = {}); - val.type || (val.type = BI.Selection.Multi); + val.type || (val.type = Selection.Multi); val.value || (val.value = []); + return val; - }, + } - _makeMap: function (values) { - return BI.makeObject(values || []); - }, + _makeMap(values) { + return makeObject(values || []); + } - _joinKeywords: function (keywords, callback) { - var self = this, o = this.options; + _joinKeywords(keywords, callback) { + const self = this; this._assertValue(this.storeValue); // 和复选下拉框同步，allData做缓存是会爆炸的 digest(); function digest() { - BI.each(keywords, function (i, val) { - self.storeValue.type === BI.Selection.Multi ? BI.pushDistinct(self.storeValue.value, val) : BI.remove(self.storeValue.value, val); + each(keywords, (i, val) => { + self.storeValue.type === Selection.Multi + ? pushDistinct(self.storeValue.value, val) + : remove(self.storeValue.value, val); }); callback(); } - }, + } - _joinAll: function (res, callback) { - var self = this, o = this.options; + _joinAll(res, callback) { + const self = this, + o = this.options; this._assertValue(res); if (this.storeValue.type === res.type) { - var result = BI.Func.getSearchResult(BI.map(this.storeValue.value, function (_i, v) { - return { - text: o.valueFormatter(v) || v, - value: v - }; - }), this.trigger.getKeyword()); - var change = false; - var map = this._makeMap(this.storeValue.value); - BI.each(BI.concat(result.match, result.find), function (i, obj) { - var v = obj.value; - if (BI.isNotNull(map[v])) { + const result = Func.getSearchResult( + map(this.storeValue.value, (_i, v) => { + return { + text: o.valueFormatter(v) || v, + value: v, + }; + }), + this.trigger.getKeyword() + ); + let change = false; + const tempMap = this._makeMap(this.storeValue.value); + each(concat(result.match, result.find), (i, obj) => { + const v = obj.value; + if (isNotNull(tempMap[v])) { change = true; - delete map[v]; + delete tempMap[v]; } }); - change && (this.storeValue.value = BI.values(map)); + change && (this.storeValue.value = values(tempMap)); callback(); + return; } - o.itemsCreator({ - type: BI.MultiSelectInsertList.REQ_GET_ALL_DATA, - keywords: [this.trigger.getKeyword()], - selectedValues: BI.filter(this.storeValue.value, function (_i, v) { - return !BI.contains(res.value, v); - }), - }, function (ob) { - var items = BI.map(ob.items, "value"); - var selectedMap = self._makeMap(self.storeValue.value); - var notSelectedMap = self._makeMap(res.value); - var newItems = []; - BI.each(items, function (i, item) { - if (BI.isNotNull(selectedMap[items[i]])) { - delete selectedMap[items[i]]; - } - if (BI.isNull(notSelectedMap[items[i]])) { - newItems.push(item); - } - }); - self.storeValue.value = newItems.concat(BI.values(selectedMap)); - callback(); - }); - }, + o.itemsCreator( + { + type: MultiSelectInsertList.REQ_GET_ALL_DATA, + keywords: [this.trigger.getKeyword()], + selectedValues: filter(this.storeValue.value, (_i, v) => !contains(res.value, v)), + }, + ob => { + const items = map(ob.items, "value"); + const selectedMap = self._makeMap(self.storeValue.value); + const notSelectedMap = self._makeMap(res.value); + const newItems = []; + each(items, (i, item) => { + if (isNotNull(selectedMap[items[i]])) { + delete selectedMap[items[i]]; + } + if (isNull(notSelectedMap[items[i]])) { + newItems.push(item); + } + }); + self.storeValue.value = newItems.concat(values(selectedMap)); + callback(); + } + ); + } - _join: function (res, callback) { - var self = this, o = this.options; + _join(res, callback) { + const self = this; this._assertValue(res); this._assertValue(this.storeValue); if (this.storeValue.type === res.type) { - var map = this._makeMap(this.storeValue.value); - BI.each(res.value, function (i, v) { + const map = this._makeMap(this.storeValue.value); + each(res.value, (i, v) => { if (!map[v]) { - BI.pushDistinct(self.storeValue.value, v); + pushDistinct(self.storeValue.value, v); map[v] = v; } }); - var change = false; - BI.each(res.assist, function (i, v) { - if (BI.isNotNull(map[v])) { + let change = false; + each(res.assist, (i, v) => { + if (isNotNull(map[v])) { change = true; delete map[v]; } }); - change && (this.storeValue.value = BI.values(map)); + change && (this.storeValue.value = values(map)); callback(); + return; } this._joinAll(res, callback); - }, + } - _setStartValue: function (value) { + _setStartValue(value) { this._startValue = value; this.adapter.setStartValue(value); - }, + } - isAllSelected: function () { + isAllSelected() { return this.adapter.isAllSelected(); - }, + } - resize: function () { + resize() { // this.trigger.getCounter().adjustView(); // this.trigger.adjustView(); - }, - setValue: function (v) { + } + + setValue(v) { this.storeValue = v || {}; this._assertValue(this.storeValue); this.adapter.setValue(this.storeValue); this.trigger.setValue(this.storeValue); - }, - - getValue: function () { - return BI.deepClone(this.storeValue); - }, - - populate: function () { - this.adapter.populate.apply(this.adapter, arguments); - this.trigger.populate.apply(this.trigger, arguments); } -}); -BI.extend(BI.MultiSelectInsertList, { - REQ_GET_DATA_LENGTH: 1, - REQ_GET_ALL_DATA: -1 -}); + getValue() { + return deepClone(this.storeValue); + } -BI.MultiSelectInsertList.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.multi_select_insert_list", BI.MultiSelectInsertList); + populate() { + this.adapter.populate(...arguments); + this.trigger.populate(...arguments); + } +} diff --git a/src/widget/multiselectlist/multiselectlist.insert.nobar.js b/src/widget/multiselectlist/multiselectlist.insert.nobar.js index be87999ad..ac21aa3b4 100644 --- a/src/widget/multiselectlist/multiselectlist.insert.nobar.js +++ b/src/widget/multiselectlist/multiselectlist.insert.nobar.js @@ -1,61 +1,107 @@ -/** - * Created by zcf_1 on 2017/5/2. - */ -BI.MultiSelectInsertNoBarList = BI.inherit(BI.Single, { - _defaultConfig: function () { - return BI.extend(BI.MultiSelectInsertNoBarList.superclass._defaultConfig.apply(this, arguments), { +import { + shortcut, + extend, + emptyFn, + Selection, + deepClone, + isKey, + remove, + pushDistinct, + createWidget, + isNotEmptyString, + i18nText, + isEmptyArray, + last, + initial, + endWith, + AbsoluteLayout, + isEmptyString, + makeObject, + each, + Func, + map, + concat, + isNotNull, + values, + filter, + contains, + isNull, VTapeLayout +} from "@/core"; +import { Single, Searcher, Msg } from "@/base"; +import { MultiSelectBar } from "@/case"; +import { SelectPatchEditor } from "../multiselect/trigger/editor/editor.patch"; +import { MultiSelectNoBarLoader } from "../multiselect/multiselect.loader.nobar"; +import { MultiSelectSearchInsertPane } from "../multiselect/search/multiselect.search.insert.pane"; +import { SearchEditor } from "../editor/editor.search"; + + +@shortcut() +export class MultiSelectInsertNoBarList extends Single { + static xtype = "bi.multi_select_insert_no_bar_list"; + + static REQ_GET_DATA_LENGTH = "1"; + static REQ_GET_ALL_DATA = "-1"; + static EVENT_CHANGE = "EVENT_CHANGE"; + + _defaultConfig() { + return extend(super._defaultConfig(...arguments), { baseCls: "bi-multi-select-insert-list", - itemsCreator: BI.emptyFn, - valueFormatter: BI.emptyFn, + itemsCreator: emptyFn, + valueFormatter: emptyFn, searcherHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, }); - }, - _init: function () { - BI.MultiSelectInsertNoBarList.superclass._init.apply(this, arguments); + } - var self = this, o = this.options; + _init() { + super._init(...arguments); + + const self = this, + o = this.options; this.storeValue = { - type: BI.Selection.Multi, - value: BI.deepClone(o.value) || [] + type: Selection.Multi, + value: deepClone(o.value) || [], }; - var assertShowValue = function () { - BI.isKey(self._startValue) && (self.storeValue.type === BI.Selection.All ? BI.remove(self.storeValue.value, self._startValue) : BI.pushDistinct(self.storeValue.value, self._startValue)); + function assertShowValue() { + isKey(self._startValue) && + (self.storeValue.type === Selection.All + ? remove(self.storeValue.value, self._startValue) + : pushDistinct(self.storeValue.value, self._startValue)); // self.trigger.setValue(self.storeValue); - }; + } - this.adapter = BI.createWidget({ - type: "bi.multi_select_no_bar_loader", + this.adapter = createWidget({ + type: MultiSelectNoBarLoader.xtype, cls: "popup-multi-select-list bi-border-left bi-border-right bi-border-bottom", itemsCreator: o.itemsCreator, itemHeight: o.itemHeight, valueFormatter: o.valueFormatter, logic: { - dynamic: false + dynamic: false, }, // onLoaded: o.onLoaded, el: {}, value: { - type: BI.Selection.Multi, - value: o.value || [] - } + type: Selection.Multi, + value: o.value || [], + }, }); - this.adapter.on(BI.MultiSelectLoader.EVENT_CHANGE, function () { + this.adapter.on(MultiSelectNoBarLoader.EVENT_CHANGE, function () { self.storeValue = this.getValue(); assertShowValue(); - self.fireEvent(BI.MultiSelectInsertNoBarList.EVENT_CHANGE); + self.fireEvent(MultiSelectInsertNoBarList.EVENT_CHANGE); }); - this.searcherPane = BI.createWidget({ - type: "bi.multi_select_search_insert_pane", + this.searcherPane = createWidget({ + type: MultiSelectSearchInsertPane.xtype, cls: "bi-border-left bi-border-right bi-border-bottom", valueFormatter: o.valueFormatter, - keywordGetter: function () { + keywordGetter() { return self.trigger.getKeyword(); }, - itemsCreator: function (op, callback) { - var keyword = self.trigger.getKeyword(); - if (BI.isNotEmptyString(keyword)) { + itemsCreator(op, callback) { + const keyword = self.trigger.getKeyword(); + if (isNotEmptyString(keyword)) { op.keywords = [keyword]; this.setKeyword(op.keywords[0]); o.itemsCreator(op, callback); @@ -64,303 +110,342 @@ BI.MultiSelectInsertNoBarList = BI.inherit(BI.Single, { }); this.searcherPane.setVisible(false); - this.trigger = BI.createWidget({ - type: "bi.searcher", + this.trigger = createWidget({ + type: Searcher.xtype, el: { - type: "bi.select_patch_editor", + type: SelectPatchEditor.xtype, el: { - type: "bi.search_editor", - watermark: BI.i18nText("BI-Basic_Search_And_Patch_Paste"), + type: SearchEditor.xtype, + watermark: i18nText("BI-Basic_Search_And_Patch_Paste"), }, - ref: function (ref) { + ref(ref) { self.editor = ref; }, - height: o.searcherHeight + height: o.searcherHeight, }, isAutoSearch: false, isAutoSync: false, - onSearch: function (op, callback) { + onSearch(op, callback) { callback(); }, adapter: this.adapter, popup: this.searcherPane, height: 200, masker: false, - listeners: [{ - eventName: BI.Searcher.EVENT_START, - action: function () { - self._showSearcherPane(); - self._setStartValue(""); - this.setValue(BI.deepClone(self.storeValue)); - } - }, { - eventName: BI.Searcher.EVENT_STOP, - action: function () { - self._showAdapter(); - self._setStartValue(""); - self.adapter.setValue(self.storeValue); - // 需要刷新回到初始界面，否则搜索的结果不能放在最前面 - self.adapter.populate(); - } - }, { - eventName: BI.Searcher.EVENT_PAUSE, - action: function () { - var keywords = self._getKeywords(); - if (keywords[keywords.length - 1] === BI.BlankSplitChar) { - keywords = keywords.slice(0, keywords.length - 1); - } - var keyword = BI.isEmptyArray(keywords) ? "" : keywords[keywords.length - 1]; - self._join({ - type: BI.Selection.Multi, - value: [keyword] - }, function () { - if (self.storeValue.type === BI.Selection.Multi) { - BI.pushDistinct(self.storeValue.value, keyword); - } + listeners: [ + { + eventName: Searcher.EVENT_START, + action() { + self._showSearcherPane(); + self._setStartValue(""); + this.setValue(deepClone(self.storeValue)); + }, + }, + { + eventName: Searcher.EVENT_STOP, + action() { self._showAdapter(); + self._setStartValue(""); self.adapter.setValue(self.storeValue); - self._setStartValue(keyword); - assertShowValue(); + // 需要刷新回到初始界面，否则搜索的结果不能放在最前面 self.adapter.populate(); - self._setStartValue(""); - self.fireEvent(BI.MultiSelectInsertNoBarList.EVENT_CHANGE); - }); - } - }, { - eventName: BI.Searcher.EVENT_SEARCHING, - action: function () { - var keywords = self._getKeywords(); - var last = BI.last(keywords); - keywords = BI.initial(keywords || []); - if (keywords.length > 0) { - self._joinKeywords(keywords, function () { - if (BI.endWith(last, BI.BlankSplitChar)) { + }, + }, + { + eventName: Searcher.EVENT_PAUSE, + action() { + let keywords = self._getKeywords(); + if ( + keywords[keywords.length - 1] === BI.BlankSplitChar + ) { + keywords = keywords.slice(0, keywords.length - 1); + } + const keyword = isEmptyArray(keywords) + ? "" + : keywords[keywords.length - 1]; + self._join( + { + type: Selection.Multi, + value: [keyword], + }, + () => { + if (self.storeValue.type === Selection.Multi) { + pushDistinct( + self.storeValue.value, + keyword + ); + } + self._showAdapter(); self.adapter.setValue(self.storeValue); + self._setStartValue(keyword); assertShowValue(); self.adapter.populate(); self._setStartValue(""); - } else { - self.adapter.setValue(self.storeValue); - assertShowValue(); + self.fireEvent( + MultiSelectInsertNoBarList.EVENT_CHANGE + ); } - self.fireEvent(BI.MultiSelectInsertNoBarList.EVENT_CHANGE); - }); - self._getKeywordsLength() > 2000 && BI.Msg.alert(BI.i18nText("BI-Basic_Prompt"), BI.i18nText("BI-Basic_Too_Much_Value_Get_Two_Thousand")); - } - } - }, { - eventName: BI.Searcher.EVENT_CHANGE, - action: function (value, obj) { - if (obj instanceof BI.MultiSelectBar) { - self._joinAll(this.getValue(), function () { - assertShowValue(); - self.fireEvent(BI.MultiSelectInsertNoBarList.EVENT_CHANGE); - }); - } else { - self._join(this.getValue(), function () { - assertShowValue(); - self.fireEvent(BI.MultiSelectInsertNoBarList.EVENT_CHANGE); - }); - } + ); + }, + }, + { + eventName: Searcher.EVENT_SEARCHING, + action() { + let keywords = self._getKeywords(); + const lastKeyword = last(keywords); + keywords = initial(keywords || []); + if (keywords.length > 0) { + self._joinKeywords(keywords, () => { + if (endWith(lastKeyword, BI.BlankSplitChar)) { + self.adapter.setValue(self.storeValue); + assertShowValue(); + self.adapter.populate(); + self._setStartValue(""); + } else { + self.adapter.setValue(self.storeValue); + assertShowValue(); + } + self.fireEvent( + MultiSelectInsertNoBarList.EVENT_CHANGE + ); + }); + self._getKeywordsLength() > 2000 && + Msg.alert( + i18nText("BI-Basic_Prompt"), + i18nText( + "BI-Basic_Too_Much_Value_Get_Two_Thousand" + ) + ); + } + }, + }, + { + eventName: Searcher.EVENT_CHANGE, + action(value, obj) { + if (obj instanceof MultiSelectBar) { + self._joinAll(this.getValue(), () => { + assertShowValue(); + self.fireEvent( + MultiSelectInsertNoBarList.EVENT_CHANGE + ); + }); + } else { + self._join(this.getValue(), () => { + assertShowValue(); + self.fireEvent( + MultiSelectInsertNoBarList.EVENT_CHANGE + ); + }); + } + }, } - }], + ], value: { - type: BI.Selection.Multi, - value: o.value || [] - } + type: Selection.Multi, + value: o.value || [], + }, }); - BI.createWidget({ - type: "bi.vtape", + createWidget({ + type: VTapeLayout.xtype, element: this, - items: [{ - el: this.trigger, - height: o.searcherHeight - }, { - el: this.adapter, - height: "fill" - }] + items: [ + { + el: this.trigger, + height: o.searcherHeight, + }, + { + el: this.adapter, + height: "fill", + } + ], }); - BI.createWidget({ - type: "bi.absolute", + createWidget({ + type: AbsoluteLayout.xtype, element: this, - items: [{ - el: this.searcherPane, - top: o.searcherHeight, - bottom: 0, - left: 0, - right: 0 - }] + items: [ + { + el: this.searcherPane, + top: o.searcherHeight, + bottom: 0, + left: 0, + right: 0, + } + ], }); - }, + } - _getKeywords: function () { - var val = this.editor.getValue(); - var keywords = val.split(/\u200b\s\u200b/); - if (BI.isEmptyString(keywords[keywords.length - 1])) { + _getKeywords() { + const val = this.editor.getValue(); + let keywords = val.split(/\u200b\s\u200b/); + if (isEmptyString(keywords[keywords.length - 1])) { keywords = keywords.slice(0, keywords.length - 1); } if (/\u200b\s\u200b$/.test(val)) { keywords = keywords.concat([BI.BlankSplitChar]); } - return keywords.length > 2000 ? keywords.slice(0, 2000).concat([BI.BlankSplitChar]) : keywords.slice(0, 2000); - }, + return keywords.length > 2000 + ? keywords.slice(0, 2000).concat([BI.BlankSplitChar]) + : keywords.slice(0, 2000); + } - _getKeywordsLength: function () { - var val = this.editor.getValue(); - var keywords = val.split(/\u200b\s\u200b/); + _getKeywordsLength() { + const val = this.editor.getValue(); + const keywords = val.split(/\u200b\s\u200b/); return keywords.length - 1; - }, + } - _showAdapter: function () { + _showAdapter() { this.adapter.setVisible(true); this.searcherPane.setVisible(false); - }, + } - _showSearcherPane: function () { + _showSearcherPane() { this.searcherPane.setVisible(true); this.adapter.setVisible(false); - }, + } - _defaultState: function () { + _defaultState() { this.trigger.stopEditing(); - }, + } - _assertValue: function (val) { + _assertValue(val) { val || (val = {}); - val.type || (val.type = BI.Selection.Multi); + val.type || (val.type = Selection.Multi); val.value || (val.value = []); - }, + } - _makeMap: function (values) { - return BI.makeObject(values || []); - }, + _makeMap(values) { + return makeObject(values || []); + } - _joinKeywords: function (keywords, callback) { - var self = this, o = this.options; + _joinKeywords(keywords, callback) { + const self = this; this._assertValue(this.storeValue); // 和复选下拉框同步，allData做缓存是会爆炸的 digest(); - function digest (items) { - BI.each(keywords, function (i, val) { - self.storeValue.type === BI.Selection.Multi ? BI.pushDistinct(self.storeValue.value, val) : BI.remove(self.storeValue.value, val); + function digest(items) { + each(keywords, (i, val) => { + self.storeValue.type === Selection.Multi + ? pushDistinct(self.storeValue.value, val) + : remove(self.storeValue.value, val); }); callback(); } - }, + } - _joinAll: function (res, callback) { - var self = this, o = this.options; + _joinAll(res, callback) { + const self = this, + o = this.options; this._assertValue(res); if (this.storeValue.type === res.type) { - var result = BI.Func.getSearchResult(BI.map(this.storeValue.value, function (_i, v) { - return { - text: o.valueFormatter(v) || v, - value: v - }; - }), this.trigger.getKeyword()); - var change = false; - var map = this._makeMap(this.storeValue.value); - BI.each(BI.concat(result.match, result.find), function (i, obj) { - var v = obj.value; - if (BI.isNotNull(map[v])) { + const result = Func.getSearchResult( + map(this.storeValue.value, (_i, v) => { + return { + text: o.valueFormatter(v) || v, + value: v, + }; + }), + this.trigger.getKeyword() + ); + let change = false; + const tempMap = this._makeMap(this.storeValue.value); + each(concat(result.match, result.find), (i, obj) => { + const v = obj.value; + if (isNotNull(tempMap[v])) { change = true; - delete map[v]; + delete tempMap[v]; } }); - change && (this.storeValue.value = BI.values(map)); + change && (this.storeValue.value = values(tempMap)); callback(); + return; } - o.itemsCreator({ - type: BI.MultiSelectInsertNoBarList.REQ_GET_ALL_DATA, - keywords: [this.trigger.getKeyword()], - selectedValues: BI.filter(this.storeValue.value, function (_i, v) { - return !BI.contains(res.value, v); - }), - }, function (ob) { - var items = BI.map(ob.items, "value"); - var selectedMap = self._makeMap(self.storeValue.value); - var notSelectedMap = self._makeMap(res.value); - var newItems = []; - BI.each(items, function (i, item) { - if (BI.isNotNull(selectedMap[items[i]])) { - delete selectedMap[items[i]]; - } - if (BI.isNull(notSelectedMap[items[i]])) { - newItems.push(item); - } - }); - self.storeValue.value = newItems.concat(BI.values(selectedMap)); - callback(); - }); - }, + o.itemsCreator( + { + type: MultiSelectInsertNoBarList.REQ_GET_ALL_DATA, + keywords: [this.trigger.getKeyword()], + selectedValues: filter(this.storeValue.value, (_i, v) => !contains(res.value, v)), + }, + ob => { + const items = map(ob.items, "value"); + const selectedMap = self._makeMap(self.storeValue.value); + const notSelectedMap = self._makeMap(res.value); + const newItems = []; + each(items, (i, item) => { + if (isNotNull(selectedMap[items[i]])) { + delete selectedMap[items[i]]; + } + if (isNull(notSelectedMap[items[i]])) { + newItems.push(item); + } + }); + self.storeValue.value = newItems.concat(values(selectedMap)); + callback(); + } + ); + } - _join: function (res, callback) { - var self = this, o = this.options; + _join(res, callback) { + const self = this; this._assertValue(res); this._assertValue(this.storeValue); if (this.storeValue.type === res.type) { - var map = this._makeMap(this.storeValue.value); - BI.each(res.value, function (i, v) { + const map = this._makeMap(this.storeValue.value); + each(res.value, (i, v) => { if (!map[v]) { - BI.pushDistinct(self.storeValue.value, v); + pushDistinct(self.storeValue.value, v); map[v] = v; } }); - var change = false; - BI.each(res.assist, function (i, v) { - if (BI.isNotNull(map[v])) { + let change = false; + each(res.assist, (i, v) => { + if (isNotNull(map[v])) { change = true; delete map[v]; } }); - change && (this.storeValue.value = BI.values(map)); + change && (this.storeValue.value = values(map)); callback(); + return; } this._joinAll(res, callback); - }, + } - _setStartValue: function (value) { + _setStartValue(value) { this._startValue = value; this.adapter.setStartValue(value); - }, + } - isAllSelected: function () { + isAllSelected() { return this.adapter.isAllSelected(); - }, + } - resize: function () { + resize() { // this.trigger.getCounter().adjustView(); // this.trigger.adjustView(); - }, - setValue: function (v) { + } + + setValue(v) { this.storeValue = { - type: BI.Selection.Multi, - value: v || [] + type: Selection.Multi, + value: v || [], }; this.adapter.setValue(this.storeValue); this.trigger.setValue(this.storeValue); - }, - - getValue: function () { - return BI.deepClone(this.storeValue.value); - }, - - populate: function () { - this.adapter.populate.apply(this.adapter, arguments); - this.trigger.populate.apply(this.trigger, arguments); } -}); -BI.extend(BI.MultiSelectInsertNoBarList, { - REQ_GET_DATA_LENGTH: 1, - REQ_GET_ALL_DATA: -1 -}); + getValue() { + return deepClone(this.storeValue.value); + } -BI.MultiSelectInsertNoBarList.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.multi_select_insert_no_bar_list", BI.MultiSelectInsertNoBarList); + populate() { + this.adapter.populate(...arguments); + this.trigger.populate(...arguments); + } +} diff --git a/src/widget/multiselectlist/multiselectlist.js b/src/widget/multiselectlist/multiselectlist.js index 7255963df..878bc5bc0 100644 --- a/src/widget/multiselectlist/multiselectlist.js +++ b/src/widget/multiselectlist/multiselectlist.js @@ -1,177 +1,233 @@ -/** - * Created by zcf_1 on 2017/5/2. - */ -BI.MultiSelectList = BI.inherit(BI.Widget, { - _defaultConfig: function () { - return BI.extend(BI.MultiSelectList.superclass._defaultConfig.apply(this, arguments), { +import { + shortcut, + Widget, + extend, + emptyFn, + deepClone, + isKey, + Selection, + remove, + pushDistinct, + createWidget, + isNotEmptyString, + last, + initial, + endWith, + AbsoluteLayout, + isEmptyString, + makeObject, + map, + each, + isNotNull, + Func, + concat, + values, + filter, + contains, + isNull, VTapeLayout +} from "@/core"; +import { Searcher } from "@/base"; +import { MultiSelectBar } from "@/case"; +import { MultiSelectLoader } from "../multiselect/multiselect.loader"; +import { MultiSelectSearchPane } from "../multiselect/search/multiselect.search.pane"; +import { SelectPatchEditor } from "../multiselect/trigger/editor/editor.patch"; +import { SearchEditor } from "../editor/editor.search"; + + +@shortcut() +export class MultiSelectList extends Widget { + static xtype = "bi.multi_select_list"; + + static REQ_GET_DATA_LENGTH = "1"; + static REQ_GET_ALL_DATA = "-1"; + static EVENT_CHANGE = "EVENT_CHANGE"; + + _defaultConfig() { + return extend(super._defaultConfig(...arguments), { baseCls: "bi-multi-select-list", - itemsCreator: BI.emptyFn, - valueFormatter: BI.emptyFn, + itemsCreator: emptyFn, + valueFormatter: emptyFn, searcherHeight: 24, itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, }); - }, - _init: function () { - BI.MultiSelectList.superclass._init.apply(this, arguments); + } + + _init() { + super._init(...arguments); - var self = this, o = this.options; - this.storeValue = this._assertValue(BI.deepClone(o.value) || {}); + const self = this, + o = this.options; + this.storeValue = this._assertValue(deepClone(o.value) || {}); - var assertShowValue = function () { - BI.isKey(self._startValue) && (self.storeValue.type === BI.Selection.All ? BI.remove(self.storeValue.value, self._startValue) : BI.pushDistinct(self.storeValue.value, self._startValue)); + function assertShowValue() { + isKey(self._startValue) && + (self.storeValue.type === Selection.All + ? remove(self.storeValue.value, self._startValue) + : pushDistinct(self.storeValue.value, self._startValue)); // self.trigger.setValue(self.storeValue); - }; + } - this.adapter = BI.createWidget({ - type: "bi.multi_select_loader", + this.adapter = createWidget({ + type: MultiSelectLoader.xtype, cls: "popup-multi-select-list bi-border-left bi-border-right bi-border-bottom", itemsCreator: o.itemsCreator, valueFormatter: o.valueFormatter, itemHeight: o.itemHeight, logic: { - dynamic: false + dynamic: false, }, value: o.value, isDefaultInit: true, // onLoaded: o.onLoaded, - el: {} + el: {}, }); - this.adapter.on(BI.MultiSelectLoader.EVENT_CHANGE, function () { + this.adapter.on(MultiSelectLoader.EVENT_CHANGE, function () { self.storeValue = this.getValue(); - self._adjust(function () { + self._adjust(() => { assertShowValue(); - self.fireEvent(BI.MultiSelectList.EVENT_CHANGE); + self.fireEvent(MultiSelectList.EVENT_CHANGE); }); }); - this.searcherPane = BI.createWidget({ - type: "bi.multi_select_search_pane", + this.searcherPane = createWidget({ + type: MultiSelectSearchPane.xtype, cls: "bi-border-left bi-border-right bi-border-bottom", valueFormatter: o.valueFormatter, - keywordGetter: function () { + keywordGetter() { return self.trigger.getKeyword(); }, - itemsCreator: function (op, callback) { - var keyword = self.trigger.getKeyword(); - if (BI.isNotEmptyString(keyword)) { + itemsCreator(op, callback) { + const keyword = self.trigger.getKeyword(); + if (isNotEmptyString(keyword)) { op.keywords = [keyword]; o.itemsCreator(op, callback); } }, - itemHeight: o.itemHeight + itemHeight: o.itemHeight, }); this.searcherPane.setVisible(false); - this.trigger = BI.createWidget({ - type: "bi.searcher", + this.trigger = createWidget({ + type: Searcher.xtype, el: { - type: "bi.select_patch_editor", + type: SelectPatchEditor.xtype, el: { - type: "bi.search_editor", + type: SearchEditor.xtype, }, - ref: function (ref) { + ref(ref) { self.editor = ref; }, - height: o.searcherHeight + height: o.searcherHeight, }, isAutoSearch: false, isAutoSync: false, - onSearch: function (op, callback) { + onSearch(op, callback) { callback(); }, adapter: this.adapter, popup: this.searcherPane, height: 200, masker: false, - listeners: [{ - eventName: BI.Searcher.EVENT_START, - action: function () { - self._showSearcherPane(); - self._setStartValue(""); - this.setValue(BI.deepClone(self.storeValue)); - } - }, { - eventName: BI.Searcher.EVENT_STOP, - action: function () { - self._showAdapter(); - self._setStartValue(""); - self.adapter.setValue(self.storeValue); - // 需要刷新回到初始界面，否则搜索的结果不能放在最前面 - self.adapter.populate(); - } - }, { - eventName: BI.Searcher.EVENT_PAUSE, - action: function () { - self._showAdapter(); - self.fireEvent(BI.MultiSelectList.EVENT_CHANGE); + listeners: [ + { + eventName: Searcher.EVENT_START, + action() { + self._showSearcherPane(); + self._setStartValue(""); + this.setValue(deepClone(self.storeValue)); + }, + }, + { + eventName: Searcher.EVENT_STOP, + action() { + self._showAdapter(); + self._setStartValue(""); + self.adapter.setValue(self.storeValue); + // 需要刷新回到初始界面，否则搜索的结果不能放在最前面 + self.adapter.populate(); + }, + }, + { + eventName: Searcher.EVENT_PAUSE, + action() { + self._showAdapter(); + self.fireEvent(MultiSelectList.EVENT_CHANGE); + }, }, - }, { - eventName: BI.Searcher.EVENT_SEARCHING, - action: function () { - var keywords = this.getKeyword(); - var last = BI.last(keywords); - keywords = BI.initial(keywords || []); - if (keywords.length > 0) { - self._joinKeywords(keywords, function () { - if (BI.endWith(last, BI.BlankSplitChar)) { - self.adapter.setValue(self.storeValue); + { + eventName: Searcher.EVENT_SEARCHING, + action() { + let keywords = this.getKeyword(); + const lastKeyword = last(keywords); + keywords = initial(keywords || []); + if (keywords.length > 0) { + self._joinKeywords(keywords, () => { + if (endWith(lastKeyword, BI.BlankSplitChar)) { + self.adapter.setValue(self.storeValue); + assertShowValue(); + self.adapter.populate(); + self._setStartValue(""); + } else { + self.adapter.setValue(self.storeValue); + assertShowValue(); + } + self.fireEvent(MultiSelectList.EVENT_CHANGE); + }); + } + }, + }, + { + eventName: Searcher.EVENT_CHANGE, + action(value, obj) { + if (obj instanceof MultiSelectBar) { + self._joinAll(this.getValue(), () => { assertShowValue(); - self.adapter.populate(); - self._setStartValue(""); - } else { - self.adapter.setValue(self.storeValue); + self.fireEvent(MultiSelectList.EVENT_CHANGE); + }); + } else { + self._join(this.getValue(), () => { assertShowValue(); - } - self.fireEvent(BI.MultiSelectList.EVENT_CHANGE); - }); - } - } - }, { - eventName: BI.Searcher.EVENT_CHANGE, - action: function (value, obj) { - if (obj instanceof BI.MultiSelectBar) { - self._joinAll(this.getValue(), function () { - assertShowValue(); - self.fireEvent(BI.MultiSelectList.EVENT_CHANGE); - }); - } else { - self._join(this.getValue(), function () { - assertShowValue(); - self.fireEvent(BI.MultiSelectList.EVENT_CHANGE); - }); - } + self.fireEvent(MultiSelectList.EVENT_CHANGE); + }); + } + }, } - }] + ], }); - BI.createWidget({ - type: "bi.vtape", + createWidget({ + type: VTapeLayout.xtype, element: this, - items: [{ - el: this.trigger, - height: o.searcherHeight - }, { - el: this.adapter, - height: "fill" - }] + items: [ + { + el: this.trigger, + height: o.searcherHeight, + }, + { + el: this.adapter, + height: "fill", + } + ], }); - BI.createWidget({ - type: "bi.absolute", + createWidget({ + type: AbsoluteLayout.xtype, element: this, - items: [{ - el: this.searcherPane, - top: o.searcherHeight, - bottom: 0, - left: 0, - right: 0 - }] + items: [ + { + el: this.searcherPane, + top: o.searcherHeight, + bottom: 0, + left: 0, + right: 0, + } + ], }); - }, + } - _getKeywords: function () { - var val = this.editor.getValue(); - var keywords = val.split(/\u200b\s\u200b/); - if (BI.isEmptyString(keywords[keywords.length - 1])) { + _getKeywords() { + const val = this.editor.getValue(); + let keywords = val.split(/\u200b\s\u200b/); + if (isEmptyString(keywords[keywords.length - 1])) { keywords = keywords.slice(0, keywords.length - 1); } if (/\u200b\s\u200b$/.test(val)) { @@ -179,193 +235,209 @@ BI.MultiSelectList = BI.inherit(BI.Widget, { } return keywords; - }, + } - _showAdapter: function () { + _showAdapter() { this.adapter.setVisible(true); this.searcherPane.setVisible(false); - }, + } - _showSearcherPane: function () { + _showSearcherPane() { this.searcherPane.setVisible(true); this.adapter.setVisible(false); - }, + } - _defaultState: function () { + _defaultState() { this.trigger.stopEditing(); - }, + } - _assertValue: function (val) { + _assertValue(val) { val || (val = {}); - val.type || (val.type = BI.Selection.Multi); + val.type || (val.type = Selection.Multi); val.value || (val.value = []); + return val; - }, + } - _makeMap: function (values) { - return BI.makeObject(values || []); - }, + _makeMap(values) { + return makeObject(values || []); + } - _joinKeywords: function (keywords, callback) { - var self = this, o = this.options; + _joinKeywords(keywords, callback) { + const self = this, + o = this.options; this._assertValue(this.storeValue); // 和复选下拉框同步，allData做缓存是会爆炸的 - o.itemsCreator({ - type: BI.MultiSelectList.REQ_GET_ALL_DATA, - keywords: keywords - }, function (ob) { - var values = BI.map(ob.items, "value"); - digest(values); - }); + o.itemsCreator( + { + type: MultiSelectList.REQ_GET_ALL_DATA, + keywords, + }, + ob => { + const values = map(ob.items, "value"); + digest(values); + } + ); function digest(items) { - var selectedMap = self._makeMap(items); - BI.each(keywords, function (i, val) { - if (BI.isNotNull(selectedMap[val])) { - self.storeValue.type === BI.Selection.Multi ? BI.pushDistinct(self.storeValue.value, val) : BI.remove(self.storeValue.value, val); + const selectedMap = self._makeMap(items); + each(keywords, (i, val) => { + if (isNotNull(selectedMap[val])) { + self.storeValue.type === Selection.Multi + ? pushDistinct(self.storeValue.value, val) + : remove(self.storeValue.value, val); } }); self._adjust(callback); } - }, + } - _joinAll: function (res, callback) { - var self = this, o = this.options; + _joinAll(res, callback) { + const self = this, + o = this.options; this._assertValue(res); if (this.storeValue.type === res.type) { - var result = BI.Func.getSearchResult(BI.map(this.storeValue.value, function (_i, v) { - return { - text: o.valueFormatter(v) || v, - value: v - }; - }), this.trigger.getKeyword()); - var change = false; - var map = this._makeMap(this.storeValue.value); - BI.each(BI.concat(result.match, result.find), function (i, obj) { - var v = obj.value; - if (BI.isNotNull(map[v])) { + const result = Func.getSearchResult( + map(this.storeValue.value, (_i, v) => { + return { + text: o.valueFormatter(v) || v, + value: v, + }; + }), + this.trigger.getKeyword() + ); + let change = false; + const tempMap = this._makeMap(this.storeValue.value); + each(concat(result.match, result.find), (i, obj) => { + const v = obj.value; + if (isNotNull(tempMap[v])) { change = true; - delete map[v]; + delete tempMap[v]; } }); - change && (this.storeValue.value = BI.values(map)); + change && (this.storeValue.value = values(tempMap)); this._adjust(callback); + return; } - o.itemsCreator({ - type: BI.MultiSelectList.REQ_GET_ALL_DATA, - keywords: [this.trigger.getKeyword()], - selectedValues: BI.filter(this.storeValue.value, function (_i, v) { - return !BI.contains(res.value, v); - }), - }, function (ob) { - var items = BI.map(ob.items, "value"); - var selectedMap = self._makeMap(self.storeValue.value); - var notSelectedMap = self._makeMap(res.value); - var newItems = []; - BI.each(items, function (i, item) { - if (BI.isNotNull(selectedMap[items[i]])) { - delete selectedMap[items[i]]; - } - if (BI.isNull(notSelectedMap[items[i]])) { - newItems.push(item); - } - }); - self.storeValue.value = newItems.concat(BI.values(selectedMap)); - self._adjust(callback); - }); - }, + o.itemsCreator( + { + type: MultiSelectList.REQ_GET_ALL_DATA, + keywords: [this.trigger.getKeyword()], + selectedValues: filter(this.storeValue.value, (_i, v) => !contains(res.value, v)), + }, + ob => { + const items = map(ob.items, "value"); + const selectedMap = self._makeMap(self.storeValue.value); + const notSelectedMap = self._makeMap(res.value); + const newItems = []; + each(items, (i, item) => { + if (isNotNull(selectedMap[items[i]])) { + delete selectedMap[items[i]]; + } + if (isNull(notSelectedMap[items[i]])) { + newItems.push(item); + } + }); + self.storeValue.value = newItems.concat(values(selectedMap)); + self._adjust(callback); + } + ); + } - _adjust: function (callback) { - var self = this, o = this.options; + _adjust(callback) { + const self = this, + o = this.options; if (!this._count) { - o.itemsCreator({ - type: BI.MultiSelectList.REQ_GET_DATA_LENGTH - }, function (res) { - self._count = res.count; - adjust(); - callback(); - }); + o.itemsCreator( + { + type: MultiSelectList.REQ_GET_DATA_LENGTH, + }, + res => { + self._count = res.count; + adjust(); + callback(); + } + ); } else { adjust(); callback(); } function adjust() { - if (self.storeValue.type === BI.Selection.All && self.storeValue.value.length >= self._count) { + if ( + self.storeValue.type === Selection.All && + self.storeValue.value.length >= self._count + ) { self.storeValue = { - type: BI.Selection.Multi, - value: [] + type: Selection.Multi, + value: [], }; - } else if (self.storeValue.type === BI.Selection.Multi && self.storeValue.value.length >= self._count) { + } else if ( + self.storeValue.type === Selection.Multi && + self.storeValue.value.length >= self._count + ) { self.storeValue = { - type: BI.Selection.All, - value: [] + type: Selection.All, + value: [], }; } } - }, + } - _join: function (res, callback) { - var self = this, o = this.options; + _join(res, callback) { + const self = this; this._assertValue(res); this._assertValue(this.storeValue); if (this.storeValue.type === res.type) { - var map = this._makeMap(this.storeValue.value); - BI.each(res.value, function (i, v) { + const map = this._makeMap(this.storeValue.value); + each(res.value, (i, v) => { if (!map[v]) { - BI.pushDistinct(self.storeValue.value, v); + pushDistinct(self.storeValue.value, v); map[v] = v; } }); - var change = false; - BI.each(res.assist, function (i, v) { - if (BI.isNotNull(map[v])) { + let change = false; + each(res.assist, (i, v) => { + if (isNotNull(map[v])) { change = true; delete map[v]; } }); - change && (this.storeValue.value = BI.values(map)); + change && (this.storeValue.value = values(map)); self._adjust(callback); + return; } this._joinAll(res, callback); - }, + } - _setStartValue: function (value) { + _setStartValue(value) { this._startValue = value; this.adapter.setStartValue(value); - }, + } - isAllSelected: function () { + isAllSelected() { return this.adapter.isAllSelected(); - }, + } - resize: function () { - // this.trigger.getCounter().adjustView(); - // this.trigger.adjustView(); - }, - setValue: function (v) { + resize() { + + } + + setValue(v) { this.storeValue = v || {}; this._assertValue(this.storeValue); this.adapter.setValue(this.storeValue); this.trigger.setValue(this.storeValue); - }, - - getValue: function () { - return BI.deepClone(this.storeValue); - }, - - populate: function () { - this.adapter.populate.apply(this.adapter, arguments); - this.trigger.populate.apply(this.trigger, arguments); } -}); -BI.extend(BI.MultiSelectList, { - REQ_GET_DATA_LENGTH: 1, - REQ_GET_ALL_DATA: -1 -}); + getValue() { + return deepClone(this.storeValue); + } -BI.MultiSelectList.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.multi_select_list", BI.MultiSelectList); + populate() { + this.adapter.populate(...arguments); + this.trigger.populate(...arguments); + } +} diff --git a/src/widget/numbereditor/number.editor.js b/src/widget/numbereditor/number.editor.js index 13f360baa..6e89f07df 100644 --- a/src/widget/numbereditor/number.editor.js +++ b/src/widget/numbereditor/number.editor.js @@ -1,202 +1,204 @@ -/** - * Created by windy on 2017/3/13. - * 数值微调器 - */ -BI.NumberEditor = BI.inherit(BI.Widget, { - _defaultConfig: function (conf) { - return BI.extend(BI.NumberEditor.superclass._defaultConfig.apply(this, arguments), { - baseCls: "bi-number-editor bi-focus-shadow " + (conf.simple ? "bi-border-bottom" : "bi-border bi-border-radius"), - validationChecker: BI.emptyFn, - valueFormatter: function (v) { +import { shortcut, Widget, extend, emptyFn, createWidget, toPix, parseFloat, HTapeLayout, GridLayout, isNumeric, clamp, MIN, MAX, KeyCode, add } from "@/core"; +import { SignEditor } from "@/case"; +import { TextEditor } from "../editor"; +import { IconButton } from "@/base"; + +@shortcut() +export class NumberEditor extends Widget { + static xtype = "bi.number_editor" + + static EVENT_CONFIRM = "EVENT_CONFIRM" + static EVENT_CHANGE = "EVENT_CHANGE" + + _defaultConfig(conf) { + return extend(super._defaultConfig(...arguments), { + baseCls: `bi-number-editor bi-focus-shadow ${conf.simple ? "bi-border-bottom" : "bi-border bi-border-radius"}`, + validationChecker: emptyFn, + valueFormatter (v) { return v; }, - valueParser: function (v) { + valueParser (v) { return v; }, value: 0, allowBlank: false, errorText: "", step: 1, - min: BI.MIN, - max: BI.MAX, + min: MIN, + max: MAX, watermark: "", }); - }, - - _init: function () { - BI.NumberEditor.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.editor = BI.createWidget({ - type: "bi.sign_editor", - height: BI.toPix(o.height, 2), + } + + _init() { + super._init(...arguments); + const o = this.options; + this.editor = createWidget({ + type: SignEditor.xtype, + height: toPix(o.height, 2), simple: o.simple, allowBlank: o.allowBlank, watermark: o.watermark, value: o.valueFormatter(o.value), - validationChecker: function (v) { + validationChecker: v => { // 不设置validationChecker就自动检测 - var parsedValue = o.valueParser(v); - if (o.validationChecker === BI.emptyFn && !self._checkValueInRange(parsedValue)) { + const parsedValue = o.valueParser(v); + if (o.validationChecker === emptyFn && !this._checkValueInRange(parsedValue)) { return false; } return o.validationChecker(parsedValue); }, errorText: o.errorText, - listeners: [ - { - eventName: BI.SignEditor.EVENT_QUICK_DOWN, - action: e => { - if ([BI.KeyCode.UP, BI.KeyCode.DOWN].includes(e.keyCode)) { - e.preventDefault(); - } - }, + listeners: [{ + eventName: SignEditor.EVENT_QUICK_DOWN, + action: e => { + if ([KeyCode.UP, KeyCode.DOWN].includes(e.keyCode)) { + e.preventDefault(); + } }, - { - eventName: BI.SignEditor.EVENT_KEY_DOWN, - action: (keycode) => { - if (keycode === BI.KeyCode.UP) { - this._finetuning(o.step); - - return; - } - if (keycode === BI.KeyCode.DOWN) { - this._finetuning(-o.step); - } - }, - } + }, + { + eventName: SignEditor.EVENT_KEY_DOWN, + action: keycode => { + if (keycode === KeyCode.UP) { + this._finetuning(o.step); + + return; + } + if (keycode === KeyCode.DOWN) { + this._finetuning(-o.step); + } + }, + } ], }); - this.editor.on(BI.TextEditor.EVENT_CHANGE, function () { + this.editor.on(TextEditor.EVENT_CHANGE, () => { // 大多数时候valueFormatter往往需要配合valueParser一起使用 - var value = this.getValue(); - var parsedValue = o.valueParser(value); - this.setValue(o.valueFormatter(parsedValue)); - self.fireEvent(BI.NumberEditor.EVENT_CHANGE); + const value = this.editor.getValue(); + const parsedValue = o.valueParser(value); + this.editor.setValue(o.valueFormatter(parsedValue)); + this.fireEvent(NumberEditor.EVENT_CHANGE); }); - this.editor.on(BI.TextEditor.EVENT_ERROR, function () { - o.value = BI.parseFloat(this.getLastValidValue()); - self._checkAdjustDisabled(o.value); - self.element.addClass("error"); + this.editor.on(TextEditor.EVENT_ERROR, () => { + o.value = parseFloat(this.editor.getLastValidValue()); + this._checkAdjustDisabled(o.value); + this.element.addClass("error"); }); - this.editor.on(BI.TextEditor.EVENT_VALID, function () { - o.value = BI.parseFloat(this.getValue()); - self._checkAdjustDisabled(o.value); - self.element.removeClass("error"); + this.editor.on(TextEditor.EVENT_VALID, () => { + o.value = parseFloat(this.editor.getValue()); + this._checkAdjustDisabled(o.value); + this.element.removeClass("error"); }); - this.editor.on(BI.TextEditor.EVENT_CONFIRM, function () { - self.fireEvent(BI.NumberEditor.EVENT_CONFIRM); + this.editor.on(TextEditor.EVENT_CONFIRM, () => { + this.fireEvent(NumberEditor.EVENT_CONFIRM); }); - this.topBtn = BI.createWidget({ - type: "bi.icon_button", + this.topBtn = createWidget({ + type: IconButton.xtype, forceNotSelected: true, trigger: "lclick,", debounce: false, - cls: (o.simple ? "solid-triangle-top-font " : "add-up-font bi-border-left ") + "top-button bi-list-item-active2 icon-size-12", + cls: `${o.simple ? "solid-triangle-top-font " : "add-up-font bi-border-left "}top-button bi-list-item-active2 icon-size-12`, }); - this.topBtn.on(BI.IconButton.EVENT_CHANGE, function () { - self._finetuning(o.step); - self.fireEvent(BI.NumberEditor.EVENT_CHANGE); - self.fireEvent(BI.NumberEditor.EVENT_CONFIRM); + this.topBtn.on(IconButton.EVENT_CHANGE, () => { + this._finetuning(o.step); + this.fireEvent(NumberEditor.EVENT_CHANGE); + this.fireEvent(NumberEditor.EVENT_CONFIRM); }); - this.bottomBtn = BI.createWidget({ - type: "bi.icon_button", + this.bottomBtn = createWidget({ + type: IconButton.xtype, trigger: "lclick,", forceNotSelected: true, debounce: false, - cls: (o.simple ? "solid-triangle-bottom-font " : "minus-down-font bi-border-left ") + "bottom-button bi-list-item-active2 icon-size-12", + cls: `${o.simple ? "solid-triangle-bottom-font " : "minus-down-font bi-border-left "}bottom-button bi-list-item-active2 icon-size-12`, }); - this.bottomBtn.on(BI.IconButton.EVENT_CHANGE, function () { - self._finetuning(-o.step); - self.fireEvent(BI.NumberEditor.EVENT_CHANGE); - self.fireEvent(BI.NumberEditor.EVENT_CONFIRM); + this.bottomBtn.on(IconButton.EVENT_CHANGE, () => { + this._finetuning(-o.step); + this.fireEvent(NumberEditor.EVENT_CHANGE); + this.fireEvent(NumberEditor.EVENT_CONFIRM); }); - BI.createWidget({ - type: "bi.htape", - height: BI.toPix(o.height, 2), + createWidget({ + type: HTapeLayout.xtype, + height: toPix(o.height, 2), element: this, items: [ this.editor, { el: { - type: "bi.grid", + type: GridLayout.xtype, columns: 1, rows: 2, - items: [ - { - column: 0, - row: 0, - el: this.topBtn, - }, { - column: 0, - row: 1, - el: this.bottomBtn, - } - ], + items: [{ + column: 0, + row: 0, + el: this.topBtn, + }, { + column: 0, + row: 1, + el: this.bottomBtn, + }], }, width: 23, } ], }); - }, + } - focus: function () { + focus() { this.editor.focus(); - }, + } - isEditing: function () { + isEditing() { return this.editor.isEditing(); - }, + } - _checkValueInRange: function (v) { - var o = this.options; + _checkValueInRange(v) { + const o = this.options; - return !!(BI.isNumeric(v) && BI.parseFloat(v) >= o.min && BI.parseFloat(v) <= o.max); - }, + return !!(isNumeric(v) && parseFloat(v) >= o.min && parseFloat(v) <= o.max); + } - _checkAdjustDisabled: function (v) { - if (this.options.validationChecker === BI.emptyFn) { - this.bottomBtn.setEnable(BI.parseFloat(v) > this.options.min); - this.topBtn.setEnable(BI.parseFloat(v) < this.options.max); + _checkAdjustDisabled(v) { + if (this.options.validationChecker === emptyFn) { + this.bottomBtn.setEnable(parseFloat(v) > this.options.min); + this.topBtn.setEnable(parseFloat(v) < this.options.max); } - }, - - // 微调 - _finetuning: function (add) { - const { max, min } = this.options; - let v = BI.parseFloat(this.getValue()); - v = BI.add(v, add); - v = BI.clamp(v, min, max); + } + + _finetuning(addValue) { + const { + max, + min, + } = this.options; + let v = parseFloat(this.getValue()); + v = add(v, addValue); + v = clamp(v, min, max); this.setValue(v); - }, + } - setUpEnable: function (v) { + setUpEnable(v) { this.topBtn.setEnable(!!v); - }, + } - setDownEnable: function (v) { + setDownEnable(v) { this.bottomBtn.setEnable(!!v); - }, + } - getLastValidValue: function () { + getLastValidValue() { return this.editor.getLastValidValue(); - }, + } - getLastChangedValue: function () { + getLastChangedValue() { return this.editor.getLastChangedValue(); - }, + } - getValue: function () { + getValue() { return this.options.value; - }, + } - setValue: function (v) { - var o = this.options; + setValue(v) { + const o = this.options; o.value = v; this.editor.setValue(o.valueFormatter(v)); this._checkAdjustDisabled(o.value); - }, - -}); -BI.NumberEditor.EVENT_CONFIRM = "EVENT_CONFIRM"; -BI.NumberEditor.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.number_editor", BI.NumberEditor); + } +} diff --git a/src/widget/numberinterval/numberinterval.js b/src/widget/numberinterval/numberinterval.js index 0c3c488bd..ae0a22ae9 100644 --- a/src/widget/numberinterval/numberinterval.js +++ b/src/widget/numberinterval/numberinterval.js @@ -1,11 +1,13 @@ -// 小于号的值为：0，小于等于号的值为:1 -// closeMIn：最小值的符号，closeMax：最大值的符号 -/** - * Created by roy on 15/9/17. - * - */ -BI.NumberInterval = BI.inherit(BI.Single, { - constants: { +import { shortcut, extend, i18nText, createWidget, toPix, isNumeric, AbsoluteLayout, isEmptyString, isNotNull, isNull, isIE, getIEVersion } from "@/core"; +import { Single, Label, Bubbles } from "@/base"; +import { IconCombo } from "@/case"; +import { NumberIntervalSingleEidtor } from "./singleeditor/single.editor"; + +@shortcut() +export class NumberInterval extends Single { + static xtype = "bi.number_interval" + + constants = { typeError: "typeBubble", numberError: "numberBubble", signalError: "signalBubble", @@ -18,160 +20,174 @@ BI.NumberInterval = BI.inherit(BI.Single, { less: 0, less_equal: 1, numTip: "", - adjustYOffset: 2 - }, - _defaultConfig: function () { - var conf = BI.NumberInterval.superclass._defaultConfig.apply(this, arguments); - return BI.extend(conf, { - extraCls: "bi-number-interval" + ((BI.isIE() && BI.getIEVersion() < 10) ? " hack" : ""), + adjustYOffset: 2, + }; + + static EVENT_CHANGE = "EVENT_CHANGE" + static EVENT_CONFIRM = "EVENT_CONFIRM" + static EVENT_VALID = "EVENT_VALID" + static EVENT_ERROR = "EVENT_ERROR" + + _defaultConfig() { + const conf = super._defaultConfig(...arguments); + + return extend(conf, { + extraCls: `bi-number-interval${(isIE() && getIEVersion() < 10) ? " hack" : ""}`, height: 24, validation: "valid", closeMin: true, allowBlank: true, - watermark: BI.i18nText("BI-Basic_Unrestricted") + watermark: i18nText("BI-Basic_Unrestricted"), }); - }, - _init: function () { - var self = this, c = this.constants, o = this.options; - BI.NumberInterval.superclass._init.apply(this, arguments); - this.smallEditor = BI.createWidget({ + } + + _init() { + const self = this, + c = this.constants, + o = this.options; + super._init(...arguments); + this.smallEditor = createWidget({ type: "bi.number_interval_single_editor", - height: BI.toPix(o.height, o.simple ? 1 : 2), + height: toPix(o.height, o.simple ? 1 : 2), watermark: o.watermark, allowBlank: o.allowBlank, value: o.min, level: "warning", tipType: "success", - title: function () { + title () { return self.smallEditor && self.smallEditor.getValue(); }, - quitChecker: function () { + quitChecker () { return false; }, - validationChecker: function (v) { - if (!BI.isNumeric(v)) { + validationChecker (v) { + if (!isNumeric(v)) { self.smallEditorBubbleType = c.typeError; + return false; } + return true; }, - cls: "number-interval-small-editor bi-focus-shadow " + (o.simple ? "bi-border-bottom" : "bi-border bi-border-corner-left-radius") + cls: `number-interval-small-editor bi-focus-shadow ${o.simple ? "bi-border-bottom" : "bi-border bi-border-corner-left-radius"}`, }); - this.smallTip = BI.createWidget({ - type: "bi.label", + this.smallTip = createWidget({ + type: Label.xtype, text: o.numTip, - height: BI.toPix(o.height, o.simple ? 1 : 2), - invisible: true + height: toPix(o.height, o.simple ? 1 : 2), + invisible: true, }); - BI.createWidget({ - type: "bi.absolute", + createWidget({ + type: AbsoluteLayout.xtype, element: this.smallEditor, items: [{ el: this.smallTip, top: 0, - right: 5 - }] + right: 5, + }], }); - this.bigEditor = BI.createWidget({ + this.bigEditor = createWidget({ type: "bi.number_interval_single_editor", - height: BI.toPix(o.height, o.simple ? 1 : 2), + height: toPix(o.height, o.simple ? 1 : 2), watermark: o.watermark, allowBlank: o.allowBlank, value: o.max, - title: function () { + title () { return self.bigEditor && self.bigEditor.getValue(); }, - quitChecker: function () { + quitChecker () { return false; }, - validationChecker: function (v) { - if (!BI.isNumeric(v)) { + validationChecker (v) { + if (!isNumeric(v)) { self.bigEditorBubbleType = c.typeError; + return false; } + return true; }, - cls: "number-interval-big-editor bi-focus-shadow" + (o.simple ? " bi-border-bottom" : " bi-border bi-border-corner-right-radius") + cls: `number-interval-big-editor bi-focus-shadow${o.simple ? " bi-border-bottom" : " bi-border bi-border-corner-right-radius"}`, }); - this.bigTip = BI.createWidget({ - type: "bi.label", + this.bigTip = createWidget({ + type: Label.xtype, text: o.numTip, - height: BI.toPix(o.height, o.simple ? 1 : 2), - invisible: true + height: toPix(o.height, o.simple ? 1 : 2), + invisible: true, }); - BI.createWidget({ - type: "bi.absolute", + createWidget({ + type: AbsoluteLayout.xtype, element: this.bigEditor, items: [{ el: this.bigTip, top: 0, - right: 5 - }] + right: 5, + }], }); - this.smallCombo = BI.createWidget({ - type: "bi.icon_combo", - cls: "number-interval-small-combo" + (o.simple ? "" : " bi-border-top bi-border-bottom bi-border-right bi-border-corner-right-radius"), - height: BI.toPix(o.height, o.simple ? 0 : 2), - width: BI.toPix(c.width, c.border), + this.smallCombo = createWidget({ + type: IconCombo.xtype, + cls: `number-interval-small-combo${o.simple ? "" : " bi-border-top bi-border-bottom bi-border-right bi-border-corner-right-radius"}`, + height: toPix(o.height, o.simple ? 0 : 2), + width: toPix(c.width, c.border), items: [{ - text: "(" + BI.i18nText("BI-Less_Than") + ")", + text: `(${i18nText("BI-Less_Than")})`, iconCls: "less-font", - value: 0 + value: 0, }, { - text: "(" + BI.i18nText("BI-Less_And_Equal") + ")", + text: `(${i18nText("BI-Less_And_Equal")})`, value: 1, - iconCls: "less-equal-font" - }] + iconCls: "less-equal-font", + }], }); if (o.closeMin === true) { this.smallCombo.setValue(1); } else { this.smallCombo.setValue(0); } - this.bigCombo = BI.createWidget({ - type: "bi.icon_combo", - cls: "number-interval-big-combo" + (o.simple ? "" : " bi-border-top bi-border-bottom bi-border-left bi-border-corner-left-radius"), - height: BI.toPix(o.height, o.simple ? 0 : 2), - width: BI.toPix(c.width, c.border), + this.bigCombo = createWidget({ + type: IconCombo.xtype, + cls: `number-interval-big-combo${o.simple ? "" : " bi-border-top bi-border-bottom bi-border-left bi-border-corner-left-radius"}`, + height: toPix(o.height, o.simple ? 0 : 2), + width: toPix(c.width, c.border), items: [{ - text: "(" + BI.i18nText("BI-Less_Than") + ")", + text: `(${i18nText("BI-Less_Than")})`, iconCls: "less-font", - value: 0 + value: 0, }, { - text: "(" + BI.i18nText("BI-Less_And_Equal") + ")", + text: `(${i18nText("BI-Less_And_Equal")})`, value: 1, - iconCls: "less-equal-font" - }] + iconCls: "less-equal-font", + }], }); if (o.closeMax === true) { this.bigCombo.setValue(1); } else { this.bigCombo.setValue(0); } - this.label = BI.createWidget({ - type: "bi.label", - text: BI.i18nText("BI-Basic_Value"), + this.label = createWidget({ + type: Label.xtype, + text: i18nText("BI-Basic_Value"), textHeight: o.height, - // width: BI.toPix(o.width, o.simple ? 0 : c.border * 2), + // width: toPix(o.width, o.simple ? 0 : c.border * 2), hgap: 5, height: o.height, level: "warning", - tipType: "warning" + tipType: "warning", }); - this.left = BI.createWidget({ + this.left = createWidget({ type: "bi.horizontal_fill", columnSize: ["fill", ""], items: [{ - el: self.smallEditor + el: self.smallEditor, }, { el: self.smallCombo, - }] + }], }); - this.right = BI.createWidget({ + this.right = createWidget({ type: "bi.horizontal_fill", columnSize: ["", "fill"], items: [{ @@ -180,38 +196,38 @@ BI.NumberInterval = BI.inherit(BI.Single, { el: self.bigEditor, // BI-23883 间距考虑边框 // lgap: 1 - }] + }], }); - BI.createWidget({ + createWidget({ element: self, type: "bi.horizontal_fill", columnSize: ["fill", "", "fill"], items: [{ - el: self.left + el: self.left, }, { - el: self.label + el: self.label, }, { - el: self.right - }] + el: self.right, + }], }); - // BI.createWidget({ + // createWidget({ // element: self, - // type: "bi.horizontal_auto", + // type: HorizontalAutoLayout.xtype, // items: [ // self.label // ] // }); - // BI.createWidget({ + // createWidget({ // element: self, - // type: "bi.center", + // type: CenterLayout.xtype, // hgap: 15, // height: o.height, // items: [ // { - // type: "bi.absolute", + // type: AbsoluteLayout.xtype, // items: [{ // el: self.left, // left: -15, @@ -220,7 +236,7 @@ BI.NumberInterval = BI.inherit(BI.Single, { // bottom: 0 // }] // }, { - // type: "bi.absolute", + // type: AbsoluteLayout.xtype, // items: [{ // el: self.right, // left: 0, @@ -246,264 +262,274 @@ BI.NumberInterval = BI.inherit(BI.Single, { self._setEditorValueChangedEvent(self.smallEditor); self._checkValidation(); - }, + } - _checkValidation: function () { - var self = this, c = this.constants, o = this.options; + _checkValidation() { + const self = this, + c = this.constants, + o = this.options; self._setTitle(""); - BI.Bubbles.hide(c.typeError); - BI.Bubbles.hide(c.numberError); - BI.Bubbles.hide(c.signalError); + Bubbles.hide(c.typeError); + Bubbles.hide(c.numberError); + Bubbles.hide(c.signalError); if (!self.smallEditor.isValid() || !self.bigEditor.isValid()) { self.element.removeClass("number-error"); o.validation = "invalid"; + return c.typeError; } - if (BI.isEmptyString(self.smallEditor.getValue()) || BI.isEmptyString(self.bigEditor.getValue())) { + if (isEmptyString(self.smallEditor.getValue()) || isEmptyString(self.bigEditor.getValue())) { self.element.removeClass("number-error"); o.validation = "valid"; + return ""; } - var smallValue = parseFloat(self.smallEditor.getValue()), bigValue = parseFloat(self.bigEditor.getValue()), - bigComboValue = self.bigCombo.getValue(), smallComboValue = self.smallCombo.getValue(); + const smallValue = parseFloat(self.smallEditor.getValue()), + bigValue = parseFloat(self.bigEditor.getValue()), + bigComboValue = self.bigCombo.getValue(), + smallComboValue = self.smallCombo.getValue(); if (bigComboValue[0] === c.less_equal && smallComboValue[0] === c.less_equal) { if (smallValue > bigValue) { self.element.addClass("number-error"); o.validation = "invalid"; + return c.numberError; } self.element.removeClass("number-error"); o.validation = "valid"; + return ""; - } if (smallValue > bigValue) { self.element.addClass("number-error"); o.validation = "invalid"; + return c.numberError; } else if (smallValue === bigValue) { self.element.addClass("number-error"); o.validation = "invalid"; + return c.signalError; } self.element.removeClass("number-error"); o.validation = "valid"; + return ""; + } - - - - - }, - - _setTitle: function (v) { + _setTitle(v) { this.label.setTitle(v); - }, + } - _setFocusEvent: function (w) { - var self = this, c = this.constants; - w.on(BI.NumberIntervalSingleEidtor.EVENT_FOCUS, function () { + _setFocusEvent(w) { + const self = this, + c = this.constants; + w.on(NumberIntervalSingleEidtor.EVENT_FOCUS, () => { self._setTitle(""); switch (self._checkValidation()) { - case c.typeError: - BI.Bubbles.show(c.typeError, BI.i18nText("BI-Numerical_Interval_Input_Data"), self, { - offsetStyle: "left", - adjustYOffset: c.adjustYOffset - }); - break; - case c.numberError: - BI.Bubbles.show(c.numberError, BI.i18nText("BI-Numerical_Interval_Number_Value"), self, { - offsetStyle: "left", - adjustYOffset: c.adjustYOffset - }); - break; - case c.signalError: - BI.Bubbles.show(c.signalError, BI.i18nText("BI-Numerical_Interval_Signal_Value"), self, { - offsetStyle: "left", - adjustYOffset: c.adjustYOffset - }); - break; - default : - return; + case c.typeError: + Bubbles.show(c.typeError, i18nText("BI-Numerical_Interval_Input_Data"), self, { + offsetStyle: "left", + adjustYOffset: c.adjustYOffset, + }); + break; + case c.numberError: + Bubbles.show(c.numberError, i18nText("BI-Numerical_Interval_Number_Value"), self, { + offsetStyle: "left", + adjustYOffset: c.adjustYOffset, + }); + break; + case c.signalError: + Bubbles.show(c.signalError, i18nText("BI-Numerical_Interval_Signal_Value"), self, { + offsetStyle: "left", + adjustYOffset: c.adjustYOffset, + }); + break; + default: + return; } - }); - }, - _setBlurEvent: function (w) { - var c = this.constants, self = this; - w.on(BI.NumberIntervalSingleEidtor.EVENT_BLUR, function () { - BI.Bubbles.hide(c.typeError); - BI.Bubbles.hide(c.numberError); - BI.Bubbles.hide(c.signalError); + } + + _setBlurEvent(w) { + const c = this.constants, + self = this; + w.on(NumberIntervalSingleEidtor.EVENT_BLUR, () => { + Bubbles.hide(c.typeError); + Bubbles.hide(c.numberError); + Bubbles.hide(c.signalError); switch (self._checkValidation()) { - case c.typeError: - self._setTitle(BI.i18nText("BI-Numerical_Interval_Input_Data")); - break; - case c.numberError: - self._setTitle(BI.i18nText("BI-Numerical_Interval_Number_Value")); - break; - case c.signalError: - self._setTitle(BI.i18nText("BI-Numerical_Interval_Signal_Value")); - break; - default: - self._setTitle(""); + case c.typeError: + self._setTitle(i18nText("BI-Numerical_Interval_Input_Data")); + break; + case c.numberError: + self._setTitle(i18nText("BI-Numerical_Interval_Number_Value")); + break; + case c.signalError: + self._setTitle(i18nText("BI-Numerical_Interval_Signal_Value")); + break; + default: + self._setTitle(""); } }); - }, + } - _setErrorEvent: function (w) { - var c = this.constants, self = this; - w.on(BI.NumberIntervalSingleEidtor.EVENT_ERROR, function () { + _setErrorEvent(w) { + const c = this.constants, + self = this; + w.on(NumberIntervalSingleEidtor.EVENT_ERROR, () => { self._checkValidation(); - BI.Bubbles.show(c.typeError, BI.i18nText("BI-Numerical_Interval_Input_Data"), self, { + Bubbles.show(c.typeError, i18nText("BI-Numerical_Interval_Input_Data"), self, { offsetStyle: "left", - adjustYOffset: c.adjustYOffset + adjustYOffset: c.adjustYOffset, }); - self.fireEvent(BI.NumberInterval.EVENT_ERROR); + self.fireEvent(NumberInterval.EVENT_ERROR); }); - }, - + } - _setValidEvent: function (w) { - var self = this, c = this.constants; - w.on(BI.NumberIntervalSingleEidtor.EVENT_VALID, function () { + _setValidEvent(w) { + const self = this, + c = this.constants; + w.on(NumberIntervalSingleEidtor.EVENT_VALID, () => { switch (self._checkValidation()) { - case c.numberError: - BI.Bubbles.show(c.numberError, BI.i18nText("BI-Numerical_Interval_Number_Value"), self, { - offsetStyle: "left", - adjustYOffset: c.adjustYOffset - }); - self.fireEvent(BI.NumberInterval.EVENT_ERROR); - break; - case c.signalError: - BI.Bubbles.show(c.signalError, BI.i18nText("BI-Numerical_Interval_Signal_Value"), self, { - offsetStyle: "left", - adjustYOffset: c.adjustYOffset - }); - self.fireEvent(BI.NumberInterval.EVENT_ERROR); - break; - default: - self.fireEvent(BI.NumberInterval.EVENT_VALID); + case c.numberError: + Bubbles.show(c.numberError, i18nText("BI-Numerical_Interval_Number_Value"), self, { + offsetStyle: "left", + adjustYOffset: c.adjustYOffset, + }); + self.fireEvent(NumberInterval.EVENT_ERROR); + break; + case c.signalError: + Bubbles.show(c.signalError, i18nText("BI-Numerical_Interval_Signal_Value"), self, { + offsetStyle: "left", + adjustYOffset: c.adjustYOffset, + }); + self.fireEvent(NumberInterval.EVENT_ERROR); + break; + default: + self.fireEvent(NumberInterval.EVENT_VALID); } }); - }, - + } - _setEditorValueChangedEvent: function (w) { - var self = this, c = this.constants; - w.on(BI.NumberIntervalSingleEidtor.EVENT_CHANGE, function () { + _setEditorValueChangedEvent(w) { + const self = this, + c = this.constants; + w.on(NumberIntervalSingleEidtor.EVENT_CHANGE, () => { switch (self._checkValidation()) { - case c.typeError: - BI.Bubbles.show(c.typeError, BI.i18nText("BI-Numerical_Interval_Input_Data"), self, { - offsetStyle: "left", - adjustYOffset: c.adjustYOffset - }); - break; - case c.numberError: - BI.Bubbles.show(c.numberError, BI.i18nText("BI-Numerical_Interval_Number_Value"), self, { - offsetStyle: "left", - adjustYOffset: c.adjustYOffset - }); - break; - case c.signalError: - BI.Bubbles.show(c.signalError, BI.i18nText("BI-Numerical_Interval_Signal_Value"), self, { - offsetStyle: "left", - adjustYOffset: c.adjustYOffset - }); - break; - default : - break; + case c.typeError: + Bubbles.show(c.typeError, i18nText("BI-Numerical_Interval_Input_Data"), self, { + offsetStyle: "left", + adjustYOffset: c.adjustYOffset, + }); + break; + case c.numberError: + Bubbles.show(c.numberError, i18nText("BI-Numerical_Interval_Number_Value"), self, { + offsetStyle: "left", + adjustYOffset: c.adjustYOffset, + }); + break; + case c.signalError: + Bubbles.show(c.signalError, i18nText("BI-Numerical_Interval_Signal_Value"), self, { + offsetStyle: "left", + adjustYOffset: c.adjustYOffset, + }); + break; + default: + break; } - self.fireEvent(BI.NumberInterval.EVENT_CHANGE); + self.fireEvent(NumberInterval.EVENT_CHANGE); }); - w.on(BI.NumberIntervalSingleEidtor.EVENT_CONFIRM, function () { - self.fireEvent(BI.NumberInterval.EVENT_CONFIRM); + w.on(NumberIntervalSingleEidtor.EVENT_CONFIRM, () => { + self.fireEvent(NumberInterval.EVENT_CONFIRM); }); - }, + } - _setComboValueChangedEvent: function (w) { - var self = this, c = this.constants; - w.on(BI.IconCombo.EVENT_CHANGE, function () { + _setComboValueChangedEvent(w) { + const self = this, + c = this.constants; + w.on(IconCombo.EVENT_CHANGE, () => { switch (self._checkValidation()) { - case c.typeError: - self._setTitle(BI.i18nText("BI-Numerical_Interval_Input_Data")); - self.fireEvent(BI.NumberInterval.EVENT_ERROR); - break; - case c.numberError: - self._setTitle(BI.i18nText("BI-Numerical_Interval_Number_Value")); - self.fireEvent(BI.NumberInterval.EVENT_ERROR); - break; - case c.signalError: - self._setTitle(BI.i18nText("BI-Numerical_Interval_Signal_Value")); - self.fireEvent(BI.NumberInterval.EVENT_ERROR); - break; - default : - self.fireEvent(BI.NumberInterval.EVENT_CHANGE); - self.fireEvent(BI.NumberInterval.EVENT_CONFIRM); - self.fireEvent(BI.NumberInterval.EVENT_VALID); + case c.typeError: + self._setTitle(i18nText("BI-Numerical_Interval_Input_Data")); + self.fireEvent(NumberInterval.EVENT_ERROR); + break; + case c.numberError: + self._setTitle(i18nText("BI-Numerical_Interval_Number_Value")); + self.fireEvent(NumberInterval.EVENT_ERROR); + break; + case c.signalError: + self._setTitle(i18nText("BI-Numerical_Interval_Signal_Value")); + self.fireEvent(NumberInterval.EVENT_ERROR); + break; + default: + self.fireEvent(NumberInterval.EVENT_CHANGE); + self.fireEvent(NumberInterval.EVENT_CONFIRM); + self.fireEvent(NumberInterval.EVENT_VALID); } }); - }, + } - isStateValid: function () { + isStateValid() { return this.options.validation === "valid"; - }, + } - setMinEnable: function (b) { + setMinEnable(b) { this.smallEditor.setEnable(b); - }, + } - setCloseMinEnable: function (b) { + setCloseMinEnable(b) { this.smallCombo.setEnable(b); - }, + } - setMaxEnable: function (b) { + setMaxEnable(b) { this.bigEditor.setEnable(b); - }, + } - setCloseMaxEnable: function (b) { + setCloseMaxEnable(b) { this.bigCombo.setEnable(b); - }, + } - showNumTip: function () { + showNumTip() { this.smallTip.setVisible(true); this.bigTip.setVisible(true); - }, + } - hideNumTip: function () { + hideNumTip() { this.smallTip.setVisible(false); this.bigTip.setVisible(false); - }, + } - setNumTip: function (numTip) { + setNumTip(numTip) { this.smallTip.setText(numTip); this.bigTip.setText(numTip); - }, + } - getNumTip: function () { + getNumTip() { return this.smallTip.getText(); - }, + } - setValue: function (data) { + setValue(data) { data = data || {}; - var self = this, combo_value; - if (BI.isNumeric(data.min) || BI.isEmptyString(data.min)) { + const self = this; + let combo_value; + if (isNumeric(data.min) || isEmptyString(data.min)) { self.smallEditor.setValue(data.min); } - if (!BI.isNotNull(data.min)) { + if (!isNotNull(data.min)) { self.smallEditor.setValue(""); } - if (BI.isNumeric(data.max) || BI.isEmptyString(data.max)) { + if (isNumeric(data.max) || isEmptyString(data.max)) { self.bigEditor.setValue(data.max); } - if (!BI.isNotNull(data.max)) { + if (!isNotNull(data.max)) { self.bigEditor.setValue(""); } - if (!BI.isNull(data.closeMin)) { + if (!isNull(data.closeMin)) { if (data.closeMin === true) { combo_value = 1; } else { @@ -512,7 +538,7 @@ BI.NumberInterval = BI.inherit(BI.Single, { self.smallCombo.setValue(combo_value); } - if (!BI.isNull(data.closeMax)) { + if (!isNull(data.closeMax)) { if (data.closeMax === true) { combo_value = 1; } else { @@ -522,11 +548,13 @@ BI.NumberInterval = BI.inherit(BI.Single, { } this._checkValidation(); - }, - + } - getValue: function () { - var self = this, value = {}, minComboValue = self.smallCombo.getValue(), maxComboValue = self.bigCombo.getValue(); + getValue() { + const self = this, + value = {}, + minComboValue = self.smallCombo.getValue(), + maxComboValue = self.bigCombo.getValue(); value.min = self.smallEditor.getValue(); value.max = self.bigEditor.getValue(); if (minComboValue[0] === 0) { @@ -540,26 +568,22 @@ BI.NumberInterval = BI.inherit(BI.Single, { } else { value.closeMax = true; } + return value; - }, + } - focusMinEditor: function () { + focusMinEditor() { this.smallEditor.focus(); - }, + } - focusMaxEditor: function () { + focusMaxEditor() { this.bigEditor.focus(); - }, + } - destroyed: function () { - var c = this.constants; - BI.Bubbles.remove(c.typeError); - BI.Bubbles.remove(c.numberError); - BI.Bubbles.remove(c.signalError); + destroyed() { + const c = this.constants; + Bubbles.remove(c.typeError); + Bubbles.remove(c.numberError); + Bubbles.remove(c.signalError); } -}); -BI.NumberInterval.EVENT_CHANGE = "EVENT_CHANGE"; -BI.NumberInterval.EVENT_CONFIRM = "EVENT_CONFIRM"; -BI.NumberInterval.EVENT_VALID = "EVENT_VALID"; -BI.NumberInterval.EVENT_ERROR = "EVENT_ERROR"; -BI.shortcut("bi.number_interval", BI.NumberInterval); +} diff --git a/src/widget/numberinterval/singleeditor/single.editor.js b/src/widget/numberinterval/singleeditor/single.editor.js index ac7738d9f..80126ad53 100644 --- a/src/widget/numberinterval/singleeditor/single.editor.js +++ b/src/widget/numberinterval/singleeditor/single.editor.js @@ -1,19 +1,34 @@ -BI.NumberIntervalSingleEidtor = BI.inherit(BI.Single, { - props: { +import { shortcut, VerticalLayout } from "@/core"; +import { Single, Editor } from "@/base"; + +@shortcut() +export class NumberIntervalSingleEidtor extends Single { + static xtype = "bi.number_interval_single_editor" + + static EVENT_FOCUS = "EVENT_FOCUS" + static EVENT_BLUR = "EVENT_BLUR" + static EVENT_ERROR = "EVENT_ERROR" + static EVENT_VALID = "EVENT_VALID" + static EVENT_CHANGE = "EVENT_CHANGE" + static EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM" + static EVENT_CONFIRM = "EVENT_CONFIRM" + + props = { baseCls: "bi-number-interval-single-editor", tipType: "success", - title: "" - }, + title: "", + }; - render: function () { - var self = this, o = this.options; + render() { + const self = this, + o = this.options; return { - type: "bi.vertical", + type: VerticalLayout.xtype, items: [{ - type: "bi.editor", + type: Editor.xtype, simple: o.simple, - ref: function (_ref) { + ref (_ref) { self.editor = _ref; }, height: o.height, @@ -23,67 +38,58 @@ BI.NumberIntervalSingleEidtor = BI.inherit(BI.Single, { quitChecker: o.quitChecker, validationChecker: o.validationChecker, listeners: [{ - eventName: BI.Editor.EVENT_ERROR, - action: function () { - self.fireEvent(BI.NumberIntervalSingleEidtor.EVENT_ERROR, arguments); - } + eventName: Editor.EVENT_ERROR, + action () { + self.fireEvent(NumberIntervalSingleEidtor.EVENT_ERROR, arguments); + }, }, { - eventName: BI.Editor.EVENT_FOCUS, - action: function () { - self.fireEvent(BI.NumberIntervalSingleEidtor.EVENT_FOCUS, arguments); - } + eventName: Editor.EVENT_FOCUS, + action () { + self.fireEvent(NumberIntervalSingleEidtor.EVENT_FOCUS, arguments); + }, }, { - eventName: BI.Editor.EVENT_BLUR, - action: function () { - self.fireEvent(BI.NumberIntervalSingleEidtor.EVENT_BLUR, arguments); - } + eventName: Editor.EVENT_BLUR, + action () { + self.fireEvent(NumberIntervalSingleEidtor.EVENT_BLUR, arguments); + }, }, { - eventName: BI.Editor.EVENT_VALID, - action: function () { - self.fireEvent(BI.NumberIntervalSingleEidtor.EVENT_VALID, arguments); - } + eventName: Editor.EVENT_VALID, + action () { + self.fireEvent(NumberIntervalSingleEidtor.EVENT_VALID, arguments); + }, }, { - eventName: BI.Editor.EVENT_CHANGE, - action: function () { - self.fireEvent(BI.NumberIntervalSingleEidtor.EVENT_CHANGE, arguments); - } + eventName: Editor.EVENT_CHANGE, + action () { + self.fireEvent(NumberIntervalSingleEidtor.EVENT_CHANGE, arguments); + }, }, { - eventName: BI.Editor.EVENT_CONFIRM, - action: function () { - self.fireEvent(BI.NumberIntervalSingleEidtor.EVENT_CONFIRM, arguments); - } + eventName: Editor.EVENT_CONFIRM, + action () { + self.fireEvent(NumberIntervalSingleEidtor.EVENT_CONFIRM, arguments); + }, }, { - eventName: BI.Editor.EVENT_CHANGE_CONFIRM, - action: function () { - self.fireEvent(BI.NumberIntervalSingleEidtor.EVENT_CHANGE_CONFIRM, arguments); - } - }] - }] + eventName: Editor.EVENT_CHANGE_CONFIRM, + action () { + self.fireEvent(NumberIntervalSingleEidtor.EVENT_CHANGE_CONFIRM, arguments); + }, + }], + }], }; - }, + } - isValid: function () { + isValid() { return this.editor.isValid(); - }, + } - getValue: function () { + getValue() { return this.editor.getValue(); - }, + } - setValue: function (v) { + setValue(v) { return this.editor.setValue(v); - }, + } - focus: function () { + focus() { this.editor.focus(); } -}); - -BI.NumberIntervalSingleEidtor.EVENT_FOCUS = "EVENT_FOCUS"; -BI.NumberIntervalSingleEidtor.EVENT_BLUR = "EVENT_BLUR"; -BI.NumberIntervalSingleEidtor.EVENT_ERROR = "EVENT_ERROR"; -BI.NumberIntervalSingleEidtor.EVENT_VALID = "EVENT_VALID"; -BI.NumberIntervalSingleEidtor.EVENT_CHANGE = "EVENT_CHANGE"; -BI.NumberIntervalSingleEidtor.EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM"; -BI.NumberIntervalSingleEidtor.EVENT_CONFIRM = "EVENT_CONFIRM"; -BI.shortcut("bi.number_interval_single_editor", BI.NumberIntervalSingleEidtor); \ No newline at end of file +} diff --git a/src/widget/timeinterval/dateinterval.js b/src/widget/timeinterval/dateinterval.js index 2da77de8b..a591d4a4d 100644 --- a/src/widget/timeinterval/dateinterval.js +++ b/src/widget/timeinterval/dateinterval.js @@ -1,27 +1,39 @@ -/** - * Created by Baron on 2015/10/19. - */ -BI.DateInterval = BI.inherit(BI.Single, { - constants: { +import { shortcut, extend, createWidget, i18nText, print, parseDateTime, checkDateVoid, checkDateLegal, isNotNull } from "@/core"; +import { Single, Label, Bubbles } from "@/base"; +import { DynamicDateCombo } from "../dynamicdate"; + +@shortcut() +export class DateInterval extends Single { + static xtype = "bi.date_interval" + + constants = { height: 24, width: 24, lgap: 15, offset: 0, - timeErrorCls: "time-error" - }, - _defaultConfig: function () { - var conf = BI.DateInterval.superclass._defaultConfig.apply(this, arguments); - return BI.extend(conf, { + timeErrorCls: "time-error", + }; + + static EVENT_VALID = "EVENT_VALID" + static EVENT_ERROR = "EVENT_ERROR" + static EVENT_CHANGE = "EVENT_CHANGE" + static EVENT_BEFORE_YEAR_MONTH_POPUPVIEW = "EVENT_BEFORE_YEAR_MONTH_POPUPVIEW" + + + _defaultConfig() { + const conf = super._defaultConfig(...arguments); + + return extend(conf, { extraCls: "bi-date-interval", minDate: "1900-01-01", maxDate: "2099-12-31", height: 24, supportDynamic: true, }); - }, - - render: function () { - var self = this, o = this.options; + } + + render() { + const o = this.options; o.value = o.value || {}; this.left = this._createCombo(o.value.start, o.watermark?.start); this.right = this._createCombo(o.value.end, o.watermark?.end); @@ -30,164 +42,177 @@ BI.DateInterval = BI.inherit(BI.Single, { type: "bi.horizontal_fill", columnSize: ["fill", "", "fill"], items: [{ - el: self.left + el: this.left, }, { el: { - type: "bi.label", + type: Label.xtype, height: o.height, hgap: 5, text: "-", - ref: function (_ref) { - self.label = _ref; - } - } + ref: _ref => { + this.label = _ref; + }, + }, }, { - el: self.right - }] + el: this.right, + }], }; - }, + } - _createCombo: function (v, watermark) { - var self = this, o = this.options; - var combo = BI.createWidget({ - type: "bi.dynamic_date_combo", + _createCombo(v, watermark) { + const o = this.options; + const combo = createWidget({ + type: DynamicDateCombo.xtype, supportDynamic: o.supportDynamic, minDate: o.minDate, maxDate: o.maxDate, simple: o.simple, behaviors: o.behaviors, - watermark: watermark, + watermark, value: v, height: o.height, listeners: [{ - eventName: BI.DynamicDateCombo.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW, - action: function () { - self.fireEvent(BI.DateInterval.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW); - } - }] + eventName: DynamicDateCombo.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW, + action: () => { + this.fireEvent(DateInterval.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW); + }, + }], }); - combo.on(BI.DynamicDateCombo.EVENT_ERROR, function () { - self._clearTitle(); - BI.Bubbles.hide("error"); - self.element.removeClass(self.constants.timeErrorCls); - self.fireEvent(BI.DateInterval.EVENT_ERROR); + combo.on(DynamicDateCombo.EVENT_ERROR, () => { + this._clearTitle(); + Bubbles.hide("error"); + this.element.removeClass(this.constants.timeErrorCls); + this.fireEvent(DateInterval.EVENT_ERROR); }); - combo.on(BI.DynamicDateCombo.EVENT_VALID, function () { - BI.Bubbles.hide("error"); - var smallDate = self.left.getKey(), bigDate = self.right.getKey(); - if (self._check(smallDate, bigDate) && self._compare(smallDate, bigDate)) { - self._setTitle(BI.i18nText("BI-Time_Interval_Error_Text")); - self.element.addClass(self.constants.timeErrorCls); - BI.Bubbles.show("error", BI.i18nText("BI-Time_Interval_Error_Text"), self, { - offsetStyle: "center" + combo.on(DynamicDateCombo.EVENT_VALID, () => { + Bubbles.hide("error"); + const smallDate = this.left.getKey(), + bigDate = this.right.getKey(); + if (this._check(smallDate, bigDate) && this._compare(smallDate, bigDate)) { + this._setTitle(i18nText("BI-Time_Interval_Error_Text")); + this.element.addClass(this.constants.timeErrorCls); + Bubbles.show("error", i18nText("BI-Time_Interval_Error_Text"), this, { + offsetStyle: "center", }); - self.fireEvent(BI.DateInterval.EVENT_ERROR); + this.fireEvent(DateInterval.EVENT_ERROR); } else { - self._clearTitle(); - self.element.removeClass(self.constants.timeErrorCls); + this._clearTitle(); + this.element.removeClass(this.constants.timeErrorCls); } }); - combo.on(BI.DynamicDateCombo.EVENT_FOCUS, function () { - BI.Bubbles.hide("error"); - var smallDate = self.left.getKey(), bigDate = self.right.getKey(); - if (self._check(smallDate, bigDate) && self._compare(smallDate, bigDate)) { - self._setTitle(BI.i18nText("BI-Time_Interval_Error_Text")); - self.element.addClass(self.constants.timeErrorCls); - BI.Bubbles.show("error", BI.i18nText("BI-Time_Interval_Error_Text"), self, { - offsetStyle: "center" + combo.on(DynamicDateCombo.EVENT_FOCUS, () => { + Bubbles.hide("error"); + const smallDate = this.left.getKey(), + bigDate = this.right.getKey(); + if (this._check(smallDate, bigDate) && this._compare(smallDate, bigDate)) { + this._setTitle(i18nText("BI-Time_Interval_Error_Text")); + this.element.addClass(this.constants.timeErrorCls); + Bubbles.show("error", i18nText("BI-Time_Interval_Error_Text"), this, { + offsetStyle: "center", }); - self.fireEvent(BI.DateInterval.EVENT_ERROR); + this.fireEvent(DateInterval.EVENT_ERROR); } else { - self._clearTitle(); - self.element.removeClass(self.constants.timeErrorCls); + this._clearTitle(); + this.element.removeClass(this.constants.timeErrorCls); } }); - // combo.on(BI.DynamicDateCombo.EVENT_BEFORE_POPUPVIEW, function () { - // self.left.hidePopupView(); - // self.right.hidePopupView(); + // combo.on(DynamicDateCombo.EVENT_BEFORE_POPUPVIEW, () => { + // this.left.hidePopupView(); + // this.right.hidePopupView(); // }); - combo.on(BI.DynamicDateCombo.EVENT_CONFIRM, function () { - BI.Bubbles.hide("error"); - var smallDate = self.left.getKey(), bigDate = self.right.getKey(); - if (self._check(smallDate, bigDate) && self._compare(smallDate, bigDate)) { - self._setTitle(BI.i18nText("BI-Time_Interval_Error_Text")); - self.element.addClass(self.constants.timeErrorCls); - self.fireEvent(BI.DateInterval.EVENT_ERROR); - }else{ - self._clearTitle(); - self.element.removeClass(self.constants.timeErrorCls); - self.fireEvent(BI.DateInterval.EVENT_CHANGE); + combo.on(DynamicDateCombo.EVENT_CONFIRM, () => { + Bubbles.hide("error"); + const smallDate = this.left.getKey(), + bigDate = this.right.getKey(); + if (this._check(smallDate, bigDate) && this._compare(smallDate, bigDate)) { + this._setTitle(i18nText("BI-Time_Interval_Error_Text")); + this.element.addClass(this.constants.timeErrorCls); + this.fireEvent(DateInterval.EVENT_ERROR); + } else { + this._clearTitle(); + this.element.removeClass(this.constants.timeErrorCls); + this.fireEvent(DateInterval.EVENT_CHANGE); } }); + return combo; - }, - _dateCheck: function (date) { - return BI.print(BI.parseDateTime(date, "%Y-%x-%d"), "%Y-%x-%d") === date || - BI.print(BI.parseDateTime(date, "%Y-%X-%d"), "%Y-%X-%d") === date || - BI.print(BI.parseDateTime(date, "%Y-%x-%e"), "%Y-%x-%e") === date || - BI.print(BI.parseDateTime(date, "%Y-%X-%e"), "%Y-%X-%e") === date; - }, - _checkVoid: function (obj) { - var o = this.options; - return !BI.checkDateVoid(obj.year, obj.month, obj.day, o.minDate, o.maxDate)[0]; - }, - _check: function (smallDate, bigDate) { - var smallObj = smallDate.match(/\d+/g), bigObj = bigDate.match(/\d+/g); - return this._dateCheck(smallDate) && BI.checkDateLegal(smallDate) && this._checkVoid({ + } + + _dateCheck(date) { + return print(parseDateTime(date, "%Y-%x-%d"), "%Y-%x-%d") === date || + print(parseDateTime(date, "%Y-%X-%d"), "%Y-%X-%d") === date || + print(parseDateTime(date, "%Y-%x-%e"), "%Y-%x-%e") === date || + print(parseDateTime(date, "%Y-%X-%e"), "%Y-%X-%e") === date; + } + + _checkVoid(obj) { + const o = this.options; + + return !checkDateVoid(obj.year, obj.month, obj.day, o.minDate, o.maxDate)[0]; + } + + _check(smallDate, bigDate) { + const smallObj = smallDate.match(/\d+/g), + bigObj = bigDate.match(/\d+/g); + + return this._dateCheck(smallDate) && checkDateLegal(smallDate) && this._checkVoid({ year: smallObj[0], month: smallObj[1], - day: smallObj[2] - }) && this._dateCheck(bigDate) && BI.checkDateLegal(bigDate) && this._checkVoid({ + day: smallObj[2], + }) && this._dateCheck(bigDate) && checkDateLegal(bigDate) && this._checkVoid({ year: bigObj[0], month: bigObj[1], - day: bigObj[2] + day: bigObj[2], }); - }, - _compare: function (smallDate, bigDate) { - smallDate = BI.print(BI.parseDateTime(smallDate, "%Y-%X-%d"), "%Y-%X-%d"); - bigDate = BI.print(BI.parseDateTime(bigDate, "%Y-%X-%d"), "%Y-%X-%d"); - return BI.isNotNull(smallDate) && BI.isNotNull(bigDate) && smallDate > bigDate; - }, - _setTitle: function (v) { + } + + _compare(smallDate, bigDate) { + smallDate = print(parseDateTime(smallDate, "%Y-%X-%d"), "%Y-%X-%d"); + bigDate = print(parseDateTime(bigDate, "%Y-%X-%d"), "%Y-%X-%d"); + + return isNotNull(smallDate) && isNotNull(bigDate) && smallDate > bigDate; + } + + _setTitle(v) { this.left.setTitle(v); this.right.setTitle(v); this.label.setTitle(v); - }, - _clearTitle: function () { + } + + _clearTitle() { this.left.setTitle(""); this.right.setTitle(""); this.label.setTitle(""); - }, + } - setMinDate: function (minDate) { - var o = this.options; + setMinDate(minDate) { + const o = this.options; o.minDate = minDate; this.left.setMinDate(minDate); this.right.setMinDate(minDate); - }, + } - setMaxDate: function (maxDate) { - var o = this.options; + setMaxDate(maxDate) { + const o = this.options; o.maxDate = maxDate; this.left.setMaxDate(maxDate); this.right.setMaxDate(maxDate); - }, + } - setValue: function (date) { + setValue(date) { date = date || {}; this.left.setValue(date.start); this.right.setValue(date.end); - }, - getValue: function () { - return {start: this.left.getValue(), end: this.right.getValue()}; } -}); -BI.DateInterval.EVENT_VALID = "EVENT_VALID"; -BI.DateInterval.EVENT_ERROR = "EVENT_ERROR"; -BI.DateInterval.EVENT_CHANGE = "EVENT_CHANGE"; -BI.DateInterval.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW = "EVENT_BEFORE_YEAR_MONTH_POPUPVIEW"; -BI.shortcut("bi.date_interval", BI.DateInterval); + + getValue() { + return { + start: this.left.getValue(), + end: this.right.getValue(), + }; + } +} diff --git a/src/widget/timeinterval/index.js b/src/widget/timeinterval/index.js new file mode 100644 index 000000000..58eb61b77 --- /dev/null +++ b/src/widget/timeinterval/index.js @@ -0,0 +1,3 @@ +export { DateInterval } from "./dateinterval"; +export { TimeInterval } from "./timeinterval"; +export { TimePeriods } from "./timeperiods"; diff --git a/src/widget/timeinterval/timeinterval.js b/src/widget/timeinterval/timeinterval.js index c22c8e14e..23ca310e3 100644 --- a/src/widget/timeinterval/timeinterval.js +++ b/src/widget/timeinterval/timeinterval.js @@ -1,27 +1,37 @@ -/** - * Created by Baron on 2015/10/19. - */ -BI.TimeInterval = BI.inherit(BI.Single, { - constants: { +import { shortcut, extend, createWidget, i18nText, print, parseDateTime, checkDateVoid, checkDateLegal, isNotNull } from "@/core"; +import { Single, Label, Bubbles } from "@/base"; +import { DynamicDateTimeCombo } from "../dynamicdatetime"; + +@shortcut() +export class TimeInterval extends Single { + static xtype = "bi.time_interval" + + constants = { height: 24, width: 24, lgap: 15, offset: 0, - timeErrorCls: "time-error" - }, - _defaultConfig: function () { - var conf = BI.TimeInterval.superclass._defaultConfig.apply(this, arguments); - return BI.extend(conf, { + timeErrorCls: "time-error", + }; + + static EVENT_VALID = "EVENT_VALID" + static EVENT_ERROR = "EVENT_ERROR" + static EVENT_CHANGE = "EVENT_CHANGE" + + _defaultConfig() { + const conf = super._defaultConfig(...arguments); + + return extend(conf, { extraCls: "bi-time-interval", minDate: "1900-01-01", maxDate: "2099-12-31", height: 24, - supportDynamic: true + supportDynamic: true, }); - }, + } - render: function () { - var self = this, o = this.options; + render() { + const o = this.options; o.value = o.value || {}; this.left = this._createCombo(o.value.start, o.watermark?.start); this.right = this._createCombo(o.value.end, o.watermark?.end); @@ -30,158 +40,172 @@ BI.TimeInterval = BI.inherit(BI.Single, { type: "bi.horizontal_fill", columnSize: ["fill", "", "fill"], items: [{ - el: self.left + el: this.left, }, { el: { - type: "bi.label", + type: Label.xtype, height: o.height, hgap: 5, text: "-", - ref: function (_ref) { - self.label = _ref; - } - } + ref: _ref => { + this.label = _ref; + }, + }, }, { - el: self.right - }] + el: this.right, + }], }; - }, + } - _createCombo: function (v, watermark) { - var self = this, o = this.options; - var combo = BI.createWidget({ - type: "bi.dynamic_date_time_combo", + _createCombo(v, watermark) { + const o = this.options; + const combo = createWidget({ + type: DynamicDateTimeCombo.xtype, simple: o.simple, supportDynamic: o.supportDynamic, minDate: o.minDate, maxDate: o.maxDate, behaviors: o.behaviors, - watermark: watermark, + watermark, value: v, height: o.height, }); - combo.on(BI.DynamicDateTimeCombo.EVENT_ERROR, function () { - self._clearTitle(); - BI.Bubbles.hide("error"); - self.element.removeClass(self.constants.timeErrorCls); - self.fireEvent(BI.TimeInterval.EVENT_ERROR); + combo.on(DynamicDateTimeCombo.EVENT_ERROR, () => { + this._clearTitle(); + Bubbles.hide("error"); + this.element.removeClass(this.constants.timeErrorCls); + this.fireEvent(TimeInterval.EVENT_ERROR); }); - combo.on(BI.DynamicDateTimeCombo.EVENT_VALID, function () { - BI.Bubbles.hide("error"); - var smallDate = self.left.getKey(), bigDate = self.right.getKey(); - if (self.left.isValid() && self.right.isValid() && self._check(smallDate, bigDate) && self._compare(smallDate, bigDate)) { - self._setTitle(BI.i18nText("BI-Time_Interval_Error_Text")); - self.element.addClass(self.constants.timeErrorCls); - BI.Bubbles.show("error", BI.i18nText("BI-Time_Interval_Error_Text"), self, { - offsetStyle: "center" + combo.on(DynamicDateTimeCombo.EVENT_VALID, () => { + Bubbles.hide("error"); + const smallDate = this.left.getKey(), + bigDate = this.right.getKey(); + if (this.left.isValid() && this.right.isValid() && this._check(smallDate, bigDate) && this._compare(smallDate, bigDate)) { + this._setTitle(i18nText("BI-Time_Interval_Error_Text")); + this.element.addClass(this.constants.timeErrorCls); + Bubbles.show("error", i18nText("BI-Time_Interval_Error_Text"), this, { + offsetStyle: "center", }); - self.fireEvent(BI.TimeInterval.EVENT_ERROR); + this.fireEvent(TimeInterval.EVENT_ERROR); } else { - self._clearTitle(); - self.element.removeClass(self.constants.timeErrorCls); + this._clearTitle(); + this.element.removeClass(this.constants.timeErrorCls); } }); - combo.on(BI.DynamicDateTimeCombo.EVENT_FOCUS, function () { - BI.Bubbles.hide("error"); - var smallDate = self.left.getKey(), bigDate = self.right.getKey(); - if (self.left.isValid() && self.right.isValid() && self._check(smallDate, bigDate) && self._compare(smallDate, bigDate)) { - self._setTitle(BI.i18nText("BI-Time_Interval_Error_Text")); - self.element.addClass(self.constants.timeErrorCls); - BI.Bubbles.show("error", BI.i18nText("BI-Time_Interval_Error_Text"), self, { - offsetStyle: "center" + combo.on(DynamicDateTimeCombo.EVENT_FOCUS, () => { + Bubbles.hide("error"); + const smallDate = this.left.getKey(), + bigDate = this.right.getKey(); + if (this.left.isValid() && this.right.isValid() && this._check(smallDate, bigDate) && this._compare(smallDate, bigDate)) { + this._setTitle(i18nText("BI-Time_Interval_Error_Text")); + this.element.addClass(this.constants.timeErrorCls); + Bubbles.show("error", i18nText("BI-Time_Interval_Error_Text"), this, { + offsetStyle: "center", }); - self.fireEvent(BI.TimeInterval.EVENT_ERROR); + this.fireEvent(TimeInterval.EVENT_ERROR); } else { - self._clearTitle(); - self.element.removeClass(self.constants.timeErrorCls); + this._clearTitle(); + this.element.removeClass(this.constants.timeErrorCls); } }); // 不知道干啥的,先注释掉 - // combo.on(BI.DynamicDateTimeCombo.EVENT_BEFORE_POPUPVIEW, function () { - // self.left.hidePopupView(); - // self.right.hidePopupView(); + // combo.on(DynamicDateTimeCombo.EVENT_BEFORE_POPUPVIEW, () => { + // this.left.hidePopupView(); + // this.right.hidePopupView(); // }); - combo.on(BI.DynamicDateTimeCombo.EVENT_CONFIRM, function () { - BI.Bubbles.hide("error"); - var smallDate = self.left.getKey(), bigDate = self.right.getKey(); - if (self.left.isValid() && self.right.isValid() && self._check(smallDate, bigDate) && self._compare(smallDate, bigDate)) { - self._setTitle(BI.i18nText("BI-Time_Interval_Error_Text")); - self.element.addClass(self.constants.timeErrorCls); - self.fireEvent(BI.TimeInterval.EVENT_ERROR); - }else{ - self._clearTitle(); - self.element.removeClass(self.constants.timeErrorCls); - self.fireEvent(BI.TimeInterval.EVENT_CHANGE); + combo.on(DynamicDateTimeCombo.EVENT_CONFIRM, () => { + Bubbles.hide("error"); + const smallDate = this.left.getKey(), + bigDate = this.right.getKey(); + if (this.left.isValid() && this.right.isValid() && this._check(smallDate, bigDate) && this._compare(smallDate, bigDate)) { + this._setTitle(i18nText("BI-Time_Interval_Error_Text")); + this.element.addClass(this.constants.timeErrorCls); + this.fireEvent(TimeInterval.EVENT_ERROR); + } else { + this._clearTitle(); + this.element.removeClass(this.constants.timeErrorCls); + this.fireEvent(TimeInterval.EVENT_CHANGE); } }); + return combo; - }, - _dateCheck: function (date) { - return BI.print(BI.parseDateTime(date, "%Y-%x-%d %H:%M:%S"), "%Y-%x-%d %H:%M:%S") === date || - BI.print(BI.parseDateTime(date, "%Y-%X-%d %H:%M:%S"), "%Y-%X-%d %H:%M:%S") === date || - BI.print(BI.parseDateTime(date, "%Y-%x-%e %H:%M:%S"), "%Y-%x-%e %H:%M:%S") === date || - BI.print(BI.parseDateTime(date, "%Y-%X-%e %H:%M:%S"), "%Y-%X-%e %H:%M:%S") === date; - }, - _checkVoid: function (obj) { - var o = this.options; - return !BI.checkDateVoid(obj.year, obj.month, obj.day, o.minDate, o.maxDate)[0]; - }, - _check: function (smallDate, bigDate) { - var smallObj = smallDate.match(/\d+/g), bigObj = bigDate.match(/\d+/g); - return this._dateCheck(smallDate) && BI.checkDateLegal(smallDate) && this._checkVoid({ + } + + _dateCheck(date) { + return print(parseDateTime(date, "%Y-%x-%d %H:%M:%S"), "%Y-%x-%d %H:%M:%S") === date || + print(parseDateTime(date, "%Y-%X-%d %H:%M:%S"), "%Y-%X-%d %H:%M:%S") === date || + print(parseDateTime(date, "%Y-%x-%e %H:%M:%S"), "%Y-%x-%e %H:%M:%S") === date || + print(parseDateTime(date, "%Y-%X-%e %H:%M:%S"), "%Y-%X-%e %H:%M:%S") === date; + } + + _checkVoid(obj) { + const o = this.options; + + return !checkDateVoid(obj.year, obj.month, obj.day, o.minDate, o.maxDate)[0]; + } + + _check(smallDate, bigDate) { + const smallObj = smallDate.match(/\d+/g), + bigObj = bigDate.match(/\d+/g); + + return this._dateCheck(smallDate) && checkDateLegal(smallDate) && this._checkVoid({ year: smallObj[0], month: smallObj[1], - day: smallObj[2] - }) && this._dateCheck(bigDate) && BI.checkDateLegal(bigDate) && this._checkVoid({ + day: smallObj[2], + }) && this._dateCheck(bigDate) && checkDateLegal(bigDate) && this._checkVoid({ year: bigObj[0], month: bigObj[1], - day: bigObj[2] + day: bigObj[2], }); - }, - _compare: function (smallDate, bigDate) { - smallDate = BI.print(BI.parseDateTime(smallDate, "%Y-%X-%d %H:%M:%S"), "%Y-%X-%d %H:%M:%S"); - bigDate = BI.print(BI.parseDateTime(bigDate, "%Y-%X-%d %H:%M:%S"), "%Y-%X-%d %H:%M:%S"); - return BI.isNotNull(smallDate) && BI.isNotNull(bigDate) && smallDate > bigDate; - }, - _setTitle: function (v) { + } + + _compare(smallDate, bigDate) { + smallDate = print(parseDateTime(smallDate, "%Y-%X-%d %H:%M:%S"), "%Y-%X-%d %H:%M:%S"); + bigDate = print(parseDateTime(bigDate, "%Y-%X-%d %H:%M:%S"), "%Y-%X-%d %H:%M:%S"); + + return isNotNull(smallDate) && isNotNull(bigDate) && smallDate > bigDate; + } + + _setTitle(v) { this.left.setTitle(v); this.right.setTitle(v); this.label.setTitle(v); - }, - _clearTitle: function () { + } + + _clearTitle() { this.left.setTitle(""); this.right.setTitle(""); this.label.setTitle(""); - }, + } - setMinDate: function (minDate) { - var o = this.options; + setMinDate(minDate) { + const o = this.options; o.minDate = minDate; this.left.setMinDate(minDate); this.right.setMinDate(minDate); - }, + } - setMaxDate: function (maxDate) { - var o = this.options; + setMaxDate(maxDate) { + const o = this.options; o.maxDate = maxDate; this.left.setMaxDate(maxDate); this.right.setMaxDate(maxDate); - }, + } - setValue: function (date) { + setValue(date) { date = date || {}; this.left.setValue(date.start); this.right.setValue(date.end); - }, - getValue: function () { - return {start: this.left.getValue(), end: this.right.getValue()}; } -}); -BI.TimeInterval.EVENT_VALID = "EVENT_VALID"; -BI.TimeInterval.EVENT_ERROR = "EVENT_ERROR"; -BI.TimeInterval.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.time_interval", BI.TimeInterval); + + getValue() { + return { + start: this.left.getValue(), + end: this.right.getValue(), + }; + } +} diff --git a/src/widget/timeinterval/timeperiods.js b/src/widget/timeinterval/timeperiods.js index a8bb9e60b..1eb2cef6a 100644 --- a/src/widget/timeinterval/timeperiods.js +++ b/src/widget/timeinterval/timeperiods.js @@ -1,92 +1,90 @@ -/** - * 时间区间 - * qcc - * 2019/2/28 - */ +import { shortcut, extend } from "@/core"; +import { Single, Label } from "@/base"; +import { TimeCombo } from "../time"; + +@shortcut() +export class TimePeriods extends Single { + static xtype = "bi.time_periods" + + props = { + extraCls: "bi-time-interval", + value: {}, + }; + + static EVENT_CONFIRM = "EVENT_CONFIRM" + static EVENT_CHANGE = "EVENT_CHANGE" -!(function () { - BI.TimePeriods = BI.inherit(BI.Single, { - constants: { - height: 24, - width: 24, - hgap: 15, - offset: -15 - }, - props: { - extraCls: "bi-time-interval", - value: {} - }, - - render: function () { - var self = this, o = this.options; - return { - type: "bi.horizontal_fill", - columnSize: ["fill", "", "fill"], - items: [{ - el: BI.extend({ - ref: function (_ref) { - self.left = _ref; - } - }, this._createCombo(o.value.start, o.watermark?.start)) - }, { - el: { - type: "bi.label", - height: o.height, - hgap: 5, - text: "-", - ref: function (_ref) { - self.label = _ref; - } - } - }, { - el: BI.extend({ - ref: function (_ref) { - self.right = _ref; - } - }, this._createCombo(o.value.end, o.watermark?.end)) - }] - }; - }, + render() { + const o = this.options; + + return { + type: "bi.horizontal_fill", + columnSize: ["fill", "", "fill"], + items: [{ + el: extend({ + ref: _ref => { + this.left = _ref; + }, + }, this._createCombo(o.value.start, o.watermark?.start)), + }, { + el: { + type: Label.xtype, + height: o.height, + hgap: 5, + text: "-", + ref: _ref => { + this.label = _ref; + }, + }, + }, { + el: extend({ + ref: _ref => { + this.right = _ref; + }, + }, this._createCombo(o.value.end, o.watermark?.end)), + }], + }; + } + + _createCombo(v, watermark) { + const o = this.options; + + return { + type: TimeCombo.xtype, + value: v, + height: o.height, + watermark, + listeners: [{ + eventName: TimeCombo.EVENT_BEFORE_POPUPVIEW, + action: () => { + this.left.hidePopupView(); + this.right.hidePopupView(); + }, + }, { + eventName: TimeCombo.EVENT_CHANGE, + action: () => { + this.fireEvent(TimePeriods.EVENT_CHANGE); + }, + }, { + eventName: TimeCombo.EVENT_CONFIRM, + action: () => { + this.fireEvent(TimePeriods.EVENT_CONFIRM); + }, + }], + }; + } - _createCombo: function (v, watermark) { - var self = this; - var o = this.options; - return { - type: "bi.time_combo", - value: v, - height: o.height, - watermark: watermark, - listeners: [{ - eventName: BI.TimeCombo.EVENT_BEFORE_POPUPVIEW, - action: function () { - self.left.hidePopupView(); - self.right.hidePopupView(); - } - }, { - eventName: BI.TimeCombo.EVENT_CHANGE, - action: function () { - self.fireEvent(BI.TimePeriods.EVENT_CHANGE); - } - }, { - eventName: BI.TimeCombo.EVENT_CONFIRM, - action: function () { - self.fireEvent(BI.TimePeriods.EVENT_CONFIRM); - } - }] - }; - }, + setValue(date) { + date = date || {}; + this.left.setValue(date.start); + this.right.setValue(date.end); + } - setValue: function (date) { - date = date || {}; - this.left.setValue(date.start); - this.right.setValue(date.end); - }, - getValue: function () { - return {start: this.left.getValue(), end: this.right.getValue()}; - } - }); - BI.TimePeriods.EVENT_CONFIRM = "EVENT_CONFIRM"; - BI.TimePeriods.EVENT_CHANGE = "EVENT_CHANGE"; - BI.shortcut("bi.time_periods", BI.TimePeriods); -})(); + getValue() { + return { + start: this.left.getValue(), + end: this.right.getValue(), + }; + } +}