增加icon

src/configs/iscsStyleConfig.ts

@@ -4,18 +4,26 @@ import { IscsStyle } from 'src/api/DraftApi';
 const DA_SHI_ZHI_NENG = [
   {
     menuName: 'Plan',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-Plan',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-Plan-active',
     sunMenu: [{ sunMenuName: '子目录' }],
   },
   {
     menuName: 'PSCADA',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-PSCADA',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-PSCADA-active',
     sunMenu: [{ sunMenuName: '子目录' }],
   },
   {
     menuName: 'BAS',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-BAS',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-BAS-active',
     sunMenu: [{ sunMenuName: '子目录' }],
   },
   {
     menuName: 'FAS',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-FAS',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-FAS-active',
     sunMenu: [
       { sunMenuName: '设备分区图' },
       { sunMenuName: '火灾报警平面图' },
@@ -24,58 +32,86 @@ const DA_SHI_ZHI_NENG = [
   },
   {
     menuName: 'TFDS',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-TFDS',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-TFDS-active',
     sunMenu: [{ sunMenuName: '子目录' }],
   },
   {
     menuName: 'AFC',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-AFC',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-AFC-active',
     sunMenu: [{ sunMenuName: '屏蔽门' }],
   },
   {
     menuName: 'CCTV',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-CCTV',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-CCTV-active',
     sunMenu: [{ sunMenuName: '监控布局图' }, { sunMenuName: 'CCTV设备布局图' }],
   },
   {
     menuName: 'PIS',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-PIS',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-PIS-active',
     sunMenu: [{ sunMenuName: '子目录' }],
   },
   {
     menuName: 'PA',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-PA',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-PA-active',
     sunMenu: [{ sunMenuName: '子目录' }],
   },
   {
     menuName: 'SIG/RAD',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-SIG/RAD',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-SIG/RAD-active',
     sunMenu: [{ sunMenuName: '子目录' }],
   },
   {
     menuName: 'ACS',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-ACS',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-ACS-active',
     sunMenu: [{ sunMenuName: '子目录' }],
   },
   {
     menuName: 'PSD',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-PSD',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-PSD-active',
     sunMenu: [{ sunMenuName: '子目录' }],
   },
   {
     menuName: 'FG',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-FG',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-FG-active',
     sunMenu: [{ sunMenuName: '子目录' }],
   },
   {
     menuName: 'ALM',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-ALM',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-ALM-active',
     sunMenu: [{ sunMenuName: '子目录' }],
   },
   {
     menuName: 'NMS',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-NMS',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-NMS-active',
     sunMenu: [{ sunMenuName: '子目录' }],
   },
   {
     menuName: 'OPS',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-OPS',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-OPS-active',
     sunMenu: [{ sunMenuName: '子目录' }],
   },
   {
     menuName: '数据',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-Data',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-Data-active',
     sunMenu: [{ sunMenuName: '子目录' }],
   },
   {
     menuName: '联动',
+    icon: 'svguse:../iscsMenuIcon.svg#icon-Linkage',
+    activeIcon: 'svguse:../iscsMenuIcon.svg#icon-Linkage-active',
     sunMenu: [{ sunMenuName: '子目录' }],
   },
 ];

src/layouts/IscsDrawLayout.vue

@@ -60,7 +60,11 @@
             :key="index"
             @click="selectedMenu(item.value)"
           >
-            <q-icon class="menu-nav-img" name="warning" />
+            <q-icon
+              size="18px"
+              class="menu-nav-img"
+              :name="selectMenuName == item.value ? item.activeIcon : item.icon"
+            />
             <div
               class="menu-nav-text"
               :class="{
@@ -457,12 +461,21 @@ function selectedSubMenu(subName: string) {
   forceReloadDate();
 }
 
-let iscsTypeConfig: { menuName: string; sunMenu: { sunMenuName: string }[] }[] =
+let iscsTypeConfig: {
-  [];
+  menuName: string;
+  icon: string;
+  activeIcon: string;
+  sunMenu: { sunMenuName: string }[];
+}[] = [];
 function initMunuOption() {
   iscsTypeConfig = getIscsStyleConfig(route.query.iscsStyle as IscsStyle);
   menuOption = iscsTypeConfig.map((menu) => {
-    return { label: menu.menuName, value: menu.menuName };
+    return {
+      label: menu.menuName,
+      value: menu.menuName,
+      icon: menu.icon,
+      activeIcon: menu.activeIcon,
+    };
   });
   selectMenuName.value = menuOption[0].value;
   subMenuOption.value = iscsTypeConfig[0].sunMenu.map((sunMenu) => {