manager/zyplayer-doc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

多tab标签页切换问题修改

Browse Source
This commit is contained in:
暮光：城中城
2021-08-16 20:14:19 +08:00
parent 04b4794f92
commit 27c0d8e50a
6 changed files with 25 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
zyplayer-doc-ui/db-ui/src/components/layouts/PageTableView.vue
View File

@@ -1,7 +1,7 @@
<template>
<div>
<el-tabs v-model="activePage" type="card" closable @tab-click="changePage" @tab-remove="removePageTab" style="padding: 5px 10px 0;">
<el-tab-pane :label="pageTabNameMap[item.fullPath]||item.name" :name="getRouteRealPath(item)" v-for="item in pageList"/>
<el-tab-pane :label="pageTabNameMap[item.fullPath]||item.name" :name="getRouteRealPath(item)" :fullPath="item.fullPath" :key="item.fullPath" v-for="item in pageList"/>
</el-tabs>
<keep-alive>
<router-view :key="$route.fullPath" @initLoadDataList="initLoadDataList" @loadDatasourceList="loadDatasourceList"/>
@@ -28,12 +28,14 @@
pageTabNameMap () {
return this.$store.state.global.pageTabNameMap;
}
},
created() {
this.pageList.push(this.$route);
},
created() {
let {name, path, fullPath} = this.$route;
this.pageList.push({name, path, fullPath});
let activePage = this.getRouteRealPath(this.$route);
this.linkList.push(activePage);
this.activePage = activePage;
this.$router.push(this.$route.fullPath);
},
watch: {
'$route': function (newRoute, oldRoute) {
@@ -41,13 +43,11 @@
this.activePage = activePage;
if (this.linkList.indexOf(activePage) < 0) {
this.linkList.push(activePage);
this.pageList.push(newRoute);
let {name, path, fullPath} = newRoute;
this.pageList.push({name, path, fullPath});
}
},
'activePage': function (key) {
if (!this.isIgnoreParamPath(key)) {
this.$router.push(key);
}
let pageRoute = this.pageList.find(item => this.getRouteRealPath(item) === activePage);
pageRoute.fullPath = newRoute.fullPath;
},
},
methods: {
@@ -63,8 +63,9 @@
getRouteRealPath(route) {
return this.isIgnoreParamPath(route.path) ? route.path : route.fullPath;
},
changePage(key) {
this.activePage = key.name;
changePage(tab) {
this.activePage = tab.name;
this.$router.push(tab.$attrs.fullPath);
},
editPage(key, action) {
this[action](key);
@@ -72,13 +73,16 @@
removePageTab(key) {
if (this.pageList.length === 1) {
this.$message.warning('这是最后一页，不能再关闭了啦');
return
}
this.pageList = this.pageList.filter(item => this.getRouteRealPath(item) !== key);
let index = this.linkList.indexOf(key);
this.linkList = this.linkList.filter(item => item !== key);
index = index >= this.linkList.length ? this.linkList.length - 1 : index;
this.activePage = this.linkList[index];
return;
}
this.pageList = this.pageList.filter(item => this.getRouteRealPath(item) !== key);
this.linkList = this.linkList.filter(item => item !== key);
let index = this.linkList.indexOf(this.activePage);
if (index < 0) {
index = this.linkList.length - 1;
this.activePage = this.linkList[index];
this.$router.push(this.activePage);
}
},
}
}