| | |
| | | formlist: null, // 设置表单信息 |
| | | elements: null, // 编辑组 |
| | | side: 'front', |
| | | timestamp: '', |
| | | appType: sessionStorage.getItem('appType'), |
| | | visible: false |
| | | } |
| | |
| | | const { card } = this.props |
| | | |
| | | this.setState({ |
| | | timestamp: new Date().getTime() + '', |
| | | card: fromJS(card).toJS(), |
| | | elements: fromJS(card.elements).toJS(), |
| | | }) |
| | |
| | | _elements = fromJS(card.backElements).toJS() |
| | | } |
| | | |
| | | this.setState({side: _side, elements: _elements}) |
| | | this.setState({side: _side, elements: _elements, timestamp: new Date().getTime() + ''}) |
| | | } |
| | | |
| | | addElement = () => { |
| | |
| | | okText: '确定', |
| | | cancelText: '取消', |
| | | onOk() { |
| | | that.setState({ card: _card, side: '', elements: fromJS(_card.elements).toJS() }, () => { |
| | | that.setState({ side: 'front' }) |
| | | }) |
| | | that.setState({ card: _card, side: 'front', timestamp: new Date().getTime() + '', elements: fromJS(_card.elements).toJS() }) |
| | | that.props.updateElement(_card) |
| | | }, |
| | | onCancel() {} |
| | |
| | | if (side === 'back' && res.type === 'simple') { |
| | | this.setState({ |
| | | side: 'front', |
| | | timestamp: new Date().getTime() + '', |
| | | elements: fromJS(_card.elements).toJS() |
| | | }) |
| | | } |
| | |
| | | this.props.updateElement(_card) |
| | | } |
| | | |
| | | updateFields = (elements, resolve, type) => { |
| | | const { card, side } = this.state |
| | | |
| | | let items = elements |
| | | |
| | | if (type === 'form') { |
| | | items = [] |
| | | |
| | | elements.forEach(item => { |
| | | let cell = { |
| | | uuid: Utils.getuuid(), |
| | | eleType: 'text', |
| | | height: 1, |
| | | innerHeight: 21, |
| | | prefix: item.label ? item.label + ': ' : '', |
| | | datatype: item.field ? 'dynamic' : 'static', |
| | | field: item.field || '', |
| | | width: item.span || 12, |
| | | value: '', |
| | | style: {marginBottom: '15px'} |
| | | } |
| | | |
| | | if (item.type === 'number') { |
| | | cell.eleType = 'number' |
| | | cell.decimal = typeof(item.decimal) === 'number' ? item.decimal : '' |
| | | } |
| | | |
| | | items.push(cell) |
| | | }) |
| | | } |
| | | |
| | | if (items.length === 0) { |
| | | resolve({status: false, message: '元素不可为空!'}) |
| | | return |
| | | } |
| | | |
| | | let _card = { ...card } |
| | | let _card2 = { ...card } |
| | | let pass = false |
| | | |
| | | if (side === 'back') { |
| | | if (!_card.backElements || _card.backElements.length === 0) { |
| | | _card.backElements = items |
| | | pass = true |
| | | } else { |
| | | _card.backElements = items |
| | | _card2.backElements = [...card.backElements, ...items] |
| | | } |
| | | } else { |
| | | if (!_card.elements || _card.elements.length === 0) { |
| | | _card.elements = items |
| | | pass = true |
| | | } else { |
| | | _card.elements = items |
| | | _card2.elements = [...card.elements, ...items] |
| | | } |
| | | } |
| | | |
| | | if (pass) { |
| | | this.setState({ |
| | | card: _card, |
| | | timestamp: new Date().getTime() + '', |
| | | elements: side === 'back' ? fromJS(_card.backElements).toJS() : fromJS(_card.elements).toJS() |
| | | }) |
| | | |
| | | this.props.updateElement(_card) |
| | | } else { |
| | | const that = this |
| | | const _modal = confirm({ |
| | | title: '卡片中已存在元素,请选择要进行的操作。', |
| | | className: 'mk-confirm-modal', |
| | | content: <div className="footer"> |
| | | <Button key="cancel" onClick={() => _modal.destroy()}>取消</Button> |
| | | <Button key="replace" className="mk-border-purple" onClick={() => { |
| | | that.setState({ |
| | | card: _card, |
| | | timestamp: new Date().getTime() + '', |
| | | elements: side === 'back' ? fromJS(_card.backElements).toJS() : fromJS(_card.elements).toJS() |
| | | }) |
| | | |
| | | that.props.updateElement(_card) |
| | | _modal.destroy() |
| | | }}>替换</Button> |
| | | <Button key="confirm" className="mk-border-green" onClick={() => { |
| | | that.setState({ |
| | | card: _card2, |
| | | timestamp: new Date().getTime() + '', |
| | | elements: side === 'back' ? fromJS(_card2.backElements).toJS() : fromJS(_card2.elements).toJS() |
| | | }) |
| | | |
| | | that.props.updateElement(_card2) |
| | | _modal.destroy() |
| | | }}>添加</Button> |
| | | </div> |
| | | }) |
| | | } |
| | | |
| | | resolve({status: true}) |
| | | } |
| | | |
| | | paste = (element, resolve) => { |
| | | const { card } = this.state |
| | | |
| | | if (['simpleform', 'forms', 'formgroup', 'cardcell'].includes(element.copyType)) { |
| | | if (element.copyType === 'simpleform') { |
| | | this.updateFields(element.subcards[0].fields, resolve, 'form') |
| | | } else if (element.copyType === 'forms') { |
| | | this.updateFields(element.fields, resolve, 'form') |
| | | } else if (element.copyType === 'formgroup') { |
| | | this.updateFields(element.fields, resolve, 'form') |
| | | } else { |
| | | this.updateFields(element.elements, resolve) |
| | | } |
| | | return |
| | | } |
| | | |
| | | let _uuid = Utils.getuuid() |
| | | |
| | |
| | | |
| | | render() { |
| | | const { cards } = this.props |
| | | const { card, elements, side, visible } = this.state |
| | | const { card, elements, side, visible, timestamp } = this.state |
| | | |
| | | let _style = {...card.style} |
| | | |
| | |
| | | <Col span={card.setting.width || 6} style={_style_}> |
| | | <div className={'card-item ' + (card.setting.btnControl || '') + checkAll + tablerole} style={_style} onDoubleClick={(e) => {e.stopPropagation(); this.doubleClickCard()}} id={card.uuid}> |
| | | <span className="circle-select"></span> |
| | | <CardCellComponent cards={cards} cardCell={card} side={side} elements={elements} updateElement={this.updateCard}/> |
| | | <CardCellComponent cards={cards} cardCell={card} side={side} timestamp={timestamp} elements={elements} updateElement={this.updateCard}/> |
| | | <div className="card-control" onDoubleClick={(e) => e.stopPropagation()}> |
| | | <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ |
| | | <div className="mk-popover-control"> |
| | |
| | | <EditOutlined className="edit" title="编辑"/> |
| | | </NormalForm> |
| | | <CopyComponent type="cardcell" card={card}/> |
| | | <PasteController options={['action', 'customCardElement']} updateConfig={this.paste} /> |
| | | <PasteController options={['action', 'customCardElement', 'simpleform', 'forms', 'formgroup', 'cardcell']} updateConfig={this.paste} /> |
| | | <FontColorsOutlined className="style" title="调整样式" onClick={this.changeStyle} /> |
| | | <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ |
| | | <div className="mk-popover-control"> |