import React, {Component} from 'react'
|
import PropTypes from 'prop-types'
|
import { is, fromJS } from 'immutable'
|
import { Form, Row, Col, Select, Switch, notification, Modal } from 'antd'
|
import { ConsoleSqlOutlined } from '@ant-design/icons'
|
// import './index.scss'
|
|
class UniqueForm extends Component {
|
static propTpyes = {
|
voucherobj: PropTypes.object, // 凭证信息
|
voucher: PropTypes.array, // 表单
|
columns: PropTypes.array, // 表单
|
voucherDetail: PropTypes.array, // 表单
|
voucherChange: PropTypes.func // 表单
|
}
|
|
state = {
|
voucher: [],
|
voucherDetail: [],
|
columns: []
|
}
|
|
UNSAFE_componentWillMount() {
|
let _voucher = []
|
let _voucherDetail = []
|
if (this.props.voucherobj.BVoucherType && this.props.voucher.length > 0) {
|
_voucher = this.props.voucher.filter(item => item.TypeCharOne === this.props.voucherobj.BVoucherType)
|
_voucherDetail = this.props.voucherDetail.filter(item => item.BID === this.props.voucherobj.VoucherType)
|
} else if (this.props.voucher.length > 0) {
|
_voucher = this.props.voucher.filter(item => item.TypeCharOne === 'MES')
|
_voucherDetail = this.props.voucherDetail.filter(item => _voucher[0] && item.BID === _voucher[0].ID)
|
}
|
|
this.setState({
|
voucher: _voucher,
|
voucherDetail: _voucherDetail,
|
columns: this.props.columns.filter(col => col.type === 'text')
|
})
|
}
|
|
UNSAFE_componentWillReceiveProps (nextProps) {
|
if (!is(fromJS(this.props.voucher), fromJS(nextProps.voucher)) && nextProps.voucher.length > 0) {
|
if (this.props.voucherobj.BVoucherType) {
|
let _voucher = nextProps.voucher.filter(item => item.TypeCharOne === this.props.voucherobj.BVoucherType)
|
let _voucherDetail = nextProps.voucherDetail.filter(item => item.BID === this.props.voucherobj.VoucherType)
|
|
this.setState({
|
voucher: _voucher,
|
voucherDetail: _voucherDetail
|
})
|
} else {
|
let _voucher = nextProps.voucher.filter(item => item.TypeCharOne === 'MES')
|
let _voucherDetail = nextProps.voucherDetail.filter(item => _voucher[0] && item.BID === _voucher[0].ID)
|
|
this.setState({
|
voucher: _voucher,
|
voucherDetail: _voucherDetail
|
})
|
this.props.form.setFieldsValue({
|
VoucherType: _voucher[0] ? _voucher[0].ID : '',
|
VoucherTypeOne: _voucherDetail[0] ? _voucherDetail[0].ModularDetailCode : ''
|
})
|
}
|
}
|
}
|
|
voucherTypeChange = (value) => {
|
const { voucherobj } = this.props
|
|
let _voucher = this.props.voucher.filter(item => item.TypeCharOne === value)
|
let _voucherDetail = this.props.voucherDetail.filter(item => _voucher[0] && item.BID === _voucher[0].ID)
|
|
this.setState({
|
voucher: _voucher,
|
voucherDetail: _voucherDetail
|
})
|
this.props.form.setFieldsValue({
|
VoucherType: _voucher[0] ? _voucher[0].ID : '',
|
VoucherTypeOne: _voucherDetail[0] ? _voucherDetail[0].ModularDetailCode : ''
|
})
|
|
if (voucherobj.enabled) {
|
this.props.voucherChange({...voucherobj, enabled: false})
|
}
|
}
|
|
voucherSChange = (value) => {
|
const { voucherobj } = this.props
|
let _detail = this.props.voucherDetail.filter(item => item.BID === value)
|
|
this.setState({
|
voucherDetail: _detail
|
})
|
this.props.form.setFieldsValue({
|
VoucherTypeOne: _detail[0] ? _detail[0].ModularDetailCode : ''
|
})
|
|
if (voucherobj.enabled) {
|
this.props.voucherChange({...voucherobj, enabled: false})
|
}
|
}
|
|
contentChange = () => {
|
const { voucherobj } = this.props
|
|
if (voucherobj.enabled) {
|
this.props.voucherChange({...voucherobj, enabled: false})
|
}
|
}
|
|
onEnabledChange = () => {
|
const { voucherobj } = this.props
|
|
if (voucherobj.enabled) {
|
this.props.voucherChange({...voucherobj, enabled: false})
|
} else {
|
this.handleConfirm()
|
}
|
}
|
|
|
handleConfirm = () => {
|
// 表单提交时检查输入值是否正确
|
this.props.form.validateFieldsAndScroll((err, values) => {
|
if (!err) {
|
values.enabled = true
|
let _detail = this.state.voucherDetail.filter(item => item.ModularDetailCode === values.VoucherTypeOne)[0]
|
|
if (!_detail) {
|
notification.warning({
|
top: 92,
|
message: '凭证类型或凭证标识不存在！',
|
duration: 5
|
})
|
return
|
}
|
values.VoucherTypeTwo = _detail.VoucherTypeTwo
|
values.Type = _detail.IDefine1
|
|
this.props.voucherChange(values)
|
}
|
})
|
}
|
|
voucherSql = () => {
|
let BVoucherType = this.props.form.getFieldValue('BVoucherType')
|
let VoucherTypeOne = this.props.form.getFieldValue('VoucherTypeOne')
|
let linkField = this.props.form.getFieldValue('linkField')
|
|
let _detail = this.state.voucherDetail.filter(item => item.ModularDetailCode === VoucherTypeOne)[0]
|
|
if (!_detail) {
|
notification.warning({
|
top: 92,
|
message: '凭证类型或凭证标识不存在！',
|
duration: 5
|
})
|
return
|
}
|
|
let _sql = `/* 创建凭证 */
|
exec s_BVoucher_Create
|
@Bill = @${linkField || ''},
|
@BVoucherType ='${BVoucherType}',
|
@VoucherTypeOne ='${VoucherTypeOne}',
|
@VoucherTypeTwo ='${_detail.VoucherTypeTwo}',
|
@Type =${_detail.IDefine1},
|
@UserID=@UserID@,
|
@Username=@Username,
|
@FullName=@FullName,
|
@BVoucher =@BVoucher OUTPUT ,
|
@FIBVoucherDate =@FIBVoucherDate OUTPUT ,
|
@FiYear =@FiYear OUTPUT ,
|
@ErrorCode =@ErrorCode OUTPUT,
|
@retmsg=@retmsg OUTPUT
|
if @ErrorCode!=''
|
GOTO aaa
|
`
|
|
Modal.info({
|
title: '',
|
width: 500,
|
className: 'sql-example',
|
icon: null,
|
content: _sql.split(/\n\s{6}/ig).map((n, index) => <div key={index} dangerouslySetInnerHTML={{ __html: n.replace(/\s/ig, ' ') }} style={{whiteSpace: 'nowrap'}}></div>)
|
})
|
}
|
|
render() {
|
const { getFieldDecorator } = this.props.form
|
const { voucherobj } = this.props
|
const { columns } = this.state
|
const formItemLayout = {
|
labelCol: {
|
xs: { span: 24 },
|
sm: { span: 10 }
|
},
|
wrapperCol: {
|
xs: { span: 24 },
|
sm: { span: 14 }
|
}
|
}
|
|
return (
|
<Form {...formItemLayout} className="verify-form">
|
<Row gutter={24}>
|
<Col span={11}>
|
<Form.Item label={'主类型'}>
|
{getFieldDecorator('BVoucherType', {
|
initialValue: voucherobj.BVoucherType || 'MES',
|
rules: [
|
{
|
required: true,
|
message: '请选择主类型!'
|
}
|
]
|
})(
|
<Select onChange={(value) => {this.voucherTypeChange(value)}}>
|
<Select.Option value="MES"> 业务类凭证 </Select.Option>
|
<Select.Option value="FCC"> 财务类凭证 </Select.Option>
|
<Select.Option value="WMS"> 物流类凭证 </Select.Option>
|
<Select.Option value="Z"> 自定义 </Select.Option>
|
</Select>
|
)}
|
</Form.Item>
|
</Col>
|
<Col span={11}>
|
<Form.Item label="凭证类型">
|
{getFieldDecorator('VoucherType', {
|
initialValue: voucherobj.VoucherType || (this.state.voucher[0] && this.state.voucher[0].ID) || '',
|
rules: [
|
{
|
required: true,
|
message: '请选择凭证类型!'
|
}
|
]
|
})(
|
<Select
|
showSearch
|
filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
|
onChange={(value) => {this.voucherSChange(value)}}
|
>
|
{this.state.voucher.map(option =>
|
<Select.Option key={option.ID} value={option.ID}>
|
{option.NameNO}
|
</Select.Option>
|
)}
|
</Select>
|
)}
|
</Form.Item>
|
</Col>
|
<Col span={11}>
|
<Form.Item label="凭证标识">
|
{getFieldDecorator('VoucherTypeOne', {
|
initialValue: voucherobj.VoucherTypeOne || (this.state.voucherDetail[0] && this.state.voucherDetail[0].ModularDetailCode) || '',
|
rules: [
|
{
|
required: true,
|
message: '请选择凭证标识!'
|
}
|
]
|
})(
|
<Select
|
showSearch
|
filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
|
onChange={this.contentChange}
|
>
|
{this.state.voucherDetail.map(option =>
|
<Select.Option key={option.ModularDetailCode} value={option.ModularDetailCode}>
|
{option.CodeName}
|
</Select.Option>
|
)}
|
</Select>
|
)}
|
</Form.Item>
|
</Col>
|
<Col span={11}>
|
<Form.Item label="关联字段">
|
{getFieldDecorator('linkField', {
|
initialValue: voucherobj.linkField || (columns[0] && columns[0].field) || '',
|
rules: [
|
{
|
required: true,
|
message: '请选择关联字段!'
|
}
|
]
|
})(
|
<Select
|
showSearch
|
filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
|
onChange={this.contentChange}
|
>
|
{columns.map((option, index) =>
|
<Select.Option key={index + option.uuid} value={option.field}>
|
{`${option.label}（${option.field}）`}
|
</Select.Option>
|
)}
|
</Select>
|
)}
|
</Form.Item>
|
</Col>
|
<Col span={11}>
|
<Form.Item label="是否启用">
|
<Switch checkedChildren="启" unCheckedChildren="停" checked={voucherobj.enabled} onChange={this.onEnabledChange} />
|
{voucherobj.enabled ? <ConsoleSqlOutlined style={{marginLeft: '20px', fontSize: '18px', color: '#1890ff', verticalAlign: 'middle'}} onClick={this.voucherSql}/> : null}
|
</Form.Item>
|
</Col>
|
</Row>
|
</Form>
|
)
|
}
|
}
|
|
export default Form.create()(UniqueForm)
|
