| | |
| | | import { dateOptions } from '@/utils/option.js' |
| | | import Utils from '@/utils/utils.js' |
| | | import EditTable from './modaleditable' |
| | | import DataTable from './datatable' |
| | | import FieldsTable from './fieldtable' |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | | import CodeMirror from '@/templates/zshare/codemirror' |
| | | import './index.scss' |
| | | |
| | | const { TextArea } = Input |
| | | const ColorSketch = asyncComponent(() => import('@/mob/colorsketch')) |
| | | const FieldsTable = asyncComponent(() => import('./fieldtable')) |
| | | const DataTable = asyncComponent(() => import('./datatable')) |
| | | |
| | | const modalTypeOptions = { |
| | | text: ['initval', 'readonly', 'required', 'hidden', 'readin', 'fieldlength', 'regular', 'interception', 'span', 'labelwidth', 'tooltip', 'extra', 'enter', 'cursor'], |
| | | number: ['initval', 'readonly', 'hidden', 'decimal', 'min', 'max', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'enter', 'cursor'], |
| | | select: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'setAll', 'linkSubField', 'span', 'labelwidth', 'tooltip', 'extra', 'emptyText', 'enter'], |
| | | checkbox: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'span', 'labelwidth', 'tooltip', 'extra'], |
| | | radio: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'linkSubField', 'span', 'labelwidth', 'tooltip', 'extra', 'setAll', 'emptyText'], |
| | | checkcard: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'linkSubField', 'fieldlength', 'span', 'labelwidth', 'display', 'tooltip', 'extra', 'width', 'multiple'], |
| | | text: ['initval', 'readonly', 'required', 'hidden', 'readin', 'fieldlength', 'regular', 'interception', 'span', 'labelwidth', 'tooltip', 'extra', 'enter', 'cursor', 'scan', 'splitline', 'placeholder'], |
| | | number: ['initval', 'readonly', 'hidden', 'decimal', 'min', 'max', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'enter', 'cursor', 'splitline'], |
| | | select: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'setAll', 'linkSubField', 'span', 'labelwidth', 'tooltip', 'extra', 'emptyText', 'enter', 'splitline'], |
| | | checkbox: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'span', 'labelwidth', 'tooltip', 'extra', 'splitline', 'arrange'], |
| | | radio: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'linkSubField', 'span', 'labelwidth', 'tooltip', 'extra', 'setAll', 'emptyText', 'splitline', 'arrange'], |
| | | checkcard: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'linkSubField', 'fieldlength', 'span', 'labelwidth', 'display', 'tooltip', 'extra', 'width', 'multiple', 'borderColor', 'splitline'], |
| | | multiselect: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'fieldlength', 'span', 'labelwidth', 'tooltip', 'extra'], |
| | | link: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'setAll', 'linkField', 'span', 'labelwidth', 'tooltip', 'extra', 'emptyText', 'enter'], |
| | | fileupload: ['readonly', 'required', 'readin', 'fieldlength', 'maxfile', 'fileType', 'span', 'labelwidth', 'tooltip', 'extra', 'suffix'], |
| | | switch: ['initval', 'openVal', 'closeVal', 'openText', 'closeText', 'readonly', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra'], |
| | | date: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'declareType'], |
| | | datemonth: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'declareType'], |
| | | datetime: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'declareType'], |
| | | textarea: ['initval', 'readonly', 'required', 'hidden', 'readin', 'fieldlength', 'span', 'labelwidth', 'maxRows', 'encryption', 'interception', 'tooltip', 'extra'], |
| | | link: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'setAll', 'linkField', 'linkSubField', 'span', 'labelwidth', 'tooltip', 'extra', 'emptyText', 'enter', 'splitline'], |
| | | fileupload: ['readonly', 'required', 'readin', 'fieldlength', 'maxfile', 'fileType', 'span', 'labelwidth', 'tooltip', 'extra', 'compress', 'splitline'], |
| | | switch: ['initval', 'openVal', 'closeVal', 'openText', 'closeText', 'readonly', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'splitline'], |
| | | date: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'declareType', 'mode', 'splitline'], |
| | | datemonth: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'declareType', 'splitline'], |
| | | datetime: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'declareType', 'mode', 'splitline'], |
| | | textarea: ['initval', 'readonly', 'required', 'hidden', 'readin', 'fieldlength', 'span', 'labelwidth', 'maxRows', 'encryption', 'interception', 'tooltip', 'extra', 'count', 'placeholder'], |
| | | color: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra'], |
| | | hint: ['label', 'type', 'blacklist', 'message', 'span', 'labelwidth'], |
| | | hint: ['label', 'type', 'blacklist', 'message', 'span', 'labelwidth', 'splitline'], |
| | | split: ['label', 'type'], |
| | | brafteditor: ['required', 'hidelabel', 'hidden', 'readin', 'fieldlength', 'readonly', 'span', 'labelwidth', 'tooltip', 'extra', 'encryption'], |
| | | funcvar: ['span', 'labelwidth'], |
| | | funcvar: ['span', 'labelwidth', 'splitline'], |
| | | linkMain: ['readonly', 'required', 'hidden', 'fieldlength', 'span', 'labelwidth', 'tooltip', 'extra'] |
| | | } |
| | | |
| | |
| | | openType: null, |
| | | resourceType: null, |
| | | supField: '', |
| | | compress: 'false', |
| | | display: 'text', |
| | | enter: '', |
| | | cFields: [], |
| | |
| | | let resourceType = '' |
| | | let supField = '' |
| | | let display = '' |
| | | let compress = 'false' |
| | | let enter = '' |
| | | let cFields = [] |
| | | let linkSubFields = [] |
| | |
| | | formlist.forEach(cell => { |
| | | if (cell.key === 'type') { |
| | | type = cell.initVal |
| | | } else if (cell.key === 'compress') { |
| | | compress = cell.initVal |
| | | } else if (cell.key === 'display') { |
| | | display = cell.initVal |
| | | } else if (cell.key === 'enter') { |
| | |
| | | } |
| | | }) |
| | | |
| | | let _options = this.getOptions(type, resourceType, supField, display, enter) |
| | | let _options = this.getOptions(type, resourceType, supField, display, enter, compress) |
| | | |
| | | this.setState({ |
| | | enter: enter, |
| | | compress: compress, |
| | | openType: type, |
| | | supField: supField, |
| | | display: display, |
| | |
| | | try { |
| | | let _form = document.getElementById('label') |
| | | _form.select() |
| | | } catch { |
| | | } catch (e) { |
| | | console.warn('表单focus失败!') |
| | | } |
| | | } |
| | | } |
| | | |
| | | getOptions = (type, resourceType, supField, display, enter) => { |
| | | getOptions = (type, resourceType, supField, display, enter, compress) => { |
| | | let _options = ['label', 'field', 'type', 'blacklist', 'writein', ...fromJS(modalTypeOptions[type]).toJS()] |
| | | |
| | | if (type === 'hint') { |
| | |
| | | } |
| | | } else { |
| | | if (resourceType === '0') { // 自定义资源 |
| | | _options.push('options', 'fields') |
| | | _options.push('options', 'fields', 'backgroundColor') |
| | | } else if (resourceType === '1') { // 数据源 |
| | | _options.push('dataSource', 'cardValField', 'fields', 'orderBy', 'orderType', 'database') |
| | | _options.push('dataSource', 'cardValField', 'fields', 'orderBy', 'orderType', 'database', 'backgroundColor') |
| | | } |
| | | } |
| | | |
| | | if (sessionStorage.getItem('appType') === 'mob') { |
| | | _options.push('hidelabel') |
| | | } |
| | | } else if (type === 'fileupload') { |
| | | if (compress === 'true') { |
| | | _options.push('limit', 'rduri', 'proRduri') |
| | | } else { |
| | | _options.push('suffix') |
| | | } |
| | | } |
| | | |
| | |
| | | fieldValue.enter = 'false' |
| | | } |
| | | |
| | | let _options = this.getOptions(value, this.state.resourceType, this.state.supField, this.state.display, enter) |
| | | |
| | | let _options = this.getOptions(value, this.state.resourceType, this.state.supField, this.state.display, enter, this.state.compress) |
| | | |
| | | this.setState({ |
| | | openType: value, |
| | |
| | | if (value === 'brafteditor') { |
| | | fieldValue.encryption = 'true' |
| | | } |
| | | } else if (form.key === 'hidden') { |
| | | if (value === 'linkMain') { |
| | | fieldValue.hidden = 'true' |
| | | } |
| | | } |
| | | |
| | | return form |
| | |
| | | } |
| | | |
| | | onChange = (e, key) => { |
| | | const { openType } = this.state |
| | | const { openType, compress } = this.state |
| | | let value = e.target.value |
| | | if (key === 'resourceType') { |
| | | let _options = this.getOptions(openType, value, this.state.supField, this.state.display, this.state.enter) |
| | | let _options = this.getOptions(openType, value, this.state.supField, this.state.display, this.state.enter, compress) |
| | | |
| | | this.setState({ |
| | | resourceType: value, |
| | |
| | | }) |
| | | }) |
| | | } else if (key === 'display') { |
| | | let _options = this.getOptions(openType, this.state.resourceType, this.state.supField, value, this.state.enter) |
| | | let _options = this.getOptions(openType, this.state.resourceType, this.state.supField, value, this.state.enter, compress) |
| | | |
| | | this.setState({ |
| | | display: value, |
| | |
| | | return form |
| | | }) |
| | | }) |
| | | } else if (key === 'compress') { |
| | | let _options = this.getOptions(openType, this.state.resourceType, this.state.supField, this.state.display, this.state.enter, value) |
| | | |
| | | this.setState({ |
| | | compress: value, |
| | | formlist: this.state.formlist.map(form => { |
| | | form.show = _options.includes(form.key) |
| | | return form |
| | | }) |
| | | }) |
| | | } else if (key === 'enter') { |
| | | let _options = this.getOptions(openType, this.state.resourceType, this.state.supField, this.state.display, value) |
| | | let _options = this.getOptions(openType, this.state.resourceType, this.state.supField, this.state.display, value, compress) |
| | | |
| | | this.setState({ |
| | | enter: value, |
| | |
| | | } else if (item.type === 'textarea') { |
| | | fields.push( |
| | | <Col span={24} key={index}> |
| | | <Form.Item className="text-msg" label={item.label}> |
| | | <Form.Item className="text-msg" label={item.tooltip ? |
| | | <Tooltip placement="topLeft" overlayClassName={item.tooltipClass} title={item.tooltip}> |
| | | <Icon type="question-circle" /> |
| | | {item.label} |
| | | </Tooltip> : item.label |
| | | }> |
| | | {getFieldDecorator(item.key, { |
| | | initialValue: item.initVal, |
| | | rules: [ |
| | |
| | | message: this.props.dict['form.required.input'] + item.label + '!' |
| | | } |
| | | ] |
| | | })(<TextArea rows={4} />)} |
| | | })(<TextArea rows={item.rows || 4} />)} |
| | | </Form.Item> |
| | | </Col> |
| | | ) |
| | |
| | | </Form.Item> |
| | | </Col> |
| | | ) |
| | | } else if (item.type === 'color') { |
| | | fields.push( |
| | | <Col span={12} key={index}> |
| | | <Form.Item label={item.label} className="color-form-item"> |
| | | {getFieldDecorator(item.key, { |
| | | initialValue: item.initVal |
| | | })(<ColorSketch allowClear={true}/>)} |
| | | </Form.Item> |
| | | </Col> |
| | | ) |
| | | } |
| | | }) |
| | | |