| | |
| | | import { is, fromJS } from 'immutable' |
| | | import moment from 'moment' |
| | | import HTML5Backend from 'react-dnd-html5-backend' |
| | | import { notification, Modal, Collapse, Card, Icon, Switch, Button } from 'antd' |
| | | import { ConfigProvider, notification, Modal, Collapse, Card, Icon, Switch, Button } from 'antd' |
| | | |
| | | import Api from '@/api' |
| | | import Utils from '@/utils/utils.js' |
| | | import zhCN from '@/locales/zh-CN/mob.js' |
| | | import enUS from '@/locales/en-US/mob.js' |
| | | import antdEnUS from 'antd/es/locale/en_US' |
| | | import antdZhCN from 'antd/es/locale/zh_CN' |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | | |
| | | import './index.scss' |
| | |
| | | // const { TabPane } = Tabs |
| | | const { Panel } = Collapse |
| | | const { confirm } = Modal |
| | | const _locale = localStorage.getItem('lang') !== 'en-US' ? antdZhCN : antdEnUS |
| | | |
| | | const Header = asyncComponent(() => import('@/menu/header')) |
| | | const MenuForm = asyncComponent(() => import('@/menu/menuform')) |
| | |
| | | |
| | | closeView = () => { |
| | | const { oriConfig, config } = this.state |
| | | const _this = this |
| | | |
| | | if (!is(fromJS(oriConfig), fromJS(config))) { |
| | | confirm({ |
| | | title: '配置已修改,放弃保存吗?', |
| | | content: '', |
| | | okText: _this.state.dict['mob.confirm'], |
| | | cancelText: _this.state.dict['mob.cancel'], |
| | | onOk() { |
| | | window.close() |
| | | }, |
| | |
| | | confirm({ |
| | | title: '确定删除元素吗?', |
| | | content: '', |
| | | okText: this.state.dict['mob.confirm'], |
| | | cancelText: this.state.dict['mob.cancel'], |
| | | onOk() { |
| | | config.components = config.components.filter(item => item.uuid !== id) |
| | | |
| | |
| | | const { activeKey, dict, MenuId, config } = this.state |
| | | |
| | | return ( |
| | | <div className="pc-menu-view" id="view"> |
| | | <Header view="design" closeView={this.closeView} /> |
| | | <DndProvider backend={HTML5Backend}> |
| | | <div className="menu-body"> |
| | | <div className="menu-setting"> |
| | | <Collapse accordion activeKey={activeKey} bordered={false} onChange={(key) => this.setState({activeKey: key})}> |
| | | {/* 基本信息 */} |
| | | <Panel header={dict['mob.basemsg']} key="basedata"> |
| | | {/* 菜单信息 */} |
| | | <MenuForm |
| | | dict={dict} |
| | | config={config} |
| | | MenuId={MenuId} |
| | | parentId={this.props.match.params.ParentId} |
| | | MenuName={this.props.match.params.MenuName} |
| | | MenuNo={this.props.match.params.MenuNo} |
| | | initMenuList={this.initMenuList} |
| | | updateConfig={this.updateConfig} |
| | | /> |
| | | {/* 表名添加 */} |
| | | {config ? <TableComponent config={config} updatetable={this.updatetable}/> : null} |
| | | </Panel> |
| | | {/* 组件添加 */} |
| | | <Panel header={dict['mob.component']} key="component"> |
| | | <SourceWrap /> |
| | | </Panel> |
| | | {/* <Panel header={dict['mob.style']} key="style"> |
| | | <Controller /> |
| | | </Panel> */} |
| | | </Collapse> |
| | | <ConfigProvider locale={_locale}> |
| | | <div className="pc-menu-view" id="view"> |
| | | <Header view="design" closeView={this.closeView} /> |
| | | <DndProvider backend={HTML5Backend}> |
| | | <div className="menu-body"> |
| | | <div className="menu-setting"> |
| | | <Collapse accordion activeKey={activeKey} bordered={false} onChange={(key) => this.setState({activeKey: key})}> |
| | | {/* 基本信息 */} |
| | | <Panel header={dict['mob.basemsg']} key="basedata"> |
| | | {/* 菜单信息 */} |
| | | <MenuForm |
| | | dict={dict} |
| | | config={config} |
| | | MenuId={MenuId} |
| | | parentId={this.props.match.params.ParentId} |
| | | MenuName={this.props.match.params.MenuName} |
| | | MenuNo={this.props.match.params.MenuNo} |
| | | initMenuList={this.initMenuList} |
| | | updateConfig={this.updateConfig} |
| | | /> |
| | | {/* 表名添加 */} |
| | | {config ? <TableComponent config={config} updatetable={this.updatetable}/> : null} |
| | | </Panel> |
| | | {/* 组件添加 */} |
| | | <Panel header={dict['mob.component']} key="component"> |
| | | <SourceWrap /> |
| | | </Panel> |
| | | {/* <Panel header={dict['mob.style']} key="style"> |
| | | <Controller /> |
| | | </Panel> */} |
| | | </Collapse> |
| | | </div> |
| | | <div className="menu-view"> |
| | | <Card title={ |
| | | <div> |
| | | {config && config.MenuName} |
| | | <Icon type="redo" style={{marginLeft: '10px'}} title="刷新标签列表" onClick={() => this.reloadTab()} /> |
| | | </div> |
| | | } bordered={false} extra={ |
| | | <div> |
| | | {config ? <Switch className="big" checkedChildren={dict['mob.enable']} unCheckedChildren={dict['mob.disable']} checked={config.enabled} onChange={this.onEnabledChange} /> : null} |
| | | <Button type="primary" onClick={this.submitConfig} loading={this.state.menuloading}>{dict['mob.save']}</Button> |
| | | </div> |
| | | } style={{ width: '100%' }}> |
| | | {config && config.components ? <MenuShell config={config} handleList={this.updateConfig} deleteCard={this.deleteCard} /> : null} |
| | | </Card> |
| | | </div> |
| | | </div> |
| | | <div className="menu-view"> |
| | | <Card title={ |
| | | <div> |
| | | {config && config.MenuName} |
| | | <Icon type="redo" style={{marginLeft: '10px'}} title="刷新标签列表" onClick={() => this.reloadTab()} /> |
| | | </div> |
| | | } bordered={false} extra={ |
| | | <div> |
| | | {config ? <Switch className="big" checkedChildren={dict['mob.enable']} unCheckedChildren={dict['mob.disable']} checked={config.enabled} onChange={this.onEnabledChange} /> : null} |
| | | <Button type="primary" onClick={this.submitConfig} loading={this.state.menuloading}>{dict['mob.save']}</Button> |
| | | </div> |
| | | } style={{ width: '100%' }}> |
| | | {config && config.components ? <MenuShell config={config} handleList={this.updateConfig} deleteCard={this.deleteCard} /> : null} |
| | | </Card> |
| | | </div> |
| | | </div> |
| | | </DndProvider> |
| | | </div> |
| | | </DndProvider> |
| | | </div> |
| | | </ConfigProvider> |
| | | ) |
| | | } |
| | | } |