fix: [多标签Tab页] 关闭左侧,关闭其他可能导致主页标签被删除 (#148)

* fix: 主页和路由页独立

主页和路由页独立

fix #147

* refactor: 撤回不属于本次提交的更改

撤回不属于本次提交的更改
This commit is contained in:
Kerwin Bryant 2022-05-07 12:50:17 +08:00 committed by GitHub
parent 15804b711c
commit 24451f7720
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 11 additions and 9 deletions

View File

@ -50,5 +50,6 @@ export interface TRouterInfo {
export interface TTabRouterType { export interface TTabRouterType {
isRefreshing: boolean; isRefreshing: boolean;
homeRouter: TRouterInfo;
tabRouterList: Array<TRouterInfo>; tabRouterList: Array<TRouterInfo>;
} }

View File

@ -196,7 +196,7 @@ export default defineComponent({
<t-icon name="refresh" /> <t-icon name="refresh" />
</t-dropdown-item> </t-dropdown-item>
{idx > 0 && ( {idx > 1 && (
<t-dropdown-item onClick={() => handleCloseAhead(router.path, idx)}> <t-dropdown-item onClick={() => handleCloseAhead(router.path, idx)}>
<t-icon name="arrow-left" /> <t-icon name="arrow-left" />

View File

@ -3,38 +3,39 @@ import { TRouterInfo, TTabRouterType } from '@/interface';
import { store } from '@/store'; import { store } from '@/store';
const state = { const state = {
tabRouterList: [{ path: '/dashboard/base', routeIdx: 0, title: '仪表盘', name: 'DashboardBase', isHome: true }], homeRouter: { path: '/dashboard/base', routeIdx: 0, title: '仪表盘', name: 'DashboardBase', isHome: true },
tabRouterList: [],
isRefreshing: false, isRefreshing: false,
}; };
export const useTabsRouterStore = defineStore('tabsRouter', { export const useTabsRouterStore = defineStore('tabsRouter', {
state: () => state, state: () => state,
getters: { getters: {
tabRouters: (state: TTabRouterType) => state.tabRouterList, tabRouters: (state: TTabRouterType) => [state.homeRouter].concat(state.tabRouterList),
refreshing: (state: TTabRouterType) => state.isRefreshing, refreshing: (state: TTabRouterType) => state.isRefreshing,
}, },
actions: { actions: {
toggleTabRouterAlive(routeIdx: number) { toggleTabRouterAlive(routeIdx: number) {
this.isRefreshing = !this.isRefreshing; this.isRefreshing = !this.isRefreshing;
this.tabRouters[routeIdx].isAlive = !this.tabRouterList[routeIdx].isAlive; this.tabRouters[routeIdx].isAlive = !this.tabRouters[routeIdx].isAlive;
}, },
appendTabRouterList(newRoute: TRouterInfo) { appendTabRouterList(newRoute: TRouterInfo) {
if (!this.tabRouterList.find((route: TRouterInfo) => route.path === newRoute.path)) { if (!this.tabRouters.find((route: TRouterInfo) => route.path === newRoute.path)) {
// eslint-disable-next-line no-param-reassign // eslint-disable-next-line no-param-reassign
this.tabRouterList = this.tabRouterList.concat(newRoute); this.tabRouterList = this.tabRouterList.concat(newRoute);
} }
}, },
subtractCurrentTabRouter(newRoute: TRouterInfo) { subtractCurrentTabRouter(newRoute: TRouterInfo) {
const { routeIdx } = newRoute; const { routeIdx } = newRoute;
this.tabRouterList = this.tabRouterList.slice(0, routeIdx).concat(this.tabRouterList.slice(routeIdx + 1)); this.tabRouterList = this.tabRouterList.slice(0, routeIdx - 1).concat(this.tabRouterList.slice(routeIdx));
}, },
subtractTabRouterBehind(newRoute: TRouterInfo) { subtractTabRouterBehind(newRoute: TRouterInfo) {
const { routeIdx } = newRoute; const { routeIdx } = newRoute;
this.tabRouterList = this.tabRouterList.slice(0, routeIdx + 1); this.tabRouterList = this.tabRouterList.slice(0, routeIdx);
}, },
subtractTabRouterAhead(newRoute: TRouterInfo) { subtractTabRouterAhead(newRoute: TRouterInfo) {
const { routeIdx } = newRoute; const { routeIdx } = newRoute;
this.tabRouterList = this.tabRouterList.slice(routeIdx); this.tabRouterList = this.tabRouterList.slice(routeIdx - 1);
}, },
subtractTabRouterOther(newRoute: TRouterInfo) { subtractTabRouterOther(newRoute: TRouterInfo) {
const { routeIdx } = newRoute; const { routeIdx } = newRoute;
@ -44,7 +45,7 @@ export const useTabsRouterStore = defineStore('tabsRouter', {
this.tabRouterList = []; this.tabRouterList = [];
}, },
initTabRouterList(newRoutes: TRouterInfo[]) { initTabRouterList(newRoutes: TRouterInfo[]) {
this.tabRouterList = newRoutes; newRoutes?.forEach((route: TRouterInfo) => this.appendTabRouterList(route));
}, },
}, },
}); });