clientList.js 3.89 KB
import React, { Component } from 'react';
import { connect } from 'dva';
import { routerRedux } from 'dva/router'
import { ActionSheet, Toast } from 'antd-mobile';
import shareHide from "../../utils/shareHide";

import { dataFilter } from '../../utils/dataFilter';
import MemberList from '../../components/MemberList/MemberList';

import css from './css.less'

// fix touch to scroll background page on iOS
const isIPhone = new RegExp('\\biPhone\\b|\\biPod\\b', 'i').test(window.navigator.userAgent);
let wrapProps;
if (isIPhone) {
  wrapProps = {
    onTouchStart: e => e.preventDefault(),
  };
}

class ClientList extends Component {
  constructor(props){
    super(props)
    this.state={
      managerList: [],
      storeManagerList: [],
      show: false
    }
  }


  showActionSheet = () => {
    const BUTTONS = ['新增', '取消'];
    ActionSheet.showActionSheetWithOptions({
        options: BUTTONS,
        cancelButtonIndex: BUTTONS.length - 1,
        maskClosable: true,
        'data-seed': 'logId',
        wrapProps,
      },
      (buttonIndex) => {
        // if (BUTTONS[buttonIndex] === '选择客户经理') {
        //    this.props.history.push('/governortraining/chooseclient');
        // }
        if (BUTTONS[buttonIndex] === '新增') {
          window.localStorage.setItem('governortrainingClient', null);
          this.props.history.push('/governortraining/addclient');
        }
      });
  }

  getManagerList() {
    this.props.dispatch({
      type: "governortraining/getManagerList",
      payload: {
        superiorid: window.localStorage.getItem("id")
      },
      callback: (res) => {
        if (res.status) {
          Toast.hide();
          this.setState({
            show:true,
            managerList: res.data,
            storeManagerList: res.data
          })
        }
      }
    })
  }

  componentDidMount() {
    shareHide();
    Toast.loading('loading...', 99);
    this.getManagerList();
  }
  render() {
    const _this = this;
    return (
      <div className={css.box}>
        {this.state.managerList.length === 0 && this.state.show &&  <div className={css.clientless}>
          <img src={require('../../assets/image/clientless.png')} alt="" className={css.client} />
          <p>
            您当前并无客户经理
          </p>
          <p>点击下方按钮添加</p>
          <img src={require('../../assets/image/addUsers.png')} alt="" className={css.add} onClick={() => {
            this.showActionSheet()
          }} />
        </div>}

        {
          (this.state.managerList.length > 0) && this.state.show && < MemberList
            dataList={this.state.managerList}
            renderType={['name']}
            filterData={(keywords) => {
              this.setState({
                managerList: dataFilter(this.state.storeManagerList, ['name'], keywords)
              })
            }}
            renderItem={item => {
              return <div className={css.managerItem}>
                <span className={css.name}>{item.name}</span><span className={css.time}>{item.number}</span>
              </div>
            }}

            handleEdit={(item) => {
              window.localStorage.setItem('governortrainingClient', JSON.stringify(item));
              this.props.dispatch(routerRedux.push('/governortraining/addclient'))
            }}
            handleAction={item => {
              this.props.dispatch({
                type: "governortraining/updateManager",
                payload: {
                  id: item.id,
                  superiorid: -1
                },
                callback: (res) => {
                  if(res.status)
                    _this.getManagerList();
                  else
                    Toast.info(res.message,3)
                }
              })
            }}
            showActionSheet = {this.showActionSheet}
            pTitle='客户经理' />
        }
      </div>
    )
  }
}

export default connect()(ClientList)