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 moment from 'moment'
|
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 asyncComponent from '@/utils/asyncSpinComponent'
|
import Api from '@/api'
|
import MKEmitter from '@/utils/events.js'
|
import options from '@/store/options.js'
|
import zhCN from '@/locales/zh-CN/main.js'
|
import enUS from '@/locales/en-US/main.js'
|
import Utils from '@/utils/utils.js'
|
import avatar from '@/assets/img/avatar.jpg'
|
import './index.scss'
|
|
const { confirm } = Modal
|
const { Search } = Input
|
const Resetpwd = asyncComponent(() => import('./resetpwd'))
|
const LoginForm = asyncComponent(() => import('./loginform'))
|
|
class Header extends Component {
|
static propTpyes = {
|
collapse: PropTypes.bool
|
}
|
state = {
|
menulist: null, // 一级菜单
|
visible: false, // 修改密码模态框
|
dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
|
confirmLoading: false,
|
userName: '',
|
fullName: '',
|
logourl: window.GLOB.mainlogo,
|
appVersion: window.GLOB.appVersion,
|
loginVisible: false,
|
loginLoading: false,
|
avatar: Utils.getrealurl(sessionStorage.getItem('avatar')),
|
systems: [],
|
searchkey: '',
|
thdMenuList: [],
|
debug: sessionStorage.getItem('debug') === 'true'
|
}
|
|
handleCollapse = () => {
|
// 展开、收起左侧菜单栏
|
this.props.toggleCollapse(!this.props.collapse)
|
localStorage.setItem('collapse', !this.props.collapse)
|
}
|
|
changePassword = () => {
|
// 点击修改密码，显示弹窗
|
this.setState({
|
visible: true
|
})
|
}
|
|
resetPwdSubmit = () => {
|
if (!this.formRef) return
|
|
this.formRef.handleConfirm().then(res => {
|
this.setState({
|
confirmLoading: true
|
})
|
|
let _param = {
|
func: 's_PwdUpt',
|
LText: `select '${res.originpwd}','${res.password}'`
|
}
|
|
_param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') // 时间戳
|
_param.LText = Utils.formatOptions(_param.LText) // 关键字符替换，base64加密
|
_param.secretkey = Utils.encrypt(_param.LText, _param.timestamp) // md5密钥
|
|
Api.getSystemConfig(_param).then(result => {
|
this.setState({
|
visible: !result.status,
|
confirmLoading: false
|
})
|
|
if (result.status) {
|
notification.success({
|
top: 92,
|
message: '修改成功，请重新登录。',
|
duration: 2
|
})
|
setTimeout(() => {
|
sessionStorage.clear()
|
this.props.logout()
|
this.props.history.replace('/login')
|
}, 2000)
|
} else {
|
notification.warning({
|
top: 92,
|
message: result.message,
|
duration: 5
|
})
|
}
|
})
|
}, () => {})
|
}
|
|
handleCancel = () => {
|
// 取消时关闭修改密码模态框，清空表单数据
|
this.setState({
|
visible: false
|
})
|
}
|
|
logout = () => {
|
// 退出登录
|
let _this = this
|
confirm({
|
title: this.state.dict['main.logout.hint'],
|
content: '',
|
onOk() {
|
sessionStorage.clear()
|
_this.props.logout()
|
_this.props.history.replace('/login')
|
},
|
onCancel() {}
|
})
|
}
|
|
changeMenu (value) {
|
// 主菜单切换
|
if (value.OpenType === 'outpage') {
|
window.open(value.linkUrl)
|
} else if (value.OpenType === 'menu') {
|
this.props.modifyMainMenu(value)
|
}
|
}
|
|
getRolesMenu () {
|
// 获取主菜单参数
|
let _param = {func: 's_get_pc_menus', systemType: options.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 ((options.sysType === 'local' || options.sysType === 'SSO') && result.sys_list) {
|
systems = result.sys_list
|
|
if (options.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')
|
}
|
|
this.props.modifyMainMenu(mainMenu)
|
|
window.GLOB.mkThdMenus = [...thdMenuList, {MenuID: 'home_page_id', EasyCode: '', MenuName: 'home', type: 'CustomPage'}]
|
|
if (_menu) { // 延时打开，防止标签组未完成加载
|
setTimeout(() => {
|
MKEmitter.emit('modifyTabs', _menu)
|
}, 200)
|
}
|
MKEmitter.emit('mkMenuLoaded')
|
})
|
|
// 获取角色权限, 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 {
|
notification.error({
|
top: 92,
|
message: result.message,
|
duration: 10
|
})
|
}
|
|
MKEmitter.emit('mkActionLoaded')
|
window.GLOB.mkActions = _permAction
|
})
|
}, 50)
|
}
|
|
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 = 'outpage'
|
fstItem.linkUrl = PageParam.linkUrl
|
}
|
} 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: 'CommonTable',
|
OpenType: 'newtab',
|
hidden: 'false'
|
}
|
|
if (trd.PageParam) {
|
try {
|
let PageParam = JSON.parse(trd.PageParam)
|
|
trdItem.type = PageParam.Template || 'CommonTable'
|
trdItem.OpenType = PageParam.OpenType || 'newtab'
|
trdItem.hidden = PageParam.hidden || 'false'
|
|
if (trdItem.type === 'NewPage') {
|
trdItem.src = PageParam.url || ''
|
}
|
} catch (e) {}
|
}
|
|
if (trdItem.type !== 'NewPage') {
|
trdItem.src = '#/tab/' + trd.MenuID
|
}
|
|
trdItem.OpenType = trdItem.OpenType.toLowerCase() // NewPage为打开外部页面地址
|
|
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 {
|
sessionStorage.setItem('role_id', sessionStorage.getItem('cloudRole_id'))
|
sessionStorage.setItem('dataM', sessionStorage.getItem('cloudDataM'))
|
sessionStorage.setItem('isEditState', 'true')
|
|
this.props.modifyMainMenu(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('role_id', res.role_id || '')
|
sessionStorage.setItem('dataM', res.dataM ? 'true' : '')
|
sessionStorage.setItem('isEditState', 'true')
|
|
if (param.remember) {
|
let _url = window.location.href.split('#')[0] + 'cloud'
|
|
localStorage.setItem(_url, window.btoa(window.encodeURIComponent(JSON.stringify({time: new Date().getTime(), username: param.username, password: param.password}))))
|
}
|
|
this.props.modifyMainMenu(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)
|
}
|
})
|
}
|
|
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)
|
// Api.genericInterface({
|
// func: 's_get_fcc_account_data',
|
// fcc_date: '2022-03-01',
|
// search_type: ''
|
// }).then(res => {
|
// })
|
|
// sessionStorage 跨页面共享
|
window.addEventListener('storage', (e) => {
|
if (e.key === 'getSessionStorage' && e.newValue === window.GLOB.appkey) {
|
localStorage.setItem('sessionStorage', JSON.stringify(sessionStorage))
|
} else if (e.key === 'menuUpdate') {
|
let menuId = e.newValue.split(',')[1]
|
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 = () => {
|
if (options.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 (options.sysType === 'SSO' || options.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 === 'outpage') {
|
window.open(menu.linkUrl)
|
}
|
} 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 = () => {
|
confirm({
|
title: '页面更新',
|
content: '重新加载应用信息',
|
onOk() {
|
return new Promise(resolve => {
|
if (!window.GLOB.WebSql && !window.GLOB.IndexDB) {
|
notification.warning({
|
top: 92,
|
message: '更新失败，请刷新页面重试！',
|
duration: 2
|
})
|
resolve()
|
} else {
|
Api.updateAppVersion()
|
Api.delCacheConfig('all')
|
setTimeout(() => {
|
notification.success({
|
top: 92,
|
message: '更新成功！',
|
duration: 2
|
})
|
resolve()
|
}, 1000)
|
}
|
})
|
},
|
onCancel() {}
|
})
|
}
|
|
about = () => {
|
Modal.success({
|
title: '系统版本v' + this.state.appVersion
|
})
|
}
|
|
changeToHome = () => {
|
if (!['linkage', 'menu_board'].includes(window.GLOB.navBar)) return
|
|
MKEmitter.emit('modifyTabs', {MenuID: 'home_page_id', EasyCode: '', MenuName: 'home', type: 'CustomPage'})
|
}
|
|
render () {
|
const { mainMenu, collapse } = this.props
|
const { thdMenuList, searchkey, debug, menulist, appVersion } = this.state
|
const navBar = window.GLOB.navBar
|
|
const menu = (
|
<Menu className="header-dropdown">
|
{debug && <Menu.Item key="switch">
|
{this.state.dict['main.edit']}
|
<Switch size="small" style={{marginLeft: '7px'}} checked={false} onChange={this.changeEditState} />
|
</Menu.Item>}
|
<Menu.Item key="password" onClick={this.changePassword}>{this.state.dict['main.password']}</Menu.Item>
|
{this.state.systems.length ? <Menu.SubMenu style={{minWidth: '110px'}} title="切换系统">
|
{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}>{this.state.dict['main.doc']}</Menu.Item>
|
<Menu.Item key="verup" onClick={this.verup}>
|
页面更新
|
</Menu.Item>
|
{appVersion ? <Menu.Item key="version" onClick={this.about}>
|
关于
|
</Menu.Item> : null}
|
<Menu.Item key="logout" onClick={this.logout}>{this.state.dict['main.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={mainMenu && 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} 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
|
}
|
{/* 头像、用户名 */}
|
<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={this.state.dict['main.password']}
|
visible={this.state.visible}
|
onOk={this.resetPwdSubmit}
|
confirmLoading={this.state.confirmLoading}
|
onCancel={this.handleCancel}
|
destroyOnClose
|
>
|
<Resetpwd dict={this.state.dict} wrappedComponentRef={(inst) => this.formRef = inst} resetPwdSubmit={this.resetPwdSubmit}/>
|
</Modal>
|
{/* 编辑状态登录 */}
|
<Modal
|
title={this.state.dict['main.login.develop']}
|
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>
|
</header>
|
)
|
}
|
}
|
|
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))
|
