菜单管理

frontend/src/views/authority/resource/index.vue

@@ -28,11 +28,12 @@
   import { useHandleData } from '@/hooks/useHandleData'
     import type { Function } from "@/api/user/interface/function"
   import ProTable from '@/components/ProTable/index.vue'
-  import {CirclePlus, Delete, EditPen,HomeFilled} from '@element-plus/icons-vue'
+  import {Back, CirclePlus, Delete, EditPen,HomeFilled} from '@element-plus/icons-vue'
   import type { ColumnProps, ProTableInstance } from '@/components/ProTable/interface'
   import { useDictStore } from '@/stores/modules/dict'
   import ResourcePopup from './components/resourcePopup.vue'
   import {deleteFunction,getFunctionList} from '@/api/user/function/index'
+  import * as Icons from '@element-plus/icons-vue'
   const dictStore = useDictStore()
   const resourcePopup = ref()
   // ProTable 实例
@@ -45,6 +46,8 @@
       prop: 'name',
       label: '名称',
       minWidth: 150,
+      align:'left',
+      headerAlign: 'center',
       search: { el: 'input' },
     },
     {
@@ -73,7 +76,18 @@
       prop: 'icon',
       label: '图标',
       minWidth: 100,
-      
+      render: scope => {
+      const customIcons: { [key: string]: any } = Icons
+      const iconKey = scope.row.icon; // 
+      if (!iconKey || !customIcons[iconKey]) {
+      // 如果 iconKey 为空或未定义，或者 customIcons 中找不到对应的图标，返回一个空的 <span> 标签
+      return <span></span>;
+    }
+      const icon = customIcons[iconKey]; // 如果找不到图标，使用默认图标
+      return (
+        <el-button  icon={icon} />
+      );
+    },
     },
     {
       prop: 'path',
@@ -97,6 +111,7 @@
       minWidth: 70,
       render: scope => {
         return (
+         
           <el-tag type={scope.row.state ? 'success' : 'danger'} > {scope.row.state ? '正常' : '禁用'} </el-tag>
         )
       },