mirror of
https://github.com/Tencent/tdesign-vue-next-starter.git
synced 2024-12-23 13:03:42 +08:00
fix: [多标签Tab页] 关闭左侧,关闭其他可能导致主页标签被删除 (#148)
* fix: 主页和路由页独立 主页和路由页独立 fix #147 * refactor: 撤回不属于本次提交的更改 撤回不属于本次提交的更改
This commit is contained in:
parent
15804b711c
commit
24451f7720
|
@ -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>;
|
||||||
}
|
}
|
||||||
|
|
|
@ -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" />
|
||||||
关闭左侧
|
关闭左侧
|
||||||
|
|
|
@ -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));
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in New Issue
Block a user