cynthia-qin 1 月之前
父節點
當前提交
fdf6b77ff7
共有 1 個文件被更改,包括 36 次插入4 次删除
  1. 36 4
      src/components/LayoutHeader.vue

+ 36 - 4
src/components/LayoutHeader.vue

@@ -5,8 +5,9 @@
       <span class="knowledge-graph-icon" @click="router.push({ path: '/home' })"></span>
     </div> -->
     <div class="menu">
-      <el-menu :default-active="currentPath" class="el-menu-demo" mode="horizontal" router>
-        <el-menu-item :index="item.path" v-for="item in routeList" :key="item.name">{{ item.title }}</el-menu-item>
+      <el-menu :default-active="currentPath" ref="menuRef" class="el-menu-demo" mode="horizontal">
+        <el-menu-item :index="item.path" v-for="item in routeList" :key="item.name"
+          @click="handleMenuClick(item.path)">{{ item.title }}</el-menu-item>
       </el-menu>
     </div>
     <div style="align-self: center;">
@@ -26,14 +27,16 @@
 </template>
 
 <script setup>
-import { ref } from 'vue'
-import { computed } from "vue";
+import { ref, computed, onMounted, onBeforeUnmount } from 'vue'
 import { useMenuStore } from "@/stores/menu.js"
 import { useRoute, useRouter } from "vue-router";
 import { getSessionVar, clearSessionVar } from '@/utils/session'
 import EditPasswordDialog from "@/components/EditPasswordDialog.vue"
 const route = useRoute()
 const router = useRouter()
+let timer
+
+const menuRef = ref()
 // console.log('route', route)
 const { routeList } = useMenuStore()
 const user = ref({
@@ -66,6 +69,35 @@ const handleLogout = () => {
   clearSessionVar()
 }
 
+
+function handleMenuClick(path) {
+  if (/^https?/g.test(path)) {
+    // path = 'http://localhost:8081/home.html'
+    const newWindow = window.open(path, '_blank');
+    timer = setInterval(() => {
+      newWindow?.postMessage({ type: 'login', username: getSessionVar("full_name"), userID: getSessionVar("user_id") }, "*")
+    }, 1000)
+    menuRef.value.updateActiveIndex(currentPath.value)
+  } else {
+    router.push({ path: path })
+  }
+}
+function handleLogin(event) {
+  const { type, status } = event.data
+  if (type === 'login' && status === 'ok') {
+    // alert('登录成功')
+    clearInterval(timer)
+  }
+}
+onMounted(() => {
+  window.addEventListener('message', handleLogin);
+})
+
+onBeforeUnmount(() => {
+  window.removeEventListener('message', handleLogin);
+  clearInterval(timer)
+})
+
 // console.log(menu.menu)
 </script>