From e910a006dc7fb387ff4e2d22437dbcb4cfa064ab Mon Sep 17 00:00:00 2001
From: lihui <lihui030304@163.com>
Date: Fri, 25 Jul 2025 15:11:15 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E6=97=A0=E6=9D=83=E9=99=90=E8=B7=B3?=
 =?UTF-8?q?=E7=A9=BA=E7=99=BD=E9=A1=B5=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/audit/audit.vue           | 86 +++++++++++++++++++++----------------
 src/views/consume/coinConsume.vue   | 68 +++++++++++++++++++++++------
 src/views/recharge/coinRecharge.vue | 74 +++++++++++++++++++++++--------
 src/views/refund/coinRefund.vue     | 64 +++++++++++++++++++++------
 src/views/usergold/clientCount.vue  | 82 ++++++++++++++++++++++++++---------
 5 files changed, 274 insertions(+), 100 deletions(-)

diff --git a/src/views/audit/audit.vue b/src/views/audit/audit.vue
index 3df670e..5beaad0 100644
--- a/src/views/audit/audit.vue
+++ b/src/views/audit/audit.vue
@@ -1,66 +1,80 @@
 <template>
   <div>
-    <!-- 这里放置标签切换的按钮 -->
     <el-button-group>
-      <!-- 切换后状态显示 primary 样式否则是默认样式 -->
       <el-button
           :type="activeTab === 'rechargeAudit' ? 'primary' : 'default'"
-          @click="goRechargeAudit"
+          @click="navigateTo('rechargeAudit')"
       >
         充值审核
       </el-button>
       <el-button
           :type="activeTab === 'refundAudit' ? 'primary' : 'default'"
-          @click="goRefundAudit"
+          @click="navigateTo('refundAudit')"
       >
         退款审核
       </el-button>
     </el-button-group>
-    <!-- 渲染子路由组件 -->
     <router-view></router-view>
   </div>
 </template>
 
-<script setup >
-import {onMounted, ref, watch} from 'vue';
-import { useRouter, useRoute } from 'vue-router';
+<script setup>
+import {ref, watch, onMounted} from 'vue';
+import {useRouter, useRoute} from 'vue-router';
+import {storeToRefs} from 'pinia';
+import {useAdminStore} from '@/store/index.js';
 
-const router = useRouter();// 获取路由实例
-const route = useRoute();// 获取当前路由信息
-// 定义响应式变量 activeTab 来跟踪当前激活的标签
-const activeTab = ref(route.name === 'rechargeAudit' ? 'rechargeAudit' : 'refundAudit');
-//也就是说如果当前在clientCountBalance页面，那么就是balance，否则默认情况都展示detail页面
-//此时获取到的路由信息是clientCountDetail，所以默认是detail
+const router = useRouter();
+const route = useRoute();
+const adminStore = useAdminStore();
+const {menuTree} = storeToRefs(adminStore);
 
+const activeTab = ref('');
 
-const goRechargeAudit = () => {
-  // 点击按钮时更新 activeTab 为 detail
-  activeTab.value = 'rechargeAudit';
-  router.push({ name: 'rechargeAudit' });
+// 导航方法
+const navigateTo = (name) => {
+  activeTab.value = name;
+  router.push({name});
 };
 
-const goRefundAudit = () => {
-  // 点击按钮时更新 activeTab 为balance
-  activeTab.value = 'refundAudit';
-  router.push({ name: 'refundAudit' });
+// 递归判断某个 menuName 是否存在
+const hasMenuPermission = (tree, targetName) => {
+  for (const node of tree) {
+    if (node.menuName === targetName) return true;
+    if (node.children && hasMenuPermission(node.children, targetName)) return true;
+  }
+  return false;
 };
 
-// 监听路由变化，更新 activeTab
-watch(() => route.name, (newName) => {
-  if (newName === 'rechargeAudit') {
-    activeTab.value = 'rechargeAudit';
-  } else if (newName === 'refundAudit') {
-    activeTab.value = 'refundAudit';
-  }});
+// 默认路由判断
+const getDefaultAuditRoute = () => {
+  if (!menuTree.value) return 'rechargeAudit';
 
-// 当进入父路由时，默认跳转到金币明细页面
-// if (route.name === 'usergold') {
-//   router.push({ name: 'clientCountDetail' });
-// }
+  const hasRecharge = hasMenuPermission(menuTree.value, '充值审核');
+  return hasRecharge ? 'rechargeAudit' : 'refundAudit';
+};
+// 监听路由变化更新标签状态
+watch(() => route.name, (newName) => {
+  if (newName === 'rechargeAudit' || newName === 'refundAudit') {
+    activeTab.value = newName;
+  } else if (newName === 'audit') {
+    // 每次访问 /audit 都进行默认跳转
+    const defaultRoute = getDefaultAuditRoute();
+    navigateTo(defaultRoute);
+  }
+});
 
 
-onMounted(async function () {
-  console.log("@@@@@@@@@@@@",route.name)
+// 初始化逻辑
+onMounted(() => {
+  if (route.name === 'audit') {
+    const defaultRoute = getDefaultAuditRoute();
+    navigateTo(defaultRoute);
+  } else {
+    // 非父路由初始化当前标签状态
+    if (route.name === 'rechargeAudit' || route.name === 'refundAudit') {
+      activeTab.value = route.name;
+    }
+  }
 });
-
 </script>
diff --git a/src/views/consume/coinConsume.vue b/src/views/consume/coinConsume.vue
index 4b8ac1f..176d49f 100644
--- a/src/views/consume/coinConsume.vue
+++ b/src/views/consume/coinConsume.vue
@@ -22,8 +22,10 @@
 </template>
 
 <script setup>
-import { ref, watch } from 'vue';
-import { useRouter, useRoute } from 'vue-router';
+import {onMounted, ref, watch} from 'vue';
+import {useRouter, useRoute} from 'vue-router';
+import {storeToRefs} from "pinia";
+import {useAdminStore} from "@/store/index.js";
 
 const router = useRouter();// 获取路由实例
 const route = useRoute();// 获取当前路由信息
@@ -31,31 +33,69 @@ const route = useRoute();// 获取当前路由信息
 const activeTab = ref(route.name === 'coinConsumeDetail' ? 'detail' : 'add');
 //也就是说如果当前在coinConsumeDetail页面，那么就是detail，否则默认情况都展示add页面
 //此时获取到的路由信息是coinConsume，所以默认是add
-
+const adminStore = useAdminStore();
+const {menuTree} = storeToRefs(adminStore);
 
 const goToAdd = () => {
   // 点击按钮时更新 activeTab 为 add
   activeTab.value = 'add';
-  router.push({ name: 'addCoinConsume' });
+  router.push({name: 'addCoinConsume'});
 };
 
 const goToDetail = () => {
   // 点击按钮时更新 activeTab 为 detail
   activeTab.value = 'detail';
-  router.push({ name: 'coinConsumeDetail' });
+  router.push({name: 'coinConsumeDetail'});
+};
+
+// 导航方法
+const navigateTo = (name) => {
+  activeTab.value = name;
+  if (name === 'add') {
+    router.push({name: 'addCoinConsume'});
+  } else if (name === 'detail') {
+    router.push({name: 'coinConsumeDetail'});
+  }
+};
+
+// 递归判断某个 menuName 是否存在
+const hasMenuPermission = (tree, targetName) => {
+  for (const node of tree) {
+    if (node.menuName === targetName) return true;
+    if (node.children && hasMenuPermission(node.children, targetName)) return true;
+  }
+  return false;
 };
 
-// 监听路由变化，更新 activeTab
+// 默认路由判断
+const getDefaultRoute = () => {
+  if (!menuTree.value) return 'add';
+  const hasRecharge = hasMenuPermission(menuTree.value, '提交金币消耗');
+  return hasRecharge ? 'add' : 'detail';
+};
+
+
+// 监听路由变化更新标签状态
 watch(() => route.name, (newName) => {
-  if (newName === 'addCoinConsume') {
-    activeTab.value = 'add';
-  } else if (newName === 'coinConsumeDetail') {
-    activeTab.value = 'detail';
+  if (newName === 'add' || newName === 'detail') {
+    activeTab.value = newName;
+  } else if (newName === 'coinConsume') {
+    const defaultRoute = getDefaultRoute();
+    navigateTo(defaultRoute);
+  }
+});
+
+// 初始化逻辑
+onMounted(() => {
+  if (route.name === 'coinConsume') {
+    const defaultRoute = getDefaultRoute();
+    navigateTo(defaultRoute);
+  } else {
+    // 非父路由初始化当前标签状态
+    if (route.name === 'add' || route.name === 'detail') {
+      activeTab.value = route.name;
+    }
   }
 });
 
-// 当进入父路由时，默认跳转到新增消耗页面
-// if (route.name === 'coinConsume') {
-//   router.push({ name: 'addCoinConsume' });
-// }
 </script>
diff --git a/src/views/recharge/coinRecharge.vue b/src/views/recharge/coinRecharge.vue
index 4b8ac1f..48b4b18 100644
--- a/src/views/recharge/coinRecharge.vue
+++ b/src/views/recharge/coinRecharge.vue
@@ -7,13 +7,13 @@
           :type="activeTab === 'add' ? 'primary' : 'default'"
           @click="goToAdd"
       >
-        新增消耗
+        新增充值
       </el-button>
       <el-button
           :type="activeTab === 'detail' ? 'primary' : 'default'"
           @click="goToDetail"
       >
-        金币消耗明细
+        金币充值明细
       </el-button>
     </el-button-group>
     <!-- 渲染子路由组件 -->
@@ -22,40 +22,80 @@
 </template>
 
 <script setup>
-import { ref, watch } from 'vue';
-import { useRouter, useRoute } from 'vue-router';
+import {onMounted, ref, watch} from 'vue';
+import {useRouter, useRoute} from 'vue-router';
+import {storeToRefs} from "pinia";
+import {useAdminStore} from "@/store/index.js";
 
 const router = useRouter();// 获取路由实例
 const route = useRoute();// 获取当前路由信息
 // 定义响应式变量 activeTab 来跟踪当前激活的标签
-const activeTab = ref(route.name === 'coinConsumeDetail' ? 'detail' : 'add');
+const activeTab = ref(route.name === 'coinRechargeDetail' ? 'detail' : 'add');
 //也就是说如果当前在coinConsumeDetail页面，那么就是detail，否则默认情况都展示add页面
 //此时获取到的路由信息是coinConsume，所以默认是add
-
+const adminStore = useAdminStore();
+const {menuTree} = storeToRefs(adminStore);
 
 const goToAdd = () => {
   // 点击按钮时更新 activeTab 为 add
   activeTab.value = 'add';
-  router.push({ name: 'addCoinConsume' });
+  router.push({name: 'addCoinRecharge'});
 };
 
 const goToDetail = () => {
   // 点击按钮时更新 activeTab 为 detail
   activeTab.value = 'detail';
-  router.push({ name: 'coinConsumeDetail' });
+  router.push({name: 'coinRechargeDetail'});
+};
+
+// 导航方法
+const navigateTo = (name) => {
+  activeTab.value = name;
+  if (name === 'add') {
+    router.push({name: 'addCoinRecharge'});
+  } else if (name === 'detail') {
+    router.push({name: 'coinRechargeDetail'});
+  }
+};
+
+// 递归判断某个 menuName 是否存在
+const hasMenuPermission = (tree, targetName) => {
+  for (const node of tree) {
+    if (node.menuName === targetName) return true;
+    if (node.children && hasMenuPermission(node.children, targetName)) return true;
+  }
+  return false;
 };
 
-// 监听路由变化，更新 activeTab
+// 默认路由判断
+const getDefaultRoute = () => {
+  if (!menuTree.value) return 'add';
+  const hasRecharge = hasMenuPermission(menuTree.value, '提交金币充值');
+  return hasRecharge ? 'add' : 'detail';
+};
+
+
+// 监听路由变化更新标签状态
 watch(() => route.name, (newName) => {
-  if (newName === 'addCoinConsume') {
-    activeTab.value = 'add';
-  } else if (newName === 'coinConsumeDetail') {
-    activeTab.value = 'detail';
+  if (newName === 'add' || newName === 'detail') {
+    activeTab.value = newName;
+  } else if (newName === 'coinRecharge') {
+    const defaultRoute = getDefaultRoute();
+    navigateTo(defaultRoute);
+  }
+});
+
+// 初始化逻辑
+onMounted(() => {
+  if (route.name === 'coinRecharge') {
+    const defaultRoute = getDefaultRoute();
+    navigateTo(defaultRoute);
+  } else {
+    // 非父路由初始化当前标签状态
+    if (route.name === 'add' || route.name === 'detail') {
+      activeTab.value = route.name;
+    }
   }
 });
 
-// 当进入父路由时，默认跳转到新增消耗页面
-// if (route.name === 'coinConsume') {
-//   router.push({ name: 'addCoinConsume' });
-// }
 </script>
diff --git a/src/views/refund/coinRefund.vue b/src/views/refund/coinRefund.vue
index d15988e..184ae62 100644
--- a/src/views/refund/coinRefund.vue
+++ b/src/views/refund/coinRefund.vue
@@ -22,15 +22,18 @@
 </template>
 
 <script setup>
-import { ref, watch } from 'vue';
+import {onMounted, ref, watch} from 'vue';
 import { useRouter, useRoute } from 'vue-router';
+import {useAdminStore} from "@/store/index.js";
+import {storeToRefs} from "pinia";
+
+const adminStore = useAdminStore();
+const {menuTree} = storeToRefs(adminStore);
 
 const router = useRouter();// 获取路由实例
 const route = useRoute();// 获取当前路由信息
 // 定义响应式变量 activeTab 来跟踪当前激活的标签
 const activeTab = ref(route.name === 'coinRefundDetail' ? 'detail' : 'add');
-//也就是说如果当前在coinRefundDetail页面，那么就是detail，否则默认情况都展示add页面
-//此时获取到的路由信息是coinRefund，所以默认是add
 
 
 const goToAdd = () => {
@@ -45,17 +48,54 @@ const goToDetail = () => {
   router.push({ name: 'coinRefundDetail' });
 };
 
-// 监听路由变化，更新 activeTab
+// 导航方法
+const navigateTo = (name) => {
+  activeTab.value = name;
+  if (name === 'add') {
+    router.push({name: 'addCoinRefund'});
+  } else if (name === 'detail') {
+    router.push({name: 'coinRefundDetail'});
+  }
+};
+
+
+// 递归判断某个 menuName 是否存在
+const hasMenuPermission = (tree, targetName) => {
+  for (const node of tree) {
+    if (node.menuName === targetName) return true;
+    if (node.children && hasMenuPermission(node.children, targetName)) return true;
+  }
+  return false;
+};
+
+// 默认路由判断
+const getDefaultRoute = () => {
+  if (!menuTree.value) return 'add';
+  const hasRecharge = hasMenuPermission(menuTree.value, '提交金币退款');
+  return hasRecharge ? 'add' : 'detail';
+};
+
+
+// 监听路由变化更新标签状态
 watch(() => route.name, (newName) => {
-  if (newName === 'addCoinRefund') {
-    activeTab.value = 'add';
-  } else if (newName === 'coinRefundDetail') {
-    activeTab.value = 'detail';
+  if (newName === 'add' || newName === 'detail') {
+    activeTab.value = newName;
+  } else if (newName === 'coinRefund') {
+    const defaultRoute = getDefaultRoute();
+    navigateTo(defaultRoute);
   }
 });
 
-// 当进入父路由时，默认跳转到新增消耗页面
-// if (route.name === 'coinRefund') {
-//   router.push({ name: 'addCoinRefund' });
-// }
+// 初始化逻辑
+onMounted(() => {
+  if (route.name === 'coinRefund') {
+    const defaultRoute = getDefaultRoute();
+    navigateTo(defaultRoute);
+  } else {
+    // 非父路由初始化当前标签状态
+    if (route.name === 'add' || route.name === 'detail') {
+      activeTab.value = route.name;
+    }
+  }
+});
 </script>
diff --git a/src/views/usergold/clientCount.vue b/src/views/usergold/clientCount.vue
index b5c5ac5..f07220a 100644
--- a/src/views/usergold/clientCount.vue
+++ b/src/views/usergold/clientCount.vue
@@ -5,57 +5,97 @@
       <!-- 切换后状态显示 primary 样式否则是默认样式 -->
       <el-button
           :type="activeTab === 'detail' ? 'primary' : 'default'"
-          @click="goToDetail"
+          @click="goToAdd"
       >
         金币明细
       </el-button>
       <el-button
           :type="activeTab === 'balance' ? 'primary' : 'default'"
-          @click="goToBalance"
+          @click="goToDetail"
       >
         金币余额
       </el-button>
     </el-button-group>
-
     <!-- 渲染子路由组件 -->
     <router-view></router-view>
   </div>
 </template>
 
 <script setup>
-import { ref, watch } from 'vue';
+import {onMounted, ref, watch} from 'vue';
 import { useRouter, useRoute } from 'vue-router';
+import {useAdminStore} from "@/store/index.js";
+import {storeToRefs} from "pinia";
+
+const adminStore = useAdminStore();
+const {menuTree} = storeToRefs(adminStore);
 
 const router = useRouter();// 获取路由实例
 const route = useRoute();// 获取当前路由信息
 // 定义响应式变量 activeTab 来跟踪当前激活的标签
 const activeTab = ref(route.name === 'clientCountBalance' ? 'balance' : 'detail');
-//也就是说如果当前在clientCountBalance页面，那么就是balance，否则默认情况都展示detail页面
-//此时获取到的路由信息是clientCountDetail，所以默认是detail
 
 
-const goToDetail = () => {
-  // 点击按钮时更新 activeTab 为 detail
+const goToAdd = () => {
+  // 点击按钮时更新 activeTab 为 add
   activeTab.value = 'detail';
   router.push({ name: 'clientCountDetail' });
 };
 
-const goToBalance = () => {
-  // 点击按钮时更新 activeTab 为balance
+const goToDetail = () => {
+  // 点击按钮时更新 activeTab 为 detail
   activeTab.value = 'balance';
   router.push({ name: 'clientCountBalance' });
 };
 
-// 监听路由变化，更新 activeTab
+// 导航方法
+const navigateTo = (name) => {
+  activeTab.value = name;
+  if (name === 'detail') {
+    router.push({name: 'clientCountDetail'});
+  } else if (name === 'balance') {
+    router.push({name: 'clientCountBalance'});
+  }
+};
+
+
+// 递归判断某个 menuName 是否存在
+const hasMenuPermission = (tree, targetName) => {
+  for (const node of tree) {
+    if (node.menuName === targetName) return true;
+    if (node.children && hasMenuPermission(node.children, targetName)) return true;
+  }
+  return false;
+};
+
+// 默认路由判断
+const getDefaultRoute = () => {
+  if (!menuTree.value) return 'detail';
+  const hasRecharge = hasMenuPermission(menuTree.value, '查看金币明细');
+  return hasRecharge ? 'detail' : 'balance';
+};
+
+
+// 监听路由变化更新标签状态
 watch(() => route.name, (newName) => {
-  if (newName === 'clientCountDetail') {
-    activeTab.value = 'detail';
-  } else if (newName === 'clientCountBalance') {
-    activeTab.value = 'balance';
-  }});
-
-// 当进入父路由时，默认跳转到金币明细页面
-// if (route.name === 'usergold') {
-//   router.push({ name: 'clientCountDetail' });
-// }
+  if (newName === 'detail' || newName === 'balance') {
+    activeTab.value = newName;
+  } else if (newName === 'usergold') {
+    const defaultRoute = getDefaultRoute();
+    navigateTo(defaultRoute);
+  }
+});
+
+// 初始化逻辑
+onMounted(() => {
+  if (route.name === 'usergold') {
+    const defaultRoute = getDefaultRoute();
+    navigateTo(defaultRoute);
+  } else {
+    // 非父路由初始化当前标签状态
+    if (route.name === 'detail' || route.name === 'balance') {
+      activeTab.value = route.name;
+    }
+  }
+});
 </script>