import React, {Component} from 'react'
|
import PropTypes from 'prop-types'
|
import { fromJS } from 'immutable'
|
import { Form, Row, Col, Select, Radio, Tooltip, Input } from 'antd'
|
import { QuestionCircleOutlined } from '@ant-design/icons'
|
|
import Api from '@/api'
|
import MkPrintTemps from '@/menu/components/share/actioncomponent/actionform/mkPrintTemps'
|
import CodeMirror from '@/templates/zshare/codemirror'
|
import './index.scss'
|
|
const sysTempsIds = ['8IFltwzyKcu15iA8fqSyb6m-pMa88a3ZTu0No3vDHgo', 'LOB-bbt9jVncGh7IOAUdESh1Sgzcbt62UwOqSqcK9ok']
|
|
class BillCodeForm extends Component {
|
static propTpyes = {
|
card: PropTypes.object,
|
verify: PropTypes.object,
|
unionFields: PropTypes.array,
|
notes: PropTypes.array,
|
emailCodes: PropTypes.array,
|
appType: PropTypes.any,
|
onChange: PropTypes.func
|
}
|
|
state = {
|
wxTemps: [],
|
selectTemp: null,
|
miniTemps: []
|
}
|
|
componentDidMount() {
|
let wxTemps = sessionStorage.getItem('wxTemplates')
|
|
if (window.GLOB.WXAppID && window.GLOB.nginx && !wxTemps) {
|
Api.wxAccessToken().then(res => {
|
let wxtoken = res.oa_access_token || ''
|
// let minitoken = res.mini_access_token || ''
|
|
if (wxtoken) {
|
Api.wxNginxRequest(`cgi-bin/template/get_all_private_template?access_token=${wxtoken}`, 'get').then(res => {
|
let temps = []
|
if (res.template_list) {
|
temps = res.template_list.filter(item => {
|
if (!item.primary_industry || sysTempsIds.includes(item.template_id)) return false
|
if (item.content) {
|
item.content = item.content.replace('{{first.DATA}}\n', '').replace('\n{{remark.DATA}}', '')
|
}
|
|
return true
|
})
|
}
|
|
sessionStorage.setItem('wxTemplates', JSON.stringify(temps))
|
localStorage.setItem('wxTemplates', JSON.stringify(temps))
|
|
localStorage.removeItem('wxTemplates')
|
|
this.resetTemps(temps)
|
})
|
} else {
|
sessionStorage.setItem('wxTemplates', JSON.stringify([]))
|
localStorage.setItem('wxTemplates', JSON.stringify([]))
|
|
localStorage.removeItem('wxTemplates')
|
}
|
// if (minitoken) {
|
// Api.wxNginxRequest(`wxaapi/newtmpl/gettemplate?access_token=${minitoken}`, 'get').then(res => {
|
// if (res.errmsg === 'ok' && res.data) {
|
// sessionStorage.setItem('wxMiniTemplates', JSON.stringify(res.data))
|
// } else {
|
// sessionStorage.setItem('wxMiniTemplates', JSON.stringify([]))
|
// }
|
// })
|
// } else {
|
// sessionStorage.setItem('wxMiniTemplates', JSON.stringify([]))
|
// }
|
})
|
} else if (wxTemps) {
|
wxTemps = JSON.parse(wxTemps)
|
|
this.resetTemps(wxTemps)
|
}
|
}
|
|
resetTemps = (wxTemps) => {
|
const { verify } = this.props
|
|
let sysTemps = [
|
{
|
template_id: '8IFltwzyKcu15iA8fqSyb6m-pMa88a3ZTu0No3vDHgo',
|
title: '订单受理通知（明科云）',
|
primary_industry: 'IT科技',
|
deputy_industry: 'IT软件与服务',
|
content: '订单号：{{keyword1.DATA}}\n订单类型：{{keyword2.DATA}}\n订单状态：{{keyword3.DATA}}\n通知时间：{{keyword4.DATA}}',
|
example: '订单号：20190101001\r\n订单类型：衣柜\r\n订单状态：设计完成\r\n通知时间：2019年1月1日12:30'
|
},
|
{
|
template_id: 'LOB-bbt9jVncGh7IOAUdESh1Sgzcbt62UwOqSqcK9ok',
|
title: '订单进度提醒（明科云）',
|
primary_industry: 'IT科技',
|
deputy_industry: 'IT软件与服务',
|
content: '订单类型：{{keyword1.DATA}}\n订单号：{{keyword2.DATA}}\n订单状态：{{keyword3.DATA}}',
|
example: '订单类型：退租申请\r\n订单号：TZ16101909\r\n订单状态：待取货'
|
},
|
{
|
template_id: 'mk_category_temp',
|
title: '类目模板',
|
primary_industry: '',
|
deputy_industry: '',
|
content: '',
|
example: ''
|
}
|
]
|
|
let _wxTemps = [...wxTemps, ...sysTemps]
|
|
let selectTemp = _wxTemps.filter(item => item.template_id === verify.wxTemplateId)[0]
|
|
if (selectTemp) {
|
selectTemp.content = selectTemp.content.replace(/\r\n|\n/g, '<br/>')
|
selectTemp.example = selectTemp.example.replace(/\r\n|\n/g, '<br/>')
|
}
|
|
this.setState({wxTemps: _wxTemps, selectTemp})
|
}
|
|
handleConfirm = () => {
|
const { verify } = this.props
|
|
let error = ''
|
if (verify.noteEnable === 'true' && !verify.noteCode) { // 开启短信时，需要模板编码
|
error = '开启短信时，需要选择短信模板！'
|
} else if (verify.emailEnable === 'true' && !verify.emailCode) {
|
error = '开启邮件发送时，需要选择邮件模板！'
|
} else if (verify.printEnable === 'true' && !verify.printTempId) {
|
error = '使用单据打印时，需要选择打印模板！'
|
} else if (verify.accountdate === 'true' && !verify.accountfield) {
|
error = '开启账期时，需要选择验证公司！'
|
} else if (verify.preHandle === 'true' && !verify.pre_func) {
|
error = '开启自定义脚本时，需要填写处理函数！'
|
} else if (verify.wxNote === 'true') {
|
if (!verify.wxTemplateId) {
|
error = '开启公众号消息推送时，需要选择消息模板！'
|
} else if (verify.wxTemplateId === 'mk_category_temp' && !verify.wxCustomTempId) {
|
error = '开启公众号消息推送时，需要填写消息模板ID！'
|
} else if (verify.wxNoteLink === 'url' && !verify.wxNoteLinkUrl) {
|
error = '请填写网址！'
|
}
|
}
|
|
return error
|
}
|
|
onOptionChange = (value, key) => {
|
const { verify } = this.props
|
|
let _verify = {...verify, [key]: value}
|
|
if (_verify.noteEnable !== 'true') {
|
_verify.noteCode = ''
|
_verify.noteId = ''
|
}
|
if (_verify.emailEnable !== 'true') {
|
_verify.emailCode = ''
|
_verify.emailId = ''
|
}
|
if (_verify.printEnable !== 'true') {
|
_verify.printTempId = ''
|
}
|
if (_verify.accountdate !== 'true') {
|
_verify.accountfield = ''
|
_verify.voucherdate = ''
|
}
|
if (_verify.preHandle !== 'true') {
|
_verify.pre_func = ''
|
}
|
if (_verify.wxNote !== 'true') {
|
_verify.wxTemplateId = ''
|
_verify.wxNoteLink = ''
|
_verify.wxNoteLinkUrl = ''
|
_verify.wxNoteLinkMenuId = ''
|
_verify.wxNoteCallback = 'false'
|
_verify.wxNoteKeys = null
|
|
delete _verify.wxCustomTempId
|
|
if (this.state.selectTemp) {
|
this.setState({selectTemp: null})
|
}
|
}
|
|
this.props.onChange(_verify)
|
}
|
|
onNoteCodeChange = (val, option) => {
|
const { verify } = this.props
|
|
let _verify = {...verify, noteCode: val, noteId: option.props.id}
|
|
this.props.onChange(_verify)
|
}
|
|
onEmailCodeChange = (val, option) => {
|
const { verify } = this.props
|
|
let _verify = {...verify, emailCode: val, emailId: option.props.id}
|
|
this.props.onChange(_verify)
|
}
|
|
onPrintIdChange = (val) => {
|
const { verify } = this.props
|
|
let _verify = {...verify, printTempId: val}
|
|
this.props.onChange(_verify)
|
}
|
|
onWxTemplateChange = (val, option) => {
|
const { verify } = this.props
|
|
let _verify = {...verify, wxTemplateId: val}
|
let selectTemp = {template_id: val, content: option.props.content.replace(/\r\n|\n/g, '<br/>'), example: option.props.example.replace(/\r\n|\n/g, '<br/>')}
|
|
let keys = []
|
if (option.props.content) {
|
keys = option.props.content.match(/{{[a-zA-Z0-9]+\.DATA}}/g)
|
keys = keys.map(key => key.replace(/{{|\.DATA}}/g, ''))
|
}
|
|
delete _verify.wxCustomTempId
|
|
if (selectTemp.template_id === 'mk_category_temp') {
|
_verify.wxNoteKeys = []
|
for (let i = 1; i <= 10; i++) {
|
_verify.wxNoteKeys.push({
|
key: '',
|
value: 'p' + i
|
})
|
}
|
} else {
|
let index = 1
|
_verify.wxNoteKeys = keys.map(key => {
|
let item = { key: key }
|
|
item.value = 'p' + index
|
index++
|
|
return item
|
})
|
}
|
|
this.setState({selectTemp})
|
|
this.props.onChange(_verify)
|
}
|
|
onWxNoteKeyChange = (key, val) => {
|
let _verify = fromJS(this.props.verify).toJS()
|
|
_verify.wxNoteKeys = _verify.wxNoteKeys.map(m => {
|
if (m.key === key) {
|
m.value = val
|
}
|
|
return m
|
})
|
|
this.props.onChange(_verify)
|
}
|
|
onWxNoteValueChange = (value, val) => {
|
let _verify = fromJS(this.props.verify).toJS()
|
|
_verify.wxNoteKeys = _verify.wxNoteKeys.map(m => {
|
if (m.value === value) {
|
m.key = val.replace(/\s+/ig, '')
|
}
|
|
return m
|
})
|
|
this.props.onChange(_verify)
|
}
|
|
onWxNoteTempIdChange = (value) => {
|
let _verify = fromJS(this.props.verify).toJS()
|
|
_verify.wxCustomTempId = value.replace(/\s+/ig, '')
|
|
this.props.onChange(_verify)
|
}
|
|
render() {
|
const { unionFields, verify, notes, emailCodes, card, appType, columns, fields } = this.props
|
const { wxTemps, selectTemp } = this.state
|
const formItemLayout = {
|
labelCol: {
|
xs: { span: 24 },
|
sm: { span: 8 }
|
},
|
wrapperCol: {
|
xs: { span: 24 },
|
sm: { span: 16 }
|
}
|
}
|
|
let _columns = []
|
if (window.GLOB.process && card.intertype !== 'inner') {
|
let cols = []
|
fields.forEach(col => {
|
if (!col.field) return
|
|
cols.push(col.field.toLowerCase())
|
_columns.push(col)
|
})
|
|
columns.forEach(col => {
|
if (!col.field) return
|
|
let key = col.field.toLowerCase()
|
|
if (key === 'id' || cols.includes(key)) return
|
if (col.type === 'text' && col.fieldlength > 100) return
|
|
_columns.push(col)
|
})
|
}
|
|
return (
|
<Form {...formItemLayout}>
|
<Row gutter={24}>
|
{card.sqlType !== 'custom' && card.intertype !== 'inner' ? <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}
|
{card.intertype !== 'inner' ? <Col span={8}>
|
<Form.Item label={
|
verify.limitText ? <Tooltip placement="bottomLeft" title={verify.limitText}>
|
<QuestionCircleOutlined className="mk-form-tip" />
|
失效验证
|
</Tooltip> : '失效验证'
|
}>
|
<Radio.Group value={verify.invalid} disabled={verify.limitInvalid} onChange={(e) => {this.onOptionChange(e.target.value, 'invalid')}}>
|
<Radio value="true">开启</Radio>
|
<Radio value="false">不开启</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col> : null}
|
{card.intertype !== 'inner' ? <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> : null}
|
{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 || 'N'} 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 || 'Y'} 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.emailEnable} onChange={(e) => {this.onOptionChange(e.target.value, 'emailEnable')}}>
|
<Radio value="true">开启</Radio>
|
<Radio value="false">不开启</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col>
|
{verify.emailEnable === '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.emailCode || ''} onSelect={this.onEmailCodeChange}>
|
{emailCodes.map(option =>
|
<Select.Option key={option.value} id={option.id} value={option.value}>
|
{option.name}
|
</Select.Option>
|
)}
|
</Select>
|
</Form.Item>
|
</Col> : null}
|
{verify.emailEnable === 'true' ? <Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="bottomLeft" title={'实时发送最多同时发送5个用户，定时发送最多同时发送100个用户。'}>
|
<QuestionCircleOutlined className="mk-form-tip" />
|
发送方式
|
</Tooltip>
|
}>
|
<Radio.Group value={verify.emailType || 'N'} onChange={(e) => {this.onOptionChange(e.target.value, 'emailType')}}>
|
<Radio value="Y">实时</Radio>
|
<Radio value="N">定时</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col> : null}
|
{verify.emailEnable === 'true' ? <Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="bottomLeft" title={'当向多个用户发送短信时，短信内容是否相同。'}>
|
<QuestionCircleOutlined className="mk-form-tip" />
|
邮件内容
|
</Tooltip>
|
}>
|
<Radio.Group value={verify.emailTemp || 'Y'} onChange={(e) => {this.onOptionChange(e.target.value, 'emailTemp')}}>
|
<Radio value="Y">相同</Radio>
|
<Radio value="N">不同</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col> : null}
|
<Col span={24}></Col>
|
{appType !== 'mob' ? <Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="bottomLeft" title="使用单据打印时需选择打印模板，跳转打印界面时ID优先从返回值中获取，返回值没有时从行里获取。">
|
<QuestionCircleOutlined className="mk-form-tip" />
|
单据打印
|
</Tooltip>
|
}>
|
<Radio.Group value={verify.printEnable} onChange={(e) => {this.onOptionChange(e.target.value, 'printEnable')}}>
|
<Radio value="true">开启</Radio>
|
<Radio value="false">不开启</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col> : null}
|
{verify.printEnable === 'true' ? <Col span={8}>
|
<Form.Item label="打印模板" required help={(() => {
|
if (verify.printTempId) {
|
return <span onClick={() => {
|
sessionStorage.setItem('mk-print-temp', verify.printTempId)
|
window.open('#/hs')
|
|
setTimeout(() => {
|
sessionStorage.removeItem('mk-print-temp')
|
}, 50)
|
}} style={{color: '#1890ff', cursor: 'pointer', fontSize: '13px'}}>#查看模板</span>
|
}
|
return null
|
})()}>
|
<MkPrintTemps value={verify.printTempId} onChange={this.onPrintIdChange}/>
|
</Form.Item>
|
</Col> : null}
|
<Col span={24}></Col>
|
{window.GLOB.process && card.intertype !== 'inner' ? <Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="bottomLeft" title="在菜单开启工作流时有效。">
|
<QuestionCircleOutlined className="mk-form-tip" />
|
工作流
|
</Tooltip>
|
}>
|
<Radio.Group value={verify.workFlow} onChange={(e) => {this.onOptionChange(e.target.value, 'workFlow')}}>
|
<Radio value="true">开启</Radio>
|
<Radio value="false">不开启</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col> : null}
|
{window.GLOB.process && card.intertype !== 'inner' && verify.workFlow === 'true' ? <Col span={8}>
|
<Form.Item label="类型">
|
<Radio.Group value={verify.flowType} onChange={(e) => {this.onOptionChange(e.target.value, 'flowType')}}>
|
<Radio value="start">发起</Radio>
|
<Radio value="approval">审批</Radio>
|
<Radio value="reject">驳回</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col> : null}
|
{window.GLOB.process && card.intertype !== 'inner' && verify.workFlow === 'true' ? <Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="bottomLeft" title="执行位置在系统默认sql之后。">
|
<QuestionCircleOutlined className="mk-form-tip" />
|
默认sql（工作流）
|
</Tooltip>
|
}>
|
<Radio.Group value={verify.flowSql} onChange={(e) => {this.onOptionChange(e.target.value, 'flowSql')}}>
|
<Radio value="true">执行</Radio>
|
<Radio value="false">不执行</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col> : null}
|
{window.GLOB.process && card.intertype !== 'inner' && verify.workFlow === 'true' && verify.flowType === 'approval' ? <Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="bottomLeft" title="如果审批存在多条分支，可添加审批流程的控制字段，通过表单信息或行信息控制流程走向。注：需在流程图中完善分支的执行条件。">
|
<QuestionCircleOutlined className="mk-form-tip" />
|
流程控制
|
</Tooltip>
|
}>
|
<Select allowClear value={verify.flowBranch} onChange={(val) => {this.onOptionChange(val || '', 'flowBranch')}}>
|
{_columns.map(option =>
|
<Select.Option key={option.field} 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.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} content={option.content} example={option.example} value={option.template_id}>
|
{option.title}
|
</Select.Option>
|
)}
|
</Select>
|
</Form.Item>
|
</Col> : null}
|
{verify.wxNote === 'true' ? <Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="bottomLeft" title={'是否将消息执行结果回传系统。'}>
|
<QuestionCircleOutlined className="mk-form-tip" />
|
消息回调
|
</Tooltip>
|
}>
|
<Radio.Group value={verify.wxNoteCallback || 'false'} onChange={(e) => {this.onOptionChange(e.target.value, 'wxNoteCallback')}}>
|
<Radio value="true">开启</Radio>
|
<Radio value="false">不开启</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col> : null}
|
{verify.wxNote === 'true' ? <Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="bottomLeft" title={'点击消息时的跳转地址。'}>
|
<QuestionCircleOutlined className="mk-form-tip" />
|
跳转链接
|
</Tooltip>
|
}>
|
<Radio.Group value={verify.wxNoteLink || ''} onChange={(e) => {this.onOptionChange(e.target.value, 'wxNoteLink')}}>
|
<Radio value="">无</Radio>
|
<Radio value="url">网址</Radio>
|
<Radio value="miniProgram">小程序</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col> : null}
|
{verify.wxNoteLink === 'url' ? <Col span={8}>
|
<Form.Item label="网址" required>
|
<Input placeholder="" autoComplete="off" value={verify.wxNoteLinkUrl || ''} onChange={(e) => {this.onOptionChange(e.target.value, 'wxNoteLinkUrl')}}/>
|
</Form.Item>
|
</Col> : null}
|
{verify.wxNoteLink === 'miniProgram' ? <Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="top" title="添加菜单ID可跳转至小程序指定页面，空值默认跳转至小程序首页。注：数据里中如果有bid字段（值不为空），打开小程序时会做为BID传入页面中。">
|
<QuestionCircleOutlined className="mk-form-tip" />
|
菜单ID
|
</Tooltip>
|
}>
|
<Input placeholder="" autoComplete="off" value={verify.wxNoteLinkMenuId || ''} onChange={(e) => {this.onOptionChange(e.target.value, 'wxNoteLinkMenuId')}}/>
|
</Form.Item>
|
</Col> : null}
|
{verify.wxNote === 'true' && verify.wxNoteKeys && (!selectTemp || selectTemp.template_id !== 'mk_category_temp') ? verify.wxNoteKeys.map((item, index) => <Col span={8} key={'mk' + index}>
|
<Form.Item label={item.key} required>
|
<Select value={item.value} onSelect={(val) => this.onWxNoteKeyChange(item.key, val)}>
|
<Select.Option value="p1">p1</Select.Option>
|
<Select.Option value="p2">p2</Select.Option>
|
<Select.Option value="p3">p3</Select.Option>
|
<Select.Option value="p4">p4</Select.Option>
|
<Select.Option value="p5">p5</Select.Option>
|
<Select.Option value="p6">p6</Select.Option>
|
<Select.Option value="p7">p7</Select.Option>
|
<Select.Option value="p8">p8</Select.Option>
|
<Select.Option value="p9">p9</Select.Option>
|
<Select.Option value="p10">p10</Select.Option>
|
</Select>
|
</Form.Item>
|
</Col>) : null}
|
{verify.wxNote === 'true' && verify.wxNoteKeys && (selectTemp && selectTemp.template_id === 'mk_category_temp') ? <Col span={8}>
|
<Form.Item label="模板ID" required>
|
<Input placeholder="" defaultValue={verify.wxCustomTempId} autoComplete="off" onChange={(e) => {this.onWxNoteTempIdChange(e.target.value)}}/>
|
</Form.Item>
|
</Col> : null}
|
{verify.wxNote === 'true' && verify.wxNoteKeys && (selectTemp && selectTemp.template_id === 'mk_category_temp') ? verify.wxNoteKeys.map((item, index) => <Col span={8} key={'mk' + index}>
|
<Form.Item label={item.value}>
|
<Input placeholder="" defaultValue={item.key} autoComplete="off" onChange={(e) => {this.onWxNoteValueChange(item.value, e.target.value)}}/>
|
</Form.Item>
|
</Col>) : null}
|
{selectTemp && selectTemp.template_id !== 'mk_category_temp' && verify.wxNoteKeys ? <Col span={24} className="wx-note">
|
<div className="note-wrap">
|
<div className="note">
|
<p>内容示例</p>
|
<div dangerouslySetInnerHTML={{ __html: selectTemp.example }}></div>
|
</div>
|
</div>
|
<div className="note-wrap">
|
<div className="note">
|
<p>模板信息</p>
|
<div dangerouslySetInnerHTML={{ __html: selectTemp.content }}></div>
|
</div>
|
</div>
|
<div className="note-wrap">
|
<div className="note">
|
<p>消息体</p>
|
<div>
|
<p>openid: "接收者openid",</p>
|
<p>send_id: "防重入id",</p>
|
{verify.wxNoteKeys.map((item, i) => <p key={'index' + i}>{item.value}: "=> {item.key}",</p>)}
|
<p>bid: "跳转小程序时，可作为BID。"</p>
|
</div>
|
</div>
|
</div>
|
</Col> : null}
|
{selectTemp && selectTemp.template_id === 'mk_category_temp' && verify.wxNoteKeys ? <Col span={24} className="wx-note">
|
<div className="note-wrap">
|
<div className="note">
|
<p>消息体</p>
|
<div>
|
<p>openid: "接收者openid",</p>
|
<p>send_id: "防重入id",</p>
|
<p>bid: "跳转小程序时，可作为BID。"</p>
|
<p style={{color: '#1890ff'}}>请在通用字段中（p1~p10）填入模板中对应的字段名，如 time1.DATA 则填写 time1。</p>
|
</div>
|
</div>
|
</div>
|
</Col> : null}
|
<Col span={24}></Col>
|
<Col span={8}>
|
<Form.Item label={
|
<Tooltip placement="topRight" title="运行时修改按钮参数，入参为（btn, position, systemType）,标记#position-(init,inner,outer,callback)">
|
<QuestionCircleOutlined className="mk-form-tip" />
|
自定义脚本
|
</Tooltip>
|
}>
|
<Radio.Group value={verify.preHandle || 'false'} onChange={(e) => {this.onOptionChange(e.target.value, 'preHandle')}}>
|
<Radio value="true">开启</Radio>
|
<Radio value="false">不开启</Radio>
|
</Radio.Group>
|
</Form.Item>
|
</Col>
|
{verify.preHandle === 'true' ? <Col span={24} style={{paddingLeft: '50px'}}>
|
<CodeMirror mode="text/javascript" theme="cobalt" value={verify.pre_func || ''} onChange={(val) => {this.onOptionChange(val, 'pre_func')}} />
|
</Col> : null}
|
</Row>
|
</Form>
|
)
|
}
|
}
|
|
export default Form.create()(BillCodeForm)
|
