From 09e0de52a398dd08a0dc3f4b43e4589d211e9c27 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期四, 30 十二月 2021 12:44:45 +0800
Subject: [PATCH] 2021-12-30
---
src/templates/sharecomponent/searchcomponent/searchform/index.jsx | 881 +++++++++++++++++++++++++++------------------------------
1 files changed, 418 insertions(+), 463 deletions(-)
diff --git a/src/templates/sharecomponent/searchcomponent/searchform/index.jsx b/src/templates/sharecomponent/searchcomponent/searchform/index.jsx
index cc1c227..955dfb7 100644
--- a/src/templates/sharecomponent/searchcomponent/searchform/index.jsx
+++ b/src/templates/sharecomponent/searchcomponent/searchform/index.jsx
@@ -5,16 +5,15 @@
import { QuestionCircleOutlined } from '@ant-design/icons'
import { dateOptions, matchReg, formRule } from '@/utils/option.js'
-import EditTable from '../searcheditable'
import Utils from '@/utils/utils.js'
import CodeMirror from '@/templates/zshare/codemirror'
import asyncComponent from '@/utils/asyncComponent'
-import MkIcon from '@/components/mk-icon'
import './index.scss'
const ColorSketch = asyncComponent(() => import('@/mob/colorsketch'))
const FieldsTable = asyncComponent(() => import('@/templates/zshare/modalform/fieldtable'))
const DataTable = asyncComponent(() => import('@/templates/zshare/modalform/datatable'))
+const EditTable = asyncComponent(() => import('@/templates/zshare/modalform/modaleditable'))
const groupOptions = [
{
@@ -125,75 +124,37 @@
textTooltip: '瀛楁鍚嶅彲浠ヤ娇鐢ㄩ�楀彿鍒嗛殧锛岃繘琛岀患鍚堟悳绱�',
}
- /**
- * @description 琛ㄥ崟棰勫鐞�
- * 1銆佹牴鎹〃鍗曠被鍨嬶紝鏄剧ず琛ㄥ崟鍙紪杈戦」
- * 2銆佷笅鎷夐�夋嫨锛屾牴鎹暟鎹簮绫诲瀷鏄剧ず鐩稿叧閰嶇疆
- */
+ record = {}
+
UNSAFE_componentWillMount () {
- const { formlist, dict } = this.props
-
- let type = ''
- let _items = []
- let resourceType = ''
- let display = ''
- let cFields = []
- let multiple = 'false'
-
- formlist.forEach(cell => {
- if (cell.key === 'type') {
- type = cell.initVal
- } else if (cell.key === 'items') {
- _items = cell.initVal
- } else if (cell.key === 'display') {
- display = cell.initVal
- } else if (cell.key === 'resourceType') {
- resourceType = cell.initVal
- } else if (cell.key === 'fields') {
- cFields = cell.initVal
- } else if (cell.key === 'multiple') {
- multiple = cell.initVal
- }
+ this.props.formlist.forEach(item => {
+ this.record[item.key] = item.initVal
})
- let _options = this.getOptions(type, resourceType, display)
-
+ let { shows, reOptions, reTypes, reTooltip, reLabel, reRequired } = this.getMutilOptions()
+
this.setState({
- display,
- cFields,
- openType: type,
- items: _items,
- resourceType,
- formlist: formlist.map(form => {
- // 琛ㄥ崟涓哄垵濮嬪�煎瓧娈碉紝涓旀暟鎹被鍨嬪睘浜庢椂闂寸被鍨嬫椂锛岃缃垵濮嬪�间负涓嬫媺閫夋嫨锛屽苟閲嶇疆閫夋嫨椤�
- if (form.key === 'initval' && dateOptions.hasOwnProperty(type)) {
- form.options = dateOptions[type]
- form.type = 'select'
- } else if (form.key === 'initval' && type === 'group') {
- form.options = groupOptions.filter(op => _items.includes(op.value))
- form.type = 'cascader'
- } else if (form.key === 'match') { // 琛ㄥ崟涓哄尮閰嶅瓧娈垫椂锛屾牴鎹笉鍚岀殑绫诲瀷锛屾樉绀哄搴旂殑鍖归厤瑙勫垯
- if (type === 'text') {
- form.options = matchReg.text
- } else if (type === 'multiselect' || (type === 'checkcard' && multiple === 'true')) {
- form.options = matchReg.multiselect
- } else if (type === 'select' || type === 'link' || type === 'checkcard') {
- form.options = matchReg.select
- } else if (type === 'date') {
- form.options = matchReg.date
- } else if (type === 'datemonth') {
- form.options = matchReg.datemonth
- } else if (type === 'dateweek' || type === 'daterange' || type === 'range') {
- form.options = matchReg.daterange
- }
- } else if (form.key === 'field' && (type === 'text' || type === 'select')) {
- form.tooltip = this.state.textTooltip
- } else if (form.key === 'field' && type === 'group') {
- form.tooltip = '鏌ヨ鏁版嵁鏃讹紙鑷畾涔夎剼鏈垨缁熻鏁版嵁婧愶級锛岀被鍨嬪瓧娈靛皢鐢ㄤ綔鏇挎崲鑴氭湰涓殑 @瀛楁@ 锛岀被鍨嬪瓧娈靛搴斿�间负 {"鏃�": "day", "鍛�": "week", "鏈�": "month", "瀛�": "quarter", "骞�": "year", "鑷畾涔�": "customized"}銆�'
- form.label = dict['model.form.type'] + dict['model.form.field']
+ formlist: this.props.formlist.map(item => {
+ item.hidden = !shows.includes(item.key)
+ item.initVal = this.record[item.key]
+
+ if (reOptions[item.key]) {
+ item.options = reOptions[item.key]
}
- form.hidden = !_options.includes(form.key)
- return form
+ if (reTypes[item.key]) {
+ item.type = reTypes[item.key]
+ }
+ if (reTooltip[item.key] !== undefined) {
+ item.tooltip = reTooltip[item.key]
+ }
+ if (reLabel[item.key] !== undefined) {
+ item.label = reLabel[item.key]
+ }
+ if (reRequired[item.key] !== undefined) {
+ item.required = reRequired[item.key]
+ }
+
+ return item
})
})
}
@@ -211,182 +172,211 @@
}
}
- getOptions = (type, resourceType, display) => {
- let _options = fromJS(searchTypeOptions[type]).toJS() // 閫夐」鍒楄〃
-
- if (['multiselect', 'select', 'link'].includes(type) && resourceType === '0') { // 涓嬫媺閫夋嫨绫诲瀷銆侀�夐」涓鸿嚜瀹氫箟璧勬簮
- _options.push('options')
- } else if (['multiselect', 'select', 'link'].includes(type) && resourceType === '1') { // 涓嬫媺閫夋嫨绫诲瀷銆侀�夐」涓哄悗鍙版暟鎹簮涓幏鍙�
- _options.push('dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'database')
+ getMutilOptions = () => {
+ let type = this.record.type
+ let shows = fromJS(searchTypeOptions[type]).toJS()
+ let reOptions = {}
+ let reTypes = {}
+ let reTooltip = {}
+ let reRequired = {}
+ let reLabel = {}
+
+ if (['multiselect', 'select', 'link'].includes(type)) {
+ reRequired.linkField = true
+ if (this.record.resourceType === '0') { // 鑷畾涔夎祫婧�
+ shows.push('options')
+ } else if (this.record.resourceType === '1') { // 鏁版嵁婧�
+ shows.push('dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'database')
+ }
} else if (type === 'checkcard') {
- if (display === 'picture') {
- if (resourceType === '0') { // 鑷畾涔夎祫婧�
- _options.push('options', 'picratio')
- } else if (resourceType === '1') { // 鏁版嵁婧�
- _options.push('dataSource', 'cardValField', 'urlField', 'orderBy', 'orderType', 'database', 'picratio')
+ if (this.record.display === 'picture') {
+ if (this.record.resourceType === '0') { // 鑷畾涔夎祫婧�
+ shows.push('options', 'picratio')
+ } else if (this.record.resourceType === '1') { // 鏁版嵁婧�
+ shows.push('dataSource', 'cardValField', 'urlField', 'orderBy', 'orderType', 'database', 'picratio')
}
} else {
- if (resourceType === '0') { // 鑷畾涔夎祫婧�
- _options.push('options', 'fields', 'backgroundColor')
- } else if (resourceType === '1') { // 鏁版嵁婧�
- _options.push('dataSource', 'cardValField', 'fields', 'orderBy', 'orderType', 'database', 'backgroundColor')
+ if (this.record.resourceType === '0') { // 鑷畾涔夎祫婧�
+ shows.push('options', 'fields', 'backgroundColor')
+ } else if (this.record.resourceType === '1') { // 鏁版嵁婧�
+ shows.push('dataSource', 'cardValField', 'fields', 'orderBy', 'orderType', 'database', 'backgroundColor')
}
+ }
+ if (this.record.multiple === 'false') {
+ shows.push('linkField')
+ }
+ reRequired.linkField = false
+ }
+
+ if (dateOptions.hasOwnProperty(type)) { // 鏍规嵁鎼滅储鏉′欢绫诲瀷锛岄�夋嫨鍒濆鍊肩殑绫诲瀷鍙婃暟鎹�
+ reOptions.initval = dateOptions[type]
+ reTypes.initval = 'select'
+ } else if (type === 'group') {
+ reOptions.initval = groupOptions.filter(op => this.record.items.includes(op.value))
+ reTypes.initval = 'cascader'
+ } else {
+ reTypes.initval = 'text'
+ }
+
+ if (type === 'text') {
+ reOptions.match = matchReg.text
+ } else if (type === 'multiselect') {
+ reOptions.match = matchReg.multiselect
+ } else if (type === 'select' || type === 'link') {
+ reOptions.match = matchReg.select
+ } else if (type === 'date') {
+ reOptions.match = matchReg.date
+ } else if (type === 'datemonth') {
+ reOptions.match = matchReg.datemonth
+ } else if (type === 'dateweek' || type === 'daterange' || type === 'range') {
+ reOptions.match = matchReg.daterange
+ } else if (type === 'checkcard') {
+ if (this.record.multiple === 'false') {
+ reOptions.match = matchReg.select
+ } else if (this.record.multiple === 'true') {
+ reOptions.match = matchReg.multiselect
}
}
- return _options
+ reTooltip.field = ''
+ reLabel.field = '瀛楁'
+
+ if (type === 'text' || type === 'select') {
+ reTooltip.field = '瀛楁鍚嶅彲浠ヤ娇鐢ㄩ�楀彿鍒嗛殧锛岃繘琛岀患鍚堟悳绱€��'
+ } else if (type === 'group') {
+ reTooltip.field = '鏌ヨ鏁版嵁鏃讹紙鑷畾涔夎剼鏈垨缁熻鏁版嵁婧愶級锛岀被鍨嬪瓧娈靛皢鐢ㄤ綔鏇挎崲鑴氭湰涓殑 @瀛楁@ 锛岀被鍨嬪瓧娈靛搴斿�间负锛氭棩 -> day锛涘懆 -> week锛涙湀 -> month锛涘 -> quarter锛涘勾 -> year锛涜嚜瀹氫箟 -> customized'
+ reLabel.field = '绫诲瀷瀛楁'
+ }
+
+ return {
+ shows,
+ reOptions,
+ reTypes,
+ reTooltip,
+ reRequired,
+ reLabel
+ }
}
- /**
- * @description 鎼滅储鏉′欢绫诲瀷鍒囨崲
- */
- openTypeChange = (key, value) => {
- const { dict } = this.props
- const { resourceType, items, display } = this.state
+ optionChange = (key, value) => {
+ this.record[key] = value
+ let _fieldval = {}
if (key === 'type') {
- let _options = this.getOptions(value, resourceType, display)
- let matchs = []
+ this.record.initval = ''
+ _fieldval.initval = ''
- this.setState({
- openType: value,
- formlist: this.state.formlist.map(form => {
- form.hidden = !_options.includes(form.key) // 闅愯棌琛ㄥ崟
+ if (value === 'text' || value === 'multiselect') {
+ this.record.match = 'like'
+ _fieldval.match = 'like'
+ } else if (value === 'select' || value === 'link' || value === 'checkcard') {
+ this.record.match = '='
+ _fieldval.match = '='
+ } else if (value === 'date') {
+ this.record.match = '>='
+ _fieldval.match = '>='
+ } else if (value === 'datemonth' || value === 'dateweek' || value === 'daterange' || value === 'range') {
+ this.record.match = 'between'
+ _fieldval.match = 'between'
+ }
- if (form.key === 'initval') {
- if (dateOptions.hasOwnProperty(value)) { // 鏍规嵁鎼滅储鏉′欢绫诲瀷锛岄�夋嫨鍒濆鍊肩殑绫诲瀷鍙婃暟鎹�
- form.options = dateOptions[value]
- form.type = 'select'
- } else if (value === 'group') {
- form.options = groupOptions.filter(op => items.includes(op.value))
- form.type = 'cascader'
- } else {
- form.type = 'text'
- }
- } else if (form.key === 'match') { // 鎼滅储鏉′欢绫诲瀷鍒囨崲鏃讹紝鍖归厤瑙勫垯绫诲瀷瀵瑰簲鍒囨崲
- if (value === 'text') {
- form.options = matchReg.text
- } else if (value === 'multiselect') {
- form.options = matchReg.multiselect
- } else if (value === 'select' || value === 'link' || value === 'checkcard') {
- form.options = matchReg.select
- } else if (value === 'date') {
- form.options = matchReg.date
- } else if (value === 'datemonth') {
- form.options = matchReg.datemonth
- } else if (value === 'dateweek' || value === 'daterange' || value === 'range') {
- form.options = matchReg.daterange
- }
- matchs = form.options
- } else if (form.key === 'field') {
- form.tooltip = ''
- form.label = dict['model.form.field']
- if (value === 'text' || value === 'select') {
- form.tooltip = this.state.textTooltip
- } else if (value === 'group') {
- form.tooltip = '鏌ヨ鏁版嵁鏃讹紙鑷畾涔夎剼鏈垨缁熻鏁版嵁婧愶級锛岀被鍨嬪瓧娈靛皢鐢ㄤ綔鏇挎崲鑴氭湰涓殑 @瀛楁@ 锛岀被鍨嬪瓧娈靛搴斿�间负 {"鏃�": "day", "鍛�": "week", "鏈�": "month", "瀛�": "quarter", "骞�": "year", "鑷畾涔�": "customized"}銆�'
- form.label = dict['model.form.type'] + dict['model.form.field']
- }
+ if (value === 'checkcard') {
+ this.record.multiple = 'false'
+ _fieldval.multiple = 'false'
+ }
+
+ if (this.record.options.length > 0) {
+ if (value === 'checkcard') {
+ this.record.options = this.record.options.map(cell => {
+ cell.$value = cell.Value || ''
+ delete cell.Value
+ return cell
+ })
+
+ if (this.record.options[0].Text) {
+ let key = Utils.getuuid()
+
+ this.record.fields = [{
+ $index: 1,
+ align: 'left',
+ color: 'rgba(0, 0, 0, 0.85)',
+ field: 'Text',
+ fontSize: 14,
+ key: key,
+ uuid: key
+ }]
}
-
- return form
- })
- }, () => {
- if (this.props.form.getFieldValue('initval') !== undefined) {
- this.props.form.setFieldsValue({initval: ''})
+ } else if (['multiselect', 'select', 'link'].includes(value)) {
+ if (!this.record.options[0].Text && this.record.fields.length > 0) {
+ let field = this.record.fields[0].field
+
+ this.record.options = this.record.options.map(cell => {
+ cell.Value = cell.Value || cell.$value || ''
+ cell.Text = cell[field] || ''
+
+ return cell
+ })
+ } else {
+ this.record.options = this.record.options.map(cell => {
+ cell.Value = cell.Value || cell.$value || ''
+
+ return cell
+ })
+ }
}
- if (this.props.form.getFieldValue('match') !== undefined) {
- this.props.form.setFieldsValue({match: matchs[0].value})
- }
- if (this.props.form.getFieldValue('multiple') !== undefined) {
- this.props.form.setFieldsValue({multiple: 'false'})
- }
- })
- }
- }
-
- /**
- * @description 鏁版嵁婧愮被鍨嬪垏鎹�
- */
- onChange = (e, key) => {
- const { openType, display, resourceType } = this.state
- let value = e.target.value
-
- if (key === 'resourceType') {
- let _options = this.getOptions(openType, value, display)
-
- this.setState({
- resourceType: value,
- formlist: this.state.formlist.map(form => {
- form.hidden = !_options.includes(form.key)
- return form
- })
- })
- } else if (key === 'display') {
- let _options = this.getOptions(openType, resourceType, value)
-
- this.setState({
- display: value,
- formlist: this.state.formlist.map(form => {
- form.hidden = !_options.includes(form.key)
- return form
- })
- })
+ }
} else if (key === 'multiple') {
- let matchs = []
- this.setState({
- formlist: this.state.formlist.map(form => {
- if (form.key === 'match') {
- if (value === 'true') {
- form.options = matchReg.multiselect
- } else {
- form.options = matchReg.select
- }
- matchs = form.options
- }
-
- return form
- })
- }, () => {
- if (this.props.form.getFieldValue('match') !== undefined) {
- this.props.form.setFieldsValue({match: matchs[0].value})
- }
- })
+ if (value === 'false') {
+ this.record.match = '='
+ _fieldval.match = '='
+ } else if (value === 'true') {
+ this.record.match = 'like'
+ _fieldval.match = 'like'
+ }
+ } else if (key === 'items') {
+ let _initval = this.props.form.getFieldValue('initval')
+ if (_initval && !value.includes(_initval[0])) {
+ this.record.initval = ''
+ _fieldval.initval = ''
+ }
}
- }
- changeField = (data) => {
+ let { shows, reOptions, reTypes, reLabel, reTooltip, reRequired } = this.getMutilOptions()
+
this.setState({
- cFields: data,
- formlist: this.state.formlist.map(form => {
- if (form.key === 'fields') {
- form.initVal = data
+ formlist: this.state.formlist.map(item => {
+ item.hidden = !shows.includes(item.key)
+ item.initVal = this.record[item.key]
+
+ if (reOptions[item.key]) {
+ item.options = reOptions[item.key]
}
- return form
+ if (reTypes[item.key]) {
+ item.type = reTypes[item.key]
+ }
+ if (reTooltip[item.key] !== undefined) {
+ item.tooltip = reTooltip[item.key]
+ }
+ if (reLabel[item.key] !== undefined) {
+ item.label = reLabel[item.key]
+ }
+ if (reRequired[item.key] !== undefined) {
+ item.required = reRequired[item.key]
+ }
+
+ return item
})
+ }, () => {
+ this.props.form.setFieldsValue(_fieldval)
})
}
- checkChange = (values, key) => {
- const { openType, formlist } = this.state
+ changeField = (data) => {
+ this.record.fields = data || []
+ }
- if (key === 'items') {
- this.setState({
- items: values,
- formlist: formlist.map(form => {
- if (form.key === 'initval' && openType === 'group') {
- form.options = groupOptions.filter(op => values.includes(op.value))
- }
-
- return form
- })
- })
-
- let _initval = this.props.form.getFieldValue('initval')
- if (_initval && !values.includes(_initval[0])) {
- this.props.form.setFieldsValue({initval: ''})
- }
- }
+ changeOptions = (data) => {
+ this.record.options = data || []
}
handleSubmit = (e) => {
@@ -398,243 +388,147 @@
}
getFields() {
- const { openType } = this.state
const { getFieldDecorator } = this.props.form
+ const { dict } = this.props
+ const { formlist } = this.state
const fields = []
- this.state.formlist.forEach((item, index) => {
+
+ formlist.forEach((item, index) => {
if (item.hidden || item.forbid) return
+ let span = 12
+ let rules = []
+ let className = ''
+ let content = null
+ let initVal = item.initVal || ''
+
if (item.type === 'text') { // 鏂囨湰鎼滅储
- let rules = []
+ let type = this.record.type
+ rules = [
+ { required: item.required, message: dict['form.required.input'] + item.label + '!' }
+ ]
if (item.key === 'field' || item.key === 'datefield') {
- rules = [{
- pattern: (openType === 'text' || openType === 'select') ? formRule.field.multipattern : formRule.field.pattern,
+ rules.push({
+ pattern: (type === 'text' || type === 'select') ? formRule.field.multipattern : formRule.field.pattern,
message: formRule.field.message
}, {
max: formRule.field.max,
message: formRule.field.maxMessage
- }]
+ })
} else {
- rules = [{
+ rules.push({
max: formRule.input.max,
message: formRule.input.message
- }]
+ })
}
-
- fields.push(
- <Col span={12} key={index}>
- <Form.Item 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 + '!'
- },
- ...rules
- ]
- })(<Input placeholder="" autoComplete="off" disabled={item.readonly} onPressEnter={this.handleSubmit} />)}
- </Form.Item>
- </Col>
- )
+
+ content = <Input placeholder="" autoComplete="off" onPressEnter={this.handleSubmit} />
} else if (item.type === 'number') {
- fields.push(
- <Col span={12} key={index}>
- <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: [
- {
- required: item.required,
- message: this.props.dict['form.required.input'] + item.label + '!'
- }
- ]
- })(item.max ?
- <InputNumber min={item.min} max={item.max} precision={0} onPressEnter={this.handleSubmit}/> :
- <InputNumber onPressEnter={this.handleSubmit}/>
- )}
- </Form.Item>
- </Col>
- )
- } else if (item.type === 'select') { // 涓嬫媺鎼滅储
- 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.select'] + item.label + '!'
- }
- ]
- })(
- <Select
- showSearch
- filterOption={(input, option) => option.props.children[2].toLowerCase().indexOf(input.toLowerCase()) >= 0}
- onChange={(value) => {this.openTypeChange(item.key, value)}}
- getPopupContainer={() => document.getElementById('commontable-search-form-box')}
- >
- {item.options.map(option =>
- <Select.Option id={option.value} title={option.text} key={option.value} value={option.value}>
- {item.key === 'icon' && <MkIcon type={option.text} />} {option.text}
- </Select.Option>
- )}
- </Select>
- )}
- </Form.Item>
- </Col>
- )
- } else if (item.type === 'radio') {
- fields.push(
- <Col span={12} key={index}>
- <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: [
- {
- required: !!item.required,
- message: this.props.dict['form.required.select'] + item.label + '!'
- }
- ]
- })(
- <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>,
- )}
- </Form.Item>
- </Col>
- )
- } else if (item.type === 'textarea') {
- fields.push(
- <Col span={24} key={index}>
- <Form.Item className="text-area" label={item.label}>
- {getFieldDecorator(item.key, {
- initialValue: item.initVal,
- rules: [
- {
- required: !!item.required,
- message: this.props.dict['form.required.input'] + item.label + '!'
- }
- ]
- })(<CodeMirror />)}
- </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={this.state.openType} data={item.initVal}/>)}
- </Form.Item>
- </Col>
- )
+ rules = [
+ { required: item.required, message: dict['form.required.input'] + item.label + '!' }
+ ]
+ initVal = item.initVal
+
+ if (item.max) {
+ content = <InputNumber min={item.min} max={item.max} precision={0} onPressEnter={this.handleSubmit}/>
} 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>
- )
+ content = <InputNumber onPressEnter={this.handleSubmit}/>
+ }
+ } else if (item.type === 'select') { // 涓嬫媺鎼滅储
+ rules = [
+ { required: item.required, message: dict['form.required.select'] + item.label + '!' }
+ ]
+
+ content = <Select
+ showSearch
+ allowClear={item.allowClear === true}
+ filterOption={(input, option) => option.props.children[2].toLowerCase().indexOf(input.toLowerCase()) >= 0}
+ onChange={(value) => {this.optionChange(item.key, value)}}
+ getPopupContainer={() => document.getElementById('commontable-search-form-box')}
+ >
+ {item.options.map((option, i) =>
+ <Select.Option key={`${i}`} value={option.value}>
+ {option.text || option.label}
+ </Select.Option>
+ )}
+ </Select>
+ } else if (item.type === 'radio') {
+ rules = [
+ { required: item.required, message: dict['form.required.select'] + item.label + '!' }
+ ]
+
+ content = <Radio.Group onChange={(e) => {this.optionChange(item.key, e.target.value)}}>
+ {item.options.map(option => {
+ return (
+ <Radio key={option.value} value={option.value}>{option.text}</Radio>
+ )
+ })}
+ </Radio.Group>
+ } else if (item.type === 'textarea') {
+ rules = [
+ { required: item.required, message: dict['form.required.input'] + item.label + '!' }
+ ]
+ span = 24
+ className = 'text-area'
+
+ content = <CodeMirror />
+ } else if (item.type === 'options') {
+ span = 24
+ className = 'text-area'
+
+ let type = this.record.type
+
+ if (type !== 'checkcard') {
+ content = <EditTable type={type} transfield={{}} linkSubFields={[]} onChange={this.changeOptions}/>
+ } else {
+ if (this.record.linkField) {
+ type = 'link'
+ }
+ content = <DataTable dict={dict} type={type} display={this.record.display} linkSubFields={[]} transfield={{}} fields={this.record.fields || []} onChange={this.changeOptions}/>
}
} 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
- })(<FieldsTable dict={this.props.dict} onChange={this.changeField}/>)}
- </Form.Item>
- </Col>
- )
+ span = 24
+ className = 'text-area'
+
+ content = <FieldsTable dict={dict} onChange={this.changeField}/>
} else if (item.type === 'checkbox') {
- 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.select'] + item.label + '!'
- }
- ]
- })(
- <Checkbox.Group style={{width: '105%'}} options={item.options} onChange={(values) => this.checkChange(values, item.key)}/>
- )}
- </Form.Item>
- </Col>
- )
+ rules = [
+ { required: item.required, message: dict['form.required.select'] + item.label + '!' }
+ ]
+
+ content = <Checkbox.Group style={{width: '105%'}} options={item.options} onChange={(values) => this.optionChange(item.key, values)}/>
} else if (item.type === 'multiselect') { // 澶氶��
- fields.push(
- <Col span={12} key={index}>
- <Form.Item label={item.label}>
- {getFieldDecorator(item.key, {
- initialValue: item.initVal || []
- })(
- <Select
- showSearch
- mode="multiple"
- filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
- >
- {item.options.map((option, i) =>
- <Select.Option id={i} key={i} value={option.value}>{option.text}</Select.Option>
- )}
- </Select>
- )}
- </Form.Item>
- </Col>
- )
+ content = <Select
+ showSearch
+ mode="multiple"
+ filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
+ >
+ {item.options.map((option, i) =>
+ <Select.Option id={i} key={i} value={option.value}>{option.text}</Select.Option>
+ )}
+ </Select>
} else if (item.type === 'cascader') { // 澶氶��
- fields.push(
- <Col span={12} key={index}>
- <Form.Item label={item.label}>
- {getFieldDecorator(item.key, {
- initialValue: item.initVal
- })(
- <Cascader options={item.options} placeholder="" />
- )}
- </Form.Item>
- </Col>
- )
+ content = <Cascader options={item.options} placeholder="" />
} 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>
- )
+ className = 'color-form-item'
+ content = <ColorSketch allowClear={true}/>
}
+
+ fields.push(
+ <Col span={span} key={index}>
+ <Form.Item className={className} label={item.tooltip ?
+ <Tooltip placement="topLeft" title={item.tooltip}>
+ <QuestionCircleOutlined className="mk-form-tip" />
+ {item.label}
+ </Tooltip> : item.label
+ }>
+ {getFieldDecorator(item.key, {
+ initialValue: initVal,
+ rules: rules
+ })(content)}
+ </Form.Item>
+ </Col>
+ )
})
return fields
@@ -645,23 +539,92 @@
return new Promise((resolve, reject) => {
this.props.form.validateFieldsAndScroll((err, values) => {
if (!err) {
- let isvalid = true
values.uuid = this.props.card.uuid
// 涓嬫媺鑿滃崟鎴栬仈鍔ㄨ彍鍗�
- if (['multiselect', 'select', 'link', 'checkcard'].includes(values.type) && values.resourceType === '0') {
- values.options = values.options || []
- values.dataSource = ''
- let emptys = []
- if (['multiselect', 'select'].includes(values.type)) {
- emptys = values.options.filter(op => !(op.Value && op.Text))
- } else if (values.type === 'link') {
- emptys = values.options.filter(op => !(op.Value && op.Text && op.ParentID))
+ if (['multiselect', 'select', 'link'].includes(values.type)) {
+ if (values.resourceType === '0') {
+ values.options = values.options || []
+ values.dataSource = ''
+
+ if (values.options.filter(op => op.Text === '').length > 0) {
+ notification.warning({
+ top: 92,
+ message: '鎻愮ず鏂囨湰锛圱ext锛変笉鍙负绌猴紒',
+ duration: 5
+ })
+ return
+ } else if (values.options.filter(op => op.Value === '').length > 1) {
+ notification.warning({
+ top: 92,
+ message: 'Value涓虹┖鏈�澶氬彧鍙坊鍔犱竴琛岋紙鍦ㄥ叧鑱旇彍鍗曚腑锛孷alue涓虹┖鏃朵笉鍖哄垎ParentID锛夛紒',
+ duration: 5
+ })
+ return
+ } else if (values.type === 'link') {
+ let arr = values.options.map(m => m.ParentID + m.Value)
+ let _arr = Array.from(new Set(arr))
+ if (arr.length > _arr.length) {
+ notification.warning({
+ top: 92,
+ message: '鍚屼竴ParentID涓紝Value鍊间笉鍙噸澶嶏紒',
+ duration: 5
+ })
+ return
+ }
+ } else {
+ let arr = values.options.map(m => m.Value)
+ let _arr = Array.from(new Set(arr))
+ if (arr.length > _arr.length) {
+ notification.warning({
+ top: 92,
+ message: 'Value鍊间笉鍙噸澶嶏紒',
+ duration: 5
+ })
+ return
+ }
+ }
+ } else {
+ values.options = []
}
- if (emptys.length > 0) {
- isvalid = false
+ } else if (values.type === 'checkcard') {
+ if (values.resourceType === '0') {
+ values.options = values.options || []
+ values.options = values.options.map(m => {
+ m.ParentID = m.ParentID || ''
+ return m
+ })
+
+ let type = values.type
+ if (values.linkField) {
+ type = 'link'
+ }
+
+ if (type === 'link') {
+ let arr = values.options.map(m => m.ParentID + m.$value)
+ let _arr = Array.from(new Set(arr))
+ if (arr.length > _arr.length) {
+ notification.warning({
+ top: 92,
+ message: '鍚屼竴ParentID涓紝Value鍊间笉鍙噸澶嶏紒',
+ duration: 5
+ })
+ return
+ }
+ } else {
+ let arr = values.options.map(m => m.$value)
+ let _arr = Array.from(new Set(arr))
+ if (arr.length > _arr.length) {
+ notification.warning({
+ top: 92,
+ message: 'Value鍊间笉鍙噸澶嶏紒',
+ duration: 5
+ })
+ return
+ }
+ }
+ } else {
+ values.options = []
}
- } else if (['multiselect', 'select', 'link', 'checkcard'].includes(values.type) && values.resourceType === '1') {
- values.options = []
}
if (values.type === 'range') {
@@ -705,32 +668,24 @@
}
}
- if (isvalid) {
- ['linkField', 'valueField', 'valueText', 'orderBy'].forEach(item => {
- if (values[item]) {
- values[item] = values[item].replace(/\s* | \t* | \v* | \r*/ig, '')
- }
- })
-
- let error = Utils.verifySql(values.dataSource)
-
- if (error) {
- notification.warning({
- top: 92,
- message: '鏁版嵁婧愪腑涓嶅彲浣跨敤' + error,
- duration: 5
- })
- return
+ ['linkField', 'valueField', 'valueText', 'orderBy'].forEach(item => {
+ if (values[item]) {
+ values[item] = values[item].replace(/\s* | \t* | \v* | \r*/ig, '')
}
+ })
- resolve(values)
- } else {
+ let error = Utils.verifySql(values.dataSource)
+
+ if (error) {
notification.warning({
top: 92,
- message: '涓嬫媺閫夐」璁剧疆閿欒锛�',
+ message: '鏁版嵁婧愪腑涓嶅彲浣跨敤' + error,
duration: 5
})
+ return
}
+
+ resolve(values)
} else {
reject(err)
}
--
Gitblit v1.8.0