| | |
| | | import { Form, Row, Col, Select, Radio, Input, Tooltip, InputNumber, Checkbox } from 'antd' |
| | | import { QuestionCircleOutlined } from '@ant-design/icons' |
| | | |
| | | import { langs } from '@/store/options.js' |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | | import './index.scss' |
| | | |
| | |
| | | inputSubmit: PropTypes.func // input回车提交 |
| | | } |
| | | |
| | | state = {typename: 'mob', adapters: [], exts: []} |
| | | state = { |
| | | typename: 'mob', |
| | | adapters: [], |
| | | exts: [], |
| | | WXApps: null, |
| | | WXMerchs: null |
| | | } |
| | | |
| | | UNSAFE_componentWillMount() { |
| | | const { card } = this.props |
| | | let adapters = [] |
| | | let exts = [] |
| | | let typename = 'mob' |
| | | let _langs = [] |
| | | Object.keys(langs).forEach(key => { |
| | | _langs.push({value: key, label: langs[key]}) |
| | | }) |
| | | |
| | | if (card) { |
| | | typename = card.typename || 'mob' |
| | | adapters = card.adapter ? card.adapter.split(',') : [] |
| | | |
| | | if (!adapters.includes('fbdH5')) { |
| | | adapters.unshift('H5') |
| | | } |
| | | |
| | | adapters = adapters.filter(n => n !== 'fbdH5') |
| | | |
| | | if (typename !== 'pc') { |
| | | if (card.user_binding === 'true') { |
| | |
| | | exts.push('share') |
| | | } |
| | | } |
| | | } else { |
| | | adapters = ['H5'] |
| | | } |
| | | |
| | | this.setState({typename, adapters, exts}) |
| | | let WXApps = null |
| | | let WXMerchs = null |
| | | if (window.GLOB.WXApps) { |
| | | WXApps = window.GLOB.WXApps.filter(app => app.appType === 'public') |
| | | |
| | | if (WXApps.length === 0) { |
| | | WXApps = null |
| | | } |
| | | WXMerchs = window.GLOB.WXApps.filter(app => app.appType === 'merchant') |
| | | |
| | | if (WXMerchs.length === 0) { |
| | | WXMerchs = null |
| | | } |
| | | } |
| | | |
| | | this.setState({typename, adapters, exts, langs: _langs, WXApps, WXMerchs}) |
| | | } |
| | | |
| | | /** |
| | |
| | | return new Promise(resolve => { |
| | | this.props.form.validateFieldsAndScroll((err, values) => { |
| | | if (!err) { |
| | | if (values.adapter) { |
| | | if (!values.adapter.includes('H5')) { |
| | | values.adapter.unshift('fbdH5') |
| | | } |
| | | } |
| | | |
| | | values.adapter = values.adapter ? values.adapter.join(',') : '' |
| | | |
| | | if (values.exts) { |
| | | values.user_binding = values.exts.includes('user_binding') ? 'true' : 'false' |
| | | values.share = values.exts.includes('share') ? 'true' : 'false' |
| | | delete values.exts |
| | | } |
| | | if (values.wxAppId) { |
| | | let app = window.GLOB.WXApps.filter(app => app.appType === 'public' && values.wxAppId === app.appId)[0] |
| | | values.wxAppName = app ? app.appName : values.wxAppId |
| | | } |
| | | if (values.wxMerchId) { |
| | | let app = window.GLOB.WXApps.filter(app => app.appType === 'merchant' && values.wxMerchId === app.appId)[0] |
| | | values.wxMerchName = app ? app.appName : values.wxMerchId |
| | | } |
| | | |
| | | resolve(values) |
| | |
| | | render() { |
| | | const { card, type } = this.props |
| | | const { getFieldDecorator } = this.props.form |
| | | const { typename, adapters, exts } = this.state |
| | | const { typename, adapters, exts, langs, WXApps, WXMerchs } = this.state |
| | | const formItemLayout = { |
| | | labelCol: { |
| | | xs: { span: 24 }, |
| | |
| | | {getFieldDecorator('lang', { |
| | | initialValue: card ? card.lang || 'zh-CN' : 'zh-CN' |
| | | })( |
| | | <Radio.Group disabled={type === 'edit'}> |
| | | <Radio value="zh-CN">中文</Radio> |
| | | <Radio value="en-US">英文</Radio> |
| | | </Radio.Group> |
| | | <Select disabled={type === 'edit'}> |
| | | {langs.map(item => <Select.Option key={item.value} value={item.value}>{item.label}</Select.Option>)} |
| | | </Select> |
| | | )} |
| | | </Form.Item> |
| | | </Col> |
| | |
| | | initialValue: adapters |
| | | })( |
| | | <Checkbox.Group onChange={this.onAdapterChange}> |
| | | <Checkbox value="H5">H5</Checkbox> |
| | | <Checkbox value="app">app</Checkbox> |
| | | <Checkbox value="weixin">公众号</Checkbox> |
| | | <Checkbox value="wxmini">小程序</Checkbox> |
| | |
| | | )} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | {WXApps ? <Col span={12}> |
| | | <Form.Item label={ |
| | | <Tooltip placement="topLeft" title="用户可通过此公众号进行支付、退款、授权登录。"> |
| | | <QuestionCircleOutlined className="mk-form-tip" /> |
| | | 关联应用 |
| | | </Tooltip> |
| | | }> |
| | | {getFieldDecorator('wxAppId', { |
| | | initialValue: card ? card.wxAppId : '' |
| | | })( |
| | | <Select allowClear> |
| | | {WXApps.map(item => <Select.Option key={item.appId} value={item.appId}>{item.appName}</Select.Option>)} |
| | | </Select> |
| | | )} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | {WXMerchs ? <Col span={12}> |
| | | <Form.Item label={ |
| | | <Tooltip placement="topLeft" title="用户可通过此商户号进行支付及退款。"> |
| | | <QuestionCircleOutlined className="mk-form-tip" /> |
| | | 关联商户 |
| | | </Tooltip> |
| | | }> |
| | | {getFieldDecorator('wxMerchId', { |
| | | initialValue: card ? card.wxMerchId : '' |
| | | })( |
| | | <Select allowClear> |
| | | {WXMerchs.map(item => <Select.Option key={item.appId} value={item.appId}>{item.appName}</Select.Option>)} |
| | | </Select> |
| | | )} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | {typename !== 'pc' && (adapters.includes('weixin') || adapters.includes('wxmini')) ? <Col span={12}> |
| | | <Form.Item label={ |
| | | <Tooltip placement="topLeft" title="在公众号或小程序中,可添加绑定系统用户、自定义分享等功能,自定义分享设置后,当前子应用将默认使用此分享链接。"> |