diff --git a/src/models/Staff.ts b/src/models/Staff.ts index b4a4e06..d45fc55 100644 --- a/src/models/Staff.ts +++ b/src/models/Staff.ts @@ -1,6 +1,7 @@ import dayjs from "dayjs"; export interface Token { + staffId: string; accessToken: string; refreshToken: string; clientSecret: string; diff --git a/src/models/store.ts b/src/models/store.ts index f3fd931..98b65f6 100644 --- a/src/models/store.ts +++ b/src/models/store.ts @@ -1,17 +1,19 @@ import {configureStore, ThunkAction, Action, PayloadAction, createSlice, combineReducers} from '@reduxjs/toolkit'; -import {Token} from "./Staff" +import {Department, Staff, Token} from "./Staff" import {persistStore, persistReducer} from 'redux-persist' import storage from 'redux-persist/lib/storage' // defaults to localStorage for web const tokenSlice = createSlice({ name: 'token', initialState: { + staffId: '', accessToken: '', refreshToken: '', clientSecret: '' }, reducers: { setToken: (state, action: PayloadAction) => { + state.staffId = action.payload.staffId state.accessToken = action.payload.accessToken state.refreshToken = action.payload.refreshToken state.clientSecret = action.payload.clientSecret @@ -21,8 +23,29 @@ const tokenSlice = createSlice({ }, }, }); + +const staffSlice = createSlice({ + name: 'staff', + initialState: { + staffName: "", + managingDepartment: { departmentId: 0, + departmentName: ''}, + staffDepartments: [{ departmentId: 0, + departmentName: ''}] + }, + reducers: { + setStaff: (state, action: PayloadAction) => { + state.staffName = action.payload.staffName + state.managingDepartment = action.payload.managingDepartment + state.staffDepartments = action.payload.staffDepartments + }, + }, +}); + export const {setToken, setAccessToken} = tokenSlice.actions; +export const {setStaff} = staffSlice.actions; export const getToken = (state: RootState) => state.token; +export const getStaff = (state: RootState) => state.staff; const persistConfig = { key: 'root', @@ -33,7 +56,8 @@ const persistedReducer = persistReducer(persistConfig, tokenSlice.reducer) export const store = configureStore({ reducer: { - token: persistedReducer + token: persistedReducer, + staff: staffSlice.reducer }, middleware: getDefaultMiddleware => { return getDefaultMiddleware({ diff --git a/src/pages/HomeView.tsx b/src/pages/HomeView.tsx index 1fcc10e..a6acce7 100644 --- a/src/pages/HomeView.tsx +++ b/src/pages/HomeView.tsx @@ -2,12 +2,12 @@ import React, {useState, useEffect} from 'react'; import {UploadOutlined, UserOutlined, VideoCameraOutlined} from '@ant-design/icons'; import {Layout, Menu, theme, Typography, Button, Dropdown, MenuProps} from 'antd'; import {useAppDispatch, useAppSelector} from "../models/hooks"; -import {getToken, setToken, store} from "../models/store"; +import {getStaff, getToken, setStaff, setToken, store} from "../models/store"; import {Link, Outlet, useLocation, useNavigate} from "react-router-dom"; import Icon from '@ant-design/icons'; import {Logo} from "../assets/icons"; import axiosInstance from "../utils/axiosInstance"; -import {Department, Staff} from "../models/Staff"; +import {Department, Staff, Token} from "../models/Staff"; const {Title} = Typography; const {Header, Content, Footer, Sider} = Layout; @@ -18,7 +18,8 @@ function HeaderBar(props: any) { token: {colorBgContainer, colorPrimary}, } = theme.useToken(); - const token = useAppSelector(getToken); + const token:Token = useAppSelector(getToken); + const staff:Staff = useAppSelector(getStaff); const dispatch = useAppDispatch() const navigate = useNavigate() @@ -29,6 +30,7 @@ function HeaderBar(props: any) { break case 'logout': dispatch(setToken({ + staffId: '', accessToken: '', refreshToken: '', clientSecret: '' @@ -88,13 +90,13 @@ function HeaderBar(props: any) { marginRight: '12px', height: '100%', display: 'flex', justifyContent: 'center', alignItems: 'center' }}> - {departmentToString(props.staff)} - {props.staff.staffName} + {departmentToString(staff)} + {staff.staffName}
- {props.staff.staffName[0]} + {staff.staffName[0]}
@@ -120,6 +122,7 @@ function HomeView() { const token = useAppSelector(getToken); const navigate = useNavigate(); const location = useLocation() + const dispatch = useAppDispatch(); console.log(store.getState()) let items = [{ @@ -148,13 +151,6 @@ function HomeView() { token: {colorBgContainer, colorPrimary}, } = theme.useToken(); - - const [staff, setStaff] = useState({ - staffName: "", - managingDepartment: null, - staffDepartments: [] - }) - const [menuItems, setMenuItems] = useState(items.slice(0, 2)) const [defaultSelectedKeys, setDefaultSelectedKeys] = useState(['']) @@ -164,8 +160,9 @@ function HomeView() { method: 'get' }).then(response => { console.log(response.data) - const staff = response.data - setStaff(response.data) + const staff:Staff = response.data + dispatch(setStaff(staff)) + if (location.pathname === '/') navigate('/invoice/mine') @@ -225,9 +222,9 @@ function HomeView() { - + - +
diff --git a/src/pages/Invoice/mine/InvoiceUploadView.tsx b/src/pages/Invoice/mine/InvoiceUploadView.tsx index 35fde01..b442b34 100644 --- a/src/pages/Invoice/mine/InvoiceUploadView.tsx +++ b/src/pages/Invoice/mine/InvoiceUploadView.tsx @@ -235,14 +235,6 @@ class InvoiceUploadView extends React.Component { this.setState({open: value}) } - setLoading(value: Boolean) { - this.setState({loading: value}) - } - - setUploadStep(value: number) { - this.setState({uploadStep: value}) - } - showUploadView = () => { this.setOpen(true); }; diff --git a/src/pages/login/LoginView.tsx b/src/pages/login/LoginView.tsx index 9ee86cf..98f2e01 100644 --- a/src/pages/login/LoginView.tsx +++ b/src/pages/login/LoginView.tsx @@ -21,6 +21,7 @@ function LoginView() { axios.post(baseUrl + 'login', data).then(function (response) { console.log(response.data) dispatch(setToken({ + staffId: values.staffId, accessToken: response.data.accessToken, refreshToken: response.data.refreshToken, clientSecret: response.data.clientSecret diff --git a/src/utils/axiosInstance.ts b/src/utils/axiosInstance.ts index 2ace6c5..eeaf4e7 100644 --- a/src/utils/axiosInstance.ts +++ b/src/utils/axiosInstance.ts @@ -35,6 +35,7 @@ axiosInstance.interceptors.response.use( if (error.config.isRetry) { console.log('isRetry') store.dispatch(setToken({ + staffId: '', accessToken: '', refreshToken: '', clientSecret: '' @@ -63,6 +64,7 @@ axiosInstance.interceptors.response.use( console.log('refresh error') console.log(error); store.dispatch(setToken({ + staffId: '', accessToken: '', refreshToken: '', clientSecret: ''