2023-08-14

king

2023-08-14 cc20b3cfe18b36c7b0f75937f88679eb031ecc6f

 src/templates/zshare/verifycard/baseform/index.jsx

@@ -7,12 +7,15 @@
import Api from '@/api'
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,
    appType: PropTypes.any,
    onChange: PropTypes.func
  }

@@ -20,6 +23,7 @@
    wxTemps: [],
    selectTemp: null,
    miniTemps: [],
    printTemps: []
  }

  componentDidMount() {
@@ -35,7 +39,7 @@
            let temps = []
            if (res.template_list) {
              temps = res.template_list.filter(item => {
                if (!item.primary_industry) return false
                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}}', '')
                }
@@ -74,15 +78,43 @@

      this.resetTemps(wxTemps)
    }

    let printTemps = sessionStorage.getItem('printTemps')
    printTemps = printTemps ? JSON.parse(printTemps) : []

    this.setState({printTemps})
  }

  resetTemps = (wxTemps) => {
    const { verify } = this.props

    let sysTemps = [{"template_id":"UdGBwbjFKnIBzW2TalsdJkwZ9R2LvaAozWZ-yo2Dn00","title":"缴费通知","primary_industry":"IT科技","deputy_industry":"IT软件与服务","content":"{{first.DATA}}\n受理编号：{{keyword1.DATA}}\n缴费时间：{{keyword2.DATA}}\n缴费类别：{{keyword3.DATA}}\n缴费金额：{{keyword4.DATA}}\n缴费结果：{{keyword5.DATA}}\n{{remark.DATA}}","example":"您的缴费信息如下\r\n受理编号：010000000001\r\n缴费时间：2018年07月23日\r\n缴费类别：供暖缴费\r\n缴费金额：20元\r\n缴费结果：成功\r\n感谢您的使用！"}]
    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: ''
      }
    ]
    
    sysTemps = []

    let _wxTemps = [...wxTemps, ...sysTemps]

    let selectTemp = _wxTemps.filter(item => item.template_id === verify.wxTemplateId)[0]
@@ -101,15 +133,18 @@
    let error = ''
    if (verify.noteEnable === 'true' && !verify.noteCode) { // 开启短信时，需要模板编码
      error = '开启短信时，需要选择短信模板！'
    } else if (verify.printEnable === 'true' && !verify.printTempId) {
      error = '使用单据打印时，需要选择打印模板！'
    } else if (verify.accountdate === 'true' && !verify.accountfield) {
      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
@@ -123,6 +158,9 @@
    if (_verify.noteEnable !== 'true') {
      _verify.noteCode = ''
    }
    if (_verify.printEnable !== 'true') {
      _verify.printTempId = ''
    }
    if (_verify.accountdate !== 'true') {
      _verify.accountfield = ''
      _verify.voucherdate = ''
@@ -134,6 +172,8 @@
      _verify.wxNoteLinkMenuId = ''
      _verify.wxNoteCallback = 'false'
      _verify.wxNoteKeys = null

      delete _verify.wxCustomTempId

      if (this.state.selectTemp) {
        this.setState({selectTemp: null})
@@ -160,11 +200,19 @@
    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 = {content: option.props.content.replace(/\r\n|\n/g, '<br/>'), example: option.props.example.replace(/\r\n|\n/g, '<br/>')}
    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) {
@@ -172,15 +220,27 @@
      keys = keys.map(key => key.replace(/{{|\.DATA}}/g, ''))
    }

    let index = 1
    _verify.wxNoteKeys = keys.map(key => {
      let item = { key: key }
      
      item.value = 'p' + index
      index++
    delete _verify.wxCustomTempId

      return item
    })
    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})

@@ -201,9 +261,31 @@
    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, card } = this.props
    const { wxTemps, selectTemp } = this.state
    const { unionFields, verify, notes, card, appType } = this.props
    const { wxTemps, selectTemp, printTemps } = this.state
    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
@@ -331,6 +413,31 @@
            </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>
              <Select value={verify.printTempId} onSelect={this.onPrintIdChange}>
                {printTemps.map(option =>
                  <Select.Option key={option.value} value={option.value}>
                    {option.text}
                  </Select.Option>
                )}
              </Select>
            </Form.Item>
          </Col> : null}
          <Col span={24}></Col>
          <Col span={8}>
            <Form.Item label={
              <Tooltip placement="bottomLeft" title={'请在服务器完成公众号配置。'}>
@@ -397,7 +504,7 @@
              <Input placeholder="" autoComplete="off" value={verify.wxNoteLinkMenuId || ''} onChange={(e) => {this.onOptionChange(e.target.value, 'wxNoteLinkMenuId')}}/>
            </Form.Item>
          </Col> : null}
          {verify.wxNote === 'true' && verify.wxNoteKeys ? verify.wxNoteKeys.map((item, index) => <Col span={8} key={'mk' + index}>
          {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>
@@ -413,7 +520,17 @@
              </Select>
            </Form.Item>
          </Col>) : null}
          {selectTemp && verify.wxNoteKeys ? <Col span={24} className="wx-note">
          {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>
@@ -438,6 +555,19 @@
              </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:&nbsp;&nbsp;"接收者openid",</p>
                  <p>send_id:&nbsp;&nbsp;"防重入id",</p>
                  <p>bid:&nbsp;&nbsp;"跳转小程序时，可作为BID。"</p>
                  <p style={{color: '#1890ff'}}>请在通用字段中（p1~p10）填入模板中对应的字段名，如 time1.DATA 则填写 time1。</p>
                </div>
              </div>
            </div>
          </Col> : null}
        </Row>
      </Form>
    )