From 0be3ac0f2f83c1b58249d43850a0e4b4f531a8db Mon Sep 17 00:00:00 2001 From: Mr Ke <kelq@hugeinfo.com.cn> Date: Fri, 04 Sep 2020 10:56:17 +0800 Subject: [PATCH] 合并用户权限菜单,屏蔽首页工作台最新通知通知内容展示 --- src/components/common/HeadView/index.jsx | 91 ++++++++++++++++++++++++++++++++++++--------- 1 files changed, 73 insertions(+), 18 deletions(-) diff --git a/src/components/common/HeadView/index.jsx b/src/components/common/HeadView/index.jsx index f133c44..d629bbf 100644 --- a/src/components/common/HeadView/index.jsx +++ b/src/components/common/HeadView/index.jsx @@ -6,41 +6,96 @@ /** 头部组件 */ -import React from 'react'; -import { Layout, Menu, Dropdown, Icon, Row, Col, message } from 'antd'; +import React, { useEffect, useState, useContext } from 'react'; +import { Layout, Menu, Dropdown, Icon, Row, Col, message, Select } from 'antd'; +import { createHashHistory } from 'history'; const { Header } = Layout; +import logo from '../../../img/logo.png' import './index.scss'; +import { Context } from '../../../index'; -const menu = ( - <Menu> +const history = createHashHistory(); + +const { Option } = Select; +const menu = (fun) => { + return <Menu> <Menu.Item> <a onClick={() => { // 清空用户相关信息 window.localStorage.setItem('menu', ''); window.localStorage.setItem('token', ''); + window.localStorage.setItem('role', ''); message.success('退出成功!'); + fun({ role: '' }); window.location.href = window.location.origin + '/#/login'; }}> 退出 </a> </Menu.Item> - </Menu> -); +}; -export default function MenuView({ }) { +export default function HeadView({ props }) { + var loginUser = window.localStorage.getItem('loginUser') || '{}'; + loginUser = JSON.parse(loginUser); + + const [selectList, setSelectList] = useState([{ name: 'OA系统', key: 'oa' }]); + // const [selectKey, setSelectKey] = useState('oa'); + + useEffect(() => { + // 获取该登录用户的菜单权限 + let menu = window.localStorage.getItem('menu') ? JSON.parse(window.localStorage.getItem('menu')) : [];//获取权限菜单 + let administration = menu.find(({ moduleSymbol }) => moduleSymbol == 'administration'); + if (administration) { + setSelectList(selectList.concat({ name: '用户中心', key: 'user' })); + } + }, []) + + function onSelectChange(value) { + // setSelectKey(value); + // setContext && setContext({ value }) + } return ( - <Header style={{ background: '#fff', padding: 0, boxShadow: 'inset 0 -1px 0 0 #E5E5E5' }}> - <Row type="flex" align="middle" justify="end" > - <Col style={{ marginRight: 40 }}> - <Dropdown overlay={menu}> - <a className="ant-dropdown-link" onClick={e => e.preventDefault()}> - 登陆人<Icon type="down" /> - </a> - </Dropdown> - </Col> - </Row> - </Header> + <Context.Consumer> + { + ({ role, setContext }) => ( + <Header style={{ background: '#fff', padding: 0 }} className="header-view-main"> + <Row type="flex"> + <Col className="header-view-main-logo-area"> + <img src={logo} alt="恒巨科技" /> + </Col> + <Col className="flex-1"> + { + (loginUser && Object.keys(loginUser).length) && + <Row type="flex" align="middle" justify="space-between" > + <Col> + {/* <Select value={role} size="small" style={{ marginLeft: 20, width: 120 }} onChange={value => { + setContext({ role: value }); + history.push('/') + }}> + { + selectList.map(({ name, key }) => ( + <Option value={key} key={key}>{name}</Option> + )) + } + </Select> */} + </Col> + <Col style={{ marginRight: 40 }}> + {loginUser.trueName} + <Dropdown overlay={menu(setContext)}> + <a className="ant-dropdown-link" onClick={e => e.preventDefault()}> + [{loginUser.dept} | {loginUser.post}]<Icon type="caret-down" /> + </a> + </Dropdown> + </Col> + </Row> + } + </Col> + </Row> + </Header> + ) + } + </Context.Consumer> ); } -- Gitblit v1.8.0