Merge branch 'es6' of ssh://code.fineres.com:7999/~dailer/fineui into es6

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() {

src/case/calendar/calendar.js

@@ -1,13 +1,42 @@
+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,
-        };
-    },
-});
-

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;
-    },
-});
-
-

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:

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);
             },
         });
 

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,

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,

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;

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,

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,

src/widget/editor/editor.search.js

@@ -1,52 +1,35 @@
-import {
-    shortcut,
-    Widget,
-    extend,
-    i18nText,
-    emptyFn,
-    createWidget,
-    toPix,
-    isKey,
-    Controller,
-    Events,
-    HTapeLayout,
-    isEndWithBlank
-} from "@/core";
+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";
+    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"}`,
+            baseCls: `bi-search-editor bi-focus-shadow ${config.simple ? "bi-border-bottom" : "bi-border bi-border-radius"}`,
             height: 24,
             errorText: "",
             watermark: i18nText("BI-Basic_Search"),
@@ -58,8 +41,7 @@ export class SearchEditor extends Widget {
 
     _init() {
         super._init(...arguments);
-        const self = this,
-            o = this.options;
+        const o = this.options;
         this.editor = createWidget(o.el, {
             type: Editor.xtype,
             simple: o.simple,
@@ -80,22 +62,17 @@ export class SearchEditor extends Widget {
             invisible: !isKey(o.value),
         });
         this.clear.on(IconButton.EVENT_CHANGE, () => {
-            self.setValue("");
-            self.fireEvent(
-                Controller.EVENT_CHANGE,
-                Events.STOPEDIT,
-                self.getValue()
-            );
+            this.setValue("");
+            this.fireEvent(Controller.EVENT_CHANGE, Events.STOPEDIT, this.getValue());
             // 从有内容到无内容的清空也是一次change
-            self.fireEvent(SearchEditor.EVENT_CHANGE);
-            self.fireEvent(SearchEditor.EVENT_CLEAR);
+            this.fireEvent(SearchEditor.EVENT_CHANGE);
+            this.fireEvent(SearchEditor.EVENT_CLEAR);
         });
         createWidget({
             element: this,
             height: toPix(o.height, o.simple ? 1 : 2),
             type: HTapeLayout.xtype,
-            items: [
-                {
+            items: [{
                 el: {
                     type: IconLabel.xtype,
                     cls: "search-font",
@@ -103,7 +80,7 @@ export class SearchEditor extends Widget {
                 width: 24,
             },
             {
-                    el: self.editor,
+                el: this.editor,
             },
             {
                 el: this.clear,
@@ -111,66 +88,67 @@ export class SearchEditor extends Widget {
             }
             ],
         });
-        this.editor.on(Controller.EVENT_CHANGE, function () {
-            self.fireEvent(Controller.EVENT_CHANGE, arguments);
+        this.editor.on(Controller.EVENT_CHANGE, (...args) => {
+            this.fireEvent(Controller.EVENT_CHANGE, ...args);
         });
 
         this.editor.on(Editor.EVENT_FOCUS, () => {
-            self.fireEvent(SearchEditor.EVENT_FOCUS);
+            this.fireEvent(SearchEditor.EVENT_FOCUS);
         });
         this.editor.on(Editor.EVENT_BLUR, () => {
-            self.fireEvent(SearchEditor.EVENT_BLUR);
+            this.fireEvent(SearchEditor.EVENT_BLUR);
         });
         this.editor.on(Editor.EVENT_CLICK, () => {
-            self.fireEvent(SearchEditor.EVENT_CLICK);
+            this.fireEvent(SearchEditor.EVENT_CLICK);
         });
         this.editor.on(Editor.EVENT_CHANGE, () => {
-            self._checkClear();
-            self.fireEvent(SearchEditor.EVENT_CHANGE);
+            this._checkClear();
+            this.fireEvent(SearchEditor.EVENT_CHANGE);
         });
         this.editor.on(Editor.EVENT_KEY_DOWN, v => {
-            self.fireEvent(SearchEditor.EVENT_KEY_DOWN, v);
+            this.fireEvent(SearchEditor.EVENT_KEY_DOWN, v);
         });
         this.editor.on(Editor.EVENT_SPACE, () => {
-            self.fireEvent(SearchEditor.EVENT_SPACE);
+            this.fireEvent(SearchEditor.EVENT_SPACE);
         });
         this.editor.on(Editor.EVENT_BACKSPACE, () => {
-            self.fireEvent(SearchEditor.EVENT_BACKSPACE);
+            this.fireEvent(SearchEditor.EVENT_BACKSPACE);
         });
 
+
         this.editor.on(Editor.EVENT_VALID, () => {
-            self.fireEvent(SearchEditor.EVENT_VALID);
+            this.fireEvent(SearchEditor.EVENT_VALID);
         });
         this.editor.on(Editor.EVENT_ERROR, () => {
-            self.fireEvent(SearchEditor.EVENT_ERROR);
+            this.fireEvent(SearchEditor.EVENT_ERROR);
         });
         this.editor.on(Editor.EVENT_ENTER, () => {
-            self.fireEvent(SearchEditor.EVENT_ENTER);
+            this.fireEvent(SearchEditor.EVENT_ENTER);
         });
         this.editor.on(Editor.EVENT_RESTRICT, () => {
-            self.fireEvent(SearchEditor.EVENT_RESTRICT);
+            this.fireEvent(SearchEditor.EVENT_RESTRICT);
         });
         this.editor.on(Editor.EVENT_EMPTY, () => {
-            self._checkClear();
-            self.fireEvent(SearchEditor.EVENT_EMPTY);
+            this._checkClear();
+            this.fireEvent(SearchEditor.EVENT_EMPTY);
         });
         this.editor.on(Editor.EVENT_REMOVE, () => {
-            self.fireEvent(SearchEditor.EVENT_REMOVE);
+            this.fireEvent(SearchEditor.EVENT_REMOVE);
         });
         this.editor.on(Editor.EVENT_CONFIRM, () => {
-            self.fireEvent(SearchEditor.EVENT_CONFIRM);
+            this.fireEvent(SearchEditor.EVENT_CONFIRM);
         });
         this.editor.on(Editor.EVENT_CHANGE_CONFIRM, () => {
-            self.fireEvent(SearchEditor.EVENT_CHANGE_CONFIRM);
+            this.fireEvent(SearchEditor.EVENT_CHANGE_CONFIRM);
         });
         this.editor.on(Editor.EVENT_START, () => {
-            self.fireEvent(SearchEditor.EVENT_START);
+            this.fireEvent(SearchEditor.EVENT_START);
         });
         this.editor.on(Editor.EVENT_PAUSE, () => {
-            self.fireEvent(SearchEditor.EVENT_PAUSE);
+            this.fireEvent(SearchEditor.EVENT_PAUSE);
         });
         this.editor.on(Editor.EVENT_STOP, () => {
-            self.fireEvent(SearchEditor.EVENT_STOP);
+            this.fireEvent(SearchEditor.EVENT_STOP);
         });
     }
 

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);

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);
+}

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);

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";

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 { NumberEditor } from "./numbereditor/number.editor";
+import { NumberInterval } from "./numberinterval/numberinterval";
 import * as multiselect from "./multiselect";
 import * as multiselectlist from "./multiselectlist";
 
@@ -23,11 +26,14 @@ Object.assign(BI, {
     ...datetimepane,
     ...dynamicdatetime,
     ...time,
+    ...editor,
     SelectTreeCombo,
     SingleTreeCombo,
     MultiTreeCombo,
     MultiTreeInsertCombo,
     MultiTreeListCombo,
+    NumberEditor,
+    NumberInterval,
     ...multiselect,
     ...multiselectlist,
 });
@@ -38,7 +44,8 @@ export * from "./datepane";
 export * from "./datetime";
 export * from "./datetimepane";
 export * from "./dynamicdatetime";
-export * from "./time";
+export * from "./time
+export * from "./editor";
 export { SelectTreeCombo } from "./selecttree/selecttree.combo";
 export { SingleTreeCombo } from "./singletree/singletree.combo";
 export { MultiTreeCombo } from "./multitree/multi.tree.combo";
@@ -48,5 +55,12 @@ export * from "./multiselect";
 export * from "./multiselectlist";
               
 export {
-    Collapse
+    Collapse,
+    NumberEditor,
+    NumberInterval,
+    SelectTreeCombo,
+    SingleTreeCombo,
+    MultiTreeCombo,
+    MultiTreeInsertCombo,
+    MultiTreeListCombo
 };

src/widget/numbereditor/number.editor.js

@@ -1,128 +1,133 @@
-/**
- * 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,
+            listeners: [{
+                eventName: SignEditor.EVENT_QUICK_DOWN,
                 action: e => {
-                        if ([BI.KeyCode.UP, BI.KeyCode.DOWN].includes(e.keyCode)) {
+                    if ([KeyCode.UP, KeyCode.DOWN].includes(e.keyCode)) {
                         e.preventDefault();
                     }
                 },
             },
             {
-                    eventName: BI.SignEditor.EVENT_KEY_DOWN,
-                    action: (keycode) => {
-                        if (keycode === BI.KeyCode.UP) {
+                eventName: SignEditor.EVENT_KEY_DOWN,
+                action: keycode => {
+                    if (keycode === KeyCode.UP) {
                         this._finetuning(o.step);
 
                         return;
                     }
-                        if (keycode === BI.KeyCode.DOWN) {
+                    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: [
-                            {
+                        items: [{
                             column: 0,
                             row: 0,
                             el: this.topBtn,
@@ -130,73 +135,70 @@ BI.NumberEditor = BI.inherit(BI.Widget, {
                             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);
+    }
+}

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 "";
             
+            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 "";
-
-
         
+        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, {
+                Bubbles.show(c.typeError, i18nText("BI-Numerical_Interval_Input_Data"), self, {
                     offsetStyle: "left",
-                        adjustYOffset: c.adjustYOffset
+                    adjustYOffset: c.adjustYOffset,
                 });
                 break;
             case c.numberError:
-                    BI.Bubbles.show(c.numberError, BI.i18nText("BI-Numerical_Interval_Number_Value"), self, {
+                Bubbles.show(c.numberError, i18nText("BI-Numerical_Interval_Number_Value"), self, {
                     offsetStyle: "left",
-                        adjustYOffset: c.adjustYOffset
+                    adjustYOffset: c.adjustYOffset,
                 });
                 break;
             case c.signalError:
-                    BI.Bubbles.show(c.signalError, BI.i18nText("BI-Numerical_Interval_Signal_Value"), self, {
+                Bubbles.show(c.signalError, i18nText("BI-Numerical_Interval_Signal_Value"), self, {
                     offsetStyle: "left",
-                        adjustYOffset: c.adjustYOffset
+                    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"));
+                self._setTitle(i18nText("BI-Numerical_Interval_Input_Data"));
                 break;
             case c.numberError:
-                    self._setTitle(BI.i18nText("BI-Numerical_Interval_Number_Value"));
+                self._setTitle(i18nText("BI-Numerical_Interval_Number_Value"));
                 break;
             case c.signalError:
-                    self._setTitle(BI.i18nText("BI-Numerical_Interval_Signal_Value"));
+                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, {
+                Bubbles.show(c.numberError, i18nText("BI-Numerical_Interval_Number_Value"), self, {
                     offsetStyle: "left",
-                        adjustYOffset: c.adjustYOffset
+                    adjustYOffset: c.adjustYOffset,
                 });
-                    self.fireEvent(BI.NumberInterval.EVENT_ERROR);
+                self.fireEvent(NumberInterval.EVENT_ERROR);
                 break;
             case c.signalError:
-                    BI.Bubbles.show(c.signalError, BI.i18nText("BI-Numerical_Interval_Signal_Value"), self, {
+                Bubbles.show(c.signalError, i18nText("BI-Numerical_Interval_Signal_Value"), self, {
                     offsetStyle: "left",
-                        adjustYOffset: c.adjustYOffset
+                    adjustYOffset: c.adjustYOffset,
                 });
-                    self.fireEvent(BI.NumberInterval.EVENT_ERROR);
+                self.fireEvent(NumberInterval.EVENT_ERROR);
                 break;
             default:
-                    self.fireEvent(BI.NumberInterval.EVENT_VALID);
+                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, {
+                Bubbles.show(c.typeError, i18nText("BI-Numerical_Interval_Input_Data"), self, {
                     offsetStyle: "left",
-                        adjustYOffset: c.adjustYOffset
+                    adjustYOffset: c.adjustYOffset,
                 });
                 break;
             case c.numberError:
-                    BI.Bubbles.show(c.numberError, BI.i18nText("BI-Numerical_Interval_Number_Value"), self, {
+                Bubbles.show(c.numberError, i18nText("BI-Numerical_Interval_Number_Value"), self, {
                     offsetStyle: "left",
-                        adjustYOffset: c.adjustYOffset
+                    adjustYOffset: c.adjustYOffset,
                 });
                 break;
             case c.signalError:
-                    BI.Bubbles.show(c.signalError, BI.i18nText("BI-Numerical_Interval_Signal_Value"), self, {
+                Bubbles.show(c.signalError, i18nText("BI-Numerical_Interval_Signal_Value"), self, {
                     offsetStyle: "left",
-                        adjustYOffset: c.adjustYOffset
+                    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);
+                self._setTitle(i18nText("BI-Numerical_Interval_Input_Data"));
+                self.fireEvent(NumberInterval.EVENT_ERROR);
                 break;
             case c.numberError:
-                    self._setTitle(BI.i18nText("BI-Numerical_Interval_Number_Value"));
-                    self.fireEvent(BI.NumberInterval.EVENT_ERROR);
+                self._setTitle(i18nText("BI-Numerical_Interval_Number_Value"));
+                self.fireEvent(NumberInterval.EVENT_ERROR);
                 break;
             case c.signalError:
-                    self._setTitle(BI.i18nText("BI-Numerical_Interval_Signal_Value"));
-                    self.fireEvent(BI.NumberInterval.EVENT_ERROR);
+                self._setTitle(i18nText("BI-Numerical_Interval_Signal_Value"));
+                self.fireEvent(NumberInterval.EVENT_ERROR);
                 break;
             default:
-                    self.fireEvent(BI.NumberInterval.EVENT_CHANGE);
-                    self.fireEvent(BI.NumberInterval.EVENT_CONFIRM);
-                    self.fireEvent(BI.NumberInterval.EVENT_VALID);
+                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);

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);
+}

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);
+        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 {
-                self._clearTitle();
-                self.element.removeClass(self.constants.timeErrorCls);
-                self.fireEvent(BI.DateInterval.EVENT_CHANGE);
+                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(),
+        };
+    }
+}

src/widget/timeinterval/index.js

@@ -0,0 +1,3 @@
+export { DateInterval } from "./dateinterval";
+export { TimeInterval } from "./timeinterval";
+export { TimePeriods } from "./timeperiods";

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);
+        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 {
-                self._clearTitle();
-                self.element.removeClass(self.constants.timeErrorCls);
-                self.fireEvent(BI.TimeInterval.EVENT_CHANGE);
+                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(),
+        };
+    }
+}

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";
 
-!(function () {
-    BI.TimePeriods = BI.inherit(BI.Single, {
-        constants: {
-            height: 24,
-            width: 24,
-            hgap: 15,
-            offset: -15
-        },
-        props: {
+@shortcut()
+export class TimePeriods extends Single {
+    static xtype = "bi.time_periods"
+
+    props = {
         extraCls: "bi-time-interval",
-            value: {}
-        },
+        value: {},
+    };
 
-        render: function () {
-            var self = this, o = this.options;
+    static EVENT_CONFIRM = "EVENT_CONFIRM"
+    static EVENT_CHANGE = "EVENT_CHANGE"
+
+
+    render() {
+        const 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: extend({
+                    ref: _ref => {
+                        this.left = _ref;
+                    },
+                }, this._createCombo(o.value.start, o.watermark?.start)),
             }, {
                 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: BI.extend({
-                        ref: function (_ref) {
-                            self.right = _ref;
-                        }
-                    }, this._createCombo(o.value.end, o.watermark?.end))
-                }]
-            };
+                el: extend({
+                    ref: _ref => {
+                        this.right = _ref;
                     },
+                }, this._createCombo(o.value.end, o.watermark?.end)),
+            }],
+        };
+    }
+
+    _createCombo(v, watermark) {
+        const o = this.options;
         
-        _createCombo: function (v, watermark) {
-            var self = this;
-            var o = this.options;
         return {
-                type: "bi.time_combo",
+            type: TimeCombo.xtype,
             value: v,
             height: o.height,
-                watermark: watermark,
+            watermark,
             listeners: [{
-                    eventName: BI.TimeCombo.EVENT_BEFORE_POPUPVIEW,
-                    action: function () {
-                        self.left.hidePopupView();
-                        self.right.hidePopupView();
-                    }
+                eventName: TimeCombo.EVENT_BEFORE_POPUPVIEW,
+                action: () => {
+                    this.left.hidePopupView();
+                    this.right.hidePopupView();
+                },
             }, {
-                    eventName: BI.TimeCombo.EVENT_CHANGE,
-                    action: function () {
-                        self.fireEvent(BI.TimePeriods.EVENT_CHANGE);
-                    }
+                eventName: TimeCombo.EVENT_CHANGE,
+                action: () => {
+                    this.fireEvent(TimePeriods.EVENT_CHANGE);
+                },
             }, {
-                    eventName: BI.TimeCombo.EVENT_CONFIRM,
-                    action: function () {
-                        self.fireEvent(BI.TimePeriods.EVENT_CONFIRM);
-                    }
-                }]
-            };
+                eventName: TimeCombo.EVENT_CONFIRM,
+                action: () => {
+                    this.fireEvent(TimePeriods.EVENT_CONFIRM);
                 },
+            }],
+        };
+    }
 
-        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.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(),
+        };
+    }
+}