| | |
|---|
| | | * @Company: hugeInfo |
|---|
| | | * @Author: ldh |
|---|
| | | * @Date: 2022-03-11 11:33:21 |
|---|
| | | * @LastEditTime: 2024-08-22 11:51:48 |
|---|
| | | * @LastEditTime: 2024-09-11 09:45:36 |
|---|
| | | * @LastEditors: dminyi 1301963064@qq.com |
|---|
| | | * @Version: 1.0.0 |
|---|
| | | * @Description: 头部组件 |
|---|
| | |
|---|
| | | import { Menu, Badge, Avatar, Dropdown, Space, Form, Input, Button, Radio } from 'antd'; |
|---|
| | | import { BellOutlined, LogoutOutlined, UserOutlined, FormOutlined, UserSwitchOutlined, DownCircleFilled } from '@ant-design/icons'; |
|---|
| | | import { mediationCenter, mediationCenter_active, operateCenter, operateCenter_active } from '../../assets/images/icon'; |
|---|
| | | import { yewu } from '../../assets/images'; |
|---|
| | | import * as $$ from '../../utils/utility'; |
|---|
| | | import MyMessage from '../../views/myMessage'; |
|---|
| | | import MyModal from '../MyModal'; |
|---|
| | |
|---|
| | | * handleClickMenu: function 头部导航点击 |
|---|
| | | * handleChangeRole: function 切换角色 |
|---|
| | | */ |
|---|
| | | const Header = ({ roleActive, headerMenu, headerMenuActive, headerUserChange, handleClickMenu, handleChangeRole }) => { |
|---|
| | | let navigate = useNavigate(); |
|---|
| | | const Header = ({ roleActive, headerMenu, headerMenuActive, headerUserChange, handleClickMenu, handleChangeRole,userData }) => { |
|---|
| | | |
|---|
| | | const [data, setData] = useState([]); |
|---|
| | | let navigate = useNavigate(); |
|---|
| | | |
|---|
| | | // 修改密码窗口显示隐藏 |
|---|
| | | const [visible, setVisible] = useState(false); |
|---|
| | |
|---|
| | | const [myMessageVisible, setMyMessageVisible] = useState(false); |
|---|
| | | |
|---|
| | | const headerMenuIcon = { |
|---|
| | | 'mediate': { icon: mediationCenter, iconActive: mediationCenter_active }, |
|---|
| | | 'mediate': { icon: yewu, iconActive: yewu }, |
|---|
| | | 'operation': { icon: operateCenter, iconActive: operateCenter_active }, |
|---|
| | | }; |
|---|
| | | |
|---|
| | |
|---|
| | | |
|---|
| | | const userMenu = ( |
|---|
| | | <Menu> |
|---|
| | | {data?.ctUseroleList?.length > 1 && ( |
|---|
| | | {userData?.ctUseroleList?.length > 1 && ( |
|---|
| | | <> |
|---|
| | | <Menu.Item key="changeRole" onClick={() => setRoleModal({ visible: true, value: roleActive.id })}> |
|---|
| | | <UserSwitchOutlined style={{ marginRight: '8px' }} /> |
|---|
| | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | useEffect(() => { |
|---|
| | | setData($$.getLocal('customerSystemUser') || {}); |
|---|
| | | }, [headerUserChange]); |
|---|
| | | |
|---|
| | | return ( |
|---|
| | | <header className="header"> |
|---|
| | |
|---|
| | | <div className="header-user-avatar"> |
|---|
| | | <Avatar icon={<UserOutlined />} /> |
|---|
| | | <div> |
|---|
| | | <div className="header-user-name">{data?.trueName || '-'}</div> |
|---|
| | | <div className="header-user-name">{userData?.trueName || '-'}</div> |
|---|
| | | <div className="header-user-unit"> |
|---|
| | | <span>{data?.unit || '-'}</span> |
|---|
| | | <span>{userData?.unit || '-'}</span> |
|---|
| | | <span className="public-rightBorder">{roleActive.roleName || '-'}</span> |
|---|
| | | <DownCircleFilled style={{ fontSize: '10px', marginLeft: '8px', color: '#ffffff' }} /> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | value={roleModal.value} |
|---|
| | | onChange={(e) => setRoleModal({ visible: true, value: e.target.value, name: e.target.label, roleCode: e.target.roleCode })} |
|---|
| | | > |
|---|
| | | {data?.ctUseroleList?.map((x) => ( |
|---|
| | | {userData?.ctUseroleList?.map((x) => ( |
|---|
| | | <Radio key={x.roleId} value={x.roleId} label={x.roleName} roleCode={x.roleCode}> |
|---|
| | | {x.roleName} |
|---|
| | | </Radio> |
|---|
