caoww
/
fineui
forked from fanruan/fineui
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge branch 'master' of ssh://code.fineres.com:7999/~dailer/fineui

es6
zsmj 2 years ago
parent
0d06e641da 02793827ad
commit
98f86e6709
5 changed files with 233 additions and 164 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 31
      demo/js/base/button/demo.button.js
  2. 2
      package.json
  3. 347
      src/base/single/button/buttons/button.js
  4. 5
      src/base/single/tip/tip.toast.js
  5. 12
      src/case/combo/bubblecombo/popup.bubble.js

31
demo/js/base/button/demo.button.js
Unescape View File

@ -213,6 +213,35 @@ Demo.Button = BI.inherit(BI.Widget, {
}, },
height: 30 height: 30
} }
}, {
el: {
type: "bi.button",
text: "图标在上面的按钮，而且可以自动撑开高度",
iconCls: "close-font",
iconGap: 24,
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 () {
@ -228,4 +257,4 @@ Demo.Button = BI.inherit(BI.Widget, {
}; };
} }
}); });
BI.shortcut("demo.button", Demo.Button); BI.shortcut("demo.button", Demo.Button);

2
package.json
Unescape View File

@ -1,6 +1,6 @@
{ {
"name": "fineui", "name": "fineui",
"version": "2.0.20220525190446", "version": "2.0.20220527140850",
"description": "fineui", "description": "fineui",
"main": "dist/fineui.min.js", "main": "dist/fineui.min.js",
"types": "dist/lib/index.d.ts", "types": "dist/lib/index.d.ts",

347
src/base/single/button/buttons/button.js
Unescape View File

@ -1,169 +1,208 @@
/** (function () {
* 文字类型的按钮 function isVertical(position) {
* @class BI.Button return position === "top" || position === "bottom";
* @extends BI.BasicButton }
*
* @cfg {JSON} options 配置属性 /**
* @cfg {'common'/'success'/'warning'/'ignore'} [options.level='common'] 按钮类型，用不同颜色强调不同的场景 * 文字类型的按钮
*/ * @class BI.Button
BI.Button = BI.inherit(BI.BasicButton, { * @extends BI.BasicButton
*
* @cfg {JSON} options 配置属性
* @cfg {'common'/'success'/'warning'/'ignore'} [options.level='common'] 按钮类型，用不同颜色强调不同的场景
*/
BI.Button = BI.inherit(BI.BasicButton, {
_const: { _const: {
iconWidth: 18 iconWidth: 16
}, },
_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, {
baseCls: (conf.baseCls || "") + " bi-button" + ((BI.isIE() && BI.isIE9Below()) ? " hack" : ""), return BI.extend(conf, {
attributes: { baseCls: (conf.baseCls || "") + " bi-button" + ((BI.isIE() && BI.isIE9Below()) ? " hack" : ""),
tabIndex: 1 attributes: {
}, tabIndex: 1
minWidth: (props.block === true || props.clear === true) ? 0 : 80, },
height: 24, minWidth: (props.block === true || props.clear === true) ? 0 : 80,
shadow: props.clear !== true, // 44 = 垂直间距 6 + 边框 2 + 图标 16 + 图标和文字间隔 8 + 文字 12
isShadowShowingOnSelected: true, height: isVertical(props.iconPosition) ? 44 + ((props.iconGap || 8) - 8) : 24,
readonly: true, shadow: props.clear !== true,
iconCls: "", isShadowShowingOnSelected: true,
level: "common", readonly: true,
block: false, // 是否块状显示，即不显示边框，没有最小宽度的限制 iconCls: "",
clear: false, // 是否去掉边框和背景 level: "common",
ghost: false, // 是否幽灵显示, 即正常状态无背景 block: false, // 是否块状显示，即不显示边框，没有最小宽度的限制
textAlign: "center", clear: false, // 是否去掉边框和背景
whiteSpace: "nowrap", ghost: false, // 是否幽灵显示, 即正常状态无背景
textWidth: null, loading: false, // 是否处于加载中
textHeight: null, textAlign: "center",
hgap: props.clear ? 0 : 10, whiteSpace: "nowrap",
vgap: 0, textWidth: null,
tgap: 0, textHeight: null,
bgap: 0, hgap: props.clear ? 0 : 10,
lgap: 0, vgap: 0,
rgap: 0 tgap: 0,
}); bgap: 0,
}, lgap: 0,
rgap: 0,
iconGap: 8,
iconPosition: "left"
});
},
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 (o.clear || o.block) { if (!isVertical(o.iconPosition)) {
lineHeight = o.height; if (o.clear || o.block) {
lineHeight = o.height;
} else {
lineHeight = o.height - 2;
}
} else {
lineHeight = textHeight;
}
}
if (!textHeight) {
if (o.whiteSpace === "nowrap") {
textHeight = lineHeight;
}
}
if (BI.isKey(o.iconCls)) {
this.icon = BI.createWidget({
type: "bi.icon_label",
cls: o.iconCls,
width: this._const.iconWidth,
height: lineHeight,
lineHeight: lineHeight
});
this.text = BI.createWidget({
type: "bi.label",
text: o.text,
textWidth: BI.isNotNull(o.textWidth) ? o.textWidth - this._const.iconWidth : null,
textHeight: textHeight,
height: lineHeight,
value: o.value
});
var layoutType = "bi.horizontal";
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
};
var items = [this.icon, BI.extend({el: this.text}, gapContainer)];
if (isVertical(o.iconPosition)) {
layoutType = "bi.vertical";
}
if (o.iconPosition === "right" || o.iconPosition === "bottom") {
items = [BI.extend({el: this.text}, gapContainer), this.icon];
}
BI.createWidget({
type: "bi.center_adapt",
element: this,
hgap: o.hgap,
vgap: o.vgap,
items: [{
type: layoutType,
horizontalAlign: "center",
verticalAlign: "middle",
items: items
}]
});
} else { } else {
lineHeight = o.height - 2; this.text = BI.createWidget({
type: "bi.label",
height: o.height,
textAlign: o.textAlign,
whiteSpace: o.whiteSpace,
textWidth: o.textWidth,
textHeight: textHeight,
hgap: o.hgap,
vgap: o.vgap,
tgap: o.tgap,
bgap: o.bgap,
lgap: o.lgap,
rgap: o.rgap,
element: this,
text: o.text,
value: o.value
});
} }
} if (o.block === true) {
if (!textHeight) { this.element.addClass("block");
if (o.whiteSpace === "nowrap") {
textHeight = lineHeight;
} }
} if (o.clear === true) {
if (BI.isKey(o.iconCls)) { this.element.addClass("clear");
this.icon = BI.createWidget({ }
type: "bi.icon_label", if (o.ghost === true) {
cls: o.iconCls, this.element.addClass("ghost");
width: this._const.iconWidth, }
height: lineHeight, if (o.loading === true) {
lineHeight: lineHeight, this.element.addClass("loading");
iconWidth: o.iconWidth, }
iconHeight: o.iconHeight if (o.minWidth > 0) {
}); this.element.css({"min-width": o.minWidth / BI.pixRatio + BI.pixUnit});
this.text = BI.createWidget({ }
type: "bi.label", },
text: o.text,
textWidth: BI.isNotNull(o.textWidth) ? o.textWidth - this._const.iconWidth : null,
textHeight: textHeight,
height: lineHeight,
value: o.value
});
BI.createWidget({
type: "bi.center_adapt",
element: this,
hgap: o.hgap,
vgap: o.vgap,
items: [{
type: "bi.horizontal",
columnSize: ["", "fill"],
items: [this.icon, this.text]
}]
});
} else {
this.text = BI.createWidget({
type: "bi.label",
height: o.height,
textAlign: o.textAlign,
whiteSpace: o.whiteSpace,
textWidth: o.textWidth,
textHeight: textHeight,
hgap: o.hgap,
vgap: o.vgap,
tgap: o.tgap,
bgap: o.bgap,
lgap: o.lgap,
rgap: o.rgap,
element: this,
text: o.text,
value: o.value
});
}
if (o.block === true) {
this.element.addClass("block");
}
if (o.clear === true) {
this.element.addClass("clear");
}
if (o.ghost === true) {
this.element.addClass("ghost");
}
if (o.minWidth > 0) {
this.element.css({"min-width": o.minWidth / BI.pixRatio + BI.pixUnit});
}
},
doClick: function () { doClick: function () {
BI.Button.superclass.doClick.apply(this, arguments); BI.Button.superclass.doClick.apply(this, arguments);
if (this.isValid()) { if (this.isValid()) {
this.fireEvent(BI.Button.EVENT_CHANGE, this); this.fireEvent(BI.Button.EVENT_CHANGE, this);
} }
}, },
_setEnable: function (enable) { _setEnable: function (enable) {
BI.Button.superclass._setEnable.apply(this, arguments); BI.Button.superclass._setEnable.apply(this, arguments);
if (enable === true) { if (enable === true) {
this.element.attr("tabIndex", 1); this.element.attr("tabIndex", 1);
} else if (enable === false) { } else if (enable === false) {
this.element.removeAttr("tabIndex"); this.element.removeAttr("tabIndex");
} }
}, },
setText: function (text) { setLoading: function (loading) {
BI.Button.superclass.setText.apply(this, arguments); if(loading) {
this.text.setText(text); this.element.addClass("loading");
}, } else {
this.element.removeClass("loading");
}
},
setValue: function (text) { setText: function (text) {
BI.Button.superclass.setValue.apply(this, arguments); BI.Button.superclass.setText.apply(this, arguments);
if (!this.isReadOnly()) { this.text.setText(text);
this.text.setValue(text); },
}
},
doRedMark: function () { setValue: function (text) {
this.text.doRedMark.apply(this.text, arguments); BI.Button.superclass.setValue.apply(this, arguments);
}, if (!this.isReadOnly()) {
this.text.setValue(text);
}
},
unRedMark: function () { doRedMark: function () {
this.text.unRedMark.apply(this.text, arguments); this.text.doRedMark.apply(this.text, arguments);
}, },
doHighLight: function () { unRedMark: function () {
this.text.doHighLight.apply(this.text, arguments); this.text.unRedMark.apply(this.text, arguments);
}, },
unHighLight: function () { doHighLight: function () {
this.text.unHighLight.apply(this.text, arguments); this.text.doHighLight.apply(this.text, arguments);
} },
});
BI.shortcut("bi.button", BI.Button); unHighLight: function () {
BI.Button.EVENT_CHANGE = "EVENT_CHANGE"; this.text.unHighLight.apply(this.text, arguments);
}
});
BI.shortcut("bi.button", BI.Button);
BI.Button.EVENT_CHANGE = "EVENT_CHANGE";
}());

5
src/base/single/tip/tip.toast.js
Unescape View File

@ -20,7 +20,8 @@ BI.Toast = BI.inherit(BI.Tip, {
text: "", text: "",
level: "success", // success或warning level: "success", // success或warning
autoClose: true, autoClose: true,
closable: null closable: null,
vgap: 7,
}); });
}, },
@ -102,7 +103,7 @@ BI.Toast = BI.inherit(BI.Tip, {
horizontalAlign: BI.HorizontalAlign.Stretch, horizontalAlign: BI.HorizontalAlign.Stretch,
element: this, element: this,
items: items, items: items,
vgap: 12, vgap: o.vgap,
columnSize: columnSize columnSize: columnSize
}); });
}, },

12
src/case/combo/bubblecombo/popup.bubble.js
Unescape View File

@ -48,8 +48,8 @@ BI.BubblePopupBarView = BI.inherit(BI.BubblePopupView, {
if (BI.isWidget(buttonOpt)) { if (BI.isWidget(buttonOpt)) {
items.push({ items.push({
el: buttonOpt, el: buttonOpt,
lgap: i === 0 ? 20 : 15, lgap: i === 0 ? 15 : 10,
rgap: i === o.buttons.length - 1 ? 20 : 0 rgap: i === o.buttons.length - 1 ? 15 : 0
}); });
} else { } else {
items.push({ items.push({
@ -60,14 +60,14 @@ BI.BubblePopupBarView = BI.inherit(BI.BubblePopupView, {
self.fireEvent(BI.BubblePopupBarView.EVENT_CLICK_TOOLBAR_BUTTON, v); self.fireEvent(BI.BubblePopupBarView.EVENT_CLICK_TOOLBAR_BUTTON, v);
} }
}, buttonOpt), }, buttonOpt),
lgap: i === 0 ? 20 : 15, lgap: i === 0 ? 15 : 10,
rgap: i === o.buttons.length - 1 ? 20 : 0 rgap: i === o.buttons.length - 1 ? 15 : 0
}); });
} }
}); });
return BI.createWidget({ return BI.createWidget({
type: "bi.right_vertical_adapt", type: "bi.right_vertical_adapt",
height: 54, height: 44,
items: items items: items
}); });
}, },
@ -90,7 +90,7 @@ BI.BubblePopupBarView = BI.inherit(BI.BubblePopupView, {
}] }]
}); });
button.element.css("min-height", o.minHeight - 54); button.element.css("min-height", o.minHeight - 44);
return button; return button;
} }

Write Preview
Loading…
Cancel
Save