xs-manage/src/pages/property/message/event/components/Preview.jsx

import React, { useEffect, useState } from 'react'
import moment from 'moment'
import { Modal } from 'antd'
import Styles from './style.less'

export default props => {
  const baseURL = props.dataSource.evtType === 'birthday'
    ? 'https://xs.ycjcjy.com/shengrih5.html'
    : 'https://xs.ycjcjy.com/jierih5.html'

  const queryString = [
    `name=${encodeURIComponent(' 张xx (先生)')}`,
    `date=${moment().format('YYYY-MM-DD')}`,
    `org=${encodeURIComponent(props.dataSource.org || '')}`,
    `festival=${encodeURIComponent(props.dataSource.name || '')}`,
  ].join('&')

  const url = [baseURL, queryString].join('?')

  return (
    <Modal
      title="祝福模板预览"
      width={423}
      visible={props.visible}
      footer={null}
      onOk={props.onOk}
      onCancel={props.onCancel}
    >
      <iframe
        src={url}
        frameborder="0"
        scrolling="no"
        className={Styles['message-tpl-preview']}
      />
    </Modal>
  )
}