From 0c84df247914f893ef5e41d57a422e10a2dc814c Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期五, 12 十一月 2021 17:02:06 +0800
Subject: [PATCH] 2021-11-12
---
src/templates/zshare/modalform/index.jsx | 579 +++++++++++++++++++++++++++++++++++++++------------------
1 files changed, 398 insertions(+), 181 deletions(-)
diff --git a/src/templates/zshare/modalform/index.jsx b/src/templates/zshare/modalform/index.jsx
index a63f5b9..a210a4b 100644
--- a/src/templates/zshare/modalform/index.jsx
+++ b/src/templates/zshare/modalform/index.jsx
@@ -1,34 +1,50 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
+import { fromJS } from 'immutable'
import { Form, Row, Col, Input, Select, Icon, Radio, notification, InputNumber, Tooltip } from 'antd'
+import { QuestionCircleOutlined } from '@ant-design/icons'
+
import { formRule } from '@/utils/option.js'
import { dateOptions } from '@/utils/option.js'
import Utils from '@/utils/utils.js'
import EditTable from './modaleditable'
+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: ['label', 'field', 'initval', 'type', 'readonly', 'required', 'hidden', 'readin', 'blacklist', 'fieldlength', 'regular', 'interception'],
- number: ['label', 'field', 'initval', 'type', 'readonly', 'hidden', 'decimal', 'min', 'max', 'readin', 'blacklist'],
- select: ['label', 'field', 'initval', 'type', 'readonly', 'required', 'hidden', 'readin', 'blacklist', 'resourceType', 'setAll', 'linkSubField'],
- multiselect: ['label', 'field', 'initval', 'type', 'readonly', 'required', 'hidden', 'readin', 'blacklist', 'resourceType', 'fieldlength'],
- link: ['label', 'field', 'initval', 'type', 'readonly', 'required', 'hidden', 'readin', 'blacklist', 'resourceType', 'setAll', 'linkField'],
- fileupload: ['label', 'field', 'type', 'readonly', 'required', 'readin', 'fieldlength', 'blacklist', 'maxfile', 'fileType'],
- date: ['label', 'field', 'initval', 'type', 'readonly', 'required', 'hidden', 'readin', 'blacklist'],
- datemonth: ['label', 'field', 'initval', 'type', 'readonly', 'required', 'hidden', 'readin', 'blacklist'],
- datetime: ['label', 'field', 'initval', 'type', 'readonly', 'required', 'hidden', 'readin', 'blacklist'],
- textarea: ['label', 'field', 'initval', 'type', 'readonly', 'required', 'hidden', 'readin', 'blacklist', 'fieldlength', 'maxRows', 'encryption', 'interception'],
- funcvar: ['label', 'field', 'type', 'blacklist', 'hidden'],
- linkMain: ['label', 'field', 'type', 'readonly', 'required', 'hidden', 'fieldlength', 'blacklist']
+ text: ['initval', 'readonly', 'required', 'hidden', 'readin', 'fieldlength', 'regular', 'interception', 'span', 'labelwidth', 'tooltip', 'extra', 'enter', 'cursor', 'scan', 'splitline', 'placeholder', 'place', 'marginTop', 'marginBottom'],
+ number: ['initval', 'readonly', 'hidden', 'decimal', 'min', 'max', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'enter', 'cursor', 'splitline', 'place', 'marginTop', 'marginBottom'],
+ select: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'setAll', 'linkSubField', 'span', 'labelwidth', 'tooltip', 'extra', 'emptyText', 'enter', 'splitline', 'dropdown', 'marginTop', 'marginBottom'],
+ checkbox: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'span', 'labelwidth', 'tooltip', 'extra', 'splitline', 'arrange', 'marginTop', 'marginBottom'],
+ radio: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'linkSubField', 'span', 'labelwidth', 'tooltip', 'extra', 'setAll', 'emptyText', 'splitline', 'arrange', 'marginTop', 'marginBottom'],
+ checkcard: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'linkSubField', 'fieldlength', 'span', 'labelwidth', 'display', 'tooltip', 'extra', 'width', 'multiple', 'borderColor', 'splitline', 'marginTop', 'marginBottom'],
+ multiselect: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'fieldlength', 'span', 'labelwidth', 'tooltip', 'extra', 'marginTop', 'marginBottom'],
+ link: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'setAll', 'linkField', 'linkSubField', 'span', 'labelwidth', 'tooltip', 'extra', 'emptyText', 'enter', 'splitline', 'dropdown', 'marginTop', 'marginBottom'],
+ fileupload: ['readonly', 'required', 'readin', 'fieldlength', 'maxfile', 'fileType', 'span', 'labelwidth', 'tooltip', 'extra', 'compress', 'splitline', 'marginTop', 'marginBottom'],
+ switch: ['initval', 'openVal', 'closeVal', 'openText', 'closeText', 'readonly', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'splitline', 'marginTop', 'marginBottom'],
+ date: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'declareType', 'mode', 'splitline', 'marginTop', 'marginBottom', 'minDate', 'maxDate'],
+ datemonth: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'declareType', 'splitline', 'marginTop', 'marginBottom'],
+ datetime: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'declareType', 'mode', 'splitline', 'marginTop', 'marginBottom', 'minDate', 'maxDate'],
+ textarea: ['initval', 'readonly', 'required', 'hidden', 'readin', 'fieldlength', 'span', 'labelwidth', 'maxRows', 'encryption', 'interception', 'tooltip', 'extra', 'count', 'placeholder', 'marginTop', 'marginBottom'],
+ color: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'marginTop', 'marginBottom'],
+ hint: ['label', 'type', 'blacklist', 'message', 'span', 'labelwidth', 'splitline', 'marginTop', 'marginBottom'],
+ split: ['label', 'type', 'marginTop', 'marginBottom'],
+ brafteditor: ['required', 'hidelabel', 'hidden', 'readin', 'fieldlength', 'readonly', 'span', 'labelwidth', 'tooltip', 'extra', 'encryption', 'marginTop', 'marginBottom'],
+ funcvar: ['span', 'labelwidth', 'splitline', 'marginTop', 'marginBottom'],
+ linkMain: ['readonly', 'required', 'hidden', 'fieldlength', 'span', 'labelwidth', 'tooltip', 'extra', 'marginTop', 'marginBottom']
}
class MainSearch extends Component {
static propTpyes = {
dict: PropTypes.object, // 瀛楀吀椤�
- optionLibs: PropTypes.any, // 鑷畾涔変笅鎷夐泦
formlist: PropTypes.any,
+ standardform: PropTypes.any,
card: PropTypes.object,
inputSubmit: PropTypes.any
}
@@ -37,22 +53,36 @@
openType: null,
resourceType: null,
supField: '',
+ compress: 'false',
+ display: 'text',
+ enter: '',
+ cFields: [],
formlist: null,
linkSubFields: null
}
UNSAFE_componentWillMount () {
- const { optionLibs } = this.props
- let formlist = JSON.parse(JSON.stringify(this.props.formlist))
-
+ let formlist = fromJS(this.props.formlist).toJS()
let type = ''
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') {
+ enter = cell.initVal
+ } else if (cell.key === 'fields') {
+ cFields = cell.initVal
} else if (cell.key === 'resourceType') {
resourceType = cell.initVal
} else if (cell.key === 'linkSubField') {
@@ -70,42 +100,37 @@
}
})
- let _options = JSON.parse(JSON.stringify(modalTypeOptions[type]))
-
- if ((type === 'multiselect' || type === 'select' || type === 'link') && resourceType === '0') { // 閫夋嫨绫诲瀷銆佽嚜瀹氫箟璧勬簮
- _options = [..._options, 'options', 'quick']
- } else if ((type === 'multiselect' || type === 'select' || type === 'link') && resourceType === '1') { // 閫夋嫨绫诲瀷銆佹暟鎹簮
- _options = [..._options, 'dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'database']
- }
-
- if (type !== 'funcvar' && type !== 'linkMain') {
- if (supField) {
- _options.push('supField', 'supvalue')
- } else {
- _options.push('supField')
- }
- }
+ let _options = this.getOptions(type, resourceType, supField, display, enter, compress)
this.setState({
+ enter: enter,
+ compress: compress,
openType: type,
supField: supField,
+ display: display,
+ cFields: cFields,
resourceType: resourceType,
linkSubFields: linkSubFields,
formlist: formlist.map(form => {
if (dateOptions.hasOwnProperty(type) && form.key === 'initval') {
form.options = dateOptions[type]
form.type = 'select'
+ } else if (type === 'switch' && form.key === 'initval') {
+ form.initVal = !!form.initVal
+ form.options = [
+ {value: true, text: '寮�'},
+ {value: false, text: '鍏�'}
+ ]
+ form.type = 'radio'
} else if (type === 'number' && form.key === 'initval') {
form.type = 'number'
form.initVal = form.initVal || 0
form.required = true
- } else if (form.key === 'quick') {
- form.options = [...optionLibs.values()].map(cell => {
- return {
- value: cell.uuid,
- text: cell.label + '(' + cell.parname + ')'
- }
- })
+ } else if (form.key === 'label') {
+ form.required = true
+ if (type === 'hint') {
+ form.required = false
+ }
}
form.show = _options.includes(form.key)
@@ -121,32 +146,85 @@
try {
let _form = document.getElementById('label')
_form.select()
- } catch {
+ } catch (e) {
console.warn('琛ㄥ崟focus澶辫触锛�')
}
}
}
- openTypeChange = (key, value) => {
- if (key === 'type') {
- let _options = JSON.parse(JSON.stringify(modalTypeOptions[value]))
+ getOptions = (type, resourceType, supField, display, enter, compress) => {
+ let _options = ['label', 'field', 'type', 'blacklist', 'writein', ...fromJS(modalTypeOptions[type]).toJS()]
- if ((value === 'multiselect' || value === 'select' || value === 'link') && this.state.resourceType === '0') { // 閫夋嫨绫诲瀷銆佽嚜瀹氫箟璧勬簮
- _options = [..._options, 'options', 'quick']
- } else if ((value === 'multiselect' || value === 'select' || value === 'link') && this.state.resourceType === '1') { // 閫夋嫨绫诲瀷銆佹暟鎹簮
- _options = [..._options, 'dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'database']
+ if (type === 'hint') {
+ _options = fromJS(modalTypeOptions[type]).toJS()
+ } else if (type === 'split') {
+ return fromJS(modalTypeOptions[type]).toJS()
+ } else if (['multiselect', 'select', 'link', 'radio', 'checkbox'].includes(type)) {
+ if (resourceType === '0') { // 鑷畾涔夎祫婧�
+ _options.push('options')
+ } else if (resourceType === '1') { // 鏁版嵁婧�
+ _options.push('dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'disableField', 'database')
}
-
- if (value !== 'funcvar' && value !== 'linkMain') {
- if (this.state.supField) {
- _options.push('supField', 'supvalue')
- } else {
- _options.push('supField')
+ } else if (type === 'checkcard') {
+ if (display === 'picture') {
+ if (resourceType === '0') { // 鑷畾涔夎祫婧�
+ _options.push('options', 'ratio')
+ } else if (resourceType === '1') { // 鏁版嵁婧�
+ _options.push('dataSource', 'cardValField', 'urlField', 'orderBy', 'orderType', 'disableField', 'database', 'ratio')
+ }
+ } else {
+ if (resourceType === '0') { // 鑷畾涔夎祫婧�
+ _options.push('options', 'fields', 'backgroundColor')
+ } else if (resourceType === '1') { // 鏁版嵁婧�
+ _options.push('dataSource', 'cardValField', 'fields', 'orderBy', 'orderType', 'disableField', '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')
+ }
+ }
+
+ if (type === 'text' || type === 'number' || type === 'select' || type === 'link') {
+ if (enter === 'tab' || enter === 'sub') {
+ _options.push('tabField')
+ }
+ }
+
+ if (type !== 'funcvar' && type !== 'linkMain') {
+ if (supField) {
+ _options.push('supField', 'supvalue')
+ } else {
+ _options.push('supField')
+ }
+ }
+
+ return _options
+ }
+
+ openTypeChange = (key, value) => {
+ if (key === 'type') {
+ let enter = 'false'
+ let fieldValue = {}
+
+ if (value === 'text' || value === 'number') {
+ enter = 'sub'
+ fieldValue.enter = 'sub'
+ } else if (value === 'select' || value === 'link') {
+ fieldValue.enter = 'false'
+ }
+
+ let _options = this.getOptions(value, this.state.resourceType, this.state.supField, this.state.display, enter, this.state.compress)
this.setState({
openType: value,
+ enter: enter,
formlist: this.state.formlist.map(form => {
form.show = _options.includes(form.key)
if (form.key === 'initval') {
@@ -155,6 +233,13 @@
if (dateOptions.hasOwnProperty(value)) {
form.options = dateOptions[value]
form.type = 'select'
+ } else if (value === 'switch') {
+ form.initVal = false
+ form.options = [
+ {value: true, text: '寮�'},
+ {value: false, text: '鍏�'}
+ ]
+ form.type = 'radio'
} else if (value === 'number') {
form.type = 'number'
form.required = true
@@ -162,43 +247,52 @@
} else {
form.type = 'text'
}
- form.show = false
+
+ if (form.show) {
+ fieldValue.initval = form.initVal
+ }
} else if (form.key === 'fieldlength') {
form.initVal = 50
- if (value === 'textarea' || value === 'fileupload' || value === 'multiselect') {
+ if (value === 'textarea' || value === 'brafteditor') {
+ form.initVal = 8000
+ } else if (value === 'fileupload' || value === 'multiselect' || value === 'checkbox') {
form.initVal = 512
}
- form.show = false
+
+ if (form.show) {
+ fieldValue.fieldlength = form.initVal
+ }
} else if (form.key === 'resourceType') {
form.initVal = this.state.resourceType
+
+ if (form.show) {
+ fieldValue.resourceType = form.initVal
+ }
} else if (form.key === 'linkSubField') {
form.initVal = this.state.linkSubFields.map(_field => _field.field)
+
+ if (form.show) {
+ fieldValue.linkSubField = form.initVal
+ }
+ } else if (form.key === 'label') {
+ form.required = true
+ if (value === 'hint') {
+ form.required = false
+ }
+ } else if (form.key === 'encryption') {
+ if (value === 'brafteditor') {
+ fieldValue.encryption = 'true'
+ }
+ } else if (form.key === 'hidden') {
+ if (value === 'linkMain') {
+ fieldValue.hidden = 'true'
+ }
}
+
return form
})
}, () => {
- this.setState({
- formlist: this.state.formlist.map(form => {
- if (form.key === 'initval' && value !== 'fileupload' && value !== 'funcvar' && value !== 'linkMain') {
- form.show = true
- } else if (form.key === 'fieldlength' && (value === 'fileupload' || value === 'multiselect' || value === 'text' || value === 'textarea' || value === 'linkMain')) {
- form.show = true
- }
- return form
- })
- })
- })
- } else if (key === 'quick') {
- let option = this.props.optionLibs.get(value)
-
- this.setState({
- formlist: this.state.formlist.map(form => {
- if (form.key === 'options') {
- form.initVal = option.options
- }
-
- return form
- })
+ this.props.form.setFieldsValue(fieldValue)
})
} else if (key === 'supField') {
this.setState({
@@ -239,25 +333,11 @@
}
onChange = (e, key) => {
- const { openType } = this.state
+ const { openType, compress } = this.state
let value = e.target.value
if (key === 'resourceType') {
- let _options = JSON.parse(JSON.stringify(modalTypeOptions[openType]))
-
- if (value === '0') {
- _options = [..._options, 'options', 'quick']
- } else if (value === '1') {
- _options = [..._options, 'dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'database']
- }
-
- if (openType !== 'funcvar' && openType !== 'linkMain') {
- if (this.state.supField) {
- _options.push('supField', 'supvalue')
- } else {
- _options.push('supField')
- }
- }
-
+ let _options = this.getOptions(openType, value, this.state.supField, this.state.display, this.state.enter, compress)
+
this.setState({
resourceType: value,
formlist: this.state.formlist.map(form => {
@@ -265,6 +345,98 @@
return form
})
})
+ } else if (key === 'display') {
+ let _options = this.getOptions(openType, this.state.resourceType, this.state.supField, value, this.state.enter, compress)
+
+ this.setState({
+ display: value,
+ formlist: this.state.formlist.map(form => {
+ form.show = _options.includes(form.key)
+ 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, compress)
+
+ this.setState({
+ enter: value,
+ formlist: this.state.formlist.map(form => {
+ form.show = _options.includes(form.key)
+ return form
+ })
+ })
+ } else if (key === 'multiple') {
+ if (value === 'true') {
+ this.props.form.setFieldsValue({fieldlength: 512})
+ } else {
+ this.props.form.setFieldsValue({fieldlength: 50})
+ }
+ }
+ }
+
+ changeField = (data) => {
+ this.setState({
+ cFields: data,
+ formlist: this.state.formlist.map(form => {
+ if (form.key === 'fields') {
+ form.initVal = data
+ }
+ return form
+ })
+ })
+ }
+
+ changeVal = (val, type) => {
+ if (type !== 'span' || ![24, 12, 8, 6].includes(val)) return
+
+ const { standardform } = this.props
+
+ if (!standardform || ![24, 12, 8, 6].includes(standardform.span) || !standardform.labelwidth) return
+
+ let labelwidth = null
+
+ if (standardform.span === val) {
+ labelwidth = standardform.labelwidth
+ } else if (standardform.span > val) {
+ labelwidth = 33.3
+ } else {
+ switch(standardform.span) {
+ case 12:
+ labelwidth = 16.2
+ break;
+ case 8:
+ if (val === 12) {
+ labelwidth = 21.6
+ } else {
+ labelwidth = 10.5
+ }
+ break;
+ case 6:
+ if (val === 8) {
+ labelwidth = 24.3
+ } else if (val === 12) {
+ labelwidth = 15.8
+ } else {
+ labelwidth = 7.7
+ }
+ break;
+ default:
+ }
+ }
+
+
+ if (labelwidth) {
+ this.props.form.setFieldsValue({labelwidth})
}
}
@@ -278,10 +450,11 @@
getFields() {
const { getFieldDecorator } = this.props.form
+ const { openType } = this.state
const fields = []
this.state.formlist.forEach((item, index) => {
- if (!item.show) return
+ if (!item.show || item.forbid) return null
if (item.type === 'text') { // 鏂囨湰鎼滅储
let rules = []
@@ -305,7 +478,7 @@
<Col span={12} key={index}>
<Form.Item label={item.tooltip ?
<Tooltip placement="topLeft" title={item.tooltip}>
- <Icon type="question-circle" />
+ <QuestionCircleOutlined className="mk-form-tip" />
{item.label}
</Tooltip> : item.label
}>
@@ -323,10 +496,15 @@
</Col>
)
} else if (item.type === 'number') {
- if (item.key === 'decimal') {
+ if (item.max) {
fields.push(
<Col span={12} key={index}>
- <Form.Item label={item.label}>
+ <Form.Item label={item.tooltip ?
+ <Tooltip placement="topLeft" title={item.tooltip}>
+ <QuestionCircleOutlined className="mk-form-tip" />
+ {item.label}
+ </Tooltip> : item.label
+ }>
{getFieldDecorator(item.key, {
initialValue: item.initVal || 0,
rules: [
@@ -335,46 +513,19 @@
message: this.props.dict['form.required.input'] + item.label + '!'
}
]
- })(<InputNumber min={0} max={18} precision={0} />)}
- </Form.Item>
- </Col>
- )
- } else if (item.key === 'fieldlength' || item.key === 'maxfile') {
- fields.push(
- <Col span={12} key={index}>
- <Form.Item label={item.label}>
- {getFieldDecorator(item.key, {
- initialValue: item.initVal,
- rules: [
- {
- required: !!item.required,
- message: this.props.dict['form.required.input'] + item.label + '!'
- }
- ]
- })(<InputNumber min={1} precision={0} />)}
- </Form.Item>
- </Col>
- )
- } else if (item.key === 'maxRows') {
- fields.push(
- <Col span={12} key={index}>
- <Form.Item label={item.label}>
- {getFieldDecorator(item.key, {
- initialValue: item.initVal,
- rules: [
- {
- required: !!item.required,
- message: this.props.dict['form.required.input'] + item.label + '!'
- }
- ]
- })(<InputNumber min={2} max={100} precision={0} />)}
+ })(<InputNumber onChange={(value) => this.changeVal(value, item.key)} min={item.min} max={item.max} precision={item.precision} onPressEnter={this.handleSubmit}/>)}
</Form.Item>
</Col>
)
} else {
fields.push(
<Col span={12} key={index}>
- <Form.Item label={item.label}>
+ <Form.Item label={item.tooltip ?
+ <Tooltip placement="topLeft" title={item.tooltip}>
+ <QuestionCircleOutlined className="mk-form-tip" />
+ {item.label}
+ </Tooltip> : item.label
+ }>
{getFieldDecorator(item.key, {
initialValue: item.initVal,
rules: [
@@ -383,7 +534,7 @@
message: this.props.dict['form.required.input'] + item.label + '!'
}
]
- })(<InputNumber />)}
+ })(<InputNumber onPressEnter={this.handleSubmit}/>)}
</Form.Item>
</Col>
)
@@ -393,7 +544,7 @@
<Col span={12} key={index}>
<Form.Item label={item.tooltip ?
<Tooltip placement="topLeft" title={item.tooltip}>
- <Icon type="question-circle" />
+ <QuestionCircleOutlined className="mk-form-tip" />
{item.label}
</Tooltip> : item.label
}>
@@ -412,9 +563,9 @@
onChange={(value) => {this.openTypeChange(item.key, value)}}
getPopupContainer={() => document.getElementById('modal-fields-form-box')}
>
- {item.options.map(option =>
- <Select.Option id={option.value} title={option.text} key={option.value} value={option.value}>
- {item.key === 'icon' && <Icon type={option.text} />} {option.text}
+ {item.options.map((option, i) =>
+ <Select.Option key={`${i}`} value={option.value || option.field || ''}>
+ {item.key === 'icon' && <Icon type={option.text} />} {option.text || option.label}
</Select.Option>
)}
</Select>
@@ -425,7 +576,12 @@
} else if (item.type === 'multiselect') { // 澶氶��
fields.push(
<Col span={12} key={index}>
- <Form.Item label={item.label}>
+ <Form.Item label={item.tooltip ?
+ <Tooltip placement="topLeft" title={item.tooltip}>
+ <QuestionCircleOutlined className="mk-form-tip" />
+ {item.label}
+ </Tooltip> : item.label
+ }>
{getFieldDecorator(item.key, {
initialValue: item.initVal
})(
@@ -435,8 +591,8 @@
filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
onChange={(value) => this.multiselectChange(item.key, value, item.options)}
>
- {item.options.map(option =>
- <Select.Option id={option.uuid} key={option.uuid} value={option.field}>{option.label}</Select.Option>
+ {item.options.map((option, i) =>
+ <Select.Option key={i} value={option.field}>{option.label}</Select.Option>
)}
</Select>
)}
@@ -448,7 +604,7 @@
<Col span={12} key={index}>
<Form.Item label={item.tooltip ?
<Tooltip placement="topLeft" overlayClassName={item.tooltipClass} title={item.tooltip}>
- <Icon type="question-circle" />
+ <QuestionCircleOutlined className="mk-form-tip" />
{item.label}
</Tooltip> : item.label
}>
@@ -462,22 +618,20 @@
]
})(
<Radio.Group onChange={(e) => {this.onChange(e, item.key)}}>
- {
- item.options.map(option => {
- return (
- <Radio key={option.value} value={option.value}>{option.text}</Radio>
- )
- })
- }
- </Radio.Group>,
+ {item.options.map(option => {
+ return (
+ <Radio key={option.value} value={option.value}>{option.text}</Radio>
+ )
+ })}
+ </Radio.Group>
)}
</Form.Item>
</Col>
)
- } else if (item.type === 'textarea') {
+ } else if (item.type === 'codemirror') {
fields.push(
- <Col span={20} offset={4} key={index}>
- <Form.Item className="text-area">
+ <Col span={24} key={index}>
+ <Form.Item className="text-area" label={item.label}>
{getFieldDecorator(item.key, {
initialValue: item.initVal,
rules: [
@@ -486,14 +640,71 @@
message: this.props.dict['form.required.input'] + item.label + '!'
}
]
- })(<TextArea rows={4} />)}
+ })(<CodeMirror />)}
+ </Form.Item>
+ </Col>
+ )
+ } else if (item.type === 'textarea') {
+ fields.push(
+ <Col span={24} key={index}>
+ <Form.Item className="text-msg" label={item.tooltip ?
+ <Tooltip placement="topLeft" overlayClassName={item.tooltipClass} title={item.tooltip}>
+ <QuestionCircleOutlined className="mk-form-tip" />
+ {item.label}
+ </Tooltip> : item.label
+ }>
+ {getFieldDecorator(item.key, {
+ initialValue: item.initVal,
+ rules: [
+ {
+ required: !!item.required,
+ message: this.props.dict['form.required.input'] + item.label + '!'
+ }
+ ]
+ })(<TextArea rows={item.rows || 4} />)}
</Form.Item>
</Col>
)
} else if (item.type === 'options') {
+ if (openType !== 'checkcard') {
+ fields.push(
+ <Col span={24} key={index}>
+ <Form.Item label={item.label} className="text-area">
+ {getFieldDecorator(item.key, {
+ initialValue: item.initVal
+ })(<EditTable dict={this.props.dict} type={openType} linkSubFields={this.state.linkSubFields}/>)}
+ </Form.Item>
+ </Col>
+ )
+ } else {
+ fields.push(
+ <Col span={24} key={index}>
+ <Form.Item label={item.label} className="text-area">
+ {getFieldDecorator(item.key, {
+ initialValue: item.initVal
+ })(<DataTable dict={this.props.dict} type={this.state.display} fields={this.state.cFields}/>)}
+ </Form.Item>
+ </Col>
+ )
+ }
+ } else if (item.type === 'fields') {
fields.push(
- <Col span={20} offset={4} key={index}>
- <EditTable data={item.initVal} dict={this.props.dict} type={this.state.openType} linkSubFields={this.state.linkSubFields} ref="editTable"/>
+ <Col span={24} key={index}>
+ <Form.Item label={item.label} className="text-area">
+ {getFieldDecorator(item.key, {
+ initialValue: item.initVal
+ })(<FieldsTable dict={this.props.dict} onChange={this.changeField}/>)}
+ </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>
)
}
@@ -507,46 +718,54 @@
return new Promise((resolve, reject) => {
this.props.form.validateFieldsAndScroll((err, values) => {
if (!err) {
- let isvalid = true
values.uuid = this.props.card.uuid
// 涓嬫媺鑿滃崟鎴栬仈鍔ㄨ彍鍗�
- if ((values.type === 'multiselect' || values.type === 'select' || values.type === 'link') && values.resourceType === '0') {
- values.options = this.refs.editTable.state.dataSource
- values.dataSource = ''
- let emptys = []
- if (values.type === 'multiselect' || values.type === 'select') {
- emptys = values.options.filter(op => !((op.Value || op.Value === 0) && (op.Text || op.Text === 0)))
- } else {
- emptys = values.options.filter(op => !((op.Value || op.Value === 0) && (op.Text || op.Text === 0) && (op.ParentID || op.ParentID === 0)))
- }
- if (emptys.length > 0) {
- isvalid = false
- notification.warning({
- top: 92,
- message: this.props.dict['model.form.selectItem.error'],
- duration: 5
+ if (['multiselect', 'select', 'link', 'radio', 'checkbox'].includes(values.type)) {
+ if (values.resourceType === '0') {
+ values.options = values.options || []
+ values.dataSource = ''
+ let empty = false
+
+ values.options.forEach(op => {
+ if (!((op.Value || op.Value === 0) && (op.Text || op.Text === 0))) {
+ empty = true
+ } else if (values.type === 'link' && !(op.ParentID || op.ParentID === 0)) {
+ empty = true
+ }
})
+
+ if (empty) {
+ notification.warning({
+ top: 92,
+ message: this.props.dict['model.form.selectItem.error'],
+ duration: 5
+ })
+ return
+ }
+ } else {
+ values.options = []
}
- } else if ((values.type === 'multiselect' || values.type === 'select' || values.type === 'link') && values.resourceType === '1') {
- values.options = []
} else if (values.type === 'funcvar') { // 鍑芥暟鍙橀噺涓哄彧璇诲厓绱�
values.readonly = 'true'
- } else if (values.type === 'number' && (values.min || values.min === 0) && (values.max || values.max === 0)) { // 鏁板�煎瀷楠岃瘉鏈�灏忔渶澶у��
- if (values.min > values.max) {
- isvalid = false
+ } else if (values.type === 'number') { // 鏁板�煎瀷楠岃瘉鏈�灏忔渶澶у��
+ values.required = 'true'
+ if ((values.min || values.min === 0) && (values.max || values.max === 0) && values.min > values.max) {
notification.warning({
top: 92,
message: '鏈�灏忓�间笉鍙ぇ浜庢渶澶у�硷紒',
duration: 5
})
+ return
}
} else if (values.type === 'linkMain') {
values.initval = ''
+ } else if (values.type === 'split') {
+ values.span = 24
}
['linkField', 'valueField', 'valueText', 'orderBy'].forEach(item => {
if (values[item]) {
- values[item] = values[item].replace(/\s* | \t* | \v* | \r*/ig, '')
+ values[item] = values[item].replace(/\s*|\t*|\v*|\r*/ig, '')
}
})
@@ -561,9 +780,7 @@
return
}
- if (isvalid) {
- resolve(values)
- }
+ resolve(values)
} else {
reject(err)
}
@@ -583,7 +800,7 @@
}
}
return (
- <Form {...formItemLayout} className="ant-advanced-search-form modal-fields-form" id="modal-fields-form-box">
+ <Form {...formItemLayout} className="modal-fields-form" id="modal-fields-form-box">
<Row gutter={24}>{this.getFields()}</Row>
</Form>
)
--
Gitblit v1.8.0