| | |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | | import asyncIconComponent from '@/utils/asyncIconComponent' |
| | | import { getModalForm } from '@/templates/zshare/formconfig' |
| | | import { resetStyle } from '@/utils/utils-custom.js' |
| | | import ModalForm from '@/templates/zshare/modalform' |
| | | import MKEmitter from '@/utils/events.js' |
| | | import Utils from '@/utils/utils.js' |
| | |
| | | name: card.name, |
| | | subtype: card.subtype, |
| | | setting: { }, |
| | | wrap: { name: card.name, width: card.width || 24, datatype: 'static', color: '#1890ff' }, |
| | | wrap: { name: card.name, width: card.width || 24, datatype: 'static', groupLabel: 'show', color: '#1890ff' }, |
| | | style: { marginLeft: '0px', marginRight: '0px', marginTop: '8px', marginBottom: '8px' }, |
| | | columns: [], |
| | | scripts: [], |
| | |
| | | }) |
| | | } |
| | | |
| | | handleList = (list) => { |
| | | handleList = (list, newcard) => { |
| | | let group = fromJS(this.state.group).toJS() |
| | | let card = fromJS(this.state.card).toJS() |
| | | |
| | |
| | | return item |
| | | }) |
| | | |
| | | this.setState({card, group}) |
| | | this.setState({card, group}, () => { |
| | | if (newcard) { |
| | | this.handleForm(newcard) |
| | | } |
| | | }) |
| | | this.props.updateConfig(card) |
| | | } |
| | | |
| | |
| | | group.fields = group.fields.filter(item => !item.focus) |
| | | |
| | | this.setState({group, visible: false, editform: null}) |
| | | this.updateGroup(group) |
| | | } |
| | | |
| | | /** |
| | | * @description 表单编辑 |
| | | */ |
| | | handleForm = (_item) => { |
| | | const { card, group } = this.state |
| | | const { card, group, appType } = this.state |
| | | let _form = fromJS(_item).toJS() |
| | | let _inputfields = [] |
| | | let _tabfields = [] |
| | |
| | | let standardform = null |
| | | |
| | | _inputfields = group.fields.filter(item => item.type === 'text' || item.type === 'number' || item.type === 'textarea' || item.type === 'color') |
| | | _tabfields = group.fields.filter(item => _form.field !== item.field && item.hidden !== 'true' && ['text', 'number', 'select', 'link'].includes(item.type)) |
| | | if (appType === 'mob') { |
| | | _tabfields = group.fields.filter(item => _form.field !== item.field && item.hidden !== 'true' && ['text', 'number'].includes(item.type)) |
| | | } else { |
| | | _tabfields = group.fields.filter(item => _form.field !== item.field && item.hidden !== 'true' && ['text', 'number', 'select', 'link'].includes(item.type)) |
| | | } |
| | | _tabfields.unshift({field: '', text: '原表单'}) |
| | | |
| | | let uniq = new Map() |
| | |
| | | _form.linkSubField = _form.linkSubField.filter(item => fields.includes(item)) |
| | | } |
| | | |
| | | if (!_form.span && standardform && standardform.span) { |
| | | if (appType !== 'mob' && !_form.span && standardform && standardform.span) { |
| | | _form.span = standardform.span |
| | | _form.labelwidth = standardform.labelwidth |
| | | } |
| | |
| | | }) |
| | | } |
| | | |
| | | pasteForm = (res) => { |
| | | let _config = fromJS(this.state.group).toJS() |
| | | let fieldrepet = false // 字段重复 |
| | | let labelrepet = false // 提示文字重复 |
| | | |
| | | _config.fields.forEach(item => { |
| | | if (res.field && item.field && item.field.toLowerCase() === res.field.toLowerCase()) { |
| | | fieldrepet = true |
| | | } else if (res.label && item.label === res.label) { |
| | | labelrepet = true |
| | | } |
| | | }) |
| | | |
| | | if (fieldrepet) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '字段已存在!', |
| | | duration: 10 |
| | | }) |
| | | return |
| | | } else if (labelrepet) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '名称已存在!', |
| | | duration: 10 |
| | | }) |
| | | return |
| | | } |
| | | _config.fields.push(res) |
| | | |
| | | this.updateGroup(_config) |
| | | |
| | | this.handleForm(res) |
| | | |
| | | notification.success({ |
| | | top: 92, |
| | | message: '粘贴成功!', |
| | | duration: 2 |
| | | }) |
| | | } |
| | | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | |
| | | const { card, dict, group, appType } = this.state |
| | | |
| | | return ( |
| | | <div className="menu-normal-form-edit-box" style={{...card.style}} onClick={this.clickComponent} id={card.uuid}> |
| | | <div className="menu-normal-form-edit-box" style={resetStyle(card.style)} onClick={this.clickComponent} id={card.uuid}> |
| | | <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ |
| | | <div className="mk-popover-control"> |
| | | <Icon className="plus" title="添加分组" onClick={this.addCard} type="plus" /> |
| | | <WrapComponent config={card} updateConfig={this.updateComponent} /> |
| | | <CopyComponent type="propcard" card={card}/> |
| | | <PasteComponent config={card} options={['cardcell']} updateConfig={this.updateComponent} /> |
| | | <PasteComponent config={card} options={['form']} updateConfig={this.pasteForm} /> |
| | | <Icon className="style" title="调整样式" onClick={this.changeStyle} type="font-colors" /> |
| | | <UserComponent config={card}/> |
| | | <Icon className="close" title="删除组件" type="delete" onClick={() => this.props.deletecomponent(card.uuid)} /> |
| | |
| | | list={group.fields} |
| | | setting={group.setting} |
| | | showField={this.state.showField} |
| | | placeholder={dict['header.form.modal.placeholder']} |
| | | handleList={this.handleList} |
| | | handleForm={this.handleForm} |
| | | closeForm={this.closeForm} |