Browse Source

DESIGN-4069 fix: 按钮增加闭包

es6
treecat 3 years ago
parent
commit
ddd8fcf5d6
  1. 28
      demo/js/base/button/demo.button.js
  2. 35
      src/base/single/button/buttons/button.js

28
demo/js/base/button/demo.button.js

@ -213,6 +213,34 @@ Demo.Button = BI.inherit(BI.Widget, {
}, },
height: 30 height: 30
} }
}, {
el: {
type: "bi.button",
text: "图标在上面的按钮",
iconCls: "close-font",
iconPosition: "top"
}
}, {
el: {
type: "bi.button",
text: "图标在下面的按钮",
iconCls: "close-font",
iconPosition: "bottom"
}
}, {
el: {
type: "bi.button",
text: "图标在左边的按钮",
iconCls: "close-font",
iconPosition: "left"
}
}, {
el: {
type: "bi.button",
text: "图标在右边的按钮",
iconCls: "close-font",
iconPosition: "right"
}
}]; }];
// BI.each(items, function (i, item) { // BI.each(items, function (i, item) {
// item.el.handler = function () { // item.el.handler = function () {

35
src/base/single/button/buttons/button.js

@ -1,8 +1,9 @@
function isVertical(position) { (function () {
function isVertical(position) {
return position === "top" || position === "bottom"; return position === "top" || position === "bottom";
} }
/** /**
* 文字类型的按钮 * 文字类型的按钮
* @class BI.Button * @class BI.Button
* @extends BI.BasicButton * @extends BI.BasicButton
@ -10,7 +11,7 @@ function isVertical(position) {
* @cfg {JSON} options 配置属性 * @cfg {JSON} options 配置属性
* @cfg {'common'/'success'/'warning'/'ignore'} [options.level='common'] 按钮类型用不同颜色强调不同的场景 * @cfg {'common'/'success'/'warning'/'ignore'} [options.level='common'] 按钮类型用不同颜色强调不同的场景
*/ */
BI.Button = BI.inherit(BI.BasicButton, { BI.Button = BI.inherit(BI.BasicButton, {
_const: { _const: {
iconWidth: 16 iconWidth: 16
@ -19,7 +20,6 @@ BI.Button = BI.inherit(BI.BasicButton, {
_defaultConfig: function (props) { _defaultConfig: function (props) {
var conf = BI.Button.superclass._defaultConfig.apply(this, arguments); var conf = BI.Button.superclass._defaultConfig.apply(this, arguments);
return BI.extend(conf, { return BI.extend(conf, {
baseCls: (conf.baseCls || "") + " bi-button" + ((BI.isIE() && BI.isIE9Below()) ? " hack" : ""), baseCls: (conf.baseCls || "") + " bi-button" + ((BI.isIE() && BI.isIE9Below()) ? " hack" : ""),
attributes: { attributes: {
@ -48,17 +48,17 @@ BI.Button = BI.inherit(BI.BasicButton, {
rgap: 0, rgap: 0,
iconGap: 4, iconGap: 4,
iconPosition: "left", iconPosition: "left",
iconSize: props.iconSize || 12 iconSize: props.iconSize
}); });
}, },
render: function () { render: function () {
var o = this.options, self = this; var o = this.options;
// 由于button默认情况下有个边框,所以要主动算行高 // 由于button默认情况下有个边框,所以要主动算行高
var lineHeight, textHeight = o.textHeight; var lineHeight, textHeight = o.textHeight;
if (BI.isNumber(o.height)) { if (BI.isNumber(o.height)) {
if(!isVertical(o.iconPosition)) { if (!isVertical(o.iconPosition)) {
if (o.clear || o.block) { if (o.clear || o.block) {
lineHeight = o.height; lineHeight = o.height;
} else { } else {
@ -74,17 +74,19 @@ BI.Button = BI.inherit(BI.BasicButton, {
} }
} }
if (BI.isKey(o.iconCls)) { if (BI.isKey(o.iconCls)) {
var iconCss = {};
if (o.iconSize) {
iconCss.fontSize = o.iconSize / BI.pixRatio + BI.pixUnit;
}
this.icon = BI.createWidget({ this.icon = BI.createWidget({
type: "bi.icon_label", type: "bi.icon_label",
cls: o.iconCls, cls: o.iconCls,
width: o.iconWidth, width: o.iconWidth,
height: o.iconHeight, height: o.iconHeight,
lineHeight: o.iconHeight, lineHeight: o.iconHeight,
iconWidth: o.iconWidth, iconWidth: o.iconSize,
iconHeight: o.iconHeight, iconHeight: o.iconSize,
css: { css: iconCss
fontSize: o.iconSize + "px"
}
}); });
this.text = BI.createWidget({ this.text = BI.createWidget({
type: "bi.label", type: "bi.label",
@ -196,6 +198,7 @@ BI.Button = BI.inherit(BI.BasicButton, {
unHighLight: function () { unHighLight: function () {
this.text.unHighLight.apply(this.text, arguments); this.text.unHighLight.apply(this.text, arguments);
} }
}); });
BI.shortcut("bi.button", BI.Button); BI.shortcut("bi.button", BI.Button);
BI.Button.EVENT_CHANGE = "EVENT_CHANGE"; BI.Button.EVENT_CHANGE = "EVENT_CHANGE";
}());

Loading…
Cancel
Save