lisang
/
iview-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

恢复添加标签导航右侧关闭下拉菜单，同时还支持在标签上右键关闭

This commit is contained in:
zhigang.li@tendcloud.com 2018-10-09 14:21:28 +08:00
parent 131d5f861e
commit 30d7d6af74
2 changed files with 15 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/main/components/tags-nav/tags-nav.less
View File

@ -42,14 +42,14 @@
left: 0px; left: 0px;
} }
&.right-btn{ &.right-btn{
right: 0px; right: 32px;
border-right: 1px solid #F0F0F0; border-right: 1px solid #F0F0F0;
} }
} }
.scroll-outer{ .scroll-outer{
position: absolute; position: absolute;
left: 28px; left: 28px;
right: 28px; right: 61px;
top: 0; top: 0;
bottom: 0; bottom: 0;
box-shadow: 0px 0 3px 2px rgba(100,100,100,.1) inset; box-shadow: 0px 0 3px 2px rgba(100,100,100,.1) inset;

15
src/components/main/components/tags-nav/tags-nav.vue
View File

@ -1,5 +1,16 @@
<template> <template>
<div class="tags-nav"> <div class="tags-nav">
<div class="close-con">
<Dropdown transfer @on-click="handleTagsOption" style="margin-top:7px;">
<Button size="small" type="text">
<Icon :size="18" type="ios-close-circle-outline" />
</Button>
<DropdownMenu slot="list">
<DropdownItem name="close-all">关闭所有</DropdownItem>
<DropdownItem name="close-others">关闭其他</DropdownItem>
</DropdownMenu>
</Dropdown>
</div>
<ul v-show="visible" :style="{left: contextMenuLeft + 'px', top: contextMenuTop + 'px'}" class="contextmenu"> <ul v-show="visible" :style="{left: contextMenuLeft + 'px', top: contextMenuTop + 'px'}" class="contextmenu">
<li v-for="(item, key) of menuList" @click="handleTagsOption(key)" :key="key">{{item}}</li> <li v-for="(item, key) of menuList" @click="handleTagsOption(key)" :key="key">{{item}}</li>
</ul> </ul>
@ -95,11 +106,11 @@ export default {
} }
}, },
handleTagsOption (type) { handleTagsOption (type) {
if (type === 'all') { if (type.includes('all')) {
// 关闭所有，除了home // 关闭所有，除了home
let res = this.list.filter(item => item.name === 'home') let res = this.list.filter(item => item.name === 'home')
this.$emit('on-close', res, 'all') this.$emit('on-close', res, 'all')
} else if (type === 'others') { } else if (type.includes('others')) {
// 关闭除当前页和home页的其他页 // 关闭除当前页和home页的其他页
let res = this.list.filter(item => routeEqual(this.currentRouteObj, item) || item.name === 'home') let res = this.list.filter(item => routeEqual(this.currentRouteObj, item) || item.name === 'home')
this.$emit('on-close', res, 'others', this.currentRouteObj) this.$emit('on-close', res, 'others', this.currentRouteObj)