Browse Source

显示模块名称功能新增

Koishi 3 years ago
parent
commit
348627363e
4 changed files with 75 additions and 14 deletions
  1. 5 1
      public/static/config/modeConfig.js
  2. 51 13
      src/App.vue
  3. 7 0
      src/store/index.js
  4. 12 0
      src/views/layout/Header.vue

+ 5 - 1
public/static/config/modeConfig.js

@@ -15,6 +15,9 @@ const tilesMaxLevel = 18;
 // 适配器地址
 const adapterUrl = "http://10.155.32.4:8011/";
 
+// 切换模块时是否提示当前模块名称(用于对内介项目时便捷显示模块名称)
+const showModuleName = true;
+
 if (localTest) {
     // baseURL = "http://192.168.10.13:8082/" // 联机调试 - 石林
     // baseURL = "http://10.155.32.33:9001/" // 联机调试 - 谢生杰
@@ -34,5 +37,6 @@ window.__MODE__ = {
     websocketUrl,
     adapterUrl,
     tilesUrl,
-    tilesMaxLevel
+    tilesMaxLevel,
+    showModuleName
 };

+ 51 - 13
src/App.vue

@@ -253,19 +253,31 @@ l16.229-16.229l16.229,16.229l42.867-42.867C115.034,45.228,109.133,42.189,102.956
         text-color="#ffffff"
         active-text-color="#6262a2"
         background-color="#36348e"
+        @select="selectMenu"
       >
-        <el-sub-menu :index="index" :title="item.text" v-for="(item , index) in menuData">
+        <el-sub-menu
+          :index="index"
+          :title="item.text"
+          v-for="(item, index) in menuData"
+          :key="index"
+        >
           <template #title>
-			  <router-link :to="item.path">
-				<el-icon>
-				  <SvgIcon :svgid="item.icon" />
-				</el-icon>
-			</router-link>
+            <router-link :to="item.path">
+              <el-icon>
+                <SvgIcon :svgid="item.icon" />
+              </el-icon>
+            </router-link>
           </template>
-          <el-menu-item-group v-for="(menu , idx) in item.children" :index="idx">
-			  <router-link :to="menu.path">
-				<el-menu-item :index="index+'-'+idx">{{menu.text}}</el-menu-item>
-			</router-link>
+          <el-menu-item-group
+            v-for="(menu, idx) in item.children"
+            :index="idx"
+            :key="idx"
+          >
+            <router-link :to="menu.path">
+              <el-menu-item :index="index + '-' + idx">{{
+                menu.text
+              }}</el-menu-item>
+            </router-link>
           </el-menu-item-group>
         </el-sub-menu>
       </el-menu>
@@ -314,7 +326,7 @@ export default {
       isLogined: true,
       showSisView: false,
       memuCloseTimeout: null,
-	  menuData:[]
+      menuData: [],
     };
   },
 
@@ -373,15 +385,41 @@ export default {
     login(params) {
       if (params.username && params.password) this.isLogined = true;
     },
+    selectMenu(menuIndex) {
+      this.menuIndex = menuIndex;
+    },
   },
 
   watch: {
     $route(res) {
       this.showSisView = res.fullPath === "/sisView";
+      let ActiveModule = null;
+      this.menuData.forEach((pEle) => {
+        if (pEle.path === res.fullPath) {
+          ActiveModule = pEle;
+        }
+        pEle?.children?.forEach((cEle) => {
+          if (cEle.path === res.fullPath) {
+            ActiveModule = cEle;
+          }
+        });
+      });
+      if (ActiveModule) {
+        this.$store.dispatch("changeModuleName", ActiveModule.text);
+      }
     },
     "$store.state.menuData"(res) {
-		this.menuData = res;
-	},
+      this.menuData = res;
+    },
+    "$store.state.moudleName"(msg) {
+      if (window.__MODE__.showModuleName && msg) {
+        this.BASE.showMsg({
+          type: this.$store.state.themeName === "dark" ? "success" : "warning",
+          showClose: true,
+          msg,
+        });
+      }
+    },
   },
 };
 </script>

+ 7 - 0
src/store/index.js

@@ -11,6 +11,7 @@ const state = {
   themeName: localStorage.getItem("themeName") || "dark", // 主题
   menuData: [],
   windturbineMap: {},
+  moudleName: "",
 };
 
 //改变状态的方法
@@ -26,6 +27,9 @@ const mutations = {
   },
   changeMenuData(state, newData) {
     state.menuData = newData;
+  },
+  changeModuleName(state, newData) {
+    state.moudleName = newData;
   }
 };
 
@@ -38,6 +42,9 @@ const actions = {
   },
   changeMenuData(context, str) {
     context.commit("changeMenuData", str);
+  },
+  changeModuleName(context, str) {
+    context.commit("changeModuleName", str);
   }
 };
 

+ 12 - 0
src/views/layout/Header.vue

@@ -146,6 +146,12 @@ export default {
     click(index, data) {
       this.activeIndex = index;
       this.$router.push(data.path);
+      const ActiveModule = this.menus.find((ele) => {
+        return ele.path === data.path;
+      });
+      if (ActiveModule) {
+        this.$store.dispatch("changeModuleName", ActiveModule.text);
+      }
     },
     clickSubMenu(index, code) {
       // console.log(index, code);
@@ -173,6 +179,12 @@ export default {
         this.menus.some((t, index) => {
           if (val.path.includes(t.id)) {
             this.activeIndex = index;
+            const ActiveModule = this.menus.find((ele) => {
+              return ele.path === val.path;
+            });
+            if (ActiveModule) {
+              this.$store.dispatch("changeModuleName", ActiveModule.text);
+            }
           }
         });
       },