| | |
| | | import React, {Component} from 'react' |
| | | import { withRouter } from 'react-router-dom' |
| | | import PropTypes from 'prop-types' |
| | | import {connect} from 'react-redux' |
| | | import { is, fromJS } from 'immutable' |
| | | import { Dropdown, Menu, Modal, notification, Switch, Input } from 'antd' |
| | | import { SearchOutlined, DownOutlined, MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons' |
| | | |
| | | import { |
| | | toggleCollapse, |
| | | modifyMainMenu, |
| | | logout |
| | | } from '@/store/action' |
| | | import asyncSpinComponent from '@/utils/asyncSpinComponent' |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | | import Api from '@/api' |
| | |
| | | const LoginForm = asyncSpinComponent(() => import('./loginform')) |
| | | |
| | | class Header extends Component { |
| | | static propTpyes = { |
| | | collapse: PropTypes.bool |
| | | } |
| | | state = { |
| | | menulist: null, // 一级菜单 |
| | | userName: '', |
| | |
| | | systems: [], |
| | | searchkey: '', |
| | | thdMenuList: [], |
| | | debug: sessionStorage.getItem('debug') === 'true' |
| | | debug: sessionStorage.getItem('debug') === 'true', |
| | | collapse: sessionStorage.getItem('collapse') === 'true' |
| | | } |
| | | |
| | | UNSAFE_componentWillMount () { |
| | | window.GLOB.mainMenu = null |
| | | // 组件加载时,获取菜单数据 |
| | | this.getRolesMenu() |
| | | |
| | | let fullName = sessionStorage.getItem('Full_Name') || '' |
| | | let userName = sessionStorage.getItem('User_Name') || '' |
| | | |
| | | if (fullName.toLowerCase() === userName.toLowerCase()) { |
| | | userName = '' |
| | | } |
| | | |
| | | this.setState({fullName, userName}) |
| | | } |
| | | |
| | | componentDidMount () { |
| | | // 获取系统的版本信息,延时查询 |
| | | setTimeout(() => { |
| | | Api.getAppVersion() |
| | | }, 1000) |
| | | |
| | | // sessionStorage 跨页面共享 |
| | | window.addEventListener('storage', (e) => { |
| | | if (e.key === 'getSessionStorage' && e.newValue === window.GLOB.appkey) { |
| | | localStorage.setItem('sessionStorage', JSON.stringify(sessionStorage)) |
| | | } else if (e.key === 'getSysPermission' && e.newValue === window.GLOB.appkey) { |
| | | localStorage.setItem('sysPermissions', JSON.stringify({mkThdMenus: window.GLOB.mkThdMenus, mkActions: window.GLOB.mkActions})) |
| | | } else if (e.key === 'menuUpdate') { |
| | | let vals = e.newValue.split(',') |
| | | let menuId = vals[1] |
| | | let position = vals[2] || '' |
| | | if (position === 'menu') { |
| | | MKEmitter.emit('reloadMenuView', menuId) |
| | | } else if (menuId) { |
| | | Api.getAppVersion(menuId).then(() => { |
| | | MKEmitter.emit('reloadMenuView', menuId) |
| | | }) |
| | | } |
| | | } |
| | | }) |
| | | } |
| | | |
| | | shouldComponentUpdate (nextProps, nextState) { |
| | | return !is(fromJS(this.props), fromJS(nextProps)) || !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | | |
| | | /** |
| | | * @description 组件销毁,清除state更新 |
| | | */ |
| | | componentWillUnmount () { |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | } |
| | | |
| | | handleCollapse = () => { |
| | | // 展开、收起左侧菜单栏 |
| | | this.props.toggleCollapse(!this.props.collapse) |
| | | localStorage.setItem('collapse', !this.props.collapse) |
| | | const { collapse } = this.state |
| | | |
| | | sessionStorage.setItem('collapse', !collapse) |
| | | |
| | | this.setState({collapse: !collapse}) |
| | | |
| | | MKEmitter.emit('toggleCollapse', !collapse) |
| | | } |
| | | |
| | | changePassword = () => { |
| | |
| | | MKEmitter.emit('resetpassword', () => { |
| | | setTimeout(() => { |
| | | sessionStorage.clear() |
| | | this.props.logout() |
| | | this.props.history.replace('/login') |
| | | }, 2000) |
| | | }) |
| | |
| | | cancelText: '取消', |
| | | onOk() { |
| | | sessionStorage.clear() |
| | | _this.props.logout() |
| | | _this.props.history.replace('/login') |
| | | }, |
| | | onCancel() {} |
| | |
| | | } else if (value.OpenType === 'newtab') { |
| | | MKEmitter.emit('modifyTabs', value) |
| | | } else if (value.OpenType === 'menu') { |
| | | this.props.modifyMainMenu(value) |
| | | window.GLOB.mainMenu = value |
| | | MKEmitter.emit('mainMenuChange') |
| | | } |
| | | } |
| | | |
| | |
| | | sessionStorage.removeItem('ThirdMenu') |
| | | } |
| | | |
| | | this.props.modifyMainMenu(mainMenu) |
| | | |
| | | window.GLOB.mainMenu = mainMenu |
| | | window.GLOB.mkThdMenus = [...thdMenuList, {MenuID: 'home_page_id', EasyCode: '', MenuName: 'home', type: 'CustomPage'}] |
| | | |
| | | MKEmitter.emit('mainMenuChange') |
| | | |
| | | if (_menu) { |
| | | this.openTab(_menu, 0) |
| | |
| | | loginVisible: true |
| | | }) |
| | | } else { |
| | | this.props.modifyMainMenu(null) |
| | | |
| | | window.GLOB.mainMenu = null |
| | | this.props.history.replace('/design') |
| | | } |
| | | } |
| | |
| | | localStorage.setItem(_url, window.btoa(window.encodeURIComponent(JSON.stringify({time: new Date().getTime(), username: param.username, password: ''})))) |
| | | } |
| | | |
| | | this.props.modifyMainMenu(null) |
| | | window.GLOB.mainMenu = null |
| | | |
| | | this.props.history.replace('/design') |
| | | } else { |
| | | if (res.message.indexOf('密码错误') > -1) { |
| | |
| | | }, 500) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | UNSAFE_componentWillMount () { |
| | | // 组件加载时,获取菜单数据 |
| | | this.getRolesMenu() |
| | | |
| | | let fullName = sessionStorage.getItem('Full_Name') || '' |
| | | let userName = sessionStorage.getItem('User_Name') || '' |
| | | |
| | | if (fullName.toLowerCase() === userName.toLowerCase()) { |
| | | userName = '' |
| | | } |
| | | |
| | | this.setState({fullName, userName}) |
| | | } |
| | | |
| | | componentDidMount () { |
| | | // 获取系统的版本信息,延时查询 |
| | | setTimeout(() => { |
| | | Api.getAppVersion() |
| | | }, 1000) |
| | | |
| | | // sessionStorage 跨页面共享 |
| | | window.addEventListener('storage', (e) => { |
| | | if (e.key === 'getSessionStorage' && e.newValue === window.GLOB.appkey) { |
| | | localStorage.setItem('sessionStorage', JSON.stringify(sessionStorage)) |
| | | } else if (e.key === 'getSysPermission' && e.newValue === window.GLOB.appkey) { |
| | | localStorage.setItem('sysPermissions', JSON.stringify({mkThdMenus: window.GLOB.mkThdMenus, mkActions: window.GLOB.mkActions})) |
| | | } else if (e.key === 'menuUpdate') { |
| | | let vals = e.newValue.split(',') |
| | | let menuId = vals[1] |
| | | let position = vals[2] || '' |
| | | if (position === 'menu') { |
| | | MKEmitter.emit('reloadMenuView', menuId) |
| | | } else if (menuId) { |
| | | Api.getAppVersion(menuId).then(() => { |
| | | MKEmitter.emit('reloadMenuView', menuId) |
| | | }) |
| | | } |
| | | } |
| | | }) |
| | | } |
| | | |
| | | shouldComponentUpdate (nextProps, nextState) { |
| | | return !is(fromJS(this.props), fromJS(nextProps)) || !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | | |
| | | /** |
| | | * @description 组件销毁,清除state更新 |
| | | */ |
| | | componentWillUnmount () { |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | } |
| | | |
| | | gotoDoc = () => { |
| | |
| | | } |
| | | |
| | | render () { |
| | | const { mainMenu, collapse } = this.props |
| | | const { thdMenuList, searchkey, debug, menulist } = this.state |
| | | const { thdMenuList, searchkey, debug, menulist, collapse } = this.state |
| | | const navBar = window.GLOB.navBar |
| | | |
| | | const menu = ( |
| | |
| | | <ul className="header-menu">{ |
| | | menulist.map(item => { |
| | | return ( |
| | | <li key={item.MenuID} onClick={() => {this.changeMenu(item)}} className={mainMenu && mainMenu.MenuID === item.MenuID ? 'active' : ''}> |
| | | <li key={item.MenuID} onClick={() => {this.changeMenu(item)}} className={window.GLOB.mainMenu && window.GLOB.mainMenu.MenuID === item.MenuID ? 'active' : ''}> |
| | | <span>{item.MenuName}</span> |
| | | </li> |
| | | ) |
| | |
| | | } |
| | | } |
| | | |
| | | const mapStateToProps = (state) => { |
| | | return { |
| | | collapse: state.collapse, |
| | | mainMenu: state.mainMenu |
| | | } |
| | | } |
| | | |
| | | const mapDispatchToProps = (dispatch) => { |
| | | return { |
| | | toggleCollapse: (collapse) => dispatch(toggleCollapse(collapse)), |
| | | modifyMainMenu: (mainMenu) => dispatch(modifyMainMenu(mainMenu)), |
| | | logout: () => dispatch(logout()) |
| | | } |
| | | } |
| | | |
| | | export default withRouter(connect(mapStateToProps, mapDispatchToProps)(Header)) |
| | | export default withRouter(Header) |