qm-bus/src/GalleryBox/components/protocol-panel.js

千米公有云业务组件库

import React from 'react'
import moment from 'moment'

import { UploadPicture } from '../webapi'

class ProtocolPanel extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      data: [],
    }
  }

  componentDidMount() {
    this.fetchUploadPicture()
  }

  fetchUploadPicture = () => {
    UploadPicture(JSON.stringify(['upload_protocol'])).then(res => {
      if (res.err) {
        message.error(res.err.message)
      } else {
        this.setState({
          data: res.data.upload_protocol,
        })
      }
    })
  }

  render() {
    let record = this.state.data
    let url = `https://resources.qianmi.com${record.protocolContent}`
    return (
      <div>
        <h2 style={{ fontSize: '16px', textAlign: 'center' }}>{record.protocolName}</h2>
        <p style={{ color: '#999', fontSize: '12px', textAlign: 'right' }}>
          本版发布日期：{moment(record.releaseTime).format('YYYY年MM月DD日')}
        </p>
        <p style={{ color: '#999', fontSize: '12px', textAlign: 'right' }}>
          生效日期：{moment(record.effectTime).format('YYYY年MM月DD日')}
        </p>
        <iframe src={url} style={{ width: '100%', height: 600, border: 0 }}></iframe>
      </div>
    )
  }
}

export default ProtocolPanel