/*
|
* @Company: hugeInfo
|
* @Author: lwh
|
* @Date: 2025-04-12 15:30:00
|
* @LastEditTime: 2025-04-25 11:13:34
|
* @LastEditors: lwh
|
* @Version: 1.0.0
|
* @Description: 个人中心页面
|
*/
|
import React from 'react';
|
import { useHistory } from 'react-router-dom';
|
import { Button } from 'antd';
|
import { RightOutlined } from '@ant-design/icons';
|
import NavBarPage from '../../components/NavBarPage';
|
import * as $$ from '../../utils/utility';
|
import userAvatar from '../../assets/img/logAvatar.png';
|
import personEdit from '../../assets/img/person_edit.png';
|
import loginHistory from '../../assets/img/login_history.png';
|
import personFile from '../../assets/img/person_file.png';
|
import './index.less';
|
|
const PersonCenter = () => {
|
const history = useHistory();
|
const user = $$.getSessionStorage('customerSystemUser') || {};
|
|
// 登出
|
function handleLogOut() {
|
// $$.clearLocal('customerSystemUser');
|
// $$.clearSessionStorage();
|
history.push('/gzdyh/login');
|
}
|
|
// 用户名处理，如王*明
|
function formatName() {
|
let arr = user?.trueName?.split('') || [];
|
return arr[0] + (arr.length > 1 ? '*' : '') + (arr.length > 2 ? arr[arr.length - 1] : '');
|
}
|
|
// 菜单项点击处理
|
const handleMenuClick = (type) => {
|
switch (type) {
|
case 'history':
|
// 登记历史处理
|
history.push('/gzdyh/registerHis');
|
break;
|
case 'manual':
|
// 用户手册处理
|
break;
|
default:
|
break;
|
}
|
};
|
|
return (
|
<div className="person-center">
|
{/* 顶部导航栏 */}
|
<NavBarPage title="个人中心" leftContentVisible={true} className="person-center-navbar">
|
{/* 顶部个人信息区域 */}
|
<div className="person-center-header">
|
<div className="person-center-user">
|
<div className="person-center-avatar">
|
<img src={userAvatar} alt="用户头像" />
|
</div>
|
<div className="person-center-info">
|
<div className="person-center-name-container">
|
<span className="person-center-name">{formatName()}</span>
|
<img src={personEdit} alt="编辑" className="person-center-name-edit" />
|
</div>
|
<div className="person-center-time">最近登录时间：{$$.timeFormat(user?.lastLoginTime)}</div>
|
</div>
|
</div>
|
</div>
|
|
{/* 卡片区域 */}
|
<div className="person-center-card">
|
{/* 菜单区域 */}
|
<div className="person-center-menu">
|
<div className="person-center-menu-item" onClick={() => handleMenuClick('history')}>
|
<div className="person-center-menu-icon">
|
<img src={loginHistory} alt="登记历史" />
|
</div>
|
<div className="person-center-menu-text">登记历史</div>
|
<RightOutlined className="person-center-menu-arrow" />
|
</div>
|
|
<div className="person-center-menu-item" onClick={() => handleMenuClick('manual')}>
|
<div className="person-center-menu-icon">
|
<img src={personFile} alt="用户手册" />
|
</div>
|
<div className="person-center-menu-text">用户手册</div>
|
<RightOutlined className="person-center-menu-arrow" />
|
</div>
|
</div>
|
|
{/* 退出登录按钮 */}
|
<div className="person-center-logout">
|
<Button block onClick={handleLogOut} className="person-center-logout-btn">
|
退出登录
|
</Button>
|
</div>
|
</div>
|
</NavBarPage>
|
</div>
|
);
|
};
|
|
export default PersonCenter;
|
