|
|
|
@ -14,10 +14,21 @@ |
|
|
|
<div class="fatherTags"> |
|
|
|
<ul id="tag-list" ref="tags"> |
|
|
|
<div v-for="(item, index) in tagList" :key="index" @click="clickTag(item)"> |
|
|
|
<li |
|
|
|
@click.right="openMenu($event, index)" |
|
|
|
:id="selectTags.path === item.path ? 'ischoice' : ''"> |
|
|
|
<span>{{ isdisabledl || isdisabledr ? item.title.substring(0, 4) : item.title }}</span> |
|
|
|
<li :id="selectTags.path === item.path ? 'ischoice' : ''"> |
|
|
|
<a-dropdown :trigger="['contextmenu']" @visibleChange="(v) => visibleChange(v, item)"> |
|
|
|
<span> |
|
|
|
{{ isdisabledl || isdisabledr ? item.title.substring(0, 4) : item.title }} |
|
|
|
</span> |
|
|
|
|
|
|
|
<template #overlay> |
|
|
|
<a-menu> |
|
|
|
<a-menu-item key="1"> <li @click="closeAllMenu">关闭所有标签页</li></a-menu-item> |
|
|
|
<a-menu-item key="2"> |
|
|
|
<li @click="closeOhterMenu">关闭其他标签页</li> |
|
|
|
</a-menu-item> |
|
|
|
</a-menu> |
|
|
|
</template> |
|
|
|
</a-dropdown> |
|
|
|
<ns-icon |
|
|
|
v-if="item.path !== baseHeader.redirect" |
|
|
|
name="close" |
|
|
|
@ -33,10 +44,10 @@ |
|
|
|
name="fastBackward" |
|
|
|
class="icon_kt" /> |
|
|
|
</div> |
|
|
|
<ul v-show="visible" :style="{ left: left + 'px', top: top + 'px' }" class="contextmenu"> |
|
|
|
<!-- <ul v-show="visible" :style="{ left: left + 'px', top: top + 'px' }" class="contextmenu"> |
|
|
|
<li @click="closeAllMenu">关闭所有标签页</li> |
|
|
|
<li @click="closeOhterMenu">关闭其他标签页</li> |
|
|
|
</ul> |
|
|
|
</ul> --> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
<script lang="ts"> |
|
|
|
@ -54,11 +65,11 @@ |
|
|
|
const visible = ref<boolean>(false); |
|
|
|
const leftMenuTrigger = ref(false); |
|
|
|
mittEmit.on('leftMenuTrigger', (val) => { |
|
|
|
console.log('leftMenuTrigger', val); |
|
|
|
leftMenuTrigger.value = val; |
|
|
|
}); |
|
|
|
// const tagList = ref<tagsClass[]>([]); |
|
|
|
const rightNumber = ref<number>(0); |
|
|
|
const rightTarget = ref(); |
|
|
|
const tagsStore = useTags(); |
|
|
|
const router = useRouter(); |
|
|
|
const keepAliveStore = useKeepAlive(); |
|
|
|
@ -68,13 +79,15 @@ |
|
|
|
const tagList = computed(() => tagsStore.getTags); |
|
|
|
//右键关闭所有标签页 |
|
|
|
const closeAllMenu = () => { |
|
|
|
tagsStore.sliceTags(0); |
|
|
|
// tagsStore.sliceTags(0); |
|
|
|
tagsStore.clearTags(); |
|
|
|
}; |
|
|
|
//右键关闭其他标签页 |
|
|
|
const closeOhterMenu = () => { |
|
|
|
let choicetag = tagList.value[rightNumber.value]; |
|
|
|
tagsStore.sliceTags(0); |
|
|
|
tagsStore.addTags(choicetag); |
|
|
|
// let choicetag = tagList.value[rightNumber.value]; |
|
|
|
tagsStore.clearTags(); |
|
|
|
tagsStore.addTags(rightTarget.value); |
|
|
|
clickTag(rightTarget.value); |
|
|
|
}; |
|
|
|
const selectTags = inject('selectTags'); |
|
|
|
console.log(selectTags); |
|
|
|
@ -94,7 +107,11 @@ |
|
|
|
}); |
|
|
|
} |
|
|
|
}; |
|
|
|
const visibleChange = (visible, target) => { |
|
|
|
if (visible) rightTarget.value = target; |
|
|
|
}; |
|
|
|
return { |
|
|
|
visibleChange, |
|
|
|
leftMenuTrigger, |
|
|
|
router, |
|
|
|
clickTag, |
|
|
|
@ -287,11 +304,11 @@ |
|
|
|
align-items: center; |
|
|
|
position: fixed; |
|
|
|
top: @layout-header-height; |
|
|
|
z-index: 2; |
|
|
|
z-index: 6; |
|
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.05); |
|
|
|
} |
|
|
|
.nav-shutters-collapsed { |
|
|
|
width: calc(100% - 40px); |
|
|
|
width: calc(100% - @layout-sider-collapsed-width); |
|
|
|
// padding: 0 12px; |
|
|
|
min-height: @ns-nav-shutters-height; |
|
|
|
height: @ns-nav-shutters-height; |
|
|
|
@ -301,6 +318,7 @@ |
|
|
|
position: fixed; |
|
|
|
top: @layout-header-height; |
|
|
|
z-index: 10; |
|
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.05); |
|
|
|
} |
|
|
|
.nav-shutters-container { |
|
|
|
display: flex; |
|
|
|
|
xuziqiang
5 months ago