| | |
| | | <template>
|
| | | <div id="tags-view-container" class="tags-view-container">
|
| | | <scroll-pane ref="scrollPane" class="tags-view-wrapper">
|
| | | <scroll-pane ref="scrollPane" class="tags-view-wrapper" @scroll="handleScroll">
|
| | | <router-link
|
| | | v-for="tag in visitedViews"
|
| | | ref="tag"
|
| | |
| | | :to="{ path: tag.path, query: tag.query, fullPath: tag.fullPath }"
|
| | | tag="span"
|
| | | class="tags-view-item"
|
| | | :style="activeStyle(tag)"
|
| | | @click.middle.native="!isAffix(tag)?closeSelectedTag(tag):''"
|
| | | @contextmenu.prevent.native="openMenu(tag,$event)"
|
| | | >
|
| | |
| | | },
|
| | | routes() {
|
| | | return this.$store.state.permission.routes
|
| | | },
|
| | | theme() {
|
| | | return this.$store.state.settings.theme;
|
| | | }
|
| | | },
|
| | | watch: {
|
| | |
| | | methods: {
|
| | | isActive(route) {
|
| | | return route.path === this.$route.path
|
| | | },
|
| | | activeStyle(tag) {
|
| | | if (!this.isActive(tag)) return {};
|
| | | return {
|
| | | "background-color": this.theme,
|
| | | "border-color": this.theme
|
| | | };
|
| | | },
|
| | | isAffix(tag) {
|
| | | return tag.meta && tag.meta.affix
|
| | |
| | | },
|
| | | closeAllTags(view) {
|
| | | this.$store.dispatch('tagsView/delAllViews').then(({ visitedViews }) => {
|
| | | if (this.affixTags.some(tag => tag.path === view.path)) {
|
| | | if (this.affixTags.some(tag => tag.path === this.$route.path)) {
|
| | | return
|
| | | }
|
| | | this.toLastView(visitedViews, view)
|
| | |
| | | },
|
| | | closeMenu() {
|
| | | this.visible = false
|
| | | },
|
| | | handleScroll() {
|
| | | this.closeMenu()
|
| | | }
|
| | | }
|
| | | }
|