周五定时更新

power_leasing/src/views/account/index.vue

@@ -38,8 +38,7 @@
             v-for="item in displayedLinks"
             :key="item.to"
             :to="item.to"
-            class="side-link"
-            active-class="active"
+            :class="['side-link', isActiveLink(item.to) ? 'active' : '']"
           >{{ item.label }}</router-link>
         </nav>
       </aside>
@@ -104,13 +103,16 @@ export default {
       if (raw == null) return null
       try { return JSON.parse(raw) } catch (e) { return raw }
     }
-    const val = getVal('userName') || getVal('userEmail') || ''
+    const val =getVal('leasEmail') || ''
     this.userEmail = typeof val === 'string' ? val : String(val)
     // 恢复上次选择的导航分组（如无则默认 seller）
     const savedRole = getVal('accountActiveRole')
     if (savedRole === 'buyer' || savedRole === 'seller') {
-      this.activeRole = savedRole
+      this.activeRole = savedRole    
+      
     }
+    // 根据当前路由自动匹配分组，确保左侧导航高亮正确
+    this.setActiveRoleByRoute()
   },
   methods: {
     /**
@@ -122,8 +124,78 @@ export default {
       if (role !== 'buyer' && role !== 'seller') return
       this.activeRole = role
       try { localStorage.setItem('accountActiveRole', JSON.stringify(role)) } catch (e) {}
+      // 切换分组后，立即跳转到该分组的第一个导航页面
+      try {
+        const firstPath = role === 'buyer'
+          ? (this.buyerLinks && this.buyerLinks[0] && this.buyerLinks[0].to)
+          : (this.sellerLinks && this.sellerLinks[0] && this.sellerLinks[0].to)
+        if (firstPath && this.$route && this.$route.path !== firstPath) {
+          this.$router.push(firstPath)
+        }
+      } catch (e) { /* noop */ }
     },
+    /**
+     * 根据当前路由自动选择导航分组，保证进入“我的店铺”等卖家页面时左侧高亮正确
+     */
+    setActiveRoleByRoute() {
+      const path = (this.$route && this.$route.path) || ''
+      // 买家前缀优先匹配，确保“已购详情”等页面归属买家侧
+      const buyerPrefixes = [
+        '/account/wallet',
+        '/account/purchased',
+        '/account/purchased-detail',
+        '/account/orders',
+        '/account/funds-flow'
+      ]
+      const sellerPrefixes = [
+        '/account/shops',
+        '/account/shop-new',
+        '/account/product-new',
+        '/account/products',
+        '/account/product-detail',
+        '/account/product-machine-add',
+        '/account/seller-orders',
+        '/account/order-detail',
+        '/account/receipt-record',
+        '/account/shop-config'
+      ]
+      const shouldBuyer = buyerPrefixes.some(p => path.indexOf(p) === 0)
+      const shouldSeller = sellerPrefixes.some(p => path.indexOf(p) === 0)
+      const role = shouldBuyer ? 'buyer' : (shouldSeller ? 'seller' : this.activeRole)
+      if (this.activeRole !== role) {
+        this.activeRole = role
+        try { localStorage.setItem('accountActiveRole', JSON.stringify(role)) } catch (e) {}
+      }
+    },
+    /**
+     * 判断左侧导航项是否高亮
+     * - 普通路径完全匹配
+     * - “已售出订单”需同时匹配详情页 /account/order-detail/:id
+     */
+    isActiveLink(pathLike) {
+      const current = (this.$route && this.$route.path) || ''
+      if (!pathLike) return false
+      // 列表-详情联动高亮映射
+      const map = {
+        '/account/seller-orders': ['/account/seller-orders', '/account/order-detail'],
+        '/account/products': ['/account/products', '/account/product-detail'],
+        '/account/purchased': ['/account/purchased', '/account/purchased-detail']
+      }
+      const prefixes = map[pathLike]
+      if (Array.isArray(prefixes)) {
+        return prefixes.some(p => current.indexOf(p) === 0)
+      }
+      return current.indexOf(pathLike) === 0
+    }
   },
+  watch: {
+    '$route.path': {
+      immediate: true,
+      handler() {
+        this.setActiveRoleByRoute()
+      }
+    }
+  }
 };
 </script>
 
@@ -172,6 +244,7 @@ export default {
   display: flex;
   gap: 8px;
   margin-bottom: 8px;
+  margin-top: 18px;
 }
 .role-button {
   appearance: none;