| | |
| | | import PropTypes from 'prop-types' |
| | | import { is, fromJS } from 'immutable' |
| | | import { Popover, Col } from 'antd' |
| | | import { SwapOutlined, ArrowLeftOutlined, ArrowRightOutlined, EditOutlined, FontColorsOutlined, DeleteOutlined } from '@ant-design/icons' |
| | | import { SwapOutlined, ArrowLeftOutlined, ArrowRightOutlined, EditOutlined, FontColorsOutlined, DeleteOutlined, RightOutlined } from '@ant-design/icons' |
| | | |
| | | import asyncIconComponent from '@/utils/asyncIconComponent' |
| | | import Utils from '@/utils/utils.js' |
| | |
| | | |
| | | class MenuBoxComponent extends Component { |
| | | static propTpyes = { |
| | | offset: PropTypes.any, // 偏移量 |
| | | cards: PropTypes.object, // 卡片行配置信息 |
| | | card: PropTypes.object, // 卡片配置信息 |
| | | move: PropTypes.func, // 卡片移动 |
| | |
| | | const { card } = this.state |
| | | |
| | | let _style = card.style ? fromJS(card.style).toJS() : {} |
| | | let options = ['font', 'border', 'padding'] |
| | | let options = ['font', 'border', 'padding', 'margin', 'background'] |
| | | |
| | | MKEmitter.emit('changeStyle', [cards.uuid, card.uuid], options, _style) |
| | | } |
| | |
| | | MKEmitter.emit('changeEditMenu', { |
| | | MenuID: card.setting.type === 'linkmenu' ? card.setting.linkMenuId : card.uuid, |
| | | copyMenuId: card.setting.type === 'menu' ? card.setting.copyMenuId : '', |
| | | clearMenu: card.setting.clearMenu || 'true', |
| | | MenuNo: card.setting.MenuNo || '', |
| | | MenuName: card.setting.name, |
| | | }) |
| | |
| | | } |
| | | |
| | | render() { |
| | | const { offset } = this.props |
| | | const { card } = this.state |
| | | |
| | | let _style = {...card.style} |
| | |
| | | _style = resetStyle(_style) |
| | | |
| | | return ( |
| | | <Col span={card.setting.width || 6} offset={offset || 0}> |
| | | <Col span={card.setting.width || 6}> |
| | | <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ |
| | | <div className="mk-popover-control"> |
| | | <NormalForm title="菜单编辑" width={900} update={this.updateSetting} getForms={this.getSettingForms}> |
| | |
| | | padding: card.setting.padding, |
| | | background: card.setting.background, |
| | | color: card.setting.color, |
| | | borderRadius: card.setting.borderRadius || '15%' |
| | | }} type={card.setting.icon}/> |
| | | borderRadius: card.setting.borderRadius || '15%', |
| | | opacity: !card.setting.icon ? 0 : 1 |
| | | }} type={card.setting.icon || 'cloud'}/> |
| | | {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, 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 className="menu-name" style={{opacity: !card.setting.name ? 0 : 1}}>{card.setting.name || '明科'}</div> |
| | | <RightOutlined className="menu-right" /> |
| | | {!card.setting.name ? <NormalForm title="菜单编辑" width={900} update={this.updateSetting} cancel={() => this.props.deleteElement(card, 'direct')} getForms={this.getSettingForms}> |
| | | <span id={card.uuid}></span> |
| | | </NormalForm> : null} |
| | | </div> |
| | | </Popover> |
| | | </Col> |