|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
<div class="tags-container">
|
|
|
- <el-scrollbar class="scroll-container" :vertical="false" @wheel.prevent="handleScroll">
|
|
|
+ <el-scrollbar class="scroll-container" :vertical="false">
|
|
|
<router-link
|
|
|
ref="tagRef"
|
|
|
v-for="tag in visitedViews"
|
|
@@ -8,7 +8,6 @@
|
|
|
:class="'tags-item ' + (isActive(tag) ? 'active' : '')"
|
|
|
:to="{ path: tag.path, query: tag.query }"
|
|
|
@click.middle="!isAffix(tag) ? closeSelectedTag(tag) : ''"
|
|
|
- @contextmenu.prevent="openContentMenu(tag, $event)"
|
|
|
>
|
|
|
{{ translateRouteTitle(tag.title) }}
|
|
|
<SvgIcon class="close-icon" icon-class="close" v-if="!isAffix(tag)" @click.prevent.stop="closeSelectedTag(tag)"></SvgIcon>
|
|
@@ -87,15 +86,6 @@ watch(
|
|
|
}
|
|
|
)
|
|
|
|
|
|
-const contentMenuVisible = ref(false) // 右键菜单是否显示
|
|
|
-watch(contentMenuVisible, (value) => {
|
|
|
- if (value) {
|
|
|
- document.body.addEventListener('click', closeContentMenu)
|
|
|
- } else {
|
|
|
- document.body.removeEventListener('click', closeContentMenu)
|
|
|
- }
|
|
|
-})
|
|
|
-
|
|
|
/**
|
|
|
* 过滤出需要固定的标签
|
|
|
*/
|
|
@@ -204,7 +194,7 @@ function toLastView(visitedViews, view) {
|
|
|
if (latestView && latestView.fullPath) {
|
|
|
router.push(latestView.fullPath)
|
|
|
} else {
|
|
|
- if (view?.name === 'Dashboard') {
|
|
|
+ if (view?.name === 'home') {
|
|
|
router.replace({ path: '/redirect' + view.fullPath })
|
|
|
} else {
|
|
|
router.push('/')
|
|
@@ -248,94 +238,6 @@ function closeAllTags(view) {
|
|
|
})
|
|
|
}
|
|
|
|
|
|
-/**
|
|
|
- * 打开右键菜单
|
|
|
- */
|
|
|
-function openContentMenu(tag, e) {
|
|
|
- const menuMinWidth = 105
|
|
|
- const offsetLeft = proxy?.$el.getBoundingClientRect().left // container margin left
|
|
|
- const offsetWidth = proxy?.$el.offsetWidth // container width
|
|
|
- const maxLeft = offsetWidth - menuMinWidth // left boundary
|
|
|
- const l = e.clientX - offsetLeft + 15 // 15: margin right
|
|
|
-
|
|
|
- if (l > maxLeft) {
|
|
|
- left.value = maxLeft
|
|
|
- } else {
|
|
|
- left.value = l
|
|
|
- }
|
|
|
-
|
|
|
- // 混合模式下,需要减去顶部菜单(fixed)的高度
|
|
|
- if (layout.value === 'mix') {
|
|
|
- top.value = e.clientY - 50
|
|
|
- } else {
|
|
|
- top.value = e.clientY
|
|
|
- }
|
|
|
-
|
|
|
- contentMenuVisible.value = true
|
|
|
- selectedTag.value = tag
|
|
|
-}
|
|
|
-
|
|
|
-/**
|
|
|
- * 关闭右键菜单
|
|
|
- */
|
|
|
-function closeContentMenu() {
|
|
|
- contentMenuVisible.value = false
|
|
|
-}
|
|
|
-
|
|
|
-/**
|
|
|
- * 滚动事件
|
|
|
- */
|
|
|
-function handleScroll() {
|
|
|
- closeContentMenu()
|
|
|
-}
|
|
|
-
|
|
|
-function findOutermostParent(tree, findName) {
|
|
|
- let parentMap = {}
|
|
|
-
|
|
|
- function buildParentMap(node, parent) {
|
|
|
- parentMap[node.name] = parent
|
|
|
-
|
|
|
- if (node.children) {
|
|
|
- for (let i = 0; i < node.children.length; i++) {
|
|
|
- buildParentMap(node.children[i], node)
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- for (let i = 0; i < tree.length; i++) {
|
|
|
- buildParentMap(tree[i], null)
|
|
|
- }
|
|
|
-
|
|
|
- let currentNode = parentMap[findName]
|
|
|
- while (currentNode) {
|
|
|
- if (!parentMap[currentNode.name]) {
|
|
|
- return currentNode
|
|
|
- }
|
|
|
- currentNode = parentMap[currentNode.name]
|
|
|
- }
|
|
|
-
|
|
|
- return null
|
|
|
-}
|
|
|
-
|
|
|
-const againActiveTop = (newVal) => {
|
|
|
- if (layout.value !== 'mix') return
|
|
|
- const parent = findOutermostParent(permissionStore.routes, newVal)
|
|
|
- if (appStore.activeTopMenu !== parent.path) {
|
|
|
- appStore.activeTopMenu(parent.path)
|
|
|
- }
|
|
|
-}
|
|
|
-// 如果是混合模式,更改selectedTag,需要对应高亮的activeTop
|
|
|
-watch(
|
|
|
- () => route.name,
|
|
|
- (newVal) => {
|
|
|
- if (newVal) {
|
|
|
- againActiveTop(newVal)
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- deep: true
|
|
|
- }
|
|
|
-)
|
|
|
onMounted(() => {
|
|
|
initTags()
|
|
|
})
|