|
|
@ -1,15 +1,13 @@ |
|
|
|
import { AbsoluteLayout, shortcut, i18nText } from "@/core"; |
|
|
|
import { AbsoluteLayout, shortcut, i18nText } from "@/core"; |
|
|
|
import { TextButton, Label, BasicButton } from "@/base"; |
|
|
|
import { TextButton, Label, BasicButton } from "@/base"; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const CIRCLE_SIZE = 12; |
|
|
|
|
|
|
|
|
|
|
|
@shortcut() |
|
|
|
@shortcut() |
|
|
|
export class Switch extends BasicButton { |
|
|
|
export class Switch extends BasicButton { |
|
|
|
static xtype = "bi.switch"; |
|
|
|
static xtype = "bi.switch"; |
|
|
|
static EVENT_CHANGE = "EVENT_CHANGE"; |
|
|
|
static EVENT_CHANGE = "EVENT_CHANGE"; |
|
|
|
|
|
|
|
|
|
|
|
constants = { |
|
|
|
|
|
|
|
CIRCLE_SIZE: 12, |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
props = { |
|
|
|
props = { |
|
|
|
extraCls: "bi-switch", |
|
|
|
extraCls: "bi-switch", |
|
|
|
attributes: { |
|
|
|
attributes: { |
|
|
@ -17,13 +15,13 @@ export class Switch extends BasicButton { |
|
|
|
}, |
|
|
|
}, |
|
|
|
height: 20, |
|
|
|
height: 20, |
|
|
|
width: 44, |
|
|
|
width: 44, |
|
|
|
showTip: false, |
|
|
|
showTip: true, |
|
|
|
|
|
|
|
textGap: 8, |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
render() { |
|
|
|
render() { |
|
|
|
const o = this.options, |
|
|
|
const { selected, width, height, textGap, showTip } = this.options; |
|
|
|
c = this.constants; |
|
|
|
const tgap = (height - CIRCLE_SIZE) / 2; |
|
|
|
const tgap = (o.height - c.CIRCLE_SIZE) / 2; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return { |
|
|
|
return { |
|
|
|
type: AbsoluteLayout.xtype, |
|
|
|
type: AbsoluteLayout.xtype, |
|
|
@ -39,15 +37,15 @@ export class Switch extends BasicButton { |
|
|
|
width: 12, |
|
|
|
width: 12, |
|
|
|
height: 12, |
|
|
|
height: 12, |
|
|
|
top: tgap, |
|
|
|
top: tgap, |
|
|
|
left: o.selected ? 28 : 4, |
|
|
|
left: selected ? width - height + tgap : tgap, |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
{ |
|
|
|
type: Label.xtype, |
|
|
|
type: Label.xtype, |
|
|
|
text: i18nText("BI-Basic_Simple_Open"), |
|
|
|
text: i18nText("BI-Basic_Simple_Open"), |
|
|
|
cls: "content-tip", |
|
|
|
cls: "content-tip", |
|
|
|
left: 8, |
|
|
|
left: textGap, |
|
|
|
top: tgap - 2, |
|
|
|
top: tgap - 2, |
|
|
|
invisible: !(o.showTip && o.selected), |
|
|
|
invisible: !(showTip && selected), |
|
|
|
ref: _ref => { |
|
|
|
ref: _ref => { |
|
|
|
this.openTip = _ref; |
|
|
|
this.openTip = _ref; |
|
|
|
}, |
|
|
|
}, |
|
|
@ -56,9 +54,9 @@ export class Switch extends BasicButton { |
|
|
|
type: Label.xtype, |
|
|
|
type: Label.xtype, |
|
|
|
text: i18nText("BI-Basic_Simple_Close"), |
|
|
|
text: i18nText("BI-Basic_Simple_Close"), |
|
|
|
cls: "content-tip", |
|
|
|
cls: "content-tip", |
|
|
|
right: 8, |
|
|
|
right: textGap, |
|
|
|
top: tgap - 2, |
|
|
|
top: tgap - 2, |
|
|
|
invisible: !(o.showTip && !o.selected), |
|
|
|
invisible: !(showTip && !selected), |
|
|
|
ref: _ref => { |
|
|
|
ref: _ref => { |
|
|
|
this.closeTip = _ref; |
|
|
|
this.closeTip = _ref; |
|
|
|
}, |
|
|
|
}, |
|
|
@ -78,7 +76,9 @@ export class Switch extends BasicButton { |
|
|
|
|
|
|
|
|
|
|
|
setSelected(v) { |
|
|
|
setSelected(v) { |
|
|
|
super.setSelected(...arguments); |
|
|
|
super.setSelected(...arguments); |
|
|
|
this.layout.attr("items")[0].left = v ? 28 : 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.layout.resize(); |
|
|
|
this.options.showTip && this.openTip.setVisible(v); |
|
|
|
this.options.showTip && this.openTip.setVisible(v); |
|
|
|
this.options.showTip && this.closeTip.setVisible(!v); |
|
|
|
this.options.showTip && this.closeTip.setVisible(!v); |
|
|
|