fanruan
/
fineui
4
1
Fork 3
Code Issues 1 Pull Requests Releases Wiki Activity
Browse Source

add some widget

es6
刘荣歆 7 years ago
parent
b6afdf7cda
commit
e150687a00
3 changed files with 394 additions and 0 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. 44
      demo/js/config/widget.js
  2. 205
      demo/js/widget/basewidget/demo.buttons.js
  3. 145
      demo/js/widget/basewidget/demo.tips.js

44
demo/js/config/widget.js
Unescape View File

@ -2,6 +2,50 @@ Demo.WIDGET_CONFIG = [{
id: 4, id: 4,
text: "详细控件", text: "详细控件",
open: true open: true
}, {
pId: 4,
id: 420,
text: '各种小控件',
}, {
pId: 420,
text: "各种通用按钮",
value: "demo.buttons"
}, {
pId: 420,
text: "各种提示性信息",
value: "demo.tips"
}, {
pId: 420,
text: "各种items",
value: "items"
}, {
pId: 420,
text: "各种节点node",
value: "nodes"
}, {
pId: 420,
text: "各种segment",
value: "segments"
}, {
pId: 420,
text: "各种面板",
value: "panes"
}, {
pId: 420,
text: "bi.loading_mask",
value: "loadingmask"
}, {
pId: 420,
text: "可以切换的树",
value: "switch_tree"
}, {
pId: 420,
text: "进度条",
value: "progressbar"
}, {
pId: 1,
text: "bi.text_editor",
value: "text_editor"
}, { }, {
id: 400, id: 400,
pId: 4, pId: 4,

205
demo/js/widget/basewidget/demo.buttons.js
Unescape View File

@ -0,0 +1,205 @@
/**
* Created by Dailer on 2017/7/25.
*/
Demo.Buttons = BI.inherit(BI.Widget, {
props: {
baseCls: "demo-button"
},
render: function () {
var items = [{
el: {
type: 'bi.button',
text: '一般按钮',
level: 'common',
height: 30
}
}, {
el: {
type: 'bi.button',
text: '表示成功状态按钮',
level: 'success',
height: 30
}
},
{
el: {
type: 'bi.button',
text: '表示警告状态的按钮',
level: 'warning',
height: 30
}
}, {
el: {
type: 'bi.button',
text: '表示忽略状态的按钮',
level: 'ignore',
height: 30
}
}, {
el: {
type: 'bi.button',
text: '普通灰化按钮',
disabled: true,
level: 'success',
height: 30
}
}, {
el: {
type: 'bi.button',
text: '忽略状态灰化按钮',
disabled: true,
level: 'ignore',
height: 30
}
}, {
el: {
type: 'bi.button',
text: '带图标的按钮',
//level: 'ignore',
iconClass: "close-font",
height: 30
}
}, {
el: {
type: 'bi.button',
text: '一般按钮',
block: true,
level: 'common',
height: 30
}
}, {
el: {
type: 'bi.button',
text: '表示成功状态按钮',
block: true,
level: 'success',
height: 30
}
},
{
el: {
type: 'bi.button',
text: '表示警告状态的按钮',
block: true,
level: 'warning',
height: 30
}
}, {
el: {
type: 'bi.button',
text: '表示忽略状态的按钮',
block: true,
level: 'ignore',
height: 30
}
}, {
el: {
type: 'bi.button',
text: '普通灰化按钮',
block: true,
disabled: true,
level: 'success',
height: 30
}
}, {
el: {
type: 'bi.button',
text: '忽略状态灰化按钮',
block: true,
disabled: true,
level: 'ignore',
height: 30
}
}, {
el: {
type: 'bi.button',
text: '带图标的按钮',
block: true,
//level: 'ignore',
iconClass: "close-font",
height: 30
}
}, {
el: {
type: 'bi.button',
text: '一般按钮',
clear: true,
level: 'common',
height: 30
}
}, {
el: {
type: 'bi.button',
text: '表示成功状态按钮',
clear: true,
level: 'success',
height: 30
}
},
{
el: {
type: 'bi.button',
text: '表示警告状态的按钮',
clear: true,
level: 'warning',
height: 30
}
}, {
el: {
type: 'bi.button',
text: '表示忽略状态的按钮',
clear: true,
level: 'ignore',
height: 30
}
}, {
el: {
type: 'bi.button',
text: '普通灰化按钮',
clear: true,
disabled: true,
level: 'success',
height: 30
}
}, {
el: {
type: 'bi.button',
text: '忽略状态灰化按钮',
clear: true,
disabled: true,
level: 'ignore',
height: 30
}
}, {
el: {
type: 'bi.button',
text: '带图标的按钮',
clear: true,
//level: 'ignore',
iconClass: "close-font",
height: 30
}
}, {
el: {
type: 'bi.text_button',
text: '文字按钮',
height: 30
}
}
];
BI.each(items, function (i, item) {
item.el.handler = function () {
BI.Msg.alert('按钮', this.options.text);
}
});
return {
type: "bi.left",
vgap: 100,
hgap: 20,
items: items
}
}
});
BI.shortcut("demo.buttons", Demo.Buttons);

145
demo/js/widget/basewidget/demo.tips.js
Unescape View File

@ -0,0 +1,145 @@
/**
* Created by Dailer on 2017/7/25.
*/
Demo.Tips = BI.inherit(BI.Widget, {
props: {
baseCls: "demo-tips"
},
render: function () {
var btns = [];
var bubble = BI.createWidget({
type: "bi.left",
items: [{
el: {
type: 'bi.button',
text: 'bubble测试',
height: 30,
handler: function () {
BI.Bubbles.show("singleBubble1", "bubble测试", this);
btns.push("singleBubble1");
}
}
}, {
el: {
type: 'bi.button',
text: 'bubble测试(居中显示)',
height: 30,
handler: function () {
BI.Bubbles.show("singleBubble2", "bubble测试", this, {
offsetStyle: "center"
});
btns.push("singleBubble2");
}
}
}, {
el: {
type: 'bi.button',
text: 'bubble测试(右边显示)',
height: 30,
handler: function () {
BI.Bubbles.show("singleBubble3", "bubble测试", this, {
offsetStyle: "right"
});
btns.push("singleBubble3");
}
}
}, {
el: {
type: 'bi.button',
text: '隐藏所有 bubble',
height: 30,
handler: function () {
BI.each(btns, function (index, value) {
BI.Bubbles.hide(value);
})
}
}
}],
hgap: 20
});
var title = BI.createWidget({
type: "bi.vertical",
items: [{
type: "bi.label",
cls: "layout-bg1",
height: 50,
title: "title提示",
text: "移上去有title提示",
textAlign: "center"
}, {
type: "bi.label",
cls: "layout-bg6",
height: 50,
disabled: true,
warningTitle: "title错误提示",
text: "移上去有title错误提示",
textAlign: "center"
}, {
type: "bi.label",
cls: "layout-bg2",
height: 50,
disabled: true,
tipType: "success",
title: "自定义title提示效果",
warningTitle: "自定义title提示效果",
text: "自定义title提示效果",
textAlign: "center"
}],
hgap: 20,
vgap: 20
});
var toast = BI.createWidget({
type: "bi.vertical",
items: [{
el: {
type: 'bi.button',
text: '简单Toast测试',
height: 30,
handler: function () {
BI.Msg.toast("这是一条简单的数据");
}
}
}, {
el: {
type: 'bi.button',
text: '很长的Toast测试',
height: 30,
handler: function () {
BI.Msg.toast("这是一条很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长的数据")
}
}
}, {
el: {
type: 'bi.button',
text: '非常长的Toast测试',
height: 30,
handler: function () {
BI.Msg.toast("这是一条非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长的数据")
}
}
}, {
el: {
type: 'bi.button',
text: '错误提示Toast测试',
level: "warning",
height: 30,
handler: function () {
BI.Msg.toast("错误提示Toast测试", "warning");
}
}
}],
vgap: 20
});
return {
type: "bi.horizontal_auto",
vgap: 20,
hgap: 20,
items: [bubble, title, toast]
}
}
});
BI.shortcut("demo.tips", Demo.Tips);
Write Preview
Loading…
Cancel
Save