tabsSlice.ts
1.53 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
import { createSlice, PayloadAction } from "@reduxjs/toolkit";
export interface OpenTab {
id: string;
label: string;
screen: string;
closable?: boolean;
meta?: Record<string, unknown>;
}
interface TabsState {
tabs: OpenTab[];
activeTabId: string;
}
const initialState: TabsState = {
tabs: [{ id: "home", label: "主页", screen: "home", closable: false }],
activeTabId: "home",
};
const slice = createSlice({
name: "tabs",
initialState,
reducers: {
openTab(state, action: PayloadAction<OpenTab>) {
const exists = state.tabs.find((t) => t.id === action.payload.id);
if (!exists) state.tabs.push(action.payload);
state.activeTabId = action.payload.id;
},
closeTab(state, action: PayloadAction<string>) {
const id = action.payload;
const idx = state.tabs.findIndex((t) => t.id === id);
if (idx < 0) return;
const tab = state.tabs[idx];
if (tab.closable === false) return;
state.tabs = state.tabs.filter((t) => t.id !== id);
if (state.activeTabId === id) {
const fallback = state.tabs[Math.max(0, idx - 1)] || state.tabs[0];
state.activeTabId = fallback?.id ?? "home";
}
},
setActiveTab(state, action: PayloadAction<string>) {
state.activeTabId = action.payload;
},
resetTabs(state) {
state.tabs = [{ id: "home", label: "主页", screen: "home", closable: false }];
state.activeTabId = "home";
},
},
});
export const { openTab, closeTab, setActiveTab, resetTabs } = slice.actions;
export default slice.reducer;