From cb9ade2afd2a367ad767bc605ab7086c695dd010 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期五, 09 十二月 2022 15:53:32 +0800 Subject: [PATCH] 2022-12-09 --- src/views/design/header/index.jsx | 393 ++++++++++++++++++++++++++++++++++++++------------------ 1 files changed, 266 insertions(+), 127 deletions(-) diff --git a/src/views/design/header/index.jsx b/src/views/design/header/index.jsx index cf022a1..eb9e26a 100644 --- a/src/views/design/header/index.jsx +++ b/src/views/design/header/index.jsx @@ -1,9 +1,9 @@ import React, {Component} from 'react' import { withRouter } from 'react-router-dom' import {connect} from 'react-redux' -import { is, fromJS } from 'immutable' -import { Dropdown, Menu, Modal, notification, Switch, Button } from 'antd' -import { MenuFoldOutlined, EditOutlined, AppstoreOutlined, DownOutlined, HomeOutlined, ApiOutlined } from '@ant-design/icons' +import { Dropdown, Menu, Modal, notification, Switch, Button, Popover } from 'antd' +import { MenuFoldOutlined, SettingOutlined, AppstoreOutlined, DownOutlined, HomeOutlined, ApiOutlined, PlusOutlined, EditOutlined, MenuOutlined, DatabaseOutlined } from '@ant-design/icons' +import moment from 'moment' import asyncComponent from '@/utils/asyncComponent' import { @@ -14,31 +14,33 @@ } from '@/store/action' import Api from '@/api' 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 MainLogo from '@/assets/img/main-logo.png' import MKEmitter from '@/utils/events.js' import './index.scss' -const EditMenu = asyncComponent(() => import('@/templates/menuconfig/editfirstmenu')) +const EditMenu = asyncComponent(() => import('./editfirstmenu')) const VersionsUp = asyncComponent(() => import('./versions')) +const ThawMenu = asyncComponent(() => import('@/components/thawmenu')) +const MenuForm = asyncComponent(() => import('./editfirstmenu/menuform')) const { confirm } = Modal class Header extends Component { state = { menulist: null, // 涓�绾ц彍鍗� - dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, userName: sessionStorage.getItem('CloudUserName'), avatar: Utils.getrealurl(sessionStorage.getItem('CloudAvatar')), + memberLevel: Utils.getMemberLevel(), + visible: false, + loading: false } logout = () => { // 閫�鍑虹櫥褰� let _this = this confirm({ - title: this.state.dict['main.logout.hint'], + title: '鎮ㄧ‘瀹氳閫�鍑哄悧?', content: '', onOk() { sessionStorage.clear() @@ -51,10 +53,6 @@ changeMenu (value) { // 涓昏彍鍗曞垏鎹� - if (this.props.editLevel) { - // 缂栬緫鐘舵�佷笅锛屼笉鍙垏鎹㈣彍鍗� - return - } if (value.PageParam.OpenType === 'menu') { this.props.modifyMainMenu(value) } else if (value.PageParam.OpenType === 'outpage') { @@ -64,8 +62,12 @@ async loadmenu () { // 鑾峰彇涓昏彍鍗� - let _param = {func: 's_get_pc_menus', systemType: options.sysType, debug: 'Y'} - _param.pro_sys = window.GLOB.systemType === 'production' ? 'Y' : '' + let _param = { + func: 's_get_pc_menus', + systemType: options.sysType, + pro_sys: window.GLOB.systemType === 'production' ? 'Y' : '', + debug: 'Y' + } let result = await Api.getSystemConfig(_param) @@ -77,10 +79,21 @@ this.setState({ menulist }) - this.props.modifyMenuTree(menulist) - if (window.GLOB.systemType !== 'production') { // 闈炴寮忕郴缁熼�夋嫨绗竴椤� - this.props.modifyMainMenu(menulist[0] || null) + let mainMenu = menulist[0] || null + + if (this.props.editLevel === 'level1') { + mainMenu = null + } else if (this.props.mainMenu && this.props.mainMenu.MenuID) { + let _menu = menulist.filter(item => item.MenuID === this.props.mainMenu.MenuID)[0] + mainMenu = _menu || mainMenu + + if (!_menu && (this.props.editLevel === 'level2' || this.props.editLevel === 'level3')) { + this.props.resetEditLevel(false) + } } + + this.props.modifyMenuTree(menulist) + this.props.modifyMainMenu(mainMenu) } else { notification.error({ top: 92, @@ -91,7 +104,6 @@ } getMenulist = (result) => { - let iframes = ['Main/Index', 'bda/rdt', 'Home/rdt'] let menulist = [] let thdMenuList = [] result.fst_menu && result.fst_menu.forEach(fst => { @@ -116,7 +128,8 @@ MenuID: snd.MenuID, MenuName: snd.MenuName, PageParam: {Icon: 'folder'}, - children: [] + children: [], + level: 'second' } if (snd.PageParam) { @@ -137,26 +150,21 @@ MenuNo: trd.MenuNo, EasyCode: trd.EasyCode, type: 'CommonTable', // 榛樿鍊间负甯哥敤琛� - OpenType: 'newtab' // 鎵撳紑鏂瑰紡 + OpenType: 'newtab', // 鎵撳紑鏂瑰紡 + level: 'third' } - if (trd.LinkUrl && iframes.includes(trd.LinkUrl.split('?')[0])) { - trdItem.type = 'iframe' - trdItem.LinkUrl = trd.LinkUrl.replace('&', '&') - trdItem.forbidden = true - } else { - try { - trdItem.PageParam = trd.PageParam ? JSON.parse(trd.PageParam) : {OpenType: 'newtab'} - } catch (e) { - trdItem.PageParam = {OpenType: 'newtab'} - } + try { + trdItem.PageParam = trd.PageParam ? JSON.parse(trd.PageParam) : {OpenType: 'newtab'} trdItem.type = trdItem.PageParam.Template || trdItem.type - trdItem.OpenType = trdItem.PageParam.OpenType || trdItem.OpenType + trdItem.OpenType = trdItem.PageParam.OpenType + } catch (e) { + trdItem.PageParam = {OpenType: 'newtab'} + } - if (trdItem.type === 'CustomPage' && this.props.memberLevel < 20) { // 浼氬憳绛夌骇澶т簬绛変簬20鏃讹紝鏈夌紪杈戞潈闄� - trdItem.forbidden = true - } + if (trdItem.type === 'CustomPage' && this.state.memberLevel < 20) { // 浼氬憳绛夌骇澶т簬绛変簬20鏃讹紝鏈夌紪杈戞潈闄� + trdItem.forbidden = true } thdMenuList.push(trdItem) @@ -188,40 +196,144 @@ enterEdit = () => { // 杩涘叆缂栬緫鐘舵�� this.props.resetEditLevel('level1') - } - - enterEditManage = () => { - const { editLevel } = this.props - - if (editLevel === 'HS') return - - this.props.resetEditLevel('HS') - this.props.modifyMainMenu({ - MenuID: 'systemManageView' - }) - } - - /** - * @description 閫�鍑虹鐞嗙晫闈㈣彍鍗� - */ - exitManage = () => { - const { menulist } = this.state - - if (window.GLOB.systemType === 'production') { // 姝e紡绯荤粺鐗堟湰鍗囩骇鍚庯紝椤甸潰鍒锋柊 - this.props.history.replace('/main') - window.location.reload() - return - } - - this.props.modifyMainMenu(menulist[0] || null) - this.props.resetEditLevel(false) - - MKEmitter.emit('modifyTabs', null, 'replace') + this.props.modifyMainMenu(null) } exitEdit = () => { // 閫�鍑虹紪杈戠姸鎬� this.props.resetEditLevel(false) + this.props.modifyMainMenu(this.state.menulist[0] || null) + } + + addMemuSubmit = () => { + // 鏂板缓鑿滃崟锛氭彁浜� + this.addMenuFormRef.handleConfirm().then(param => { + param.func = 'sPC_MainMenu_Add' + param.Sort = (this.state.menulist.length + 1) * 10 + + this.setState({ + loading: true + }) + Api.getSystemConfig(param).then(res => { + if (res.status) { + this.setState({ + loading: false, + visible: false, + }) + + this.loadmenu() + } else { + this.setState({ + loading: false + }) + notification.warning({ + top: 92, + message: res.message, + duration: 5 + }) + } + }) + }, () => {}) + } + + 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 + }) + } 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'}) + } + } + } + } + }) } UNSAFE_componentWillMount () { @@ -232,15 +344,18 @@ this.loadmenu() } - UNSAFE_componentWillReceiveProps (nextProps) { - if (!is(fromJS(this.props.menuTree), fromJS(nextProps.menuTree)) && !is(fromJS(this.state.menulist), fromJS(nextProps.menuTree))) { - this.setState({ - menulist: nextProps.menuTree - }) - } - } - componentDidMount () { + window.addEventListener('storage', (e) => { + if (e.key === 'menuUpdate') { + this.reload() + } else if (e.key === 'wxTemplates') { + if (e.newValue) { + sessionStorage.setItem('wxTemplates', e.newValue) + } + } + }) + MKEmitter.addListener('mkUpdateMenuList', this.reload) + if (window.GLOB.systemType !== 'production') { setTimeout(() => { Api.getSystemConfig({func: 'sPC_Get_Roles_sModular'}).then(res => { @@ -271,17 +386,12 @@ sessionStorage.setItem('permFuncField', JSON.stringify(_permFuncField)) } }) - }, 50) - } else if (window.GLOB.systemType === 'production') { - this.props.resetEditLevel('HS') - this.props.modifyMainMenu({ - MenuID: 'systemManageView' - }) - } - } + }, 100) - shouldComponentUpdate (nextProps, nextState) { - return !is(fromJS(this.props), fromJS(nextProps)) || !is(fromJS(this.state), fromJS(nextState)) + setTimeout(() => { + this.setSystemFuncs() + }, 200) + } } /** @@ -291,6 +401,7 @@ this.setState = () => { return } + MKEmitter.removeListener('mkUpdateMenuList', this.reload) } gotoDoc = () => { @@ -305,10 +416,10 @@ render () { const { mainMenu, editLevel } = this.props - const { menulist } = this.state + const { menulist, memberLevel, visible, loading } = this.state return ( - <header className={'sys-header-container ant-menu-dark ' + (['level2', 'level3', 'HS'].includes(editLevel) ? 'mask' : '')} id="main-header-container"> + <header className={'sys-header-container ant-menu-dark ' + (['level2', 'level3'].includes(editLevel) ? 'mask' : '')} id="main-header-container"> <div className="header-logo"><img src={MainLogo} alt=""/></div> <div className="header-collapse"> <MenuFoldOutlined/> @@ -323,71 +434,87 @@ </li> ) })} - {!editLevel || editLevel === 'HS' ? - <li key="HS" onClick={this.enterEditManage} className={editLevel === 'HS' ? 'active' : ''}> + {!editLevel ? + <li key="HS" onClick={() => window.open('#/hs')}> <span>HS</span> </li> : null } </ul> : null } - {editLevel === 'HS' ? <Button className="level4-close" type="primary" onClick={this.exitManage}>閫�鍑�</Button> : null} {/* 杩涘叆缂栬緫鎸夐挳 */} - {!editLevel && menulist ? <EditOutlined onClick={this.enterEdit} className="edit-check" /> : null} - {!editLevel && options.sysType === 'local' && window.GLOB.systemType !== 'production' && this.props.memberLevel >= 20 ? - <div className="app-entrance entrance"> - <div className="icon"><AppstoreOutlined /></div> - <div className="title">搴旂敤绠$悊</div> - <div className="detail">鍙垱寤哄強绠$悊PC銆乸ad鍙婄Щ鍔ㄧ绛変笉鍚岃澶囩殑搴旂敤锛屽疄鐜版槑绉戜簯APP銆佸井淇″叕浼楀彿銆佸皬绋嬪簭绛夊骞冲彴鐨勫簲鐢ㄥ叡浜��</div> - <Button type="primary" onClick={() => {window.open('#/appmanage')}}> - 缂栬緫 - </Button> - </div> : null - } - {editLevel === 'HS' && options.sysType === 'local' && window.GLOB.systemType === 'production' ? - <div className="app-prod-entrance entrance"> - <div className="icon"><AppstoreOutlined /></div> - <div className="title">搴旂敤绠$悊</div> - <div className="detail">鍙垱寤哄強绠$悊PC銆乸ad鍙婄Щ鍔ㄧ绛変笉鍚岃澶囩殑搴旂敤锛屽疄鐜版槑绉戜簯APP銆佸井淇″叕浼楀彿銆佸皬绋嬪簭绛夊骞冲彴鐨勫簲鐢ㄥ叡浜��</div> - <Button type="primary" onClick={() => {window.open('#/appcheck')}}> - 鏌ョ湅 - </Button> - </div> : null - } - {!editLevel && options.sysType === 'local' ? - <div className="api-entrance entrance"> + {!editLevel && window.GLOB.systemType !== 'production' && menulist ? <Popover overlayClassName="mk-popover-control-wrap mk-menu-control" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ + <div className="mk-popover-control"> + <PlusOutlined onClick={() => this.setState({visible: true, loading: false})}/> + <EditOutlined onClick={this.enterEdit}/> + <div style={{display: 'inline-block', minWidth: '32px'}}><ThawMenu ParentId="0" Type="10"/></div> + </div> + } trigger="hover"> + <SettingOutlined className="edit-check"/> + </Popover> : null} + {/* window.btoa(window.encodeURIComponent(JSON.stringify({ MenuType: 'home', MenuId: 'home_page_id', MenuName: '棣栭〉' }))) */} + <div className="entrance-wrap"> + {window.GLOB.systemType !== 'production' ? + <div className="entrance"> + <div className="icon"><HomeOutlined /></div> + <div className="title">棣栭〉</div> + <div className="detail">鍩轰簬鑷畾涔夐〉闈㈢殑棣栭〉璁捐锛屽彲瀹炵幇鐏垫椿鐨勫厓绱犻厤缃強鏍峰紡璋冩暣锛屽睍鐜板綋鍓嶇郴缁熺殑椋庢牸銆�</div> + <Button type="primary" disabled={!(memberLevel >= 20)} title={memberLevel >= 20 ? '' : '浼氬憳绛夌骇涓嶅锛屾棤寮�鍙戞潈闄愩��'} onClick={() => {window.open('#/menudesign/JTdCJTIyTWVudVR5cGUlMjIlM0ElMjJob21lJTIyJTJDJTIyTWVudUlkJTIyJTNBJTIyaG9tZV9wYWdlX2lkJTIyJTJDJTIyTWVudU5hbWUlMjIlM0ElMjIlRTklQTYlOTYlRTklQTElQjUlMjIlN0Q=')}}> + 缂栬緫 + </Button> + </div> : null + } + <div className="entrance"> <div className="icon"><ApiOutlined /></div> <div className="title">鎺ュ彛璋冭瘯</div> <div className="detail">鍙嚜鍔ㄥ鐞嗙櫥褰曟帴鍙g殑鍙傛暟鍔犲瘑锛屼互鍙婁笟鍔℃帴鍙g殑绛惧悕璁$畻锛屾柟渚垮紑鍙戜汉鍛樼殑鎺ュ彛娴嬭瘯宸ヤ綔銆�</div> - <Button type="primary" onClick={() => {window.open('#/interface')}}> + <Button type="primary" disabled={!(memberLevel >= 20)} title={memberLevel >= 20 ? '' : '浼氬憳绛夌骇涓嶅锛屾棤寮�鍙戞潈闄愩��'} onClick={() => {window.open('#/interface')}}> 缂栬緫 </Button> - </div> : null - } - {/* window.btoa(window.encodeURIComponent(JSON.stringify({ MenuType: 'home', MenuId: 'home_page_id', MenuName: '棣栭〉' }))) */} - {!editLevel && window.GLOB.systemType !== 'production' ? - <div className="home-entrance entrance"> - <div className="icon"><HomeOutlined /></div> - <div className="title">棣栭〉</div> - <div className="detail">鍩轰簬鑷畾涔夐〉闈㈢殑棣栭〉璁捐锛屽彲瀹炵幇鐏垫椿鐨勫厓绱犻厤缃強鏍峰紡璋冩暣锛屽睍鐜板綋鍓嶇郴缁熺殑椋庢牸銆�</div> - <Button type="primary" onClick={() => {window.open('#/menudesign/JTdCJTIyTWVudVR5cGUlMjIlM0ElMjJob21lJTIyJTJDJTIyTWVudUlkJTIyJTNBJTIyaG9tZV9wYWdlX2lkJTIyJTJDJTIyTWVudU5hbWUlMjIlM0ElMjIlRTklQTYlOTYlRTklQTElQjUlMjIlN0Q=')}}> + </div> + <div className="entrance"> + <div className="icon"><AppstoreOutlined /></div> + <div className="title">搴旂敤绠$悊</div> + <div className="detail">鍙垱寤哄強绠$悊PC銆乸ad鍙婄Щ鍔ㄧ绛変笉鍚岃澶囩殑搴旂敤锛屽疄鐜版槑绉戜簯APP銆佸井淇″叕浼楀彿銆佸皬绋嬪簭绛夊骞冲彴鐨勫簲鐢ㄥ叡浜��</div> + {window.GLOB.systemType !== 'production' ? + <Button type="primary" disabled={!(memberLevel >= 20)} title={memberLevel >= 20 ? '' : '浼氬憳绛夌骇涓嶅锛屾棤寮�鍙戞潈闄愩��'} onClick={() => {window.open('#/appmanage')}}> + 缂栬緫 + </Button> : + <Button type="primary" disabled={!(memberLevel >= 20)} title={memberLevel >= 20 ? '' : '浼氬憳绛夌骇涓嶅锛屾棤寮�鍙戞潈闄愩��'} onClick={() => {window.open('#/appcheck')}}> + 鏌ョ湅 + </Button> + } + </div> + {window.GLOB.systemType !== 'production' ? <div className="entrance"> + <div className="icon"><MenuOutlined /></div> + <div className="title">鑿滃崟鎿嶄綔璇存槑</div> + <div className="detail">榧犳爣鎮仠 <SettingOutlined style={{color: '#1890ff'}}/> 鍙樉绀鸿彍鍗曠殑娣诲姞銆佹帓搴忥紙鍖呮嫭缂栬緫銆佸垹闄わ級涓庤В鍐诲姛鑳斤紝鍙屽嚮涓夌骇鑿滃崟鍙繘鍏ョ紪杈戠獥鍙c��</div> + <Button type="primary" onClick={() => {window.open('#/main')}}> + 鏂扮獥鍙� + </Button> + </div> : null} + {window.GLOB.systemType !== 'production' ? <div className="entrance"> + <div className="icon"><DatabaseOutlined /></div> + <div className="title">瀛樺偍杩囩▼</div> + <div className="detail">鍙湪椤甸潰涓煡鐪嬫垨缂栬緫鏈湴瀛樺偍杩囩▼銆�</div> + <Button type="primary" onClick={() => {window.open('#/proc')}}> 缂栬緫 </Button> - </div> : null - } + </div> : null} + </div> {/* 缂栬緫鑿滃崟 */} {editLevel === 'level1' ? <EditMenu menulist={this.state.menulist} reload={this.reload} exitEdit={this.exitEdit}/> : null} {/* 澶村儚銆佺敤鎴峰悕 */} <Dropdown className="header-setting" overlay={ <Menu className="header-dropdown"> <Menu.Item key="switch"> - {this.state.dict['main.edit']} + 缂栬緫 <Switch size="small" style={{marginLeft: '7px'}} disabled={!!editLevel} checked={true} onChange={this.changeEditState} /> </Menu.Item> - <Menu.Item key="doc" onClick={this.gotoDoc}>{this.state.dict['main.doc']}</Menu.Item> + <Menu.Item key="doc" onClick={this.gotoDoc}>鏂囨。涓績</Menu.Item> {options.sysType !== 'cloud' ? <Menu.Item style={{padding: 0}} key="verup"> <VersionsUp /> </Menu.Item> : null} - <Menu.Item key="logout" onClick={this.logout}>{this.state.dict['main.logout']}</Menu.Item> + <Menu.Item key="logout" onClick={this.logout}>閫�鍑�</Menu.Item> </Menu> }> <div style={{zIndex: 1, position: 'relative'}}> @@ -397,6 +524,20 @@ </span> </div> </Dropdown> + <Modal + title="娣诲姞鑿滃崟" + visible={visible} + onOk={this.addMemuSubmit} + confirmLoading={loading} + onCancel={() => this.setState({visible: false})} + destroyOnClose + > + <MenuForm + menu={null} + inputSubmit={this.addMemuSubmit} + wrappedComponentRef={(inst) => this.addMenuFormRef = inst} + /> + </Modal> </header> ) } @@ -406,9 +547,7 @@ return { menuTree: state.menuTree, mainMenu: state.mainMenu, - editLevel: state.editLevel, - permAction: state.permAction, - memberLevel: state.memberLevel + editLevel: state.editLevel } } -- Gitblit v1.8.0