From 8701e6928b20cc3c4af763f8e72be5396c2be99d Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期五, 09 十月 2020 18:57:15 +0800 Subject: [PATCH] 2020-10-09 --- src/menu/components/card/cardcellcomponent/index.jsx | 242 +++++++++++++++++++++++++++++++++++++++++++---- 1 files changed, 218 insertions(+), 24 deletions(-) diff --git a/src/menu/components/card/cardcellcomponent/index.jsx b/src/menu/components/card/cardcellcomponent/index.jsx index 8e58563..50a91b6 100644 --- a/src/menu/components/card/cardcellcomponent/index.jsx +++ b/src/menu/components/card/cardcellcomponent/index.jsx @@ -1,22 +1,29 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' import { is, fromJS } from 'immutable' -import { Modal } from 'antd' +import {connect} from 'react-redux' +import { Modal, Button, notification } from 'antd' +import Api from '@/api' +import options from '@/store/options.js' import zhCN from '@/locales/zh-CN/model.js' import enUS from '@/locales/en-US/model.js' import { getCardCellForm } from './formconfig' +import { getActionForm } from '@/menu/actioncomponent/formconfig' import MKEmitter from '@/utils/events.js' import ElementForm from './elementform' import DragElement from './dragaction' +import ActionForm from '@/menu/actioncomponent/actionform' +import CreateFunc from '@/templates/zshare/createfunc' import './index.scss' const { confirm } = Modal class CardCellComponent extends Component { static propTpyes = { - config: PropTypes.object, // 鑿滃崟閰嶇疆淇℃伅 + cards: PropTypes.object, // 鑿滃崟閰嶇疆淇℃伅 + card: PropTypes.object, elements: PropTypes.array, // 鍏冪礌闆� updateElement: PropTypes.func // 鑿滃崟閰嶇疆鏇存柊 } @@ -27,6 +34,7 @@ formlist: null, // 琛ㄥ崟淇℃伅 elements: null, // 鎸夐挳缁� visible: false, // 妯℃�佹鎺у埗 + actvisible: false // 鎸夐挳缂栬緫妯℃�佹 } /** @@ -45,7 +53,7 @@ } shouldComponentUpdate (nextProps, nextState) { - return !is(fromJS(this.props.config), fromJS(nextProps.config)) || !is(fromJS(this.state), fromJS(nextState)) + return !is(fromJS(this.props.cards), fromJS(nextProps.cards)) || !is(fromJS(this.state), fromJS(nextState)) } /** @@ -58,28 +66,31 @@ MKEmitter.removeListener('cardAddElement', this.cardAddElement) } - cardAddElement = (cardId, element) => { - if (cardId !== this.props.config.uuid) return + cardAddElement = (ids, element) => { + if (!ids || ids.length !== 2 || ids[0] !== this.props.cards.uuid || ids[1] !== this.props.card.uuid) return const { elements } = this.state this.setState({elements: [...elements, element]}) - this.handleElement(element) + + if (element.eleType === 'button') { + this.handleAction(element) + } else { + this.handleElement(element) + } } /** * @description 鎸夐挳椤哄簭璋冩暣 */ handleList = (list) => { - const { config } = this.props - this.setState({elements: list}, () => { - this.props.updateElement({...config, elements: list}) + this.props.updateElement(list) }) } /** - * @description 鎸夐挳缂栬緫锛岃幏鍙栨寜閽〃鍗曚俊鎭� + * @description 鍏冪礌缂栬緫锛岃幏鍙栧厓绱犺〃鍗曚俊鎭� */ handleElement = (card) => { this.setState({ @@ -87,6 +98,141 @@ card: card, formlist: getCardCellForm(card) }) + } + + /** + * @description 鎸夐挳缂栬緫锛岃幏鍙栨寜閽〃鍗曚俊鎭� + */ + handleAction = (card) => { + const { menu, cards } = this.props + + let ableField = menu.permFuncField ? menu.permFuncField.join(', ') : '' + let functip = <div> + <p style={{marginBottom: '5px'}}>{this.state.dict['model.tooltip.func.innerface'].replace('@ableField', ableField)}</p> + <p>{this.state.dict['model.tooltip.func.outface']}</p> + </div> + + let menulist = [] + if (menu.fstMenuList) { + menulist = menu.fstMenuList.map(item => { + return { + value: item.MenuID, + label: item.text, + isLeaf: false + } + }) + } + + let modules = this.getModules(menu.components, cards.uuid) + + if (menu.fstMenuList && card.linkmenu && card.linkmenu.length > 0) { + let _param = { + func: 'sPC_Get_FunMenu', + ParentID: card.linkmenu[0], + systemType: options.sysType, + debug: 'Y' + } + + Api.getSystemConfig(_param).then(result => { + if (result.status) { + menulist = menulist.map(item => { + if (item.value === card.linkmenu[0]) { + item.children = result.data.map(item => { + let submenu = { + value: item.ParentID, + label: item.MenuNameP, + children: item.FunMenu.map(cell => { + return { + value: cell.MenuID, + label: cell.MenuName, + MenuID: cell.MenuID, + MenuName: cell.MenuName, + MenuNo: cell.MenuNo, + Ot: cell.Ot, + PageParam: cell.PageParam, + LinkUrl: cell.LinkUrl, + disabled: cell.MenuID === menu.MenuID + } + }) + } + + return submenu + }) + } + return item + }) + } else { + notification.warning({ + top: 92, + message: result.message, + duration: 5 + }) + } + + this.setState({ + actvisible: true, + card: card, + formlist: getActionForm(card, functip, cards.setting, menu.permFuncField, '', menulist, modules) + }) + }) + } else { + this.setState({ + actvisible: true, + card: card, + formlist: getActionForm(card, functip, cards.setting, menu.permFuncField, '', menulist, modules) + }) + } + } + + getModules = (components, selfId) => { + let modules = components.map(item => { + if (item.uuid === selfId) { + return { + children: null + } + } else if (item.format) { + return { + value: item.uuid, + label: item.name + } + } else if (item.type === 'tabs') { + let _item = { + value: item.uuid, + label: item.name, + children: item.subtabs.map(f_tab => { + let subItem = { + value: f_tab.uuid, + label: f_tab.label, + children: this.getModules(f_tab.components, selfId) + } + + if (!subItem.children || subItem.children.length === 0) { + return {children: null} + } + return subItem + }) + } + + _item.children = _item.children.filter(t => t.children !== null) + + if (_item.children.length === 0) { + return {children: null} + } + + return _item + } else { + return { + children: null + } + } + }) + + modules = modules.filter(mod => mod.children !== null) + + if (modules.length === 0) { + return null + } + return modules } /** @@ -105,19 +251,15 @@ this.setState({ card: null, elements: _elements, - visible: false + visible: false, + actvisible: false }) } /** - * @description 鎼滅储淇敼鍚庢彁浜や繚瀛� - * 1銆佸幓闄ょ郴缁熼粯璁ゆ悳绱㈡潯浠� - * 2銆佸瓧娈靛強鎻愮ず鏂囧瓧閲嶅鏍¢獙 - * 3銆佹洿鏂颁笅鎷夎彍鍗曞彲閫夐泦鍚� - * 4銆佷笅鎷夎彍鍗曟暟鎹簮璇硶楠岃瘉 + * @description 鍏冪礌淇敼鍚庢彁浜や繚瀛� */ handleSubmit = () => { - const { config } = this.props const { elements } = this.state this.elementFormRef.handleConfirm().then(ele => { @@ -130,7 +272,28 @@ elements: _elements, visible: false }, () => { - this.props.updateElement({...config, elements: _elements}) + this.props.updateElement(_elements) + }) + }) + } + + /** + * @description 鍏冪礌淇敼鍚庢彁浜や繚瀛� + */ + handleActionSubmit = () => { + const { elements } = this.state + + this.actionFormRef.handleConfirm().then(ele => { + let _elements = elements.map(cell => { + if (cell.uuid === ele.uuid) return ele + return cell + }) + + this.setState({ + elements: _elements, + actvisible: false + }, () => { + this.props.updateElement(_elements) }) }) } @@ -139,7 +302,6 @@ * @description 鎸夐挳鍒犻櫎 */ deleteElement = (card) => { - const { config } = this.props const { dict, elements } = this.state let _this = this @@ -151,7 +313,7 @@ _this.setState({ elements: _elements }, () => { - _this.props.updateElement({...config, elements: _elements}) + _this.props.updateElement(_elements) }) }, onCancel() {} @@ -159,8 +321,8 @@ } render() { - const { config } = this.props - const { elements, visible, card, dict } = this.state + const { cards } = this.props + const { elements, visible, actvisible, card, dict } = this.state return ( <div className="model-menu-card-cell-list"> @@ -185,8 +347,31 @@ card={card} formlist={this.state.formlist} inputSubmit={this.handleSubmit} - config={config} + config={cards} wrappedComponentRef={(inst) => this.elementFormRef = inst} + /> + </Modal> + {/* 缂栬緫鎸夐挳锛氬鍒躲�佺紪杈� */} + <Modal + title={dict['model.action'] + '-' + (card && card.copyType === 'action' ? dict['model.copy'] : dict['model.edit'])} + visible={actvisible} + width={800} + maskClosable={false} + onCancel={this.editModalCancel} + footer={[ + <CreateFunc key="create" dict={dict} ref="btnCreatFunc" trigger={this.creatFunc}/>, + <Button key="cancel" onClick={this.editModalCancel}>{dict['model.cancel']}</Button>, + <Button key="confirm" type="primary" onClick={this.handleActionSubmit}>{dict['model.confirm']}</Button> + ]} + destroyOnClose + > + <ActionForm + dict={dict} + card={card} + formlist={this.state.formlist} + inputSubmit={this.handleActionSubmit} + setting={cards.setting} + wrappedComponentRef={(inst) => this.actionFormRef = inst} /> </Modal> </div> @@ -194,5 +379,14 @@ } } +const mapStateToProps = (state) => { + return { + menu: state.customMenu + } +} -export default CardCellComponent \ No newline at end of file +const mapDispatchToProps = () => { + return {} +} + +export default connect(mapStateToProps, mapDispatchToProps)(CardCellComponent) \ No newline at end of file -- Gitblit v1.8.0