KERNEL-13883 refactor:base/single/tip文件夹es6化

src/base/single/tip/0.tip.js

@@ -6,18 +6,19 @@
  * @extends BI.Single
  * @abstract
  */
-BI.Tip = BI.inherit(BI.Single, {
+export class Tip extends BI.Single {
-    _defaultConfig: function () {
+  _defaultConfig() {
-        var conf = BI.Tip.superclass._defaultConfig.apply(this, arguments);
+    const conf = super._defaultConfig(arguments);
-
     return BI.extend(conf, {
       _baseCls: (conf._baseCls || "") + " bi-tip",
       zIndex: BI.zIndex_tip,
   });
-    },
+  }
 
-    _init: function () {
+  _init() {
-        BI.Tip.superclass._init.apply(this, arguments);
+    super._init();
     this.element.css({ zIndex: this.options.zIndex });
-    },
+  }
-});
+}
+
+BI.extend(BI, { Tip });

src/base/single/tip/tip.toast.js

@@ -5,16 +5,22 @@
  * @class BI.Toast
  * @extends BI.Tip
  */
-BI.Toast = BI.inherit(BI.Tip, {
+
-    _const: {
+import { shortcut } from "../../../core/decorator";
+@shortcut()
+export class Toast extends BI.Tip {
+  _const= {
       closableMinWidth: 146,
       minWidth: 100,
       closableMaxWidth: 410,
       maxWidth: 400,
-    },
+  }
+
+  static EVENT_DESTORY = "EVENT_DESTORY";
+  static xtype = "bi.toast";
 
-    _defaultConfig: function () {
+  _defaultConfig() {
-        return BI.extend(BI.Toast.superclass._defaultConfig.apply(this, arguments), {
+    return BI.extend(super._defaultConfig(arguments), {
         extraCls: "bi-toast",
         text: "",
         level: "success", // success或warning
@@ -25,15 +31,16 @@ BI.Toast = BI.inherit(BI.Tip, {
         innerHgap: 4,
         hgap: 8,
     });
-    },
+  }
 
-    render: function () {
+  render() {
-        var self = this, o = this.options, c = this._const;
+    const { closable, level, autoClose, textHeight, text, hgap, vgap, innerHgap } = this.options;
+    const { closableMinWidth, minWidth, maxWidth, closableMaxWidth } = this._const;
     this.element.css({
-            minWidth: BI.pixFormat(o.closable ? c.closableMinWidth : c.minWidth),
+        minWidth: BI.pixFormat(closable ? closableMinWidth : minWidth),
-            maxWidth: BI.pixFormat(o.closable ? c.closableMaxWidth : c.maxWidth),
+        maxWidth: BI.pixFormat(closable ? closableMaxWidth : maxWidth),
     });
-        this.element.addClass("toast-" + o.level);
+    this.element.addClass("toast-" + level);
     function fn(e) {
         e.stopPropagation();
         e.stopEvent();
@@ -49,8 +56,8 @@ BI.Toast = BI.inherit(BI.Tip, {
         mouseleave: fn,
         mousemove: fn,
     });
-        var cls;
+    let cls;
-        switch (o.level) {
+    switch (level) {
         case "success":
             cls = "toast-success-font";
             break;
@@ -70,32 +77,32 @@ BI.Toast = BI.inherit(BI.Tip, {
     }
 
     function hasCloseIcon() {
-            return o.closable === true || (o.closable === null && o.autoClose === false);
+        return closable === true || (closable === null && autoClose === false);
     }
-        var items = [{
+    const items = [{
         type: "bi.icon_label",
         cls: cls + " toast-icon",
-            height: o.textHeight,
+        height: textHeight,
     }, {
-            el: BI.isPlainObject(o.text) ? o.text : {
+        el: BI.isPlainObject(text) ? text : {
             type: "bi.label",
             whiteSpace: "normal",
-                text: o.text,
+            text: text,
-                textHeight: o.textHeight,
+            textHeight: textHeight,
             textAlign: "left",
         },
     }];
 
-        var columnSize = ["", "fill"];
+    const columnSize = ["", "fill"];
 
     if (hasCloseIcon()) {
         items.push({
             type: "bi.icon_button",
             cls: "close-font toast-icon",
-                handler: function () {
+            handler: ()=> {
-                    self.destroy();
+                this.destroy();
             },
-                height: o.textHeight,
+            height: textHeight,
         });
         columnSize.push("");
     }
@@ -104,16 +111,17 @@ BI.Toast = BI.inherit(BI.Tip, {
         type: "bi.horizontal",
         horizontalAlign: BI.HorizontalAlign.Stretch,
         items: items,
-            hgap: o.hgap,
+        hgap: hgap,
-            vgap: o.vgap,
+        vgap: vgap,
-            innerHgap: o.innerHgap,
+        innerHgap: innerHgap,
         columnSize: columnSize,
     };
-    },
+  }
 
-    beforeDestroy: function () {
+  beforeDestroy() {
-        this.fireEvent(BI.Toast.EVENT_DESTORY);
+    this.fireEvent(Toast.EVENT_DESTORY);
-    },
+  }
-});
+
-BI.Toast.EVENT_DESTORY = "EVENT_DESTORY";
+}
-BI.shortcut("bi.toast", BI.Toast);
+
+BI.extend(BI, { Toast });

src/base/single/tip/tip.tooltip.js

@@ -5,14 +5,18 @@
  * @class BI.Tooltip
  * @extends BI.Tip
  */
-BI.Tooltip = BI.inherit(BI.Tip, {
+
-    _const: {
+import { shortcut } from "../../../core/decorator";
+@shortcut()
+export class Tooltip extends BI.Tip {
+    _const = {
         hgap: 8,
         vgap: 4,
-    },
+    }
+  static xtype = "bi.tooltip";
   
-    _defaultConfig: function () {
+  _defaultConfig() {
-        return BI.extend(BI.Tooltip.superclass._defaultConfig.apply(this, arguments), {
+    return BI.extend(super._defaultConfig(arguments), {
         extraCls: "bi-tooltip",
         text: "",
         level: "success", // success或warning
@@ -20,14 +24,14 @@ BI.Tooltip = BI.inherit(BI.Tip, {
         stopPropagation: false,
         textAlign: "left",
     });
-    },
+  }
 
-    render: function () {
+  render () {
-        var o = this.options;
+    const { level, stopPropagation, stopEvent, text, textAlign  } = this.options;
-        this.element.addClass("tooltip-" + o.level);
+    this.element.addClass("tooltip-" + level);
     function fn(e) {
-            o.stopPropagation && e.stopPropagation();
+        stopPropagation && e.stopPropagation();
-            o.stopEvent && e.stopEvent();
+        stopEvent && e.stopEvent();
     }
     this.element.bind({
         click: fn,
@@ -39,7 +43,7 @@ BI.Tooltip = BI.inherit(BI.Tip, {
         mousemove: fn,
     });
 
-        var texts = (o.text + "").split("\n");
+    const texts = (text + "").split("\n");
     if (texts.length > 1) {
         BI.createWidget({
             type: "bi.vertical",
@@ -49,7 +53,7 @@ BI.Tooltip = BI.inherit(BI.Tip, {
             items: BI.map(texts, function (i, text) {
                 return {
                     type: "bi.label",
-                        textAlign: o.textAlign,
+                    textAlign: textAlign,
                     whiteSpace: "normal",
                     text: text,
                     textHeight: 18,
@@ -61,29 +65,30 @@ BI.Tooltip = BI.inherit(BI.Tip, {
             this.text = BI.createWidget({
                 type: "bi.label",
                 element: this,
-                textAlign: o.textAlign,
+                textAlign: textAlign,
                 whiteSpace: "normal",
-                text: o.text,
+                text: text,
                 title: null,
                 textHeight: 18,
                 hgap: this._const.hgap,
                 vgap: this._const.vgap,
             });
         }
-    },
+    }
 
-    setWidth: function (width) {
+    setWidth(width) {
         this.element.width(BI.pixFormat(width - 2 * this._const.hgap));
-    },
+    }
 
-    setText: function (text) {
+    setText(text) {
         this.text && this.text.setText(text);
-    },
+    }
 
-    setLevel: function (level) {
+    setLevel(level) {
         this.element.removeClass("tooltip-success").removeClass("tooltip-warning");
         this.element.addClass("tooltip-" + level);
-    },
+    }
-});
+
+}
 
-BI.shortcut("bi.tooltip", BI.Tooltip);
+BI.extend(BI, { Tooltip });