canrd-outside / order-erp-front · Commits

Commit 5f1a6cdc599d5840df2dfebdaad029aac093cd81

Authored by 无木
1 parent 02d3dca5

feat(demo): demo default expanded tree table 

演示默认展开树形表格数据
Inline Side-by-side
Showing 1 changed file with 10 additions and 3 deletions
src/views/demo/system/menu/index.vue
  View file @5f1a6cd
1 1 <template>
2 2 <div>
3   - <BasicTable @register="registerTable">
  3 + <BasicTable @register="registerTable" @fetch-success="onFetchSuccess">
4 4 <template #toolbar>
5 5 <a-button type="primary" @click="handleCreate"> 新增菜单 </a-button>
6 6 </template>
... ... @@ -27,7 +27,7 @@
27 27 </div>
28 28 </template>
29 29 <script lang="ts">
30   - import { defineComponent } from 'vue';
  30 + import { defineComponent, nextTick } from 'vue';
31 31  
32 32 import { BasicTable, useTable, TableAction } from '/@/components/Table';
33 33 import { getMenuList } from '/@/api/demo/system';
... ... @@ -42,7 +42,7 @@
42 42 components: { BasicTable, MenuDrawer, TableAction },
43 43 setup() {
44 44 const [registerDrawer, { openDrawer }] = useDrawer();
45   - const [registerTable, { reload }] = useTable({
  45 + const [registerTable, { reload, expandAll }] = useTable({
46 46 title: '菜单列表',
47 47 api: getMenuList,
48 48 columns,
... ... @@ -50,6 +50,7 @@
50 50 labelWidth: 120,
51 51 schemas: searchFormSchema,
52 52 },
  53 + isTreeTable: true,
53 54 pagination: false,
54 55 striped: false,
55 56 useSearchForm: true,
... ... @@ -87,6 +88,11 @@
87 88 reload();
88 89 }
89 90  
  91 + function onFetchSuccess() {
  92 + // 演示默认展开所有表项
  93 + nextTick(expandAll);
  94 + }
  95 +
90 96 return {
91 97 registerTable,
92 98 registerDrawer,
... ... @@ -94,6 +100,7 @@
94 100 handleEdit,
95 101 handleDelete,
96 102 handleSuccess,
  103 + onFetchSuccess,
97 104 };
98 105 },
99 106 });
... ...