import React, { Component } from 'react';
import DocumentTitle from 'react-document-title';

class Index extends Component {
  constructor(props) {
    super(props);
    this.state = {
      certificateType: null,
    };
  }
  componentWillMount = () => {
    const { certificateType } = this.props.location.query;
    if (certificateType) {
      this.setState({
        certificateType,
      });
    }
  };
  componentDidMount = () => {};
  componentWillUnmount = () => {};

  render() {
    const { certificateType } = this.state;
    return (
      <DocumentTitle title="血统证书说明">
        <div>
          {certificateType ? (
            <div>
              <img
                style={{ display: 'block', width: '100%', height: 'auto' }}
                src={require(`../assets/description/${certificateType}/01.png`)}
                alt="血统证书说明"
              ></img>
              <img
                style={{ display: 'block', width: '100%', height: 'auto' }}
                src={require(`../assets/description/${certificateType}/02.png`)}
                alt="血统证书说明"
              ></img>
              <img
                style={{ display: 'block', width: '100%', height: 'auto' }}
                src={require(`../assets/description/${certificateType}/03.png`)}
                alt="血统证书说明"
              ></img>
              <img
                style={{ display: 'block', width: '100%', height: 'auto' }}
                src={require(`../assets/description/${certificateType}/04.png`)}
                alt="血统证书说明"
              ></img>
              <img
                style={{ display: 'block', width: '100%', height: 'auto' }}
                src={require(`../assets/description/${certificateType}/05.png`)}
                alt="血统证书说明"
              ></img>
            </div>
          ) : null}
        </div>
      </DocumentTitle>
    );
  }
}

export default Index;