| | |
| | | import { Spin, notification, Button, Table, Modal, ConfigProvider, Tree, Input, Empty } from 'antd' |
| | | import moment from 'moment' |
| | | import md5 from 'md5' |
| | | import enUS from 'antd/es/locale/en_US' |
| | | import zhCN from 'antd/es/locale/zh_CN' |
| | | import { ApiOutlined } from '@ant-design/icons' |
| | | |
| | | import Api from '@/api' |
| | | import Utils from '@/utils/utils.js' |
| | |
| | | const { TreeNode } = Tree |
| | | const { Search } = Input |
| | | |
| | | const _locale = sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS |
| | | const Header = asyncComponent(() => import('./header')) |
| | | const TransferForm = asyncComponent(() => import('@/templates/zshare/basetransferform')) |
| | | |
| | | sessionStorage.setItem('isEditState', 'true') |
| | | |
| | | class RoleManage extends Component { |
| | | state = { |
| | | app: null, |
| | | loading: false, |
| | | menulist: [], |
| | | sortType: '', |
| | | columns: [ |
| | | { title: '菜单名称', dataIndex: 'MenuName', key: 'MenuName', align: 'center' }, |
| | | { |
| | | title: '菜单名称', dataIndex: 'MenuName', key: 'MenuName', align: 'center', render: (text, record) => { |
| | | if (record.extra) { |
| | | return <span style={{color: '#1890ff'}}>{text}</span> |
| | | } else if (record.interfaces === 'true') { |
| | | return <span><ApiOutlined style={{color: 'orange', marginRight: '5px'}} title="菜单中使用了外部接口" />{text}</span> |
| | | } |
| | | return text |
| | | } |
| | | }, |
| | | { |
| | | title: '菜单参数', dataIndex: 'MenuNo', key: 'MenuNo', align: 'center' |
| | | }, |
| | | { |
| | | title: '修改时间', dataIndex: 'modifydate', key: 'modifydate', align: 'center', sorter: true, render: (text, record) => { |
| | | if (window.GLOB.upStatus && record.up_action === 'Y') { |
| | | return <span style={{color: 'orange'}}>{text}</span> |
| | | } |
| | | return text |
| | | } |
| | | }, |
| | | { |
| | | title: '操作', |
| | | key: 'action', |
| | | align: 'center', |
| | | render: (text, record) => ( |
| | | <div> |
| | | <Button type="link" onClick={() => this.deleteMenu(record)} style={{color: '#ff4d4f'}}>删除</Button> |
| | | <div style={{minWidth: '125px'}}> |
| | | {record.type !== 'none' ? |
| | | <Button type="link" onClick={() => this.deleteMenu(record)} style={{color: '#ff4d4f'}}>删除</Button> : |
| | | <Button type="link" onClick={() => { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '当前系统菜单尚未创建。', |
| | | duration: 5 |
| | | }) |
| | | }} style={{color: '#ff4d4f', opacity: '0.5'}}>删除</Button>} |
| | | <Button type="link" onClick={() => this.jumpApp(record)} style={{color: '#1890ff', marginLeft: '5px'}}>编辑</Button> |
| | | </div> |
| | | ), |
| | | }, |
| | |
| | | targetKeys: [], |
| | | trees: null, |
| | | expandedKeys: [], |
| | | searchkey: '' |
| | | searchkey: '', |
| | | appViewList: [] |
| | | } |
| | | |
| | | oriTrees = null |
| | | |
| | | UNSAFE_componentWillMount() { |
| | | document.body.className = '' |
| | | let param = JSON.parse(window.decodeURIComponent(window.atob(this.props.match.params.param))) |
| | | |
| | | this.setState({app: param}, () => { |
| | | this.getTreeList() |
| | | this.getMenuList() |
| | | this.getAppViewList() |
| | | }) |
| | | } |
| | | |
| | |
| | | } |
| | | } |
| | | |
| | | getMenuList = (reset) => { |
| | | getAppViewList = () => { |
| | | const { app } = this.state |
| | | |
| | | Api.getCloudConfig({ |
| | | func: 's_get_keyids', |
| | | bid: app.ID |
| | | }).then(result => { |
| | | if (!result.status) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: result.message, |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | this.setState({appViewList: result.data || []}) |
| | | }) |
| | | } |
| | | |
| | | getMenuList = (reset, resolve) => { |
| | | const { app } = this.state |
| | | let param = { |
| | | func: 's_get_app_menus', |
| | |
| | | |
| | | param.secretkey = Utils.encrypt(param.LText, param.timestamp) |
| | | |
| | | this.setState({ |
| | | loading: true |
| | | }) |
| | | if (!resolve) { |
| | | this.setState({ |
| | | loading: true |
| | | }) |
| | | } |
| | | |
| | | Api.getCloudConfig(param).then(result => { |
| | | if (result.status) { |
| | | this.setState({ |
| | | menulist: result.menus.map(item => { |
| | | item.nodes = '' |
| | | item.type = 'view' |
| | | if (item.menus_rolelist) { |
| | | try { |
| | | let pageParam = JSON.parse(window.decodeURIComponent(window.atob(item.menus_rolelist))) |
| | | item.nodes = pageParam |
| | | if (pageParam.type === 'navbar') { |
| | | item.type = 'navbar' |
| | | } |
| | | } catch (e) { |
| | | let ub = app.user_binding === 'true' && app.userbind ? false : true |
| | | let im = app.instantMessage ? false : true |
| | | |
| | | let menus = result.menus.map(item => { |
| | | item.nodes = '' |
| | | item.type = 'view' |
| | | if (item.menus_rolelist) { |
| | | try { |
| | | let pageParam = JSON.parse(window.decodeURIComponent(window.atob(item.menus_rolelist))) |
| | | item.nodes = pageParam |
| | | item.interfaces = pageParam.interfaces || 'false' |
| | | |
| | | if (pageParam.type) { |
| | | item.type = pageParam.type |
| | | } |
| | | |
| | | if (pageParam.version !== '1.0') { |
| | | item.nodes = '' |
| | | } else if (pageParam.login || pageParam.pass) { |
| | | item.nodes = '' |
| | | } else if (pageParam.type === 'im') { |
| | | item.nodes = '' |
| | | } |
| | | } catch (e) { |
| | | item.nodes = '' |
| | | } |
| | | |
| | | return item |
| | | }) |
| | | |
| | | delete item.menus_rolelist |
| | | } |
| | | |
| | | if (app.userbind === item.MenuID) { |
| | | item.extra = true |
| | | ub = true |
| | | } |
| | | if (app.instantMessage === item.MenuID) { |
| | | item.extra = true |
| | | im = true |
| | | } |
| | | |
| | | return item |
| | | }) |
| | | |
| | | if (!im) { |
| | | menus.push({nodes: '', type: 'none', extra: true, MenuID: app.instantMessage, MenuName: '即时通信'}) |
| | | } |
| | | if (!ub) { |
| | | menus.push({nodes: '', type: 'none', extra: true, MenuID: app.userbind, MenuName: '用户绑定'}) |
| | | } |
| | | |
| | | this.setState({ |
| | | menulist: menus |
| | | }, () => { |
| | | if (reset && (!this.oriTrees || this.oriTrees.length === 0)) { |
| | | if (resolve) { |
| | | this.initMenutree(resolve) |
| | | } else if (reset && (!this.oriTrees || this.oriTrees.length === 0)) { |
| | | this.initMenutree() |
| | | } else if (!reset && this.oriTrees && this.oriTrees.length === 0) { |
| | | this.initMenutree() |
| | |
| | | ParentID: 'mk_app', |
| | | TypeCharOne: app.kei_no, |
| | | typename: app.typename, |
| | | lang: app.lang |
| | | lang: app.lang, |
| | | TYPE: 30 |
| | | }).then(res => { |
| | | if (res.status) { |
| | | this.setState({ |
| | |
| | | } |
| | | |
| | | deleteMenu = (record) => { |
| | | const { app } = this.state |
| | | const { app, appViewList } = this.state |
| | | const _this = this |
| | | |
| | | let param = { |
| | |
| | | lang: app.lang |
| | | } |
| | | |
| | | if (app.typename === 'pc' && record.nodes && record.nodes.popviews && record.nodes.popviews.length > 0) { |
| | | param.MenuID = param.MenuID + ',' + record.nodes.popviews.join(',') |
| | | let _param = { |
| | | func: 's_kei_link_keyids_addupt', |
| | | BID: app.ID, |
| | | exec_type: 'x', |
| | | LText: '' |
| | | } |
| | | |
| | | let _appViewList = appViewList.filter(item => item.keys_id !== record.MenuID) |
| | | |
| | | if (appViewList.length !== _appViewList.length) { |
| | | _param.LText = _appViewList.map(item => `select '${item.keys_id}','${item.keys_type}','${item.kei_no}','${item.appkey}','${item.bid}','${sessionStorage.getItem('CloudUserID')}','${item.remark}'`) |
| | | _param.LText = _param.LText.join(' union all ') |
| | | _param.LText = Utils.formatOptions(_param.LText, 'x') |
| | | |
| | | _param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') |
| | | _param.secretkey = Utils.encrypt('', _param.timestamp) |
| | | } else { |
| | | _param = null |
| | | } |
| | | |
| | | confirm({ |
| | |
| | | duration: 3 |
| | | }) |
| | | _this.getMenuList(true) |
| | | |
| | | if (_param) { |
| | | Api.getCloudConfig(_param).then(res => { |
| | | if (!res.status) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: res.message, |
| | | duration: 5 |
| | | }) |
| | | } else { |
| | | _this.setState({appViewList: _appViewList}) |
| | | } |
| | | }) |
| | | } |
| | | } else { |
| | | notification.warning({ |
| | | top: 92, |
| | |
| | | confirmLoading: true |
| | | }) |
| | | |
| | | Api.getSystemConfig({ |
| | | Api.getCloudConfig({ |
| | | func: 'sPC_MainMenu_ReDel', |
| | | MenuID: targetKeys.join(','), |
| | | TypeCharOne: app.kei_no, |
| | |
| | | try { |
| | | let pageParam = JSON.parse(window.decodeURIComponent(window.atob(item.menus_rolelist))) |
| | | item.nodes = pageParam |
| | | if (pageParam.type === 'navbar') { |
| | | item.type = 'navbar' |
| | | |
| | | if (pageParam.type) { |
| | | item.type = pageParam.type |
| | | } |
| | | |
| | | if (pageParam.version !== '1.0') { |
| | | item.nodes = '' |
| | | } else if (pageParam.login || pageParam.pass) { |
| | | item.nodes = '' |
| | | } else if (pageParam.type === 'im') { |
| | | item.nodes = '' |
| | | } |
| | | } catch (e) { |
| | | item.nodes = '' |
| | | } |
| | | } |
| | | |
| | | if (targetKeys.includes(item.MenuID) && item.nodes && item.nodes.popviews && item.nodes.popviews.length > 0) { |
| | | list = [...list, ...item.nodes.popviews] |
| | | delete item.menus_rolelist |
| | | } |
| | | |
| | | return item |
| | |
| | | }) |
| | | |
| | | if (app.typename === 'pc' && list.length > 0) { |
| | | Api.getSystemConfig({ |
| | | Api.getCloudConfig({ |
| | | func: 'sPC_MainMenu_ReDel', |
| | | MenuID: list.join(','), |
| | | TypeCharOne: app.kei_no, |
| | |
| | | initTree = () => { |
| | | const _this = this |
| | | confirm({ |
| | | content: '初始化会根据菜单重置权限树,确定执行吗?', |
| | | content: '权限树会重新生成,确定执行吗?', |
| | | onOk() { |
| | | return new Promise(resolve => { |
| | | _this.initMenutree(resolve) |
| | | _this.getMenuList(true, resolve) |
| | | }) |
| | | }, |
| | | onCancel() {} |
| | |
| | | } |
| | | |
| | | saveTree = () => { |
| | | const { trees } = this.state |
| | | // const { trees } = this.state |
| | | const _this = this |
| | | |
| | | if (!trees || trees.length === 0) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '未获取到权限信息!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | // if (!trees || trees.length === 0) { |
| | | // notification.warning({ |
| | | // top: 92, |
| | | // message: '未获取到权限信息!', |
| | | // duration: 5 |
| | | // }) |
| | | // return |
| | | // } |
| | | |
| | | confirm({ |
| | | content: '确定执行吗?', |
| | |
| | | this.setState({ visible: true, targetKeys: [] }) |
| | | } |
| | | |
| | | jumpApp = (item) => { |
| | | const { app } = this.state |
| | | |
| | | let route = 'mobdesign' |
| | | if (app.typename === 'pc') { |
| | | route = 'pcdesign' |
| | | } |
| | | if (item.type === 'navbar') { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '导航栏不可单独编辑,请在含有导航栏的页面中修改。', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | |
| | | if (app.instantMessage && item.MenuID === app.instantMessage) { |
| | | route = 'imdesign' |
| | | } |
| | | |
| | | window.open(window.location.href.replace(/#.+/ig, `#/${route}/${window.btoa(window.encodeURIComponent(JSON.stringify({...app, MenuID: item.MenuID, type: 'app'})))}`)) |
| | | } |
| | | |
| | | changeTable = (pagination, filters, sorter) => { |
| | | this.setState({sortType: sorter.order || ''}) |
| | | } |
| | | |
| | | render () { |
| | | const { app, loading, columns, menulist, trees, searchkey } = this.state |
| | | let _menulist = menulist |
| | | const { app, loading, columns, menulist, trees, searchkey, sortType } = this.state |
| | | let _menulist = fromJS(menulist).toJS() |
| | | |
| | | if (searchkey) { |
| | | _menulist = _menulist.filter(item => item.MenuName.toLowerCase().indexOf(searchkey.toLowerCase()) > -1) |
| | | } |
| | | |
| | | if (sortType === 'ascend') { |
| | | _menulist.sort((a, b) => { |
| | | if (a.modifydate > b.modifydate) return 1 |
| | | if (a.modifydate < b.modifydate) return -1 |
| | | return 0 |
| | | }) |
| | | } else if (sortType === 'descend') { |
| | | _menulist.sort((a, b) => { |
| | | if (a.modifydate < b.modifydate) return 1 |
| | | if (a.modifydate > b.modifydate) return -1 |
| | | return 0 |
| | | }) |
| | | } |
| | | |
| | | return ( |
| | | <div className="mk-role-manage"> |
| | | <ConfigProvider locale={_locale}> |
| | | <ConfigProvider locale={zhCN}> |
| | | <Header app={app} /> |
| | | {loading ? |
| | | <div className="loading-mask"> |
| | |
| | | columns={columns} |
| | | dataSource={_menulist} |
| | | pagination={false} |
| | | onChange={this.changeTable} |
| | | /> |
| | | </div> |
| | | </div> |
| | | <div className="right-view"> |
| | | <div className="app-action"> |
| | | <Button className="mk-primary" onClick={this.initTree}>初始化</Button> |
| | | <Button className="mk-purple" onClick={this.syncTree}>同步</Button> |
| | | <Button className="mk-primary" onClick={this.initTree}>重置</Button> |
| | | {/* <Button className="mk-purple" onClick={this.syncTree}>同步</Button> */} |
| | | <Button className="mk-green save" onClick={this.saveTree}>保存</Button> |
| | | </div> |
| | | {trees && trees.length ? <Tree |