index.js

import React, { Component } from 'react'
import { connect } from 'dva'
import { Tabs, WhiteSpace, Badge,Toast } from 'antd-mobile';
import { Form } from 'antd';
import InsuranceList from "../InsuranceList"
import styles from "./Tabs.css"
import css from "../../routes/GovernorTraining/css.less"
import MemberList from '../../components/MemberList/MemberList';
import Iscroll from "../../components/Iscroll";
class Tab extends Component{
  constructor(props){
    super(props);
    this.state={
      tabs:[{ title: <Badge >{this.props.title[0]}</Badge> },
        { title: <Badge >{this.props.title[1]}</Badge> }
      ],
      chosenClientId:0,
      chosenItm: '',
      inputValue:'',
      name:'',
      currentStatus:'',
      firstName:[],
      nameList:props.nameList,
      nameList1:props.nameList1,
      checkTab:0,
    }
  }
  onSearch = (val) => {
    this.setState({
      inputValue:val
    })
  }
  componentWillMount(){
    let that = this;
  //   that.props.dispatch({
  //     type:'myUser/getAllUser',
  //     payload:{
  //       "id":localStorage.getItem("id"),
  //       "currentState":0,
  //     },
  //     callback(data){
  //       that.setState({
  //         list:data,
  //         nameList:data,
  //       })
  //     }
  //   })
  //   this.props.dispatch({
  //     type:'myUser/getAllUser',
  //     payload:{
  //       "id":localStorage.getItem("id"),
  //     },
  //     callback(data){
  //       that.setState({
  //         list:data,
  //         nameList1:data,
  //       })
  //     }
  // })
  }
  /* 删除客户  */
  delete = (id)=>{
    let that  = this;
    this.props.dispatch({
      type:'myUser/deleteCustomer',
      payload:{
        "id":id,
      },
      callback(){
        // this.getUaer()
      }
    })
  }
history=()=>{
  this.props.history()
}
go1=(item)=>{
  console.log(item);
  let storage = window.localStorage;
  storage.setItem("riskName",item.riskName)
  storage.setItem("riskCode",item.riskCode)
  storage.setItem("calculationMethod",item.calculationMethod)
  storage.setItem("selectd",1)
  storage.setItem("seriNo",item.seriNo)
  //storage.setItem("recipients",false)
  storage.setItem("riskIntroduce",item.riskIntroduce)
  storage.setItem("thumbnail",item.thumbnail)
  //storage.setItem("recipientsName",'')
  //storage.setItem("recipientsSex",true)
  //storage.setItem("recipients",false)
  let roleId =localStorage.getItem("roleId");
  window.location.href= window.location.href.split('#')[0]+ '#/addplaneditor?riskName='+item.riskName+'&riskCode='+item.riskCode +'&calculationMethod='+ item.calculationMethod + '&thumbnail='+item.thumbnail+'&selectd=1&roleId='+ roleId +'&Id='+ localStorage.getItem('id') + '&seriNo='+item.seriNo+'&recipientsName='+ item.receiveName +'&recipientsSex='+item.receiveSex;
}
goPlanResult=(item)=>{
  let storage = window.localStorage;
  storage.setItem("seriNo",item.seriNo)
  storage.setItem("calculationMethod",item.calculationMethod)
  storage.setItem("riskCode",item.riskCode)
  storage.setItem("riskName",item.riskName)
  storage.setItem("thumbnail",item.thumbnail)
  window.location.href= window.location.href.split('#')[0]+ '#/planResult?seriNo='+item.seriNo+'&riskName='+item.riskName +'&riskCode='+ item.riskCode +'&thumbnail='+item.thumbnail+'&recipientsName='+ item.receiveName +'&recipientsSex='+item.receiveSex;
}
go=(item)=>{
  this.props.dispatch({
    type:'planEditor/getMyPlanMessage',
    payload:{
      "seriNo":item.seriNo,
      "interestRate":"0.03"
    },
    callback(data){
    }
  })
}
  dispatch=(item)=>{
    let that = this;
    if(item.seriNo){
    }else{
      this.props.dispatch({
        type: 'myUser/getAllUser',
        payload: {
          "id":localStorage.getItem("id"),
          "currentState":this.state.currentStatus,
        },
        callback(){
          that.props.amentClient();
        }
      })
    }
  }
  goAddInsurance = (item)=>{
    let storage = window.localStorage;
    storage.setItem("riskName",item.riskName)
    storage.setItem("riskCode",item.riskCode)
    storage.setItem("calculationMethod",item.calculationMethod)
    storage.setItem("selectd",1)
    storage.setItem("seriNo",'')
    //storage.setItem("recipients",false)
    storage.setItem("riskIntroduce",item.riskIntroduce)
    storage.setItem("thumbnail",item.thumbnail)
    //storage.setItem("recipientsName",'')
    //storage.setItem("recipientsSex",true)
    //storage.setItem("recipients",false)
    let roleId =localStorage.getItem("roleId");
   window.location.href= window.location.href.split('#')[0]+ '#/addPlanEditor?riskName='+item.riskName+'&riskCode='+item.riskCode +'&calculationMethod='+ item.calculationMethod + '&riskIntroduce=&thumbnail='+item.thumbnail+'&selectd=1&roleId='+ roleId  +'&Id='+ localStorage.getItem('id') + '&seriNo='
  }
  render() {
    let checkTab = this.state.checkTab
    if(sessionStorage.getItem("key") == '已提交'){
      checkTab = 1
    }
    if(sessionStorage.getItem("key") == '我的'){
      checkTab = 1
    }
    let showClient = this.props.storeNameList?this.props.storeNameList.length==0:false &&this.props.user;
    let showClient1 = this.props.storeNameList1?this.props.storeNameList1.length==0:false &&this.props.user;
    const { dataFilterToProp } = this.props;
    return (
      <div style={{height:'100%',backgroundColor:'white'}}>
        <Tabs tabs={this.state.tabs}
              initialPage={checkTab}
              swipeable={false}
               onChange={(tab, index) => {
                 let checkTab = tab.title.props.children;
                sessionStorage.setItem( "key", checkTab);
               }}
              tabBarTextStyle={{fontSize:'.15rem',height:'.435rem'}}
        >
          <div  className={!showClient||!showClient1?styles.tabs1:styles.tabs}>
            {/*计划书列表---所有*/}
            {this.props.allPlanList &&
              <div>
                <InsuranceList planList = {this.props.allPlanList} goAddInsurance={this.goAddInsurance} style={{paddingTop:'0.2rem',}}></InsuranceList>
                <div className={styles.noMore}>
                  <div><img src={require('../../assets/image/no-more.png')} alt=""/>
                    <span>没有更多啦</span>
                  </div>
                </div>
              </div>
            }
            {/* 我的客户---无客户跟进中*/}
            { !this.props.myPlanList&& showClient && <div className={styles.clientless}>
              <img src={require('../../assets/image/clientless.png')} alt="" className={styles.client}/>
              <p>
                您当前并未提交客户
              </p>
              <p>点击下方按钮添加</p>
              <img src={require('../../assets/image/addUsers.png')} onClick={()=>{
                  this.props.addUser();
                }} alt="" className={styles.add}/>
            </div>}
            {/*我的客户 --- 未提交*/}
            { !this.props.myPlanList&& !showClient &&
            <div className={styles.less} style={{ width: '100%',height:'100%'}}>
              {!this.props.hasClient[0] && <div className={styles.clientless}>
                <img src={require('../../assets/image/clientless.png')} alt="" className={styles.client} />
                <p>
                  您当前并无已提交客户
                </p>
                <p>点击下方按钮添加</p>
                <img src={require('../../assets/image/addUsers.png')} onClick={() => {
                  this.props.addUser();
                }} alt="" className={styles.add} />
              </div>
              }
              {this.props.hasClient[0] && 
                <div> 
                  <MemberList
                    id="user1"
                    dataList={this.props.nameList}
                    renderType={['name']}
                    content={this.props.content}
                    handleEdit={(item) => {
                      // item 客户信息， false 未提交状态
                      this.props.goAddUser(item, false)
                    }}
                    filterData={keywords => {
                      dataFilterToProp(keywords, 0);
                    }}
                    renderItem={item => {
                      return <div className={css.managerItem} onClick={()=>{
                        let clientNeededInfo = {...item ,disabled1:true}
                        localStorage.setItem('clientNeededInfo', JSON.stringify(clientNeededInfo))
                        window.location.href = window.location.href.split('#')[0] + '#/addUser'
                      }}>
                        <span className={css.name}>{item.name}</span><span className={css.time}>{item.createTime.substr(0, 16)}</span>
                      </div>
                    }}
                    handleAction={item => {
                      this.props.delete(item.id)
                    }}
                    pTitle='客户' />
                  <div className={styles.btn_confirm} >
                    <img src={require('../../assets/image/add-user.png')} alt="" onClick={() => {
                      this.props.addUser();
                    }} />
                  </div>
              </div>
              }
            </div>
            }
          </div>
          {/*----tabs 右侧--*/}
          <div  style={{ position: 'relative',display: 'flex',  minHeight:'100%', justifyContent: 'center',backgroundColor: '#fff',overflow: 'hidden'}}>
            {/*计划书---我的*/}
            {this.props.myPlanList && <div style={{marginBottom:'.3rem'}}>
              <Iscroll id="myPlan2" 
                        iscrollOptions={{
                          probeType:2
                        }}
                        >
                  <InsuranceList planList = {this.props.myPlanList} className={styles.last} history={this.history} my={true} go={this.go} go1={this.go1} goPlanResult={this.goPlanResult} getMyPlan = {this.props.getMyPlan}></InsuranceList>
                  <div className={styles.noMore}>
                    <div><img src={require('../../assets/image/no-more.png')} alt=""/>
                      <span>没有更多啦</span>
                    </div>
                  </div>
              </Iscroll>
            </div>}
            {/* 我的客户 --- 无客户已提交*/}
            {!this.props.myPlanList&& showClient1 && <div className={styles.clientless}>
              <img src={require('../../assets/image/clientless.png')} alt="" className={styles.client}/>
              <p>
                您当前并无跟进客户
              </p>
              <p>点击下方按钮添加</p>
                <img src={require('../../assets/image/addUsers.png')} onClick={() => {
                  this.props.addUser();
                }} alt="" className={styles.add} />
            </div>
            }
            {/*我的客户---有客户已提交 */}
            {!this.props.myPlanList&& !showClient1 && <div className={styles.less} style={{width:'100%'}}>
              {!this.props.hasClient[1] && <div className={styles.clientless}>
                <img src={require('../../assets/image/clientless.png')} alt="" className={styles.client} />
                <p>
                  您当前并无跟进客户
                </p>
                <p>点击下方按钮添加</p>
                <img src={require('../../assets/image/addUsers.png')} onClick={() => {
                  this.props.addUser();
                }} alt="" className={styles.add} />
              </div>
              }
              { this.props.hasClient[1] && <div style={{height:'100%'}}>
                <MemberList
                  id="user2"
                  dataList={this.props.nameList1}
                  renderType={['name']}
                  isCheckClientStateForSwipe={true}
                  handleEdit={(item) => {
                    // item 客户信息， true 已提交状态
                    this.props.goAddUser(item, true)
                  }}
                  filterData={keywords => {
                    dataFilterToProp(keywords, 1);
                  }}
                  renderItem={item => {
                    let status = '未提交';
                    switch (item.currentState) {
                      // case '1':
                      //   status = '待审核';
                      //   break;
                      // case '2':
                      //   status = '审核退回';
                      //   break;
                      case '3':
                        status = '已提交';
                        break;
                      case '4':
                        status = '已成单';
                        break;
                      case '5':
                        status = '已上传';
                        break;
                      case '6':
                        status = '跟进中';
                        break;
                      case '7':
                        status = '停止跟进';
                        break;
                      default:
                    }
                    return <div className={css.clientItem}
                                style={{display:'flex'}}
                                onClick={()=>{
                                  let clientNeededInfo = {...item ,disabled1:true}
                                  localStorage.setItem('clientNeededInfo', JSON.stringify(clientNeededInfo))
                                  //审核驳回的，可以修改，不能预览
                                  if(item.currentState !=2){
                                    window.location.href = window.location.href.split('#')[0] + '#/addUser'
                                  }
                              }}>
                            <span className={css.name}>{item.name}</span>
                            <span className={css.time}>{item.createTime.substr(0, 16)}</span>
                            <span className={css.status}>{status}</span>
                          </div>
                  }}
                  handleAction={item => {
                    console.log(44);
                    this.props.delete(item.id)
                  }}
                  pTitle='客户' />
                  <div className={styles.btn_confirm} >
                    <img src={require('../../assets/image/add-user.png')} alt="" onClick={() => {
                      this.props.addUser();
                    }} />
                  </div>
              </div>
            }
            </div>
          }
          </div>
        </Tabs>
        <WhiteSpace />
      </div>
    )
  }
}
Tab.propsTypes = {}
export default connect(({myUser})=>({myUser}))(Form.create()(Tab))