Merge remote-tracking branch 'origin/main'

main
白封羽 2023-01-06 16:24:30 +08:00
commit ec17ab2e10
2 changed files with 43 additions and 13 deletions

View File

@ -1,6 +1,6 @@
import React, {useState, useEffect} from 'react'; import React, {useState, useEffect} from 'react';
import {UploadOutlined, UserOutlined, BellOutlined} from '@ant-design/icons'; import {UploadOutlined, UserOutlined, BellOutlined} from '@ant-design/icons';
import {Layout, Menu, theme, Typography, Button, Dropdown, MenuProps} from 'antd'; import {Layout, Menu, theme, Typography, Button, Dropdown, MenuProps, Popover} from 'antd';
import {useAppDispatch, useAppSelector} from "../models/hooks"; import {useAppDispatch, useAppSelector} from "../models/hooks";
import {getStaff, getToken, setStaff, setToken, store} from "../models/store"; import {getStaff, getToken, setStaff, setToken, store} from "../models/store";
import {Link, Outlet, useLocation, useNavigate} from "react-router-dom"; import {Link, Outlet, useLocation, useNavigate} from "react-router-dom";
@ -8,6 +8,7 @@ import Icon from '@ant-design/icons';
import {Logo} from "../assets/icons"; import {Logo} from "../assets/icons";
import axiosInstance from "../utils/axiosInstance"; import axiosInstance from "../utils/axiosInstance";
import {Department, Staff, Token} from "../models/Staff"; import {Department, Staff, Token} from "../models/Staff";
import MessageList from "./MessageList";
const {Title} = Typography; const {Title} = Typography;
const {Header, Content, Footer, Sider} = Layout; const {Header, Content, Footer, Sider} = Layout;
@ -29,13 +30,6 @@ function HeaderBar(props: any) {
case 'password': case 'password':
break break
case 'logout': case 'logout':
dispatch(setToken({
staffId: '',
accessToken: '',
refreshToken: '',
clientSecret: ''
}))
axiosInstance({ axiosInstance({
url: 'logout', url: 'logout',
method: 'post', method: 'post',
@ -44,11 +38,16 @@ function HeaderBar(props: any) {
} }
}).then(response => { }).then(response => {
console.log(response.data) console.log(response.data)
navigate("/login")
}).catch(function (error) { }).catch(function (error) {
console.log(error) console.log(error)
}) })
dispatch(setToken({
staffId: '',
accessToken: '',
refreshToken: '',
clientSecret: ''
}))
navigate("/login")
break break
} }
@ -97,9 +96,7 @@ function HeaderBar(props: any) {
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center', alignItems: 'center',
}}> }}>
<Button type="text" shape="circle"> <MessageList/>
<BellOutlined/>
</Button>
<Dropdown overlayStyle={{minWidth: '150px'}} menu={{items, onClick}} placement="bottomRight" arrow> <Dropdown overlayStyle={{minWidth: '150px'}} menu={{items, onClick}} placement="bottomRight" arrow>
<Button type="text" style={{ <Button type="text" style={{
marginRight: '12px', height: '100%', marginRight: '12px', height: '100%',

33
src/pages/MessageList.tsx Normal file
View File

@ -0,0 +1,33 @@
import {Button, List, Popover} from "antd";
import {BellOutlined} from "@ant-design/icons";
import React, {useState} from "react";
function MessageList() {
const [list, setList] = useState<any[]>([]);
return (
<Popover content={
<List
itemLayout="horizontal"
dataSource={list}
renderItem={(item) => (
<List.Item
actions={[<a key="list-loadmore-edit">edit</a>, <a key="list-loadmore-more">more</a>]}
>
<List.Item.Meta
title={<a href="https://ant.design">{item.name?.last}</a>}
description="Ant Design, a design language for background applications, is refined by Ant UED Team"
/>
<div>content</div>
</List.Item>
)}
/>
} title="我的消息">
<Button type="text" shape="circle">
<BellOutlined/>
</Button>
</Popover>
)
}
export default MessageList