From 20185ab64a165df51515d9fa1c9b12a7a8c55f59 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期五, 07 四月 2023 23:11:04 +0800 Subject: [PATCH] 2023-04-07 --- src/menu/components/table/normal-table/columns/editColumn/index.jsx | 142 ++++++++++++++++++++++++++++++----------------- 1 files changed, 90 insertions(+), 52 deletions(-) diff --git a/src/menu/components/table/normal-table/columns/editColumn/index.jsx b/src/menu/components/table/normal-table/columns/editColumn/index.jsx index 43c63ac..d580db8 100644 --- a/src/menu/components/table/normal-table/columns/editColumn/index.jsx +++ b/src/menu/components/table/normal-table/columns/editColumn/index.jsx @@ -1,7 +1,8 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' import { is, fromJS } from 'immutable' -import { Form, Row, Col, Input, Select, InputNumber, Radio, Tooltip, Icon, Cascader, Modal } from 'antd' +import { Form, Row, Col, Input, Select, InputNumber, Radio, Tooltip, Cascader, Modal, Checkbox } from 'antd' +import { QuestionCircleOutlined } from '@ant-design/icons' import { getColumnForm } from './formconfig' import { formRule } from '@/utils/option.js' @@ -13,15 +14,17 @@ number: ['label', 'field', 'type', 'Align', 'Hide', 'IsSort', 'Width', 'decimal', 'format', 'prefix', 'postfix', 'blacklist', 'perspective', 'sum', 'rowspan'], link: ['label', 'field', 'type', 'Align', 'Hide', 'IsSort', 'joint', 'Width', 'blacklist', 'nameField'], textarea: ['label', 'field', 'type', 'Align', 'Hide', 'IsSort', 'Width', 'prefix', 'postfix', 'blacklist'], - picture: ['label', 'field', 'type', 'Align', 'Hide', 'IsSort', 'Width', 'blacklist', 'scale', 'lenWidRadio', 'picSort'], + picture: ['label', 'field', 'type', 'Align', 'Hide', 'IsSort', 'Width', 'blacklist', 'scale', 'lenWidRadio', 'backgroundSize', 'span'], + video: ['label', 'field', 'type', 'Align', 'Hide', 'startTime', 'Width', 'blacklist', 'aspectRatio'], colspan: ['label', 'type', 'Align', 'Hide', 'blacklist'], - custom: ['label', 'type', 'Align', 'Hide', 'Width', 'blacklist'], - action: ['label', 'type', 'Align', 'Width'] + custom: ['label', 'type', 'Align', 'Width', 'blacklist'], + action: ['label', 'type', 'Align', 'Width'], + formula: ['label', 'type', 'Align', 'Hide', 'Width', 'prefix', 'postfix', 'eval', 'formula', 'blacklist'], + index: ['label', 'type', 'Align', 'Width'] } -class MainSearch extends Component { +class NormalTableColumn extends Component { static propTpyes = { - dict: PropTypes.object, // 瀛楀吀椤� visible: PropTypes.bool, column: PropTypes.object, fields: PropTypes.array, @@ -41,24 +44,18 @@ } editColumn = (column) => { - let menulist = sessionStorage.getItem('fstMenuList') - if (menulist) { - try { - menulist = JSON.parse(menulist) - } catch { - menulist = [] - } - } else { - menulist = [] - } - - let formlist = getColumnForm(column, menulist, this.props.fields) + let fields = fromJS(this.props.fields).toJS().map(item => { + item.text = `${item.field}锛�${item.label}锛塦 + return item + }) + + let formlist = getColumnForm(column, fields) let _options = fromJS(columnTypeOptions[column.type]).toJS() if (column.type === 'text' || column.type === 'number') { if (column.perspective === 'linkmenu') { - _options.push('linkmenu', 'linkfields') + _options.push('linkmenu', 'linkfields', 'open') } else if (column.perspective === 'linkurl') { - _options.push('linkurl', 'linkfields') + _options.push('linkurl', 'linkfields', 'open') } } @@ -70,16 +67,17 @@ return item }) - }, () => { - if (column.focus) { + }) + if (column.focus) { + setTimeout(() => { try { let _form = document.getElementById('label') _form && _form.select() - } catch { + } catch (e) { console.warn('琛ㄥ崟focus澶辫触锛�') } - } - }) + }, 200) + } } typeChange = (key, value, option) => { @@ -103,13 +101,34 @@ } }) } else if (key === 'field') { - this.props.form.setFieldsValue({label: option.props.children}) - if (this.state.type === 'number') { + let values = {label: option.props.label || option.props.children} + if (/Decimal|int/ig.test(option.props.datatype)) { let decimal = 0 if (/Decimal/ig.test(option.props.datatype)) { decimal = +option.props.datatype.replace(/Decimal\(18,/ig, '').replace(')', '') } - this.props.form.setFieldsValue({decimal}) + values.type = 'number' + values.decimal = decimal + } else { + values.type = 'text' + } + + if (values.type !== this.state.type) { + values.perspective = '' + let _options = fromJS(columnTypeOptions[values.type]).toJS() + + this.setState({ + type: values.type, + formlist: this.state.formlist.map(item => { + item.hidden = !_options.includes(item.key) + + return item + }) + }, () => { + this.props.form.setFieldsValue(values) + }) + } else { + this.props.form.setFieldsValue(values) } } else if (key === 'format' && value === 'percent') { this.props.form.setFieldsValue({postfix: '%'}) @@ -121,9 +140,9 @@ let _options = fromJS(columnTypeOptions[this.state.type]).toJS() if (value === 'linkmenu') { - _options.push('linkmenu', 'linkfields') + _options.push('linkmenu', 'linkfields', 'open') } else if (value === 'linkurl') { - _options.push('linkurl', 'linkfields') + _options.push('linkurl', 'linkfields', 'open') } this.setState({ @@ -144,9 +163,9 @@ if (!formlist) return null formlist.forEach((item, index) => { - if (item.hidden || item.forbidden) return + if (item.hidden || item.forbid) return - if (item.type === 'text') { // 鏂囨湰鎼滅储 + if (item.type === 'text') { let rules = [] if (item.key !== 'linkurl') { rules = [{ @@ -157,8 +176,8 @@ fields.push( <Col span={12} key={index}> <Form.Item label={item.tooltip ? - <Tooltip placement="topLeft" overlayClassName={item.tooltipClass} title={item.tooltip}> - <Icon type="question-circle" /> + <Tooltip placement="topLeft" title={item.tooltip}> + <QuestionCircleOutlined className="mk-form-tip" /> {item.label} </Tooltip> : item.label }> @@ -167,7 +186,7 @@ rules: [ { required: !!item.required, - message: this.props.dict['form.required.input'] + item.label + '!' + message: '璇疯緭鍏�' + item.label + '!' }, ...rules ] @@ -179,8 +198,8 @@ fields.push( <Col span={12} key={index}> <Form.Item label={item.tooltip ? - <Tooltip placement="topLeft" overlayClassName={item.tooltipClass} title={item.tooltip}> - <Icon type="question-circle" /> + <Tooltip placement="topLeft" title={item.tooltip}> + <QuestionCircleOutlined className="mk-form-tip" /> {item.label} </Tooltip> : item.label }> @@ -189,7 +208,7 @@ rules: [ { required: !!item.required, - message: this.props.dict['form.required.input'] + item.label + '!' + message: '璇疯緭鍏�' + item.label + '!' } ] })(item.unlimit ? <InputNumber onPressEnter={this.handleSubmit}/> : @@ -197,7 +216,7 @@ </Form.Item> </Col> ) - } else if (item.type === 'select') { // 涓嬫媺鎼滅储 + } else if (item.type === 'select') { fields.push( <Col span={12} key={index}> <Form.Item label={item.label}> @@ -206,7 +225,7 @@ rules: [ { required: !!item.required, - message: this.props.dict['form.required.select'] + item.label + '!' + message: '璇烽�夋嫨' + item.label + '!' } ] })( @@ -217,8 +236,8 @@ getPopupContainer={() => document.getElementById('columnwinter')} > {item.options.map((option, index) => - <Select.Option key={`${option.value || option.field}${index}`} datatype={option.datatype || ''} value={option.value || option.field}> - {option.text || option.label} + <Select.Option key={index} datatype={option.datatype || ''} label={option.label || ''} value={(option.value || option.field || option.MenuID)}> + {(option.text || option.label || option.MenuName)} </Select.Option> )} </Select> @@ -230,8 +249,8 @@ fields.push( <Col span={12} key={index}> <Form.Item label={item.tooltip ? - <Tooltip placement="topLeft" overlayClassName={item.tooltipClass} title={item.tooltip}> - <Icon type="question-circle" /> + <Tooltip placement="topLeft" title={item.tooltip}> + <QuestionCircleOutlined className="mk-form-tip" /> {item.label} </Tooltip> : item.label }> @@ -240,7 +259,7 @@ rules: [ { required: !!item.required, - message: this.props.dict['form.required.select'] + item.label + '!' + message: '璇烽�夋嫨' + item.label + '!' } ] })( @@ -253,6 +272,25 @@ }) } </Radio.Group> + )} + </Form.Item> + </Col> + ) + } else if (item.type === 'checkbox') { + 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 + })( + <Checkbox.Group> + {item.options.map(option => <Checkbox key={option.value} value={option.value}>{option.text}</Checkbox>)} + </Checkbox.Group> )} </Form.Item> </Col> @@ -286,7 +324,7 @@ rules: [ { required: !!item.required, - message: this.props.dict['form.required.select'] + item.label + '!' + message: '璇烽�夋嫨' + item.label + '!' } ] })( @@ -299,12 +337,12 @@ </Form.Item> </Col> ) - } else if (item.type === 'textarea') { // 鏂囨湰鎼滅储 + } else if (item.type === 'textarea') { fields.push( <Col span={24} key={index} className="textarea"> <Form.Item label={item.tooltip ? <Tooltip placement="topLeft" title={item.tooltip}> - <Icon type="question-circle" /> + <QuestionCircleOutlined className="mk-form-tip" /> {item.label} </Tooltip> : item.label }> @@ -313,10 +351,10 @@ rules: [ { required: !!item.required, - message: this.props.dict['form.required.input'] + item.label + '!' + message: '璇疯緭鍏�' + item.label + '!' } ] - })(<TextArea rows={2} disabled={item.readonly} onPressEnter={this.handleSubmit} />)} + })(<TextArea rows={2} disabled={item.readonly} placeholder={item.placeholder || ''}/>)} </Form.Item> </Col> ) @@ -359,7 +397,7 @@ <Modal title="鏄剧ず鍒楃紪杈�" visible={visible} - width={800} + width={850} maskClosable={false} onOk={this.handleSubmit} onCancel={this.editModalCancel} @@ -374,4 +412,4 @@ } } -export default Form.create()(MainSearch) \ No newline at end of file +export default Form.create()(NormalTableColumn) \ No newline at end of file -- Gitblit v1.8.0