{"size": 2103, "ext": "js", "max_stars_repo_path": "src/components/building/totalData.js", "max_stars_repo_name": "sunhk123456/abcf", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/components/building/totalData.js", "max_issues_repo_name": "sunhk123456/abcf", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/components/building/totalData.js", "max_forks_repo_name": "sunhk123456/abcf", "max_forks_repo_forks_event_min_datetime": "2021-08-17T10:03:59.000Z", "max_forks_repo_forks_event_max_datetime": "2021-08-17T10:03:59.000Z"}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": 1, "avg_line_length": 31.8636363636, "max_line_length": 145, "alphanum_fraction": 0.5696623871}
import React, { PureComponent } from 'react';
import { connect } from 'dva';
import styles from './totalData.less';
import img0 from '../../assets/image/building/img0.png';
import img1 from '../../assets/image/building/img1.png';
import img2 from '../../assets/image/building/img2.png';
import img3 from '../../assets/image/building/img3.png';

@connect(({ buildingModels }) => ({
  buildingModels
}))
class TotalData extends PureComponent{
  static defaultProps = {
      totalData:[
        {name:"转交楼宇数",value:"-",unit:"栋"},
        {name:"新增楼宇数",value:"-",unit:"栋"},
        {name:"业务规模",value:"-",unit:"户"},
        {name:"业务收入",value:"-",unit:"万元"}
      ],
    };

    constructor(props){
        super(props);
        this.state={
          imgList:[img0,img1,img2,img3],
          data:[
            {name:"转交楼宇数",value:"-",unit:"栋"},
            {name:"新增楼宇数",value:"-",unit:"栋"},
            {name:"业务规模",value:"-",unit:"户"},
            {name:"业务收入",value:"-",unit:"万元"}
          ],
        };
    };

  dataDisplay = (data)=>{
    const { imgList } = this.state;
    return data.map((item, index) => (
      <div className={styles.items} key={item+Math.random()}>
        <img src={imgList[index]} alt="" className={styles.img} style={index===data.length-2?{width:'55px',height:'55px',margin:'unset'}:null} />
        <div className={styles.number}>
          <div className={styles.title}>{item.name}</div>
          <div className={styles.data} style={index===data.length-1?null:{borderRight:' 1px solid #999999'}}>
            <div className={styles.value}>{item.value}</div>
            <div className={styles.unit} style={index===data.length-1?{width:'40px'}:null}>{item.unit}</div>
          </div>
        </div>
      </div>
    ))
  };

  render(){
    const {totalData}=this.props;
    const {data}=this.state;
    let dataDisplay;
    if(totalData.length>0){
      dataDisplay = this.dataDisplay(totalData);
    }else{
      dataDisplay = this.dataDisplay(data);
    }
    return (
      <div className={styles.contain}>{dataDisplay}</div>
    )
  }
}
export default TotalData;
