| | |
| | | import React, { Component } from 'react' |
| | | import { connect } from 'react-redux' |
| | | import { DndProvider } from 'react-dnd' |
| | | import { is, fromJS } from 'immutable' |
| | | import moment from 'moment' |
| | |
| | | import antdEnUS from 'antd/es/locale/en_US' |
| | | import antdZhCN from 'antd/es/locale/zh_CN' |
| | | import MKEmitter from '@/utils/events.js' |
| | | import MenuUtils from '@/menu/utils/menuUtils.js' |
| | | import MenuUtils from '@/utils/utils-custom.js' |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | | import { modifyCustomMenu } from '@/store/action' |
| | | |
| | | import './index.scss' |
| | | |
| | | const { Panel } = Collapse |
| | | const { confirm } = Modal |
| | | const _locale = localStorage.getItem('lang') !== 'en-US' ? antdZhCN : antdEnUS |
| | | const _locale = sessionStorage.getItem('lang') !== 'en-US' ? antdZhCN : antdEnUS |
| | | |
| | | const MenuForm = asyncComponent(() => import('./menuform')) |
| | | const HomeForm = asyncComponent(() => import('./homeform')) |
| | |
| | | const PaddingController = asyncComponent(() => import('@/menu/padcontroller')) |
| | | const StyleController = asyncComponent(() => import('@/menu/stylecontroller')) |
| | | const SysInterface = asyncComponent(() => import('@/menu/sysinterface')) |
| | | const UrlFieldComponent = asyncComponent(() => import('@/menu/urlfieldcomponent')) |
| | | const PictureController = asyncComponent(() => import('@/menu/picturecontroller')) |
| | | const ModalController = asyncComponent(() => import('@/menu/modalconfig/controller')) |
| | | const StyleCombController = asyncComponent(() => import('@/menu/stylecombcontroller')) |
| | |
| | | sessionStorage.setItem('editMenuType', 'menu') // 编辑菜单类型 |
| | | document.body.className = '' |
| | | window.GLOB.UserComponentMap = new Map() // 缓存用户自定义组件 |
| | | window.GLOB.urlFields = [] // url变量 |
| | | window.GLOB.customMenu = null // 保存菜单信息 |
| | | |
| | | class MenuDesign extends Component { |
| | | state = { |
| | | dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, |
| | | dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, |
| | | MenuType: '', |
| | | MenuId: '', |
| | | ParentId: '', |
| | | MenuName: '', |
| | | MenuNo: '', |
| | | tableFields: [], |
| | | delButtons: [], |
| | | copyButtons: [], |
| | | thawButtons: [], |
| | | activeKey: 'basedata', |
| | | menuloading: false, |
| | | oriConfig: null, |
| | | openEdition: '', |
| | | config: null, |
| | | popBtn: null, // 弹窗标签页 |
| | | visible: false, |
| | |
| | | initPopview = (card, btn) => { |
| | | const { oriConfig, config } = this.state |
| | | |
| | | let _config = fromJS(config).toJS() |
| | | delete _config.tableFields |
| | | |
| | | if (!is(fromJS(oriConfig), fromJS(_config))) { |
| | | if (!is(fromJS(oriConfig), fromJS(config))) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '配置已修改,请保存!', |
| | |
| | | return |
| | | } |
| | | |
| | | btn.config = _config |
| | | btn.config = fromJS(config).toJS() |
| | | btn.component = card |
| | | |
| | | sessionStorage.setItem('editMenuType', 'popview') // 编辑弹窗标签 |
| | |
| | | handleBack = () => { |
| | | this.setState({popBtn: null, delButtons: [], copyButtons: []}, () => { |
| | | sessionStorage.setItem('editMenuType', 'menu') |
| | | this.props.modifyCustomMenu(this.state.config) |
| | | window.GLOB.customMenu = this.state.config |
| | | this.setState({visible: false}) |
| | | }) |
| | | } |
| | |
| | | return |
| | | } |
| | | |
| | | let _config = fromJS(config).toJS() |
| | | delete _config.tableFields |
| | | |
| | | if (!is(fromJS(oriConfig), fromJS(_config))) { |
| | | if (!is(fromJS(oriConfig), fromJS(config))) { |
| | | confirm({ |
| | | title: '配置已修改,放弃保存吗?', |
| | | content: '', |
| | |
| | | config.lastCount = config.lastCount || '' |
| | | } |
| | | |
| | | config.open_edition = result.open_edition || '' |
| | | window.GLOB.urlFields = config.urlFields || [] |
| | | |
| | | this.setState({ |
| | | oriConfig: config, |
| | | config: fromJS(config).toJS(), |
| | | openEdition: result.open_edition || '', |
| | | config: fromJS(config).toJS() |
| | | }) |
| | | |
| | | this.props.modifyCustomMenu(config) |
| | | window.GLOB.customMenu = config |
| | | } else { |
| | | notification.warning({ |
| | | top: 92, |
| | |
| | | _sort++ |
| | | }) |
| | | card.backElements && card.backElements.forEach(cell => { |
| | | if (cell.eleType !== 'button') return |
| | | this.checkBtn(cell) |
| | | buttons.push(`select '${cell.uuid}' as menuid, '${item.name + '-' + cell.label}' as menuname, '${_sort * 10}' as Sort`) |
| | | _sort++ |
| | | }) |
| | | }) |
| | | } else if (item.type === 'carousel') { |
| | | item.subcards.forEach(card => { |
| | | card.elements && card.elements.forEach(cell => { |
| | | if (cell.eleType !== 'button') return |
| | | this.checkBtn(cell) |
| | | buttons.push(`select '${cell.uuid}' as menuid, '${item.name + '-' + cell.label}' as menuname, '${_sort * 10}' as Sort`) |
| | |
| | | } |
| | | |
| | | submitConfig = () => { |
| | | const { openEdition, MenuType, delButtons, copyButtons, thawButtons } = this.state |
| | | const { MenuType, delButtons, copyButtons, thawButtons } = this.state |
| | | let config = fromJS(this.state.config).toJS() |
| | | |
| | | if (MenuType === 'billPrint' && (!config.firstCount || !config.everyPCount)) { |
| | |
| | | config.enabled = false |
| | | } |
| | | |
| | | let _config = fromJS(config).toJS() |
| | | delete _config.tableFields |
| | | |
| | | let param = { |
| | | func: 'sPC_TrdMenu_AddUpt', |
| | | FstID: _config.fstMenuId || '', |
| | | SndID: _config.parentId, |
| | | ParentID: _config.parentId, |
| | | MenuID: _config.uuid, |
| | | MenuNo: _config.MenuNo || '', |
| | | EasyCode: _config.easyCode || '', |
| | | FstID: config.fstMenuId || '', |
| | | SndID: config.parentId, |
| | | ParentID: config.parentId, |
| | | MenuID: config.uuid, |
| | | MenuNo: config.MenuNo || '', |
| | | EasyCode: config.easyCode || '', |
| | | Template: 'CustomPage', |
| | | MenuName: _config.MenuName || '', |
| | | PageParam: JSON.stringify({Template: 'CustomPage', OpenType: 'newtab'}), |
| | | LongParam: window.btoa(window.encodeURIComponent(JSON.stringify(_config))), |
| | | MenuName: config.MenuName || '', |
| | | PageParam: JSON.stringify({Template: 'CustomPage', OpenType: config.OpenType || 'newtab'}), |
| | | LongParam: window.btoa(window.encodeURIComponent(JSON.stringify(config))), |
| | | open_edition: config.open_edition, |
| | | LText: '', |
| | | LTexttb: '' |
| | | } |
| | |
| | | param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') |
| | | param.secretkey = Utils.encrypt(param.LText, param.timestamp) |
| | | |
| | | if (openEdition) { // 版本管理 |
| | | param.open_edition = openEdition |
| | | } |
| | | |
| | | let btnParam = { // 添加菜单按钮 |
| | | func: 'sPC_Button_AddUpt', |
| | | Type: 40, // 添加菜单下的按钮type为40,按钮下的按钮type为60 |
| | | ParentID: _config.uuid, |
| | | MenuNo: _config.MenuNo, |
| | | ParentID: config.uuid, |
| | | MenuNo: config.MenuNo, |
| | | Template: 'CustomPage', |
| | | PageParam: '', |
| | | LongParam: '', |
| | |
| | | if (result.status) { |
| | | Api.getSystemConfig({ |
| | | func: 's_PrintTemplateMSub', |
| | | ID: _config.uuid, |
| | | ID: config.uuid, |
| | | Images: Utils.getcloudurl(result.Images), |
| | | Remark: '', |
| | | temp_type: 'billprint', |
| | |
| | | if (!res) return |
| | | |
| | | if (res.status) { |
| | | config.open_edition = res.open_edition || '' |
| | | this.setState({ |
| | | oriConfig: fromJS(_config).toJS(), |
| | | openEdition: res.open_edition || '' |
| | | oriConfig: fromJS(config).toJS() |
| | | }) |
| | | |
| | | if (btnParam.LText) { |
| | |
| | | |
| | | let _param = { |
| | | func: 'sPC_ButtonParam_AddUpt', |
| | | ParentID: _config.uuid, |
| | | ParentID: config.uuid, |
| | | MenuID: item.uuid, |
| | | MenuNo: '', |
| | | Template: 'CustomPage', |
| | |
| | | this.setState({ |
| | | config: config |
| | | }) |
| | | |
| | | this.props.modifyCustomMenu(config) |
| | | window.GLOB.customMenu = config |
| | | } |
| | | |
| | | insert = (item) => { |
| | |
| | | config.components.push(item) |
| | | |
| | | this.setState({config}) |
| | | this.props.modifyCustomMenu(config) |
| | | } |
| | | |
| | | /** |
| | | * @description 更新常用表信息,快捷添加后更新配置信息 |
| | | */ |
| | | updatetable = (config, fields) => { |
| | | const { tableFields } = this.state |
| | | |
| | | config.tableFields = fields ? fields : tableFields |
| | | |
| | | this.setState({ |
| | | tableFields: fields ? fields : tableFields, |
| | | config |
| | | }) |
| | | |
| | | this.props.modifyCustomMenu(config) |
| | | window.GLOB.customMenu = config |
| | | } |
| | | |
| | | render () { |
| | |
| | | MenuNo={MenuNo} |
| | | updateConfig={this.updateConfig} |
| | | /> : null} |
| | | {config && MenuType === 'custom' ? <UrlFieldComponent |
| | | config={config} |
| | | updateConfig={this.updateConfig} |
| | | /> : null} |
| | | {config && MenuType === 'home' ? <HomeForm |
| | | dict={dict} |
| | | config={config} |
| | |
| | | updateConfig={this.updateConfig} |
| | | /> : null} |
| | | {/* 表名添加 */} |
| | | {config ? <TableComponent config={config} updatetable={this.updatetable}/> : null} |
| | | {config ? <TableComponent config={config} updatetable={this.updateConfig}/> : null} |
| | | </Panel> |
| | | {/* 组件添加 */} |
| | | <Panel header={dict['mob.component']} key="component"> |
| | |
| | | } |
| | | } |
| | | |
| | | const mapStateToProps = () => { |
| | | return {} |
| | | } |
| | | |
| | | const mapDispatchToProps = (dispatch) => { |
| | | return { |
| | | modifyCustomMenu: (customMenu) => dispatch(modifyCustomMenu(customMenu)) |
| | | } |
| | | } |
| | | |
| | | export default connect(mapStateToProps, mapDispatchToProps)(MenuDesign) |
| | | export default MenuDesign |