| | |
| | | import React, {Component} from 'react' |
| | | import { connect } from 'react-redux' |
| | | import { is, fromJS } from 'immutable' |
| | | import { Menu, notification } from 'antd' |
| | | import { EditOutlined } from '@ant-design/icons' |
| | | import { Menu, notification, Popover } from 'antd' |
| | | import { EditOutlined, CloseOutlined, SwapOutlined, PlusOutlined, UnlockOutlined, SettingOutlined } from '@ant-design/icons' |
| | | |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | | import { resetEditLevel, modifyMenuTree, modifyMainMenu } from '@/store/action' |
| | |
| | | this.props.resetEditLevel(false) |
| | | } |
| | | |
| | | editmenu = (cell) => { |
| | | if (cell.type === 'CustomPage') { |
| | | let _param = { |
| | | MenuType: 'custom', |
| | | MenuId: cell.MenuID, |
| | | ParentId: cell.ParentId, |
| | | MenuName: cell.MenuName, |
| | | MenuNo: cell.MenuNo |
| | | } |
| | | _param = window.btoa(window.encodeURIComponent(JSON.stringify(_param))) |
| | | window.open(`#/menudesign/${_param}`) |
| | | } else { |
| | | |
| | | } |
| | | } |
| | | |
| | | render () { |
| | | const { mainMenu } = this.props |
| | | const { mainMenu, editLevel } = this.props |
| | | |
| | | let isnew = false |
| | | |
| | | return ( |
| | | <aside className="mk-sys-side-menu ant-menu-dark mk-edit"> |
| | | {!(this.props.editLevel === 'level2' || this.props.editLevel === 'level3') && |
| | | {!(editLevel === 'level2' || editLevel === 'level3') && |
| | | <Menu openKeys={this.state.openKeys} onOpenChange={this.onOpenChange} mode="inline" theme="dark"> |
| | | {!this.props.editLevel && mainMenu ? <li className="sup-menu"><EditOutlined onClick={this.enterSubEdit} className="edit-check"/></li> : null} |
| | | {!editLevel && mainMenu ? <li className="sup-menu"><EditOutlined onClick={this.enterSubEdit} className="edit-check"/></li> : null} |
| | | {this.state.subMenulist && this.state.subMenulist.map((item, index) => { |
| | | return ( |
| | | <SubMenu |
| | | key={item.MenuID} |
| | | title={ |
| | | <span className={!this.props.editLevel && index === 0 ? 'edit-control' : ''}> |
| | | <span className={!editLevel && index === 0 ? 'edit-control' : ''}> |
| | | <MkIcon type={item.PageParam.Icon} /> |
| | | <span>{item.MenuName}</span> |
| | | </span> |
| | | } |
| | | > |
| | | {!this.props.editLevel ? <li className={'ant-menu-item ' + (item.children.length > 0 ? 'sub-menu' : '')}> |
| | | <EditOutlined onClick={(e) => {this.enterThrEdit(e, item)}} className="edit-check"/> |
| | | {!editLevel ? <li className={'ant-menu-item ' + (item.children.length > 0 ? 'sub-menu' : '')}> |
| | | {!isnew ? <EditOutlined onClick={(e) => {this.enterThrEdit(e, item)}} className="edit-check"/> : |
| | | <Popover overlayClassName="mk-popover-control-wrap mk-menu-control" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ |
| | | <div className="mk-popover-control"> |
| | | <PlusOutlined onClick={(e) => {this.enterThrEdit(e, item)}} className="mk-edit-menu"/> |
| | | <SwapOutlined onClick={(e) => {this.enterThrEdit(e, item)}} className="mk-edit-menu mk-swap"/> |
| | | <UnlockOutlined onClick={(e) => {this.enterThrEdit(e, item)}} className="mk-edit-menu"/> |
| | | </div> |
| | | } trigger="hover" placement="top"> |
| | | <SettingOutlined className="edit-check"/> |
| | | </Popover>} |
| | | </li> : null} |
| | | {item.children.map(cell => { |
| | | return ( |
| | | <Menu.Item key={cell.MenuID}> |
| | | <a href={cell.src} id={cell.MenuID} onClick={(e) => this.changemenu(e, cell)}>{cell.MenuName}</a> |
| | | {editLevel !== 'HS' && isnew ? |
| | | <Popover overlayClassName="mk-popover-control-wrap mk-menu-control" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ |
| | | <div className="mk-popover-control"> |
| | | <EditOutlined className="edit" onClick={() => this.editmenu(cell)} /> |
| | | <CloseOutlined className="close" onClick={() => {}} /> |
| | | </div> |
| | | } trigger="hover" placement="top"> |
| | | <span className="editable-menu-item">{cell.MenuName}</span> |
| | | </Popover> : |
| | | <a href={cell.src} id={cell.MenuID} onClick={(e) => this.changemenu(e, cell)}>{cell.MenuName}</a> |
| | | } |
| | | </Menu.Item> |
| | | ) |
| | | })} |
| | |
| | | ) |
| | | })} |
| | | </Menu>} |
| | | {this.props.editLevel === 'level2' ? |
| | | {editLevel === 'level2' ? |
| | | <EditSecMenu |
| | | menulist={this.state.subMenulist} |
| | | menuTree={this.props.menuTree} |
| | |
| | | exitEdit={this.exitEdit} |
| | | /> : null |
| | | } |
| | | {this.props.editLevel === 'level3' && this.state.editMenu ? |
| | | {editLevel === 'level3' && this.state.editMenu ? |
| | | <EditThdMenu |
| | | menulist={this.state.editMenu.children} |
| | | supMenuList={this.state.subMenulist} |