From 2d2d87015e5fa623eefa10c0d934e4d6262b02ea Mon Sep 17 00:00:00 2001 From: "Zhenfei.Li" Date: Thu, 12 Jan 2023 10:38:27 +0800 Subject: [PATCH 1/4] =?UTF-8?q?=E6=97=A0JIRA=E4=BB=BB=E5=8A=A1=20fix:=20?= =?UTF-8?q?=E4=BD=BF=E7=94=A8=E8=84=9A=E6=9C=AC=E6=BC=8F=E6=8E=89=E7=9A=84?= =?UTF-8?q?=E5=B8=B8=E9=87=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/widget/dynamicdate/dynamicdate.combo.js | 8 ++++++++ src/widget/dynamicdate/dynamicdate.popup.js | 4 ++++ src/widget/dynamicdatetime/dynamicdatetime.combo.js | 8 ++++++++ src/widget/dynamicdatetime/dynamicdatetime.popup.js | 5 +++++ 4 files changed, 25 insertions(+) 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/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, From e051b9edcb67d70e8150bc7fb8b1016bcb023b03 Mon Sep 17 00:00:00 2001 From: "Zhenfei.Li" Date: Thu, 12 Jan 2023 11:53:22 +0800 Subject: [PATCH 2/4] =?UTF-8?q?=E6=97=A0JIRA=E4=BB=BB=E5=8A=A1=20fix:=20th?= =?UTF-8?q?is=E6=8C=87=E5=90=91=E9=94=99=E8=AF=AF=E7=9A=84bug?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/widget/date/calendar/popup.year.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) 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); }, }); From a2ca12a140abfa12d41116b0fafd01ba4721f2b6 Mon Sep 17 00:00:00 2001 From: "Zhenfei.Li" Date: Thu, 12 Jan 2023 14:11:00 +0800 Subject: [PATCH 3/4] KERNEL-14092 refactor: widget/timeinterval --- src/case/calendar/calendar.date.item.js | 8 +- src/case/calendar/calendar.js | 65 +++-- src/case/calendar/calendar.year.js | 52 ++-- src/core/logic/index.js | 26 +- src/widget/dynamicdate/dynamicdate.trigger.js | 4 +- src/widget/timeinterval/dateinterval.js | 259 ++++++++++-------- src/widget/timeinterval/index.js | 3 + src/widget/timeinterval/timeinterval.js | 246 +++++++++-------- src/widget/timeinterval/timeperiods.js | 174 ++++++------ 9 files changed, 442 insertions(+), 395 deletions(-) create mode 100644 src/widget/timeinterval/index.js 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/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/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/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(), + }; + } +} From 4f4e84c4197f837227bad80a1bd1ed26cc274998 Mon Sep 17 00:00:00 2001 From: "Zhenfei.Li" Date: Thu, 12 Jan 2023 14:44:29 +0800 Subject: [PATCH 4/4] =?UTF-8?q?KERNEL-14093=20refactor:=20widget/editor?= =?UTF-8?q?=E3=80=81numbereditor=E3=80=81numberinterval?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/widget/editor/editor.search.js | 280 ++++----- src/widget/editor/editor.search.small.js | 34 +- src/widget/editor/editor.text.js | 198 +++--- src/widget/editor/editor.text.small.js | 34 +- src/widget/editor/index.js | 4 + src/widget/index.js | 29 +- src/widget/numbereditor/number.editor.js | 260 ++++---- src/widget/numberinterval/numberinterval.js | 570 +++++++++--------- .../singleeditor/single.editor.js | 120 ++-- 9 files changed, 789 insertions(+), 740 deletions(-) create mode 100644 src/widget/editor/index.js 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 6ce1b935c..499020348 100644 --- a/src/widget/index.js +++ b/src/widget/index.js @@ -6,11 +6,14 @@ 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 { 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"; Object.assign(BI, { Collapse, @@ -21,11 +24,14 @@ Object.assign(BI, { ...datetimepane, ...dynamicdatetime, ...time, + ...editor, SelectTreeCombo, SingleTreeCombo, MultiTreeCombo, MultiTreeInsertCombo, - MultiTreeListCombo + MultiTreeListCombo, + NumberEditor, + NumberInterval, }); export * from "./date/calendar"; @@ -35,11 +41,14 @@ export * from "./datetime"; export * from "./datetimepane"; export * from "./dynamicdatetime"; export * from "./time"; -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 "./editor"; export { - Collapse + Collapse, + NumberEditor, + NumberInterval, + SelectTreeCombo, + SingleTreeCombo, + MultiTreeCombo, + MultiTreeInsertCombo, + MultiTreeListCombo }; 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 +}