140 lines
4.2 KiB
TypeScript
140 lines
4.2 KiB
TypeScript
import { RollbackOutlined, LogoutOutlined } from '@ant-design/icons';
|
|
import { Avatar, Menu, Typography, Modal, Form, Input, Button, message } from 'antd';
|
|
import {useDispatch, useSelector} from "react-redux";
|
|
import { useNavigate } from "react-router";
|
|
import { LoginUser, removeLoginInfo } from "../../models/auth/_";
|
|
import { RootState } from "../../models/store";
|
|
import React, { useState } from "react";
|
|
import {divIcon} from "leaflet";
|
|
import { httppost2 } from '../../utils/request';
|
|
import apiurl from '../../service/apiurl';
|
|
import CryptoJS from 'crypto-js';
|
|
|
|
const { SubMenu } = Menu;
|
|
|
|
const HeaderUser: React.FC<{
|
|
user: LoginUser | null
|
|
}> = ({ user }) => {
|
|
|
|
const navigate = useNavigate();
|
|
|
|
const dispatch = useDispatch();
|
|
const [open,setOpen] = useState(false)
|
|
|
|
const logout = () => {
|
|
removeLoginInfo();
|
|
navigate('/login');
|
|
|
|
dispatch.runtime.setHasAlertBox(false);
|
|
dispatch.runtime.setAlarmActive(false);
|
|
|
|
window.location.reload();
|
|
};
|
|
|
|
//AES加密
|
|
const encryptData = (data:any) => {
|
|
const encryptedData = CryptoJS.MD5(data).toString();
|
|
return encryptedData;
|
|
}
|
|
|
|
|
|
const onFinish = async(val:any)=>{
|
|
if(val.newSecretKey!==val.secondSecretKey){
|
|
message.error('确认密码错误')
|
|
return
|
|
}
|
|
const params = {
|
|
oldSecretKey:encryptData(val.oldSecretKey),
|
|
newSecretKey:encryptData(val.newSecretKey),
|
|
secondSecretKey:encryptData(val.secondSecretKey),
|
|
userId: localStorage.getItem('userId')
|
|
}
|
|
const res = await httppost2(apiurl.setPassword,params)
|
|
if(res.code===200){
|
|
message.success('修改成功')
|
|
setTimeout(() => {
|
|
logout()
|
|
}, 1500);
|
|
}else{
|
|
message.error(res.description)
|
|
}
|
|
}
|
|
|
|
|
|
return (
|
|
<div className="clearFloat">
|
|
<div className="lf">
|
|
<Menu
|
|
mode="horizontal"
|
|
theme="dark"
|
|
style={{width:"130px", color:"#fff"}}
|
|
>
|
|
{/*icon={<Avatar><UserOutlined /></Avatar>}*/}
|
|
<SubMenu key="pm" icon={<div className="user topMenuIcon1"></div>} title={
|
|
<span style={{fontSize:"12px"}}>
|
|
{localStorage.getItem('userName')??'-'}
|
|
{/* 咸丰测试 */}
|
|
</span>} >
|
|
<Menu.Item key="logout2" onClick={()=>setOpen(true)} className="userBox">修改密码</Menu.Item>
|
|
<Menu.Item icon={<LogoutOutlined />} key="logout" onClick={logout} className="userBox2">登出</Menu.Item>
|
|
</SubMenu>
|
|
</Menu>
|
|
</div>
|
|
|
|
{
|
|
localStorage.getItem('getInfoAdcd') === "420000000000000"?
|
|
<div className="lf" style={{width:"30px", height:"30px", lineHeight:"32px", background:"#fff", borderRadius:"50%", textAlign:"center", marginTop:"17px"}}>
|
|
<a href="http://223.75.53.141:8000/home" target="_self" style={{color:"#4677FF"}}>
|
|
<RollbackOutlined style={{fontSize:"18px"}}/>
|
|
</a>
|
|
</div>:null
|
|
}
|
|
|
|
<Modal title="修改密码" open={open} onOk={()=>setOpen(false)} onCancel={()=>setOpen(false)} footer={null}>
|
|
<Form
|
|
name="basic"
|
|
labelCol={{span: 5}}
|
|
wrapperCol={{span: 18}}
|
|
initialValues={{remember: true}}
|
|
onFinish={onFinish}
|
|
autoComplete="off"
|
|
>
|
|
<Form.Item
|
|
label="原密码"
|
|
name="oldSecretKey"
|
|
rules={[{required: true}]}>
|
|
<Input.Password />
|
|
</Form.Item>
|
|
<Form.Item
|
|
label="新密码"
|
|
name="newSecretKey"
|
|
rules={[{required: true}]}>
|
|
<Input.Password />
|
|
</Form.Item>
|
|
|
|
<Form.Item
|
|
label="确认密码"
|
|
name="secondSecretKey"
|
|
rules={[{required: true}]}>
|
|
<Input.Password />
|
|
</Form.Item>
|
|
|
|
<Form.Item
|
|
wrapperCol={{
|
|
offset: 20,
|
|
span: 4,
|
|
}}
|
|
>
|
|
<Button type="primary" htmlType="submit">
|
|
提交
|
|
</Button>
|
|
</Form.Item>
|
|
</Form>
|
|
</Modal>
|
|
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default HeaderUser
|