forked from fanruan/fineui
guy
8 years ago
14 changed files with 421 additions and 71 deletions
@ -0,0 +1,57 @@ |
|||||||
|
Demo.Func = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-func" |
||||||
|
}, |
||||||
|
render: function () { |
||||||
|
var items = [], header = [], columnSize = []; |
||||||
|
|
||||||
|
var rowCount = 100, columnCount = 100; |
||||||
|
for (var i = 0; i < 1; i++) { |
||||||
|
header[i] = []; |
||||||
|
for (var j = 0; j < columnCount; j++) { |
||||||
|
header[i][j] = { |
||||||
|
type: "bi.label", |
||||||
|
text: "表头" + i + "-" + j |
||||||
|
} |
||||||
|
columnSize[j] = 100; |
||||||
|
} |
||||||
|
} |
||||||
|
for (var i = 0; i < rowCount; i++) { |
||||||
|
items[i] = []; |
||||||
|
for (var j = 0; j < columnCount; j++) { |
||||||
|
items[i][j] = { |
||||||
|
type: "bi.label", |
||||||
|
text: (i < 3 ? 0 : i) + "-" + j |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
var table = BI.createWidget({ |
||||||
|
type: "bi.resizable_table", |
||||||
|
el: { |
||||||
|
type: "bi.grid_table", |
||||||
|
}, |
||||||
|
width: 600, |
||||||
|
height: 500, |
||||||
|
isResizeAdapt: true, |
||||||
|
isNeedResize: true, |
||||||
|
isNeedFreeze: true, |
||||||
|
freezeCols: [0, 1], |
||||||
|
columnSize: columnSize, |
||||||
|
items: items, |
||||||
|
header: header |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
el: table, |
||||||
|
left: 10, |
||||||
|
right: 10, |
||||||
|
top: 10, |
||||||
|
bottom: 10 |
||||||
|
}] |
||||||
|
}) |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.resizable_table", Demo.Func); |
@ -0,0 +1,9 @@ |
|||||||
|
Demo.Func = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-func" |
||||||
|
}, |
||||||
|
|
||||||
|
render: function () { |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.part_tree", Demo.Func); |
@ -0,0 +1,9 @@ |
|||||||
|
Demo.Func = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-func" |
||||||
|
}, |
||||||
|
|
||||||
|
render: function () { |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.sync_tree", Demo.Func); |
@ -0,0 +1,52 @@ |
|||||||
|
Demo.Func = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-func" |
||||||
|
}, |
||||||
|
|
||||||
|
_createDefaultTree: function(){ |
||||||
|
var tree = BI.createWidget({ |
||||||
|
type: "bi.tree_view" |
||||||
|
}); |
||||||
|
tree.initTree([ |
||||||
|
{"id":1, "pId":0, "text":"test1", open:true}, |
||||||
|
{"id":11, "pId":1, "text":"test11"}, |
||||||
|
{"id":12, "pId":1, "text":"test12"}, |
||||||
|
{"id":111, "pId":11, "text":"test111"}, |
||||||
|
{"id":2, "pId":0, "text":"test2", open:true}, |
||||||
|
{"id":21, "pId":2, "text":"test21"}, |
||||||
|
{"id":22, "pId":2, "text":"test22"} |
||||||
|
]) |
||||||
|
return tree; |
||||||
|
}, |
||||||
|
|
||||||
|
render: function () { |
||||||
|
var self = this; |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.grid", |
||||||
|
columns: 1, |
||||||
|
rows: 1, |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
column: 0, |
||||||
|
row: 0, |
||||||
|
el: { |
||||||
|
type: "bi.vtape", |
||||||
|
items: [ |
||||||
|
{ |
||||||
|
el: this._createDefaultTree() |
||||||
|
}, |
||||||
|
{ |
||||||
|
el: { |
||||||
|
type: "bi.label", |
||||||
|
text: 'tree.initTree([{"id":1, "pId":0, "text":"test1", open:true},{"id":11, "pId":1, "text":"test11"},{"id":12, "pId":1, "text":"test12"},{"id":111, "pId":11, "text":"test111"}])', |
||||||
|
whiteSpace: "normal" |
||||||
|
}, |
||||||
|
height: 50 |
||||||
|
} |
||||||
|
] |
||||||
|
} |
||||||
|
}] |
||||||
|
}) |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.tree_view", Demo.Func); |
@ -0,0 +1,245 @@ |
|||||||
|
Demo.Func = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-func" |
||||||
|
}, |
||||||
|
|
||||||
|
_createDefaultTree: function () { |
||||||
|
var TREEITEMS = [{id: -1, pId: -2, value: "根目录", open: true, type: "bi.plus_group_node", height: 25}, |
||||||
|
{id: 1, pId: -1, value: "第一级目录1", type: "bi.plus_group_node", height: 25}, |
||||||
|
{id: 11, pId: 1, value: "第二级文件1", type: "bi.single_select_item", height: 25}, |
||||||
|
{id: 12, pId: 1, value: "第二级目录2", type: "bi.plus_group_node", height: 25}, |
||||||
|
{id: 121, pId: 12, value: "第三级目录1", type: "bi.plus_group_node", height: 25}, |
||||||
|
{id: 122, pId: 12, value: "第三级文件1", type: "bi.single_select_item", height: 25}, |
||||||
|
{id: 1211, pId: 121, value: "第四级目录1", type: "bi.plus_group_node", height: 25}, |
||||||
|
{id: 12111, pId: 1211, value: "第五级文件1", type: "bi.single_select_item", height: 25}, |
||||||
|
{id: 2, pId: -1, value: "第一级目录2", type: "bi.plus_group_node", height: 25}, |
||||||
|
{id: 21, pId: 2, value: "第二级目录3", type: "bi.plus_group_node", height: 25}, |
||||||
|
{id: 22, pId: 2, value: "第二级文件2", type: "bi.single_select_item", height: 25}, |
||||||
|
{id: 211, pId: 21, value: "第三级目录2", type: "bi.plus_group_node", height: 25}, |
||||||
|
{id: 212, pId: 21, value: "第三级文件2", type: "bi.single_select_item", height: 25}, |
||||||
|
{id: 2111, pId: 211, value: "第四级文件1", type: "bi.single_select_item", height: 25}]; |
||||||
|
this.tree = BI.createWidget({ |
||||||
|
type: "bi.custom_tree", |
||||||
|
el: { |
||||||
|
type: "bi.button_tree", |
||||||
|
chooseType: 0, |
||||||
|
layouts: [{ |
||||||
|
type: "bi.vertical", |
||||||
|
hgap: 30 |
||||||
|
}] |
||||||
|
}, |
||||||
|
items: BI.deepClone(TREEITEMS) |
||||||
|
}); |
||||||
|
return this.tree; |
||||||
|
}, |
||||||
|
|
||||||
|
_createAsyncTree: function () { |
||||||
|
this.asyncTree = BI.createWidget({ |
||||||
|
type: "bi.custom_tree", |
||||||
|
itemsCreator: function (op, callback) { |
||||||
|
if (!op.node) {//根节点
|
||||||
|
callback([{ |
||||||
|
"id": 1, |
||||||
|
"pId": 0, |
||||||
|
type: "bi.plus_group_node", |
||||||
|
text: "test1", |
||||||
|
value: 1, |
||||||
|
height: 25, |
||||||
|
isParent: true |
||||||
|
}, { |
||||||
|
"id": 2, |
||||||
|
"pId": 0, |
||||||
|
type: "bi.plus_group_node", |
||||||
|
"text": "test2", |
||||||
|
value: 1, |
||||||
|
isParent: true, |
||||||
|
open: true, |
||||||
|
height: 25 |
||||||
|
}]) |
||||||
|
} else { |
||||||
|
if (op.node.id == 1) { |
||||||
|
callback([ |
||||||
|
{ |
||||||
|
"id": 11, |
||||||
|
"pId": 1, |
||||||
|
type: "bi.plus_group_node", |
||||||
|
"text": "test11", |
||||||
|
value: 11, |
||||||
|
height: 25, |
||||||
|
isParent: true |
||||||
|
}, |
||||||
|
{ |
||||||
|
"id": 12, |
||||||
|
"pId": 1, |
||||||
|
type: "bi.single_select_item", |
||||||
|
"text": "test12", |
||||||
|
value: 12, |
||||||
|
height: 35 |
||||||
|
}, |
||||||
|
{ |
||||||
|
"id": 13, |
||||||
|
"pId": 1, |
||||||
|
type: "bi.single_select_item", |
||||||
|
"text": "test13", |
||||||
|
value: 13, |
||||||
|
height: 35 |
||||||
|
}, |
||||||
|
{ |
||||||
|
"id": 14, |
||||||
|
"pId": 1, |
||||||
|
type: "bi.single_select_item", |
||||||
|
"text": "test14", |
||||||
|
value: 14, |
||||||
|
height: 35 |
||||||
|
}, |
||||||
|
{ |
||||||
|
"id": 15, |
||||||
|
"pId": 1, |
||||||
|
type: "bi.single_select_item", |
||||||
|
"text": "test15", |
||||||
|
value: 15, |
||||||
|
height: 35 |
||||||
|
}, |
||||||
|
{ |
||||||
|
"id": 16, |
||||||
|
"pId": 1, |
||||||
|
type: "bi.single_select_item", |
||||||
|
"text": "test16", |
||||||
|
value: 16, |
||||||
|
height: 35 |
||||||
|
}, |
||||||
|
{"id": 17, "pId": 1, type: "bi.single_select_item", "text": "test17", value: 17, height: 35} |
||||||
|
]) |
||||||
|
} else if (op.node.id == 2) { |
||||||
|
callback([{ |
||||||
|
"id": 21, |
||||||
|
"pId": 2, |
||||||
|
type: "bi.single_select_item", |
||||||
|
"text": "test21", |
||||||
|
value: 21, |
||||||
|
height: 35 |
||||||
|
}, |
||||||
|
{ |
||||||
|
"id": 22, |
||||||
|
"pId": 2, |
||||||
|
type: "bi.single_select_item", |
||||||
|
"text": "test22", |
||||||
|
value: 22, |
||||||
|
height: 35 |
||||||
|
}]) |
||||||
|
} else if (op.node.id == 11) { |
||||||
|
callback([{ |
||||||
|
"id": 111, |
||||||
|
"pId": 11, |
||||||
|
type: "bi.single_select_item", |
||||||
|
"text": "test111", |
||||||
|
value: 111, |
||||||
|
height: 35 |
||||||
|
}]) |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
el: { |
||||||
|
type: "bi.loader", |
||||||
|
next: false, |
||||||
|
el: { |
||||||
|
type: "bi.button_tree", |
||||||
|
chooseType: 0, |
||||||
|
layouts: [{ |
||||||
|
type: "bi.vertical", |
||||||
|
hgap: 30, |
||||||
|
vgap: 0 |
||||||
|
}] |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
return this.asyncTree; |
||||||
|
}, |
||||||
|
|
||||||
|
render: function () { |
||||||
|
var self = this; |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.grid", |
||||||
|
columns: 2, |
||||||
|
rows: 1, |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
column: 0, |
||||||
|
row: 0, |
||||||
|
el: { |
||||||
|
type: "bi.vtape", |
||||||
|
items: [ |
||||||
|
{ |
||||||
|
el: this._createDefaultTree() |
||||||
|
}, |
||||||
|
{ |
||||||
|
el: { |
||||||
|
type: "bi.center", |
||||||
|
hgap: 10, |
||||||
|
items: [{ |
||||||
|
type: "bi.text_button", |
||||||
|
cls: "mvc-button layout-bg2", |
||||||
|
text: "getValue", |
||||||
|
height: 30, |
||||||
|
handler: function () { |
||||||
|
BI.Msg.alert("", JSON.stringify(self.tree.getValue())); |
||||||
|
} |
||||||
|
}, { |
||||||
|
type: "bi.text_button", |
||||||
|
cls: "mvc-button layout-bg2", |
||||||
|
text: "getNodeByValue(第一级目录1)", |
||||||
|
height: 30, |
||||||
|
handler: function () { |
||||||
|
BI.Msg.alert("", "节点名称为: " + self.tree.getNodeByValue("第一级目录1").getValue()); |
||||||
|
} |
||||||
|
}] |
||||||
|
}, |
||||||
|
height: 30 |
||||||
|
} |
||||||
|
] |
||||||
|
} |
||||||
|
}, { |
||||||
|
column: 1, |
||||||
|
row: 0, |
||||||
|
el: { |
||||||
|
type: "bi.vtape", |
||||||
|
items: [ |
||||||
|
{ |
||||||
|
type: "bi.label", |
||||||
|
text: "异步加载数据", |
||||||
|
height: 30 |
||||||
|
}, |
||||||
|
{ |
||||||
|
el: this._createAsyncTree() |
||||||
|
}, |
||||||
|
{ |
||||||
|
el: { |
||||||
|
type: "bi.center", |
||||||
|
hgap: 10, |
||||||
|
items: [{ |
||||||
|
type: "bi.text_button", |
||||||
|
cls: "mvc-button layout-bg2", |
||||||
|
text: "getValue", |
||||||
|
height: 30, |
||||||
|
handler: function () { |
||||||
|
BI.Msg.alert("", JSON.stringify(self.asyncTree.getValue())); |
||||||
|
} |
||||||
|
}, { |
||||||
|
type: "bi.text_button", |
||||||
|
cls: "mvc-button layout-bg2", |
||||||
|
text: "getNodeById(11)", |
||||||
|
height: 30, |
||||||
|
handler: function () { |
||||||
|
BI.Msg.alert("", "节点名称为: " + (self.asyncTree.getNodeById(11) && self.asyncTree.getNodeById(11).getText())); |
||||||
|
} |
||||||
|
}] |
||||||
|
}, |
||||||
|
height: 30 |
||||||
|
} |
||||||
|
] |
||||||
|
} |
||||||
|
}] |
||||||
|
}) |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.custom_tree", Demo.Func); |
Loading…
Reference in new issue