From 8d66ff34fae5b048a6b7923cc75d34f13a08be9d Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期二, 02 八月 2022 11:42:43 +0800 Subject: [PATCH] Merge branch 'develop' --- src/views/design/header/index.jsx | 238 ++++++++++++++++++++++++++++++++-------------------------- 1 files changed, 131 insertions(+), 107 deletions(-) diff --git a/src/views/design/header/index.jsx b/src/views/design/header/index.jsx index 7146bae..eac3170 100644 --- a/src/views/design/header/index.jsx +++ b/src/views/design/header/index.jsx @@ -1,9 +1,8 @@ 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, SwapOutlined, MenuOutlined } from '@ant-design/icons' import asyncComponent from '@/utils/asyncComponent' import { @@ -14,31 +13,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 +52,6 @@ changeMenu (value) { // 涓昏彍鍗曞垏鎹� - if (this.props.editLevel) { - // 缂栬緫鐘舵�佷笅锛屼笉鍙垏鎹㈣彍鍗� - return - } if (value.PageParam.OpenType === 'menu') { this.props.modifyMainMenu(value) } else if (value.PageParam.OpenType === 'outpage') { @@ -77,10 +74,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, @@ -116,7 +124,8 @@ MenuID: snd.MenuID, MenuName: snd.MenuName, PageParam: {Icon: 'folder'}, - children: [] + children: [], + level: 'second' } if (snd.PageParam) { @@ -137,7 +146,8 @@ MenuNo: trd.MenuNo, EasyCode: trd.EasyCode, type: 'CommonTable', // 榛樿鍊间负甯哥敤琛� - OpenType: 'newtab' // 鎵撳紑鏂瑰紡 + OpenType: 'newtab', // 鎵撳紑鏂瑰紡 + level: 'third' } if (trd.LinkUrl && iframes.includes(trd.LinkUrl.split('?')[0])) { @@ -154,7 +164,7 @@ trdItem.type = trdItem.PageParam.Template || trdItem.type trdItem.OpenType = trdItem.PageParam.OpenType || trdItem.OpenType - if (trdItem.type === 'CustomPage' && this.props.memberLevel < 20) { // 浼氬憳绛夌骇澶т簬绛変簬20鏃讹紝鏈夌紪杈戞潈闄� + if (trdItem.type === 'CustomPage' && this.state.memberLevel < 20) { // 浼氬憳绛夌骇澶т簬绛変簬20鏃讹紝鏈夌紪杈戞潈闄� trdItem.forbidden = true } } @@ -188,40 +198,45 @@ 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 + }) + } + }) + }, () => {}) } UNSAFE_componentWillMount () { @@ -230,14 +245,6 @@ // 缁勪欢鍔犺浇鏃讹紝鑾峰彇鑿滃崟鏁版嵁 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 () { @@ -272,16 +279,14 @@ } }) }, 50) - } else if (window.GLOB.systemType === 'production') { - this.props.resetEditLevel('HS') - this.props.modifyMainMenu({ - MenuID: 'systemManageView' - }) } - } - shouldComponentUpdate (nextProps, nextState) { - return !is(fromJS(this.props), fromJS(nextProps)) || !is(fromJS(this.state), fromJS(nextState)) + window.addEventListener('storage', (e) => { + if (e.key !== 'menuUpdate') return + + this.reload() + }) + MKEmitter.addListener('mkUpdateMenuList', this.reload) } /** @@ -291,6 +296,7 @@ this.setState = () => { return } + MKEmitter.removeListener('mkUpdateMenuList', this.reload) } gotoDoc = () => { @@ -305,10 +311,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 +329,77 @@ </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 && window.GLOB.systemType !== 'production' ? - <div className="app-entrance entrance"> - <div className="icon"><AppstoreOutlined /></div> - <div className="title">搴旂敤绠$悊</div> - <div className="detail">鍙垱寤哄強绠$悊PC銆乸ad鍙婄Щ鍔ㄧ绛変笉鍚岃澶囩殑搴旂敤锛屽疄鐜版槑绉戜簯APP銆佸井淇″叕浼楀彿銆佸皬绋嬪簭绛夊骞冲彴鐨勫簲鐢ㄥ叡浜��</div> - <Button type="primary" disabled={!(this.props.memberLevel >= 20)} title={this.props.memberLevel >= 20 ? '' : '浼氬憳绛夌骇涓嶅锛屾棤寮�鍙戞潈闄愩��'} onClick={() => {window.open('#/appmanage')}}> - 缂栬緫 - </Button> - </div> : null - } - {editLevel === 'HS' && 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" disabled={!(this.props.memberLevel >= 20)} title={this.props.memberLevel >= 20 ? '' : '浼氬憳绛夌骇涓嶅锛屾棤寮�鍙戞潈闄愩��'} onClick={() => {window.open('#/appcheck')}}> - 鏌ョ湅 - </Button> - </div> : null - } - {!editLevel ? - <div className="api-entrance entrance"> - <div className="icon"><ApiOutlined /></div> - <div className="title">鎺ュ彛璋冭瘯</div> - <div className="detail">鍙嚜鍔ㄥ鐞嗙櫥褰曟帴鍙g殑鍙傛暟鍔犲瘑锛屼互鍙婁笟鍔℃帴鍙g殑绛惧悕璁$畻锛屾柟渚垮紑鍙戜汉鍛樼殑鎺ュ彛娴嬭瘯宸ヤ綔銆�</div> - <Button type="primary" disabled={!(this.props.memberLevel >= 20)} title={this.props.memberLevel >= 20 ? '' : '浼氬憳绛夌骇涓嶅锛屾棤寮�鍙戞潈闄愩��'} onClick={() => {window.open('#/interface')}}> - 缂栬緫 - </Button> - </div> : null - } + {!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})}/> + <SwapOutlined 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: '棣栭〉' }))) */} - {!editLevel && window.GLOB.systemType !== 'production' ? + {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" disabled={!(this.props.memberLevel >= 20)} title={this.props.memberLevel >= 20 ? '' : '浼氬憳绛夌骇涓嶅锛屾棤寮�鍙戞潈闄愩��'} onClick={() => {window.open('#/menudesign/JTdCJTIyTWVudVR5cGUlMjIlM0ElMjJob21lJTIyJTJDJTIyTWVudUlkJTIyJTNBJTIyaG9tZV9wYWdlX2lkJTIyJTJDJTIyTWVudU5hbWUlMjIlM0ElMjIlRTklQTYlOTYlRTklQTElQjUlMjIlN0Q=')}}> + <Button type="primary" disabled={!(memberLevel >= 20)} title={memberLevel >= 20 ? '' : '浼氬憳绛夌骇涓嶅锛屾棤寮�鍙戞潈闄愩��'} onClick={() => {window.open('#/menudesign/JTdCJTIyTWVudVR5cGUlMjIlM0ElMjJob21lJTIyJTJDJTIyTWVudUlkJTIyJTNBJTIyaG9tZV9wYWdlX2lkJTIyJTJDJTIyTWVudU5hbWUlMjIlM0ElMjIlRTklQTYlOTYlRTklQTElQjUlMjIlN0Q=')}}> 缂栬緫 </Button> </div> : null } + <div className="api-entrance entrance"> + <div className="icon"><ApiOutlined /></div> + <div className="title">鎺ュ彛璋冭瘯</div> + <div className="detail">鍙嚜鍔ㄥ鐞嗙櫥褰曟帴鍙g殑鍙傛暟鍔犲瘑锛屼互鍙婁笟鍔℃帴鍙g殑绛惧悕璁$畻锛屾柟渚垮紑鍙戜汉鍛樼殑鎺ュ彛娴嬭瘯宸ヤ綔銆�</div> + <Button type="primary" disabled={!(memberLevel >= 20)} title={memberLevel >= 20 ? '' : '浼氬憳绛夌骇涓嶅锛屾棤寮�鍙戞潈闄愩��'} onClick={() => {window.open('#/interface')}}> + 缂栬緫 + </Button> + </div> + <div className="app-entrance 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="menu-entrance 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} {/* 缂栬緫鑿滃崟 */} {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 +409,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 +432,7 @@ return { menuTree: state.menuTree, mainMenu: state.mainMenu, - editLevel: state.editLevel, - permAction: state.permAction, - memberLevel: state.memberLevel + editLevel: state.editLevel } } -- Gitblit v1.8.0