From c98e45bfac25e9110ad0383faac54a54d98ea9d5 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期四, 18 十一月 2021 20:47:04 +0800 Subject: [PATCH] 2021-11-18 --- src/components/header/index.jsx | 866 +++++++++++++++++++++++++++++++++++++++++++++++++++------ 1 files changed, 770 insertions(+), 96 deletions(-) diff --git a/src/components/header/index.jsx b/src/components/header/index.jsx index d4204be..952e442 100644 --- a/src/components/header/index.jsx +++ b/src/components/header/index.jsx @@ -3,37 +3,58 @@ import PropTypes from 'prop-types' import {connect} from 'react-redux' import { is, fromJS } from 'immutable' -import {Dropdown, Menu, Icon, Modal, message, Form } from 'antd' -import md5 from 'md5' -import {toggleCollapse, modifyMainMenu, resetState} from '@/store/action' -import Resetpwd from '@/components/resetpwd' +import moment from 'moment' +import { Dropdown, Menu, Icon, Modal, Form, notification, Switch, Input } from 'antd' + +import { + toggleCollapse, + modifyMainMenu, + initActionPermission, + initMenuPermission, + logout +} from '@/store/action' +import asyncComponent from '@/utils/asyncComponent' import Api from '@/api' -import zhCN from '@/locales/zh-CN/header.js' -import enUS from '@/locales/en-US/header.js' -import logourl from '../../assets/img/mlogo.png' -import avatar from '../../assets/img/avatar.jpg' +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, - mainMenu: PropTypes.oneOfType([ - PropTypes.string, - PropTypes.object - ]) + collapse: PropTypes.bool } state = { - menulist: null, - visible: false, - dict: (!sessionStorage.getItem('lang') || sessionStorage.getItem('lang') === 'zh-CN') ? zhCN : enUS, - confirmLoading: false + menulist: null, // 涓�绾ц彍鍗� + visible: false, // 淇敼瀵嗙爜妯℃�佹 + dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, + confirmLoading: false, + userName: sessionStorage.getItem('User_Name'), + 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', + navBar: ['linkage_navigation', 'linkage', 'menu_board', 'menu_board_navigation'].includes(window.GLOB.navBar) ? 'topmenu' : '', + menuType: window.GLOB.navBar } handleCollapse = () => { // 灞曞紑銆佹敹璧峰乏渚ц彍鍗曟爮 this.props.toggleCollapse(!this.props.collapse) + localStorage.setItem('collapse', !this.props.collapse) } changePassword = () => { @@ -43,39 +64,47 @@ }) } - md5Password (pwd) { - // md5瀵嗙爜鍔犲瘑 - const salt = 'minkesoft' - return md5(md5(pwd + salt)) - } - resetPwdSubmit = () => { this.formRef.handleConfirm().then(res => { this.setState({ confirmLoading: true }) - this.resetPwdSubmitexec(res) - }, () => {}) - } - async resetPwdSubmitexec (param) { - // 閲嶇疆瀵嗙爜鎻愪氦锛屽叧闂ā鎬佹锛屾竻绌鸿〃鍗曟暟鎹� - let password = this.md5Password(param.originpwd) - let newpassword = this.md5Password(param.password) - let result = await Api.resetpassword(password, newpassword) - if (result.status) { - this.setState({ - visible: false, - confirmLoading: false + 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) // 鍏抽敭瀛楃鏇挎崲锛宐ase64鍔犲瘑 + _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 + }) + } }) - this.formRef.resetfrom() - message.success(this.state.dict['header.password.resetsuccess']) - } else { - message.warning(result.message) - this.setState({ - confirmLoading: false - }) - } + }, () => {}) } handleCancel = () => { @@ -83,28 +112,18 @@ this.setState({ visible: false }) - this.formRef.resetfrom() } logout = () => { // 閫�鍑虹櫥褰� let _this = this confirm({ - title: this.state.dict['header.logout.hint'], + title: this.state.dict['main.logout.hint'], content: '', - okText: this.state.dict['header.confirm'], - cancelText: this.state.dict['header.cancel'], onOk() { - return Api.logoutsystem().then(res => { - if (res.status) { - sessionStorage.removeItem('UserID') - sessionStorage.removeItem('lang') - _this.props.resetState() - _this.props.history.replace('/login') - } else { - message.warning(res.message) - } - }) + sessionStorage.clear() + _this.props.logout() + _this.props.history.replace('/login') }, onCancel() {} }) @@ -112,79 +131,732 @@ changeMenu (value) { // 涓昏彍鍗曞垏鎹� - this.props.modifyMainMenu(value) + if (value.OpenType === 'outpage' && value.linkUrl) { + window.open(value.linkUrl) + } else if (value.OpenType === 'menu') { + this.props.modifyMainMenu(value) + } } - async loadmenu () { - // 鑾峰彇涓昏彍鍗� - let result = await Api.getMainMenuData() - if (result.status) { - this.setState({ - menulist: result.data.map((menu, index) => { // 澧炲姞绱㈠紩锛岀敤浜庢墦寮�鏂伴〉闈㈡椂鏌ヨ鑿滃崟 - menu.index = index - return menu + getRolesMenu () { + // 鑾峰彇瑙掕壊鏉冮檺 + let roledefer = new Promise(resolve => { + // 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 && result.status) { + if (result.UserRoles_Menu) { + result.UserRoles_Menu.forEach(menu => { + if (!menu.MenuID) return + _permAction[menu.MenuID] = true + }) + } + } else if (result) { + notification.error({ + top: 92, + message: result.message, + duration: 10 + }) + } + + this.props.initActionPermission(_permAction) + resolve() }) + }, 50) + }) + + // 鑾峰彇涓昏彍鍗曞弬鏁� + let menudefer = new Promise(resolve => { + 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) + + this.setState({ + menulist, + thdMenuList, + systems: window.GLOB.systemType === 'production' || options.sysType === 'SSO' ? (result.sys_list || []) : [] + }) + + let mainMenu = menulist[0] || '' + let _menu = null + + if (mainMenu === '') { // 鏄惁鏄剧ず渚ц竟鏍忔帶鍒� + let _url = window.location.href.split('#')[0] + localStorage.setItem(_url + '-sideHidden', 'true') + } else { + let _url = window.location.href.split('#')[0] + localStorage.removeItem(_url + '-sideHidden') + } + + if (sessionStorage.getItem('ThirdMenu')) { // 鏄惁涓烘墦寮�鏂伴〉闈� + let ThirdMenuId = sessionStorage.getItem('ThirdMenu') + _menu = thdMenuList.filter(item => item.MenuID === ThirdMenuId)[0] // 閫氳繃url涓璵enuid绛涢�夊嚭閫変腑鐨勪富鑿滃崟 + + if (_menu) { + mainMenu = menulist.filter(item => item.MenuID === _menu.FstId)[0] + mainMenu = fromJS(mainMenu).toJS() + mainMenu.openId = _menu.ParentId + } + + sessionStorage.removeItem('ThirdMenu') + } + + this.props.modifyMainMenu(mainMenu) + this.props.initMenuPermission([...thdMenuList, {MenuID: 'home_page_id', EasyCode: '', MenuName: 'home', type: 'CustomPage'}]) + + resolve(_menu) }) - let param = sessionStorage.getItem('view_param') // 鏄惁涓烘墦寮�鏂伴〉闈� - if (param) { - let i = parseInt(param.split('&')[0]) - this.props.modifyMainMenu(result.data[i] || result.data[0]) - } else { - this.props.modifyMainMenu(result.data[0]) + }) + + Promise.all([roledefer, menudefer]).then(response => { + if (response[1]) { + let menu = fromJS(response[1]).toJS() + + if (this.state.navBar === 'topmenu' && this.state.menuType !== 'menu_board_navigation') { + MKEmitter.emit('modifyTabs', menu, 'replace') + } else { + MKEmitter.emit('modifyTabs', menu, 'plus') + } } + }) + } + + getMenulist = (result) => { + let thdMenuList = [] + let iframes = ['Main/Index', 'bda/rdt', 'Home/rdt'] + let menulist = [] + result.fst_menu && result.fst_menu.forEach(fst => { + let fstItem = { + MenuID: fst.MenuID, + MenuName: fst.MenuName, + OpenType: 'menu', + children: [] + } + if (fst.PageParam) { + try { + fstItem.PageParam = JSON.parse(fst.PageParam) + } catch (e) { + fstItem.PageParam = null + } + if (fstItem.PageParam && fstItem.PageParam.OpenType === 'outpage' && fstItem.PageParam.linkUrl) { + fstItem.OpenType = 'outpage' + fstItem.linkUrl = fstItem.PageParam.linkUrl + } + } + + if (fst.snd_menu) { + fstItem.children = fst.snd_menu.map(snd => { + let sndItem = { + ParentId: fst.MenuID, + MenuID: snd.MenuID, + MenuName: snd.MenuName, + PageParam: {Icon: 'folder'}, + children: [] + } + + if (snd.PageParam) { + try { + sndItem.PageParam = JSON.parse(snd.PageParam) + } catch (e) { + sndItem.PageParam = {Icon: 'folder'} + } + } + + let msg = { + UserID: sessionStorage.getItem('UserID'), + LoginUID: sessionStorage.getItem('LoginUID'), + User_Name: sessionStorage.getItem('User_Name'), + Full_Name: sessionStorage.getItem('Full_Name'), + Member_Level: sessionStorage.getItem('Member_Level'), + dataM: sessionStorage.getItem('dataM'), + avatar: sessionStorage.getItem('avatar'), + debug: sessionStorage.getItem('debug'), + role_id: sessionStorage.getItem('role_id'), + mainlogo: window.GLOB.mainlogo, + navBar: window.GLOB.navBar || '', + mstyle: window.GLOB.style + } + + 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, + ParentNames: [fst.MenuName, snd.MenuName], + MenuNo: trd.MenuNo, + EasyCode: trd.EasyCode, + type: 'CommonTable', + OpenType: 'newtab', + hidden: 'false' + } + + if (trd.LinkUrl && iframes.includes(trd.LinkUrl.split('?')[0])) { + trdItem.type = 'iframe' + trdItem.LinkUrl = trd.LinkUrl.replace('&', '&') + } else { + try { + trdItem.PageParam = trd.PageParam ? JSON.parse(trd.PageParam) : {OpenType: 'newtab'} + } catch (e) { + trdItem.PageParam = {OpenType: 'newtab'} + } + + trdItem.type = trdItem.PageParam.Template || trdItem.type + trdItem.OpenType = trdItem.PageParam.OpenType || trdItem.OpenType + trdItem.hidden = trdItem.PageParam.hidden || trdItem.hidden + + if (trdItem.type === 'NewPage') { + trdItem.src = trdItem.PageParam.url || '' + + if (trdItem.src.indexOf('paramsmain/') > -1) { + try { + let _url = trdItem.src.split('paramsmain/')[0] + 'paramsmain/' + let _param = JSON.parse(window.decodeURIComponent(window.atob(trdItem.src.split('paramsmain/')[1]))) + _param.UserID = sessionStorage.getItem('UserID') + _param.LoginUID = sessionStorage.getItem('LoginUID') + _param.User_Name = sessionStorage.getItem('User_Name') + _param.Full_Name = sessionStorage.getItem('Full_Name') + + trdItem.src = _url + window.btoa(window.encodeURIComponent(JSON.stringify(_param))) + } catch (e) { + console.warn('鑿滃崟鍙傛暟瑙f瀽閿欒锛�') + } + } + } else { + // 鎵撳紑鏂伴〉闈㈤摼鎺� + trdItem.src = '#/paramsmain/' + window.btoa(window.encodeURIComponent(JSON.stringify({ + ...msg, + ThirdMenu: trd.MenuID + }))) + } + } + + thdMenuList.push(trdItem) + + return trdItem + }) + } + + sndItem.children = sndItem.children.filter(item => item.hidden !== 'true') + + return sndItem + }) + } + + menulist.push(fstItem) + }) + + 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 = () => { + this.setState({ + loginLoading: true + }) + this.loginRef.handleConfirm().then(param => { + Api.getusermsg(param.username, param.password, true).then(res => { + if (res.status) { + 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') + + this.setSystemFuncs() + 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 + }) + } + }) + }) + } + + setSystemFuncs = () => { + if (!window.GLOB.WebSql && !window.GLOB.IndexDB) { + return + } + this.getfuncTime().then(res => { + Api.getSystemFuncs(res.createDate).then(result => { + if (!result.status) { + notification.error({ + top: 92, + message: result.message, + duration: 10 + }) + return + } else if (result.func_detail && result.func_detail.length > 0) { + this.writeFuncs(result.func_detail) + } + }) + }) + } + + writeFuncs = (funcs) => { + let timestamp = moment().format('YYYY-MM-DD HH:mm:ss') + + let sys_datetime = sessionStorage.getItem('sys_datetime') + let app_datetime = sessionStorage.getItem('app_datetime') + if (sys_datetime && app_datetime) { + let seconds = Math.floor((new Date().getTime() - app_datetime) / 1000) + timestamp = moment(sys_datetime, 'YYYY-MM-DD HH:mm:ss').add(seconds, 'seconds').format('YYYY-MM-DD HH:mm:ss') + } + + if (window.GLOB.WebSql) { + window.GLOB.WebSql.transaction(tx => { + tx.executeSql('DELETE FROM FUNCS') + + funcs.forEach(item => { + if (!item.key_sql) return + tx.executeSql('INSERT INTO FUNCS (func_code, key_sql) VALUES (?, ?)', [item.func_code, item.key_sql]) + }) + tx.executeSql(`UPDATE VERSIONS SET createDate='${timestamp}' where CDefine1='funcs'`) + }) + } else { + let objectStore = window.GLOB.IndexDB.transaction(['funcs'], 'readwrite').objectStore('funcs') + + objectStore.clear() + + funcs.forEach(item => { + if (!item.key_sql) return + item.id = item.func_code + objectStore.add(item) + }) + + let funcStore = window.GLOB.IndexDB.transaction(['version'], 'readwrite').objectStore('version') + funcStore.put({id: 'funcs', version: '1.0', createDate: timestamp}) + } + } + + getfuncTime = () => { + return new Promise((resolve, reject) => { + if (window.GLOB.WebSql) { + window.GLOB.WebSql.transaction(tx => { + tx.executeSql("SELECT * FROM VERSIONS where CDefine1='funcs'", [], (tx, results) => { + let rows = results.rows + if (rows.length === 0) { + tx.executeSql('DELETE FROM FUNCS') + tx.executeSql('INSERT INTO VERSIONS (version, createDate, CDefine1) VALUES (?, ?, ?)', ['1.0', '1970-01-01 14:59:09.000', 'funcs']) + resolve({createDate: '1970-01-01 14:59:09.000'}) + } else { + resolve(rows[0]) + } + }, (tx, results) => { + reject() + console.warn(results) + }) + }) + } else { + let objectStore = window.GLOB.IndexDB.transaction(['version'], 'readwrite').objectStore('version') + let request = objectStore.get('funcs') + + request.onerror = (event) => { + console.warn(event) + reject() + } + + request.onsuccess = () => { + if (request.result) { + resolve(request.result) + } else { + let add = objectStore.add({id: 'funcs', version: '1.0', createDate: '1970-01-01 14:59:09.000'}) + + add.onerror = () => { + reject() + } + add.onsuccess = () => { + resolve({id: 'funcs', version: '1.0', createDate: '1970-01-01 14:59:09.000'}) + } + } + } + } + }) + } + + 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 href = url + 'index.html#/ssologin/' + window.btoa(window.encodeURIComponent(JSON.stringify({ + UserID: sessionStorage.getItem('UserID'), + LoginUID: sessionStorage.getItem('LoginUID'), + User_Name: sessionStorage.getItem('User_Name'), + Full_Name: sessionStorage.getItem('Full_Name'), + avatar: sessionStorage.getItem('avatar'), + dataM: system.dataM ? 'true' : '', + debug: system.debug || '', + role_id: system.role_id || '' + }))) + + window.open(href) + } + + dropdownMenuChange = (visible) => { + this.setState({searchkey: ''}, () => { + if (visible) { + setTimeout(() => { + let input = document.getElementById('thdMenu-search') + input && input.focus() + }, 500) + } + }) } UNSAFE_componentWillMount () { // 缁勪欢鍔犺浇鏃讹紝鑾峰彇鑿滃崟鏁版嵁 - this.loadmenu() + this.getRolesMenu() + } + + componentDidMount () { + // 鑾峰彇绯荤粺鐨勭増鏈俊鎭紝寤舵椂鏌ヨ + setTimeout(() => { + Api.getAppVersion().then(() => {}, () => {}) + }, 1000) } 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(/\/index.html(.*)|\/#(.*)/ig, '')}/doc/index.html#?appkey=${window.GLOB.appkey}&LoginUID=${sessionStorage.getItem('LoginUID')}`) + } + } + + changeVerMenu(menu, type) { + if (type === 'first') { + if (menu.OpenType === 'outpage' && menu.linkUrl) { + window.open(menu.linkUrl) + } else if (menu.OpenType === 'menu') { + + } + } else { + if (menu.OpenType === 'newpage' || menu.OpenType === 'NewPage') { // NewPage涓烘墦寮�澶栭儴椤甸潰鍦板潃锛宯ewpage涓烘墦寮�绯荤粺鑿滃崟 + window.open(menu.src) + } else if (menu.OpenType === 'blank') { + MKEmitter.emit('modifyTabs', menu, 'replace') + } else if (this.state.navBar === 'topmenu' && this.state.menuType !== 'menu_board_navigation') { + MKEmitter.emit('modifyTabs', menu, 'replace') + } else { + MKEmitter.emit('modifyTabs', menu, 'plus') + } + + 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() + setTimeout(() => { + notification.success({ + top: 92, + message: '鏇存柊鎴愬姛锛�', + duration: 2 + }) + resolve() + }, 1000) + } + }) + }, + onCancel() {} + }) + } + + about = () => { + Modal.success({ + title: '绯荤粺鐗堟湰v' + this.state.appVersion + }) + } + render () { + const { mainMenu, collapse } = this.props + const { thdMenuList, searchkey, debug, menulist, navBar, menuType, appVersion } = this.state + const menu = ( <Menu className="header-dropdown"> - <Menu.Item key="1" onClick={this.changePassword}>{this.state.dict['header.password']}</Menu.Item> - <Menu.Item key="2" onClick={this.logout}>{this.state.dict['header.logout']}</Menu.Item> + {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"> - <div className={this.props.collapse ? "collapse header-logo" : "header-logo"}><img src={logourl} alt=""/></div> - <div className={this.props.collapse ? "collapse header-collapse" : "header-collapse"} onClick={this.handleCollapse}> - <Icon type={this.props.collapse ? 'menu-unfold' : 'menu-fold'} /> + <header className="header-container ant-menu-dark" id="main-header-container"> + <div className={'header-logo ' + (collapse && navBar !== 'topmenu' ? 'collapse' : '')}><img src={this.state.logourl} alt=""/></div> + <div className={'header-collapse ' + (collapse && navBar !== 'topmenu' ? 'collapse' : '')}> + {navBar !== 'topmenu' ? <Icon type={collapse ? 'menu-unfold' : 'menu-fold'} onClick={this.handleCollapse}/> : null} </div> - {this.state.menulist && <ul className="header-menu">{ - this.state.menulist.map(item => { - return ( - <li key={item.id} onClick={() => {this.changeMenu(item)}} className={this.props.selectmenu.id === item.id ? 'active' : ''}> - {item.MenuName} - </li> - ) - }) - }</ul>} + {/* 姝e父鑿滃崟 */} + {navBar !== 'topmenu' && 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 === 'topmenu' && menuType !== 'menu_board' && menuType !== '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} 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 === 'topmenu' && (menuType === 'menu_board' || menuType === '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 + } + {/* 澶村儚銆佺敤鎴峰悕 */} <Dropdown className="header-setting" overlay={menu}> <div> - <img src={avatar} alt=""/> + <img src={this.state.avatar || avatar} alt=""/> <span> - admin <Icon type="down" /> + <span className="username">{this.state.userName}</span> <Icon type="down" /> </span> </div> </Dropdown> + {/* 鑿滃崟鎼滅储 */} + {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.MenuName}</Menu.Item> + } else { + return null + } + } + return <Menu.Item key={option.MenuID} onClick={() => this.changeVerMenu(option)}>{option.MenuName}</Menu.Item> + })} + </Menu> + </div> + </div> + } trigger={['click']} className="search-menu" placement="bottomRight" onVisibleChange={this.dropdownMenuChange}> + <Icon className="search-menu" type="search" /> + </Dropdown> : null + } + {/* 淇敼瀵嗙爜 */} <Modal - title={this.state.dict['header.password']} - okText={this.state.dict['header.confirm']} - cancelText={this.state.dict['header.cancel']} + 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> ) @@ -194,15 +866,17 @@ const mapStateToProps = (state) => { return { collapse: state.collapse, - selectmenu: state.selectedMainMenu + mainMenu: state.mainMenu } } const mapDispatchToProps = (dispatch) => { return { toggleCollapse: (collapse) => dispatch(toggleCollapse(collapse)), - modifyMainMenu: (selectmenu) => dispatch(modifyMainMenu(selectmenu)), - resetState: () => dispatch(resetState()) + modifyMainMenu: (mainMenu) => dispatch(modifyMainMenu(mainMenu)), + initActionPermission: (permAction) => dispatch(initActionPermission(permAction)), + initMenuPermission: (permMenus) => dispatch(initMenuPermission(permMenus)), + logout: () => dispatch(logout()) } } -- Gitblit v1.8.0