From ec47e147dcded88e418c9f2a603bf3e0f2937b10 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=83=AD=E6=B0=B8=E8=B6=85?= <2090205686@qq.com>
Date: Thu, 28 Aug 2025 10:39:34 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=88=20perf(=E8=BF=90=E8=90=A5=E5=B9=B3?=
 =?UTF-8?q?=E5=8F=B0=E9=A1=B6=E9=83=A8=E8=8F=9C=E5=8D=95=E5=BC=80=E5=8F=91?=
 =?UTF-8?q?=E7=8A=B6=E6=80=81=E7=AE=A1=E7=90=86=EF=BC=8C=E5=88=B7=E6=96=B0?=
 =?UTF-8?q?=E4=BF=9D=E6=8C=81=E8=8F=9C=E5=8D=95=E9=AB=98=E4=BA=AE):?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 sub-operation-service/src/App.vue             | 54 ++++++++++++++++++-
 .../src/layouts/component/Header/index.vue    | 22 ++++++--
 .../src/store/modules/menuStore.js            | 26 +++++++++
 .../views/ecommerce/components/filtertop.vue  | 54 ++++++++++++++-----
 .../farmingService/farmingConsult/index.vue   |  2 +-
 5 files changed, 141 insertions(+), 17 deletions(-)
 create mode 100644 sub-operation-service/src/store/modules/menuStore.js

diff --git a/sub-operation-service/src/App.vue b/sub-operation-service/src/App.vue
index 7a2b418..a63f1e6 100644
--- a/sub-operation-service/src/App.vue
+++ b/sub-operation-service/src/App.vue
@@ -12,7 +12,7 @@
 </template>
 
 <script setup name="app">
-import { computed } from 'vue';
+import { computed, onMounted, ref } from 'vue';
 import { useSettingStore } from '@/store/modules/setting';
 // 配置element中文
 import zhCn from 'element-plus/es/locale/lang/zh-cn';
@@ -20,6 +20,58 @@ import zhCn from 'element-plus/es/locale/lang/zh-cn';
 const SettingStore = useSettingStore();
 // 配置全局组件大小
 const size = computed(() => SettingStore.themeConfig.globalComSize);
+
+const meuns = ref([
+  {
+    label: '智慧种植',
+    path: '/sub-operation-service/smartFarm',
+  },
+  {
+    label: '电商交易',
+    path: '/sub-operation-service/ecommerce',
+  },
+  {
+    label: '农事服务',
+    path: '/sub-operation-service/farmService',
+  },
+  {
+    label: '分拣包装',
+    path: '/sub-operation-service/packaging',
+  },
+  {
+    label: '仓储物流',
+    path: '/sub-operation-service/warehouseLogistics',
+  },
+  {
+    label: '涉农金融',
+    path: '/sub-operation-service/finance',
+  },
+  {
+    label: '公共品牌',
+    path: '/sub-operation-service/brand',
+  },
+  {
+    label: '综合看板',
+    path: '/sub-operation-service/dashboard',
+  },
+]);
+import { useRoute } from 'vue-router';
+import { useMenuStore } from '@/store/modules/menuStore';
+const route = useRoute();
+const menuStore = useMenuStore();
+onMounted(() => {
+  let item = meuns.value.find((item) => route.path.indexOf(item.path) > -1);
+  console.log('item', item);
+  if (item) {
+    menuStore.setMenuLabel(item.label);
+    menuStore.setMenuPath(item.path);
+  } else {
+    menuStore.setMenuLabel('智慧种植');
+    menuStore.setMenuPath('/sub-operation-service/smartFarm');
+  }
+  console.log(menuStore.activeMenuLabel);
+  console.log(menuStore.activeMenuPath);
+});
 </script>
 
 <style lang="scss">
diff --git a/sub-operation-service/src/layouts/component/Header/index.vue b/sub-operation-service/src/layouts/component/Header/index.vue
index f964112..a3124ac 100644
--- a/sub-operation-service/src/layouts/component/Header/index.vue
+++ b/sub-operation-service/src/layouts/component/Header/index.vue
@@ -60,8 +60,8 @@
       </div>
       <div class="layout-header-menu">
         <el-menu ellipsis class="layout-header-bottom-menu" mode="horizontal">
-          <app-link v-for="(item, index) in meuns" :key="index" :to="item.path">
-            <el-menu-item active-text-color="#25BF82">{{ item.label }}</el-menu-item>
+          <app-link v-for="(item, index) in meuns" :key="index" :to="item.path" @click="clickMenu(item)">
+            <el-menu-item :style="{ color: activeLabel == item.label ? '#25BF82' : '' }">{{ item.label }}</el-menu-item>
           </app-link>
         </el-menu>
       </div>
@@ -70,13 +70,14 @@
 </template>
 
 <script setup name="layout-header">
-import { ref, onMounted, onBeforeUnmount } from 'vue';
+import { ref, onMounted, onBeforeUnmount, watch } from 'vue';
 import { qrImg } from './base64img';
 import AppLink from '../Menu/Link.vue';
 import { useRouter } from 'vue-router';
 import { getAssetsFile } from '@/utils';
 import { getGoodNum } from '@/apis/agricultural.js';
 import { useMethodsStore } from '@/store/modules/methods';
+import { useMenuStore } from '@/store/modules/menuStore';
 
 const router = useRouter();
 
@@ -117,6 +118,21 @@ const meuns = ref([
   },
 ]);
 
+const menuStore = useMenuStore();
+const activeLabel = ref(menuStore.activeMenuLabel);
+const clickMenu = (item) => {
+  menuStore.setMenuLabel(item.label);
+  menuStore.setMenuPath(item.path);
+  activeLabel.value = item.label;
+};
+watch(
+  () => menuStore.getMenuLabel(),
+  (newValue) => {
+    console.log('menuStore.getMenuLabel()', newValue);
+    activeLabel.value = newValue;
+  }
+);
+
 const goodNum = ref(0);
 
 const methodsStore = useMethodsStore();
diff --git a/sub-operation-service/src/store/modules/menuStore.js b/sub-operation-service/src/store/modules/menuStore.js
new file mode 100644
index 0000000..259b2e6
--- /dev/null
+++ b/sub-operation-service/src/store/modules/menuStore.js
@@ -0,0 +1,26 @@
+import { defineStore } from 'pinia';
+
+export const useMenuStore = defineStore({
+  id: 'menuStore',
+  state: () => ({
+    activeMenuLabel: localStorage.getItem('activeMenuLabel') || '智慧种植',
+    activeMenuPath: localStorage.getItem('activeMenuPath') || '/sub-operation-service/smartFarm',
+  }),
+  getters: {},
+  actions: {
+    setMenuLabel(val) {
+      this.activeMenuLabel = val;
+      localStorage.setItem('activeMenuLabel', val);
+    },
+    getMenuLabel() {
+      return this.activeMenuLabel;
+    },
+    setMenuPath(val) {
+      this.activeMenuPath = val;
+      localStorage.setItem('activeMenuPath', val);
+    },
+    getMenuPath() {
+      return this.activeMenuPath;
+    },
+  },
+});
diff --git a/sub-operation-service/src/views/ecommerce/components/filtertop.vue b/sub-operation-service/src/views/ecommerce/components/filtertop.vue
index b05a734..c8606e4 100644
--- a/sub-operation-service/src/views/ecommerce/components/filtertop.vue
+++ b/sub-operation-service/src/views/ecommerce/components/filtertop.vue
@@ -116,40 +116,70 @@ const select = reactive(maxLevelAndNodes.value.LevelVal);
 
 const handlelist = (key) => {
   if (!key || !maxLevelAndNodes.value.levelMap[key]) return [];
-  let LevelKey = maxLevelAndNodes.value.LevelKey || [];
   const originalList = maxLevelAndNodes.value.levelMap[key];
   const parentKey = String(Number(key) - 1); // 上一层级的 key
   const parentVal = select[parentKey]; // 上一层级的选中状态
 
   // 如果是第一层级，直接返回所有数据
-  if (LevelKey[0] === key || !parentVal || parentVal.id === '') {
-    // 对数据进行排序，按照 id 字母顺序排序
-    // console.log('originalList', originalList);
-
+  if (key === '1') {
     return originalList;
   }
 
-  // 如果上一层级有选中的 pId，筛选当前层级的数据
-  if (parentVal && parentVal.id) {
-    //.sort((a, b) => a.id.localeCompare(b.id))
-
+  // 如果是第二层级，判断父级（第一层级）的选中状态
+  if (key === '2') {
+    // 如果父级选择了"全部"（id为空）或者没有选中任何项，显示所有二级数据
+    if (!parentVal || parentVal.id === '') {
+      return originalList;
+    }
+    // 如果父级选择了具体项，只显示对应的二级数据
+    return originalList.filter((m) => m.parentId === parentVal.id);
+  }
+
+  // 其他层级的情况（如果有更多层级）
+  if (parentVal && parentVal.id) {
     return originalList.filter((m) => m.parentId === parentVal.id);
   }
 
-  // 如果上一层级没有选中任何项，返回空数组
   return [];
 };
 
 const selectItem = (index, key, item) => {
+  console.log('selectItem', key);
+  console.log('selectItem', item);
   if (key && item.id) {
     currentLevel.value = index || 0;
     select[key] = { id: item.id, parentId: item.parentId ? item.parentId : null };
-    emit('select', { id: item.id });
+
+    // 重置当前层级以下所有层级的选中状态为"全部"
+    const currentLevelNum = Number(key);
+    const LevelKey = maxLevelAndNodes.value.LevelKey || [];
+
+    LevelKey.forEach((level) => {
+      const levelNum = Number(level);
+      if (levelNum > currentLevelNum) {
+        select[level] = { id: '', parentId: '' };
+      }
+    });
+
+    emit('select', select);
   }
 };
 
 const selectAll = (key) => {
-  select[key].id = '';
+  console.log('selectAll', key);
+  console.log('selectAll', select);
+  // 重置当前层级及以下所有层级的选中状态
+  const levelNum = Number(key);
+  const LevelKey = maxLevelAndNodes.value.LevelKey || [];
+
+  // 遍历当前层级及以下所有层级，重置选中状态
+  LevelKey.forEach((level) => {
+    const levelInt = Number(level);
+    if (levelInt >= levelNum) {
+      select[level] = { id: '', parentId: '' };
+    }
+  });
+
   emit('select', select);
 };
 
diff --git a/sub-operation-service/src/views/farmingService/farmingConsult/index.vue b/sub-operation-service/src/views/farmingService/farmingConsult/index.vue
index 2a8bfdf..60e653e 100644
--- a/sub-operation-service/src/views/farmingService/farmingConsult/index.vue
+++ b/sub-operation-service/src/views/farmingService/farmingConsult/index.vue
@@ -92,7 +92,7 @@ const queryList = () => {
         if (tableData.value[i].content.length > 80) {
           tableData.value[i].content += '......';
         }
-        console.log(tableData.value[i].content, tableData.value[i].content.length);
+        // console.log(tableData.value[i].content, tableData.value[i].content.length);
       }
     }
   });