Blame view

Yi.Vben5.Vue3/playground/src/views/system/menu/data.ts 2.55 KB
515fceeb   “wangming”   框架初始化
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
  import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
  import type { SystemMenuApi } from '#/api/system/menu';
  
  import { $t } from '#/locales';
  
  export function getMenuTypeOptions() {
    return [
      {
        color: 'processing',
        label: $t('system.menu.typeCatalog'),
        value: 'catalog',
      },
      { color: 'default', label: $t('system.menu.typeMenu'), value: 'menu' },
      { color: 'error', label: $t('system.menu.typeButton'), value: 'button' },
      {
        color: 'success',
        label: $t('system.menu.typeEmbedded'),
        value: 'embedded',
      },
      { color: 'warning', label: $t('system.menu.typeLink'), value: 'link' },
    ];
  }
  
  export function useColumns(
    onActionClick: OnActionClickFn<SystemMenuApi.SystemMenu>,
  ): VxeTableGridOptions<SystemMenuApi.SystemMenu>['columns'] {
    return [
      {
        align: 'left',
        field: 'meta.title',
        fixed: 'left',
        slots: { default: 'title' },
        title: $t('system.menu.menuTitle'),
        treeNode: true,
        width: 250,
      },
      {
        align: 'center',
        cellRender: { name: 'CellTag', options: getMenuTypeOptions() },
        field: 'type',
        title: $t('system.menu.type'),
        width: 100,
      },
      {
        field: 'authCode',
        title: $t('system.menu.authCode'),
        width: 200,
      },
      {
        align: 'left',
        field: 'path',
        title: $t('system.menu.path'),
        width: 200,
      },
  
      {
        align: 'left',
        field: 'component',
        formatter: ({ row }) => {
          switch (row.type) {
            case 'catalog':
            case 'menu': {
              return row.component ?? '';
            }
            case 'embedded': {
              return row.meta?.iframeSrc ?? '';
            }
            case 'link': {
              return row.meta?.link ?? '';
            }
          }
          return '';
        },
        minWidth: 200,
        title: $t('system.menu.component'),
      },
      {
        cellRender: { name: 'CellTag' },
        field: 'status',
        title: $t('system.menu.status'),
        width: 100,
      },
  
      {
        align: 'right',
        cellRender: {
          attrs: {
            nameField: 'name',
            onClick: onActionClick,
          },
          name: 'CellOperation',
          options: [
            {
              code: 'append',
              text: '新增下级',
            },
            'edit', // 默认的编辑按钮
            'delete', // 默认的删除按钮
          ],
        },
        field: 'operation',
        fixed: 'right',
        headerAlign: 'center',
        showOverflow: false,
        title: $t('system.menu.operation'),
        width: 200,
      },
    ];
  }