| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { is, fromJS } from 'immutable' |
| | | import { Popover, Button } from 'antd' |
| | | import { EditOutlined, ToolOutlined, DeleteOutlined, FontColorsOutlined, PrinterOutlined } from '@ant-design/icons' |
| | | import { Popover, Button, Modal } from 'antd' |
| | | import { EditOutlined, ToolOutlined, DeleteOutlined, FontColorsOutlined, PrinterOutlined, UngroupOutlined } from '@ant-design/icons' |
| | | |
| | | import MKEmitter from '@/utils/events.js' |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | |
| | | import getSettingForm from './options' |
| | | import './index.scss' |
| | | |
| | | const { confirm } = Modal |
| | | const NormalForm = asyncIconComponent(() => import('@/components/normalform')) |
| | | const CopyComponent = asyncIconComponent(() => import('@/menu/components/share/copycomponent')) |
| | | const NormalHeader = asyncComponent(() => import('@/menu/components/share/normalheader')) |
| | |
| | | static propTpyes = { |
| | | group: PropTypes.object, |
| | | deletecomponent: PropTypes.func, |
| | | unGroup: PropTypes.func, |
| | | updateConfig: PropTypes.func, |
| | | } |
| | | |
| | |
| | | this.updateComponent(group) |
| | | } |
| | | |
| | | unGroup = () => { |
| | | const { group } = this.state |
| | | |
| | | if (group.components.length === 0) return |
| | | |
| | | const _this = this |
| | | confirm({ |
| | | title: '确定释放分组元素吗?', |
| | | content: '', |
| | | onOk() { |
| | | _this.props.unGroup(group.uuid) |
| | | |
| | | setTimeout(() => { |
| | | _this.updataGroup() |
| | | }, 10) |
| | | }, |
| | | onCancel() {} |
| | | }) |
| | | } |
| | | |
| | | updataGroup = () => { |
| | | const { group } = this.props |
| | | |
| | | if (group.components.length === 0) { |
| | | this.setState({ |
| | | group: fromJS(group).toJS() |
| | | }) |
| | | } |
| | | } |
| | | |
| | | render() { |
| | | const { group } = this.state |
| | | let _style = resetStyle(group.style) |
| | |
| | | <EditOutlined style={{color: '#1890ff'}} title="编辑"/> |
| | | </NormalForm> |
| | | <CopyComponent type="tabs" card={group}/> |
| | | <UngroupOutlined title="释放" style={group.components.length > 0 ? {color: '#32c5d2'} : {color: '#eeeeee', cursor: 'not-allowed'}} onClick={this.unGroup}/> |
| | | <PasteComponent insert={this.insert} /> |
| | | <FontColorsOutlined className="style" title="调整样式" onClick={this.changeStyle}/> |
| | | <DeleteOutlined className="close" title="delete" onClick={() => this.props.deletecomponent(group.uuid)} /> |