import React, {Component} from 'react'
|
import PropTypes from 'prop-types'
|
// import { is, fromJS } from 'immutable'
|
import { Form, Row, Col, Select, Radio, Tooltip } from 'antd'
|
import { QuestionCircleOutlined } from '@ant-design/icons'
|
|
// import './index.scss'
|
|
class BillCodeForm extends Component {
|
static propTpyes = {
|
card: PropTypes.object,
|
verify: PropTypes.object,
|
unionFields: PropTypes.array,
|
notes: PropTypes.array,
|
onChange: PropTypes.func
|
}
|
|
state = {
|
wxTemps: [],
|
miniTemps: [],
|
}
|
|
UNSAFE_componentWillMount() {
|
|
}
|
|
componentDidMount() {
|
let wxTemps = sessionStorage.getItem('wxTemplates')
|
let miniTemps = sessionStorage.getItem('wxMiniTemplates')
|
|
wxTemps = wxTemps ? JSON.parse(wxTemps) : []
|
miniTemps = miniTemps ? JSON.parse(miniTemps) : []
|
|
this.setState({wxTemps, miniTemps})
|
}
|
|
handleConfirm = () => {
|
const { verify } = this.props
|
|
let error = ''
|
if (verify.noteEnable === 'true' && !verify.noteCode) { // 开启短信时，需要模板编码
|
error = '开启短信时，需要选择短信模板！'
|
} else if (verify.accountdate === 'true' && !verify.accountfield) {
|
error = '开启账期时，需要选择验证公司！'
|
} else if (verify.wxNote === 'true') {
|
if (!verify.wxTemplateId) {
|
error = '开启公众号消息推送时，需要选择消息模板！'
|
}
|
}
|
|
return error
|
}
|
|
onOptionChange = (value, key) => {
|
const { verify } = this.props
|
|
let _verify = {...verify, [key]: value}
|
|
if (_verify.noteEnable !== 'true') {
|
_verify.noteCode = ''
|
}
|
if (_verify.accountdate !== 'true') {
|
_verify.accountfield = ''
|
_verify.voucherdate = ''
|
}
|
if (_verify.wxNote !== 'true') {
|
_verify.wxTemplateId = ''
|
}
|
|
this.props.onChange(_verify)
|
}
|
|
onNoteCodeChange = (val, option) => {
|
const { verify } = this.props
|
|
let _verify = {...verify, noteCode: val, noteId: option.props.id}
|
|
this.props.onChange(_verify)
|
}
|
|
onWxTemplateChange = (val) => {
|
const { verify } = this.props
|
|
let _verify = {...verify, wxTemplateId: val}
|
|
this.props.onChange(_verify)
|
}
|
|
render() {
|
const { unionFields, verify, notes, card } = this.props
|
// const { getFieldDecorator } = this.props.form
|
const { wxTemps } = this.state
|
const formItemLayout = {
|
labelCol: {
|
xs: { span: 24 },
|
sm: { span: 8 }
|
},
|
wrapperCol: {
|
xs: { span: 24 },
|
sm: { span: 16 }
|
}
|
}
|
|
return (
|
<Form {...formItemLayout}>
|
<Row gutter={24}>
|
{card.sqlType !== 'custom' ? <Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="bottomLeft" title={'默认sql执行顺序为自定义脚本之前'}>
|
<QuestionCircleOutlined className="mk-form-tip" />
|
默认sql
|
</Tooltip>
|
}>
|
<Radio.Group value={verify.default} onChange={(e) => {this.onOptionChange(e.target.value, 'default')}}>
|
<Radio value="true">执行</Radio>
|
<Radio value="false">不执行</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col> : null}
|
<Col span={8}>
|
<Form.Item label={'失效验证'}>
|
<Radio.Group value={verify.invalid} onChange={(e) => {this.onOptionChange(e.target.value, 'invalid')}}>
|
<Radio value="true">开启</Radio>
|
<Radio value="false">不开启</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col>
|
<Col span={8}>
|
<Form.Item label={'账期验证'}>
|
<Radio.Group value={verify.accountdate} onChange={(e) => {this.onOptionChange(e.target.value, 'accountdate')}}>
|
<Radio value="true">开启</Radio>
|
<Radio value="false">不开启</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col>
|
{verify.accountdate === 'true' ? <Col span={8}>
|
<Form.Item label={'验证公司'} required>
|
<Select defaultValue={verify.accountfield || ''} onChange={(val) => {this.onOptionChange(val, 'accountfield')}}>
|
{unionFields.map(option =>
|
<Select.Option key={option.uuid} value={option.field}>
|
{option.label}
|
</Select.Option>
|
)}
|
</Select>
|
</Form.Item>
|
</Col> : null}
|
{verify.accountdate === 'true' ? <Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="bottomLeft" title={'验证日期为空时，默认为当天。'}>
|
<QuestionCircleOutlined className="mk-form-tip" />
|
验证日期
|
</Tooltip>
|
}>
|
<Select allowClear defaultValue={verify.voucherdate || ''} onChange={(val) => {this.onOptionChange(val, 'voucherdate')}}>
|
{unionFields.map(option =>
|
<Select.Option key={option.uuid} value={option.field}>
|
{option.label}
|
</Select.Option>
|
)}
|
</Select>
|
</Form.Item>
|
</Col> : null}
|
<Col span={24}></Col>
|
<Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="bottomLeft" title={'选择发送短信时，需完善短信设置。'}>
|
<QuestionCircleOutlined className="mk-form-tip" />
|
发送短信
|
</Tooltip>
|
}>
|
<Radio.Group value={verify.noteEnable} onChange={(e) => {this.onOptionChange(e.target.value, 'noteEnable')}}>
|
<Radio value="true">开启</Radio>
|
<Radio value="false">不开启</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col>
|
{verify.noteEnable === 'true' ? <Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="bottomLeft" title={<span>短信模板添加地址：<a target="_blank" rel="noopener noreferrer" href="https://cloud.mk9h.cn/admin/index.html">云中心</a>->应用服务->开发者中心->短信模板。</span>}>
|
<QuestionCircleOutlined className="mk-form-tip" />
|
短信模板
|
</Tooltip>
|
} required>
|
<Select value={verify.noteCode} onSelect={this.onNoteCodeChange}>
|
{notes.map(option =>
|
<Select.Option key={option.value} id={option.id} value={option.value}>
|
{option.name}
|
</Select.Option>
|
)}
|
</Select>
|
</Form.Item>
|
</Col> : null}
|
{verify.noteEnable === 'true' ? <Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="bottomLeft" title={'实时发送最多同时发送5个用户，定时发送最多同时发送100个用户。'}>
|
<QuestionCircleOutlined className="mk-form-tip" />
|
发送方式
|
</Tooltip>
|
}>
|
<Radio.Group value={verify.noteType} onChange={(e) => {this.onOptionChange(e.target.value, 'noteType')}}>
|
<Radio value="Y">实时</Radio>
|
<Radio value="N">定时</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col> : null}
|
{verify.noteEnable === 'true' ? <Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="bottomLeft" title={'当向多个用户发送短信时，短信内容是否相同。'}>
|
<QuestionCircleOutlined className="mk-form-tip" />
|
短信内容
|
</Tooltip>
|
}>
|
<Radio.Group value={verify.noteTemp} onChange={(e) => {this.onOptionChange(e.target.value, 'noteTemp')}}>
|
<Radio value="Y">相同</Radio>
|
<Radio value="N">不同</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col> : null}
|
<Col span={24}></Col>
|
<Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="bottomLeft" title={'请在服务器完成公众号配置。'}>
|
<QuestionCircleOutlined className="mk-form-tip" />
|
公众号消息
|
</Tooltip>
|
}>
|
<Radio.Group value={verify.wxNote} onChange={(e) => {this.onOptionChange(e.target.value, 'wxNote')}}>
|
<Radio value="true">开启</Radio>
|
<Radio value="false">不开启</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col>
|
{verify.wxNote === 'true' ? <Col span={8}>
|
<Form.Item label="消息模板" required>
|
<Select value={verify.wxTemplateId} onSelect={this.onWxTemplateChange}>
|
{wxTemps.map(option =>
|
<Select.Option key={option.template_id} value={option.template_id}>
|
{option.title}
|
</Select.Option>
|
)}
|
</Select>
|
</Form.Item>
|
</Col> : null}
|
</Row>
|
</Form>
|
)
|
}
|
}
|
|
export default Form.create()(BillCodeForm)
|
