chooseClient.js 4.9 KB
import  { Component } from 'react';
import { Tabs, Toast } from 'antd-mobile';
import { connect } from 'dva';
import { routerRedux } from 'dva/router';
import MemberList from '../../components/MemberList/MemberList';
import { dataFilter } from '../../utils/dataFilter';
import shareHide from "../../utils/shareHide";
import css from './expertVideo.less';
class ChooseClient extends Component {
  constructor(props) {
    super(props);


    this.state = {
      chosenClient:null,
      chosenItm: '',
      chosenIdx:'',
      followList: [],
      storeFollowList: [],
      commitList: [],
      storeCommitList: []
    }
  }

  getFollowClient() {
    const _this = this;
    Toast.loading('loading...');
    this.props.dispatch({
      type: 'myUser/getAllUser',
      payload: {
        id: window.localStorage.getItem('id'),
        currentState: 0
      },
      callback(data) {
        if (data.length) {
          Toast.hide();
          _this.setState({
            followList: data,
            storeFollowList: data
          })
        }
      }
    });
  }

  getCommitClient() {
    const _this = this;
    Toast.loading('loading...');
    this.props.dispatch({
      type: 'myUser/getAllUser',
      payload: {
        id: window.localStorage.getItem('id')
      },
      callback(data) {
        if (data.length) {
          Toast.hide();
          _this.setState({
            commitList: data,
            storeCommitList: data
          })
        }
      }
    });
  }

  componentDidMount() {
    document.title = '选择客户'
    // 跟进中
    this.getFollowClient();
    shareHide();
  }

  componentWillUnmount(){
    document.title = ''
  }
  render() {
    return (
      <div>
        <div className={css.c_wrap}>
          <Tabs tabs={[{ title: '跟进中', sub: '1' }, { title: '已提交', sub: '2' }]}
            onChange={(t, i) => {
              if (i === 0 && this.state.followList.length === 0) {
                this.getFollowClient();
              } else if (this.state.commitList.length === 0) {
                this.getCommitClient();
              }
            }}
            >
              <div>
                <MemberList
                  dataList={this.state.followList}
                  renderType={['name']}
                  filterData={(keywords) => {
                    const _this = this;
                    this.setState({
                      followList: dataFilter(_this.state.storeFollowList, ['name'], keywords)
                    })
                  }}
                  renderItem={(item,i) => {
                    return <div className={ this.state.chosenItm===i? css.clientItem+' on': css.clientItem} onClick={() => {
                      this.setState({
                        chosenClient: item,
                        chosenItm: i
                      })
                    }}>
                      <span className="name">{item.name}</span><span className={css.time}>{item.createTime.substr(0,16)}</span>
                    </div>
                  }}
                  pTitle='跟进中客户' />
                <div className={css.btn_confirm}><span onClick={
                  (e) => {
                    this.props.dispatch(routerRedux.push({
                      pathname: '/home',
                      query: {
                        chosenClient: this.state.chosenClient,
                      },
                    }));
                  }
                }>确定</span></div>
              </div>
              <div>
                <MemberList
                  dataList={this.state.commitList}
                  renderType={['name']}
                  filterData={(keywords) => {
                    const _this = this;
                    this.setState({
                      commitList: dataFilter(_this.state.storeCommitList, ['name'], keywords)
                    })
                  }}
                  renderItem={(item,i) => {
                    return <div className={ this.state.chosenIdx===i? css.clientItem+' on': css.clientItem} onClick={() => {
                      this.setState({
                        chosenClient: item,
                        chosenIdx: i
                      })
                    }}>
                      <span className="name">{item.name}</span><span className={css.time}>{item.createTime.substr(0,16)}</span>
                    </div>
                  }}
                  pTitle='已提交客户' />
                <div className={css.btn_confirm}><span onClick={
                  (e) => {
                    this.props.dispatch(routerRedux.push({
                      pathname: '/home',
                      query: {
                        idChoose: true,
                        chosenClient: this.state.chosenClient,
                      },
                    }));
                  }
                }>确定</span></div>
              </div>
            </Tabs>
          </div>
      </div>
    )
  }
}

export default connect()(ChooseClient);