diff --git a/packages/fineui/src/case/button/switch.js b/packages/fineui/src/case/button/switch.js index 904f2607e..81510ed45 100644 --- a/packages/fineui/src/case/button/switch.js +++ b/packages/fineui/src/case/button/switch.js @@ -1,15 +1,13 @@ import { AbsoluteLayout, shortcut, i18nText } from "@/core"; import { TextButton, Label, BasicButton } from "@/base"; +const CIRCLE_SIZE = 12; + @shortcut() export class Switch extends BasicButton { static xtype = "bi.switch"; static EVENT_CHANGE = "EVENT_CHANGE"; - constants = { - CIRCLE_SIZE: 12, - }; - props = { extraCls: "bi-switch", attributes: { @@ -17,13 +15,13 @@ export class Switch extends BasicButton { }, height: 20, width: 44, - showTip: false, + showTip: true, + textGap: 8, }; render() { - const o = this.options, - c = this.constants; - const tgap = (o.height - c.CIRCLE_SIZE) / 2; + const { selected, width, height, textGap, showTip } = this.options; + const tgap = (height - CIRCLE_SIZE) / 2; return { type: AbsoluteLayout.xtype, @@ -39,15 +37,15 @@ export class Switch extends BasicButton { width: 12, height: 12, top: tgap, - left: o.selected ? o.width - 16 : 4, + left: selected ? width - height + tgap : tgap, }, { type: Label.xtype, text: i18nText("BI-Basic_Simple_Open"), cls: "content-tip", - left: 8, + left: textGap, top: tgap - 2, - invisible: !(o.showTip && o.selected), + invisible: !(showTip && selected), ref: _ref => { this.openTip = _ref; }, @@ -56,9 +54,9 @@ export class Switch extends BasicButton { type: Label.xtype, text: i18nText("BI-Basic_Simple_Close"), cls: "content-tip", - right: 8, + right: textGap, top: tgap - 2, - invisible: !(o.showTip && !o.selected), + invisible: !(showTip && !selected), ref: _ref => { this.closeTip = _ref; }, @@ -78,7 +76,9 @@ export class Switch extends BasicButton { setSelected(v) { super.setSelected(...arguments); - this.layout.attr("items")[0].left = v ? this.options.width - 16 : 4; + const { width, height } = this.options; + const tgap = (height - CIRCLE_SIZE) / 2; + this.layout.attr("items")[0].left = v ? width - height + tgap : tgap; this.layout.resize(); this.options.showTip && this.openTip.setVisible(v); this.options.showTip && this.closeTip.setVisible(!v); diff --git a/packages/fineui/typescript/case/button/switch.ts b/packages/fineui/typescript/case/button/switch.ts index dc4489892..2b08b4b98 100644 --- a/packages/fineui/typescript/case/button/switch.ts +++ b/packages/fineui/typescript/case/button/switch.ts @@ -1,6 +1,11 @@ import { BasicButton } from "../../base/single/button/button.basic"; export declare class Switch extends BasicButton { + + props: { + textGap: number; + } & BasicButton['props'] + static xtype: string; static EVENT_CHANGE: string; }