代码提交

f

src/components/Header.vue

@@ -2,7 +2,7 @@
   <div class="header">
     <div class="left" @click="back" style="cursor: pointer">
       <i v-if="hasBack" class="el-icon-back" ></i>
-      <span style="font-size: 20px">{{ name }}</span>
+      <span style="font-size: 20px">{{ modelName }}</span>
     </div>
     <div class="right">
       <el-popover
@@ -33,14 +33,17 @@ import { onMounted, reactive, toRefs } from 'vue'
 import { useRouter } from 'vue-router'
 import { localRemove, pathMap } from '@/utils'
 import myApi from '@/api/myApi.js'
+import {useStore} from 'vuex';
 export default {
   name: 'Header',
   setup() {
     const router = useRouter()
+    const store = useStore();
     const state = reactive({
       name: 'dashboard',
       userInfo: null,
-      hasBack: false
+      hasBack: false,
+      modelName: ''
     })
     onMounted(() => {
       const pathname = window.location.hash.split('/')[1] || ''
@@ -63,7 +66,8 @@ export default {
     router.afterEach((to) => {
       console.log('to', to)
       const { id } = to.query
-      state.name = pathMap[to.name]
+      state.name = pathMap[to.name];
+      state.modelName = store.state.modelName;
       // state.hasBack = ['level2', 'level3', 'order_detail'].includes(to.name)
     })
     return {

src/components/Menus.vue

@@ -1,6 +1,13 @@
 <template>
   <ul>
-    <li v-for="(item,i) in menus" :class="activeI === i? 'active-menu' : ''" @click="activeI = i, go(i)"> {{ item.name }} </li>
+    <li
+      v-for="(item, i) in menus"
+      :class="activeI === i ? 'active-menu' : ''"
+      :key="i"
+      @click="(activeI = i), go(i)"
+    >
+      {{ item.name }}
+    </li>
   </ul>
 </template>
 
@@ -14,12 +21,12 @@ export default {
     const router = useRouter();
     const state = reactive({
       activeI: 0,
-      menus: []
+      menus: [],
     });
     onMounted(() => {
       if (props.pactiveI) {
         state.activeI = props.pactiveI;
-        state.menus = props.menus
+        state.menus = props.menus;
       }
     });
 
@@ -28,7 +35,7 @@ export default {
     };
     return {
       ...toRefs(state),
-      go
+      go,
     };
   },
 };
@@ -54,11 +61,11 @@ ul {
     display: flex;
     align-items: center;
     justify-content: center;
-    box-shadow: 0 0 8px #99ACB0 inset;
+    box-shadow: 0 0 8px #99acb0 inset;
     border-radius: 5px;
-    &.active-menu 
-    {
-      background:#A7DCF5;
+    font-size: 24px;
+    &.active-menu {
+      background: #a7dcf5;
     }
   }
 }

src/store/index.js

@@ -7,7 +7,8 @@ const store = createStore({
         currentPath: '',
         userInfo: {},
         selectDate: 0,
-        selectTab: 'old'
+        selectTab: 'old',
+        modelName: ''
     },
     mutations: {
         updateCurrentPath(state, path) {
@@ -22,6 +23,9 @@ const store = createStore({
         changeSelectTab(state, data) {
             state.selectTab = data;
         },
+        setModelName(state, data) {
+            state.modelName = data;
+        }
     },
     actions: {
         updateCurrentPath({ commit }, path) {

src/views/Green.vue

@@ -42,7 +42,7 @@ export default {
           name: '数据分析',
         },
         {
-          name: '历史数据',
+          name: '数据记录',
         }
       ],
     })

src/views/Home.vue

@@ -16,10 +16,12 @@
 <script>
 import { onMounted, reactive, ref, toRefs, nextTick } from "vue";
 import { useRouter } from "vue-router";
+import {useStore} from 'vuex';
 export default {
   name: 'home',
   setup() {
     const router = useRouter();
+    const store = useStore();
     const state = reactive({
       menus: [{
         name: '处理&回用系统',
@@ -42,6 +44,7 @@ export default {
       }]
     })
     const go = (item) => {
+      store.commit("setModelName", item.name);
       router.push(item.url);
     }
     return {

src/views/Weather.vue

@@ -42,7 +42,7 @@ export default {
           name: '数据分析',
         },
         {
-          name: '历史数据',
+          name: '数据记录',
         }
       ],
     })