| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { is, fromJS } from 'immutable' |
| | | import { Form, Row, Col, Select, Button, InputNumber } from 'antd' |
| | | import { Form, Row, Col, Select, Button, InputNumber, Input, Tooltip } from 'antd' |
| | | import { QuestionCircleOutlined } from '@ant-design/icons' |
| | | |
| | | import { formRule } from '@/utils/option.js' |
| | | import './index.scss' |
| | | |
| | | |
| | |
| | | modularDetail: [], |
| | | funFields: [], |
| | | billFields: [], |
| | | type: '1' |
| | | type: '1', |
| | | TypeCharOne: 'Lp' |
| | | } |
| | | |
| | | UNSAFE_componentWillMount() { |
| | | let _modularDetail = [] |
| | | let _billFields = [] |
| | | |
| | | if (this.props.modular.length > 0) { |
| | | _modularDetail = this.props.modularDetail.filter(item => item.BID === this.props.modular[0].ID) |
| | | } |
| | | |
| | | let fieldMap = new Map() |
| | | this.props.fields.forEach(_field => { |
| | | if (_field.type === 'text' && !fieldMap.has(_field.field)) { |
| | | if (_field.type === 'text' && !fieldMap.has(_field.field.toLowerCase())) { |
| | | _billFields.push(_field) |
| | | fieldMap.set(_field.field, true) |
| | | fieldMap.set(_field.field.toLowerCase(), true) |
| | | } |
| | | }) |
| | | |
| | | if (this.props.btn.Ot !== 'notRequired') { |
| | | this.props.columns.forEach(_field => { |
| | | if (_field.type === 'text' && !fieldMap.has(_field.field)) { |
| | | if (_field.type === 'text' && !fieldMap.has(_field.field.toLowerCase())) { |
| | | _billFields.push(_field) |
| | | fieldMap.set(_field.field, true) |
| | | fieldMap.set(_field.field.toLowerCase(), true) |
| | | } |
| | | }) |
| | | } |
| | |
| | | type: '2', |
| | | funFields: _funFields, |
| | | editItem: record, |
| | | modularDetail: _detail |
| | | modularDetail: _detail, |
| | | TypeCharOne: record.TypeCharOne |
| | | }, () => { |
| | | this.props.form.setFieldsValue({ |
| | | field: record.field, |
| | |
| | | type: '1', |
| | | funFields: _funFields, |
| | | editItem: record, |
| | | TypeCharOne: record.TypeCharOne |
| | | }, () => { |
| | | this.props.form.setFieldsValue({ |
| | | let _form = { |
| | | field: record.field, |
| | | TypeCharOne: record.TypeCharOne, |
| | | Type: record.Type, |
| | | linkField: record.linkField, |
| | | }) |
| | | linkField: record.linkField |
| | | } |
| | | if (record.TypeCharOne === 'Lp') { |
| | | _form.mark = record.mark || '' |
| | | } |
| | | this.props.form.setFieldsValue(_form) |
| | | }) |
| | | } |
| | | } |
| | |
| | | TypeCharOneChange = (value) => { |
| | | if (value === 'Y' || value === 'n') { |
| | | this.setState({ |
| | | type: '2' |
| | | type: '2', |
| | | TypeCharOne: value |
| | | }) |
| | | } else { |
| | | this.setState({ |
| | | type: '1' |
| | | type: '1', |
| | | TypeCharOne: value |
| | | }) |
| | | } |
| | | } |
| | |
| | | values.linkFieldName = _billField ? _billField.label : '' |
| | | } |
| | | |
| | | this.props.orderChange(values) |
| | | this.setState({ |
| | | editItem: null |
| | | }, () => { |
| | | |
| | | this.props.orderChange(values) |
| | | let _usedfields = this.props.billcodes.map(item => item.field) |
| | | |
| | | this.setState({ |
| | | funFields: this.props.fields.filter(field => field.type === 'funcvar' && !_usedfields.includes(field.field)), |
| | | }) |
| | | }) |
| | | this.props.form.setFieldsValue({ |
| | | field: '', |
| | | }) |
| | | let _form = { |
| | | field: '' |
| | | } |
| | | if (this.state.TypeCharOne === 'Lp') { |
| | | _form.mark = '' |
| | | } |
| | | this.props.form.setFieldsValue(_form) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | render() { |
| | | const { getFieldDecorator } = this.props.form |
| | | const { type } = this.state |
| | | const { type, TypeCharOne } = this.state |
| | | const formItemLayout = { |
| | | labelCol: { |
| | | xs: { span: 24 }, |
| | |
| | | return ( |
| | | <Form {...formItemLayout} className="verify-form"> |
| | | <Row gutter={24}> |
| | | <Col span={10}> |
| | | <Col span={7}> |
| | | <Form.Item label={this.props.dict['header.form.funcvar']}> |
| | | {getFieldDecorator('field', { |
| | | initialValue: '', |
| | |
| | | )} |
| | | </Form.Item> |
| | | </Col> |
| | | <Col span={10}> |
| | | <Col span={7}> |
| | | <Form.Item label={'类型'}> |
| | | {getFieldDecorator('TypeCharOne', { |
| | | initialValue: 'Lp', |
| | |
| | | )} |
| | | </Form.Item> |
| | | </Col> |
| | | <Col span={4} className="add"> |
| | | <Button onClick={this.handleConfirm} type="primary"> |
| | | 确定 |
| | | </Button> |
| | | </Col> |
| | | {type === '1' ? <Col span={10}> |
| | | {type === '1' ? <Col span={7}> |
| | | <Form.Item label={'关联字段'}> |
| | | {getFieldDecorator('linkField', { |
| | | initialValue: '', |
| | |
| | | )} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | {type === '1' ? <Col span={10}> |
| | | <Form.Item label={'位数'}> |
| | | {getFieldDecorator('Type', { |
| | | initialValue: 4, |
| | | rules: [ |
| | | { |
| | | required: true, |
| | | message: this.props.dict['form.required.input'] + '位数!' |
| | | } |
| | | ] |
| | | })(<InputNumber min={1} max={10} precision={0} />)} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | {type === '2' ? <Col span={10}> |
| | | {type === '2' ? <Col span={7}> |
| | | <Form.Item label={'凭证类型'}> |
| | | {getFieldDecorator('ModularCode', { |
| | | initialValue: this.props.modular[0] ? this.props.modular[0].ID : '', |
| | |
| | | )} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | {type === '2' ? <Col span={10}> |
| | | <Col span={3} className="add"> |
| | | <Button onClick={this.handleConfirm} className="mk-green"> |
| | | 保存 |
| | | </Button> |
| | | </Col> |
| | | {type === '1' ? <Col span={7}> |
| | | <Form.Item label={'位数'}> |
| | | {getFieldDecorator('Type', { |
| | | initialValue: 4, |
| | | rules: [ |
| | | { |
| | | required: true, |
| | | message: this.props.dict['form.required.input'] + '位数!' |
| | | } |
| | | ] |
| | | })(<InputNumber min={1} max={10} precision={0} />)} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | {type === '2' ? <Col span={7}> |
| | | <Form.Item label={'凭证标识'}> |
| | | {getFieldDecorator('ModularDetailCode', { |
| | | initialValue: this.state.modularDetail[0] ? this.state.modularDetail[0].ModularDetailCode : '', |
| | |
| | | filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0} |
| | | > |
| | | {this.state.modularDetail.map(option => |
| | | <Select.Option title={option.CodeName} id={option.ModularDetailCode} key={option.ModularDetailCode} value={option.ModularDetailCode}> |
| | | <Select.Option style={{whiteSpace: 'unset'}} title={option.CodeName} id={option.ModularDetailCode} key={option.ModularDetailCode} value={option.ModularDetailCode}> |
| | | {option.CodeName} |
| | | </Select.Option> |
| | | )} |
| | |
| | | )} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | {TypeCharOne === 'Lp' ? <Col span={7}> |
| | | <Form.Item label={ |
| | | <Tooltip placement="topLeft" title="该标识用于生成行号规则"> |
| | | <QuestionCircleOutlined className="mk-form-tip" /> |
| | | 标识 |
| | | </Tooltip> |
| | | }> |
| | | {getFieldDecorator('mark', { |
| | | initialValue: '', |
| | | rules: [ |
| | | { |
| | | required: true, |
| | | message: this.props.dict['form.required.input'] + '标识!' |
| | | }, |
| | | { |
| | | pattern: /^[a-zA-Z0-9]*$/ig, |
| | | message: formRule.input.letternummsg |
| | | } |
| | | ] |
| | | })(<Input placeholder="" autoComplete="off" />)} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | </Row> |
| | | </Form> |
| | | ) |