From f59a500d24291d7f54b71dcca939a2a23dedca7c Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期四, 18 六月 2020 17:52:03 +0800 Subject: [PATCH] 2020-06-18 --- src/tabviews/zshare/mutilform/index.jsx | 402 +++++++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 318 insertions(+), 84 deletions(-) diff --git a/src/tabviews/zshare/mutilform/index.jsx b/src/tabviews/zshare/mutilform/index.jsx index 7a30c0d..29bd63c 100644 --- a/src/tabviews/zshare/mutilform/index.jsx +++ b/src/tabviews/zshare/mutilform/index.jsx @@ -1,7 +1,10 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' +import { fromJS } from 'immutable' import { Form, Row, Col, Input, InputNumber, Select, DatePicker, notification } from 'antd' import moment from 'moment' + +import Api from '@/api' import { formRule } from '@/utils/option.js' import Utils from '@/utils/utils.js' import FileUpload from '../fileupload' @@ -12,29 +15,32 @@ class MainSearch extends Component { static propTpyes = { + menuType: PropTypes.object, // 鑿滃崟绫诲瀷锛屾槸鍚︿负HS action: PropTypes.object, // 鎸夐挳淇℃伅銆佽〃鍗曞垪琛� dict: PropTypes.object, // 瀛楀吀椤� data: PropTypes.any, // 琛ㄦ牸鏁版嵁 + BID: PropTypes.any, // 涓昏〃ID BData: PropTypes.any, // 涓昏〃鏁版嵁 - configMap: PropTypes.object, // 鎸夐挳鍙婁笅鎷夎〃鍗曢厤缃俊鎭泦 inputSubmit: PropTypes.func // input鍥炶溅鎻愪氦 } state = { - cols: 2, - datatype: null, - readtype: null, - readin: null, - fieldlen: null, - formlist: [], - record: {} + cols: 2, // 鏄剧ず涓哄灏戝垪 + datatype: null, // 鏁版嵁绫诲瀷 + readtype: null, // 鏄惁鍙 + readin: null, // 琛屾暟鎹槸鍚﹀啓鍏� + fieldlen: null, // 瀛楁闀垮害 + formlist: [], // 琛ㄥ崟椤� + encrypts: [], // 鍔犲瘑瀛楁 + intercepts: [], // 鎴彇瀛楁 + record: {} // 璁板綍涓嬫媺琛ㄥ崟鍏宠仈瀛楁锛岀敤浜庢暟鎹啓鍏� } UNSAFE_componentWillMount () { let cols = 2 if (this.props.action.setting && this.props.action.setting.cols) { cols = parseInt(this.props.action.setting.cols) - if (cols > 3 || cols < 1) { + if (cols > 4 || cols < 1) { cols = 2 } } @@ -46,13 +52,15 @@ componentDidMount () { const { data, BData } = this.props - let action = JSON.parse(JSON.stringify(this.props.action)) + let action = fromJS(this.props.action).toJS() let datatype = {} let readtype = {} let readin = {} let fieldlen = {} let formlist = [] + let encrypts = [] + let intercepts = [] if (action.groups.length > 0) { action.groups.forEach(group => { @@ -75,12 +83,26 @@ let _inputfields = formlist.filter(item => item.type === 'text' || item.type === 'number') // 鐢ㄤ簬杩囨护涓嬫媺鑿滃崟鍏宠仈琛ㄥ崟 formlist = formlist.map(item => { + if (item.type === 'title') return item + + // 鍔犲瘑瀛楁 + if (item.type === 'textarea' && item.encryption === 'true') { + encrypts.push(item.field) + } + + // 瀛楃鎴彇瀛楁 + if (item.interception === 'true') { + intercepts.push(item.field) + } + + // 鏁版嵁鍐欏叆 let _readin = item.readin !== 'false' if (item.type === 'linkMain' || item.type === 'funcvar') { _readin = false } - item.initVal = item.initval ? JSON.parse(JSON.stringify(item.initval)) : '' // 鐢ㄤ簬鍙楁帶鍊肩殑琛ㄥ崟锛岄殣钘忔椂浼犻粯璁ゅ�� + // 鐢ㄤ簬鍙楁帶鍊肩殑琛ㄥ崟锛岄殣钘忔椂浼犻粯璁ゅ��(鏈娇鐢紵) + item.initVal = typeof(item.initval) === 'object' ? fromJS(item.initval).toJS() : item.initval let _fieldlen = item.fieldlength || 50 if (item.type === 'textarea' || item.type === 'fileupload' || item.type === 'multiselect') { @@ -103,26 +125,85 @@ }) } - if (item.resourceType === '1' && this.props.configMap.hasOwnProperty(item.uuid)) { - item.options = [...item.options, ...this.props.configMap[item.uuid]] - } + // 淇濆瓨鍒濆鍒楄〃锛岀敤浜庡叧鑱旇彍鍗曟帶鍒� + item.oriOptions = fromJS(item.options).toJS() - item.oriOptions = JSON.parse(JSON.stringify(item.options)) - + // 涓嬬骇琛ㄥ崟鎺у埗-瀛楁鍐欏叆 if (item.linkSubField && item.linkSubField.length > 0) { let _fields = _inputfields.map(_item => _item.field) item.linkSubField = item.linkSubField.filter(_item => _fields.includes(_item)) } } + let newval = '' + if (item.type === 'linkMain' && BData && BData.hasOwnProperty(item.field)) { - item.initval = BData[item.field] + newval = BData[item.field] } else if (item.type !== 'linkMain' && _readin && !/^date/.test(item.type) && this.props.data && this.props.data.hasOwnProperty(item.field)) { - item.initval = this.props.data[item.field] + newval = this.props.data[item.field] + } else if (item.type === 'date') { // 鏃堕棿鎼滅储 + if (_readin && this.props.data && this.props.data.hasOwnProperty(item.field)) { + newval = this.props.data[item.field] + } + if (newval) { + newval = moment(newval, 'YYYY-MM-DD') + newval = newval.format('YYYY-MM-DD') === 'Invalid date' ? '' : newval + } + if (!newval && item.initval) { + newval = moment().subtract(item.initval, 'days') + } else if (!newval) { + newval = null + } + } else if (item.type === 'datemonth') { + if (_readin && this.props.data && this.props.data.hasOwnProperty(item.field)) { + newval = this.props.data[item.field] + } + if (newval) { + newval = moment(newval, 'YYYY-MM') + newval = newval.format('YYYY-MM') === 'Invalid date' ? '' : newval + } + if (!newval && item.initval) { + newval = moment().subtract(item.initval, 'month') + } else if (!newval) { + newval = null + } + } else if (item.type === 'datetime') { + if (_readin && this.props.data && this.props.data.hasOwnProperty(item.field)) { + newval = this.props.data[item.field] + } + if (newval) { + newval = moment(newval, 'YYYY-MM-DD HH:mm:ss') + newval = newval.format('YYYY-MM-DD HH:mm:ss') === 'Invalid date' ? '' : newval + } + if (!newval && item.initval) { + newval = moment().subtract(item.initval, 'days') + } else if (!newval) { + newval = null + } } + // 鍔犲瘑瀛楁锛岃В瀵嗗鐞� + if (item.type === 'textarea' && item.encryption === 'true' && newval !== '') { + try { + newval = window.decodeURIComponent(window.atob(newval)) + } catch (e) { + console.warn(e) + } + } + + // 璇诲彇琛ㄦ牸鏁版嵁鎴栬鏈夋椂闂寸殑鍒濆鍊� + item.initval = newval !== '' ? newval : item.initval + + // 涓嬫媺琛ㄥ崟锛屽瓨鍦ㄤ笂绾ц彍鍗曟椂锛岀敓鎴愭樉绀哄�煎垪琛紝浼樺厛浠ユ暟瀛楀垽鏂� if (item.supvalue) { - item.supvalue = item.supvalue.split(',') + let supvals = [] + item.supvalue.split(',').forEach(val => { + supvals.push(val) + if (/^([-]?(0|[1-9][0-9]*)(\.[0-9]+)?)$/.test(val)) { + supvals.push(+val) + } + }) + item.supvalue = supvals } return item @@ -141,9 +222,11 @@ notification.warning({ top: 92, message: '鏈煡璇㈠埌琛ㄥ崟銆�' + item.label + '銆嬪叧鑱斿瓧娈碉紒', - duration: 10 + duration: 5 }) + item.supInitVal = '' } else { + item.supInitVal = supItem.initval item.options = item.oriOptions.filter(option => option.parentId === supItem.initval) } } @@ -156,6 +239,8 @@ datatype: datatype, readin: readin, fieldlen: fieldlen, + encrypts: encrypts, + intercepts: intercepts, formlist: formlist }, () => { if (action.setting && action.setting.focus) { @@ -171,8 +256,115 @@ console.warn('focus error锛�') } } + // 鐢ㄦ潵鏇存柊state锛岄槻姝㈠彈鎺ц〃鍗曞垵濮嬫椂涓嶆樉绀� this.setState({ loaded: true + }) + this.improveActionForm() + }) + } + + /** + * @description 鑾峰彇涓嬫媺琛ㄥ崟閫夐」淇℃伅 + */ + improveActionForm = () => { + const { formlist } = this.state + let deffers = [] + + formlist.forEach(item => { + if (!['select', 'link', 'multiselect'].includes(item.type) || item.resourceType !== '1') return + + let param = { + func: 'sPC_Get_SelectedList', + LText: item.data_sql, + obj_name: 'data', + arr_field: item.arr_field + } + + if (this.props.BID) { + param.BID = this.props.BID + } + + param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') + '.000' + param.secretkey = Utils.encrypt(param.LText, param.timestamp) + + if (this.props.menuType === 'HS') { // 浜戠鏁版嵁楠岃瘉 + param.open_key = Utils.encrypt(param.secretkey, param.timestamp, true) + } + + deffers.push( + new Promise(resolve => { + Api.getSystemCacheConfig(param, item.database === 'sso').then(res => { + res.$search = item + resolve(res) + }) + }) + ) + }) + + if (deffers.length === 0) return + + let _field = {} + let error = '' + Promise.all(deffers).then(result => { + result.forEach(res => { + if (res.status) { + let options = res.data.map(cell => { + let item = { + key: Utils.getuuid(), + Value: cell[res.$search.valueField], + Text: cell[res.$search.valueText] + } + + if (res.$search.type === 'link') { + item.parentId = cell[res.$search.linkField] + } else if (res.$search.type === 'select' && res.$search.linkSubField && res.$search.linkSubField.length > 0) { + res.$search.linkSubField.forEach(_field => { + item[_field] = (cell[_field] || cell[_field] === 0) ? cell[_field] : '' + }) + } + + return item + }) + + _field[res.$search.uuid] = options + } else { + error = res + } + }) + + if (error) { + notification.warning({ + top: 92, + message: error.message, + duration: 5 + }) + } + + let _formlist = formlist.map(item => { + if (item.type === 'select' || item.type === 'link' || item.type === 'multiselect') { + if (item.resourceType === '1' && _field.hasOwnProperty(item.uuid)) { + item.oriOptions = [...item.oriOptions, ..._field[item.uuid]] + } + } + return item + }) + + _formlist = _formlist.map(item => { + if (item.type === 'link') { + if (item.supInitVal) { + item.options = item.oriOptions.filter(option => option.parentId === item.supInitVal) + } else { + item.options = item.oriOptions + } + } else if (item.type === 'select' || item.type === 'multiselect') { + item.options = item.oriOptions + } + return item + }) + + this.setState({ + formlist: _formlist }) }) } @@ -184,10 +376,13 @@ supfields.forEach(supfield => { formlist = formlist.map(item => { if (item.type === 'link' && item.linkField === supfield.field) { + item.options = item.oriOptions.filter(option => option.parentId === supfield.initval) item.initval = item.options[0] ? item.options[0].Value : '' - fieldsvalue[item.field] = item.initval + if (this.props.form.getFieldValue(item.field) !== undefined) { + fieldsvalue[item.field] = item.initval + } subfields.push(item) } @@ -204,7 +399,7 @@ selectChange = (_field, value, option) => { const { record } = this.state - let formlist = JSON.parse(JSON.stringify(this.state.formlist)) + let formlist = fromJS(this.state.formlist).toJS() let subfields = [] let fieldsvalue = {} @@ -214,7 +409,9 @@ item.options = item.oriOptions.filter(option => option.parentId === value) item.initval = item.options[0] ? item.options[0].Value : '' - fieldsvalue[item.field] = item.initval + if (this.props.form.getFieldValue(item.field) !== undefined) { + fieldsvalue[item.field] = item.initval + } subfields.push(item) } @@ -226,9 +423,9 @@ let _data = option.props.data _field.linkSubField.forEach(subfield => { if (this.props.form.getFieldValue(subfield) !== undefined) { - fieldsvalue[subfield] = _data[subfield] || '' + fieldsvalue[subfield] = (_data[subfield] || _data[subfield] === 0) ? _data[subfield] : '' } else { - _record[subfield] = _data[subfield] || '' + _record[subfield] = (_data[subfield] || _data[subfield] === 0) ? _data[subfield] : '' } }) } @@ -282,10 +479,6 @@ const fields = [] formlist.forEach((item, index) => { - // if ((!item.field && item.type !== 'title') || item.hidden === 'true') return - - // if (item.supField && !item.supvalue.includes(this.props.form.getFieldValue(item.supField))) return - if (item.type === 'title') { fields.push( <Col span={24} key={index}> @@ -311,13 +504,18 @@ pattern: /^[a-zA-Z0-9]*$/ig, message: formRule.input.letternummsg }] + } else if (item.regular === 'funcname') { + _rules = [{ + pattern: /^[\u4E00-\u9FA50-9a-zA-Z_]*$/ig, + message: formRule.input.funcname + }] } } fields.push( <Col span={24 / cols} key={index}> <Form.Item label={item.label}> {getFieldDecorator(item.field, { - initialValue: item.initval || '', + initialValue: item.initval, rules: [ { required: item.required === 'true', @@ -420,17 +618,11 @@ </Col> ) } else if (item.type === 'date') { // 鏃堕棿鎼滅储 - let _initval = this.props.data ? this.props.data[item.field] : '' - if (_initval && this.state.readin[item.field]) { - _initval = moment(_initval, 'YYYY-MM-DD') - } else { - _initval = item.initval ? moment().subtract(item.initval, 'days') : null - } fields.push( <Col span={24 / cols} key={index}> <Form.Item label={item.label}> {getFieldDecorator(item.field, { - initialValue: _initval, + initialValue: item.initval, rules: [ { required: item.required === 'true', @@ -444,17 +636,11 @@ </Col> ) } else if (item.type === 'datemonth') { - let _initval = this.props.data ? this.props.data[item.field] : '' - if (_initval && this.state.readin[item.field]) { - _initval = moment(_initval, 'YYYY-MM') - } else { - _initval = item.initval ? moment().subtract(item.initval, 'month') : null - } fields.push( <Col span={24 / cols} key={index}> <Form.Item label={item.label}> {getFieldDecorator(item.field, { - initialValue: _initval, + initialValue: item.initval, rules: [ { required: item.required === 'true', @@ -468,17 +654,11 @@ </Col> ) } else if (item.type === 'datetime') { - let _initval = this.props.data ? this.props.data[item.field] : '' - if (_initval && this.state.readin[item.field]) { - _initval = moment(_initval, 'YYYY-MM-DD HH:mm:ss') - } else { - _initval = item.initval ? moment().subtract(item.initval, 'days') : null - } fields.push( <Col span={24 / cols} key={index}> <Form.Item label={item.label}> {getFieldDecorator(item.field, { - initialValue: _initval, + initialValue: item.initval, rules: [ { required: item.required === 'true', @@ -486,7 +666,6 @@ } ] })( - // <DatePicker showTime getCalendarContainer={() => document.getElementById('form-box')} /> <DatePicker showTime disabled={item.readonly === 'true'} /> )} </Form.Item> @@ -546,28 +725,20 @@ </Col> ) } else if (item.type === 'funcvar') { - // fields.push( - // <Col span={24 / cols} key={index}> - // <Form.Item label={item.label}> - // {getFieldDecorator(item.field, { - // initialValue: item.linkfield || '', - // })(<Input placeholder="" autoComplete="off" disabled={item.readonly === 'true'} />)} - // </Form.Item> - // </Col> - // ) + // 鍑芥暟鍙橀噺瀛楁锛岄粯璁や笉鏄剧ず } else if (item.type === 'textarea') { let _max = item.fieldlength || 512 let _labelcol = cols !== 3 ? 8 / cols : 3 let _wrapcol = cols !== 3 ? 16 + (cols - 1) * 4 : 21 let _style = {} - if (cols === 2) { + if (cols === 2 || cols === 4) { _style.paddingLeft = '7px' } fields.push( <Col span={24} key={index} className="textarea-row" style={{..._style}}> <Form.Item label={item.label} labelCol={{xs: { span: 24 }, sm: { span: _labelcol }}} wrapperCol={ {xs: { span: 24 }, sm: { span: _wrapcol }} }> {getFieldDecorator(item.field, { - initialValue: item.initval || '', + initialValue: item.initval, rules: [ { required: item.required === 'true', @@ -589,7 +760,14 @@ } handleConfirm = () => { - const { record } = this.state + const { record, intercepts } = this.state + let _encrypts = fromJS(this.state.encrypts).toJS() + let _format = { + date: 'YYYY-MM-DD', + datemonth: 'YYYY-MM', + datetime: 'YYYY-MM-DD HH:mm:ss' + } + // 琛ㄥ崟鎻愪氦鏃舵鏌ヨ緭鍏ュ�兼槸鍚︽纭� return new Promise((resolve, reject) => { this.props.form.validateFieldsAndScroll((err, values) => { @@ -599,54 +777,77 @@ this.state.formlist.forEach(item => { if (!item.field) return + let _item = null if (item.type === 'funcvar') { - search.push({ + _item = { type: 'funcvar', readonly: 'true', readin: false, fieldlen: this.state.fieldlen[item.field], key: item.field, value: '' - }) + } } else if (item.hidden === 'true') { let _val = item.initval if (record.hasOwnProperty(item.field)) { _val = record[item.field] + _encrypts = _encrypts.filter(_field => _field !== item.field) // 闅愯棌瀛楁锛屼笉鍙備笌鍔犲瘑澶勭悊 } - search.push({ + + _item = { type: this.state.datatype[item.field], readonly: this.state.readtype[item.field], readin: this.state.readin[item.field], fieldlen: this.state.fieldlen[item.field], key: item.field, value: _val - }) + } } else if (item.supField && !item.supvalue.includes(this.props.form.getFieldValue(item.supField))) { - search.push({ + _item = { type: this.state.datatype[item.field], readonly: this.state.readtype[item.field], readin: this.state.readin[item.field], fieldlen: this.state.fieldlen[item.field], key: item.field, - value: item.initVal - }) + value: item.initval + } } + + if (!_item) return + + if (item.type === 'date' || item.type === 'datemonth' || item.type === 'datetime') { + if (_item.value && _item.value.format) { + _item.value = _item.value.format(_format[item.type]) + } else if (!_item.value) { + _item.value = '' + } + } + + search.push(_item) }) Object.keys(values).forEach(key => { + if (values[key] === undefined) { // 琛ㄥ崟寮傚父锛燂紵锛� + if (search.filter(s => s.key === key).length === 0) { + search.push({ + type: this.state.datatype[key], + readonly: this.state.readtype[key], + readin: this.state.readin[key], + fieldlen: this.state.fieldlen[key], + key: key, + value: '' + }) + } + return + } + let _value = '' if (this.state.datatype[key] === 'datetime') { - if (values[key]) { - _value = moment(values[key]).format('YYYY-MM-DD HH:mm:ss') - } + _value = values[key] ? moment(values[key]).format('YYYY-MM-DD HH:mm:ss') : '' } else if (this.state.datatype[key] === 'datemonth') { - if (values[key]) { - _value = moment(values[key]).format('YYYY-MM') - } + _value = values[key] ? moment(values[key]).format('YYYY-MM') : '' } else if (this.state.datatype[key] === 'date') { - if (values[key]) { - _value = moment(values[key]).format('YYYY-MM-DD') - } + _value = values[key] ? moment(values[key]).format('YYYY-MM-DD') : '' } else if (this.state.datatype[key] === 'number') { _value = values[key] @@ -667,9 +868,12 @@ } _value = vals.join(',') - } else if (this.state.datatype[key] === 'text') { - _value = values[key].replace(/(^\s*|\s*$) | \t* | \v*/ig, '') + } else if (this.state.datatype[key] === 'text' || this.state.datatype[key] === 'textarea') { + _value = values[key].replace(/\t*|\v*/g, '') // 鍘婚櫎鍒惰〃绗� + if (intercepts.includes(key)) { // 鍘婚櫎棣栧熬绌烘牸 + _value = _value.replace(/(^\s*|\s*$)/g, '') + } } else { _value = values[key] @@ -684,6 +888,23 @@ value: _value }) }) + + // 鍚湁鍔犲瘑瀛楁鏃讹紝瀵硅〃鍗曞�艰繘琛屽姞瀵� + if (_encrypts && _encrypts.length > 0) { + search = search.map(item => { + let _value = item.value + if (_encrypts.includes(item.key)) { + try { + _value = window.btoa(window.encodeURIComponent(_value)) + } catch (e) { + console.warn(e) + } + } + item.value = _value + + return item + }) + } resolve(search) } else { @@ -714,11 +935,25 @@ let _formlist = [] let rowIndex = 0 let colIndex = 0 + let filtration = {} + // 琛ㄥ崟鍒嗚锛岄伩鍏嶆帓鍒椾笉鏁撮綈 formlist.forEach(item => { if ((!item.field && item.type !== 'title') || item.hidden === 'true' || item.type === 'funcvar') return + if (item.supField) { // 澶氬眰琛ㄥ崟鎺у埗 + let _supVal = this.props.form.getFieldValue(item.supField) - if (item.supField && !item.supvalue.includes(this.props.form.getFieldValue(item.supField))) return + if (_supVal === undefined && filtration[item.supField]) { + _supVal = filtration[item.supField] + } + + if (item.supvalue.includes(_supVal)) { + let _subVal = this.props.form.getFieldValue(item.field) + filtration[item.field] = _subVal === undefined ? item.initval : _subVal + } else { + return + } + } _formlist[rowIndex] = _formlist[rowIndex] || [] if (item.type === 'textarea' || item.type === 'title') { @@ -742,7 +977,6 @@ return ( <Form {...formItemLayout} className="ant-advanced-search-form main-form-field" id="main-form-box"> - {/* <Row gutter={24}>{this.getFields(formlist)}</Row> */} {_formlist.map((formrow, index) => <Row key={index} gutter={24}>{this.getFields(formrow)}</Row>)} </Form> ) -- Gitblit v1.8.0