From 2245384d97d69e36d09cd6baa877e50a81d9aff9 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期三, 29 十二月 2021 21:59:09 +0800 Subject: [PATCH] 2021-12-29 --- src/templates/zshare/modalform/index.jsx | 997 ++++++++++++++++++++++++++-------------------------------- 1 files changed, 447 insertions(+), 550 deletions(-) diff --git a/src/templates/zshare/modalform/index.jsx b/src/templates/zshare/modalform/index.jsx index 79d5953..7d1f0c2 100644 --- a/src/templates/zshare/modalform/index.jsx +++ b/src/templates/zshare/modalform/index.jsx @@ -22,9 +22,9 @@ 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'], + checkbox: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'fieldlength', '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'], + checkcard: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', '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'], @@ -52,98 +52,46 @@ } state = { - openType: null, - resourceType: null, - supField: '', - compress: 'false', - display: 'text', - enter: '', - cFields: [], - formlist: null, - linkSubFields: null + transfield: {}, + formlist: null } - UNSAFE_componentWillMount () { - let formlist = fromJS(this.props.formlist).toJS() - let type = '' - let resourceType = '' - let supField = '' - let display = '' - let compress = 'false' - let enter = '' - let cFields = [] - let linkSubFields = [] + record = {} - 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') { - let arr = [] - linkSubFields = cell.options.filter(option => { - if (!['Value', 'Text'].includes(option.field) && cell.initVal.includes(option.field) && !arr.includes(option.field)) { - arr.push(option.field) - return true - } else { - return false - } + UNSAFE_componentWillMount () { + let transfield = {} + this.props.formlist.forEach(item => { + this.record[item.key] = item.initVal + + if (item.key === 'linkSubField') { + item.options.forEach(cell => { + transfield[cell.field] = cell.label }) - } else if (cell.key === 'supField') { - supField = cell.initVal } }) - - let _options = this.getOptions(type, resourceType, supField, display, enter, compress) + + let { shows, reOptions, reTypes, reRequired, reTooltip } = this.getMutilOptions() this.setState({ - enter: enter, - compress: compress, - openType: type, - supField: supField, - display: display, - cFields: cFields, - resourceType: resourceType, - linkSubFields: linkSubFields, - formlist: formlist.map(form => { - if (form.key === 'initval') { - if (dateOptions.hasOwnProperty(type)) { - form.options = dateOptions[type] - form.type = 'select' - } else if (type === 'switch') { - form.initVal = !!form.initVal - form.options = [ - {value: true, text: '寮�'}, - {value: false, text: '鍏�'} - ] - form.type = 'radio' - } - if (type === 'number') { - form.type = 'number' - form.initVal = form.initVal || 0 - form.required = true - } else if (type === 'rate') { - form.type = 'number' - form.initVal = form.initVal || 0 - form.required = false - } - } else if (form.key === 'label') { - form.required = true - if (type === 'hint') { - form.required = false - } + transfield, + formlist: this.props.formlist.map(item => { + item.show = shows.includes(item.key) + item.initVal = this.record[item.key] + + if (reOptions[item.key]) { + item.options = reOptions[item.key] + } + if (reTypes[item.key]) { + item.type = reTypes[item.key] + } + if (reRequired[item.key] !== undefined) { + item.required = reRequired[item.key] + } + if (reTooltip[item.key] !== undefined) { + item.tooltip = reTooltip[item.key] } - form.show = _options.includes(form.key) - return form + return item }) }) } @@ -161,252 +109,257 @@ } } - getOptions = (type, resourceType, supField, display, enter, compress) => { - let _options = ['label', 'field', 'type', 'blacklist', 'writein', ...fromJS(modalTypeOptions[type]).toJS()] + getMutilOptions = () => { + let type = this.record.type + let shows = ['label', 'field', 'type', 'blacklist', 'writein', 'supField', ...fromJS(modalTypeOptions[type] || []).toJS()] + let reOptions = {} + let reTypes = {} + let reRequired = {} + let reTooltip = {} - if (type === 'hint') { - _options = fromJS(modalTypeOptions[type]).toJS() - } else if (type === 'split') { - return fromJS(modalTypeOptions[type]).toJS() + if (type === 'hint' || type === 'split') { + shows = fromJS(modalTypeOptions[type]).toJS() + } + + // text number select multiselect link switch checkbox radio checkcard fileupload date datemonth datetime textarea + // rate color brafteditor funcvar hint split linkMain + + // 閫氱敤璁剧疆 + reTypes.initval = 'text' + reRequired.initval = false + reRequired.label = true + reRequired.linkField = true + reTooltip.initval = '' + + if (type === 'text') { + if (this.record.enter === 'tab' || this.record.enter === 'sub') { + shows.push('tabField') + } + } else if (type === 'number') { + reTypes.initval = 'number' + reRequired.initval = true + if (this.record.enter === 'tab' || this.record.enter === 'sub') { + shows.push('tabField') + } } 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 (this.record.resourceType === '0') { // 鑷畾涔夎祫婧� + shows.push('options') + } else if (this.record.resourceType === '1') { // 鏁版嵁婧� + shows.push('dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'disableField', 'database') + } + if (type === 'select' || type === 'link') { + if (this.record.enter === 'tab' || this.record.enter === 'sub') { + shows.push('tabField') + } + } else if (type === 'radio') { + shows.push('linkField') + reRequired.linkField = false } } 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') + if (this.record.display === 'picture') { + if (this.record.resourceType === '0') { // 鑷畾涔夎祫婧� + shows.push('options', 'ratio') + } else if (this.record.resourceType === '1') { // 鏁版嵁婧� + shows.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 (this.record.resourceType === '0') { // 鑷畾涔夎祫婧� + shows.push('options', 'fields', 'backgroundColor') + } else if (this.record.resourceType === '1') { // 鏁版嵁婧� + shows.push('dataSource', 'cardValField', 'fields', 'orderBy', 'orderType', 'disableField', 'database', 'backgroundColor') } + } + + if (this.record.multiple === 'false') { + shows.push('linkSubField') + shows.push('linkField') + reRequired.linkField = false + } else { + reTooltip.initval = '娣诲姞澶氫釜鍒濆鍊艰浣跨敤閫楀彿鍒嗛殧銆�' } if (sessionStorage.getItem('appType') === 'mob') { - _options.push('hidelabel') + shows.push('hidelabel') } + } else if (['date', 'datemonth', 'datetime'].includes(type)) { + reOptions.initval = dateOptions[type] + reTypes.initval = 'select' + } else if (type === 'switch') { + reOptions.initval = [ + {value: true, text: '寮�'}, + {value: false, text: '鍏�'} + ] + reTypes.initval = 'radio' + } else if (type === 'rate') { + reTypes.initval = 'number' + } else if (type === 'hint') { + reRequired.label = false } else if (type === 'fileupload') { - if (compress === 'true') { - _options.push('limit', 'rduri', 'proRduri') + if (this.record.compress === 'true') { + shows.push('limit', 'rduri', 'proRduri') } else { - _options.push('suffix') + shows.push('suffix') } } - if (type === 'text' || type === 'number' || type === 'select' || type === 'link') { - if (enter === 'tab' || enter === 'sub') { - _options.push('tabField') - } + if (['multiselect', 'checkbox'].includes(type)) { + reTooltip.initval = '娣诲姞澶氫釜鍒濆鍊艰浣跨敤閫楀彿鍒嗛殧銆�' + } else if (['select', 'link', 'radio'].includes(type)) { + reTooltip.initval = '浣跨敤$first琛ㄧず榛樿閫夋嫨绗竴椤广��' } - if (type !== 'funcvar' && type !== 'linkMain') { - if (supField) { - _options.push('supField', 'supvalue') - } else { - _options.push('supField') - } + if (this.record.supField) { + shows.push('supvalue') } - return _options + return { + shows, + reOptions, + reTypes, + reRequired, + reTooltip + } } - openTypeChange = (key, value) => { + optionChange = (key, value) => { + let _fieldval = {} + if (key === 'type') { - let enter = 'false' - let fieldValue = {} + this.record.enter = 'false' + this.record.initval = '' + this.record.fieldlength = 50 + _fieldval.initval = '' if (value === 'text' || value === 'number') { - enter = 'sub' - fieldValue.enter = 'sub' + this.record.enter = 'sub' + _fieldval.enter = 'sub' } else if (value === 'select' || value === 'link') { - fieldValue.enter = 'false' + _fieldval.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') { - form.required = false - form.initVal = '' - 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 - form.initVal = 0 - } else if (value === 'rate') { - form.type = 'number' - form.required = false - form.initVal = 0 - } else { - form.type = 'text' - } + if (value === 'number' || value === 'rate') { + this.record.initval = 0 + _fieldval.initval = 0 + } else if (value === 'switch') { + this.record.initval = false + _fieldval.initval = false + } - if (form.show) { - fieldValue.initval = form.initVal - } - } else if (form.key === 'fieldlength') { - form.initVal = 50 - if (value === 'textarea' || value === 'brafteditor') { - form.initVal = 8000 - } else if (value === 'fileupload' || value === 'multiselect' || value === 'checkbox') { - form.initVal = 512 - } + if (['hint', 'split', 'brafteditor', 'funcvar', 'linkMain', 'fileupload'].includes(value)) { + delete _fieldval.initval + } - if (form.show) { - fieldValue.fieldlength = form.initVal - } - } else if (form.key === 'resourceType') { - form.initVal = this.state.resourceType + if (value === 'text' || value === 'linkMain' || value === 'checkcard') { + _fieldval.fieldlength = 50 + } else if (value === 'textarea' || value === 'brafteditor') { + this.record.fieldlength = 8000 + _fieldval.fieldlength = 8000 + } else if (value === 'fileupload' || value === 'multiselect' || value === 'checkbox') { + this.record.fieldlength = 512 + _fieldval.fieldlength = 512 + } - if (form.show) { - fieldValue.resourceType = form.initVal - } - } else if (form.key === 'linkSubField') { - form.initVal = this.state.linkSubFields.map(_field => _field.field) + if (value === 'brafteditor') { + this.record.encryption = 'true' + _fieldval.encryption = 'true' + } - 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' - } + if (value === 'linkMain') { + this.record.hidden = 'true' + _fieldval.hidden = 'true' + } + + 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 - }) - }, () => { - this.props.form.setFieldsValue(fieldValue) - }) - } else if (key === 'supField') { - this.setState({ - supField: value, - formlist: this.state.formlist.map(form => { - if (form.key === 'supvalue' && value) { - form.show = true - } else if (form.key === 'supvalue' && !value) { - form.show = false + } else if (['multiselect', 'select', 'link', 'radio', 'checkbox'].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 + }) } - - return form - }) - }) - } - } - - multiselectChange = (key, value, options) => { - if (key === 'linkSubField') { - let arr = [] - let linkSubField = {} - options.forEach(option => { - if (!['Value', 'Text'].includes(option.field) && value.includes(option.field) && !arr.includes(option.field)) { - arr.push(option.field) - linkSubField[option.field] = option } - }) - - let linkSubFields = [] - value.forEach(item => { - if (linkSubField[item]) { - linkSubFields.push(linkSubField[item]) - } - }) - - this.setState({linkSubFields: linkSubFields}) - } - } - - onChange = (e, key) => { - 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, compress) - - this.setState({ - resourceType: value, - formlist: this.state.formlist.map(form => { - form.show = _options.includes(form.key) - 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}) + this.record.fieldlength = 512 + _fieldval.fieldlength = 512 } else { - this.props.form.setFieldsValue({fieldlength: 50}) + this.record.fieldlength = 50 + _fieldval.fieldlength = 50 } } + + this.record[key] = value + + let { shows, reOptions, reTypes, reRequired, reTooltip } = this.getMutilOptions() + + this.setState({ + formlist: this.state.formlist.map(item => { + item.show = shows.includes(item.key) + item.initVal = this.record[item.key] + + if (reOptions[item.key]) { + item.options = reOptions[item.key] + } + if (reTypes[item.key]) { + item.type = reTypes[item.key] + } + if (reRequired[item.key] !== undefined) { + item.required = reRequired[item.key] + } + if (reTooltip[item.key] !== undefined) { + item.tooltip = reTooltip[item.key] + } + + return item + }) + }, () => { + this.props.form.setFieldsValue(_fieldval) + }) + } + + multiselectChange = (key, value) => { + if (key !== 'linkSubField') return + + this.record[key] = value } changeField = (data) => { - this.setState({ - cFields: data, - formlist: this.state.formlist.map(form => { - if (form.key === 'fields') { - form.initVal = data - } - return form - }) - }) + this.record.fields = data || [] + } + + changeOptions = (data) => { + this.record.options = data || [] } changeVal = (val, type) => { @@ -447,7 +400,6 @@ } } - if (labelwidth) { this.props.form.setFieldsValue({labelwidth}) } @@ -463,285 +415,162 @@ getFields() { const { getFieldDecorator } = this.props.form - const { openType } = this.state + const { dict } = this.props + const { transfield } = this.state const fields = [] this.state.formlist.forEach((item, index) => { if (!item.show || item.forbid) return null - if (item.type === 'text') { // 鏂囨湰鎼滅储 - let rules = [] + let span = 12 + let rules = [] + let className = '' + let content = null + let initVal = item.initVal || '' + + if (item.type === 'text') { + rules = [ + { required: item.required, message: dict['form.required.input'] + item.label + '!' } + ] if (item.key === 'field') { - rules = [{ + rules.push({ pattern: formRule.field.pattern, message: formRule.field.message }, { max: formRule.field.max, message: formRule.field.maxMessage - }] + }) } else { - rules = [ - { - max: formRule.input.max, - message: formRule.input.message - } - ] + 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" 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') { + rules = [ + { required: item.required, message: dict['form.required.input'] + item.label + '!' } + ] + initVal = item.initVal + if (item.max) { - 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 || 0, - rules: [ - { - required: !!item.required, - message: this.props.dict['form.required.input'] + item.label + '!' - } - ] - })(<InputNumber onChange={(value) => this.changeVal(value, item.key)} min={item.min} max={item.max} precision={item.precision} onPressEnter={this.handleSubmit}/>)} - </Form.Item> - </Col> - ) + content = <InputNumber onChange={(value) => this.changeVal(value, item.key)} min={item.min} max={item.max} precision={item.precision} onPressEnter={this.handleSubmit}/> } else { - 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 + '!' - } - ] - })(<InputNumber onPressEnter={this.handleSubmit}/>)} - </Form.Item> - </Col> - ) + content = <InputNumber onPressEnter={this.handleSubmit}/> } - } else if (item.type === 'select') { // 涓嬫媺鎼滅储 - 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 + '!' - } - ] - })( - <Select - showSearch - filterOption={(input, option) => option.props.children[2].toLowerCase().indexOf(input.toLowerCase()) >= 0} - onChange={(value) => {this.openTypeChange(item.key, value)}} - getPopupContainer={() => document.getElementById('modal-fields-form-box')} - > - {item.options.map((option, i) => - <Select.Option key={`${i}`} value={option.value || option.field || ''}> - {option.text || option.label} - </Select.Option> - )} - </Select> - )} - </Form.Item> - </Col> - ) + } 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('modal-fields-form-box')} + > + {item.options.map((option, i) => + <Select.Option key={`${i}`} value={option.value || option.field || ''}> + {option.text || option.label} + </Select.Option> + )} + </Select> } else if (item.type === 'multiselect') { // 澶氶�� - 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 - })( - <Select - showSearch - mode="multiple" - filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0} - onChange={(value) => this.multiselectChange(item.key, value, item.options)} - > - {item.options.map((option, i) => - <Select.Option key={i} value={option.field}>{option.label}</Select.Option> - )} - </Select> - )} - </Form.Item> - </Col> - ) + content = <Select + showSearch + mode="multiple" + filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0} + onChange={(value) => this.multiselectChange(item.key, value)} + > + {item.options.map((option, i) => + <Select.Option key={i} value={option.field}>{option.label}</Select.Option> + )} + </Select> } else if (item.type === 'radio') { - 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.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> - ) + 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 === 'codemirror') { - 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> - ) + rules = [ + { required: item.required, message: dict['form.required.input'] + item.label + '!' } + ] + span = 24 + className = 'text-area' + + content = <CodeMirror /> } 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> - ) + span = 24 + className = 'text-msg' + rules = [ + { required: item.required, message: dict['form.required.input'] + item.label + '!' } + ] + + content = <TextArea rows={item.rows || 4}/> } 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 type={openType} linkSubFields={this.state.linkSubFields}/>)} - </Form.Item> - </Col> - ) + span = 24 + className = 'text-area' + + let type = this.record.type + let linkSubFields = this.record.linkSubField || [] + + if (type !== 'checkcard') { + if (!['select', 'radio', 'link'].includes(type)) { + linkSubFields = [] + } + if (type === 'radio' && this.record.linkField) { + type = 'link' + } + content = <EditTable type={type} transfield={transfield} linkSubFields={linkSubFields} onChange={this.changeOptions}/> } 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> - ) + if (this.record.multiple === 'true') { + linkSubFields = [] + } + if (this.record.linkField) { + type = 'link' + } + content = <DataTable dict={this.props.dict} type={type} display={this.record.display} linkSubFields={linkSubFields} transfield={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={this.props.dict} onChange={this.changeField}/> } 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}/> } else if (item.type === 'icon') { - 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 + '!' - }] - })( - <MkEditIcon allowClear /> - )} - </Form.Item> - </Col> - ) + rules = [ + { required: item.required, message: dict['form.required.select'] + item.label + '!' } + ] + + content = <MkEditIcon allowClear /> } + + 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 @@ -758,23 +587,91 @@ if (values.resourceType === '0') { values.options = values.options || [] values.dataSource = '' - let empty = false + let type = values.type + if (values.type === 'radio' && values.linkField) { + type = 'link' + } - 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) { + if (values.options.filter(op => op.Text === '').length > 0) { notification.warning({ top: 92, - message: '涓嬫媺閫夐」璁剧疆閿欒锛�', + 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 (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 (values.type === 'checkcard') { + if (values.resourceType === '0') { + values.options = values.options || [] + let linkSubFields = values.linkSubField || [] + values.options = values.options.map(m => { + m.ParentID = m.ParentID || '' + + linkSubFields.forEach(n => { + m[n] = m[n] || '' + }) + 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 = [] -- Gitblit v1.8.0