From 542054288debe0251270f782daad7fa2c6e53c5b Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期四, 24 十二月 2020 19:24:06 +0800 Subject: [PATCH] 2020-12-24 --- src/menu/components/card/cardcellcomponent/index.jsx | 20 - src/menu/components/card/table-card/index.jsx | 2 src/menu/components/card/data-card/index.jsx | 20 src/menu/components/chart/antv-pie/index.jsx | 2 /dev/null | 70 ----- src/menu/components/chart/antv-bar/index.jsx | 2 src/menu/popview/menuform/index.jsx | 99 +++++++ src/menu/popview/index.scss | 303 ----------------------- src/menu/components/card/prop-card/index.jsx | 2 src/menu/components/table/normal-table/index.jsx | 18 src/menu/popview/index.jsx | 183 ++++++------- src/templates/sharecomponent/searchcomponent/index.scss | 1 src/views/menudesign/index.jsx | 43 ++ src/menu/popview/menuform/index.scss | 10 14 files changed, 259 insertions(+), 516 deletions(-) diff --git a/src/menu/components/card/cardcellcomponent/index.jsx b/src/menu/components/card/cardcellcomponent/index.jsx index 8be4d96..2f42da4 100644 --- a/src/menu/components/card/cardcellcomponent/index.jsx +++ b/src/menu/components/card/cardcellcomponent/index.jsx @@ -519,22 +519,14 @@ handleSubConfig = (item) => { const { cards } = this.props + let btn = fromJS(item).toJS() - if (item.eleType !== 'button') return - if (item.OpenType === 'pop') { - let btn = fromJS(item).toJS() + if (btn.eleType !== 'button') return + + if (btn.OpenType === 'pop') { if (!btn.modal) { btn.modal = { - setting: { - title: btn.label, - width: 60, - cols: '2', - container: 'tab', - focus: '', - finish: 'close', - clickouter: 'unclose', - display: 'modal' - }, + setting: { title: btn.label, width: 60, cols: '2', container: 'tab', focus: '', finish: 'close', clickouter: 'unclose', display: 'modal' }, tables: [], groups: [], fields: [] @@ -542,6 +534,8 @@ } MKEmitter.emit('changeModal', cards, btn) + } else if (btn.OpenType === 'popview') { + MKEmitter.emit('changePopview', cards, btn) } } diff --git a/src/menu/components/card/data-card/index.jsx b/src/menu/components/card/data-card/index.jsx index aaa9ffe..aec0a96 100644 --- a/src/menu/components/card/data-card/index.jsx +++ b/src/menu/components/card/data-card/index.jsx @@ -1,6 +1,6 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' -import {connect} from 'react-redux' +import { connect } from 'react-redux' import { is, fromJS } from 'immutable' import { Icon, Popover, Modal, Pagination, notification } from 'antd' @@ -275,28 +275,22 @@ MKEmitter.emit('addButton', card.uuid, newcard) } - setSubConfig = (btn) => { + setSubConfig = (item) => { const { card } = this.state + let btn = fromJS(item).toJS() if (btn.OpenType === 'pop') { if (!btn.modal) { btn.modal = { - setting: { - title: btn.label, - width: 60, - cols: '2', - container: 'tab', - focus: '', - finish: 'close', - clickouter: 'unclose', - display: 'modal' - }, + setting: { title: btn.label, width: 60, cols: '2', container: 'tab', focus: '', finish: 'close', clickouter: 'unclose', display: 'modal' }, tables: [], groups: [], fields: [] } } MKEmitter.emit('changeModal', card, btn) + } else if (btn.OpenType === 'popview') { + MKEmitter.emit('changePopview', card, btn) } } @@ -346,6 +340,7 @@ card.btnlog = logs this.setState({ card }) + this.props.updateConfig(card) notification.success({ top: 92, message: '鎭㈠鎴愬姛锛�', @@ -354,6 +349,7 @@ } else { card.btnlog = logs this.setState({ card }) + this.props.updateConfig(card) notification.success({ top: 92, message: '娓呴櫎鎴愬姛锛�', diff --git a/src/menu/components/card/prop-card/index.jsx b/src/menu/components/card/prop-card/index.jsx index f6ab4a3..aefe5b6 100644 --- a/src/menu/components/card/prop-card/index.jsx +++ b/src/menu/components/card/prop-card/index.jsx @@ -278,6 +278,7 @@ card.btnlog = logs this.setState({ card }) + this.props.updateConfig(card) if (!done) { notification.warning({ top: 92, @@ -294,6 +295,7 @@ } else { card.btnlog = logs this.setState({ card }) + this.props.updateConfig(card) notification.success({ top: 92, message: '娓呴櫎鎴愬姛锛�', diff --git a/src/menu/components/card/table-card/index.jsx b/src/menu/components/card/table-card/index.jsx index de7ee8f..eae5304 100644 --- a/src/menu/components/card/table-card/index.jsx +++ b/src/menu/components/card/table-card/index.jsx @@ -281,6 +281,7 @@ card.btnlog = logs this.setState({ card }) + this.props.updateConfig(card) if (!done) { notification.warning({ top: 92, @@ -297,6 +298,7 @@ } else { card.btnlog = logs this.setState({ card }) + this.props.updateConfig(card) notification.success({ top: 92, message: '娓呴櫎鎴愬姛锛�', diff --git a/src/menu/components/chart/antv-bar/index.jsx b/src/menu/components/chart/antv-bar/index.jsx index bc4abb9..14f13f7 100644 --- a/src/menu/components/chart/antv-bar/index.jsx +++ b/src/menu/components/chart/antv-bar/index.jsx @@ -832,6 +832,7 @@ card.btnlog = logs this.setState({ card }) + this.props.updateConfig(card) notification.success({ top: 92, message: '鎭㈠鎴愬姛锛�', @@ -840,6 +841,7 @@ } else { card.btnlog = logs this.setState({ card }) + this.props.updateConfig(card) notification.success({ top: 92, message: '娓呴櫎鎴愬姛锛�', diff --git a/src/menu/components/chart/antv-pie/index.jsx b/src/menu/components/chart/antv-pie/index.jsx index 704e5e9..3535bbb 100644 --- a/src/menu/components/chart/antv-pie/index.jsx +++ b/src/menu/components/chart/antv-pie/index.jsx @@ -404,6 +404,7 @@ card.btnlog = logs this.setState({ card }) + this.props.updateConfig(card) notification.success({ top: 92, message: '鎭㈠鎴愬姛锛�', @@ -412,6 +413,7 @@ } else { card.btnlog = logs this.setState({ card }) + this.props.updateConfig(card) notification.success({ top: 92, message: '娓呴櫎鎴愬姛锛�', diff --git a/src/menu/components/table/normal-table/index.jsx b/src/menu/components/table/normal-table/index.jsx index c83b4c4..7d72415 100644 --- a/src/menu/components/table/normal-table/index.jsx +++ b/src/menu/components/table/normal-table/index.jsx @@ -236,28 +236,22 @@ this.props.updateConfig(config) } - setSubConfig = (btn) => { + setSubConfig = (item) => { const { card } = this.state + let btn = fromJS(item).toJS() if (btn.OpenType === 'pop') { if (!btn.modal) { btn.modal = { - setting: { - title: btn.label, - width: 60, - cols: '2', - container: 'tab', - focus: '', - finish: 'close', - clickouter: 'unclose', - display: 'modal' - }, + setting: { title: btn.label, width: 60, cols: '2', container: 'tab', focus: '', finish: 'close', clickouter: 'unclose', display: 'modal' }, tables: [], groups: [], fields: [] } } MKEmitter.emit('changeModal', card, btn) + } else if (btn.OpenType === 'popview') { + MKEmitter.emit('changePopview', card, btn) } } @@ -304,6 +298,7 @@ card.btnlog = logs this.setState({ card }) + this.props.updateConfig(card) notification.success({ top: 92, message: '鎭㈠鎴愬姛锛�', @@ -312,6 +307,7 @@ } else { card.btnlog = logs this.setState({ card }) + this.props.updateConfig(card) notification.success({ top: 92, message: '娓呴櫎鎴愬姛锛�', diff --git a/src/menu/popview/controller.jsx b/src/menu/popview/controller.jsx deleted file mode 100644 index 1029431..0000000 --- a/src/menu/popview/controller.jsx +++ /dev/null @@ -1,70 +0,0 @@ -import React, {Component} from 'react' -import { is, fromJS } from 'immutable' - -import MKEmitter from '@/utils/events.js' -import PopConfig from '@/menu/popview' - -class PopviewController extends Component { - state = { - btn: null, - config: null, - visible: false - } - - shouldComponentUpdate (nextProps, nextState) { - return !is(fromJS(this.state), fromJS(nextState)) - } - - componentDidMount () { - MKEmitter.addListener('changePopview', this.initConfig) - } - - /** - * @description 缁勪欢閿�姣侊紝娓呴櫎state鏇存柊锛屾竻闄ゅ揩鎹烽敭璁剧疆 - */ - componentWillUnmount () { - this.setState = () => { - return - } - MKEmitter.removeListener('changePopview', this.initConfig) - } - - initConfig = (config, btn) => { - this.setState({ - visible: true, - config: fromJS(config).toJS(), - btn: fromJS(btn).toJS() - }) - } - - handleBack = () => { - this.setState({ - visible: false, - config: null, - btn: null - }) - } - - handleSave = (modal) => { - const { config, btn } = this.state - MKEmitter.emit('submitModal', config, btn, modal) - - this.setState({ - visible: false, - config: null, - btn: null - }) - } - - render () { - const { config, btn, visible } = this.state - - if (!visible) return null - - return ( - <PopConfig btn={btn} componentConfig={config} handleBack={this.handleBack} handleSave={this.handleSave}/> - ) - } -} - -export default PopviewController \ No newline at end of file diff --git a/src/menu/popview/index.jsx b/src/menu/popview/index.jsx index 471b71a..eb19d48 100644 --- a/src/menu/popview/index.jsx +++ b/src/menu/popview/index.jsx @@ -19,13 +19,11 @@ const { Panel } = Collapse const { confirm } = Modal -const Header = asyncComponent(() => import('@/menu/header')) +const MenuForm = asyncComponent(() => import('./menuform')) const SourceWrap = asyncComponent(() => import('@/menu/modelsource')) const MenuShell = asyncComponent(() => import('@/menu/menushell')) const BgController = asyncComponent(() => import('@/menu/bgcontroller')) const PaddingController = asyncComponent(() => import('@/menu/padcontroller')) -const StyleController = asyncComponent(() => import('@/menu/stylecontroller')) -const ModalController = asyncComponent(() => import('@/menu/modalconfig/controller')) const TableComponent = asyncComponent(() => import('@/templates/sharecomponent/tablecomponent')) sessionStorage.setItem('isEditState', 'true') @@ -33,7 +31,6 @@ class MenuDesign extends Component { static propTpyes = { btn: PropTypes.object, - handleSave: PropTypes.func, handleBack: PropTypes.func } @@ -78,24 +75,25 @@ const { oriConfig, config } = this.state if (!config) { - window.close() + this.props.handleBack() return } let _config = fromJS(config).toJS() delete _config.tableFields + const _this = this if (!is(fromJS(oriConfig), fromJS(_config))) { confirm({ title: '閰嶇疆宸蹭慨鏀癸紝鏀惧純淇濆瓨鍚楋紵', content: '', onOk() { - window.close() + _this.props.handleBack() }, onCancel() {} }) } else { - window.close() + this.props.handleBack() } } @@ -112,7 +110,7 @@ let config = null try { - config = JSON.parse(window.decodeURIComponent(window.atob(result.LongParam))) + config = result.LongParam ? JSON.parse(window.decodeURIComponent(window.atob(result.LongParam))) : null } catch (e) { console.warn('Parse Failure') config = null @@ -144,8 +142,6 @@ config: fromJS(config).toJS(), openEdition: result.open_edition || '', }) - - this.getRoleFields() } else { notification.warning({ top: 92, @@ -229,7 +225,8 @@ } submitConfig = () => { - const { openEdition } = this.state + // const { btn } = this.props + const { openEdition, delButtons } = this.state let config = fromJS(this.state.config).toJS() if (config.cacheUseful === 'true' && !config.cacheTime) { @@ -251,24 +248,16 @@ delete _config.tableFields let param = { - func: 'sPC_TrdMenu_AddUpt', - FstID: _config.fstMenuId || '', - SndID: _config.parentId, - ParentID: _config.parentId, + func: 'sPC_Tab_AddUpt', MenuID: _config.uuid, - MenuNo: _config.MenuNo || '', - EasyCode: _config.easyCode || '', + MenuNo: _config.tabNo, Template: 'CustomPage', - MenuName: _config.MenuName || '', - PageParam: JSON.stringify({Template: 'CustomPage', OpenType: 'newtab'}), - LongParam: window.btoa(window.encodeURIComponent(JSON.stringify(_config))), - LText: '', - LTexttb: '' + MenuName: _config.tabName, + Remark: '', + Sort: 0, + PageParam: JSON.stringify({Template: 'CustomPage'}), + LongParam: window.btoa(window.encodeURIComponent(JSON.stringify(_config))) } - - param.LText = Utils.formatOptions(param.LText) - param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') - param.secretkey = Utils.encrypt(param.LText, param.timestamp) if (openEdition) { // 鐗堟湰绠$悊 param.open_edition = openEdition @@ -295,11 +284,36 @@ menuloading: true }, () => { new Promise(resolve => { - resolve(true) + if (delButtons.length === 0) { + resolve({ + status: true + }) + } else { + let _param = { + func: 'sPC_MainMenu_Del', + MenuID: delButtons.join(',') + } + Api.getSystemConfig(_param).then(res => { + resolve(res) + }) + } }).then(res => { - if (!res) return - - return Api.getSystemConfig(param) + if (res.status) { + this.setState({ + delButtons: [] + }) + return Api.getSystemConfig(param) + } else { + this.setState({ + menuloading: false + }) + notification.warning({ + top: 92, + message: res.message, + duration: 5 + }) + return false + } }).then(res => { if (!res) return @@ -355,37 +369,6 @@ }) } }) - }) - } - - getRoleFields = () => { - Api.getSystemConfig({func: 'sPC_Get_Roles_sModular'}).then(res => { - if (res.status) { - let _permFuncField = [] - let _sysRoles = [] - - if (res.Roles && res.Roles.length > 0) { - _sysRoles = res.Roles.map(role => { - return { - uuid: Utils.getuuid(), - value: role.RoleID, - text: role.RoleName - } - }) - } - - if (res.sModular && res.sModular.length > 0) { - res.sModular.forEach(field => { - if (field.ModularNo) { - _permFuncField.push(field.ModularNo) - } - }) - _permFuncField = _permFuncField.sort() - } - - sessionStorage.setItem('sysRoles', JSON.stringify(_sysRoles)) - sessionStorage.setItem('permFuncField', JSON.stringify(_permFuncField)) - } }) } @@ -462,50 +445,48 @@ } render () { + const { btn } = this.props const { activeKey, MenuType, dict, config, menuloading } = this.state return ( - <div className="pc-menu-view" id="view"> - <Header /> - <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"> - {/* 琛ㄥ悕娣诲姞 */} - {config ? <TableComponent config={config} updatetable={this.updatetable}/> : null} - </Panel> - {/* 缁勪欢娣诲姞 */} - <Panel header={dict['mob.component']} key="component"> - <SourceWrap MenuType={MenuType} /> - </Panel> - <Panel header={'鑳屾櫙'} key="background"> - {config ? <BgController config={config} updateConfig={this.updateConfig} /> : null} - </Panel> - <Panel header={'鍐呰竟璺�'} key="padding"> - {config ? <PaddingController config={config} updateConfig={this.updateConfig} /> : null} - </Panel> - </Collapse> - </div> - <div className={'menu-view ' + (menuloading ? 'saving' : '')}> - <Card title={ - <div> {config && config.MenuName} </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={menuloading}>{dict['mob.save']}</Button> - <Button type="default" onClick={this.closeView}>{dict['mob.return']}</Button> - </div> - } style={{ width: '100%' }}> - {config && config.components ? <MenuShell menu={config} handleList={this.updateConfig} /> : null} - </Card> - </div> + <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"> + {/* 鑿滃崟淇℃伅 */} + {config ? <MenuForm dict={dict} config={config} btn={btn} updateConfig={this.updateConfig}/> : null} + {/* 琛ㄥ悕娣诲姞 */} + {config ? <TableComponent config={config} updatetable={this.updatetable}/> : null} + </Panel> + {/* 缁勪欢娣诲姞 */} + <Panel header={dict['mob.component']} key="component"> + <SourceWrap MenuType={MenuType} /> + </Panel> + <Panel header={'鑳屾櫙'} key="background"> + {config ? <BgController config={config} updateConfig={this.updateConfig} /> : null} + </Panel> + <Panel header={'鍐呰竟璺�'} key="padding"> + {config ? <PaddingController config={config} updateConfig={this.updateConfig} /> : null} + </Panel> + </Collapse> </div> - </DndProvider> - <StyleController /> - <ModalController /> - </div> + <div className={'menu-view ' + (menuloading ? 'saving' : '')}> + <Card title={ + <div> {config && config.MenuName} </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={menuloading}>{dict['mob.save']}</Button> + <Button type="default" onClick={this.closeView}>{dict['mob.return']}</Button> + </div> + } style={{ width: '100%' }}> + {config && config.components ? <MenuShell menu={config} handleList={this.updateConfig} /> : null} + </Card> + </div> + </div> + </DndProvider> ) } } diff --git a/src/menu/popview/index.scss b/src/menu/popview/index.scss index 7dcf66e..e69de29 100644 --- a/src/menu/popview/index.scss +++ b/src/menu/popview/index.scss @@ -1,303 +0,0 @@ -.modal-form-board { - position: fixed; - z-index: 1070; - padding-top: 48px; - top: 0px; - left: 0px; - right: 0px; - bottom: 0px; - background: rgba(0, 0, 0, 0.35); - display: flex; - .tools { - flex: 1; - background: #ffffff; - border-right: 1px solid #d9d9d9; - height: 100%; - overflow-y: auto; - padding-bottom: 30px; - .ant-collapse-borderless { - background-color: #ffffff; - } - .ant-collapse-item { - border: 0; - } - .ant-input-search { - margin-top: 10px; - } - .ant-collapse-item.ant-collapse-item-active { - border-bottom: 1px solid #d9d9d9; - } - .ant-collapse .ant-collapse-header { - padding: 11px 16px 10px 40px; - border-bottom: 1px solid #d9d9d9; - background: #1890ff; - color: #ffffff; - } - .ant-collapse-content-box { - .ant-form-item { - margin-bottom: 10px; - .ant-form-item-label { - text-align: left; - height: 25px; - line-height: 25px; - } - } - .ant-btn { - margin-bottom: 10px; - } - } - .search-element { - padding-top: 10px; - li { - padding: 0px 16px 10px; - div { - cursor: move; - } - } - } - .tables { - .ant-select-selection-selected-value { - opacity: 0.4!important; - } - } - .ant-list { - margin-top: 20px; - .ant-list-item { - display: -webkit-box; - padding-right: 20px; - position: relative; - padding-left: 5px; - overflow: hidden; - text-overflow: ellipsis; - -webkit-line-clamp: 2; - -webkit-box-orient: vertical; - width: 100%; - .anticon { - position: absolute; - top: 0px; - right: 0px; - padding: 3px 3px 10px 10px; - cursor: pointer; - } - .bottom-mask { - position: absolute; - width: 100%; - height: 8px; - bottom: 0; - left: 0; - background: #ffffff; - border-radius: 8px; - } - } - } - } - .tools::-webkit-scrollbar { - width: 4px; - } - .tools::-webkit-scrollbar-thumb { - border-radius: 5px; - box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.08); - background: rgba(0, 0, 0, 0.08); - } - .tools::-webkit-scrollbar-track { - box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.05); - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.07); - background: rgba(0, 0, 0, 0); - } - .setting { - position: relative; - width: calc(100vw - 235px); - height: 100%; - overflow-y: hidden; - background: #ffffff; - .ant-card-head { - min-height: 44px; - } - .ant-card-head-title { - padding: 5px 0; - color: #1890ff; - } - .ant-card-extra { - padding: 5px 0; - button { - margin-left: 20px; - } - } - .ant-card-body { - position: relative; - padding: 0; - .ant-modal-content { - max-width: 95%; - margin: 0 auto; - margin-top: 30px; - .ant-modal-header { - position: relative; - z-index: 10; - background: transparent; - min-height: 50px; - } - .ant-modal-close { - opacity: 0.3; - } - .ant-modal-footer { - position: relative; - button { - opacity: 0.3; - } - } - .action-mask { - position: absolute; - top: 0px; - left: 0px; - right: 0px; - bottom: 0px; - } - } - .modal-form { - padding: 0px 24px; - min-height: 87px; - .group-title { - position: relative; - min-height: 22px; - margin-bottom: 10px; - padding-top: 10px; - border-bottom: 1px solid #e8e8e8; - - span { - padding: 0 5px 5px; - } - } - > .ant-row { - min-height: 120px; - } - .ant-row .ant-col-6 { - padding: 0 12px!important; - } - .ant-row.ant-form-item .ant-col { - padding: 0; - } - .textarea2, .textarea4 { - padding-left: 7px; - } - .page-card { - position: relative; - background: #ffffff; - border-radius: 2px; - margin-bottom: 15px; - .ant-form-item { - cursor: move; - display: flex; - margin-bottom: 0px; - .ant-form-item-label { - overflow: visible; - position: relative; - height: 40px; - label { - width: 100%; - cursor: move; - overflow: hidden; - display: inline-block; - text-overflow: ellipsis; - white-space: nowrap; - } - } - .ant-form-item-control-wrapper { - position: relative; - .ant-select { - width: 100%; - margin-top: 4px; - } - .ant-calendar-picker { - width: 100%; - margin-top: 4px; - } - .ant-input-number { - width: 100%; - margin-top: 4px; - } - } - .ant-form-item-control-wrapper::after { - content: ''; - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - opacity: 0; - z-index: 1; - } - .ant-col-cuslabel { - width: 10.5%; - } - .ant-col-cuswrap { - width: 89.5%; - } - } - } - .ant-calendar-picker { - min-width: 100px!important; - } - } - > .anticon-setting { - position: absolute; - font-size: 16px; - right: 5px; - top: 5px; - padding: 10px; - cursor: pointer; - } - .paste-Icon { - position: absolute; - font-size: 16px; - right: 15px; - top: 65px; - } - } - } - .setting { - overflow-y: auto; - } - .setting::-webkit-scrollbar { - width: 7px; - } - .setting::-webkit-scrollbar-thumb { - border-radius: 5px; - box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.13); - background: rgba(0, 0, 0, 0.13); - } - .setting::-webkit-scrollbar-track { - box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.05); - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.07); - background: rgba(0, 0, 0, 0); - } -} - -.modal-fields { - .ant-modal { - top: 50px; - padding-bottom: 5px; - .ant-modal-body { - max-height: calc(100vh - 190px); - overflow-y: auto; - .ant-empty { - margin: 15vh 8px; - } - } - .ant-modal-body::-webkit-scrollbar { - width: 7px; - } - .ant-modal-body::-webkit-scrollbar-thumb { - border-radius: 5px; - box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.13); - background: rgba(0, 0, 0, 0.13); - } - .ant-modal-body::-webkit-scrollbar-track { - box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.05); - border-radius: 3px; - border: 1px solid rgba(0, 0, 0, 0.07); - background: rgba(0, 0, 0, 0); - } - } -} \ No newline at end of file diff --git a/src/menu/popview/menuform/index.jsx b/src/menu/popview/menuform/index.jsx new file mode 100644 index 0000000..99bb927 --- /dev/null +++ b/src/menu/popview/menuform/index.jsx @@ -0,0 +1,99 @@ +import React, {Component} from 'react' +import PropTypes from 'prop-types' +import { Form, Row, Col, Radio, Icon, Tooltip, InputNumber } from 'antd' + +import './index.scss' + +class CustomMenuForm extends Component { + static propTpyes = { + dict: PropTypes.object, // 瀛楀吀椤� + btn: PropTypes.object, + config: PropTypes.object, + updateConfig: PropTypes.func + } + + changeCacheDay = (val) => { + if (typeof(val) !== 'number') { + val = '' + } + this.props.updateConfig({...this.props.config, cacheTime: val}) + } + + selectChange = (key, value) => { + const { config } = this.props + + if (key === 'cacheUseful') { + this.props.updateConfig({...config, cacheUseful: value}) + } else if (key === 'timeUnit') { + this.props.updateConfig({...config, timeUnit: value}) + } + } + + render() { + const { dict, config } = this.props + const { getFieldDecorator } = this.props.form + const formItemLayout = { + labelCol: { + xs: { span: 24 }, + sm: { span: 8 } + }, + wrapperCol: { + xs: { span: 24 }, + sm: { span: 16 } + } + } + + return ( + <Form {...formItemLayout} className="custom-menu-form"> + <Row> + <Col span={24}> + <Form.Item label={ + <Tooltip placement="topLeft" title="瀵逛簬涓嶇粡甯告�у彉鍔ㄧ殑淇℃伅锛岀紦瀛樻暟鎹湁鍔╀簬鎻愰珮鏌ヨ鏁堢巼銆�"> + <Icon type="question-circle" /> + 缂撳瓨鏁版嵁 + </Tooltip> + }> + {getFieldDecorator('cacheUseful', { + initialValue: config.cacheUseful || 'false' + })( + <Radio.Group onChange={(e) => {this.selectChange('cacheUseful', e.target.value)}}> + <Radio value="true">浣跨敤</Radio> + <Radio value="false">涓嶄娇鐢�</Radio> + </Radio.Group> + )} + </Form.Item> + </Col> + {config.cacheUseful === 'true' ? <Col span={24}> + <Form.Item label="鍗曚綅"> + {getFieldDecorator('timeUnit', { + initialValue: config.timeUnit || 'day' + })( + <Radio.Group onChange={(e) => {this.selectChange('timeUnit', e.target.value)}}> + <Radio value="day">澶�</Radio> + <Radio value="hour">灏忔椂</Radio> + </Radio.Group> + )} + </Form.Item> + </Col> : null} + {config.cacheUseful === 'true' ? <Col span={24}> + <Form.Item label="鏃堕暱"> + {getFieldDecorator('cacheTime', { + initialValue: config.cacheTime, + rules: [ + { + required: true, + message: dict['mob.required.input'] + '鏃堕暱!' + } + ] + })( + <InputNumber min={1} max={config.timeUnit !== 'hour' ? 7 : 23} precision={0} onChange={this.changeCacheDay}/> + )} + </Form.Item> + </Col> : null} + </Row> + </Form> + ) + } +} + +export default Form.create()(CustomMenuForm) \ No newline at end of file diff --git a/src/menu/popview/menuform/index.scss b/src/menu/popview/menuform/index.scss new file mode 100644 index 0000000..71a1a33 --- /dev/null +++ b/src/menu/popview/menuform/index.scss @@ -0,0 +1,10 @@ +.custom-menu-form { + .anticon-question-circle { + color: #c49f47; + position: relative; + left: -3px; + } + .ant-input-number { + width: 100%; + } +} \ No newline at end of file diff --git a/src/templates/sharecomponent/searchcomponent/index.scss b/src/templates/sharecomponent/searchcomponent/index.scss index fb53173..cf4253b 100644 --- a/src/templates/sharecomponent/searchcomponent/index.scss +++ b/src/templates/sharecomponent/searchcomponent/index.scss @@ -23,6 +23,7 @@ background: #ffffff; border-radius: 2px; padding-bottom: 15px; + height: 55px; .ant-form-item { margin-bottom: 0px; .ant-form-item-control-wrapper { diff --git a/src/views/menudesign/index.jsx b/src/views/menudesign/index.jsx index 2dfb63e..26150f8 100644 --- a/src/views/menudesign/index.jsx +++ b/src/views/menudesign/index.jsx @@ -33,7 +33,7 @@ const PaddingController = asyncComponent(() => import('@/menu/padcontroller')) const StyleController = asyncComponent(() => import('@/menu/stylecontroller')) const ModalController = asyncComponent(() => import('@/menu/modalconfig/controller')) -const PopviewController = asyncComponent(() => import('@/menu/popview/controller')) +const PopviewController = asyncComponent(() => import('@/menu/popview')) const TableComponent = asyncComponent(() => import('@/templates/sharecomponent/tablecomponent')) sessionStorage.setItem('isEditState', 'true') @@ -53,6 +53,8 @@ oriConfig: null, openEdition: '', config: null, + popBtn: null, // 寮圭獥鏍囩椤� + visible: false } UNSAFE_componentWillMount() { @@ -83,6 +85,7 @@ componentDidMount () { MKEmitter.addListener('delButtons', this.delButtons) + MKEmitter.addListener('changePopview', this.initPopview) } /** @@ -93,10 +96,38 @@ return } MKEmitter.removeListener('delButtons', this.delButtons) + MKEmitter.removeListener('changePopview', this.initPopview) } delButtons = (items) => { this.setState({delButtons: [...this.state.delButtons, ...items]}) + } + + initPopview = (card, btn) => { + const { oriConfig, config } = this.state + + let _config = fromJS(config).toJS() + delete _config.tableFields + + if (!is(fromJS(oriConfig), fromJS(_config))) { + notification.warning({ + top: 92, + message: '閰嶇疆宸蹭慨鏀癸紝璇蜂繚瀛橈紒', + duration: 5 + }) + return + } + + btn.config = _config + btn.component = card + + this.setState({popBtn: btn, visible: true}) + } + + handleBack = () => { + this.setState({popBtn: null, delButtons: []}, () => { + this.setState({visible: false}) + }) } closeView = () => { @@ -137,7 +168,7 @@ let config = null try { - config = JSON.parse(window.decodeURIComponent(window.atob(result.LongParam))) + config = result.LongParam ? JSON.parse(window.decodeURIComponent(window.atob(result.LongParam))) : null } catch (e) { console.warn('Parse Failure') config = null @@ -593,13 +624,13 @@ } render () { - const { activeKey, MenuType, dict, MenuId, config, ParentId, MenuName, MenuNo, menuloading } = this.state + const { activeKey, MenuType, popBtn, visible, dict, MenuId, config, ParentId, MenuName, MenuNo, menuloading } = this.state return ( <ConfigProvider locale={_locale}> <div className="pc-menu-view" id="view"> <Header /> - <DndProvider backend={HTML5Backend}> + {!popBtn && !visible ? <DndProvider backend={HTML5Backend}> <div className="menu-body"> <div className="menu-setting"> <Collapse accordion activeKey={activeKey} bordered={false} onChange={(key) => this.setState({activeKey: key})}> @@ -654,10 +685,10 @@ </Card> </div> </div> - </DndProvider> + </DndProvider> : null} + {popBtn && visible ? <PopviewController btn={popBtn} handleBack={this.handleBack}/> : null} <StyleController /> <ModalController /> - <PopviewController /> </div> </ConfigProvider> ) -- Gitblit v1.8.0