From f90147006b2c9a4bc79a59a94798327a0d57d1bf Mon Sep 17 00:00:00 2001 From: impact Date: Fri, 13 Jan 2023 15:22:53 +0800 Subject: [PATCH] =?UTF-8?q?KERNEL-14097=20refactor:=20widget/yearmonth?= =?UTF-8?q?=E3=80=81yearmonthinterval=20ES6=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/widget/dynamicdate/dynamicdate.combo.js | 28 +- src/widget/index.js | 8 +- .../yearmonth/card.dynamic.yearmonth.js | 288 ++++++----- src/widget/yearmonth/card.static.yearmonth.js | 274 +++++----- src/widget/yearmonth/combo.yearmonth.js | 342 +++++++------ src/widget/yearmonth/index.js | 5 + src/widget/yearmonth/popup.yearmonth.js | 444 +++++++++------- src/widget/yearmonth/trigger.yearmonth.js | 481 +++++++++++------- .../yearmonthinterval/yearmonthinterval.js | 309 ++++++----- 9 files changed, 1279 insertions(+), 900 deletions(-) create mode 100644 src/widget/yearmonth/index.js diff --git a/src/widget/dynamicdate/dynamicdate.combo.js b/src/widget/dynamicdate/dynamicdate.combo.js index 173327f56..ddd793132 100644 --- a/src/widget/dynamicdate/dynamicdate.combo.js +++ b/src/widget/dynamicdate/dynamicdate.combo.js @@ -7,6 +7,20 @@ import { DynamicDatePopup } from "./dynamicdate.popup"; export class DynamicDateCombo extends Single { static xtype = "bi.dynamic_date_combo" + static EVENT_KEY_DOWN = "EVENT_KEY_DOWN" + static EVENT_CONFIRM = "EVENT_CONFIRM" + static EVENT_FOCUS = "EVENT_FOCUS" + static EVENT_BLUR = "EVENT_BLUR" + static EVENT_CHANGE = "EVENT_CHANGE" + static EVENT_VALID = "EVENT_VALID" + static EVENT_ERROR = "EVENT_ERROR" + static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW" + static EVENT_BEFORE_YEAR_MONTH_POPUPVIEW = "EVENT_BEFORE_YEAR_MONTH_POPUPVIEW" + static EVENT_BEFORE_YEAR_MONTH_POPUPVIEW = "EVENT_BEFORE_YEAR_MONTH_POPUPVIEW" + + static Static = 1; + static Dynamic = 2; + constants = { popupHeight: 259, popupWidth: 270, @@ -30,20 +44,6 @@ export class DynamicDateCombo extends Single { isNeedAdjustWidth: false, }; - static EVENT_KEY_DOWN = "EVENT_KEY_DOWN" - static EVENT_CONFIRM = "EVENT_CONFIRM" - static EVENT_FOCUS = "EVENT_FOCUS" - static EVENT_BLUR = "EVENT_BLUR" - static EVENT_CHANGE = "EVENT_CHANGE" - static EVENT_VALID = "EVENT_VALID" - static EVENT_ERROR = "EVENT_ERROR" - static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW" - static EVENT_BEFORE_YEAR_MONTH_POPUPVIEW = "EVENT_BEFORE_YEAR_MONTH_POPUPVIEW" - static EVENT_BEFORE_YEAR_MONTH_POPUPVIEW = "EVENT_BEFORE_YEAR_MONTH_POPUPVIEW" - - static Static = 1; - static Dynamic = 2; - _init() { super._init(...arguments); } diff --git a/src/widget/index.js b/src/widget/index.js index acd1aaf9d..f53190f1f 100644 --- a/src/widget/index.js +++ b/src/widget/index.js @@ -17,6 +17,8 @@ import { MultiTreeInsertCombo } from "./multitree/multi.tree.insert.combo"; import { MultiTreeListCombo } from "./multitree/multi.tree.list.combo"; import { NumberEditor } from "./numbereditor/number.editor"; import { NumberInterval } from "./numberinterval/numberinterval"; +import { YearMonthInterval } from "./yearmonthinterval/yearmonthinterval"; +import * as yearmonth from "./yearmonth"; import * as multiselect from "./multiselect"; import * as multiselectlist from "./multiselectlist"; import * as multilayerselectree from "./multilayerselecttree"; @@ -49,6 +51,8 @@ Object.assign(BI, { NumberEditor, NumberInterval, YearInterval, + YearMonthInterval, + ...yearmonth, ...multiselect, ...multiselectlist, ...multilayerselectree, @@ -65,6 +69,7 @@ export * from "./datetimepane"; export * from "./dynamicdatetime"; export * from "./time"; export * from "./editor"; +export * from "./yearmonth"; export * from "./multiselect"; export * from "./multiselectlist"; export * from "./downlist"; @@ -86,5 +91,6 @@ export { MultiTreeCombo, MultiTreeInsertCombo, MultiTreeListCombo, - YearInterval + YearInterval, + YearMonthInterval }; diff --git a/src/widget/yearmonth/card.dynamic.yearmonth.js b/src/widget/yearmonth/card.dynamic.yearmonth.js index 786b22a00..bb11efd8c 100644 --- a/src/widget/yearmonth/card.dynamic.yearmonth.js +++ b/src/widget/yearmonth/card.dynamic.yearmonth.js @@ -1,166 +1,212 @@ -/** - * 年月展示面板 - * - * Created by GUY on 2015/9/2. - * @class BI.YearCard - * @extends BI.Trigger - */ -BI.DynamicYearMonthCard = BI.inherit(BI.Widget, { - - props: { - baseCls: "bi-year-month-card" - }, - - render: function () { - var self = this; +import { + shortcut, + Widget, + i18nText, + bind, + VerticalLayout, + parseDateTime, + extend, + checkDateVoid, + isNotEmptyString +} from "@/core"; +import { DynamicDateCard, DynamicDateParamItem, DynamicDateHelper } from "../dynamicdate"; +import { Label, Bubbles } from "@/base"; + +@shortcut() +export class DynamicYearMonthCard extends Widget { + static xtype = "bi.dynamic_year_month_card"; + + static EVENT_CHANGE = "EVENT_CHANGE"; + + props = { baseCls: "bi-year-month-card" }; + + render() { return { - type: "bi.vertical", - items: [{ - type: "bi.label", - text: BI.i18nText("BI-Multi_Date_Relative_Current_Time"), - textAlign: "left", - height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, - }, { - type: "bi.vertical", - ref: function (_ref) { - self.wrapper = _ref; + type: VerticalLayout.xtype, + items: [ + { + type: Label.xtype, + text: i18nText("BI-Multi_Date_Relative_Current_Time"), + textAlign: "left", + height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, }, - items: [{ - el: { - type: "bi.dynamic_date_param_item", - validationChecker: BI.bind(self._checkDate, self), - ref: function () { - self.year = this; - }, - listeners: [{ - eventName: "EVENT_CHANGE", - action: function () { - self.fireEvent("EVENT_CHANGE"); - } - }, { - eventName: "EVENT_INPUT_CHANGE", - action: function () { - BI.Bubbles.hide("dynamic-year-month-error"); - } - }] - }, - bgap: 10, - }, { - type: "bi.dynamic_date_param_item", - dateType: BI.DynamicDateCard.TYPE.MONTH, - ref: function () { - self.month = this; + { + type: VerticalLayout.xtype, + ref: _ref => { + this.wrapper = _ref; }, - listeners: [{ - eventName: "EVENT_CHANGE", - action: function () { - self.fireEvent("EVENT_CHANGE"); - } - }, { - eventName: "EVENT_INPUT_CHANGE", - action: function () { - BI.Bubbles.hide("dynamic-year-month-error"); + items: [ + { + el: { + type: DynamicDateParamItem.xtype, + validationChecker: bind(this._checkDate, this), + ref: _ref => { + this.year = _ref; + }, + listeners: [ + { + eventName: "EVENT_CHANGE", + action: () => { + this.fireEvent("EVENT_CHANGE"); + }, + }, + { + eventName: "EVENT_INPUT_CHANGE", + action: () => { + Bubbles.hide( + "dynamic-year-month-error" + ); + }, + } + ], + }, + bgap: 10, + }, + { + type: DynamicDateParamItem.xtype, + dateType: DynamicDateCard.TYPE.MONTH, + ref: _ref => { + this.month = _ref; + }, + listeners: [ + { + eventName: "EVENT_CHANGE", + action: () => { + this.fireEvent("EVENT_CHANGE"); + }, + }, + { + eventName: "EVENT_INPUT_CHANGE", + action: () => { + Bubbles.hide( + "dynamic-year-month-error" + ); + }, + } + ], } - }] - }] - }], + ], + } + ], vgap: 10, - hgap: 10 + hgap: 10, }; - }, + } + + _getErrorText() { + const o = this.options; + const start = parseDateTime(o.min, "%Y-%X-%d"); + const end = parseDateTime(o.max, "%Y-%X-%d"); - _getErrorText: function () { - var o = this.options; - var start = BI.parseDateTime(o.min, "%Y-%X-%d"); - var end = BI.parseDateTime(o.max, "%Y-%X-%d"); - return BI.i18nText("BI-Basic_Year_Month_Range_Error", + return i18nText( + "BI-Basic_Year_Month_Range_Error", start.getFullYear(), start.getMonth() + 1, end.getFullYear(), end.getMonth() + 1 ); - }, + } - _checkDate: function (obj) { - var o = this.options; - var date = BI.DynamicDateHelper.getCalculation(BI.extend(this._getValue(), this._digestDateTypeValue(obj))); + _checkDate(obj) { + const o = this.options; + const date = DynamicDateHelper.getCalculation( + extend(this._getValue(), this._digestDateTypeValue(obj)) + ); - return !BI.checkDateVoid(date.getFullYear(), date.getMonth() + 1, date.getDate(), o.min, o.max)[0]; - }, + return !checkDateVoid( + date.getFullYear(), + date.getMonth() + 1, + date.getDate(), + o.min, + o.max + )[0]; + } - _digestDateTypeValue: function (value) { - var valueMap = {}; + _digestDateTypeValue(value) { + const valueMap = {}; switch (value.dateType) { - case BI.DynamicDateCard.TYPE.YEAR: - valueMap.year = (value.offset === 0 ? -value.value : +value.value); - break; - case BI.DynamicDateCard.TYPE.MONTH: - valueMap.month = (value.offset === 0 ? -value.value : +value.value); - break; - default: - break; + case DynamicDateCard.TYPE.YEAR: + valueMap.year = + value.offset === 0 ? -value.value : +value.value; + break; + case DynamicDateCard.TYPE.MONTH: + valueMap.month = + value.offset === 0 ? -value.value : +value.value; + break; + default: + break; } + return valueMap; - }, + } - _createValue: function (type, v) { + _createValue(type, v) { return { dateType: type, value: Math.abs(v), - offset: v > 0 ? 1 : 0 + offset: v > 0 ? 1 : 0, }; - }, + } - setMinDate: function(minDate) { - if (BI.isNotEmptyString(this.options.min)) { + setMinDate(minDate) { + if (isNotEmptyString(this.options.min)) { this.options.min = minDate; } - }, + } - setMaxDate: function (maxDate) { - if (BI.isNotEmptyString(this.options.max)) { + setMaxDate(maxDate) { + if (isNotEmptyString(this.options.max)) { this.options.max = maxDate; } - }, + } - setValue: function (v) { - v = v || {year: 0, month: 0}; - this.year.setValue(this._createValue(BI.DynamicDateCard.TYPE.YEAR, v.year)); - this.month.setValue(this._createValue(BI.DynamicDateCard.TYPE.MONTH, v.month)); - }, + setValue(v) { + v = v || { year: 0, month: 0 }; + this.year.setValue( + this._createValue(DynamicDateCard.TYPE.YEAR, v.year) + ); + this.month.setValue( + this._createValue(DynamicDateCard.TYPE.MONTH, v.month) + ); + } - _getValue: function () { - var year = this.year.getValue(); - var month = this.month.getValue(); + _getValue() { + const year = this.year.getValue(); + const month = this.month.getValue(); + return { - year: (year.offset === 0 ? -year.value : year.value), - month: (month.offset === 0 ? -month.value : month.value) + year: year.offset === 0 ? -year.value : year.value, + month: month.offset === 0 ? -month.value : month.value, }; - }, + } - getInputValue: function () { + getInputValue() { return this._getValue(); - }, + } - getValue: function () { + getValue() { return this.checkValidation() ? this._getValue() : {}; - }, + } - checkValidation: function (show) { - var errorText; - var yearInvalid = !this.year.checkValidation(); - var monthInvalid = !this.month.checkValidation(); - var invalid = yearInvalid || monthInvalid; + checkValidation(show) { + let errorText; + const yearInvalid = !this.year.checkValidation(); + const monthInvalid = !this.month.checkValidation(); + let invalid = yearInvalid || monthInvalid; if (invalid) { - errorText = BI.i18nText("BI-Please_Input_Natural_Number"); + errorText = i18nText("BI-Please_Input_Natural_Number"); } else { invalid = !this._checkDate(this._getValue()); errorText = this._getErrorText(); } - invalid && show && BI.Bubbles.show("dynamic-year-month-error", errorText, this.wrapper); + invalid && + show && + Bubbles.show( + "dynamic-year-month-error", + errorText, + this.wrapper + ); return !invalid; - }, -}); -BI.DynamicYearMonthCard.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.dynamic_year_month_card", BI.DynamicYearMonthCard); \ No newline at end of file + } +} diff --git a/src/widget/yearmonth/card.static.yearmonth.js b/src/widget/yearmonth/card.static.yearmonth.js index 6ba4a94bc..43a111491 100644 --- a/src/widget/yearmonth/card.static.yearmonth.js +++ b/src/widget/yearmonth/card.static.yearmonth.js @@ -1,171 +1,215 @@ -BI.StaticYearMonthCard = BI.inherit(BI.Widget, { +import { + shortcut, + Widget, + chunk, + map, + toPix, + extend, + VerticalLayout, + CenterAdaptLayout, + parseDateTime, + each, + checkDateVoid, + contains, + getDate, + parseInt +} from "@/core"; +import { TextItem, ButtonGroup } from "@/base"; +import { YearPicker } from "../date/calendar"; - props: { - baseCls: "bi-static-year-month-card", - behaviors: {} - }, +@shortcut() +export class StaticYearMonthCard extends Widget { + static xtype = "bi.static_year_month_card"; - _createMonths: function () { - var self = this; + static EVENT_CHANGE = "EVENT_CHANGE"; + + props = { baseCls: "bi-static-year-month-card", behaviors: {} }; + + _createMonths() { // 纵向排列月 - var month = [1, 7, 2, 8, 3, 9, 4, 10, 5, 11, 6, 12]; - var items = BI.chunk(month, 2); - return BI.map(items, function (i, item) { - return BI.map(item, function (j, td) { - return { - type: "bi.text_item", - cls: "bi-list-item-select", - textAlign: "center", - whiteSpace: "nowrap", - once: false, - forceSelected: true, - height: BI.toPix(BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, 1), - width: 38, - value: td, - text: td, - ref: function (_ref) { - self.monthMap[j === 0 ? i : i + 6] = _ref; - } - }; - }); - }); - }, + const month = [1, 7, 2, 8, 3, 9, 4, 10, 5, 11, 6, 12]; + const items = chunk(month, 2); + + return map(items, (i, item) => map(item, (j, td) => { + return { + type: TextItem.xtype, + cls: "bi-list-item-select", + textAlign: "center", + whiteSpace: "nowrap", + once: false, + forceSelected: true, + height: toPix(BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, 1), + width: 38, + value: td, + text: td, + ref: _ref => { + this.monthMap[j === 0 ? i : i + 6] = _ref; + }, + }; + })); + } - render: function () { - var self = this, o = this.options; + render() { + const o = this.options; this.monthMap = {}; + return { - type: "bi.vertical", - items: [{ - type: "bi.year_picker", - cls: "bi-split-bottom", - min: o.min, - max: o.max, - ref: function () { - self.yearPicker = this; - }, - behaviors: o.behaviors, - height: 30, - listeners: [{ - eventName: BI.YearPicker.EVENT_CHANGE, - action: function () { - var value = this.getValue(); - self._checkMonthStatus(value); - self._setYear(value); - } - }] - }, { - el: { - type: "bi.button_group", - behaviors: o.behaviors, - ref: function () { - self.month = this; + type: VerticalLayout.xtype, + items: [ + { + type: YearPicker.xtype, + cls: "bi-split-bottom", + min: o.min, + max: o.max, + ref: _ref => { + this.yearPicker = _ref; }, - items: this._createMonths(), - layouts: [BI.LogicFactory.createLogic("table", BI.extend({ - dynamic: true - }, { - columns: 2, - rows: 6, - columnSize: [1 / 2, 1 / 2], - rowSize: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT + 1 - })), { - type: "bi.center_adapt", - vgap: 1, - hgap: 2 - }], - value: o.value, - listeners: [{ - eventName: BI.ButtonGroup.EVENT_CHANGE, - action: function () { - self.selectedYear = self.yearPicker.getValue(); - self.selectedMonth = this.getValue()[0]; - self.fireEvent(BI.StaticYearMonthCard.EVENT_CHANGE); + behaviors: o.behaviors, + height: 30, + listeners: [ + { + eventName: YearPicker.EVENT_CHANGE, + action: () => { + const value = this.yearPicker.getValue(); + this._checkMonthStatus(value); + this._setYear(value); + }, } - }] + ], }, - vgap: 5 - }] + { + el: { + type: ButtonGroup.xtype, + behaviors: o.behaviors, + ref: _ref => { + this.month = _ref; + }, + items: this._createMonths(), + layouts: [ + BI.LogicFactory.createLogic( + "table", + extend( + { + dynamic: true, + }, + { + columns: 2, + rows: 6, + columnSize: [1 / 2, 1 / 2], + rowSize: + BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT + + 1, + } + ) + ), + { + type: CenterAdaptLayout.xtype, + vgap: 1, + hgap: 2, + } + ], + value: o.value, + listeners: [ + { + eventName: ButtonGroup.EVENT_CHANGE, + action: () => { + this.selectedYear = this.yearPicker.getValue(); + this.selectedMonth = this.month.getValue()[0]; + this.fireEvent( + StaticYearMonthCard.EVENT_CHANGE + ); + }, + } + ], + }, + vgap: 5, + } + ], }; - }, + } - created: function() { + created() { this._checkMonthStatus(this.selectedYear); - }, + } - _checkMonthStatus: function (year) { - var o = this.options; - var minDate = BI.parseDateTime(o.min, "%Y-%X-%d"), maxDate = BI.parseDateTime(o.max, "%Y-%X-%d"); - var minYear = minDate.getFullYear(), maxYear = maxDate.getFullYear(); - var minMonth = 0; - var maxMonth = 11; + _checkMonthStatus(year) { + const o = this.options; + const minDate = parseDateTime(o.min, "%Y-%X-%d"), + maxDate = parseDateTime(o.max, "%Y-%X-%d"); + const minYear = minDate.getFullYear(), + maxYear = maxDate.getFullYear(); + let minMonth = 0; + let maxMonth = 11; minYear === year && (minMonth = minDate.getMonth()); maxYear === year && (maxMonth = maxDate.getMonth()); - var yearInvalid = year < minYear || year > maxYear; - BI.each(this.monthMap, function (month, obj) { - var monthInvalid = month < minMonth || month > maxMonth; + const yearInvalid = year < minYear || year > maxYear; + each(this.monthMap, (month, obj) => { + const monthInvalid = month < minMonth || month > maxMonth; obj.setEnable(!yearInvalid && !monthInvalid); }); - }, + } - _setYear: function (year) { - var o = this.options; - - var dateVoid = BI.checkDateVoid(year, this.selectedMonth, 1, o.min, o.max); + _setYear(year) { + const o = this.options; + + const dateVoid = checkDateVoid(year, this.selectedMonth, 1, o.min, o.max); // 在切换年的时候,如果月份不在区间内了,取消选中 - if (BI.contains(["y", "m"], dateVoid[0])) { + if (contains(["y", "m"], dateVoid[0])) { this.selectedYear = year; this.month.setValue(); + return; } this.selectedYear = year; this.month.setValue(this.selectedMonth); - }, + } - setMinDate: function (minDate) { + setMinDate(minDate) { if (this.options.min !== minDate) { this.options.min = minDate; this.yearPicker.setMinDate(minDate); this._checkMonthStatus(this.selectedYear); } - }, + } - setMaxDate: function (maxDate) { + setMaxDate(maxDate) { if (this.options.max !== maxDate) { this.options.max = maxDate; this.yearPicker.setMaxDate(maxDate); this._checkMonthStatus(this.selectedYear); } - }, + } - getValue: function () { + getValue() { return { year: this.selectedYear, - month: this.selectedMonth + month: this.selectedMonth, }; - }, + } - setValue: function (obj) { - var o = this.options; - var newObj = {}; + setValue(obj) { + const o = this.options; + const newObj = {}; newObj.year = obj.year || 0; newObj.month = obj.month || 0; - if (newObj.year === 0 || newObj.month === 0 || BI.checkDateVoid(newObj.year, newObj.month, 1, o.min, o.max)[0]) { - var year = newObj.year || BI.getDate().getFullYear(); + if ( + newObj.year === 0 || + newObj.month === 0 || + checkDateVoid(newObj.year, newObj.month, 1, o.min, o.max)[0] + ) { + const year = newObj.year || getDate().getFullYear(); this.selectedYear = year; this.selectedMonth = ""; this.yearPicker.setValue(year); this.month.setValue(); } else { - this.selectedYear = BI.parseInt(newObj.year); - this.selectedMonth = BI.parseInt(newObj.month); + this.selectedYear = parseInt(newObj.year); + this.selectedMonth = parseInt(newObj.month); this.yearPicker.setValue(this.selectedYear); this.month.setValue(this.selectedMonth); } this._checkMonthStatus(this.selectedYear); } -}); -BI.StaticYearMonthCard.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.static_year_month_card", BI.StaticYearMonthCard); +} diff --git a/src/widget/yearmonth/combo.yearmonth.js b/src/widget/yearmonth/combo.yearmonth.js index 0fc8cab5c..629d21d18 100644 --- a/src/widget/yearmonth/combo.yearmonth.js +++ b/src/widget/yearmonth/combo.yearmonth.js @@ -1,69 +1,98 @@ -BI.DynamicYearMonthCombo = BI.inherit(BI.Single, { +import { + shortcut, + createWidget, + toPix, + isEqual, + isNotEmptyString, + getDate, + AbsoluteLayout, + HorizontalFillLayout, + isNotNull, + isNotEmptyObject, + checkDateVoid +} from "@/core"; +import { Single, Combo, IconButton } from "@/base"; +import { DynamicYearMonthTrigger } from "./trigger.yearmonth"; +import { DynamicYearMonthPopup } from "./popup.yearmonth"; +import { DynamicDateCombo } from "../dynamicdate"; - props: { +@shortcut() +export class DynamicYearMonthCombo extends Single { + static xtype = "bi.dynamic_year_month_combo"; + + static EVENT_ERROR = "EVENT_ERROR"; + static EVENT_VALID = "EVENT_VALID"; + static EVENT_FOCUS = "EVENT_FOCUS"; + static EVENT_CONFIRM = "EVENT_CONFIRM"; + static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; + + static Static = 1; + static Dynamic = 2; + + props = { baseCls: "bi-year-month-combo", behaviors: {}, - minDate: "1900-01-01", // 最小日期 - maxDate: "2099-12-31", // 最大日期 + minDate: "1900-01-01", + maxDate: "2099-12-31", height: 24, supportDynamic: true, isNeedAdjustHeight: false, - isNeedAdjustWidth: false - }, - - _init: function () { - var self = this, o = this.options; - BI.DynamicYearMonthCombo.superclass._init.apply(this, arguments); + isNeedAdjustWidth: false, + }; + + _init() { + const o = this.options; + super._init(...arguments); this.storeValue = o.value; this.storeTriggerValue = ""; - var border = o.simple ? 1 : 2; - this.trigger = BI.createWidget({ + const border = o.simple ? 1 : 2; + this.trigger = createWidget({ type: "bi.dynamic_year_month_trigger", simple: o.simple, min: o.minDate, max: o.maxDate, - height: BI.toPix(o.height, border), + height: toPix(o.height, border), value: o.value || "", watermark: o.watermark, }); - this.trigger.on(BI.DynamicYearMonthTrigger.EVENT_KEY_DOWN, function () { - self.combo.isViewVisible() && self.combo.hideView(); + this.trigger.on(DynamicYearMonthTrigger.EVENT_KEY_DOWN, () => { + this.combo.isViewVisible() && this.combo.hideView(); }); - this.trigger.on(BI.DynamicYearMonthTrigger.EVENT_START, function () { - self.combo.isViewVisible() && self.combo.hideView(); + this.trigger.on(DynamicYearMonthTrigger.EVENT_START, () => { + this.combo.isViewVisible() && this.combo.hideView(); }); - this.trigger.on(BI.DynamicYearMonthTrigger.EVENT_STOP, function () { - self.combo.showView(); + this.trigger.on(DynamicYearMonthTrigger.EVENT_STOP, () => { + this.combo.showView(); }); - this.trigger.on(BI.DynamicYearMonthTrigger.EVENT_ERROR, function () { - self.combo.isViewVisible() && self.combo.hideView(); - self.comboWrapper.element.addClass("error"); - self.fireEvent(BI.DynamicYearMonthCombo.EVENT_ERROR); + this.trigger.on(DynamicYearMonthTrigger.EVENT_ERROR, () => { + this.combo.isViewVisible() && this.combo.hideView(); + this.comboWrapper.element.addClass("error"); + this.fireEvent(DynamicYearMonthCombo.EVENT_ERROR); }); - this.trigger.on(BI.DynamicYearMonthTrigger.EVENT_VALID, function () { - self.comboWrapper.element.removeClass("error"); - self.fireEvent(BI.DynamicYearMonthCombo.EVENT_VALID); + this.trigger.on(DynamicYearMonthTrigger.EVENT_VALID, () => { + this.comboWrapper.element.removeClass("error"); + this.fireEvent(DynamicYearMonthCombo.EVENT_VALID); }); - this.trigger.on(BI.DynamicYearMonthTrigger.EVENT_CONFIRM, function () { - var dateStore = self.storeTriggerValue; - var dateObj = self.trigger.getKey(); - if (BI.isEqual(dateObj, dateStore)) { + this.trigger.on(DynamicYearMonthTrigger.EVENT_CONFIRM, () => { + const dateStore = this.storeTriggerValue; + const dateObj = this.trigger.getKey(); + if (isEqual(dateObj, dateStore)) { return; } - if (BI.isNotEmptyString(dateObj) && !BI.isEqual(dateObj, dateStore)) { - self.storeValue = self.trigger.getValue(); - self.setValue(self.trigger.getValue()); + if (isNotEmptyString(dateObj) && !isEqual(dateObj, dateStore)) { + this.storeValue = this.trigger.getValue(); + this.setValue(this.trigger.getValue()); } - self._checkDynamicValue(self.storeValue); - self.fireEvent(BI.DynamicYearMonthCombo.EVENT_CONFIRM); + this._checkDynamicValue(this.storeValue); + this.fireEvent(DynamicYearMonthCombo.EVENT_CONFIRM); }); - this.trigger.on(BI.DynamicYearMonthTrigger.EVENT_FOCUS, function () { - self.storeTriggerValue = self.trigger.getKey(); - self.fireEvent(BI.DynamicYearMonthCombo.EVENT_FOCUS); + this.trigger.on(DynamicYearMonthTrigger.EVENT_FOCUS, () => { + this.storeTriggerValue = this.trigger.getKey(); + this.fireEvent(DynamicYearMonthCombo.EVENT_FOCUS); }); - this.combo = BI.createWidget({ - type: "bi.combo", + this.combo = createWidget({ + type: Combo.xtype, container: o.container, isNeedAdjustHeight: o.isNeedAdjustHeight, isNeedAdjustWidth: o.isNeedAdjustWidth, @@ -77,172 +106,185 @@ BI.DynamicYearMonthCombo = BI.inherit(BI.Single, { type: "bi.dynamic_year_month_popup", width: o.isNeedAdjustWidth ? o.width : undefined, supportDynamic: o.supportDynamic, - ref: function () { - self.popup = this; + ref: _ref => { + this.popup = _ref; }, listeners: [ { - eventName: BI.DynamicYearMonthPopup.EVENT_CHANGE, - action: function () { - self.setValue(self.popup.getValue()); - self.combo.hideView(); - self.fireEvent(BI.DynamicYearMonthCombo.EVENT_CONFIRM); - } - }, { - eventName: BI.DynamicYearMonthPopup.BUTTON_CLEAR_EVENT_CHANGE, - action: function () { - self.setValue(); - self.comboWrapper.element.removeClass("error"); - self.combo.hideView(); - self.fireEvent(BI.DynamicYearMonthCombo.EVENT_CONFIRM); - } - }, { - eventName: BI.DynamicYearMonthPopup.BUTTON_lABEL_EVENT_CHANGE, - action: function () { - var date = BI.getDate(); - self.setValue({ - type: BI.DynamicYearMonthCombo.Static, - value: { year: date.getFullYear(), month: date.getMonth() + 1 } + eventName: DynamicYearMonthPopup.EVENT_CHANGE, + action: () => { + this.setValue(this.popup.getValue()); + this.combo.hideView(); + this.fireEvent( + DynamicYearMonthCombo.EVENT_CONFIRM + ); + }, + }, + { + eventName: + DynamicYearMonthPopup.BUTTON_CLEAR_EVENT_CHANGE, + action: () => { + this.setValue(); + this.comboWrapper.element.removeClass("error"); + this.combo.hideView(); + this.fireEvent( + DynamicYearMonthCombo.EVENT_CONFIRM + ); + }, + }, + { + eventName: + DynamicYearMonthPopup.BUTTON_lABEL_EVENT_CHANGE, + action: () => { + const date = getDate(); + this.setValue({ + type: DynamicYearMonthCombo.Static, + value: { + year: date.getFullYear(), + month: date.getMonth() + 1, + }, }); - self.combo.hideView(); - self.fireEvent(BI.DynamicDateCombo.EVENT_CONFIRM); - } - }, { - eventName: BI.DynamicYearMonthPopup.BUTTON_OK_EVENT_CHANGE, - action: function () { - var value = self.popup.getValue(); - if (self._checkValue(value)) { - self.setValue(value); + this.combo.hideView(); + this.fireEvent(DynamicDateCombo.EVENT_CONFIRM); + }, + }, + { + eventName: + DynamicYearMonthPopup.BUTTON_OK_EVENT_CHANGE, + action: () => { + const value = this.popup.getValue(); + if (this._checkValue(value)) { + this.setValue(value); } - self.combo.hideView(); - self.fireEvent(BI.DynamicDateCombo.EVENT_CONFIRM); - } + this.combo.hideView(); + this.fireEvent(DynamicDateCombo.EVENT_CONFIRM); + }, } ], behaviors: o.behaviors, min: o.minDate, - max: o.maxDate + max: o.maxDate, }, - value: o.value || "" - } + value: o.value || "", + }, }); - this.combo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () { - self.popup.setMinDate(o.minDate); - self.popup.setMaxDate(o.maxDate); - self.popup.setValue(self.storeValue); - self.fireEvent(BI.DynamicYearMonthCombo.EVENT_BEFORE_POPUPVIEW); + this.combo.on(Combo.EVENT_BEFORE_POPUPVIEW, () => { + this.popup.setMinDate(o.minDate); + this.popup.setMaxDate(o.maxDate); + this.popup.setValue(this.storeValue); + this.fireEvent(DynamicYearMonthCombo.EVENT_BEFORE_POPUPVIEW); }); - BI.createWidget({ - type: "bi.absolute", + createWidget({ + type: AbsoluteLayout.xtype, element: this, items: [ { el: { - type: "bi.horizontal_fill", + type: HorizontalFillLayout.xtype, columnSize: ["", "fill"], - cls: (o.simple ? "bi-border-bottom" : "bi-border bi-border-radius") + " bi-focus-shadow", - ref: function () { - self.comboWrapper = this; + cls: + `${o.simple + ? "bi-border-bottom" + : "bi-border bi-border-radius" + } bi-focus-shadow`, + ref: _ref => { + this.comboWrapper = _ref; }, items: [ { el: { - type: "bi.icon_button", + type: IconButton.xtype, cls: "bi-trigger-icon-button date-change-h-font", - width: BI.toPix(o.height, border), - height: BI.toPix(o.height, border), - ref: function () { - self.changeIcon = this; - } - } - }, this.combo - ] + width: toPix(o.height, border), + height: toPix(o.height, border), + ref: _ref => { + this.changeIcon = _ref; + }, + }, + }, + this.combo + ], }, top: 0, left: 0, right: 0, - bottom: 0 + bottom: 0, } - ] + ], }); this._checkDynamicValue(o.value); - }, + } - _checkDynamicValue: function (v) { - var type = null; - if (BI.isNotNull(v)) { + _checkDynamicValue(v) { + let type = null; + if (isNotNull(v)) { type = v.type; } switch (type) { - case BI.DynamicYearMonthCombo.Dynamic: - this.changeIcon.setVisible(true); - break; - default: - this.changeIcon.setVisible(false); - break; + case DynamicYearMonthCombo.Dynamic: + this.changeIcon.setVisible(true); + break; + default: + this.changeIcon.setVisible(false); + break; } - }, + } - _checkValue: function (v) { - var o = this.options; + _checkValue(v) { + const o = this.options; switch (v.type) { - case BI.DynamicDateCombo.Dynamic: - return BI.isNotEmptyObject(v.value); - case BI.DynamicDateCombo.Static: - var value = v.value || {}; - - return !BI.checkDateVoid(value.year, value.month, 1, o.minDate, o.maxDate)[0]; - default: - return true; + case DynamicDateCombo.Dynamic: + return isNotEmptyObject(v.value); + case DynamicDateCombo.Static: { + const value = v.value || {}; + + return !checkDateVoid( + value.year, + value.month, + 1, + o.minDate, + o.maxDate + )[0]; } - }, + default: + return true; + } + } - setMinDate: function (minDate) { - var o = this.options; + setMinDate(minDate) { + const o = this.options; o.minDate = minDate; this.trigger.setMinDate(minDate); this.popup && this.popup.setMinDate(minDate); - }, + } - setMaxDate: function (maxDate) { - var o = this.options; + setMaxDate(maxDate) { + const o = this.options; o.maxDate = maxDate; this.trigger.setMaxDate(maxDate); this.popup && this.popup.setMaxDate(maxDate); - }, + } - hideView: function () { + hideView() { this.combo.hideView(); - }, + } - setValue: function (v) { + setValue(v) { this.storeValue = v; this.trigger.setValue(v); this._checkDynamicValue(v); - }, + } - getValue: function () { + getValue() { return this.storeValue; - }, + } - getKey: function () { + getKey() { return this.trigger.getKey(); - }, + } - isStateValid: function () { + isStateValid() { return this.trigger.isStateValid(); } - -}); -BI.DynamicYearMonthCombo.EVENT_ERROR = "EVENT_ERROR"; -BI.DynamicYearMonthCombo.EVENT_VALID = "EVENT_VALID"; -BI.DynamicYearMonthCombo.EVENT_FOCUS = "EVENT_FOCUS"; -BI.DynamicYearMonthCombo.EVENT_CONFIRM = "EVENT_CONFIRM"; -BI.DynamicYearMonthCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; -BI.shortcut("bi.dynamic_year_month_combo", BI.DynamicYearMonthCombo); - -BI.extend(BI.DynamicYearMonthCombo, { - Static: 1, - Dynamic: 2 -}); +} diff --git a/src/widget/yearmonth/index.js b/src/widget/yearmonth/index.js new file mode 100644 index 000000000..234f6f78c --- /dev/null +++ b/src/widget/yearmonth/index.js @@ -0,0 +1,5 @@ +export { DynamicYearMonthCard } from "./card.dynamic.yearmonth"; +export { StaticYearMonthCard } from "./card.static.yearmonth"; +export { DynamicYearMonthCombo } from "./combo.yearmonth"; +export { DynamicYearMonthPopup } from "./popup.yearmonth"; +export { DynamicYearMonthTrigger } from "./trigger.yearmonth"; diff --git a/src/widget/yearmonth/popup.yearmonth.js b/src/widget/yearmonth/popup.yearmonth.js index 1b80214d7..ad8b432a1 100644 --- a/src/widget/yearmonth/popup.yearmonth.js +++ b/src/widget/yearmonth/popup.yearmonth.js @@ -1,241 +1,329 @@ -/** - * 年月 - * - * Created by GUY on 2015/9/2. - * @class BI.DynamicYearMonthPopup - * @extends BI.Trigger - */ -BI.DynamicYearMonthPopup = BI.inherit(BI.Widget, { - constants: { - tabHeight: 40, - }, +import { + shortcut, + Widget, + toPix, + i18nText, + VerticalLayout, + GridLayout, + print, + getDate, + checkDateVoid, + createItems +} from "@/core"; +import { DynamicYearMonthCombo } from "./combo.yearmonth"; +import { TextButton, Tab } from "@/base"; +import { DynamicDateCombo, DynamicDateHelper } from "../dynamicdate"; +// import { DynamicYearCombo } from "../year/combo.year"; +import { StaticYearMonthCard } from "./card.static.yearmonth"; +import { LinearSegment } from "@/case"; +import { DynamicYearMonthCard } from "./card.dynamic.yearmonth"; - props: { +@shortcut() +export class DynamicYearMonthPopup extends Widget { + static xtype = "bi.dynamic_year_month_popup"; + + constants = { tabHeight: 40 }; + props = { baseCls: "bi-year-month-popup", behaviors: {}, - min: "1900-01-01", // 最小日期 - max: "2099-12-31", // 最大日期, + min: "1900-01-01", + max: "2099-12-31", width: 180, supportDynamic: true, - }, + }; + + static BUTTON_CLEAR_EVENT_CHANGE = "BUTTON_CLEAR_EVENT_CHANGE"; + static BUTTON_lABEL_EVENT_CHANGE = "BUTTON_lABEL_EVENT_CHANGE"; + static BUTTON_OK_EVENT_CHANGE = "BUTTON_OK_EVENT_CHANGE"; + static EVENT_CHANGE = "EVENT_CHANGE"; - render: function () { - var self = this, opts = this.options, c = this.constants; - this.storeValue = {type: BI.DynamicYearMonthCombo.Static}; + render() { + this.storeValue = { type: DynamicYearMonthCombo.Static }; + return { - type: "bi.vertical", - items: [{ - el: this._getTabJson() - }, { - el: { - type: "bi.grid", - items: [[{ - type: "bi.text_button", - cls: "bi-split-top bi-high-light", - textHeight: BI.toPix(BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT, 1), - shadow: true, - text: BI.i18nText("BI-Basic_Clear"), - listeners: [{ - eventName: BI.TextButton.EVENT_CHANGE, - action: function () { - self.fireEvent(BI.DynamicYearMonthPopup.BUTTON_CLEAR_EVENT_CHANGE); - } - }] - }, { - type: "bi.text_button", - cls: "bi-split-left bi-split-right bi-high-light bi-split-top", - textHeight: BI.toPix(BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT, 1), - shadow: true, - text: BI.i18nText("BI-Basic_Current_Month"), - disabled: this._checkTodayValid(), - ref: function () { - self.textButton = this; - }, - listeners: [{ - eventName: BI.TextButton.EVENT_CHANGE, - action: function () { - self.fireEvent(BI.DynamicYearMonthPopup.BUTTON_lABEL_EVENT_CHANGE); - } - }] - }, { - type: "bi.text_button", - cls: "bi-split-top bi-high-light", - textHeight: BI.toPix(BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT, 1), - shadow: true, - text: BI.i18nText("BI-Basic_OK"), - listeners: [{ - eventName: BI.TextButton.EVENT_CHANGE, - action: function () { - var type = self.dateTab.getSelect(); - if (type === BI.DynamicDateCombo.Dynamic) { - self.dynamicPane.checkValidation(true) && self.fireEvent(BI.DynamicYearMonthPopup.BUTTON_OK_EVENT_CHANGE); - } else { - self.fireEvent(BI.DynamicYearMonthPopup.BUTTON_OK_EVENT_CHANGE); - } - } - }] - }]], - height: BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT + type: VerticalLayout.xtype, + items: [ + { + el: this._getTabJson(), }, - }] + { + el: { + type: GridLayout.xtype, + items: [ + [ + { + type: TextButton.xtype, + cls: "bi-split-top bi-high-light", + textHeight: toPix( + BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT, + 1 + ), + shadow: true, + text: i18nText("BI-Basic_Clear"), + listeners: [ + { + eventName: TextButton.EVENT_CHANGE, + action: () => { + this.fireEvent( + DynamicYearMonthPopup.BUTTON_CLEAR_EVENT_CHANGE + ); + }, + } + ], + }, + { + type: TextButton.xtype, + cls: "bi-split-left bi-split-right bi-high-light bi-split-top", + textHeight: toPix( + BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT, + 1 + ), + shadow: true, + text: i18nText("BI-Basic_Current_Month"), + disabled: this._checkTodayValid(), + ref: _ref => { + this.textButton = _ref; + }, + listeners: [ + { + eventName: TextButton.EVENT_CHANGE, + action: () => { + this.fireEvent( + DynamicYearMonthPopup.BUTTON_lABEL_EVENT_CHANGE + ); + }, + } + ], + }, + { + type: TextButton.xtype, + cls: "bi-split-top bi-high-light", + textHeight: toPix( + BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT, + 1 + ), + shadow: true, + text: i18nText("BI-Basic_OK"), + listeners: [ + { + eventName: TextButton.EVENT_CHANGE, + action: () => { + const type = + this.dateTab.getSelect(); + if ( + type === + DynamicDateCombo.Dynamic + ) { + this.dynamicPane.checkValidation( + true + ) && + this.fireEvent( + DynamicYearMonthPopup.BUTTON_OK_EVENT_CHANGE + ); + } else { + this.fireEvent( + DynamicYearMonthPopup.BUTTON_OK_EVENT_CHANGE + ); + } + }, + } + ], + } + ] + ], + height: BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT, + }, + } + ], }; - }, + } - _setInnerValue: function () { - if (this.dateTab.getSelect() === BI.DynamicDateCombo.Static) { - this.textButton.setValue(BI.i18nText("BI-Basic_Current_Month")); + _setInnerValue() { + if (this.dateTab.getSelect() === DynamicDateCombo.Static) { + this.textButton.setValue(i18nText("BI-Basic_Current_Month")); this.textButton.setEnable(!this._checkTodayValid()); } else { - var date = BI.DynamicDateHelper.getCalculation(this.dynamicPane.getInputValue()); - date = BI.print(date, "%Y-%x"); + let date = DynamicDateHelper.getCalculation( + this.dynamicPane.getInputValue() + ); + date = print(date, "%Y-%x"); this.textButton.setValue(date); this.textButton.setEnable(false); } - }, + } - _checkTodayValid: function () { - var o = this.options; - var today = BI.getDate(); - return !!BI.checkDateVoid(today.getFullYear(), today.getMonth() + 1, today.getDate(), o.min, o.max)[0]; - }, + _checkTodayValid() { + const o = this.options; + const today = getDate(); + + return !!checkDateVoid( + today.getFullYear(), + today.getMonth() + 1, + today.getDate(), + o.min, + o.max + )[0]; + } - _getTabJson: function () { - var self = this, o = this.options; + _getTabJson() { + const o = this.options; + return { - type: "bi.tab", + type: Tab.xtype, logic: { - dynamic: true + dynamic: true, }, - ref: function () { - self.dateTab = this; + ref: _ref => { + this.dateTab = _ref; }, tab: { - type: "bi.linear_segment", + type: LinearSegment.xtype, cls: "bi-split-bottom", invisible: !o.supportDynamic, height: this.constants.tabHeight, - items: BI.createItems([{ - text: BI.i18nText("BI-Basic_Year_Month"), - value: BI.DynamicYearCombo.Static - }, { - text: BI.i18nText("BI-Basic_Dynamic_Title"), - value: BI.DynamicYearCombo.Dynamic - }], { - textAlign: "center" - }) + items: createItems( + [ + { + text: i18nText("BI-Basic_Year_Month"), + value: BI.DynamicYearCombo.Static, + }, + { + text: i18nText("BI-Basic_Dynamic_Title"), + value: BI.DynamicYearCombo.Dynamic, + } + ], + { + textAlign: "center", + } + ), }, - cardCreator: function (v) { + cardCreator: v => { switch (v) { - case BI.DynamicYearCombo.Dynamic: - return { - type: "bi.dynamic_year_month_card", - cls: "dynamic-year-month-pane", - min: self.options.min, - max: self.options.max, - listeners: [{ + case BI.DynamicYearCombo.Dynamic: + return { + type: DynamicYearMonthCard.xtype, + cls: "dynamic-year-month-pane", + min: this.options.min, + max: this.options.max, + listeners: [ + { eventName: "EVENT_CHANGE", - action: function () { - self._setInnerValue(self.year, v); - } - }], - ref: function () { - self.dynamicPane = this; + action: () => { + this._setInnerValue(this.year, v); + }, } - }; - case BI.DynamicYearCombo.Static: - default: - return { - type: "bi.static_year_month_card", - behaviors: o.behaviors, - min: self.options.min, - max: self.options.max, - listeners: [{ - eventName: BI.StaticYearMonthCard.EVENT_CHANGE, - action: function () { - self.fireEvent(BI.DynamicYearMonthPopup.EVENT_CHANGE); - } - }], - ref: function () { - self.year = this; + ], + ref: _ref => { + this.dynamicPane = _ref; + }, + }; + case BI.DynamicYearCombo.Static: + default: + return { + type: StaticYearMonthCard.xtype, + behaviors: o.behaviors, + min: this.options.min, + max: this.options.max, + listeners: [ + { + eventName: StaticYearMonthCard.EVENT_CHANGE, + action: () => { + this.fireEvent( + DynamicYearMonthPopup.EVENT_CHANGE + ); + }, } - }; + ], + ref: _ref => { + this.year = _ref; + }, + }; } }, - listeners: [{ - eventName: BI.Tab.EVENT_CHANGE, - action: function () { - var v = self.dateTab.getSelect(); - switch (v) { - case BI.DynamicYearCombo.Static: - var date = BI.DynamicDateHelper.getCalculation(self.dynamicPane.getValue()); - self.year.setValue({year: date.getFullYear(), month: date.getMonth() + 1}); - self._setInnerValue(); + listeners: [ + { + eventName: Tab.EVENT_CHANGE, + action: () => { + const v = this.dateTab.getSelect(); + switch (v) { + case BI.DynamicYearCombo.Static: { + const date = DynamicDateHelper.getCalculation( + this.dynamicPane.getValue() + ); + this.year.setValue({ + year: date.getFullYear(), + month: date.getMonth() + 1, + }); + this._setInnerValue(); break; + } case BI.DynamicYearCombo.Dynamic: default: - if(self.storeValue && self.storeValue.type === BI.DynamicYearCombo.Dynamic) { - self.dynamicPane.setValue(self.storeValue.value); - }else{ - self.dynamicPane.setValue({ - year: 0 + if ( + this.storeValue && + this.storeValue.type === + BI.DynamicYearCombo.Dynamic + ) { + this.dynamicPane.setValue( + this.storeValue.value + ); + } else { + this.dynamicPane.setValue({ + year: 0, }); } - self._setInnerValue(); + this._setInnerValue(); break; - } + } + }, } - }] + ], }; - }, + } - setMinDate: function (minDate) { + setMinDate(minDate) { if (this.options.min !== minDate) { this.options.min = minDate; this.year && this.year.setMinDate(minDate); this.dynamicPane && this.dynamicPane.setMinDate(minDate); } - }, + } - setMaxDate: function (maxDate) { + setMaxDate(maxDate) { if (this.options.max !== maxDate) { this.options.max = maxDate; this.year && this.year.setMaxDate(maxDate); this.dynamicPane && this.dynamicPane.setMaxDate(maxDate); } - }, + } - setValue: function (v) { + setValue(v) { this.storeValue = v; - var self = this; - var type, value; v = v || {}; - type = v.type || BI.DynamicDateCombo.Static; - value = v.value || v; + const type = v.type || DynamicDateCombo.Static; + const value = v.value || v; + + + this.dateTab.setSelect(type); switch (type) { - case BI.DynamicDateCombo.Dynamic: - this.dynamicPane.setValue(value); - self._setInnerValue(); - break; - case BI.DynamicDateCombo.Static: - default: - this.year.setValue(value); - this.textButton.setValue(BI.i18nText("BI-Basic_Current_Month")); - this.textButton.setEnable(!this._checkTodayValid()); - break; + case DynamicDateCombo.Dynamic: + this.dynamicPane.setValue(value); + this._setInnerValue(); + break; + case DynamicDateCombo.Static: + default: + this.year.setValue(value); + this.textButton.setValue(i18nText("BI-Basic_Current_Month")); + this.textButton.setEnable(!this._checkTodayValid()); + break; } - }, + } - getValue: function () { + getValue() { return { type: this.dateTab.getSelect(), - value: this.dateTab.getValue() + value: this.dateTab.getValue(), }; } - -}); -BI.DynamicYearMonthPopup.BUTTON_CLEAR_EVENT_CHANGE = "BUTTON_CLEAR_EVENT_CHANGE"; -BI.DynamicYearMonthPopup.BUTTON_lABEL_EVENT_CHANGE = "BUTTON_lABEL_EVENT_CHANGE"; -BI.DynamicYearMonthPopup.BUTTON_OK_EVENT_CHANGE = "BUTTON_OK_EVENT_CHANGE"; -BI.DynamicYearMonthPopup.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.dynamic_year_month_popup", BI.DynamicYearMonthPopup); \ No newline at end of file +} diff --git a/src/widget/yearmonth/trigger.yearmonth.js b/src/widget/yearmonth/trigger.yearmonth.js index 7995a007b..029366d2c 100644 --- a/src/widget/yearmonth/trigger.yearmonth.js +++ b/src/widget/yearmonth/trigger.yearmonth.js @@ -1,101 +1,174 @@ -BI.DynamicYearMonthTrigger = BI.inherit(BI.Trigger, { - _const: { - hgap: 4, - vgap: 2, - iconWidth: 24 - }, +import { + shortcut, + bind, + createWidget, + i18nText, + HTapeLayout, + CenterLayout, + HorizontalFillLayout, + isEmptyString, + parseDateTime, + isPositiveInteger, + checkDateVoid, + isNotEmptyString, + getDate, + print, + isNotNull, + checkDateLegal, + parseInt, + isNull +} from "@/core"; +import { Trigger, TextButton } from "@/base"; +import { TriggerIconButton, SignEditor } from "@/case"; +import { DynamicDateCombo, DynamicDateHelper } from "../dynamicdate"; - props: () => ({ - extraCls: "bi-year-month-trigger", - min: "1900-01-01", // 最小日期 - max: "2099-12-31", // 最大日期 - height: 24, - watermark: { - year: BI.i18nText("BI-Basic_Unrestricted"), - month: BI.i18nText("BI-Basic_Unrestricted"), - }, - }), +@shortcut() +export class DynamicYearMonthTrigger extends Trigger { + static xtype = "bi.dynamic_year_month_trigger"; - beforeInit: function (callback) { - var o = this.options; - o.title = BI.bind(this._titleCreator, this); + _const = { hgap: 4, vgap: 2, iconWidth: 24 }; + + static EVENT_VALID = "EVENT_VALID"; + static EVENT_FOCUS = "EVENT_FOCUS"; + static EVENT_ERROR = "EVENT_ERROR"; + static EVENT_START = "EVENT_START"; + static EVENT_CONFIRM = "EVENT_CONFIRM"; + static EVENT_STOP = "EVENT_STOP"; + static EVENT_KEY_DOWN = "EVENT_KEY_DOWN"; + + props() { + return { + extraCls: "bi-year-month-trigger", + min: "1900-01-01", // 最小日期 + max: "2099-12-31", // 最大日期 + height: 24, + watermark: { + year: i18nText("BI-Basic_Unrestricted"), + month: i18nText("BI-Basic_Unrestricted"), + }, + }; + } + + beforeInit(callback) { + const o = this.options; + o.title = bind(this._titleCreator, this); callback(); - }, + } - _init: function () { - BI.DynamicYearMonthTrigger.superclass._init.apply(this, arguments); - var o = this.options; + _init() { + super._init(...arguments); + const o = this.options; this.yearEditor = this._createEditor(true); this.monthEditor = this._createEditor(false); - BI.createWidget({ + createWidget({ element: this, - type: "bi.htape", - items: [{ - type: "bi.center", - items: [{ - type: "bi.horizontal_fill", - columnSize: ["fill", ""], - items: [this.yearEditor, { - el: { - type: "bi.text_button", - text: BI.i18nText("BI-Multi_Date_Year"), - }, - }] - }, { - type: "bi.horizontal_fill", - columnSize: ["fill", ""], - items: [this.monthEditor, { - el: { - type: "bi.text_button", - text: BI.i18nText("BI-Multi_Date_Month"), + type: HTapeLayout.xtype, + items: [ + { + type: CenterLayout.xtype, + items: [ + { + type: HorizontalFillLayout.xtype, + columnSize: ["fill", ""], + items: [ + this.yearEditor, + { + el: { + type: TextButton.xtype, + text: i18nText("BI-Multi_Date_Year"), + }, + } + ], }, - }] - }] - }, { - el: { - type: "bi.trigger_icon_button", - width: this._const.iconWidth + { + type: HorizontalFillLayout.xtype, + columnSize: ["fill", ""], + items: [ + this.monthEditor, + { + el: { + type: TextButton.xtype, + text: i18nText("BI-Multi_Date_Month"), + }, + } + ], + } + ], }, - width: this._const.iconWidth - }] + { + el: { + type: TriggerIconButton.xtype, + width: this._const.iconWidth, + }, + width: this._const.iconWidth, + } + ], }); this.setValue(o.value); - }, + } - _createEditor: function (isYear) { - var self = this, o = this.options, c = this._const; - var editor = BI.createWidget({ - type: "bi.sign_editor", + _createEditor(isYear) { + const o = this.options, + c = this._const; + const editor = createWidget({ + type: SignEditor.xtype, simple: o.simple, height: o.height, - validationChecker: function (v) { + validationChecker: v => { if (isYear) { - var month = self.monthEditor.getValue(); - if(BI.isEmptyString(month)) { - month = parseInt(v, 10) === BI.parseDateTime(o.min, "%Y-%X-%d").getFullYear() ? (BI.parseDateTime(o.min, "%Y-%X-%d").getMonth() + 1) : 1; + let month = this.monthEditor.getValue(); + if (isEmptyString(month)) { + month = + parseInt(v, 10) === + parseDateTime(o.min, "%Y-%X-%d").getFullYear() + ? parseDateTime(o.min, "%Y-%X-%d").getMonth() + + 1 + : 1; } - return v === "" || (BI.isPositiveInteger(v) && !BI.checkDateVoid(v, month, 1, o.min, o.max)[0]); + + return ( + v === "" || + (isPositiveInteger(v) && + !checkDateVoid(v, month, 1, o.min, o.max)[0]) + ); } - var year = self.yearEditor.getValue(); + const year = this.yearEditor.getValue(); - return v === "" || ((BI.isPositiveInteger(v) && v >= 1 && v <= 12) && (BI.isEmptyString(year) ? true : !BI.checkDateVoid(self.yearEditor.getValue(), v, 1, o.min, o.max)[0])); - }, - quitChecker: function () { - return false; + return ( + v === "" || + (isPositiveInteger(v) && + v >= 1 && + v <= 12 && + (isEmptyString(year) + ? true + : !checkDateVoid( + this.yearEditor.getValue(), + v, + 1, + o.min, + o.max + )[0])) + ); }, + quitChecker: () => false, watermark: isYear ? o.watermark?.year : o.watermark.month, - errorText: function (v) { - var year = isYear ? v : self.yearEditor.getValue(); - var month = isYear ? self.monthEditor.getValue() : v; - if (!BI.isPositiveInteger(year) || !BI.isPositiveInteger(month) || month > 12) { - return BI.i18nText("BI-Year_Trigger_Invalid_Text"); + errorText: v => { + const year = isYear ? v : this.yearEditor.getValue(); + const month = isYear ? this.monthEditor.getValue() : v; + if ( + !isPositiveInteger(year) || + !isPositiveInteger(month) || + month > 12 + ) { + return i18nText("BI-Year_Trigger_Invalid_Text"); } - var start = BI.parseDateTime(o.min, "%Y-%X-%d"); - var end = BI.parseDateTime(o.max, "%Y-%X-%d"); + const start = parseDateTime(o.min, "%Y-%X-%d"); + const end = parseDateTime(o.max, "%Y-%X-%d"); - return BI.i18nText("BI-Basic_Year_Month_Range_Error", + return i18nText( + "BI-Basic_Year_Month_Range_Error", start.getFullYear(), start.getMonth() + 1, end.getFullYear(), @@ -104,192 +177,212 @@ BI.DynamicYearMonthTrigger = BI.inherit(BI.Trigger, { }, hgap: c.hgap, vgap: c.vgap, - allowBlank: true + allowBlank: true, }); - editor.on(BI.SignEditor.EVENT_KEY_DOWN, function () { - self.fireEvent(BI.DynamicYearMonthTrigger.EVENT_KEY_DOWN); + editor.on(SignEditor.EVENT_KEY_DOWN, () => { + this.fireEvent(DynamicYearMonthTrigger.EVENT_KEY_DOWN); }); - editor.on(BI.SignEditor.EVENT_FOCUS, function () { - self.fireEvent(BI.DynamicYearMonthTrigger.EVENT_FOCUS); + editor.on(SignEditor.EVENT_FOCUS, () => { + this.fireEvent(DynamicYearMonthTrigger.EVENT_FOCUS); }); - editor.on(BI.SignEditor.EVENT_STOP, function () { - self.fireEvent(BI.DynamicYearMonthTrigger.EVENT_STOP); + editor.on(SignEditor.EVENT_STOP, () => { + this.fireEvent(DynamicYearMonthTrigger.EVENT_STOP); }); - editor.on(BI.SignEditor.EVENT_CONFIRM, function () { - self._doEditorConfirm(editor); - self.fireEvent(BI.DynamicYearMonthTrigger.EVENT_CONFIRM); + editor.on(SignEditor.EVENT_CONFIRM, () => { + this._doEditorConfirm(editor); + this.fireEvent(DynamicYearMonthTrigger.EVENT_CONFIRM); }); - editor.on(BI.SignEditor.EVENT_SPACE, function () { + editor.on(SignEditor.EVENT_SPACE, () => { if (editor.isValid()) { editor.blur(); } }); - editor.on(BI.SignEditor.EVENT_START, function () { - self.fireEvent(BI.DynamicYearMonthTrigger.EVENT_START); + editor.on(SignEditor.EVENT_START, () => { + this.fireEvent(DynamicYearMonthTrigger.EVENT_START); }); - editor.on(BI.SignEditor.EVENT_ERROR, function () { - self.fireEvent(BI.DynamicYearMonthTrigger.EVENT_ERROR); + editor.on(SignEditor.EVENT_ERROR, () => { + this.fireEvent(DynamicYearMonthTrigger.EVENT_ERROR); }); - editor.on(BI.SignEditor.EVENT_VALID, function () { - var year = self.yearEditor.getValue(); - var month = self.monthEditor.getValue(); - if(BI.isNotEmptyString(year) && BI.isNotEmptyString(month)) { - if(BI.isPositiveInteger(year) && month >= 1 && month <= 12 && !BI.checkDateVoid(year, month, 1, o.min, o.max)[0]) { - self.fireEvent(BI.DynamicYearMonthTrigger.EVENT_VALID); + editor.on(SignEditor.EVENT_VALID, () => { + const year = this.yearEditor.getValue(); + const month = this.monthEditor.getValue(); + if (isNotEmptyString(year) && isNotEmptyString(month)) { + if ( + isPositiveInteger(year) && + month >= 1 && + month <= 12 && + !checkDateVoid(year, month, 1, o.min, o.max)[0] + ) { + this.fireEvent(DynamicYearMonthTrigger.EVENT_VALID); } } }); - editor.on(BI.SignEditor.EVENT_CHANGE, function () { - if(isYear) { - self._autoSwitch(editor); + editor.on(SignEditor.EVENT_CHANGE, () => { + if (isYear) { + this._autoSwitch(editor); } }); return editor; - }, + } - _titleCreator: function () { - var storeValue = this.storeValue || {}; - var type = storeValue.type || BI.DynamicDateCombo.Static; - var value = storeValue.value; - if(!this.monthEditor.isValid() || !this.yearEditor.isValid()) { + _titleCreator() { + const storeValue = this.storeValue || {}; + const type = storeValue.type || DynamicDateCombo.Static; + let value = storeValue.value; + if (!this.monthEditor.isValid() || !this.yearEditor.isValid()) { return ""; } switch (type) { - case BI.DynamicDateCombo.Dynamic: - var text = this._getText(value); - var date = BI.getDate(); - date = BI.DynamicDateHelper.getCalculation(value); - var dateStr = BI.print(date, "%Y-%x"); - return BI.isEmptyString(text) ? dateStr : (text + ":" + dateStr); - case BI.DynamicDateCombo.Static: - default: - value = value || {}; - return this._getStaticTitle(value); + case DynamicDateCombo.Dynamic: { + const text = this._getText(value); + let date = getDate(); + date = DynamicDateHelper.getCalculation(value); + const dateStr = print(date, "%Y-%x"); + + return isEmptyString(text) ? dateStr : `${text}:${dateStr}`; + } + case DynamicDateCombo.Static: + default: + value = value || {}; + + return this._getStaticTitle(value); } - }, + } - _doEditorConfirm: function (editor) { - var value = editor.getValue(); - if (BI.isNotNull(value)) { + _doEditorConfirm(editor) { + const value = editor.getValue(); + if (isNotNull(value)) { editor.setValue(value); } - var monthValue = this.monthEditor.getValue(); + const monthValue = this.monthEditor.getValue(); this.storeValue = { - type: BI.DynamicDateCombo.Static, + type: DynamicDateCombo.Static, value: { year: this.yearEditor.getValue(), - month: BI.isEmptyString(this.monthEditor.getValue()) ? "" : monthValue - } + month: isEmptyString(this.monthEditor.getValue()) + ? "" + : monthValue, + }, }; - }, + } - _yearCheck: function (v) { - var date = BI.print(BI.parseDateTime(v, "%Y-%X-%d"), "%Y-%X-%d"); - return BI.print(BI.parseDateTime(v, "%Y"), "%Y") === v && date >= this.options.min && date <= this.options.max; - }, + _yearCheck(v) { + const date = print(parseDateTime(v, "%Y-%X-%d"), "%Y-%X-%d"); + + return ( + print(parseDateTime(v, "%Y"), "%Y") === v && + date >= this.options.min && + date <= this.options.max + ); + } - _autoSwitch: function (editor) { - var v = editor.getValue(); - if (BI.isNotEmptyString(v) && BI.checkDateLegal(v)) { + _autoSwitch(editor) { + const v = editor.getValue(); + if (isNotEmptyString(v) && checkDateLegal(v)) { if (v.length === 4 && this._yearCheck(v)) { this._doEditorConfirm(editor); - this.fireEvent(BI.DynamicYearMonthTrigger.EVENT_CONFIRM); + this.fireEvent(DynamicYearMonthTrigger.EVENT_CONFIRM); this.monthEditor.focus(); } } - }, + } - _getText: function (obj) { - var value = ""; - if(BI.isNotNull(obj.year) && BI.parseInt(obj.year) !== 0) { - value += Math.abs(obj.year) + BI.i18nText("BI-Basic_Year") + (obj.year < 0 ? BI.i18nText("BI-Basic_Front") : BI.i18nText("BI-Basic_Behind")); + _getText(obj) { + let value = ""; + if (isNotNull(obj.year) && parseInt(obj.year) !== 0) { + value += + Math.abs(obj.year) + + i18nText("BI-Basic_Year") + + (obj.year < 0 + ? i18nText("BI-Basic_Front") + : i18nText("BI-Basic_Behind")); } - if(BI.isNotNull(obj.month) && BI.parseInt(obj.month) !== 0) { - value += Math.abs(obj.month) + BI.i18nText("BI-Basic_Month") + (obj.month < 0 ? BI.i18nText("BI-Basic_Front") : BI.i18nText("BI-Basic_Behind")); + if (isNotNull(obj.month) && parseInt(obj.month) !== 0) { + value += + Math.abs(obj.month) + + i18nText("BI-Basic_Month") + + (obj.month < 0 + ? i18nText("BI-Basic_Front") + : i18nText("BI-Basic_Behind")); } + return value; - }, + } - _setInnerValue: function (date, text) { + _setInnerValue(date, text) { this.yearEditor.setValue(date.getFullYear()); this.monthEditor.setValue(date.getMonth() + 1); - }, + } - _getStaticTitle: function (value) { + _getStaticTitle(value) { value = value || {}; - var hasYear = !(BI.isNull(value.year) || BI.isEmptyString(value.year)); - var hasMonth = !(BI.isNull(value.month) || BI.isEmptyString(value.month)); + const hasYear = !(isNull(value.year) || isEmptyString(value.year)); + const hasMonth = !(isNull(value.month) || isEmptyString(value.month)); switch ((hasYear << 1) | hasMonth) { - // !hasYear && !hasMonth - case 0: - return ""; + // !hasYear && !hasMonth + case 0: + return ""; // !hasYear && hasMonth - case 1: - return value.month; + case 1: + return value.month; // hasYear && !hasMonth - case 2: - return value.year; + case 2: + return value.year; // hasYear && hasMonth - case 3: - default: - return value.year + "-" + value.month; + case 3: + default: + return `${value.year}-${value.month}`; } - }, + } - setMinDate: function (minDate) { - if (BI.isNotEmptyString(this.options.min)) { + setMinDate(minDate) { + if (isNotEmptyString(this.options.min)) { this.options.min = minDate; } - }, + } - setMaxDate: function (maxDate) { - if (BI.isNotEmptyString(this.options.max)) { + setMaxDate(maxDate) { + if (isNotEmptyString(this.options.max)) { this.options.max = maxDate; } - }, + } - setValue: function (v) { - var type, value; - var date = BI.getDate(); + setValue(v) { + let type, value; + let date = getDate(); this.storeValue = v; - if (BI.isNotNull(v)) { - type = v.type || BI.DynamicDateCombo.Static; + if (isNotNull(v)) { + type = v.type || DynamicDateCombo.Static; value = v.value || v; } switch (type) { - case BI.DynamicDateCombo.Dynamic: - var text = this._getText(value); - date = BI.DynamicDateHelper.getCalculation(value); - this._setInnerValue(date, text); - break; - case BI.DynamicDateCombo.Static: - default: - value = value || {}; - var month = BI.isNull(value.month) ? null : value.month; - this.yearEditor.setValue(value.year); - this.monthEditor.setValue(month); - break; + case DynamicDateCombo.Dynamic: { + const text = this._getText(value); + date = DynamicDateHelper.getCalculation(value); + this._setInnerValue(date, text); + break; + } + case DynamicDateCombo.Static: + default: { + value = value || {}; + const month = isNull(value.month) ? null : value.month; + this.yearEditor.setValue(value.year); + this.monthEditor.setValue(month); + break; + } } - }, + } - getValue: function () { + getValue() { return this.storeValue; - }, + } - getKey: function () { - return this.yearEditor.getValue() + "-" + this.monthEditor.getValue(); - }, + getKey() { + return `${this.yearEditor.getValue()}-${this.monthEditor.getValue()}`; + } - isStateValid: function () { + isStateValid() { return this.yearEditor.isValid() && this.monthEditor.isValid(); } -}); -BI.DynamicYearMonthTrigger.EVENT_VALID = "EVENT_VALID"; -BI.DynamicYearMonthTrigger.EVENT_FOCUS = "EVENT_FOCUS"; -BI.DynamicYearMonthTrigger.EVENT_ERROR = "EVENT_ERROR"; -BI.DynamicYearMonthTrigger.EVENT_START = "EVENT_START"; -BI.DynamicYearMonthTrigger.EVENT_CONFIRM = "EVENT_CONFIRM"; -BI.DynamicYearMonthTrigger.EVENT_STOP = "EVENT_STOP"; -BI.DynamicYearMonthTrigger.EVENT_KEY_DOWN = "EVENT_KEY_DOWN"; -BI.shortcut("bi.dynamic_year_month_trigger", BI.DynamicYearMonthTrigger); +} diff --git a/src/widget/yearmonthinterval/yearmonthinterval.js b/src/widget/yearmonthinterval/yearmonthinterval.js index 814123f67..c2721998e 100644 --- a/src/widget/yearmonthinterval/yearmonthinterval.js +++ b/src/widget/yearmonthinterval/yearmonthinterval.js @@ -1,49 +1,74 @@ -BI.YearMonthInterval = BI.inherit(BI.Single, { - constants: { +import { + shortcut, + HorizontalFillLayout, + createWidget, + i18nText, + print, + parseDateTime, + checkDateVoid, + isNotNull, + checkDateLegal +} from "@/core"; +import { Single, Label, Bubbles } from "@/base"; +import { DynamicYearMonthCombo } from "../yearmonth/combo.yearmonth"; + +@shortcut() +export class YearMonthInterval extends Single { + static xtype = "bi.year_month_interval"; + + static EVENT_VALID = "EVENT_VALID"; + static EVENT_ERROR = "EVENT_ERROR"; + static EVENT_CHANGE = "EVENT_CHANGE"; + static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; + + constants = { width: 25, lgap: 15, offset: -15, - timeErrorCls: "time-error" - }, - - props: { + timeErrorCls: "time-error", + }; + props = { extraCls: "bi-year-month-interval", minDate: "1900-01-01", maxDate: "2099-12-31", supportDynamic: true, - height: 24 - }, + height: 24, + }; - 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); - + return { - type: "bi.horizontal_fill", + type: HorizontalFillLayout.xtype, columnSize: ["fill", "", "fill"], - items: [{ - el: self.left - }, { - el: { - type: "bi.label", - height: o.height, - hgap: 5, - text: "-", - ref: function (_ref) { - self.label = _ref; - } + items: [ + { + el: this.left, + }, + { + el: { + type: Label.xtype, + height: o.height, + hgap: 5, + text: "-", + ref: _ref => { + this.label = _ref; + }, + }, + }, + { + el: this.right, } - }, { - el: self.right - }] + ], }; - }, + } - _createCombo: function (v, watermark) { - var self = this, o = this.options; - var combo = BI.createWidget({ + _createCombo(v, watermark) { + const o = this.options; + const combo = createWidget({ type: "bi.dynamic_year_month_combo", supportDynamic: o.supportDynamic, height: o.height, @@ -51,138 +76,168 @@ BI.YearMonthInterval = BI.inherit(BI.Single, { maxDate: o.maxDate, behaviors: o.behaviors, value: v, - watermark: watermark, - listeners: [{ - eventName: BI.DynamicYearMonthCombo.EVENT_BEFORE_POPUPVIEW, - action: function () { - self.fireEvent(BI.YearMonthInterval.EVENT_BEFORE_POPUPVIEW); + watermark, + listeners: [ + { + eventName: DynamicYearMonthCombo.EVENT_BEFORE_POPUPVIEW, + action: () => { + this.fireEvent( + YearMonthInterval.EVENT_BEFORE_POPUPVIEW + ); + }, } - }] + ], }); - combo.on(BI.DynamicYearMonthCombo.EVENT_ERROR, function () { - self._clearTitle(); - BI.Bubbles.hide("error"); - self.element.removeClass(self.constants.timeErrorCls); - self.fireEvent(BI.YearMonthInterval.EVENT_ERROR); + combo.on(DynamicYearMonthCombo.EVENT_ERROR, () => { + this._clearTitle(); + Bubbles.hide("error"); + this.element.removeClass(this.constants.timeErrorCls); + this.fireEvent(YearMonthInterval.EVENT_ERROR); }); - combo.on(BI.DynamicYearMonthCombo.EVENT_VALID, function () { - self._checkValid(); + combo.on(DynamicYearMonthCombo.EVENT_VALID, () => { + this._checkValid(); }); - combo.on(BI.DynamicYearMonthCombo.EVENT_FOCUS, function () { - self._checkValid(); + combo.on(DynamicYearMonthCombo.EVENT_FOCUS, () => { + this._checkValid(); }); - combo.on(BI.DynamicYearMonthCombo.EVENT_CONFIRM, function () { - BI.Bubbles.hide("error"); - var smallDate = self.left.getKey(), bigDate = self.right.getKey(); - if (self.left.isStateValid() && self.right.isStateValid() && 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.YearMonthInterval.EVENT_ERROR); - }else{ - self._clearTitle(); - self.element.removeClass(self.constants.timeErrorCls); - self.fireEvent(BI.YearMonthInterval.EVENT_CHANGE); + combo.on(DynamicYearMonthCombo.EVENT_CONFIRM, () => { + Bubbles.hide("error"); + const smallDate = this.left.getKey(), + bigDate = this.right.getKey(); + if ( + this.left.isStateValid() && + this.right.isStateValid() && + this._check(smallDate, bigDate) && + this._compare(smallDate, bigDate) + ) { + this._setTitle(i18nText("BI-Time_Interval_Error_Text")); + this.element.addClass(this.constants.timeErrorCls); + this.fireEvent(YearMonthInterval.EVENT_ERROR); + } else { + this._clearTitle(); + this.element.removeClass(this.constants.timeErrorCls); + this.fireEvent(YearMonthInterval.EVENT_CHANGE); } }); + return combo; - }, - - - _dateCheck: function (date) { - return BI.print(BI.parseDateTime(date, "%Y-%x"), "%Y-%x") === date || BI.print(BI.parseDateTime(date, "%Y-%X"), "%Y-%X") === date; - }, + } + _dateCheck(date) { + return ( + print(parseDateTime(date, "%Y-%x"), "%Y-%x") === date || + print(parseDateTime(date, "%Y-%X"), "%Y-%X") === date + ); + } - // 判是否在最大最小之间 - _checkVoid: function (obj) { - var o = this.options; - return !BI.checkDateVoid(obj.year, obj.month, 1, o.minDate, o.maxDate)[0]; - }, + _checkVoid(obj) { + const o = this.options; + + return !checkDateVoid(obj.year, obj.month, 1, o.minDate, o.maxDate)[0]; + } - // 判格式合法 - _check: function (smallDate, bigDate) { - var smallObj = smallDate.match(/\d+/g), bigObj = bigDate.match(/\d+/g); + _check(smallDate, bigDate) { + const smallObj = smallDate.match(/\d+/g), + bigObj = bigDate.match(/\d+/g); - var smallDate4Check = ""; - if (BI.isNotNull(smallObj)) { - smallDate4Check = (smallObj[0] || "") + "-" + (smallObj[1] || 1); + let smallDate4Check = ""; + if (isNotNull(smallObj)) { + smallDate4Check = `${smallObj[0] || ""}-${smallObj[1] || 1}`; } - var bigDate4Check = ""; - if (BI.isNotNull(bigObj)) { - bigDate4Check = (bigObj[0] || "") + "-" + (bigObj[1] || 1); + let bigDate4Check = ""; + if (isNotNull(bigObj)) { + bigDate4Check = `${bigObj[0] || ""}-${bigObj[1] || 1}`; } - return this._dateCheck(smallDate4Check) && BI.checkDateLegal(smallDate4Check) && this._checkVoid({ - year: smallObj[0], - month: smallObj[1] || 1, - day: 1 - }) && this._dateCheck(bigDate4Check) && BI.checkDateLegal(bigDate4Check) && this._checkVoid({ - year: bigObj[0], - month: bigObj[1] || 1, - day: 1 - }); - }, - - _compare: function (smallDate, bigDate) { - smallDate = BI.print(BI.parseDateTime(smallDate, "%Y-%X"), "%Y-%X"); - bigDate = BI.print(BI.parseDateTime(bigDate, "%Y-%X"), "%Y-%X"); - return BI.isNotNull(smallDate) && BI.isNotNull(bigDate) && smallDate > bigDate; - }, - _setTitle: function (v) { + return ( + this._dateCheck(smallDate4Check) && + checkDateLegal(smallDate4Check) && + this._checkVoid({ + year: smallObj[0], + month: smallObj[1] || 1, + day: 1, + }) && + this._dateCheck(bigDate4Check) && + checkDateLegal(bigDate4Check) && + this._checkVoid({ + year: bigObj[0], + month: bigObj[1] || 1, + day: 1, + }) + ); + } + + _compare(smallDate, bigDate) { + smallDate = print(parseDateTime(smallDate, "%Y-%X"), "%Y-%X"); + bigDate = print(parseDateTime(bigDate, "%Y-%X"), "%Y-%X"); + + return ( + isNotNull(smallDate) && isNotNull(bigDate) && smallDate > bigDate + ); + } + + _setTitle(v) { this.setTitle(v); - }, - _clearTitle: function () { + } + + _clearTitle() { this.setTitle(""); - }, - _checkValid: function () { - var self = this; - - 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" - }); - self.fireEvent(BI.YearMonthInterval.EVENT_ERROR); + } + + _checkValid() { + 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", + } + ); + this.fireEvent(YearMonthInterval.EVENT_ERROR); } else { - self._clearTitle(); - self.element.removeClass(self.constants.timeErrorCls); + this._clearTitle(); + this.element.removeClass(this.constants.timeErrorCls); } - }, + } - 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); this._checkValid(); - }, - getValue: function () { - return {start: this.left.getValue(), end: this.right.getValue()}; } -}); -BI.YearMonthInterval.EVENT_VALID = "EVENT_VALID"; -BI.YearMonthInterval.EVENT_ERROR = "EVENT_ERROR"; -BI.YearMonthInterval.EVENT_CHANGE = "EVENT_CHANGE"; -BI.YearMonthInterval.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; -BI.shortcut("bi.year_month_interval", BI.YearMonthInterval); + + getValue() { + return { start: this.left.getValue(), end: this.right.getValue() }; + } +}