菜单动态展示

src/components/SliderVerify/index.vue

@@ -71,6 +71,7 @@ import {
   toRefs,
 } from 'vue'
 import {Popup, Loading, Toast} from 'vant'
+import {getAssetsFile} from "@/utils/other";
 
 const l = 42 // 滑块边长
 const r = 9 // 滑块圆半径
@@ -320,14 +321,13 @@ export default defineComponent({
             img.crossOrigin = 'Anonymous'
             img.src = props.imgUrl
                     ? props.imgUrl
-          : `/medical/src/assets/imgs/SliderVerify/SliderVerify-${bgRandom}.jpg`
+                    : getAssetsFile(`imgs/SliderVerify/SliderVerify-${bgRandom}.jpg`)
             img.onerror = () => {
                 Toast({
                     message: '图片加载失败',
                     position: 'top',
                 })
-        img.src =
+                img.src = getAssetsFile('imgs/SliderVerify/SliderVerify-error.png')
-            '/medical/src/assets/imgs/SliderVerify/SliderVerify-error.png'
             }
 
       /**

src/router/routes.ts

@@ -21,7 +21,6 @@ export const constantRoute = [
       {
         path: '/permissions-manage',
         name: '权限管理',
-        redirect: '/permissions-manage/doctor-manage',
         component: () => import('@/views/permissions-manage/index.vue'),
         children: [
           {
@@ -44,7 +43,6 @@ export const constantRoute = [
       {
         path: '/patients-manage',
         name: '患者管理',
-        redirect: '/patients-manage/patients-manage',
         component: () => import('@/views/patients-manage/index.vue'),
         children: [
           {
@@ -62,7 +60,6 @@ export const constantRoute = [
       {
         path: '/remote-manage',
         name: '远程管理',
-        redirect: '/remote-manage/remote-manage',
         component: () => import('@/views/remote-manage/index.vue'),
         children: [
           {
@@ -113,7 +110,6 @@ export const constantRoute = [
       {
         path: '/logs-manage',
         name: '系统管理',
-        redirect: '/logs-manage/message-manage',
         component: () => import('@/views/logs-manage/index.vue'),
         children: [
           {

src/stores/user-info-store.ts

@@ -1,6 +1,6 @@
 import {defineStore} from 'pinia'
 import {getUserMenu} from "@/api/menu";
-import {Session} from "@/utils/storage";
+import {Local, Session} from "@/utils/storage";
 import router from "@/router";
 
 export const useUserStore = defineStore('login', {
@@ -29,7 +29,7 @@ export const useUserStore = defineStore('login', {
     actions: {
         getlogin() {
             const onlineUser = Session.get("onlineUser");
-      return this.userInfo.account ? this.userInfo : onlineUser
+            return this.userInfo.account && this.userInfo.account != null ? this.userInfo : onlineUser
         },
         setlogin(key: string, e: any) {
             this.userInfo[key] = e
@@ -37,6 +37,7 @@ export const useUserStore = defineStore('login', {
         },
         logout() {
             Session.clear();
+            Local.clear();
             router.removeRoute("root");
             router.addRoute({
                 name: "root",
@@ -62,8 +63,19 @@ export const useUserStore = defineStore('login', {
                     resolve(this.userInfo.menuPathList)
                 }
             })
-    }
         },
+        getMenuChild(path: string) {
+            return new Promise(resolve => {
+                this.getMenuPathList().then((res: any) => {
+                    res.menus.forEach((menu: any) => {
+                        if (menu.path == path) {
+                            resolve(menu.children)
+                        }
+                    });
+                })
+            })
+        }
+    }
 })
 
 function handleMenuPath(menu: any, paths: any, menus?: any) {

src/utils/other.ts

@@ -69,3 +69,9 @@ function componentToHex(c: number) {
 	const hex = c.toString(16);
 	return hex.length == 1 ? "0" + hex : hex;
 }
+
+
+// 获取assets静态资源
+export const getAssetsFile = (url: string) => {
+	return new URL(`../assets/${url}`, import.meta.url).href
+}

src/views/login/login.vue

@@ -2,11 +2,11 @@
   <div class="login-page">
     <div class="left-content move_4"></div>
     <div class="right-content">
-      <div class="select-hospital-box">
+<!--      <div class="select-hospital-box">
         <el-select class="select-hospital" v-model="currentHospital" size="small" @change="selectHospital">
           <el-option v-for="item in hospitals" :key="item.id" :label="item.name" :value="item.id"/>
         </el-select>
-      </div>
+      </div>-->
 
       <img v-show="!isShowRegister" class="logo move_2" src="@/assets/imgs/logo.png">
       <div v-if="!isShowRegister" class="login-block move_2">
@@ -211,9 +211,9 @@ const currentHospital = ref("")
 const isShowRegister = ref(false)
 const passwordLogin = ref(true)
 const loginParams = ref({
-  account: 'admin',
+  account: '',
   name: '',
-  password: '123456',
+  password: '',
   phone: '',
   phoneArea: phoneAreas[0],
   code: '',

src/views/logs-manage/index.vue

@@ -17,21 +17,27 @@
 </template>
 
 <script lang='ts' setup>
-import {onMounted, reactive, ref, toRefs, watch} from 'vue'
+import {onMounted, ref} from 'vue'
 import type {MenuItem} from '@/utils/public-interface'
 import CommonMenu from '@/components/common-menu.vue'
-import PageTabs from '@/components/page-tabs.vue'
+import {useUserStore} from "@/stores/user-info-store";
+import {useRoute, useRouter} from "vue-router";
 
-const menuData = [
+const router = useRouter()
-  {name: '消息管理', path: '/logs-manage/message-manage'},
+const route = useRoute()
-  {name: '日志管理', path: '/logs-manage/logs-manage'},
+const menuData = ref([])
-  {name: "词典管理", path: '/logs-manage/dict-manage'}
-]
-
-const pageTabsRef = ref()
 const selectMenu = (e: MenuItem) => {
     // pageTabsRef.value.setTab(e)
 }
+
+onMounted(async () => {
+    const paths = route.path.split("/")
+    const e: any = await useUserStore().getMenuChild("/" + paths[1])
+    menuData.value = e
+    if (e && e.length > 0) {
+        router.push(e[0].path)
+    }
+})
 </script>
 
 <style lang='scss' scoped>

src/views/patients-manage/index.vue

@@ -17,17 +17,27 @@
 </template>
 
 <script lang='ts' setup>
-import {ref} from 'vue'
+import {onMounted, ref} from 'vue'
 import type {MenuItem} from '@/utils/public-interface'
 import CommonMenu from '@/components/common-menu.vue'
 import PageTabs from '@/components/page-tabs.vue'
+import {useRoute, useRouter} from "vue-router";
+import {useUserStore} from "@/stores/user-info-store";
 
-const menuData = [
+const menuData = ref([])
-    { name: '患者管理', path: '/patients-manage/patients-manage' },
-    { name: '手术信息', path: '/patients-manage/surgery-info' }
-]
-
 const pageTabsRef = ref()
+const router = useRouter()
+const route = useRoute()
+
+onMounted(async () => {
+    const paths = route.path.split("/")
+    const e: any = await useUserStore().getMenuChild("/" + paths[1])
+    menuData.value = e
+    if (e && e.length > 0) {
+        router.push(e[0].path)
+    }
+})
+
 const selectMenu = (e: MenuItem) => {
     pageTabsRef.value.setTab(e)
 }

src/views/permissions-manage/index.vue

@@ -17,21 +17,31 @@
 </template>
 
 <script lang='ts' setup>
-import {ref} from 'vue'
+import {onMounted, ref} from 'vue'
 import type {MenuItem} from '@/utils/public-interface'
 import CommonMenu from '@/components/common-menu.vue'
 import PageTabs from '@/components/page-tabs.vue'
+import {useRoute, useRouter} from "vue-router";
+import {useUserStore} from "@/stores/user-info-store";
 
-const menuData = [
+const router = useRouter()
-    { name: '医生管理', path: '/permissions-manage/doctor-manage' },
+const route = useRoute()
-    { name: '角色管理', path: '/permissions-manage/role-manage' },
+const menuData = ref([])
-    { name: '菜单管理', path: '/permissions-manage/menu-manage' }
-]
 
 const pageTabsRef = ref()
 const selectMenu = (e: MenuItem) => {
     pageTabsRef.value.setTab(e)
 }
+
+onMounted(async () => {
+    const paths = route.path.split("/")
+    const e: any = await useUserStore().getMenuChild("/" + paths[1])
+    menuData.value = e
+    if (e && e.length > 0) {
+        router.push(e[0].path)
+    }
+})
+
 </script>
 
 <style lang='scss' scoped>
@@ -61,6 +71,7 @@ const selectMenu = (e: MenuItem) => {
             width: 100%;
             height: calc(100% - 50px);
             padding: 10px;
+
             .background-block {
                 width: 100%;
                 height: 100%;

src/views/remote-manage/index.vue

@@ -4,6 +4,19 @@
 
 <script lang='ts' setup>
 import { onMounted, reactive, ref, toRefs, watch } from 'vue'
+import {useRoute, useRouter} from "vue-router";
+import {useUserStore} from "@/stores/user-info-store";
+
+const router = useRouter()
+const route = useRoute()
+
+onMounted(async () => {
+    const paths = route.path.split("/")
+    const e: any = await useUserStore().getMenuChild("/" + paths[1])
+    if (e && e.length > 0) {
+        router.push(e[0].path)
+    }
+})
 
 </script>