import React, {Component} from 'react'
|
import { withRouter } from 'react-router-dom'
|
import { is, fromJS } from 'immutable'
|
import { Dropdown, Menu, Modal, notification, Switch, Input } from 'antd'
|
import { SearchOutlined, DownOutlined, MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons'
|
|
import asyncSpinComponent from '@/utils/asyncSpinComponent'
|
import asyncComponent from '@/utils/asyncComponent'
|
import Api from '@/api'
|
import MKEmitter from '@/utils/events.js'
|
import Utils from '@/utils/utils.js'
|
import avatar from '@/assets/img/avatar.jpg'
|
import wxicon from '@/assets/img/wx-icon.png'
|
import mkpublic from '@/assets/img/mkpublic.jpg'
|
import './index.scss'
|
|
const { confirm } = Modal
|
const { Search } = Input
|
const Resetpwd = asyncComponent(() => import('@/components/resetPassword'))
|
const QrCode = asyncComponent(() => import('@/components/qrcode'))
|
const LoginForm = asyncSpinComponent(() => import('./loginform'))
|
const SysIcon = asyncComponent(() => import('./sysmessage/icon'))
|
|
class Header extends Component {
|
state = {
|
menulist: null, // 一级菜单
|
userName: '',
|
fullName: '',
|
logourl: window.GLOB.mainlogo,
|
wxVisible: false,
|
wxStep: 1,
|
loginVisible: false,
|
loginLoading: false,
|
avatar: Utils.getrealurl(sessionStorage.getItem('avatar')),
|
systems: [],
|
searchkey: '',
|
thdMenuList: [],
|
debug: sessionStorage.getItem('debug') === 'true' && window.GLOB.memberLevel > 0,
|
collapse: sessionStorage.getItem('collapse') === 'true',
|
lang: sessionStorage.getItem('lang') || '',
|
dict: window.GLOB.dict
|
}
|
|
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(() => {
|
if (!window.GLOB.$error) {
|
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: this.state.thdMenuList, 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)
|
})
|
}
|
}
|
})
|
|
if (sessionStorage.getItem('local_error')) {
|
try {
|
let param = JSON.parse(sessionStorage.getItem('local_error'))
|
setTimeout(() => {
|
Api.genericInterface({
|
func: 's_special_error_note_log',
|
...param
|
}).then(res => {
|
if (res.status) {
|
sessionStorage.removeItem('local_error')
|
}
|
})
|
}, 3000)
|
} catch (e) {
|
sessionStorage.removeItem('local_error')
|
}
|
}
|
}
|
|
shouldComponentUpdate (nextProps, nextState) {
|
return !is(fromJS(this.props), fromJS(nextProps)) || !is(fromJS(this.state), fromJS(nextState))
|
}
|
|
/**
|
* @description 组件销毁，清除state更新
|
*/
|
componentWillUnmount () {
|
this.setState = () => {
|
return
|
}
|
}
|
|
handleCollapse = () => {
|
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.history.replace('/login')
|
window.location.reload()
|
}, 2000)
|
})
|
}
|
|
logout = () => {
|
const { dict } = this.state
|
// 退出登录
|
let that = this
|
confirm({
|
title: dict['logout_query'] || '您确定要退出吗？',
|
content: '',
|
okText: dict['ok'] || '确定',
|
cancelText: dict['cancel'] || '取消',
|
onOk() {
|
sessionStorage.clear()
|
setTimeout(() => {
|
that.props.history.replace('/login')
|
window.location.reload()
|
}, 100)
|
},
|
onCancel() {}
|
})
|
}
|
|
changeMenu (value) {
|
// 主菜单切换
|
if (value.OpenType === 'newpage') {
|
window.open(value.src)
|
} else if (value.OpenType === 'newtab') {
|
MKEmitter.emit('modifyTabs', value)
|
} else if (value.OpenType === 'menu') {
|
window.GLOB.mainMenu = value
|
MKEmitter.emit('mainMenuChange')
|
}
|
}
|
|
getRolesMenu () {
|
// 获取主菜单参数
|
let _param = {func: 's_get_pc_menus', systemType: window.GLOB.sysType}
|
_param.pro_sys = window.GLOB.systemType === 'production' ? 'Y' : ''
|
|
Api.getSystemConfig(_param).then(result => {
|
if (!result.status) {
|
notification.error({
|
top: 92,
|
message: result.message,
|
duration: 10
|
})
|
return
|
}
|
|
const { menulist, thdMenuList } = this.getMenulist(result)
|
|
let systems = []
|
if ((window.GLOB.sysType === 'local' || window.GLOB.sysType === 'SSO') && result.sys_list) {
|
systems = result.sys_list
|
|
if (window.GLOB.sysType === 'local' && window.GLOB.systemType !== 'production' && systems.length > 10) {
|
systems.length = 10
|
}
|
}
|
|
this.setState({
|
menulist,
|
thdMenuList,
|
systems: systems
|
})
|
|
let mainMenu = menulist[0] || ''
|
let _menu = null
|
|
if (sessionStorage.getItem('ThirdMenu')) { // 是否为打开新页面
|
let ThirdMenuId = sessionStorage.getItem('ThirdMenu')
|
_menu = thdMenuList.filter(item => item.MenuID === ThirdMenuId)[0] // 通过url中menuid筛选出选中的主菜单
|
|
sessionStorage.removeItem('ThirdMenu')
|
}
|
|
window.GLOB.mainMenu = mainMenu
|
|
thdMenuList.forEach(item => {
|
window.GLOB.mkThdMenus.set(item.MenuID, item)
|
})
|
|
window.GLOB.mkThdMenus.set('home_page_id', {MenuID: 'home_page_id', EasyCode: '', MenuName: 'home', type: 'CustomPage'})
|
|
MKEmitter.emit('mainMenuChange')
|
|
if (_menu) {
|
this.openTab(_menu, 0)
|
}
|
|
setTimeout(() => {
|
this.getwork()
|
}, 100)
|
})
|
|
// 获取角色权限, edition_type 接口版本控制 ''、'Y'、'A'
|
setTimeout(() => {
|
Api.getSystemConfig({
|
func: 's_Get_TrdMenu_Role',
|
edition_type: 'A',
|
pro_sys: window.GLOB.systemType === 'production' ? 'Y' : ''
|
}).then(result => {
|
let _permAction = {loaded: true} // 按钮权限
|
|
if (result.status) {
|
if (result.UserRoles_Menu) {
|
result.UserRoles_Menu.forEach(menu => {
|
if (!menu.MenuID) return
|
_permAction[menu.MenuID] = true
|
})
|
}
|
} else if (!/PRIMARY KEY/ig.test(result.message)) {
|
notification.error({
|
top: 92,
|
message: result.message,
|
duration: 10
|
})
|
}
|
|
window.GLOB.mkActions = _permAction
|
})
|
}, 50)
|
}
|
|
getwork = () => {
|
if (sessionStorage.getItem('work_grade')) return
|
|
let param = {func: 's_get_local_my_worker_v1'}
|
|
if (window.GLOB.forcedUpdate) {
|
param.s_version_up = 'true'
|
}
|
|
Api.genericInterface(param).then(result => {
|
sessionStorage.setItem('work_grade', result.work_grade || 0)
|
sessionStorage.setItem('work_group', result.work_group || '')
|
|
if (!result.status && sessionStorage.getItem('debug') === 'true') {
|
notification.error({
|
top: 92,
|
message: /s_get_local_my_worker_v1/.test(result.message) ? '职员信息获取失败，请联系管理员。' : result.message,
|
duration: 10
|
})
|
}
|
})
|
}
|
|
openTab = (menu, times) => {
|
if (times > 50) return
|
times++
|
|
let tabgroup = document.getElementById('mk-tabgroup-wrap')
|
|
if (window.GLOB.mkActions.loaded && tabgroup) {
|
MKEmitter.emit('modifyTabs', menu)
|
} else {
|
setTimeout(() => {
|
this.openTab(menu, times)
|
}, 200)
|
}
|
}
|
|
getMenulist = (result) => {
|
let thdMenuList = []
|
let menulist = []
|
let names = new Map()
|
let doublenames = new Map()
|
result.fst_menu && result.fst_menu.forEach(fst => {
|
let fstItem = {
|
MenuID: fst.MenuID,
|
MenuName: fst.MenuName,
|
OpenType: 'menu',
|
children: []
|
}
|
if (fst.PageParam) {
|
try {
|
let PageParam = JSON.parse(fst.PageParam)
|
|
if (PageParam.OpenType === 'outpage' && PageParam.linkUrl) {
|
fstItem.OpenType = 'newpage'
|
fstItem.src = window.GLOB.systemType === 'production' && PageParam.linkProUrl ? PageParam.linkProUrl : PageParam.linkUrl
|
fstItem.src = fstItem.src.replace(/@loginuid@/ig, sessionStorage.getItem('LoginUID'))
|
fstItem.src = fstItem.src.replace(/@userid@/ig, sessionStorage.getItem('UserID'))
|
if (/#\/iframe\//.test(fstItem.src)) {
|
fstItem.type = 'iframe'
|
fstItem.OpenType = 'newtab'
|
}
|
}
|
} catch (e) {}
|
}
|
|
if (fst.snd_menu) {
|
fstItem.children = fst.snd_menu.map(snd => {
|
let sndItem = {
|
ParentId: fst.MenuID,
|
MenuID: snd.MenuID,
|
MenuName: snd.MenuName,
|
Icon: 'folder',
|
children: []
|
}
|
|
if (snd.PageParam) {
|
try {
|
let PageParam = JSON.parse(snd.PageParam)
|
|
sndItem.Icon = PageParam.Icon || 'folder'
|
} catch (e) {}
|
}
|
|
if (snd.trd_menu) {
|
sndItem.children = snd.trd_menu.map(trd => {
|
let trdItem = {
|
FstId: fst.MenuID,
|
ParentId: snd.MenuID,
|
MenuID: trd.MenuID,
|
MenuName: trd.MenuName,
|
menu_name: trd.MenuName,
|
ParentNames: [fst.MenuName, snd.MenuName],
|
MenuNo: trd.MenuNo,
|
EasyCode: trd.EasyCode,
|
type: 'CustomPage',
|
OpenType: 'newtab',
|
hidden: 'false'
|
}
|
|
if (trd.PageParam) {
|
try {
|
let PageParam = JSON.parse(trd.PageParam)
|
|
trdItem.type = PageParam.Template || 'CustomPage'
|
trdItem.OpenType = PageParam.OpenType || 'newtab'
|
trdItem.hidden = PageParam.hidden || 'false'
|
trdItem.menuColor = PageParam.menuColor || ''
|
trdItem.urlFields = PageParam.urlFields || ''
|
|
if (trdItem.type === 'NewPage') {
|
trdItem.OpenType = 'newpage'
|
trdItem.src = window.GLOB.systemType === 'production' && PageParam.proUrl ? PageParam.proUrl : PageParam.url || ''
|
trdItem.src = trdItem.src.replace(/@loginuid@/ig, sessionStorage.getItem('LoginUID'))
|
trdItem.src = trdItem.src.replace(/@userid@/ig, sessionStorage.getItem('UserID'))
|
if (/#\/iframe\//.test(trdItem.src)) {
|
trdItem.type = 'iframe'
|
trdItem.OpenType = 'newtab'
|
}
|
} else if (trdItem.OpenType === 'view') {
|
trdItem.OpenType = 'newpage'
|
trdItem.src = '#/view/' + trd.MenuID
|
} else {
|
trdItem.src = '#/tab/' + trd.MenuID
|
}
|
} catch (e) {}
|
} else {
|
trdItem.src = '#/tab/' + trd.MenuID
|
}
|
|
if (names.has(trdItem.menu_name)) {
|
doublenames.set(trdItem.menu_name, true)
|
} else {
|
names.set(trdItem.menu_name, true)
|
}
|
|
thdMenuList.push(trdItem)
|
|
return trdItem
|
})
|
}
|
|
sndItem.children = sndItem.children.filter(item => item.hidden !== 'true')
|
|
return sndItem
|
})
|
}
|
|
menulist.push(fstItem)
|
})
|
|
thdMenuList = thdMenuList.map(item => {
|
if (doublenames.has(item.menu_name)) {
|
item.menu_name += '（' + item.ParentNames.join('-') + '）'
|
}
|
return item
|
})
|
|
return { menulist, thdMenuList }
|
}
|
|
changeEditState = () => {
|
// 修改编辑状态
|
let UserID = sessionStorage.getItem('CloudUserID')
|
let LoginUID = sessionStorage.getItem('CloudLoginUID')
|
|
if (!UserID || !LoginUID) {
|
this.setState({
|
loginVisible: true
|
})
|
} else {
|
window.GLOB.mainMenu = null
|
this.props.history.replace('/design')
|
}
|
}
|
|
loginSubmit = () => {
|
if (!this.loginRef) return
|
|
this.setState({
|
loginLoading: true
|
})
|
|
this.loginRef.handleConfirm().then(param => {
|
Api.getusermsg(param.username, param.password, true).then(res => {
|
if (res.status) {
|
this.setState({
|
loginLoading: false
|
})
|
|
if (res.modifydate) {
|
let s = (new Date().getTime() - new Date(res.modifydate).getTime()) / (1000 * 24 * 60 * 60)
|
if (!isNaN(s) && s > 90) {
|
Modal.warning({
|
width: 520,
|
title: <span>系统检测到您的账户存在风险，请及时到<a target="_blank" rel="noopener noreferrer" href="https://cloud.mk9h.cn/admin/index.html">云中心</a>修改密码！</span>,
|
okText: '知道了'
|
})
|
return
|
}
|
}
|
|
sessionStorage.setItem('CloudUserID', res.UserID)
|
sessionStorage.setItem('CloudLoginUID', res.LoginUID)
|
sessionStorage.setItem('CloudUserName', res.UserName)
|
sessionStorage.setItem('CloudFullName', res.FullName)
|
sessionStorage.setItem('CloudAvatar', res.icon)
|
sessionStorage.setItem('cloudDataM', res.dataM ? 'true' : '')
|
sessionStorage.setItem('cloudRole_id', res.role_id || '')
|
|
sessionStorage.setItem('CloudLogo', res.open_logo || '')
|
|
if (param.remember) {
|
localStorage.setItem(window.GLOB.sysSign + 'cloud', window.btoa(window.encodeURIComponent(JSON.stringify({time: new Date().getTime(), username: param.username, password: param.password}))))
|
} else {
|
localStorage.setItem(window.GLOB.sysSign + 'cloud', window.btoa(window.encodeURIComponent(JSON.stringify({time: new Date().getTime(), username: param.username, password: ''}))))
|
}
|
|
window.GLOB.mainMenu = null
|
|
this.props.history.replace('/design')
|
} else {
|
if (res.message.indexOf('密码错误') > -1) {
|
const input = document.getElementById('password')
|
input && input.select()
|
}
|
this.setState({
|
loginLoading: false
|
})
|
notification.error({
|
top: 92,
|
message: res.message,
|
duration: 10
|
})
|
}
|
})
|
})
|
}
|
|
changeSystem = (system) => {
|
let url = system.LinkUrl1
|
|
if (!url) {
|
notification.warning({
|
top: 92,
|
message: '系统地址不存在！',
|
duration: 5
|
})
|
return
|
} else if (/index\.html/ig.test(url)) {
|
url = url.replace(/index\.html.*/ig, '')
|
} else if (!/\/$/ig.test(url)) {
|
url = url + '/'
|
}
|
|
let key = Utils.getuuid()
|
|
let _param = {
|
func: 'webapi_scan_binding_key',
|
binding_type: 'mk',
|
scan_type: 'toggle',
|
scan_appkey: system.scan_appkey,
|
id: key
|
}
|
|
Api.getSystemConfig(_param).then(res => {
|
if (!res.status) {
|
notification.warning({
|
top: 92,
|
message: res.message,
|
duration: 5
|
})
|
} else if (res.thd_party_appid && res.thd_party_member_id && res.thd_party_openid) {
|
let href = url + 'admin/index.html#/ssologin/' + window.btoa(window.encodeURIComponent(JSON.stringify({
|
appid: res.thd_party_appid,
|
memberId: res.thd_party_member_id,
|
openid: res.thd_party_openid,
|
key: key
|
})))
|
|
window.open(href)
|
} else {
|
notification.warning({
|
top: 92,
|
message: '信息缺失，请联系管理员！',
|
duration: 5
|
})
|
}
|
})
|
}
|
|
dropdownMenuChange = (visible) => {
|
this.setState({searchkey: ''}, () => {
|
if (visible) {
|
setTimeout(() => {
|
let input = document.getElementById('thdMenu-search')
|
input && input.focus()
|
}, 500)
|
}
|
})
|
}
|
|
gotoDoc = () => {
|
if (window.GLOB.sysType === 'local' && window.GLOB.mainSystemApi) {
|
let ssodomain = window.GLOB.mainSystemApi.replace('/webapi/dostars', '')
|
let url = `${ssodomain}/doc/index.html#?appkey=${window.GLOB.appkey}&LoginUID=${sessionStorage.getItem('LoginUID')}`
|
window.open(url)
|
} else if (window.GLOB.sysType === 'SSO' || window.GLOB.sysType === 'cloud') {
|
window.open(`${window.location.href.replace(/\/admin(.*)|\/index.html(.*)|\/#(.*)/ig, '')}/doc/index.html#?appkey=${window.GLOB.appkey}&LoginUID=${sessionStorage.getItem('LoginUID')}`)
|
}
|
}
|
|
changeVerMenu(menu, type) {
|
if (type === 'first') {
|
if (menu.OpenType === 'newpage') {
|
window.open(menu.src)
|
} else if (menu.OpenType === 'newtab') {
|
MKEmitter.emit('modifyTabs', menu)
|
}
|
} else {
|
if (menu.OpenType === 'newpage') {
|
window.open(menu.src)
|
} else {
|
MKEmitter.emit('modifyTabs', menu)
|
}
|
|
if (window.GLOB.systemType === 'production') {
|
MKEmitter.emit('queryTrigger', {menuId: menu.MenuID, name: '菜单'})
|
}
|
}
|
}
|
|
verup = () => {
|
const { dict } = this.state
|
|
confirm({
|
title: dict['page_upd'] || '页面更新',
|
content: dict['reload_app'] || '重新加载应用信息',
|
okText: dict['ok'] || '确定',
|
cancelText: dict['cancel'] || '取消',
|
onOk() {
|
return new Promise(resolve => {
|
if (!window.GLOB.IndexDB) {
|
notification.warning({
|
top: 92,
|
message: dict['exc_fail'] || '更新失败，请刷新页面重试！',
|
duration: 2
|
})
|
resolve()
|
} else {
|
Api.updateAppVersion()
|
Api.delCacheConfig('all')
|
localStorage.removeItem(window.location.href.split('#')[0] + 'AuthCode')
|
|
setTimeout(() => {
|
notification.success({
|
top: 92,
|
message: dict['exc_success'] || '更新成功！',
|
duration: 2
|
})
|
resolve()
|
}, 1000)
|
}
|
})
|
},
|
onCancel() {}
|
})
|
}
|
|
about = () => {
|
Modal.success({
|
title: (window.GLOB.dict['sys_ver'] || '系统版本') + ' v' + window.GLOB.appVersion,
|
okText: window.GLOB.dict['got_it'] || '知道了',
|
})
|
}
|
|
changeToHome = () => {
|
if (!['linkage', 'menu_board'].includes(window.GLOB.navBar)) return
|
|
MKEmitter.emit('modifyTabs', {MenuID: 'home_page_id', EasyCode: '', MenuName: 'home', type: 'CustomPage'})
|
}
|
|
render () {
|
const { thdMenuList, searchkey, debug, menulist, collapse, dict } = this.state
|
const navBar = window.GLOB.navBar
|
|
const menu = (
|
<Menu className="header-dropdown">
|
{debug && <Menu.Item key="switch">
|
{dict['edit'] || '编辑'}
|
<Switch size="small" style={{marginLeft: '7px'}} checked={false} onChange={this.changeEditState} />
|
</Menu.Item>}
|
<Menu.Item key="password" onClick={this.changePassword}>{dict['ch_pwd'] || '修改密码'}</Menu.Item>
|
{this.state.systems.length ? <Menu.SubMenu style={{minWidth: '110px'}} title={dict['swt_sys'] || '切换系统'}>
|
{this.state.systems.map((system, index) => (
|
<Menu.Item style={{minWidth: '100px', lineHeight: '30px'}} key={'sub' + index} onClick={() => {this.changeSystem(system)}}> {system.AppName} </Menu.Item>
|
))}
|
</Menu.SubMenu> : null}
|
<Menu.Item key="doc" onClick={this.gotoDoc}>{dict['doc_center'] || '文档中心'}</Menu.Item>
|
<Menu.Item key="verup" onClick={this.verup}>
|
{dict['page_upd'] || '页面更新'}
|
</Menu.Item>
|
{window.GLOB.WXNotice ? <Menu.Item key="wxnotice" onClick={() => this.setState({wxVisible: true, wxStep: 1})}>
|
微信消息
|
</Menu.Item> : null}
|
{window.GLOB.appVersion ? <Menu.Item key="version" onClick={this.about}>
|
{dict['about'] || '关于'}
|
</Menu.Item> : null}
|
<Menu.Item key="logout" onClick={this.logout}>{dict['logout'] || '退出'}</Menu.Item>
|
</Menu>
|
)
|
|
return (
|
<header className="header-container ant-menu-dark" id="main-header-container">
|
{navBar === 'shutter' ?
|
<div className={'header-logo ' + (collapse ? 'collapse' : '')}><img src={this.state.logourl} alt=""/></div> :
|
<div className="header-logo" onClick={this.changeToHome}><img src={this.state.logourl} alt=""/></div>}
|
{navBar === 'shutter' ? <div className={'header-collapse ' + (collapse ? 'collapse' : '')}>
|
{collapse ? <MenuUnfoldOutlined onClick={this.handleCollapse}/> : <MenuFoldOutlined onClick={this.handleCollapse}/>}
|
</div> : <div style={{width: '20px', height: '45px'}}></div>}
|
{/* 正常菜单 */}
|
{navBar === 'shutter' && menulist ?
|
<ul className="header-menu">{
|
menulist.map(item => {
|
return (
|
<li key={item.MenuID} onClick={() => {this.changeMenu(item)}} className={window.GLOB.mainMenu && window.GLOB.mainMenu.MenuID === item.MenuID ? 'active' : ''}>
|
<span>{item.MenuName}</span>
|
</li>
|
)
|
})}
|
</ul> : null
|
}
|
{(navBar === 'linkage' || navBar === 'linkage_navigation') && menulist ?
|
<ul className="header-menu vertical-menu">{
|
menulist.map(item => {
|
if (item.children && item.children.length > 0) {
|
return (
|
<Dropdown key={item.MenuID} overlayClassName="vertical-dropdown-menu" overlay={
|
<Menu mode="vertical">
|
{item.children.map(cell => {
|
if (!cell.children || cell.children.length === 0) {
|
return (
|
<Menu.Item key={cell.MenuID}>
|
{cell.MenuName}
|
</Menu.Item>
|
)
|
} else {
|
return (
|
<Menu.SubMenu popupClassName="vertical-dropdown-submenu" key={cell.MenuID} title={cell.MenuName}>
|
{cell.children.map(m => (
|
<Menu.Item key={m.MenuID} onClick={() => {this.changeVerMenu(m)}}>
|
{m.MenuName}
|
</Menu.Item>
|
))}
|
</Menu.SubMenu>
|
)
|
}
|
})}
|
</Menu>
|
}>
|
<li>
|
<span>{item.MenuName}</span>
|
</li>
|
</Dropdown>
|
)
|
} else {
|
return (
|
<li key={item.MenuID} onClick={() => {this.changeVerMenu(item, 'first')}}>
|
<span>{item.MenuName}</span>
|
</li>
|
)
|
}
|
})}
|
</ul> : null
|
}
|
{(navBar === 'menu_board' || navBar === 'menu_board_navigation') && menulist ?
|
<ul className="header-menu vertical-menu">{
|
menulist.map(item => {
|
if (item.children && item.children.length > 0) {
|
return (
|
<Dropdown key={item.MenuID} placement="bottomCenter" overlayClassName="vertical-dropdown-menu" overlay={
|
<div className="menu-board">
|
{item.children.map(cell => {
|
return (
|
<div className="menu-wrap" key={cell.MenuID}>
|
<div className="title" onClick={e => e.stopPropagation()}>{cell.MenuName}</div>
|
<div className="menu-detail">
|
{cell.children && cell.children.map(m => (
|
<div key={m.MenuID} title={m.MenuName} style={m.menuColor ? {color: m.menuColor} : null} onClick={() => {this.changeVerMenu(m)}}>
|
{m.MenuName}
|
</div>
|
))}
|
</div>
|
</div>
|
)
|
})}
|
</div>
|
}>
|
<li>
|
<span>{item.MenuName}</span>
|
</li>
|
</Dropdown>
|
)
|
} else {
|
return (
|
<li key={item.MenuID} onClick={() => {this.changeVerMenu(item, 'first')}}>
|
<span>{item.MenuName}</span>
|
</li>
|
)
|
}
|
})}
|
</ul> : null
|
}
|
{!menulist ?
|
<div className="header-menu"></div> : null
|
}
|
{/* 菜单搜索 */}
|
{thdMenuList.length > 0 ?
|
<Dropdown overlayClassName="menu-select-dropdown" getPopupContainer={() => document.getElementById('main-header-container')} overlay={
|
<div>
|
<Search
|
placeholder=""
|
id="thdMenu-search"
|
value={searchkey}
|
onChange={e => this.setState({searchkey: e.target.value})}
|
style={{ minWidth: '200px' }}
|
onSearch={(val, e) => {e.stopPropagation()}}
|
onClick={(e) => {e.stopPropagation()}}
|
/>
|
<div className="menu-select-box">
|
<Menu>
|
{thdMenuList.map(option => {
|
if (searchkey) {
|
if (
|
option.MenuName.toLowerCase().indexOf(searchkey.toLowerCase()) >= 0 ||
|
option.MenuNo.toLowerCase().indexOf(searchkey.toLowerCase()) >= 0 ||
|
option.EasyCode.toLowerCase().indexOf(searchkey.toLowerCase()) >= 0
|
) {
|
return <Menu.Item key={option.MenuID} onClick={() => this.changeVerMenu(option)}>{option.menu_name}</Menu.Item>
|
} else {
|
return null
|
}
|
}
|
return <Menu.Item key={option.MenuID} onClick={() => this.changeVerMenu(option)}>{option.menu_name}</Menu.Item>
|
})}
|
</Menu>
|
</div>
|
</div>
|
} trigger={['click']} className="search-menu" placement="bottomRight" onVisibleChange={this.dropdownMenuChange}>
|
<SearchOutlined className="search-menu" />
|
</Dropdown> : null
|
}
|
{window.GLOB.SysNotice ? <SysIcon /> : null}
|
{/* 头像、用户名 */}
|
<Dropdown className="header-setting" overlay={menu}>
|
<div>
|
<img src={this.state.avatar || avatar} alt=""/>
|
<span>
|
<span className="username"><span>{this.state.fullName}</span>{this.state.userName ? <span>{this.state.userName}</span> : null}</span> <DownOutlined />
|
</span>
|
</div>
|
</Dropdown>
|
{/* 编辑状态登录 */}
|
<Modal
|
title={<span>登录开发机{this.state.lang === 'en-US' ? <span style={{color: 'red'}}>（英文）</span> : ''}</span>}
|
visible={this.state.loginVisible}
|
onOk={this.loginSubmit}
|
width={'430px'}
|
confirmLoading={this.state.loginLoading}
|
onCancel={() => {this.setState({ loginVisible: false, loginLoading: false })}}
|
destroyOnClose
|
>
|
<LoginForm handleSubmit={() => this.loginSubmit()} wrappedComponentRef={(inst) => this.loginRef = inst}/>
|
</Modal>
|
{/* 修改密码 */}
|
<Resetpwd />
|
{/* 微信消息 */}
|
<Modal
|
wrapClassName="mk-wx-sms-modal"
|
visible={this.state.wxVisible}
|
title="扫码关注 接收消息"
|
width={400}
|
centered={true}
|
onCancel={() => this.setState({wxVisible: false})}
|
footer={null}
|
destroyOnClose
|
>
|
{this.state.wxStep !== 2 ? <div className="wx-sms-wrap">
|
<img className="mk-img" src={mkpublic} alt=""/>
|
<div className="mk-tip">
|
<span>微信扫码</span>
|
<span>关注公众号</span>
|
<span>关注公众号且授权后方可接收消息。</span>
|
<span onClick={() => this.setState({wxStep: 2})}>下一步</span>
|
</div>
|
</div> : <div className="wx-sms-wrap">
|
<QrCode card={{qrWidth: 200, color: '#000000'}} value={window.GLOB.baseurl + 'mob/wxnotice.html?userid=' + sessionStorage.getItem('UserID') + '&loginuid=' + sessionStorage.getItem('LoginUID')}/>
|
<div className="tip">
|
<img src={wxicon} alt=""/>
|
<span>微信扫码</span>
|
<span>获取用户授权</span>
|
</div>
|
</div>}
|
</Modal>
|
</header>
|
)
|
}
|
}
|
|
export default withRouter(Header)
|
