diff --git a/src/components/common-form/public.d.ts b/src/components/common-form/public.d.ts index 3f5e0d4..460dcdd 100644 --- a/src/components/common-form/public.d.ts +++ b/src/components/common-form/public.d.ts @@ -32,7 +32,7 @@ export interface CommonFormOption { /**表单类型*/ type: 'input' | 'input-number' | 'cascader' | 'radio' | 'radio-group' | 'radio-button' | 'checkbox' | 'checkbox-group' | 'checkbox-button' | 'date-picker' - | 'time-picker' | 'switch' | 'select' | 'option' | 'slider' | 'transfer' | 'upload' | 'common-icon-select' | 'common-autocomplete'; + | 'time-picker' | 'switch' | 'select' | 'option' | 'slider' | 'transfer' | 'upload' | 'common-icon-select' | 'common-autocomplete' | 'tree-select'; /**数据值*/ value?: any; /**属性名*/ @@ -62,4 +62,6 @@ export interface CommonFormOption { children?: Array; /**async-validator验证器*/ rules: Array; + /**change事件*/ + change: (val: any) => void } diff --git a/src/components/public.d.ts b/src/components/public.d.ts index 42413ec..2635ae3 100644 --- a/src/components/public.d.ts +++ b/src/components/public.d.ts @@ -12,3 +12,11 @@ export interface CommonPage { totalCount?: number; } +/** + * element树结构 + */ +export interface CommonTreeNode { + value: string; + label: string; + children: Array; +} diff --git a/src/services/menu/MenuService.js b/src/services/menu/MenuService.js index fc47cf1..140c9f8 100644 --- a/src/services/menu/MenuService.js +++ b/src/services/menu/MenuService.js @@ -24,9 +24,10 @@ export const loadMenuResult = (id, config) => { } /** + * @param menus {MenuDto[]} * @return {[CommonFormOption]} */ -export const useMenuFormOptions = () => { +export const useMenuFormOptions = (menus) => { return [{ labelKey: 'menu.label.menuNameCn', prop: 'nameCn', @@ -37,7 +38,11 @@ export const useMenuFormOptions = () => { required: true }, { labelKey: 'menu.label.menuParent', - prop: 'parentId' + prop: 'parentId', + type: 'tree-select', + attrs: { + data: menus ? menus.map(menu2TreeMenu) : [] + } }, { labelKey: 'menu.label.menuIcon', prop: 'iconCls', @@ -48,6 +53,24 @@ export const useMenuFormOptions = () => { }] } +/** + * @param menu {MenuDto} + * @return {CommonTreeNode} + */ +export const menu2TreeMenu = (menu) => { + /** + * @type {CommonTreeNode} + */ + const treeNode = { + value: menu.id, + label: $i18nMsg(menu.nameCn, menu.nameEn) + } + if (menu.children) { + treeNode.children = menu.children.map(menu2TreeMenu) + } + return treeNode +} + /** * 接口菜单格式转换成页面展示格式 * @param menu {MenuDto} diff --git a/src/views/admin/MenuEdit.vue b/src/views/admin/MenuEdit.vue index d1d7519..e9cca40 100644 --- a/src/views/admin/MenuEdit.vue +++ b/src/views/admin/MenuEdit.vue @@ -1,15 +1,17 @@