import 'antd-mobile/dist/antd-mobile.less';
import React, { Component } from 'react';
import DocumentTitle from 'react-document-title';
import { connect } from 'react-redux';
import styles from './index.less';

@connect(({ beautician }) => ({ beautician }))
class index extends Component {
  state = {
  };
  componentWillMount = () => {
    const { id } = this.props.location.query;
    this.props.dispatch({
      type: 'beautician/groomerFciCertificates',
      payload: {
        id
      },
    });
  };
  componentDidMount = () => {};
  componentWillUnmount = () => {};
  onError = () => {
    const { dataFci } = this.props.beautician;
    this.props.dispatch({
      type: 'beautician/updateState',
      payload: {
        data: {
          ...dataFci,
        },
      },
    });
  };
  render() {
    const { dataFci } = this.props.beautician;
    return (
      <DocumentTitle title={dataFci.levelCn}>
        <div className={styles.content}>
        <div className={`${styles.box} ${(dataFci.levelCn == 'FCI-A级' || dataFci.levelCn == 'FCI-B级' || dataFci.levelCn == 'FCI-C级') && styles.fcimrzgz}`}>
            <div className={styles.name}>{dataFci.name}</div>
            <div className={styles.dogCategorys}>{dataFci.dogCategorys}</div>
            <div className={styles.levelEn}>{dataFci.levelEn}</div>
            <div className={styles.country}>{dataFci.country}</div>
            <div className={styles.takeCertificateDate}>{dataFci.takeCertificateDate}</div>
            <div className={styles.judge}>{dataFci.referee}</div>
            <div className={styles.img_signature}>
              {dataFci.refereeSignaturePhotoBase64List && dataFci.refereeSignaturePhotoBase64List.length > 0 ?
              dataFci.refereeSignaturePhotoBase64List.map((item, index) => (
                <img src={item}/>
              ))
              :
              null
            }</div>

            <div className={styles.fci_signature}></div>
          </div>
        </div>
      </DocumentTitle>
    );
  }
}
export default index;