| | |
| | | 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, Icon } from 'antd' |
| | | import { formRule } from '@/utils/option.js' |
| | | import './index.scss' |
| | | |
| | | |
| | |
| | | modularDetail: [], |
| | | funFields: [], |
| | | billFields: [], |
| | | type: '1' |
| | | type: '1', |
| | | TypeCharOne: 'Lp' |
| | | } |
| | | |
| | | UNSAFE_componentWillMount() { |
| | |
| | | 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 |
| | | }) |
| | | } |
| | | } |
| | |
| | | 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} type="primary"> |
| | | 确定 |
| | | </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="该标识用于生成行号规则,为空时使用按钮ID"> |
| | | <Icon type="question-circle" /> |
| | | {'标识'} |
| | | </Tooltip> |
| | | }> |
| | | {getFieldDecorator('mark', { |
| | | initialValue: '', |
| | | rules: [ |
| | | { |
| | | pattern: /^[a-zA-Z0-9]*$/ig, |
| | | message: formRule.input.letternummsg |
| | | } |
| | | ] |
| | | })(<Input placeholder="" autoComplete="off" />)} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | </Row> |
| | | </Form> |
| | | ) |