From 7b01bec1609710729a868093ad69484ebea82d80 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期二, 20 十月 2020 10:16:26 +0800
Subject: [PATCH] 2020-10-20
---
src/templates/zshare/modalform/index.jsx | 194 ++++++++++++++++++++++++++++++++++++++++--------
1 files changed, 160 insertions(+), 34 deletions(-)
diff --git a/src/templates/zshare/modalform/index.jsx b/src/templates/zshare/modalform/index.jsx
index 689c1f2..d77c06d 100644
--- a/src/templates/zshare/modalform/index.jsx
+++ b/src/templates/zshare/modalform/index.jsx
@@ -6,27 +6,32 @@
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 CodeMirror from '@/templates/zshare/codemirror'
import './index.scss'
+const { TextArea } = Input
+
const modalTypeOptions = {
- text: ['initval', 'readonly', 'required', 'hidden', 'readin', 'fieldlength', 'regular', 'interception', 'entireLine'],
- number: ['initval', 'readonly', 'hidden', 'decimal', 'min', 'max', 'readin', 'entireLine'],
- select: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'setAll', 'linkSubField', 'entireLine'],
- checkbox: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'linkSubField', 'entireLine'],
- radio: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'linkSubField', 'entireLine'],
- checkcard: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'linkSubField', 'display'],
- multiselect: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'fieldlength', 'entireLine'],
- link: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'setAll', 'linkField', 'entireLine'],
- fileupload: ['readonly', 'required', 'readin', 'fieldlength', 'maxfile', 'fileType', 'entireLine'],
- switch: ['initval', 'openVal', 'closeVal', 'readonly', 'required', 'hidden', 'readin', 'entireLine'],
- date: ['initval', 'readonly', 'required', 'hidden', 'readin', 'entireLine'],
- datemonth: ['initval', 'readonly', 'required', 'hidden', 'readin', 'entireLine'],
- datetime: ['initval', 'readonly', 'required', 'hidden', 'readin', 'entireLine'],
- textarea: ['initval', 'readonly', 'required', 'hidden', 'readin', 'fieldlength', 'maxRows', 'encryption', 'interception'],
- color: ['readonly', 'required', 'hidden', 'readin', 'entireLine'],
- funcvar: ['hidden'],
- linkMain: ['readonly', 'required', 'hidden', 'fieldlength', 'entireLine']
+ text: ['initval', 'readonly', 'required', 'hidden', 'readin', 'fieldlength', 'regular', 'interception', 'entireLine', 'tooltip'],
+ number: ['initval', 'readonly', 'hidden', 'decimal', 'min', 'max', 'readin', 'entireLine', 'tooltip'],
+ select: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'setAll', 'linkSubField', 'entireLine', 'tooltip'],
+ checkbox: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'entireLine', 'tooltip'],
+ radio: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'linkSubField', 'entireLine', 'tooltip'],
+ checkcard: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'linkSubField', 'fieldlength', 'display', 'tooltip', 'width', 'multiple'],
+ multiselect: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'fieldlength', 'entireLine', 'tooltip'],
+ link: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'setAll', 'linkField', 'entireLine', 'tooltip'],
+ fileupload: ['readonly', 'required', 'readin', 'fieldlength', 'maxfile', 'fileType', 'entireLine', 'tooltip'],
+ switch: ['initval', 'openVal', 'closeVal', 'readonly', 'required', 'hidden', 'readin', 'entireLine', 'tooltip'],
+ date: ['initval', 'readonly', 'required', 'hidden', 'readin', 'entireLine', 'tooltip'],
+ datemonth: ['initval', 'readonly', 'required', 'hidden', 'readin', 'entireLine', 'tooltip'],
+ datetime: ['initval', 'readonly', 'required', 'hidden', 'readin', 'entireLine', 'tooltip'],
+ textarea: ['initval', 'readonly', 'required', 'hidden', 'readin', 'fieldlength', 'maxRows', 'encryption', 'interception', 'tooltip'],
+ color: ['readonly', 'required', 'hidden', 'readin', 'entireLine', 'tooltip'],
+ hint: ['label', 'type', 'blacklist', 'message'],
+ funcvar: [],
+ linkMain: ['readonly', 'required', 'hidden', 'fieldlength', 'entireLine', 'tooltip']
}
class MainSearch extends Component {
@@ -41,6 +46,8 @@
openType: null,
resourceType: null,
supField: '',
+ display: 'text',
+ cFields: [],
formlist: null,
linkSubFields: null
}
@@ -51,11 +58,17 @@
let type = ''
let resourceType = ''
let supField = ''
+ let display = ''
+ let cFields = []
let linkSubFields = []
formlist.forEach(cell => {
if (cell.key === 'type') {
type = cell.initVal
+ } else if (cell.key === 'display') {
+ display = cell.initVal
+ } else if (cell.key === 'fields') {
+ cFields = cell.initVal
} else if (cell.key === 'resourceType') {
resourceType = cell.initVal
} else if (cell.key === 'linkSubField') {
@@ -73,11 +86,13 @@
}
})
- let _options = this.getOptions(type, resourceType, supField)
+ let _options = this.getOptions(type, resourceType, supField, display)
this.setState({
openType: type,
supField: supField,
+ display: display,
+ cFields: cFields,
resourceType: resourceType,
linkSubFields: linkSubFields,
formlist: formlist.map(form => {
@@ -95,6 +110,11 @@
form.type = 'number'
form.initVal = form.initVal || 0
form.required = true
+ } else if (form.key === 'label') {
+ form.required = true
+ if (type === 'hint') {
+ form.required = false
+ }
}
form.show = _options.includes(form.key)
@@ -116,14 +136,30 @@
}
}
- getOptions = (type, resourceType, supField) => {
+ getOptions = (type, resourceType, supField, display) => {
let _options = ['label', 'field', 'type', 'blacklist', 'writein', ...fromJS(modalTypeOptions[type]).toJS()]
- if (['multiselect', 'select', 'link', 'radio', 'checkbox', 'checkcard'].includes(type)) {
+ if (type === 'hint') {
+ _options = fromJS(modalTypeOptions[type]).toJS()
+ } else if (['multiselect', 'select', 'link', 'radio', 'checkbox'].includes(type)) {
if (resourceType === '0') { // 鑷畾涔夎祫婧�
- _options = [..._options, 'options']
+ _options.push('options')
} else if (resourceType === '1') { // 鏁版嵁婧�
- _options = [..._options, 'dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'database']
+ _options.push('dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'database')
+ }
+ } 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', 'database', 'ratio')
+ }
+ } else {
+ if (resourceType === '0') { // 鑷畾涔夎祫婧�
+ _options.push('options', 'fields')
+ } else if (resourceType === '1') { // 鏁版嵁婧�
+ _options.push('dataSource', 'cardValField', 'fields', 'orderBy', 'orderType', 'database')
+ }
}
}
@@ -140,7 +176,7 @@
openTypeChange = (key, value) => {
if (key === 'type') {
- let _options = this.getOptions(value, this.state.resourceType, this.state.supField)
+ let _options = this.getOptions(value, this.state.resourceType, this.state.supField, this.state.display)
let fieldValue = {}
this.setState({
@@ -192,7 +228,13 @@
if (form.show) {
fieldValue.linkSubField = form.initVal
}
+ } else if (form.key === 'label') {
+ form.required = true
+ if (value === 'hint') {
+ form.required = false
+ }
}
+
return form
})
}, () => {
@@ -240,7 +282,7 @@
const { openType } = this.state
let value = e.target.value
if (key === 'resourceType') {
- let _options = this.getOptions(openType, value, this.state.supField)
+ let _options = this.getOptions(openType, value, this.state.supField, this.state.display)
this.setState({
resourceType: value,
@@ -249,7 +291,27 @@
return form
})
})
+ } else if (key === 'display') {
+ let _options = this.getOptions(openType, this.state.resourceType, this.state.supField, value)
+
+ this.setState({
+ display: 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})
}
handleSubmit = (e) => {
@@ -262,6 +324,7 @@
getFields() {
const { getFieldDecorator } = this.props.form
+ const { openType } = this.state
const fields = []
this.state.formlist.forEach((item, index) => {
@@ -355,6 +418,27 @@
</Form.Item>
</Col>
)
+ } else if (item.key === 'width') {
+ fields.push(
+ <Col span={12} key={index}>
+ <Form.Item label={
+ <Tooltip placement="topLeft" title={item.tooltip}>
+ <Icon type="question-circle" />
+ {item.label}
+ </Tooltip>
+ }>
+ {getFieldDecorator(item.key, {
+ initialValue: item.initVal,
+ rules: [
+ {
+ required: !!item.required,
+ message: this.props.dict['form.required.input'] + item.label + '!'
+ }
+ ]
+ })(<InputNumber min={1} max={24} precision={0} />)}
+ </Form.Item>
+ </Col>
+ )
} else {
fields.push(
<Col span={12} key={index}>
@@ -409,7 +493,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}>
+ <Icon type="question-circle" />
+ {item.label}
+ </Tooltip> : item.label
+ }>
{getFieldDecorator(item.key, {
initialValue: item.initVal
})(
@@ -458,10 +547,10 @@
</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: [
@@ -474,15 +563,52 @@
</Form.Item>
</Col>
)
- } else if (item.type === 'options') {
+ } else if (item.type === 'textarea') {
fields.push(
- <Col span={20} offset={4} key={index}>
- <Form.Item className="text-area">
+ <Col span={24} key={index}>
+ <Form.Item className="text-msg" label={item.label}>
+ {getFieldDecorator(item.key, {
+ initialValue: item.initVal,
+ rules: [
+ {
+ required: !!item.required,
+ message: this.props.dict['form.required.input'] + item.label + '!'
+ }
+ ]
+ })(<TextArea 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={24} key={index}>
+ <Form.Item label={item.label} className="text-area">
{getFieldDecorator(item.key, {
initialValue: item.initVal
- })(<EditTable dict={this.props.dict} type={this.state.openType} linkSubFields={this.state.linkSubFields}/>)}
+ })(<FieldsTable dict={this.props.dict} onChange={this.changeField}/>)}
</Form.Item>
- {/* <EditTable data={item.initVal} dict={this.props.dict} type={this.state.openType} linkSubFields={this.state.linkSubFields} ref="editTable"/> */}
</Col>
)
}
@@ -575,7 +701,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