style(web): 统一后台图标与全局视觉

src/views/permission/MenuManagementView.vue

@@ -1,7 +1,7 @@
 <!-- Author: fruit.com.cn -->
 
 <script setup>
-import { Plus } from '@element-plus/icons-vue'
+import { AppIcons } from '@/constants/icons'
 import { menuIconNames, useMenuManagement } from '@/views/permission/composables/useMenuManagement'
 import PageHeading from '@/views/components/PageHeading.vue'
 
@@ -12,7 +12,7 @@ const { treeData, loading, form, parentOptions, resetForm, selectNode, saveMenu,
 <template>
   <PageHeading eyebrow="后台管理" title="菜单管理" description="维护系统菜单结构、路由与按钮权限。">
     <el-button type="primary" @click="resetForm(0)">
-      <el-icon><Plus /></el-icon>
+      <AppIcon :icon="AppIcons.add" />
       新增菜单
     </el-button>
   </PageHeading>

src/views/permission/RoleCategoriesView.vue

@@ -1,7 +1,7 @@
 <!-- Author: fruit.com.cn -->
 
 <script setup>
-import { Plus } from '@element-plus/icons-vue'
+import { AppIcons } from '@/constants/icons'
 import { useRoleCategories } from '@/views/permission/composables/useRoleCategories'
 import PageHeading from '@/views/components/PageHeading.vue'
 
@@ -25,7 +25,7 @@ const {
     description="维护角色分类，方便按职责整理权限角色。"
   >
     <el-button type="primary" class="primary-button" @click="openCreateDialog">
-      <el-icon><Plus /></el-icon>
+      <AppIcon :icon="AppIcons.add" />
       新增分类
     </el-button>
   </PageHeading>

src/views/permission/RoleManagementView.vue

@@ -1,7 +1,7 @@
 <!-- Author: fruit.com.cn -->
 
 <script setup>
-import { Plus } from '@element-plus/icons-vue'
+import { AppIcons } from '@/constants/icons'
 import { useRolePermissionEditor } from '@/views/permission/composables/useRolePermissionEditor'
 import PageHeading from '@/views/components/PageHeading.vue'
 
@@ -36,7 +36,7 @@ function removeRoleRow(row) {
     description="角色等级数字越小权限越高，低等级角色不能修改高等级角色。"
   >
     <el-button type="primary" class="primary-button" @click="dialogVisible = true">
-      <el-icon><Plus /></el-icon>
+      <AppIcon :icon="AppIcons.add" />
       新增角色
     </el-button>
   </PageHeading>

src/views/permission/composables/useMenuManagement.js

@@ -3,17 +3,9 @@
 import { computed, onMounted, reactive, ref } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { createMenuApi, deleteMenuApi, getMenuTreeApi, updateMenuApi } from '@/api/admin/role'
+import { MenuIconOptions, normalizeAppIcon } from '@/constants/icons'
 
-export const menuIconNames = [
-  'Document',
-  'DataAnalysis',
-  'Picture',
-  'User',
-  'Setting',
-  'VideoCamera',
-  'Menu',
-  'Grid'
-]
+export const menuIconNames = MenuIconOptions
 
 /** 菜单管理：直接读写后端 sys_menu，变更后重新登录生效。 */
 export function useMenuManagement() {
@@ -101,7 +93,7 @@ export function useMenuManagement() {
       routePath: raw.path || '',
       routeName: raw.name || '',
       component: raw.component === '#' ? '' : raw.component || '',
-      icon: raw.icon || '',
+      icon: normalizeAppIcon(raw.icon),
       permissionCode: raw.permissionCode || '',
       type: raw.type || 'MENU',
       sort: raw.sort ?? 1,
@@ -121,7 +113,7 @@ export function useMenuManagement() {
       routePath: form.routePath.trim(),
       routeName: form.routeName.trim(),
       component: form.type === 'CATALOG' ? '#' : form.component.trim(),
-      icon: form.icon,
+      icon: form.type === 'BUTTON' ? '' : normalizeAppIcon(form.icon),
       permissionCode: form.permissionCode.trim(),
       type: form.type,
       sort: Number(form.sort) || 1,