From e8f2b82e48208687bdaa8d1e3d6c669d1ea1ee4c Mon Sep 17 00:00:00 2001 From: Treecat Date: Wed, 4 Jan 2023 14:57:27 +0800 Subject: [PATCH] =?UTF-8?q?KERNEL-13962=20refact:=20es6=E6=8C=89=E9=92=AE?= =?UTF-8?q?=E7=BB=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/base/index.js | 38 ++ src/base/single/bar/bar.loading.js | 52 +- src/base/single/button/button.basic.js | 395 +++++++------- src/base/single/button/button.node.js | 56 +- src/base/single/button/buttons/button.icon.js | 48 +- .../single/button/buttons/button.image.js | 85 +-- src/base/single/button/buttons/button.js | 507 +++++++++--------- src/base/single/button/buttons/button.text.js | 72 +-- .../button/listitem/blankiconicontextitem.js | 79 +-- .../button/listitem/blankicontexticonitem.js | 74 +-- .../button/listitem/blankicontextitem.js | 75 +-- .../button/listitem/icontexticonitem.js | 76 +-- .../single/button/listitem/icontextitem.js | 73 +-- .../single/button/listitem/texticonitem.js | 71 +-- src/base/single/button/listitem/textitem.js | 69 +-- .../single/button/node/icontexticonnode.js | 67 +-- src/base/single/button/node/icontextnode.js | 66 +-- src/base/single/button/node/texticonnode.js | 67 +-- src/base/single/button/node/textnode.js | 65 ++- src/core/index.js | 3 + 20 files changed, 1094 insertions(+), 944 deletions(-) diff --git a/src/base/index.js b/src/base/index.js index b5f9c4faa..a727cb725 100644 --- a/src/base/index.js +++ b/src/base/index.js @@ -15,8 +15,46 @@ import VirtualList from "./list/virtuallist"; import GridView from "./grid/grid"; import Pager from "./pager/pager"; +import { BasicButton } from "./single/button/button.basic"; +import { NodeButton } from "./single/button/button.node"; +import { Button } from "./single/button/buttons/button"; +import { IconButton } from "./single/button/buttons/button.icon"; +import { ImageButton } from "./single/button/buttons/button.image"; +import { TextButton } from "./single/button/buttons/button.text"; +import { BlankIconIconTextItem } from "./single/button/listitem/blankiconicontextitem"; +import { BlankIconTextIconItem } from "./single/button/listitem/blankicontexticonitem"; +import { BlankIconTextItem } from "./single/button/listitem/blankicontextitem"; +import { IconTextIconItem } from "./single/button/listitem/icontexticonitem"; +import { IconTextItem } from "./single/button/listitem/icontextitem"; +import { TextIconItem } from "./single/button/listitem/texticonitem"; +import { TextItem } from "./single/button/listitem/textitem"; +import { IconTextIconNode } from "./single/button/node/icontexticonnode"; +import { IconTextNode } from "./single/button/node/icontextnode"; +import { TextIconNode } from "./single/button/node/texticonnode"; +import { TextNode } from "./single/button/node/textnode"; + + + + BI.extend(BI, { + NodeButton, + BasicButton, + Button, + IconButton, + ImageButton, + TextButton, + BlankIconIconTextItem, + BlankIconTextIconItem, + BlankIconTextItem, + IconTextIconItem, + IconTextItem, + TextIconItem, + TextItem, + IconTextIconNode, + IconTextNode, + TextIconNode, + TextNode, Pane, Single, Text, diff --git a/src/base/single/bar/bar.loading.js b/src/base/single/bar/bar.loading.js index 801331b15..f8bd97970 100644 --- a/src/base/single/bar/bar.loading.js +++ b/src/base/single/bar/bar.loading.js @@ -1,21 +1,26 @@ +import { shortcut, emptyFn } from "../../../core" /** * guy * 加载条 * @type {*|void|Object} */ -BI.LoadingBar = BI.inherit(BI.Single, { - _defaultConfig: function () { - var conf = BI.LoadingBar.superclass._defaultConfig.apply(this, arguments); +@shortcut() +class LoadingBar extends BI.Single { - return BI.extend(conf, { + static xtype = "bi.loading_bar"; + + _defaultConfig() { + const conf = super._defaultConfig.apply(this, arguments); + + return { + ...conf, baseCls: (conf.baseCls || "") + " bi-loading-bar bi-tips", height: 30, - handler: BI.emptyFn, - }); - }, + handler: emptyFn, + } + } - render: function () { - var self = this; + render() { this.loaded = BI.createWidget({ type: "bi.text_button", cls: "loading-text bi-list-item-simple", @@ -23,8 +28,8 @@ BI.LoadingBar = BI.inherit(BI.Single, { width: 120, handler: this.options.handler, }); - this.loaded.on(BI.Controller.EVENT_CHANGE, function (type) { - self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); + this.loaded.on(BI.Controller.EVENT_CHANGE, (...args) => { + this.fireEvent(BI.Controller.EVENT_CHANGE, args); }); this.loading = BI.createWidget({ @@ -33,11 +38,11 @@ BI.LoadingBar = BI.inherit(BI.Single, { height: this.options.height, cls: "loading-background cursor-default", }); - var loaded = BI.createWidget({ + const loaded = BI.createWidget({ type: "bi.center_adapt", items: [this.loaded], }); - var loading = BI.createWidget({ + const loading = BI.createWidget({ type: "bi.center_adapt", items: [this.loading], }); @@ -53,29 +58,28 @@ BI.LoadingBar = BI.inherit(BI.Single, { }], }); this.invisible(); - }, + } - _reset: function () { + _reset() { this.visible(); this.loaded.setText(BI.i18nText("BI-Load_More")); this.loaded.enable(); - }, + } - setLoaded: function () { + setLoaded() { this._reset(); this.cardLayout.showCardByName("loaded"); - }, + } - setEnd: function () { + setEnd() { this.setLoaded(); this.loaded.setText(BI.i18nText("BI-No_More_Data")); this.loaded.disable(); - }, + } - setLoading: function () { + setLoading() { this._reset(); this.cardLayout.showCardByName("loading"); - }, -}); + } +} -BI.shortcut("bi.loading_bar", BI.LoadingBar); diff --git a/src/base/single/button/button.basic.js b/src/base/single/button/button.basic.js index 64865de8b..21f1d9bc8 100644 --- a/src/base/single/button/button.basic.js +++ b/src/base/single/button/button.basic.js @@ -1,15 +1,24 @@ +import Single from "../0.single" +import { emptyFn, shortcut, extend, isFunction, createWidget, Widget, isObject, Controller } from "../../../core" + /** * guy - * @class BI.BasicButton - * @extends BI.Single + * @class BasicButton + * @extends Single * * 一般的button父级 */ -BI.BasicButton = BI.inherit(BI.Single, { - _defaultConfig: function () { - var conf = BI.BasicButton.superclass._defaultConfig.apply(this, arguments); +@shortcut() +export class BasicButton extends Single { + + static xtype = "bi.basic_button"; + + static EVENT_CHANGE = "BasicButton.EVENT_CHANGE"; + + _defaultConfig() { + const conf = super._defaultConfig(arguments); - return BI.extend(conf, { + return extend(conf, { _baseCls: (conf._baseCls || "") + " bi-basic-button" + (conf.invalid ? "" : " cursor-pointer") + ((BI.isIE() && BI.getIEVersion() < 10) ? " hack" : ""), // el: {} // 可以通过el来创建button元素 value: "", @@ -24,19 +33,18 @@ BI.BasicButton = BI.inherit(BI.Single, { shadow: false, isShadowShowingOnSelected: false, // 选中状态下是否显示阴影 trigger: null, - handler: BI.emptyFn, + handler: emptyFn, bubble: null, debounce: true }); - }, + } - _init: function () { - var self = this; - var opts = this.options; - opts.selected = BI.isFunction(opts.selected) ? this.__watch(opts.selected, function (context, newValue) { - self.setSelected(newValue); + _init() { + const opts = this.options; + opts.selected = isFunction(opts.selected) ? this.__watch(opts.selected, (context, newValue) => { + this.setSelected(newValue); }) : opts.selected; - BI.BasicButton.superclass._init.apply(this, arguments); + super._init(arguments); if (opts.shadow) { this._createShadow(); @@ -44,9 +52,9 @@ BI.BasicButton = BI.inherit(BI.Single, { if (opts.level) { this.element.addClass("button-" + opts.level); } - }, + } - _initRef: function () { + _initRef() { if (this.options.selected === true) { this.setSelected(true); } @@ -54,29 +62,29 @@ BI.BasicButton = BI.inherit(BI.Single, { BI.nextTick(() => { !this.isDestroyed() && this.bindEvent(); }); - BI.BasicButton.superclass._initRef.apply(this, arguments); - }, + super._initRef.apply(this, arguments); + } // 默认render方法 - render: function () { + render() { return this.options.el; - }, + } - _createShadow: function () { - var self = this, o = this.options; + _createShadow() { + const o = this.options; - function assertMask() { - if (!self.$mask) { - self.$mask = BI.createWidget(BI.isObject(o.shadow) ? o.shadow : {}, { + const assertMask = () => { + if (!this.$mask) { + this.$mask = createWidget(isObject(o.shadow) ? o.shadow : {}, { type: "bi.layout", cls: "bi-button-mask", }); - self.$mask.invisible(); - BI.createWidget({ + this.$mask.invisible(); + createWidget({ type: "bi.absolute", - element: self, + element: this, items: [{ - el: self.$mask, + el: this.$mask, left: 0, right: 0, top: 0, @@ -86,48 +94,129 @@ BI.BasicButton = BI.inherit(BI.Single, { } } - this.element.mouseup(function () { - if (!self._hover && !o.isShadowShowingOnSelected) { + this.element.mouseup(() => { + if (!this._hover && !o.isShadowShowingOnSelected) { assertMask(); - self.$mask.invisible(); + this.$mask.invisible(); } }); - this.element.on("mouseenter." + this.getName(), function (e) { - if (self.element.__isMouseInBounds__(e)) { - if (self.isEnabled() && !self._hover && (o.isShadowShowingOnSelected || !self.isSelected())) { + this.element.on("mouseenter." + this.getName(), (e) => { + if (this.element.__isMouseInBounds__(e)) { + if (this.isEnabled() && !this._hover && (o.isShadowShowingOnSelected || !this.isSelected())) { assertMask(); - self.$mask.visible(); + this.$mask.visible(); } } }); - this.element.on("mousemove." + this.getName(), function (e) { - if (!self.element.__isMouseInBounds__(e)) { - if (self.isEnabled() && !self._hover) { + this.element.on("mousemove." + this.getName(), (e) => { + if (!this.element.__isMouseInBounds__(e)) { + if (this.isEnabled() && !this._hover) { assertMask(); - self.$mask.invisible(); + this.$mask.invisible(); } } }); - this.element.on("mouseleave." + this.getName(), function () { - if (self.isEnabled() && !self._hover) { + this.element.on("mouseleave." + this.getName(), () => { + if (this.isEnabled() && !this._hover) { assertMask(); - self.$mask.invisible(); + this.$mask.invisible(); } }); - }, + } - bindEvent: function () { - var self = this; - var o = this.options, hand = this.handle(); + bindEvent() { + const o = this.options; + let hand = this.handle(); if (!hand) { return; } hand = hand.element; - var triggerArr = (o.trigger || "").split(","); - BI.each(triggerArr, function (idx, trigger) { + + const getBubble = () => { + const bubble = o.bubble; + if (isFunction(bubble)) { + return bubble(); + } + + return bubble; + } + + const clk = (e) => { + ev(e); + if (!this.isEnabled() || !this.isValid()) { + return; + } + if (this.isOnce() && this.isSelected()) { + return; + } + if (BI.isKey(o.bubble) || isFunction(o.bubble)) { + if (BI.isNull(this.combo)) { + let popup; + createWidget({ + type: "bi.absolute", + element: this, + items: [{ + el: { + type: "bi.bubble_combo", + trigger: "", + // bubble的提示不需要一直存在在界面上 + destroyWhenHide: true, + ref: (_ref) => { + this.combo = _ref; + }, + el: { + type: "bi.layout", + height: "100%", + }, + popup: { + type: "bi.text_bubble_bar_popup_view", + text: getBubble(), + ref: (_ref) => { + popup = _ref; + }, + listeners: [{ + eventName: BI.BubblePopupBarView.EVENT_CLICK_TOOLBAR_BUTTON, + action: (...args) => { + const [v] = args; + this.combo.hideView(); + if (v) { + onClick.apply(this, args); + } + }, + }], + }, + listeners: [{ + eventName: BI.BubbleCombo.EVENT_BEFORE_POPUPVIEW, + action: function () { + popup.populate(getBubble()); + }, + }], + }, + left: 0, + right: 0, + bottom: 0, + top: 0, + }], + }); + } + if (this.combo.isViewVisible()) { + this.combo.hideView(); + } else { + this.combo.showView(); + } + + return; + } + onClick.apply(this, arguments); + } + + + + const triggerArr = (o.trigger || "").split(","); + triggerArr.forEach((trigger) => { + let mouseDown = false; switch (trigger) { case "mouseup": - var mouseDown = false; hand.mousedown(function () { mouseDown = true; }); @@ -140,24 +229,24 @@ BI.BasicButton = BI.inherit(BI.Single, { }); break; case "mousedown": - var mouseDown = false; - var selected = false; - hand.mousedown(function (e) { + // let mouseDown = false; + let selected = false; + hand.mousedown((e) => { // if (e.button === 0) { - BI.Widget._renderEngine.createElement(document).bind("mouseup." + self.getName(), function (e) { + Widget._renderEngine.createElement(document).bind("mouseup." + this.getName(), (e) => { // if (e.button === 0) { - if (BI.DOM.isExist(self) && !hand.__isMouseInBounds__(e) && mouseDown === true && !selected) { + if (BI.DOM.isExist(this) && !hand.__isMouseInBounds__(e) && mouseDown === true && !selected) { // self.setSelected(!self.isSelected()); - self._trigger(); + this._trigger(); } mouseDown = false; - BI.Widget._renderEngine.createElement(document).unbind("mouseup." + self.getName()); + Widget._renderEngine.createElement(document).unbind("mouseup." + this.getName()); // } }); if (mouseDown === true) { return; } - if (self.isSelected()) { + if (this.isSelected()) { selected = true; } else { clk(e); @@ -166,14 +255,14 @@ BI.BasicButton = BI.inherit(BI.Single, { ev(e); // } }); - hand.mouseup(function (e) { + hand.mouseup((e) => { // if (e.button === 0) { - if (BI.DOM.isExist(self) && mouseDown === true && selected === true) { + if (BI.DOM.isExist(this) && mouseDown === true && selected === true) { clk(e); } mouseDown = false; selected = false; - BI.Widget._renderEngine.createElement(document).unbind("mouseup." + self.getName()); + Widget._renderEngine.createElement(document).unbind("mouseup." + this.getName()); // } }); break; @@ -181,22 +270,21 @@ BI.BasicButton = BI.inherit(BI.Single, { hand.dblclick(clk); break; case "lclick": - var mouseDown = false; - var interval; - hand.mousedown(function (e) { - BI.Widget._renderEngine.createElement(document).bind("mouseup." + self.getName(), function () { + let interval; + hand.mousedown((e) => { + Widget._renderEngine.createElement(document).bind("mouseup." + this.getName(), () => { interval && clearInterval(interval); interval = null; mouseDown = false; - BI.Widget._renderEngine.createElement(document).unbind("mouseup." + self.getName()); + Widget._renderEngine.createElement(document).unbind("mouseup." + this.getName()); }); if (mouseDown === true) { return; } - if (!self.isEnabled() || !self.isValid()) { + if (!this.isEnabled() || !this.isValid()) { return; } - if (self.isOnce() && self.isSelected()) { + if (this.isOnce() && this.isSelected()) { return; } interval = setInterval(function () { @@ -224,7 +312,7 @@ BI.BasicButton = BI.inherit(BI.Single, { }); // 之后的300ms点击无效 - var onClick = o.debounce ? BI.debounce(this._doClick, BI.EVENT_RESPONSE_TIME, { + let onClick = o.debounce ? BI.debounce(this._doClick, BI.EVENT_RESPONSE_TIME, { "leading": true, "trailing": false, }) : this._doClick; @@ -238,86 +326,13 @@ BI.BasicButton = BI.inherit(BI.Single, { } } - function clk(e) { - ev(e); - if (!self.isEnabled() || !self.isValid()) { - return; - } - if (self.isOnce() && self.isSelected()) { - return; - } - if (BI.isKey(o.bubble) || BI.isFunction(o.bubble)) { - if (BI.isNull(self.combo)) { - var popup; - BI.createWidget({ - type: "bi.absolute", - element: self, - items: [{ - el: { - type: "bi.bubble_combo", - trigger: "", - // bubble的提示不需要一直存在在界面上 - destroyWhenHide: true, - ref: function () { - self.combo = this; - }, - el: { - type: "bi.layout", - height: "100%", - }, - popup: { - type: "bi.text_bubble_bar_popup_view", - text: getBubble(), - ref: function () { - popup = this; - }, - listeners: [{ - eventName: BI.BubblePopupBarView.EVENT_CLICK_TOOLBAR_BUTTON, - action: function (v) { - self.combo.hideView(); - if (v) { - onClick.apply(self, arguments); - } - }, - }], - }, - listeners: [{ - eventName: BI.BubbleCombo.EVENT_BEFORE_POPUPVIEW, - action: function () { - popup.populate(getBubble()); - }, - }], - }, - left: 0, - right: 0, - bottom: 0, - top: 0, - }], - }); - } - if (self.combo.isViewVisible()) { - self.combo.hideView(); - } else { - self.combo.showView(); - } - return; - } - onClick.apply(self, arguments); - } - function getBubble() { - var bubble = self.options.bubble; - if (BI.isFunction(bubble)) { - return bubble(); - } - return bubble; - } - }, + } - _trigger: function (e) { - var o = this.options; + _trigger(e) { + const o = this.options; if (!this.isEnabled()) { return; } @@ -327,22 +342,22 @@ BI.BasicButton = BI.inherit(BI.Single, { this.setSelected(!this.isSelected())); } if (this.isValid()) { - var v = this.getValue(); + const v = this.getValue(); o.handler.call(this, v, this, e); - this.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.CLICK, v, this, e); - this.fireEvent(BI.BasicButton.EVENT_CHANGE, v, this); + this.fireEvent(Controller.EVENT_CHANGE, BI.Events.CLICK, v, this, e); + this.fireEvent(BasicButton.EVENT_CHANGE, v, this); if (o.action) { BI.Actions.runAction(o.action, "click", o, this); } BI.Actions.runGlobalAction("click", o, this); } - }, + } - _doClick: function (e) { + _doClick(e) { if (!this.isEnabled() || !this.isValid()) { return; } - var isIntercepted = this.beforeClick(e); + const isIntercepted = this.beforeClick(e); // 如果事件已经被消费掉了，就不再触发点击事件 if (isIntercepted) { return; @@ -352,41 +367,41 @@ BI.BasicButton = BI.inherit(BI.Single, { if (this.isEnabled() && this.isValid()) { this.doClick(e); } - }, + } /** * 子类可以得写这个方法，如果返回为 true，则可以阻止 handler 的触发 */ - beforeClick: function () { + beforeClick() { - }, + } - doClick: function () { + doClick() { - }, + } - handle: function () { + handle() { return this; - }, + } - hover: function () { + hover() { this._hover = true; this.handle().element.addClass("hover"); if (this.options.shadow) { this.$mask && this.$mask.setVisible(true); } - }, + } - dishover: function () { + dishover() { this._hover = false; this.handle().element.removeClass("hover"); if (this.options.shadow) { this.$mask && this.$mask.setVisible(false); } - }, + } - setSelected: function (b) { - var o = this.options; + setSelected(b) { + const o = this.options; o.selected = b; if (b) { this.handle().element.addClass("active"); @@ -397,39 +412,39 @@ BI.BasicButton = BI.inherit(BI.Single, { this.$mask && this.$mask.setVisible(false); } this.options.setSelected && this.options.setSelected.call(this, b); - }, + } - isSelected: function () { + isSelected() { return this.options.selected; - }, + } - isOnce: function () { + isOnce() { return this.options.once; - }, + } - isForceSelected: function () { + isForceSelected() { return this.options.forceSelected; - }, + } - isForceNotSelected: function () { + isForceNotSelected() { return this.options.forceNotSelected; - }, + } - isDisableSelected: function () { + isDisableSelected() { return this.options.disableSelected; - }, + } - setText: function (text) { + setText(text) { this.options.text = text; this.options.setText && this.options.setText.call(this, text); - }, + } - getText: function () { + getText() { return this.options.text; - }, + } - _setEnable: function (enable) { - BI.BasicButton.superclass._setEnable.apply(this, arguments); + _setEnable(enable) { + super._setEnable.apply(this, arguments); if (enable === true) { this.element.removeClass("base-disabled disabled"); } else if (enable === false) { @@ -440,12 +455,12 @@ BI.BasicButton = BI.inherit(BI.Single, { this.$mask && this.$mask.setVisible(false); } } - }, - - empty: function () { - BI.Widget._renderEngine.createElement(document).unbind("mouseup." + this.getName()); - BI.BasicButton.superclass.empty.apply(this, arguments); - }, -}); -BI.BasicButton.EVENT_CHANGE = "BasicButton.EVENT_CHANGE"; -BI.shortcut("bi.basic_button", BI.BasicButton); + } + + empty() { + Widget._renderEngine.createElement(document).unbind("mouseup." + this.getName()); + super.empty.apply(this, arguments); + } +} + + diff --git a/src/base/single/button/button.node.js b/src/base/single/button/button.node.js index ae4bd9045..6b2988eb3 100644 --- a/src/base/single/button/button.node.js +++ b/src/base/single/button/button.node.js @@ -1,54 +1,60 @@ +import { BasicButton } from "./button.basic" +import { shortcut, extend, Controller } from "../../../core" + /** * 表示一个可以展开的节点, 不仅有选中状态而且有展开状态 * * Created by GUY on 2015/9/9. - * @class BI.NodeButton - * @extends BI.BasicButton + * @class NodeButton + * @extends BasicButton * @abstract */ -BI.NodeButton = BI.inherit(BI.BasicButton, { - _defaultConfig: function () { - var conf = BI.NodeButton.superclass._defaultConfig.apply(this, arguments); +@shortcut() +export class NodeButton extends BasicButton { + + static xtype = "bi.node_button"; + + _defaultConfig() { + const conf = super._defaultConfig(arguments); - return BI.extend(conf, { + return extend(conf, { _baseCls: (conf._baseCls || "") + " bi-node", open: false, once: false, }); - }, + } - _initRef: function () { + _initRef() { if (this.isOpened()) { this.setOpened(this.isOpened()); } - BI.NodeButton.superclass._initRef.apply(this, arguments); - }, + super._initRef.apply(this, arguments); + } - doClick: function () { - BI.NodeButton.superclass.doClick.apply(this, arguments); + doClick() { + super.doClick.apply(this, arguments); this.setOpened(!this.isOpened()); - }, + } - isOpened: function () { + isOpened() { return !!this.options.open; - }, + } - setOpened: function (b) { + setOpened(b) { this.options.open = !!b; - }, + } - triggerCollapse: function () { + triggerCollapse() { if (this.isOpened()) { this.setOpened(false); - this.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.COLLAPSE, this.getValue(), this); + this.fireEvent(Controller.EVENT_CHANGE, BI.Events.COLLAPSE, this.getValue(), this); } - }, + } - triggerExpand: function () { + triggerExpand() { if (!this.isOpened()) { this.setOpened(true); - this.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.EXPAND, this.getValue(), this); + this.fireEvent(Controller.EVENT_CHANGE, BI.Events.EXPAND, this.getValue(), this); } - }, -}); -BI.shortcut("bi.node_button", BI.NodeButton); + } +} \ No newline at end of file diff --git a/src/base/single/button/buttons/button.icon.js b/src/base/single/button/buttons/button.icon.js index 045126c38..9e8228a55 100644 --- a/src/base/single/button/buttons/button.icon.js +++ b/src/base/single/button/buttons/button.icon.js @@ -1,13 +1,21 @@ +import { BasicButton } from "../button.basic"; +import { shortcut, extend, isNumber, createWidget, isNull } from "../../../../core"; + /** - * @class BI.IconButton - * @extends BI.BasicButton + * @class IconButton + * @extends BasicButton * 图标的button */ -BI.IconButton = BI.inherit(BI.BasicButton, { - _defaultConfig: function () { - var conf = BI.IconButton.superclass._defaultConfig.apply(this, arguments); +@shortcut() +export class IconButton extends BasicButton { + + static EVENT_CHANGE = "EVENT_CHANGE"; + static xtype = "bi.icon_button"; + + _defaultConfig() { + const conf = super._defaultConfig(arguments); - return BI.extend(conf, { + return extend(conf, { _baseCls: (conf._baseCls || "") + " bi-icon-button horizon-center", hgap: 0, vgap: 0, @@ -18,21 +26,21 @@ BI.IconButton = BI.inherit(BI.BasicButton, { iconWidth: null, iconHeight: null, }); - }, + } - render: function () { - var o = this.options; + render() { + const o = this.options; this.element.css({ textAlign: "center", }); - this.icon = BI.createWidget({ + this.icon = createWidget({ type: "bi.icon", width: o.iconWidth, height: o.iconHeight, }); - if (BI.isNumber(o.height) && o.height > 0 && BI.isNull(o.iconWidth) && BI.isNull(o.iconHeight)) { + if (isNumber(o.height) && o.height > 0 && isNull(o.iconWidth) && isNull(o.iconHeight)) { this.element.css("lineHeight", BI.pixFormat(o.height)); - BI.createWidget({ + createWidget({ type: "bi.default", element: this, hgap: o.hgap, @@ -45,7 +53,7 @@ BI.IconButton = BI.inherit(BI.BasicButton, { }); } else { this.element.css("lineHeight", "1"); - BI.createWidget({ + createWidget({ element: this, type: "bi.center_adapt", hgap: o.hgap, @@ -57,14 +65,12 @@ BI.IconButton = BI.inherit(BI.BasicButton, { items: [this.icon], }); } - }, + } - doClick: function () { - BI.IconButton.superclass.doClick.apply(this, arguments); + doClick() { + super.doClick.apply(this, arguments); if (this.isValid()) { - this.fireEvent(BI.IconButton.EVENT_CHANGE, this); + this.fireEvent(IconButton.EVENT_CHANGE, this); } - }, -}); -BI.IconButton.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.icon_button", BI.IconButton); + } +} diff --git a/src/base/single/button/buttons/button.image.js b/src/base/single/button/buttons/button.image.js index 6eeeffbf1..290313fb2 100644 --- a/src/base/single/button/buttons/button.image.js +++ b/src/base/single/button/buttons/button.image.js @@ -1,87 +1,94 @@ +import { BasicButton } from "../button.basic"; +import { shortcut, extend, isNumber, createWidget } from "../../../../core"; + + /** * 图片的button * * Created by GUY on 2016/1/27. - * @class BI.ImageButton - * @extends BI.BasicButton + * @class ImageButton + * @extends BasicButton */ -BI.ImageButton = BI.inherit(BI.BasicButton, { - _defaultConfig: function () { - var conf = BI.ImageButton.superclass._defaultConfig.apply(this, arguments); +@shortcut() +export class ImageButton extends BasicButton { + + static EVENT_CHANGE = "EVENT_CHANGE"; + static xtype = "bi.image_button"; + + _defaultConfig() { + const conf = super._defaultConfig(arguments); - return BI.extend(conf, { + return extend(conf, { baseCls: (conf.baseCls || "") + " bi-image-button", src: "", iconWidth: "100%", iconHeight: "100%", }); - }, + } - render: function () { - var o = this.options; - this.image = BI.createWidget({ + render() { + const o = this.options; + this.image = createWidget({ type: "bi.img", width: o.iconWidth, height: o.iconHeight, src: o.src, }); - if (BI.isNumber(o.iconWidth) || BI.isNumber(o.iconHeight)) { - BI.createWidget({ + if (isNumber(o.iconWidth) || isNumber(o.iconHeight)) { + createWidget({ type: "bi.center_adapt", element: this, items: [this.image], }); } else { - BI.createWidget({ + createWidget({ type: "bi.adaptive", element: this, items: [this.image], scrollable: false, }); } - }, + } - setWidth: function (w) { - BI.ImageButton.superclass.setWidth.apply(this, arguments); + setWidth(w) { + super.setWidth.apply(this, arguments); this.options.width = w; - }, + } - setHeight: function (h) { - BI.ImageButton.superclass.setHeight.apply(this, arguments); + setHeight(h) { + super.setHeight.apply(this, arguments); this.options.height = h; - }, + } - setImageWidth: function (w) { + setImageWidth(w) { this.image.setWidth(w); - }, + } - setImageHeight: function (h) { + setImageHeight(h) { this.image.setHeight(h); - }, + } - getImageWidth: function () { + getImageWidth() { return this.image.element.width(); - }, + } - getImageHeight: function () { + getImageHeight() { return this.image.element.height(); - }, + } - setSrc: function (src) { + setSrc(src) { this.options.src = src; this.image.setSrc(src); - }, + } - getSrc: function () { + getSrc() { return this.image.getSrc(); - }, + } - doClick: function () { - BI.ImageButton.superclass.doClick.apply(this, arguments); + doClick() { + super.doClick.apply(this, arguments); if (this.isValid()) { - this.fireEvent(BI.ImageButton.EVENT_CHANGE, this); + this.fireEvent(ImageButton.EVENT_CHANGE, this); } - }, -}); -BI.ImageButton.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.image_button", BI.ImageButton); + } +} diff --git a/src/base/single/button/buttons/button.js b/src/base/single/button/buttons/button.js index bc1468450..567e115f9 100644 --- a/src/base/single/button/buttons/button.js +++ b/src/base/single/button/buttons/button.js @@ -1,271 +1,276 @@ -(function () { - function isVertical(position) { - return position === "top" || position === "bottom"; +import { BasicButton } from "../button.basic"; +import { isNumber, shortcut, isPlainObject, createWidget } from "../../../../core"; + +function isVertical(position) { + return position === "top" || position === "bottom"; +} + +const loadingCls = "button-loading-font anim-rotate"; + +/** + * 文字类型的按钮 + * @class Button + * @extends BasicButton + * + * @cfg {JSON} options 配置属性 + * @cfg {'common' / 'success' / 'warning' / 'ignore'} [options.level='common'] 按钮类型，用不同颜色强调不同的场景 + */ +@shortcut() +export class Button extends BasicButton { + + _const = { + iconWidth: 18, } - var loadingCls = "button-loading-font anim-rotate"; - - /** - * 文字类型的按钮 - * @class BI.Button - * @extends BI.BasicButton - * - * @cfg {JSON} options 配置属性 - * @cfg {'common'/'success'/'warning'/'ignore'} [options.level='common'] 按钮类型，用不同颜色强调不同的场景 - */ - BI.Button = BI.inherit(BI.BasicButton, { - - _const: { - iconWidth: 18, - }, - - _defaultConfig: function (props) { - var conf = BI.Button.superclass._defaultConfig.apply(this, arguments); - - var adaptiveHeight = 0; - if (isVertical(props.iconPosition)) { - // 图标高度和文字高度默认相等 - adaptiveHeight += (props.textHeight || 16) * 2; - adaptiveHeight += props.iconGap || 0; - var tGap = props.tgap || props.vgap || 2; - var bGap = props.bgap || props.vgap || 2; - adaptiveHeight += (tGap + bGap); + static xtype = "bi.button"; + static EVENT_CHANGE = "EVENT_CHANGE"; + + _defaultConfig(props) { + const conf = super._defaultConfig.apply(this, arguments); + + let adaptiveHeight = 0; + if (isVertical(props.iconPosition)) { + // 图标高度和文字高度默认相等 + adaptiveHeight += (props.textHeight || 16) * 2; + adaptiveHeight += props.iconGap || 0; + let tGap = props.tgap || props.vgap || 2; + let bGap = props.bgap || props.vgap || 2; + adaptiveHeight += (tGap + bGap); + } + + let clearMinWidth = props.block === true || props.clear === true || props.plain; + + return { + ...conf, + baseCls: (conf.baseCls || "") + " bi-button" + ((BI.isIE() && BI.isIE9Below()) ? " hack" : ""), + attributes: { + tabIndex: 1, + }, + minWidth: clearMinWidth ? 0 : 80, + height: isVertical(props.iconPosition) ? adaptiveHeight : 24, + shadow: props.clear !== true, + isShadowShowingOnSelected: true, + readonly: true, + iconCls: "", + level: "common", + block: false, // 是否块状显示，即不显示边框，没有最小宽度的限制 + clear: false, // 是否去掉边框和背景 + ghost: false, // 是否幽灵显示, 即正常状态无背景 + loading: false, // 是否处于加载中 + light: false, // 是否使用浅色 + plain: false, // 是否是朴素按钮，和 clear 的区别是 plain 有悬浮效果 + textAlign: "center", + whiteSpace: "nowrap", + textWidth: null, + textHeight: null, + hgap: props.clear ? 0 : (props.plain && !props.text ? 4 : 10), + vgap: 0, + tgap: 0, + bgap: 0, + lgap: 0, + rgap: 0, + icon: "", + iconGap: 0, + iconPosition: "left", + } + } + + render() { + const o = this.options; + + // bi.center_adapt 作用：让 hgap 不影响 iconGap。 + createWidget({ + type: "bi.center_adapt", + horizontalAlign: o.textAlign, + element: this, + ref: (ref) => { + this.containerRef = ref; + }, + hgap: o.hgap, + vgap: o.vgap, + items: this.generateItems(), + }); + + // 如果 options 对应的属性为 true 则给元素添加 class + const classArr = ["block", "clear", "ghost", "plain", "loading", "light"]; + classArr.forEach(clz => { + if (BI.get(o, clz) === true) { + this.element.addClass(clz); } + }) - var clearMinWidth = props.block === true || props.clear === true || props.plain; - - return BI.extend(conf, { - baseCls: (conf.baseCls || "") + " bi-button" + ((BI.isIE() && BI.isIE9Below()) ? " hack" : ""), - attributes: { - tabIndex: 1, - }, - minWidth: clearMinWidth ? 0 : 80, - height: isVertical(props.iconPosition) ? adaptiveHeight : 24, - shadow: props.clear !== true, - isShadowShowingOnSelected: true, - readonly: true, - iconCls: "", - level: "common", - block: false, // 是否块状显示，即不显示边框，没有最小宽度的限制 - clear: false, // 是否去掉边框和背景 - ghost: false, // 是否幽灵显示, 即正常状态无背景 - loading: false, // 是否处于加载中 - light: false, // 是否使用浅色 - plain: false, // 是否是朴素按钮，和 clear 的区别是 plain 有悬浮效果 - textAlign: "center", - whiteSpace: "nowrap", - textWidth: null, - textHeight: null, - hgap: props.clear ? 0 : (props.plain && !props.text ? 4 : 10), - vgap: 0, - tgap: 0, - bgap: 0, - lgap: 0, - rgap: 0, - icon: "", - iconGap: 0, - iconPosition: "left", - }); - }, - - render: function () { - var o = this.options, self = this; - - // bi.center_adapt 作用：让 hgap 不影响 iconGap。 - BI.createWidget({ - type: "bi.center_adapt", - horizontalAlign: o.textAlign, - element: this, - ref: (ref) => { - self.containerRef = ref; - }, - hgap: o.hgap, - vgap: o.vgap, - items: self.generateItems(), - }); + if (o.minWidth > 0) { + this.element.css({ "min-width": BI.pixFormat(o.minWidth) }); + } + } - // 如果 options 对应的属性为 true 则给元素添加 class - var classArr = ["block", "clear", "ghost", "plain", "loading", "light"]; - BI.each(classArr, function (_, clz) { - if (BI.get(o, clz) === true) { - self.element.addClass(clz); - } - }); + generateItems(defaultRenderIcon) { + const o = this.options; - if (o.minWidth > 0) { - this.element.css({ "min-width": BI.pixFormat(o.minWidth) }); - } - }, - - generateItems(defaultRenderIcon) { - var o = this.options; - - // 由于button默认情况下有个边框，所以要主动算行高 - var lineHeight, textHeight = o.textHeight; - var hasBorder = false; - if (BI.isNumber(o.height)) { - if (!isVertical(o.iconPosition)) { - if (!(o.clear && o.block && o.light)) { - hasBorder = true; - } - lineHeight = o.height; - } else { - lineHeight = textHeight; + // 由于button默认情况下有个边框，所以要主动算行高 + let lineHeight, textHeight = o.textHeight; + let hasBorder = false; + if (isNumber(o.height)) { + if (!isVertical(o.iconPosition)) { + if (!(o.clear && o.block && o.light)) { + hasBorder = true; } + lineHeight = o.height; + } else { + lineHeight = textHeight; } - if (!textHeight) { - if (o.whiteSpace === "nowrap") { - textHeight = lineHeight; - } + } + if (!textHeight) { + if (o.whiteSpace === "nowrap") { + textHeight = lineHeight; } - - var iconInvisible = !(o.loading || o.iconCls || o.icon || defaultRenderIcon); - - var maxTextWidth = Math.max(o.minWidth, o.width); - maxTextWidth -= (o.hgap * 2 + o.iconGap); - // 减去图标水平占位宽度 - maxTextWidth -= iconInvisible || isVertical(o.iconPosition) ? 0 : this._const.iconWidth; - var textWidth = BI.isNull(o.textWidth) ? maxTextWidth : Math.min(o.textWidth, maxTextWidth); - - this.text = BI.createWidget({ - type: "bi.label", - text: o.text, - whiteSpace: o.whiteSpace, - textAlign: o.textAlign, - textWidth: textWidth, - textHeight: BI.toPix(textHeight, hasBorder ? 2 : 0), + } + + const iconInvisible = !(o.loading || o.iconCls || o.icon || defaultRenderIcon); + + let maxTextWidth = Math.max(o.minWidth, o.width); + maxTextWidth -= (o.hgap * 2 + o.iconGap); + // 减去图标水平占位宽度 + maxTextWidth -= iconInvisible || isVertical(o.iconPosition) ? 0 : this._const.iconWidth; + const textWidth = BI.isNull(o.textWidth) ? maxTextWidth : Math.min(o.textWidth, maxTextWidth); + + this.text = createWidget({ + type: "bi.label", + text: o.text, + whiteSpace: o.whiteSpace, + textAlign: o.textAlign, + textWidth: textWidth, + textHeight: BI.toPix(textHeight, hasBorder ? 2 : 0), + height: BI.toPix(lineHeight, hasBorder ? 2 : 0), + value: o.value, + title: null, + }); + + if (iconInvisible) { + return [this.text]; + } + + this._iconRendered = true; + + if (isPlainObject(o.icon) && !o.loading) { + this.icon = createWidget(o.icon); + } else { + this.icon = createWidget({ + type: "bi.icon_label", + cls: o.loading ? loadingCls : (o.iconCls || o.icon), + width: this._const.iconWidth, height: BI.toPix(lineHeight, hasBorder ? 2 : 0), - value: o.value, - title: null, + lineHeight: BI.toPix(lineHeight, hasBorder ? 2 : 0), + // 不设置，自定义按钮无法居中 + iconWidth: o.iconWidth, + iconHeight: o.iconHeight, + invisible: iconInvisible, }); + } + + const gapContainer = { + lgap: o.iconPosition === "left" && o.text ? o.iconGap : 0, + rgap: o.iconPosition === "right" ? o.iconGap : 0, + tgap: o.iconPosition === "top" ? o.iconGap : 0, + bgap: o.iconPosition === "bottom" ? o.iconGap : 0, + }; + + const items = [this.icon, { el: this.text, ...gapContainer }]; + if (o.iconPosition === "right" || o.iconPosition === "bottom") { + items.reverse(); + } + + return [{ + type: isVertical(o.iconPosition) ? "bi.vertical" : "bi.horizontal", + horizontalAlign: "center", + verticalAlign: "middle", + items, + }]; + } - if (iconInvisible) { - return [this.text]; - } + doClick() { + super.doClick.apply(this, arguments); + if (this.isValid()) { + this.fireEvent(Button.EVENT_CHANGE, this); + } + } - this._iconRendered = true; + _setEnable(enable) { + super._setEnable.apply(this, arguments); + if (enable === true) { + this.element.attr("tabIndex", 1); + } else if (enable === false) { + this.element.removeAttr("tabIndex"); + } + } - if (BI.isPlainObject(o.icon) && !o.loading) { - this.icon = BI.createWidget(o.icon); - } else { - this.icon = BI.createWidget({ - type: "bi.icon_label", - cls: o.loading ? loadingCls : (o.iconCls || o.icon), - width: this._const.iconWidth, - height: BI.toPix(lineHeight, hasBorder ? 2 : 0), - lineHeight: BI.toPix(lineHeight, hasBorder ? 2 : 0), - // 不设置，自定义按钮无法居中 - iconWidth: o.iconWidth, - iconHeight: o.iconHeight, - invisible: iconInvisible, - }); - } + beforeClick() { + return this.isLoading(); + } - var gapContainer = { - lgap: o.iconPosition === "left" && o.text ? o.iconGap : 0, - rgap: o.iconPosition === "right" ? o.iconGap : 0, - tgap: o.iconPosition === "top" ? o.iconGap : 0, - bgap: o.iconPosition === "bottom" ? o.iconGap : 0, - }; + isLoading() { + return this._loading === undefined ? this.options.loading : this._loading; + } - var items = [this.icon, BI.extend({ el: this.text }, gapContainer)]; - if (o.iconPosition === "right" || o.iconPosition === "bottom") { - items.reverse(); - } + loading() { + this._loading = true; + this.element.addClass("loading"); + !this._iconRendered && this.containerRef.populate(this.generateItems(true)); + if (this.icon.loading) { + this.icon.loading(); + } else { + // loadingCls 可以覆盖 iconCls 所以不需要移除 iconCls + this.icon.element.addClass(loadingCls); + this.icon.setVisible(true); + } + } - return [{ - type: isVertical(o.iconPosition) ? "bi.vertical" : "bi.horizontal", - horizontalAlign: "center", - verticalAlign: "middle", - items, - }]; - }, - - doClick: function () { - BI.Button.superclass.doClick.apply(this, arguments); - if (this.isValid()) { - this.fireEvent(BI.Button.EVENT_CHANGE, this); - } - }, - - _setEnable: function (enable) { - BI.Button.superclass._setEnable.apply(this, arguments); - if (enable === true) { - this.element.attr("tabIndex", 1); - } else if (enable === false) { - this.element.removeAttr("tabIndex"); - } - }, - - beforeClick: function () { - return this.isLoading(); - }, - - isLoading: function () { - return this._loading === undefined ? this.options.loading : this._loading; - }, - - loading: function () { - this._loading = true; - this.element.addClass("loading"); - !this._iconRendered && this.containerRef.populate(this.generateItems(true)); - if (this.icon.loading) { - this.icon.loading(); - } else { - // loadingCls 可以覆盖 iconCls 所以不需要移除 iconCls - this.icon.element.addClass(loadingCls); - this.icon.setVisible(true); - } - }, + loaded() { + this._loading = false; + this.element.removeClass("loading"); + if (this.icon.loaded) { + this.icon.loaded(); + } else { + this.icon.element.removeClass(loadingCls); + this.icon.setVisible(!!this.options.iconCls); + } + } - loaded: function () { - this._loading = false; - this.element.removeClass("loading"); - if (this.icon.loaded) { - this.icon.loaded(); - } else { - this.icon.element.removeClass(loadingCls); - this.icon.setVisible(!!this.options.iconCls); - } - }, + setText(text) { + super.setText.apply(this, arguments); + this.text.setText(text); + } - setText: function (text) { - BI.Button.superclass.setText.apply(this, arguments); - this.text.setText(text); - }, + setValue(text) { + super.setValue.apply(this, arguments); + if (!this.isReadOnly()) { + this.text.setValue(text); + } + } + + setIcon(cls) { + const o = this.options; + !this._iconRendered && this.containerRef.populate(this.generateItems(true)); + if (this.icon && o.iconCls !== cls) { + this.icon.element.removeClass(o.iconCls).addClass(cls); + o.iconCls = cls; + } + } + + doRedMark() { + this.text.doRedMark.apply(this.text, arguments); + } + + unRedMark() { + this.text.unRedMark.apply(this.text, arguments); + } + + doHighLight() { + this.text.doHighLight.apply(this.text, arguments); + } + + unHighLight() { + this.text.unHighLight.apply(this.text, arguments); + } +} - setValue: function (text) { - BI.Button.superclass.setValue.apply(this, arguments); - if (!this.isReadOnly()) { - this.text.setValue(text); - } - }, - - setIcon: function (cls) { - var o = this.options; - !this._iconRendered && this.containerRef.populate(this.generateItems(true)); - if (this.icon && o.iconCls !== cls) { - this.icon.element.removeClass(o.iconCls).addClass(cls); - o.iconCls = cls; - } - }, - - doRedMark: function () { - this.text.doRedMark.apply(this.text, arguments); - }, - - unRedMark: function () { - this.text.unRedMark.apply(this.text, arguments); - }, - - doHighLight: function () { - this.text.doHighLight.apply(this.text, arguments); - }, - - unHighLight: function () { - this.text.unHighLight.apply(this.text, arguments); - }, - }); - BI.shortcut("bi.button", BI.Button); - BI.Button.EVENT_CHANGE = "EVENT_CHANGE"; -}()); diff --git a/src/base/single/button/buttons/button.text.js b/src/base/single/button/buttons/button.text.js index 38470c291..a7fed2d76 100644 --- a/src/base/single/button/buttons/button.text.js +++ b/src/base/single/button/buttons/button.text.js @@ -1,15 +1,23 @@ +import { BasicButton } from "../button.basic"; +import { shortcut, extend, createWidget } from "../../../../core"; + /** * guy * 可以点击的一行文字 - * @class BI.TextButton - * @extends BI.BasicButton + * @class TextButton + * @extends BasicButton * 文字button */ -BI.TextButton = BI.inherit(BI.BasicButton, { - _defaultConfig: function () { - var conf = BI.TextButton.superclass._defaultConfig.apply(this, arguments); +@shortcut() +export class TextButton extends BasicButton { + + static xtype = "bi.text_button"; + static EVENT_CHANGE = "EVENT_CHANGE"; + + _defaultConfig() { + const conf = super._defaultConfig(arguments); - return BI.extend(conf, { + return extend(conf, { baseCls: (conf.baseCls || "") + " bi-text-button", textAlign: "center", whiteSpace: "nowrap", @@ -21,11 +29,11 @@ BI.TextButton = BI.inherit(BI.BasicButton, { vgap: 0, py: "", }); - }, + } - render: function () { - var o = this.options; - this.text = BI.createWidget({ + render() { + const o = this.options; + this.text = createWidget({ type: "bi.label", element: this, textAlign: o.textAlign, @@ -43,48 +51,46 @@ BI.TextButton = BI.inherit(BI.BasicButton, { py: o.py, keyword: o.keyword, }); - }, + } - doClick: function () { - BI.TextButton.superclass.doClick.apply(this, arguments); + doClick() { + super.doClick.apply(this, arguments); if (this.isValid()) { this.fireEvent(BI.TextButton.EVENT_CHANGE, this.getValue(), this); } - }, + } - doRedMark: function () { + doRedMark() { this.text.doRedMark.apply(this.text, arguments); - }, + } - unRedMark: function () { + unRedMark() { this.text.unRedMark.apply(this.text, arguments); - }, + } - doHighLight: function () { + doHighLight() { this.text.doHighLight.apply(this.text, arguments); - }, + } - unHighLight: function () { + unHighLight() { this.text.unHighLight.apply(this.text, arguments); - }, + } - setText: function (text) { - BI.TextButton.superclass.setText.apply(this, arguments); + setText(text) { + super.setText.apply(this, arguments); text = BI.isArray(text) ? text.join(",") : text; this.text.setText(text); - }, + } - setStyle: function (style) { + setStyle(style) { this.text.setStyle(style); - }, + } - setValue: function (text) { - BI.TextButton.superclass.setValue.apply(this, arguments); + setValue(text) { + super.setValue.apply(this, arguments); if (!this.isReadOnly()) { text = BI.isArray(text) ? text.join(",") : text; this.text.setValue(text); } - }, -}); -BI.TextButton.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.text_button", BI.TextButton); + } +} diff --git a/src/base/single/button/listitem/blankiconicontextitem.js b/src/base/single/button/listitem/blankiconicontextitem.js index 1f6419008..b826fb558 100644 --- a/src/base/single/button/listitem/blankiconicontextitem.js +++ b/src/base/single/button/listitem/blankiconicontextitem.js @@ -1,14 +1,21 @@ +import { BasicButton } from "../button.basic" +import { emptyFn, shortcut } from "../../../../core" + /** * 带有一个占位 * * Created by GUY on 2015/9/11. - * @class BI.BlankIconIconTextItem - * @extends BI.BasicButton + * @class BlankIconIconTextItem + * @extends BasicButton */ -BI.BlankIconIconTextItem = BI.inherit(BI.BasicButton, { +@shortcut() +export class BlankIconIconTextItem extends BasicButton { + + static EVENT_CHANGE = "EVENT_CHANGE"; + static xtype = "bi.blank_icon_icon_text_item"; - _defaultConfig: function () { - var conf = BI.BlankIconIconTextItem.superclass._defaultConfig.apply(this, arguments); + _defaultConfig() { + var conf = super._defaultConfig(arguments); return BI.extend(conf, { baseCls: (conf.baseCls || "") + " bi-blank-icon-icon-text-item", @@ -22,10 +29,10 @@ BI.BlankIconIconTextItem = BI.inherit(BI.BasicButton, { textLgap: 0, textRgap: 0, }); - }, + } - render: function () { - var self = this, o = this.options; + render() { + const o = this.options; return { type: "bi.vertical_adapt", @@ -50,8 +57,8 @@ BI.BlankIconIconTextItem = BI.inherit(BI.BasicButton, { }, { el: { type: "bi.label", - ref: function (_ref) { - self.text = _ref; + ref: (_ref) => { + this.text = _ref; }, textAlign: "left", hgap: o.textHgap, @@ -65,54 +72,52 @@ BI.BlankIconIconTextItem = BI.inherit(BI.BasicButton, { }, }], }; - }, + } - doClick: function () { - BI.BlankIconIconTextItem.superclass.doClick.apply(this, arguments); + doClick() { + super.doClick.apply(this, arguments); if (this.isValid()) { - this.fireEvent(BI.BlankIconIconTextItem.EVENT_CHANGE, this.getValue(), this); + this.fireEvent(BlankIconIconTextItem.EVENT_CHANGE, this.getValue(), this); } - }, + } - setSelected: function (b) { - BI.BlankIconIconTextItem.superclass.setSelected.apply(this, arguments); + setSelected(b) { + super.setSelected.apply(this, arguments); this.icon1.setSelected(b); this.icon2.setSelected(b); - }, + } - setValue: function () { + setValue() { if (!this.isReadOnly()) { this.text.setValue.apply(this.text, arguments); } - }, + } - getValue: function () { + getValue() { return this.text.getValue(); - }, + } - setText: function () { + setText() { this.text.setText.apply(this.text, arguments); - }, + } - getText: function () { + getText() { return this.text.getText(); - }, + } - doRedMark: function () { + doRedMark() { this.text.doRedMark.apply(this.text, arguments); - }, + } - unRedMark: function () { + unRedMark() { this.text.unRedMark.apply(this.text, arguments); - }, + } - doHighLight: function () { + doHighLight() { this.text.doHighLight.apply(this.text, arguments); - }, + } - unHighLight: function () { + unHighLight() { this.text.unHighLight.apply(this.text, arguments); - }, -}); -BI.BlankIconIconTextItem.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.blank_icon_icon_text_item", BI.BlankIconIconTextItem); + } +} diff --git a/src/base/single/button/listitem/blankicontexticonitem.js b/src/base/single/button/listitem/blankicontexticonitem.js index 34dc9e7d8..91b7bcbe2 100644 --- a/src/base/single/button/listitem/blankicontexticonitem.js +++ b/src/base/single/button/listitem/blankicontexticonitem.js @@ -1,17 +1,24 @@ +import { BasicButton } from "../button.basic" +import { emptyFn, shortcut, extend } from "../../../../core" + /** * guy * 一个占位符和两个icon和一行数 组成的一行listitem * * Created by GUY on 2015/9/15. - * @class BI.BlankIconTextIconItem - * @extends BI.BasicButton + * @class BlankIconTextIconItem + * @extends BasicButton */ -BI.BlankIconTextIconItem = BI.inherit(BI.BasicButton, { +@shortcut() +export class BlankIconTextIconItem extends BasicButton { + + static xtype = "bi.blank_icon_text_icon_item"; + static EVENT_CHANGE = "EVENT_CHANGE"; - _defaultConfig: function () { - var conf = BI.BlankIconTextIconItem.superclass._defaultConfig.apply(this, arguments); + _defaultConfig() { + const conf = super._defaultConfig(arguments); - return BI.extend(conf, { + return extend(conf, { baseCls: (conf.baseCls || "") + " bi-blank-icon-text-icon-item", iconCls1: "", iconCls2: "", @@ -23,10 +30,10 @@ BI.BlankIconTextIconItem = BI.inherit(BI.BasicButton, { textLgap: 0, textRgap: 0, }); - }, + } - render: function () { - var self = this, o = this.options; + render() { + const o = this.options; return { type: "bi.vertical_adapt", @@ -44,8 +51,8 @@ BI.BlankIconTextIconItem = BI.inherit(BI.BasicButton, { }, { el: { type: "bi.label", - ref: function (_ref) { - self.text = _ref; + ref: (_ref) => { + this.text = _ref; }, textAlign: "left", hgap: o.textHgap, @@ -66,48 +73,47 @@ BI.BlankIconTextIconItem = BI.inherit(BI.BasicButton, { iconHeight: o.iconHeight, }], }; - }, + } - doClick: function () { - BI.BlankIconTextIconItem.superclass.doClick.apply(this, arguments); + doClick() { + super.doClick.apply(this, arguments); if (this.isValid()) { this.fireEvent(BI.BlankIconTextIconItem.EVENT_CHANGE, this.getValue(), this); } - }, + } - doRedMark: function () { + doRedMark() { this.text.doRedMark.apply(this.text, arguments); - }, + } - unRedMark: function () { + unRedMark() { this.text.unRedMark.apply(this.text, arguments); - }, + } - doHighLight: function () { + doHighLight() { this.text.doHighLight.apply(this.text, arguments); - }, + } - unHighLight: function () { + unHighLight() { this.text.unHighLight.apply(this.text, arguments); - }, + } - setValue: function () { + setValue() { if (!this.isReadOnly()) { this.text.setValue.apply(this.text, arguments); } - }, + } - getValue: function () { + getValue() { return this.text.getValue(); - }, + } - setText: function () { + setText() { this.text.setText.apply(this.text, arguments); - }, + } - getText: function () { + getText() { return this.text.getText(); - }, -}); -BI.BlankIconTextIconItem.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.blank_icon_text_icon_item", BI.BlankIconTextIconItem); + } +} + diff --git a/src/base/single/button/listitem/blankicontextitem.js b/src/base/single/button/listitem/blankicontextitem.js index 08f13d22d..fb63eb8fb 100644 --- a/src/base/single/button/listitem/blankicontextitem.js +++ b/src/base/single/button/listitem/blankicontextitem.js @@ -1,16 +1,23 @@ +import { BasicButton } from "../button.basic" +import { extend, shortcut } from "../../../../core" + /** * 带有一个占位 * * Created by GUY on 2015/9/11. - * @class BI.BlankIconTextItem - * @extends BI.BasicButton + * @class BlankIconTextItem + * @extends BasicButton */ -BI.BlankIconTextItem = BI.inherit(BI.BasicButton, { +@shortcut() +export class BlankIconTextItem extends BasicButton { + + static xtype = "bi.blank_icon_text_item"; + static EVENT_CHANGE = "EVENT_CHANGE"; - _defaultConfig: function () { - var conf = BI.BlankIconTextItem.superclass._defaultConfig.apply(this, arguments); + _defaultConfig() { + const conf = super._defaultConfig(arguments); - return BI.extend(conf, { + return extend(conf, { baseCls: (conf.baseCls || "") + " bi-blank-icon-text-item", blankWidth: 0, iconHeight: null, @@ -21,10 +28,10 @@ BI.BlankIconTextItem = BI.inherit(BI.BasicButton, { textLgap: 0, textRgap: 0, }); - }, + } - render: function () { - var self = this, o = this.options; + render() { + const o = this.options; return { type: "bi.vertical_adapt", @@ -42,8 +49,8 @@ BI.BlankIconTextItem = BI.inherit(BI.BasicButton, { }, { el: { type: "bi.label", - ref: function (_ref) { - self.text = _ref; + ref: (_ref) => { + this.text = _ref; }, cls: "list-item-text", textAlign: "left", @@ -58,48 +65,46 @@ BI.BlankIconTextItem = BI.inherit(BI.BasicButton, { }, }], }; - }, + } - doClick: function () { - BI.BlankIconTextItem.superclass.doClick.apply(this, arguments); + doClick() { + super.doClick.apply(this, arguments); if (this.isValid()) { - this.fireEvent(BI.BlankIconTextItem.EVENT_CHANGE, this.getValue(), this); + this.fireEvent(BlankIconTextItem.EVENT_CHANGE, this.getValue(), this); } - }, + } - setValue: function () { + setValue() { if (!this.isReadOnly()) { this.text.setValue.apply(this.text, arguments); } - }, + } - getValue: function () { + getValue() { return this.text.getValue(); - }, + } - setText: function () { + setText() { this.text.setText.apply(this.text, arguments); - }, + } - getText: function () { + getText() { return this.text.getText(); - }, + } - doRedMark: function () { + doRedMark() { this.text.doRedMark.apply(this.text, arguments); - }, + } - unRedMark: function () { + unRedMark() { this.text.unRedMark.apply(this.text, arguments); - }, + } - doHighLight: function () { + doHighLight() { this.text.doHighLight.apply(this.text, arguments); - }, + } - unHighLight: function () { + unHighLight() { this.text.unHighLight.apply(this.text, arguments); - }, -}); -BI.BlankIconTextItem.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.blank_icon_text_item", BI.BlankIconTextItem); + } +} diff --git a/src/base/single/button/listitem/icontexticonitem.js b/src/base/single/button/listitem/icontexticonitem.js index 425f47d90..8aadfdd47 100644 --- a/src/base/single/button/listitem/icontexticonitem.js +++ b/src/base/single/button/listitem/icontexticonitem.js @@ -1,17 +1,25 @@ +import { BasicButton } from "../button.basic" +import { extend, shortcut } from "../../../../core" + /** * guy * 两个icon和一行数 组成的一行listitem * * Created by GUY on 2015/9/9. - * @class BI.IconTextIconItem - * @extends BI.BasicButton + * @class IconTextIconItem + * @extends BasicButton */ -BI.IconTextIconItem = BI.inherit(BI.BasicButton, { - _defaultConfig: function () { - var conf = BI.IconTextIconItem.superclass._defaultConfig.apply(this, arguments); +@shortcut() +export class IconTextIconItem extends BasicButton { + + static EVENT_CHANGE = "EVENT_CHANGE"; + static xtype = "bi.icon_text_icon_item"; + + _defaultConfig() { + const conf = super._defaultConfig(arguments); - return BI.extend(conf, { + return extend(conf, { baseCls: (conf.baseCls || "") + " bi-icon-text-icon-item", iconCls1: "", iconCls2: "", @@ -22,10 +30,10 @@ BI.IconTextIconItem = BI.inherit(BI.BasicButton, { textLgap: 0, textRgap: 0, }); - }, + } - render: function () { - var self = this, o = this.options; + render() { + const o = this.options; return { type: "bi.vertical_adapt", @@ -40,8 +48,8 @@ BI.IconTextIconItem = BI.inherit(BI.BasicButton, { }, { el: { type: "bi.label", - ref: function (_ref) { - self.text = _ref; + ref: (_ref) => { + this.text = _ref; }, textAlign: "left", hgap: o.textHgap, @@ -62,48 +70,46 @@ BI.IconTextIconItem = BI.inherit(BI.BasicButton, { iconHeight: o.iconHeight, }], }; - }, + } - doClick: function () { - BI.IconTextIconItem.superclass.doClick.apply(this, arguments); + doClick() { + super.doClick.apply(this, arguments); if (this.isValid()) { - this.fireEvent(BI.IconTextIconItem.EVENT_CHANGE, this.getValue(), this); + this.fireEvent(IconTextIconItem.EVENT_CHANGE, this.getValue(), this); } - }, + } - doRedMark: function () { + doRedMark() { this.text.doRedMark.apply(this.text, arguments); - }, + } - unRedMark: function () { + unRedMark() { this.text.unRedMark.apply(this.text, arguments); - }, + } - doHighLight: function () { + doHighLight() { this.text.doHighLight.apply(this.text, arguments); - }, + } - unHighLight: function () { + unHighLight() { this.text.unHighLight.apply(this.text, arguments); - }, + } - setValue: function () { + setValue() { if (!this.isReadOnly()) { this.text.setValue.apply(this.text, arguments); } - }, + } - getValue: function () { + getValue() { return this.text.getValue(); - }, + } - setText: function () { + setText() { this.text.setText.apply(this.text, arguments); - }, + } - getText: function () { + getText() { return this.text.getText(); - }, -}); -BI.IconTextIconItem.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.icon_text_icon_item", BI.IconTextIconItem); + } +} diff --git a/src/base/single/button/listitem/icontextitem.js b/src/base/single/button/listitem/icontextitem.js index 8fff16335..7aa02bdb3 100644 --- a/src/base/single/button/listitem/icontextitem.js +++ b/src/base/single/button/listitem/icontextitem.js @@ -1,16 +1,23 @@ +import { BasicButton } from "../button.basic" +import { extend, shortcut } from "../../../../core" + /** * guy * * Created by GUY on 2015/9/9. - * @class BI.IconTextItem - * @extends BI.BasicButton + * @class IconTextItem + * @extends BasicButton */ -BI.IconTextItem = BI.inherit(BI.BasicButton, { +@shortcut() +export class IconTextItem extends BasicButton { + + static EVENT_CHANGE = "EVENT_CHANGE"; + static xtype = "bi.icon_text_item"; - _defaultConfig: function () { - var conf = BI.IconTextItem.superclass._defaultConfig.apply(this, arguments); + _defaultConfig() { + const conf = super._defaultConfig(arguments); - return BI.extend(conf, { + return extend(conf, { baseCls: (conf.baseCls || "") + " bi-icon-text-item", direction: BI.Direction.Left, iconWrapperWidth: null, @@ -22,10 +29,10 @@ BI.IconTextItem = BI.inherit(BI.BasicButton, { textLgap: 0, textRgap: 0, }); - }, + } - render: function () { - var self = this, o = this.options; + render() { + const o = this.options; return { type: "bi.vertical_adapt", @@ -40,8 +47,8 @@ BI.IconTextItem = BI.inherit(BI.BasicButton, { }, { el: { type: "bi.label", - ref: function (_ref) { - self.text = _ref; + ref: (_ref) => { + this.text = _ref; }, cls: "list-item-text", textAlign: "left", @@ -56,48 +63,46 @@ BI.IconTextItem = BI.inherit(BI.BasicButton, { }, }], }; - }, + } - doClick: function () { - BI.IconTextItem.superclass.doClick.apply(this, arguments); + doClick() { + super.doClick.apply(this, arguments); if (this.isValid()) { this.fireEvent(BI.IconTextItem.EVENT_CHANGE, this.getValue(), this); } - }, + } - setValue: function () { + setValue() { if (!this.isReadOnly()) { this.text.setValue.apply(this.text, arguments); } - }, + } - getValue: function () { + getValue() { return this.text.getValue(); - }, + } - setText: function () { + setText() { this.text.setText.apply(this.text, arguments); - }, + } - getText: function () { + getText() { return this.text.getText(); - }, + } - doRedMark: function () { + doRedMark() { this.text.doRedMark.apply(this.text, arguments); - }, + } - unRedMark: function () { + unRedMark() { this.text.unRedMark.apply(this.text, arguments); - }, + } - doHighLight: function () { + doHighLight() { this.text.doHighLight.apply(this.text, arguments); - }, + } - unHighLight: function () { + unHighLight() { this.text.unHighLight.apply(this.text, arguments); - }, -}); -BI.IconTextItem.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.icon_text_item", BI.IconTextItem); + } +} diff --git a/src/base/single/button/listitem/texticonitem.js b/src/base/single/button/listitem/texticonitem.js index a0ece74e6..a8b8077fd 100644 --- a/src/base/single/button/listitem/texticonitem.js +++ b/src/base/single/button/listitem/texticonitem.js @@ -1,17 +1,24 @@ +import { BasicButton } from "../button.basic" +import { extend, shortcut } from "../../../../core" + /** * * 图标的button * * Created by GUY on 2015/9/9. - * @class BI.TextIconItem - * @extends BI.BasicButton + * @class TextIconItem + * @extends BasicButton */ -BI.TextIconItem = BI.inherit(BI.BasicButton, { +@shortcut() +export class TextIconItem extends BasicButton { + + static xtype = "bi.text_icon_item"; + static EVENT_CHANGE = "EVENT_CHANGE" - _defaultConfig: function () { - var conf = BI.TextIconItem.superclass._defaultConfig.apply(this, arguments); + _defaultConfig() { + const conf = super._defaultConfig(arguments); - return BI.extend(conf, { + return extend(conf, { baseCls: (conf.baseCls || "") + " bi-text-icon-item", iconWrapperWidth: null, iconHeight: null, @@ -22,10 +29,10 @@ BI.TextIconItem = BI.inherit(BI.BasicButton, { textLgap: 0, textRgap: 0, }); - }, + } - render: function () { - var self = this, o = this.options; + render() { + const o = this.options; return { type: "bi.vertical_adapt", @@ -56,48 +63,46 @@ BI.TextIconItem = BI.inherit(BI.BasicButton, { iconHeight: o.iconHeight, }], }; - }, + } - doClick: function () { - BI.TextIconItem.superclass.doClick.apply(this, arguments); + doClick() { + super.doClick.apply(this, arguments); if (this.isValid()) { - this.fireEvent(BI.TextIconItem.EVENT_CHANGE, this.getValue(), this); + this.fireEvent(TextIconItem.EVENT_CHANGE, this.getValue(), this); } - }, + } - setValue: function () { + setValue() { if (!this.isReadOnly()) { this.text.setValue.apply(this.text, arguments); } - }, + } - getValue: function () { + getValue() { return this.text.getValue(); - }, + } - setText: function () { + setText() { this.text.setText.apply(this.text, arguments); - }, + } - getText: function () { + getText() { return this.text.getText(); - }, + } - doRedMark: function () { + doRedMark() { this.text.doRedMark.apply(this.text, arguments); - }, + } - unRedMark: function () { + unRedMark() { this.text.unRedMark.apply(this.text, arguments); - }, + } - doHighLight: function () { + doHighLight() { this.text.doHighLight.apply(this.text, arguments); - }, + } - unHighLight: function () { + unHighLight() { this.text.unHighLight.apply(this.text, arguments); - }, -}); -BI.TextIconItem.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.text_icon_item", BI.TextIconItem); + } +} diff --git a/src/base/single/button/listitem/textitem.js b/src/base/single/button/listitem/textitem.js index c4c810295..82fa1e7ea 100644 --- a/src/base/single/button/listitem/textitem.js +++ b/src/base/single/button/listitem/textitem.js @@ -1,17 +1,24 @@ +import { BasicButton } from "../button.basic" +import { extend, shortcut } from "../../../../core" + /** * guy * 一个button和一行数 组成的一行listitem * * Created by GUY on 2015/9/9. - * @class BI.TextItem - * @extends BI.BasicButton + * @class TextItem + * @extends BasicButton */ -BI.TextItem = BI.inherit(BI.BasicButton, { +@shortcut +export class TextItem extends BasicButton { + + static xtype = "bi.text_item"; + static EVENT_CHANGE = "EVENT_CHANGE"; - _defaultConfig: function () { - var conf = BI.TextItem.superclass._defaultConfig.apply(this, arguments); + _defaultConfig() { + const conf = super._defaultConfig(arguments); - return BI.extend(conf, { + return extend(conf, { baseCls: (conf.baseCls || "") + " bi-text-item", textAlign: "left", whiteSpace: "nowrap", @@ -20,10 +27,10 @@ BI.TextItem = BI.inherit(BI.BasicButton, { textLgap: 0, textRgap: 0, }); - }, + } - render: function () { - var o = this.options; + render() { + const o = this.options; this.text = BI.createWidget({ type: "bi.label", element: this, @@ -40,48 +47,46 @@ BI.TextItem = BI.inherit(BI.BasicButton, { keyword: o.keyword, py: o.py, }); - }, + } - doClick: function () { - BI.TextItem.superclass.doClick.apply(this, arguments); + doClick() { + super.doClick.apply(this, arguments); if (this.isValid()) { this.fireEvent(BI.TextItem.EVENT_CHANGE, this.getValue(), this); } - }, + } - doRedMark: function () { + doRedMark() { this.text.doRedMark.apply(this.text, arguments); - }, + } - unRedMark: function () { + unRedMark() { this.text.unRedMark.apply(this.text, arguments); - }, + } - doHighLight: function () { + doHighLight() { this.text.doHighLight.apply(this.text, arguments); - }, + } - unHighLight: function () { + unHighLight() { this.text.unHighLight.apply(this.text, arguments); - }, + } - setValue: function () { + setValue() { if (!this.isReadOnly()) { this.text.setValue.apply(this.text, arguments); } - }, + } - getValue: function () { + getValue() { return this.text.getValue(); - }, + } - setText: function () { + setText() { this.text.setText.apply(this.text, arguments); - }, + } - getText: function () { + getText() { return this.text.getText(); - }, -}); -BI.TextItem.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.text_item", BI.TextItem); + } +} diff --git a/src/base/single/button/node/icontexticonnode.js b/src/base/single/button/node/icontexticonnode.js index 7569490eb..7cbff7f74 100644 --- a/src/base/single/button/node/icontexticonnode.js +++ b/src/base/single/button/node/icontexticonnode.js @@ -1,15 +1,22 @@ +import { NodeButton } from "../button.node" +import { extend, shortcut } from "../../../../core" + /** * guy * Created by GUY on 2015/9/9. - * @class BI.IconTextIconNode - * @extends BI.NodeButton + * @class IconTextIconNode + * @extends NodeButton */ -BI.IconTextIconNode = BI.inherit(BI.NodeButton, { +@shortcut() +export class IconTextIconNode extends NodeButton { + + static xtype = "bi.icon_text_icon_node"; + static EVENT_CHANGE = "EVENT_CHANGE"; - _defaultConfig: function () { - var conf = BI.IconTextIconNode.superclass._defaultConfig.apply(this, arguments); + _defaultConfig() { + const conf = super._defaultConfig(arguments); - return BI.extend(conf, { + return extend(conf, { baseCls: (conf.baseCls || "") + " bi-icon-text-icon-node", iconCls1: "close-ha-font", iconCls2: "close-ha-font", @@ -20,10 +27,10 @@ BI.IconTextIconNode = BI.inherit(BI.NodeButton, { textLgap: 0, textRgap: 0, }); - }, + } - render: function () { - var self = this, o = this.options; + render() { + const o = this.options; return { type: "bi.vertical_adapt", @@ -38,8 +45,8 @@ BI.IconTextIconNode = BI.inherit(BI.NodeButton, { }, { el: { type: "bi.label", - ref: function (_ref) { - self.text = _ref; + ref: (_ref) => { + this.text = _ref; }, textAlign: "left", hgap: o.textHgap, @@ -60,40 +67,38 @@ BI.IconTextIconNode = BI.inherit(BI.NodeButton, { iconHeight: o.iconHeight, }], }; - }, + } - doClick: function () { - BI.IconTextIconNode.superclass.doClick.apply(this, arguments); + doClick() { + super.doClick.apply(this, arguments); if (this.isValid()) { - this.fireEvent(BI.IconTextIconNode.EVENT_CHANGE, this.getValue(), this); + this.fireEvent(IconTextIconNode.EVENT_CHANGE, this.getValue(), this); } - }, + } - doRedMark: function () { + doRedMark() { this.text.doRedMark.apply(this.text, arguments); - }, + } - unRedMark: function () { + unRedMark() { this.text.unRedMark.apply(this.text, arguments); - }, + } - setValue: function () { + setValue() { if (!this.isReadOnly()) { this.text.setValue.apply(this.text, arguments); } - }, + } - getValue: function () { + getValue() { return this.text.getValue(); - }, + } - setText: function () { + setText() { this.text.setText.apply(this.text, arguments); - }, + } - getText: function () { + getText() { return this.text.getText(); - }, -}); -BI.IconTextIconNode.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.icon_text_icon_node", BI.IconTextIconNode); + } +} diff --git a/src/base/single/button/node/icontextnode.js b/src/base/single/button/node/icontextnode.js index 16383cc7d..6a6260432 100644 --- a/src/base/single/button/node/icontextnode.js +++ b/src/base/single/button/node/icontextnode.js @@ -1,15 +1,22 @@ +import { NodeButton } from "../button.node" +import { extend, shortcut } from "../../../../core" + /** * guy * Created by GUY on 2015/9/9. - * @class BI.IconTextNode - * @extends BI.NodeButton + * @class IconTextNode + * @extends NodeButton */ -BI.IconTextNode = BI.inherit(BI.NodeButton, { +@shortcut() +export class IconTextNode extends NodeButton { + + static EVENT_CHANGE = "EVENT_CHANGE"; + static xtype = "bi.icon_text_node"; - _defaultConfig: function () { - var conf = BI.IconTextNode.superclass._defaultConfig.apply(this, arguments); + _defaultConfig() { + const conf = super._defaultConfig(arguments); - return BI.extend(conf, { + return extend(conf, { baseCls: (conf.baseCls || "") + " bi-icon-text-node", cls: "close-ha-font", iconHeight: null, @@ -19,10 +26,10 @@ BI.IconTextNode = BI.inherit(BI.NodeButton, { textLgap: 0, textRgap: 0, }); - }, + } - render: function () { - var self = this, o = this.options; + render() { + const o = this.options; return { type: "bi.vertical_adapt", @@ -37,8 +44,8 @@ BI.IconTextNode = BI.inherit(BI.NodeButton, { }, { el: { type: "bi.label", - ref: function (_ref) { - self.text = _ref; + ref: (_ref) => { + this.text = _ref; }, cls: "list-item-text", textAlign: "left", @@ -53,40 +60,39 @@ BI.IconTextNode = BI.inherit(BI.NodeButton, { }, }], }; - }, + } - doClick: function () { - BI.IconTextNode.superclass.doClick.apply(this, arguments); + doClick() { + super.doClick.apply(this, arguments); if (this.isValid()) { this.fireEvent(BI.IconTextNode.EVENT_CHANGE, this.getValue(), this); } - }, + } - setValue: function () { + setValue() { if (!this.isReadOnly()) { this.text.setValue.apply(this.text, arguments); } - }, + } - getValue: function () { + getValue() { return this.text.getValue(); - }, + } - setText: function () { + setText() { this.text.setText.apply(this.text, arguments); - }, + } - getText: function () { + getText() { return this.text.getText(); - }, + } - doRedMark: function () { + doRedMark() { this.text.doRedMark.apply(this.text, arguments); - }, + } - unRedMark: function () { + unRedMark() { this.text.unRedMark.apply(this.text, arguments); - }, -}); -BI.IconTextNode.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.icon_text_node", BI.IconTextNode); + } +} + diff --git a/src/base/single/button/node/texticonnode.js b/src/base/single/button/node/texticonnode.js index 01167b009..02a205047 100644 --- a/src/base/single/button/node/texticonnode.js +++ b/src/base/single/button/node/texticonnode.js @@ -1,14 +1,21 @@ +import { NodeButton } from "../button.node" +import { extend, shortcut } from "../../../../core" + /** * Created by GUY on 2015/9/9. - * @class BI.TextIconNode - * @extends BI.NodeButton + * @class TextIconNode + * @extends NodeButton */ -BI.TextIconNode = BI.inherit(BI.NodeButton, { +@shortcut() +export default class TextIconNode extends NodeButton { + + static EVENT_CHANGE = "EVENT_CHANGE"; + static xtype = "bi.text_icon_node"; - _defaultConfig: function () { - var conf = BI.TextIconNode.superclass._defaultConfig.apply(this, arguments); + _defaultConfig() { + const conf = super._defaultConfig(arguments); - return BI.extend(conf, { + return extend(conf, { baseCls: (conf.baseCls || "") + " bi-text-icon-node", cls: "close-ha-font", iconHeight: null, @@ -18,10 +25,10 @@ BI.TextIconNode = BI.inherit(BI.NodeButton, { textLgap: 0, textRgap: 0, }); - }, + } - render: function () { - var self = this, o = this.options; + render() { + const o = this.options; return { type: "bi.vertical_adapt", @@ -29,8 +36,8 @@ BI.TextIconNode = BI.inherit(BI.NodeButton, { items: [{ el: { type: "bi.label", - ref: function (_ref) { - self.text = _ref; + ref: (_ref) => { + this.text = _ref; }, cls: "list-item-text", textAlign: "left", @@ -52,40 +59,38 @@ BI.TextIconNode = BI.inherit(BI.NodeButton, { iconHeight: o.iconHeight, }], }; - }, + } - doClick: function () { - BI.TextIconNode.superclass.doClick.apply(this, arguments); + doClick() { + super.doClick.apply(this, arguments); if (this.isValid()) { - this.fireEvent(BI.TextIconNode.EVENT_CHANGE, this.getValue(), this); + this.fireEvent(TextIconNode.EVENT_CHANGE, this.getValue(), this); } - }, + } - setValue: function () { + setValue() { if (!this.isReadOnly()) { this.text.setValue.apply(this.text, arguments); } - }, + } - getValue: function () { + getValue() { return this.text.getValue(); - }, + } - setText: function () { + setText() { this.text.setText.apply(this.text, arguments); - }, + } - getText: function () { + getText() { return this.text.getText(); - }, + } - doRedMark: function () { + doRedMark() { this.text.doRedMark.apply(this.text, arguments); - }, + } - unRedMark: function () { + unRedMark() { this.text.unRedMark.apply(this.text, arguments); - }, -}); -BI.TextIconNode.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.text_icon_node", BI.TextIconNode); + } +} diff --git a/src/base/single/button/node/textnode.js b/src/base/single/button/node/textnode.js index 6ecaa3fbf..80aadb0d3 100644 --- a/src/base/single/button/node/textnode.js +++ b/src/base/single/button/node/textnode.js @@ -1,16 +1,25 @@ +import { NodeButton } from "../button.node" +import { extend, shortcut } from "../../../../core" + /** * guy * * Created by GUY on 2015/9/9. - * @class BI.TextNode - * @extends BI.NodeButton + * @class TextNode + * @extends NodeButton */ -BI.TextNode = BI.inherit(BI.NodeButton, { +@shortcut() +export class TextNode extends NodeButton { + + static xtype = "bi.text_node" + + static EVENT_CHANGE = "EVENT_CHANGE" + - _defaultConfig: function () { - var conf = BI.TextNode.superclass._defaultConfig.apply(this, arguments); + _defaultConfig() { + const conf = super._defaultConfig(arguments); - return BI.extend(conf, { + return extend(conf, { baseCls: (conf.baseCls || "") + " bi-text-node", textAlign: "left", whiteSpace: "nowrap", @@ -19,10 +28,10 @@ BI.TextNode = BI.inherit(BI.NodeButton, { textLgap: 0, textRgap: 0, }); - }, + } - render: function () { - var o = this.options; + render() { + const o = this.options; this.text = BI.createWidget({ type: "bi.label", element: this, @@ -39,40 +48,38 @@ BI.TextNode = BI.inherit(BI.NodeButton, { keyword: o.keyword, py: o.py, }); - }, + } - doClick: function () { - BI.TextNode.superclass.doClick.apply(this, arguments); + doClick() { + super.doClick.apply(this, arguments); if (this.isValid()) { - this.fireEvent(BI.TextNode.EVENT_CHANGE, this.getValue(), this); + this.fireEvent(TextNode.EVENT_CHANGE, this.getValue(), this); } - }, + } - doRedMark: function () { + doRedMark() { this.text.doRedMark.apply(this.text, arguments); - }, + } - unRedMark: function () { + unRedMark() { this.text.unRedMark.apply(this.text, arguments); - }, + } - setValue: function () { + setValue() { if (!this.isReadOnly()) { this.text.setValue.apply(this.text, arguments); } - }, + } - getValue: function () { + getValue() { return this.text.getValue(); - }, + } - setText: function () { + setText() { this.text.setText.apply(this.text, arguments); - }, + } - getText: function () { + getText() { return this.text.getText(); - }, -}); -BI.TextNode.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.text_node", BI.TextNode); + } +} diff --git a/src/core/index.js b/src/core/index.js index 18b15a0f2..f4fcbf7c2 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -41,6 +41,9 @@ export * from './2.base'; export * from './4.widget'; export * from './5.inject'; +// 有了后删掉 +export const emptyFn = () => { } + export { shortcut, OB,