Просмотр исходного кода

【登录】登录后默认在患者管理菜单,无权限则默认第一个菜单

张田田 8 месяцев назад
Родитель
Сommit
a1338290f4
1 измененных файлов с 62 добавлено и 28 удалено
  1. 62 28
      src/pages/index.vue

+ 62 - 28
src/pages/index.vue

@@ -1,18 +1,17 @@
 <script setup lang="ts">
-import UserPassword        from '@/components/UserPassword.vue';
-import UserPreview         from '@/components/UserPreview.vue';
-import type { UserModel }  from '@/model/system.model';
-import { accountMethod }   from '@/request/api/account.api';
+import UserPassword from '@/components/UserPassword.vue';
+import UserPreview from '@/components/UserPreview.vue';
+import type { UserModel } from '@/model/system.model';
+import { accountMethod } from '@/request/api/account.api';
 import { useAccountStore } from '@/stores';
-import { LogoutOutlined }  from '@ant-design/icons-vue';
-import { useElementSize }  from '@vueuse/core';
-import { useRequest }      from 'alova/client';
-import { notification }    from 'ant-design-vue';
+import { LogoutOutlined } from '@ant-design/icons-vue';
+import { useElementSize } from '@vueuse/core';
+import { useRequest } from 'alova/client';
+import { notification } from 'ant-design-vue';
 
-import { storeToRefs }      from 'pinia';
+import { storeToRefs } from 'pinia';
 import { VxeButton, VxeUI } from 'vxe-pc-ui';
 
-
 const title = import.meta.env.SIX_TITLE;
 const Account = useAccountStore();
 const { local, menus, token } = storeToRefs(Account);
@@ -21,15 +20,52 @@ const titleRef = ref();
 const { width } = useElementSize(titleRef, void 0, { box: 'border-box' });
 
 const router = useRouter();
+// 记录用户是否点了菜单
+const hasUserNavigated = ref(false);
+
+// 监听路由变化,标记用户已经点了菜单
+watch(
+  () => router.currentRoute.value.path,
+  (newPath, oldPath) => {
+    if (oldPath && oldPath !== '/' && newPath !== oldPath) {
+      hasUserNavigated.value = true;
+    }
+  }
+);
+
 const selectedKeys = computed(() => {
-  return [ router.currentRoute.value.path ];
+  // 获取当前路由路径
+  const currentPath = router.currentRoute.value.path;
+
+  // 检查是否有患者管理权限(菜单中有 /patient/history 就说明有权限)
+  const hasPatientPermission = menus.value?.some((menu) => menu.key === '/patient/history' || menu.label === '患者管理' || menu.title === '患者管理') ?? false;
+
+  // 当前在患者管理页面,直接高亮当前路由
+  if (hasUserNavigated.value || currentPath.startsWith('/patient')) {
+    return [currentPath];
+  }
+
+  //有患者管理权限,默认高亮患者管理菜单
+  if (hasPatientPermission) {
+    const patientMenu = menus.value?.find((menu) => menu.key === '/patient/history');
+    if (patientMenu) {
+      return [patientMenu.key];
+    }
+  }
+
+  // 如果没有患者管理权限,高亮第一个菜单
+  if (menus.value && menus.value.length > 0) {
+    return [menus.value[0].key];
+  }
+
+  // 默认返回当前路由
+  return [currentPath];
 });
 
 const selectMenuItem = ({ item, key, keyPath }) => {
   router.push({ path: key }).then();
 };
 
-
 function handleLogout() {
   Account.$reset();
   router.replace({ path: '/login' });
@@ -37,28 +73,29 @@ function handleLogout() {
 
 const current = ref<string[]>([]);
 
-
 const { loading: userLoading, send: loadUser } = useRequest(
   () => accountMethod(token.value!),
 
-  { immediate: false },
+  { immediate: false }
 );
 
 async function openUserPreview() {
-  if ( userLoading.value ) return;
+  if (userLoading.value) return;
   const { user: model } = await loadUser();
-  if ( !model ) return;
+  if (!model) return;
   VxeUI.drawer.open({
     title: `用户信息`,
     maskClosable: true,
     escClosable: true,
     slots: {
       default() {
-        return h(UserPreview, <any> { data: model, request: false });
+        return h(UserPreview, <any>{ data: model, request: false });
       },
       corner() {
         return h(VxeButton, {
-          content: '修改登录密码', size: 'mini', onClick() {
+          content: '修改登录密码',
+          size: 'mini',
+          onClick() {
             updateUserPassword(model);
           },
         });
@@ -70,7 +107,7 @@ async function openUserPreview() {
 function updateUserPassword(model: UserModel, index?: number) {
   const { userName } = model;
   VxeUI.modal.open({
-    title: `重置 ${ userName } 登录密码`,
+    title: `重置 ${userName} 登录密码`,
     escClosable: true,
     destroyOnClose: true,
     id: `user-edit-password-modal`,
@@ -79,11 +116,12 @@ function updateUserPassword(model: UserModel, index?: number) {
     mask: false,
     slots: {
       default() {
-        return h(UserPassword, <any> {
+        return h(UserPassword, <any>{
           update: true,
-          data: model, onSubmit(data?: UserModel) {
+          data: model,
+          onSubmit(data?: UserModel) {
             notification.success({
-              message: `重置用户: ${ userName } 的登录密码`,
+              message: `重置用户: ${userName} 的登录密码`,
               description: '操作成功',
             });
             VxeUI.modal.close(`user-edit-password-modal`);
@@ -101,10 +139,7 @@ function updateUserPassword(model: UserModel, index?: number) {
     <header class="flex-none flex items-center h-60px">
       <div ref="titleRef" class="title flex-none">{{ title }}</div>
       <div class="app-header-menus-wrapper flex-auto">
-        <a-menu
-          mode="horizontal" :items="menus"
-          :selectedKeys="selectedKeys" @click="selectMenuItem"
-        />
+        <a-menu mode="horizontal" :items="menus" :selectedKeys="selectedKeys" @click="selectMenuItem" />
       </div>
       <div class="account">
         <a-avatar size="large" :src="local?.avatar">{{ local?.name?.slice(0, 1) }}</a-avatar>
@@ -113,7 +148,7 @@ function updateUserPassword(model: UserModel, index?: number) {
       </div>
     </header>
     <main class="flex-auto flex flex-row">
-      <RouterView name="aside" class="flex-none" :style="{width: `${width}px`}" />
+      <RouterView name="aside" class="flex-none" :style="{ width: `${width}px` }" />
       <RouterView class="flex-auto" />
     </main>
   </div>
@@ -176,7 +211,6 @@ function updateUserPassword(model: UserModel, index?: number) {
       color: #fff;
     }
 
-
     .ant-menu-item:hover:not(.ant-menu-item-selected):not(.ant-menu-submenu-selected),
     .ant-menu-submenu-title:hover:not(.ant-menu-item-selected):not(.ant-menu-submenu-selected) {
       color: rgba(255, 255, 255, 0.75);