From b69b5f6329ca5f87932436b7a6c1ddfc3377e10f Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期四, 16 五月 2024 10:56:41 +0800 Subject: [PATCH] 2024-05-16 --- src/menu/components/card/cardcellcomponent/elementform/index.jsx | 189 ++++++++++++++++++++++------------------------ 1 files changed, 91 insertions(+), 98 deletions(-) diff --git a/src/menu/components/card/cardcellcomponent/elementform/index.jsx b/src/menu/components/card/cardcellcomponent/elementform/index.jsx index 651535c..992eff8 100644 --- a/src/menu/components/card/cardcellcomponent/elementform/index.jsx +++ b/src/menu/components/card/cardcellcomponent/elementform/index.jsx @@ -1,7 +1,7 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' import { fromJS } from 'immutable' -import { Form, Row, Col, Input, Select, Radio, Tooltip, InputNumber, Cascader, Popover, message } from 'antd' +import { Form, Row, Col, Input, Select, Radio, Tooltip, InputNumber, Cascader, Popover, message, AutoComplete } from 'antd' import { QuestionCircleOutlined } from '@ant-design/icons' import { formRule } from '@/utils/option.js' @@ -61,7 +61,7 @@ formlist: formlist.map(item => { item.hidden = !_options.includes(item.key) - if (item.key === 'field' || item.key === 'linkurl' || item.key === 'bgImage' || item.key === 'posterField') { + if ((item.key === 'field' || item.key === 'linkurl' || item.key === 'bgImage' || item.key === 'posterField') && item.type === 'select') { item.options = [] if (side === 'sub') { @@ -118,12 +118,14 @@ } else if (item.key === 'formula') { item.fields = [] - config.columns.forEach(col => { - item.fields.push(col.field) - }) - - if (config.subColumns) { - config.subColumns.forEach(col => { + if (side === 'sub') { + if (config.subColumns) { + config.subColumns.forEach(col => { + item.fields.push(col.field) + }) + } + } else { + config.columns.forEach(col => { item.fields.push(col.field) }) } @@ -156,7 +158,7 @@ item.required = card.eleType !== 'qrcode' } if (item.key === 'linkurl') { - item.type = card.link === 'dynamic' ? 'select' : 'textarea' + item.type = card.link === 'dynamic' ? item.defType : 'textarea' } return item @@ -192,14 +194,14 @@ if (['text', 'picture'].includes(this.record.eleType) && this.record.link) { _options.push('linkType') if (this.record.linkType === 'linkmenu') { - _options.push('open', 'joint') + _options.push('open') if (this.record.link === 'static') { _options.push('linkmenu') } else { _options.push('linkurl') } } else if (this.record.linkType === 'other') { - _options.push('linkurl', 'joint', 'open') + _options.push('linkurl', 'open') } else { _options.push('linkurl') } @@ -264,7 +266,7 @@ item.initVal = this.record[item.key] item.hidden = !_options.includes(item.key) - if (item.key === 'field') { + if (item.key === 'field' && item.type === 'select') { item.options = [] if (side === 'sub') { @@ -364,7 +366,7 @@ item.hidden = !_options.includes(item.key) if (item.key === 'linkurl') { - item.type = value === 'dynamic' ? 'select' : 'textarea' + item.type = value === 'dynamic' ? item.defType : 'textarea' } return item }) @@ -398,40 +400,76 @@ this.state.formlist.forEach((item, index) => { if (item.hidden || item.forbid) return + let label = item.label + if (item.tooltip) { + if (item.toolWidth) { + label = <Tooltip placement="topLeft" overlayStyle={{maxWidth: item.toolWidth}} title={<div onClick={(e) => e.stopPropagation()}>{item.tooltip}</div>}><QuestionCircleOutlined className="mk-form-tip" />{item.label}</Tooltip> + } else { + label = <Tooltip placement="topLeft" title={<div onClick={(e) => e.stopPropagation()}>{item.tooltip}</div>}><QuestionCircleOutlined className="mk-form-tip" />{item.label}</Tooltip> + } + } + if (item.type === 'text') { - 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.readonly ? false : !!item.required, - message: '璇疯緭鍏�' + item.label + '!' - }, - { - max: formRule.input.max, - message: formRule.input.message - } - ] - })(<Input placeholder="" autoComplete="off" disabled={item.readonly} onPressEnter={this.handleSubmit} />)} - </Form.Item> - </Col> - ) + let rules = item.rules || [] + if (item.options && item.options.length > 0) { + fields.push( + <Col span={12} key={index}> + <Form.Item label={label}> + {getFieldDecorator(item.key, { + initialValue: item.initVal || '', + rules: [ + { + required: !!item.required, + message: '璇疯緭鍏�' + item.label + '!' + }, + { + pattern: formRule.field.pattern, + message: formRule.field.message + }, + { + max: formRule.input.max, + message: formRule.input.message + } + ] + })( + <AutoComplete + dataSource={item.options.map((cell, i) => <AutoComplete.Option value={cell.value} key={i}> + {cell.value} + </AutoComplete.Option>)} + filterOption={(input, option) => option.props.children.indexOf(input) > -1} + > + <Input autoComplete="off" onPressEnter={this.handleSubmit} /> + </AutoComplete> + )} + </Form.Item> + </Col> + ) + } else { + fields.push( + <Col span={12} key={index}> + <Form.Item label={label}> + {getFieldDecorator(item.key, { + initialValue: item.initVal || '', + rules: [ + { + required: item.readonly ? false : !!item.required, + message: '璇疯緭鍏�' + item.label + '!' + }, + { + max: formRule.input.max, + message: formRule.input.message + }, + ...rules + ] + })(<Input placeholder="" autoComplete="off" disabled={item.readonly} onPressEnter={this.handleSubmit} />)} + </Form.Item> + </Col> + ) + } } else if (item.type === 'textarea') { fields.push( <Col span={24} className="textarea" key={index}> - <Form.Item label={item.tooltip ? - <Tooltip placement="topLeft" title={item.tooltip}> - <QuestionCircleOutlined className="mk-form-tip" /> - {item.label} - </Tooltip> : item.label - }> + <Form.Item label={label}> {getFieldDecorator(item.key, { initialValue: item.initVal || '', rules: [ @@ -448,12 +486,7 @@ if (item.help) { fields.push( <Col span={12} key={index}> - <Form.Item help={item.help} label={item.tooltip ? - <Tooltip placement="topLeft" title={item.tooltip}> - <QuestionCircleOutlined className="mk-form-tip" /> - {item.label} - </Tooltip> : item.label - }> + <Form.Item help={item.help} label={label}> {getFieldDecorator(item.key, { initialValue: item.initVal, rules: [{ @@ -467,12 +500,7 @@ } 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 - }> + <Form.Item label={label}> {getFieldDecorator(item.key, { initialValue: item.initVal, rules: [{ @@ -487,12 +515,7 @@ } 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 - }> + <Form.Item label={label}> {getFieldDecorator(item.key, { initialValue: item.initVal || '', rules: [{ @@ -520,12 +543,7 @@ } 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 - }> + <Form.Item label={label}> {getFieldDecorator(item.key, { initialValue: item.initVal || '', rules: [{ @@ -541,12 +559,7 @@ } 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 - }> + <Form.Item label={label}> {getFieldDecorator(item.key, { initialValue: item.initVal, rules: [{ @@ -568,7 +581,7 @@ } else if (item.type === 'color') { fields.push( <Col span={12} key={index} className="color-form"> - <Form.Item label={item.label}> + <Form.Item label={label}> {getFieldDecorator(item.key, { initialValue: item.initVal, rules: [ @@ -591,12 +604,7 @@ 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 - }> + <Form.Item label={label}> {getFieldDecorator(item.key, { initialValue: item.initVal, rules: [ @@ -614,12 +622,7 @@ } else if (item.type === 'cascader') { 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 - }> + <Form.Item label={label}> {getFieldDecorator(item.key, { initialValue: item.initVal || [], rules: [ @@ -637,12 +640,7 @@ } else if (item.type === 'table') { fields.push( <Col span={24} key={index} className="textarea"> - <Form.Item label={ - item.tooltip ? <Tooltip placement="topLeft" title={item.tooltip}> - <QuestionCircleOutlined className="mk-form-tip" /> - {item.label} - </Tooltip> : item.label - }> + <Form.Item label={label}> {getFieldDecorator(item.key, { initialValue: item.initVal || '', rules: [ @@ -660,12 +658,7 @@ } else if (item.type === 'codemirror') { fields.push( <Col span={24} key={index} className="textarea"> - <Form.Item label={ - <Tooltip placement="topLeft" overlayStyle={{width: 500, maxWidth: 500}} title={item.tooltip}> - <QuestionCircleOutlined className="mk-form-tip" /> - {item.label} - </Tooltip> - }> + <Form.Item label={label}> {getFieldDecorator(item.key, { initialValue: item.initVal || '', rules: [ -- Gitblit v1.8.0