index.js

import React, { Component, Fragment } from 'react';
import { connect } from 'dva';
import { Toast } from 'antd-mobile';
import { Icon } from 'antd';
import shareHide from "../../utils/shareHide";
import css from './index.css';
import moment from 'moment';
import {getPlanInListWithCode} from '../../utils/dataFilter'

class Index extends Component{
  constructor(props) {
    super(props);
    this.state = {
      userInfo: JSON.parse(localStorage.getItem('userInfo')) || {},
      performTotal:"0.00",//当月业绩
      ranking:'0',//当月排名
      websiteName:'',//所辖网点名
      websiteList:[],//所辖网点
    }
  }
  componentDidMount() {
    document.title = '个人中心';
    const _this = this;
    shareHide();
    this.performaceServer();
    this.getAchievementRank();
    this.getWebsiteNmae();
  }
  //当月业绩
  performaceServer(){
    let that = this;
    this.props.dispatch({
      type: 'Performance/performList',
      payload: {
        "daySize": "M",
        "managerId": this.state.userInfo.id,
        "roleId": this.state.userInfo.roleId,
      },
      callback(data){
        if(data){
          that.setState({
            performTotal:data.amount?parseFloat(data.amount).toFixed(2):'0.00'
          })
        }
      },
      error(data){
        Toast.info(data.message)
      }
    })
  }
   //当月排行
  getAchievementRank(){
    let that = this;
    Toast.loading('loading...');
    this.props.dispatch({
      type: 'Performance/achievementRank',
      payload: {
        "month": moment().format('MM'),
        "roleId": this.state.userInfo.roleId,
        "userId": this.state.userInfo.id
      },
      callback(data){
        Toast.hide();
        if(data){
           that.setState({
              ranking:data.ranking
            })
        }
      },
      error(data){
        Toast.info(data.message)
      }
    })
  }
  getWebsiteNmae(){
    let _this = this;
    this.props.dispatch({
      type: "governortraining/getOrzList",
      payload: {
        orgId:this.state.userInfo.project
      },
      callback: (res) => {
        if (res.status && res.data.length) {
          let project = _this.state.userInfo.website ? _this.state.userInfo.website.split(',') : [];
          let myProjectList=[];
          let websiteName = [];
          for(let ii in project){
            let target = getPlanInListWithCode('orgId',project[ii],res.data);
            if(target.orgId){
              myProjectList.push(target);
              websiteName.push(target.orgName);
            }
          }
          _this.setState({websiteList:myProjectList,websiteName:websiteName.join(',')})
        }
        Toast.hide();
      }
    });
  }
  render() {
    const { userInfo,performTotal,ranking ,websiteName,websiteList} = this.state;
    return (
        <div className={css.myCenter}>
          <div className={css.headerCard}>
            <div className={css.head}>
            <img src={userInfo.headUrl ? userInfo.headUrl : require("../../assets/image/defaultHead.png")} alt="" />
            </div>
            <div className={css.info}>
              <div style={{marginBottom:'5px'}}>{userInfo.name}<span style={{marginLeft:'20px'}}>{userInfo.roleId === 3 ? '督训':'客户经理'}</span></div>
              <div>手机号：<span>{userInfo.number}</span></div>
            </div>
          </div>
          <div className={css.senction1}>
            <div className={css.childsection} onClick={()=>{this.props.history.push('/performance')}}>
              <div className={css.header}>当月业绩</div>
              <div style={{color:'#FF9D5C',fontSize:'.32rem'}}>{performTotal}<span style={{fontSize:'12px',margin:'0 8px'}}>元</span></div>
            </div>
            <img src={require('../../assets/image/lineH.png')} style={{height:'.9rem'}}/>
            <div className={css.childsection} onClick={()=>{this.props.history.push('/myRank')}}>
              <div className={css.header}>当月排名</div>
              <div style={{color:'#FF9D5C',fontSize:'.16rem'}}>全渠道第<span style={{fontSize:'.32rem',margin:'0 8px'}}>{ranking}</span>名</div>
            </div>
          </div>
          {userInfo.roleId === 2 && (
              <div className={css.senction2}>
                <div className={css.item}><div className={css.left}>所属机构</div><div>{userInfo.orgName}</div></div>
                <div className={css.item}><div className={css.left}>所属网点</div><div>{userInfo.websiteName}</div></div>
                <div className={css.item}><div className={css.left}>所属督训</div><div>{userInfo.superiorName}</div></div>
              </div>
          )}
          {userInfo.roleId === 3 && (
              <div className={css.senction2}>
                <div className={css.item}><div className={css.left}>所属机构</div><div>{userInfo.orgName}</div></div>
                <div className={css.item}><div className={css.left}>所属项目</div><div>{userInfo.projectName}</div></div>
                <div className={css.item}><div className={css.left}>所辖网点</div><div className={css.websiteNameCss}>{websiteName}</div>
                  <div className={css.arrow} onClick={()=>{this.props.history.push({pathname:'/home/myUser/website',params:websiteList})}}><Icon type="right" /></div>
                </div>
              </div>
          )}
          <div className={css.senction2}>
            <div className={css.item}><div className={css.left}>年龄</div><div>{userInfo.age}</div></div>
            <div className={css.item}><div className={css.left}>性别</div><div>{userInfo.sex == '1' ? '女' : "男"}</div></div>
            <div className={css.item}><div className={css.left}>手机号</div><div>{userInfo.number}</div></div>
          </div>
          <div className={css.tipsContent}>
            <img src={require('../../assets/image/zhihuigongzuo.png')} style={{width:'60%'}}/>
          </div>
        </div>
      )
  }
}

export default connect()(Index);