From a70940450c021a47e69abdf8fa8f7f98594601cc Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期五, 13 十二月 2019 17:36:54 +0800 Subject: [PATCH] 2019-12-13 --- src/templates/comtableconfig/searchform/index.jsx | 189 ++++++++++++++++++++--------------------------- 1 files changed, 80 insertions(+), 109 deletions(-) diff --git a/src/templates/comtableconfig/searchform/index.jsx b/src/templates/comtableconfig/searchform/index.jsx index c151d01..94f3db4 100644 --- a/src/templates/comtableconfig/searchform/index.jsx +++ b/src/templates/comtableconfig/searchform/index.jsx @@ -1,77 +1,87 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' import { Form, Row, Col, Input, Select, Icon, Radio, notification } from 'antd' +import { dateOptions, matchReg } from '@/utils/option.js' import EditTable from '../editable' import './index.scss' const { TextArea } = Input -const matchReg = { - text: [{ - value: 'like', - text: 'like' - }, { - value: 'not like', - text: 'not like' - }, { - value: '=', - text: '=' - }], - select: [{ - value: '=', - text: '=' - }, { - value: 'like', - text: 'like' - }, { - value: 'not like', - text: 'not like' - }], - date: [{ - value: '>=', - text: '>=' - }, { - value: '<=', - text: '<=' - }, { - value: '>', - text: '>' - }, { - value: '<', - text: '<' - }, { - value: '=', - text: '=' - }], - daterange: [{ - value: 'between', - text: 'between' - }] -} class MainSearch extends Component { static propTpyes = { - dict: PropTypes.object, // 瀛楀吀椤� - formlist: PropTypes.any, - card: PropTypes.object + dict: PropTypes.object, // 瀛楀吀椤� + formlist: PropTypes.any, // 琛ㄥ崟 + card: PropTypes.object // 鎼滅储鏉′欢淇℃伅 } state = { - openType: null, - resourceType: null, - formlist: null, - dateoptions: { - date: [{value: '', text: '绌�'}, {value: '0', text: '褰撳ぉ'}, {value: 1, text: '鍓嶄竴澶�'}, {value: 3, text: '鍓嶄笁澶�'}, {value: 7, text: '鍓嶄竷澶�'}, {value: 30, text: '鍓�30澶�'}], - dateweek: [{value: '', text: '绌�'}, {value: '0', text: '鏈懆'}, {value: 1, text: '涓婂懆'}, {value: 3, text: '鍓嶄笁鍛�'}, {value: 7, text: '鍓嶄竷鍛�'}], - datemonth: [{value: '', text: '绌�'}, {value: '0', text: '鏈湀'}, {value: 1, text: '涓婃湀'}, {value: 3, text: '鍓嶄笁鏈�'}, {value: 7, text: '鍓嶄竷鏈�'}], - daterange: [{value: '', text: '绌�'}, {value: '0', text: '浠婂ぉ'}, {value: 1, text: '鏄ㄥぉ'}, {value: 3, text: '鍓嶄笁澶�'}, {value: 7, text: '鍓嶄竷澶�'}, {value: 30, text: '鍓�30澶�'}], - } + openType: null, // 鎼滅储鏉′欢鏄剧ず绫诲瀷 + resourceType: null, // 涓嬫媺鎼滅储鏃讹紝閫夐」鏉ユ簮绫诲瀷 + formlist: null // 琛ㄥ崟 } + /** + * @description 琛ㄥ崟棰勫鐞� + * 1銆佹牴鎹〃鍗曠被鍨嬶紝鏄剧ず琛ㄥ崟鍙紪杈戦」 + * 2銆佷笅鎷夐�夋嫨锛屾牴鎹暟鎹簮绫诲瀷鏄剧ず鐩稿叧閰嶇疆 + */ + UNSAFE_componentWillMount () { + const { formlist } = this.props + + let type = formlist.filter(cell => cell.key === 'type')[0].initVal + let resourceType = formlist.filter(cell => cell.key === 'resourceType')[0].initVal + let _options = ['label', 'field', 'initval', 'type', 'match'] // 榛樿鏄剧ず椤� + + if ((type === 'select' || type === 'link') && resourceType === '0') { // 涓嬫媺閫夋嫨绫诲瀷銆侀�夐」涓鸿嚜瀹氫箟璧勬簮 + _options = [..._options, 'resourceType', 'setAll', 'options', 'display'] + } else if ((type === 'select' || type === 'link') && resourceType === '1') { // 涓嬫媺閫夋嫨绫诲瀷銆侀�夐」涓哄悗鍙版暟鎹簮涓幏鍙� + _options = [..._options, 'resourceType', 'setAll', 'dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'display'] + } + + if (type === 'link') { // 鍏宠仈绫诲瀷銆佸鍔犲叧鑱斾笂绾х殑瀛楁鍚� + _options = [..._options, 'linkField'] + } + + this.setState({ + openType: type, + resourceType: resourceType, + formlist: formlist.map(form => { + // 琛ㄥ崟涓哄垵濮嬪�煎瓧娈碉紝涓旀暟鎹被鍨嬪睘浜庢椂闂寸被鍨嬫椂锛岃缃垵濮嬪�间负涓嬫媺閫夋嫨锛屽苟閲嶇疆閫夋嫨椤� + if (form.key === 'initval' && dateOptions.hasOwnProperty(type)) { + form.options = dateOptions[type] + form.type = 'select' + } + // 琛ㄥ崟涓哄尮閰嶅瓧娈垫椂锛屾牴鎹笉鍚岀殑绫诲瀷锛屾樉绀哄搴旂殑鍖归厤瑙勫垯 + if (form.key === 'match') { + if (type === 'text') { + form.options = matchReg.text + } else if (type === 'select' || type === 'link') { + form.options = matchReg.select + } else if (type === 'date' || type === 'datemonth') { + form.options = matchReg.date + } else if (type === 'dateweek' || type === 'daterange') { + form.options = matchReg.daterange + } + } + form.hidden = !_options.includes(form.key) + return form + }) + }) + } + + /** + * @description 鎼滅储鏉′欢绫诲瀷鍒囨崲 + */ openTypeChange = (key, value) => { + const { resourceType } = this.state + if (key === 'type') { let _options = ['label', 'field', 'initval', 'type', 'match'] - if (value === 'select' || value === 'link') { // 鍒囨崲绫诲瀷涓洪�夋嫨鎴栧叧鑱旀椂锛屾潵婧愰粯璁や负鑷畾涔� + + if ((value === 'select' || value === 'link') && resourceType === '0') { // 涓嬫媺閫夋嫨绫诲瀷銆侀�夐」涓鸿嚜瀹氫箟璧勬簮 _options = [..._options, 'resourceType', 'setAll', 'options', 'display'] + } else if ((value === 'select' || value === 'link') && resourceType === '1') { // 涓嬫媺閫夋嫨绫诲瀷銆侀�夐」涓哄悗鍙版暟鎹簮涓幏鍙� + _options = [..._options, 'resourceType', 'setAll', 'dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'display'] } if (value === 'link') { @@ -80,21 +90,19 @@ this.setState({ openType: value, - resourceType: '0', formlist: this.state.formlist.map(form => { - form.hidden = !_options.includes(form.key) + form.hidden = !_options.includes(form.key) // 闅愯棌琛ㄥ崟 + if (form.key === 'initval') { - if (this.state.dateoptions.hasOwnProperty(value)) { - form.options = this.state.dateoptions[value] + if (dateOptions.hasOwnProperty(value)) { // 鏍规嵁鎼滅储鏉′欢绫诲瀷锛岄�夋嫨鍒濆鍊肩殑绫诲瀷鍙婃暟鎹� + form.options = dateOptions[value] form.type = 'select' } else { form.type = 'text' } - form.initVal = '' + form.initVal = '' // 鎼滅储鏉′欢绫诲瀷鍒囨崲鏃讹紝鍒濆鍊肩疆绌� form.hidden = true - } - - if (form.key === 'match') { + } else if (form.key === 'match') { // 鎼滅储鏉′欢绫诲瀷鍒囨崲鏃讹紝鍖归厤瑙勫垯绫诲瀷瀵瑰簲鍒囨崲 if (value === 'text') { form.options = matchReg.text } else if (value === 'select' || value === 'link') { @@ -106,18 +114,20 @@ } form.hidden = true } + return form }) }, () => { this.setState({ formlist: this.state.formlist.map(form => { + if (form.key === 'initval') { form.hidden = false - } - if (form.key === 'match') { + } else if (form.key === 'match') { form.initVal = form.options[0].value form.hidden = false } + return form }) }) @@ -125,11 +135,16 @@ } } + /** + * @description 鏁版嵁婧愮被鍨嬪垏鎹� + */ onChange = (e, key) => { const { openType } = this.state let value = e.target.value + if (key === 'resourceType') { let _options = ['label', 'field', 'initval', 'type', 'match', 'resourceType', 'setAll', 'display'] + if (value === '0') { _options = [..._options, 'options'] } else if (value === '1') { @@ -298,50 +313,6 @@ } }) }) - } - - resetForm = (formlist) => { - if (!formlist) return - let type = formlist.filter(cell => cell.key === 'type')[0].initVal - let resourceType = formlist.filter(cell => cell.key === 'resourceType')[0].initVal - let _options = ['label', 'field', 'initval', 'type', 'match'] // 榛樿鏄剧ず椤� - if ((type === 'select' || type === 'link') && resourceType === '0') { // 閫夋嫨绫诲瀷銆佽嚜瀹氫箟璧勬簮 - _options = [..._options, 'resourceType', 'setAll', 'options', 'display'] - } else if ((type === 'select' || type === 'link') && resourceType === '1') { // 閫夋嫨绫诲瀷銆佹暟鎹簮 - _options = [..._options, 'resourceType', 'setAll', 'dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'display'] - } - - if (type === 'link') { // 鍏宠仈绫诲瀷銆佸鍔犲叧鑱斿瓧娈� - _options = [..._options, 'linkField'] - } - - this.setState({ - openType: type, - resourceType: resourceType, - formlist: formlist.map(form => { - if (this.state.dateoptions.hasOwnProperty(type) && form.key === 'initval') { - form.options = this.state.dateoptions[type] - form.type = 'select' - } - if (form.key === 'match') { - if (type === 'text') { - form.options = matchReg.text - } else if (type === 'select' || type === 'link') { - form.options = matchReg.select - } else if (type === 'date' || type === 'datemonth') { - form.options = matchReg.date - } else if (type === 'dateweek' || type === 'daterange') { - form.options = matchReg.daterange - } - } - form.hidden = !_options.includes(form.key) - return form - }) - }) - } - - UNSAFE_componentWillMount () { - this.resetForm(this.props.formlist) } render() { -- Gitblit v1.8.0