From 9ee3d1f9a09a865188baffdffb85f6ad329c7b09 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期日, 19 十二月 2021 01:09:20 +0800 Subject: [PATCH] 2021-12-19 --- src/mob/components/menubar/normal-menubar/menucomponent/index.jsx | 82 +++++++++++++++------------------------- 1 files changed, 31 insertions(+), 51 deletions(-) diff --git a/src/mob/components/menubar/normal-menubar/menucomponent/index.jsx b/src/mob/components/menubar/normal-menubar/menucomponent/index.jsx index e900692..4999373 100644 --- a/src/mob/components/menubar/normal-menubar/menucomponent/index.jsx +++ b/src/mob/components/menubar/normal-menubar/menucomponent/index.jsx @@ -1,17 +1,17 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' import { is, fromJS } from 'immutable' -import { Modal, Popover, Icon, Col } from 'antd' +import { Popover, Icon, Col } from 'antd' import asyncIconComponent from '@/utils/asyncIconComponent' -import zhCN from '@/locales/zh-CN/model.js' -import enUS from '@/locales/en-US/model.js' -import SettingForm from './settingform' +import Utils from '@/utils/utils.js' +import getSettingForm from './options' import { resetStyle } from '@/utils/utils-custom.js' import MKEmitter from '@/utils/events.js' import './index.scss' const CopyComponent = asyncIconComponent(() => import('@/menu/components/share/copycomponent')) +const NormalForm = asyncIconComponent(() => import('@/components/normalform')) class MenuBoxComponent extends Component { static propTpyes = { @@ -24,15 +24,9 @@ } state = { - dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, - card: null, // 鍗$墖淇℃伅锛屽寘鎷鍙嶉潰 - formlist: null, // 璁剧疆琛ㄥ崟淇℃伅 - visible: false, // 妯℃�佹鎺у埗 + card: null } - /** - * @description 鎼滅储鏉′欢鍒濆鍖� - */ UNSAFE_componentWillMount () { const { card } = this.props @@ -46,9 +40,7 @@ } shouldComponentUpdate (nextProps, nextState) { - const { cards } = this.props - - return !is(fromJS(cards.wrap), fromJS(nextProps.cards.wrap)) || !is(fromJS(this.state), fromJS(nextState)) + return !is(fromJS(this.state), fromJS(nextState)) } /** @@ -87,17 +79,24 @@ MKEmitter.emit('changeStyle', [cards.uuid, card.uuid], options, _style) } - settingSubmit = () => { + getSettingForms = () => { + const { cards } = this.props const { card } = this.state - this.settingRef.handleConfirm().then(res => { - this.setState({ - visible: false, - card: {...card, setting: res} - }) + return getSettingForm(card.setting, cards.columns || []) + } - this.props.updateElement({...card, setting: res}) - }) + updateSetting = (res) => { + const { card } = this.state + let _card = {...card, setting: res} + + if (card.setting.type === 'menu' && _card.setting.type !== 'menu') { + _card.oriuuid = _card.uuid + _card.uuid = Utils.getuuid() + } + + this.setState({ card: _card }) + this.props.updateElement(_card) } changeMenu = () => { @@ -107,7 +106,6 @@ window.open(card.setting.linkurl) } else { MKEmitter.emit('changeEditMenu', { - fixed: card.setting.type === 'menu', MenuID: card.setting.type === 'linkmenu' ? card.setting.linkMenuId : card.uuid, copyMenuId: card.setting.type === 'menu' ? card.setting.copyMenuId : '', MenuNo: card.setting.MenuNo || '', @@ -117,14 +115,10 @@ } render() { - const { cards, offset } = this.props - const { card, visible, dict } = this.state + const { offset } = this.props + const { card } = this.state let _style = {...card.style} - - if (_style.shadow) { - _style.boxShadow = '0 0 4px ' + _style.shadow - } _style = resetStyle(_style) @@ -132,7 +126,9 @@ <Col span={card.setting.width || 6} offset={offset || 0}> <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ <div className="mk-popover-control"> - <Icon className="edit" title="缂栬緫" type="edit" onClick={() => this.setState({visible: true})} /> + <NormalForm title="鑿滃崟缂栬緫" width={900} update={this.updateSetting} getForms={this.getSettingForms}> + <Icon type="edit" style={{color: '#1890ff'}} title="缂栬緫"/> + </NormalForm> <CopyComponent type="menucell" card={card}/> <Icon className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle} type="font-colors" /> <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ @@ -152,33 +148,17 @@ fontSize: card.setting.iconFont || 20, padding: card.setting.padding, background: card.setting.background, - color: card.setting.color + color: card.setting.color, + borderRadius: card.setting.borderRadius || '15%' }} type={card.setting.icon}/> + {card.setting.tip ? <sup className="am-badge-text"></sup> : null} </div> : <div className="menu-sign"> - <img style={{width: card.setting.imgWidth, height: card.setting.imgWidth}} src={card.setting.url} alt=""/> + <img style={{width: card.setting.imgWidth, height: card.setting.imgWidth, borderRadius: card.setting.borderRadius || '15%'}} src={card.setting.url} alt=""/> + {card.setting.tip ? <sup className="am-badge-text"></sup> : null} </div>} <div className="menu-name">{card.setting.name}</div> </div> </Popover> - <Modal - wrapClassName="popview-modal" - title={'鑿滃崟璁剧疆'} - visible={visible} - width={800} - maskClosable={false} - okText={dict['model.submit']} - onOk={this.settingSubmit} - onCancel={() => { this.setState({ visible: false }) }} - destroyOnClose - > - <SettingForm - dict={dict} - cards={cards} - setting={card.setting} - inputSubmit={this.settingSubmit} - wrappedComponentRef={(inst) => this.settingRef = inst} - /> - </Modal> </Col> ) } -- Gitblit v1.8.0