1610945813
* 1.增加treeTable 2.增加两个treeTable的demo * 1.增加treeTable的使用功能说明 * 优化代码，去除console * 修复bug * 修复marLTemp变量未清空的bug * 修复marLTemp变量未清空的bug * 修复marLTemp变量未清空的bug * 修改customTree，使其展示无columns时的功能
122 lines
2.8 KiB
Vue
122 lines
2.8 KiB
Vue
<template>
|
|
<tree-table :data="data" :columns="columns">
|
|
</tree-table>
|
|
</template>
|
|
|
|
<script>
|
|
/**
|
|
Auth: Lei.j1ang
|
|
Created: 2018/1/19-14:54
|
|
*/
|
|
import treeTable from '@/components/TreeTable'
|
|
export default {
|
|
name: 'tree',
|
|
components: { treeTable },
|
|
data() {
|
|
return {
|
|
columns: [
|
|
{
|
|
text: '事件',
|
|
value: 'event',
|
|
width: 200
|
|
},
|
|
{
|
|
text: 'ID',
|
|
value: 'id'
|
|
},
|
|
{
|
|
text: '时间线',
|
|
value: 'timeLine'
|
|
},
|
|
{
|
|
text: '备注',
|
|
value: 'comment'
|
|
}
|
|
],
|
|
data: [
|
|
{
|
|
id: 0,
|
|
event: '事件1',
|
|
timeLine: 50,
|
|
comment: '无'
|
|
},
|
|
{
|
|
id: 1,
|
|
event: '事件1',
|
|
timeLine: 100,
|
|
comment: '无',
|
|
children: [
|
|
{
|
|
id: 2,
|
|
event: '事件2',
|
|
timeLine: 10,
|
|
comment: '无'
|
|
},
|
|
{
|
|
id: 3,
|
|
event: '事件3',
|
|
timeLine: 90,
|
|
comment: '无',
|
|
children: [
|
|
{
|
|
id: 4,
|
|
event: '事件4',
|
|
timeLine: 5,
|
|
comment: '无'
|
|
},
|
|
{
|
|
id: 5,
|
|
event: '事件5',
|
|
timeLine: 10,
|
|
comment: '无'
|
|
},
|
|
{
|
|
id: 6,
|
|
event: '事件6',
|
|
timeLine: 75,
|
|
comment: '无',
|
|
children: [
|
|
{
|
|
id: 7,
|
|
event: '事件7',
|
|
timeLine: 50,
|
|
comment: '无',
|
|
children: [
|
|
{
|
|
id: 71,
|
|
event: '事件71',
|
|
timeLine: 25,
|
|
comment: 'xx'
|
|
},
|
|
{
|
|
id: 72,
|
|
event: '事件72',
|
|
timeLine: 5,
|
|
comment: 'xx'
|
|
},
|
|
{
|
|
id: 73,
|
|
event: '事件73',
|
|
timeLine: 20,
|
|
comment: 'xx'
|
|
}
|
|
]
|
|
},
|
|
{
|
|
id: 8,
|
|
event: '事件8',
|
|
timeLine: 25,
|
|
comment: '无'
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}
|
|
}
|
|
}
|
|
</script>
|