| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526 | import React, { Component } from 'react';import {  Button, DatePicker,  Input,  message,  Select,  Spin,  Table, Tabs,} from "antd";import './index.less';import $ from "jquery/src/ajax";import CustomerDetails from './customerDetails';import moment from "moment";import { ChooseList } from "../../../order/orderNew/chooseList";const { RangePicker } = DatePicker;const { TabPane } = Tabs;class DepartmentStatistics extends Component {  constructor(props) {    super(props);    this.state = {      superId: undefined,      nameSearch: '',      releaseDate: [moment(Date.now() - 777600000).format('YYYY-MM-DD'), moment(Date.now()).format('YYYY-MM-DD')],      columns: [        {          title: "部门",          dataIndex: "name",          key: "name",          width: '25%',        },        {          title: "私有数",          dataIndex: "userCount",          key: "userCount",          className: 'tableRowStyle',          width: 120,          render: (text, record) => {            return (              <div                className={record.aid ? 'receiveCount' : ''}                onClick={(e) => {                  if (record.aid) {                    e.stopPropagation();                    this.setState({                      customerVisible: true,                      aid: record.aid,                      aName: record.aName,                      type: 0,                    })                  }                }}>                {text}              </div>            );          },        },        {          title: "私有领取数",          dataIndex: "receiveCount",          key: "receiveCount",          className: 'tableRowStyle',          width: 120,          render: (text, record) => {            return (              <div                className={record.aid ? 'receiveCount' : ''}                onClick={(e) => {                  if (record.aid) {                    e.stopPropagation();                    this.setState({                      customerVisible: true,                      aName: record.aName,                      aid: record.aid,                      type: 7,                    })                  }                }}>                {text}              </div>            );          },        },        {          title: "外联数",          dataIndex: "channelCount",          key: "channelCount",          className: 'tableRowStyle',          width: 120,          render: (text, record) => {            return (              <div                className={record.aid ? 'receiveCount' : ''}                onClick={(e) => {                  if (record.aid) {                    e.stopPropagation();                    this.setState({                      customerVisible: true,                      aid: record.aid,                      aName: record.aName,                      type: 1,                    })                  }                }}>                {text}              </div>            );          },        },        {          title: "签单数",          dataIndex: "signCount",          key: "signCount",          className: 'tableRowStyle',          width: 120,          render: (text, record) => {            return (              <div                className={record.aid ? 'receiveCount' : ''}                onClick={(e) => {                  if (record.aid) {                    e.stopPropagation();                    this.setState({                      customerVisible: true,                      aName: record.aName,                      aid: record.aid,                      type: 2,                    })                  }                }}>                {text}              </div>            );          },        },        {          title: "私有新增数",          dataIndex: "newCount",          key: "newCount",          className: 'tableRowStyle',          width: 120,          render: (text, record) => {            return (              <div                className={record.aid ? 'receiveCount' : ''}                onClick={(e) => {                  if (record.aid) {                    e.stopPropagation();                    this.setState({                      customerVisible: true,                      aName: record.aName,                      aid: record.aid,                      type: 3,                    })                  }                }}>                {text}              </div>            );          },        },        {          title: "外联新增数",          dataIndex: "channelNewCount",          key: "channelNewCount",          className: 'tableRowStyle',          width: 120,          render: (text, record) => {            return (              <div                className={record.aid ? 'receiveCount' : ''}                onClick={(e) => {                  if (record.aid) {                    e.stopPropagation();                    this.setState({                      customerVisible: true,                      aName: record.aName,                      aid: record.aid,                      type: 4,                    })                  }                }}>                {text}              </div>            );          },        },        {          title: "私有面谈数",          dataIndex: "completeCount",          key: "completeCount",          className: 'tableRowStyle',          width: 120,          render: (text, record) => {            return (              <div                className={record.aid ? 'receiveCount' : ''}                onClick={(e) => {                  if (record.aid) {                    e.stopPropagation();                    this.setState({                      customerVisible: true,                      aName: record.aName,                      aid: record.aid,                      type: 5,                    })                  }                }}>                {text}              </div>            );          },        },        {          title: "外联面谈数",          dataIndex: "channelCompleteCount",          key: "channelCompleteCount",          className: 'tableRowStyle',          width: 120,          render: (text, record) => {            return (              <div                className={record.aid ? 'receiveCount' : ''}                onClick={(e) => {                  if (record.aid) {                    e.stopPropagation();                    this.setState({                      customerVisible: true,                      aName: record.aName,                      aid: record.aid,                      type: 6,                    })                  }                }}>                {text}              </div>            );          },        },      ],      contactsOption: null,      loading: false,      ispage: 1,      aid: '',      type: '',      visible: false,    };    this.loadData = this.loadData.bind(this);    this.reset = this.reset.bind(this);    this.selectSuperId = this.selectSuperId.bind(this);    this.changeList = this.changeList.bind(this);  }  componentDidMount() {    this.selectSuperId();  }  loadData() {    if (!this.state.superId) {      message.warning('请选择部门后再搜索')      return;    }    this.setState({      loading: true,    });    let api = '/api/admin/customer/selectAllUser';    let data = {};    if (this.state.superId) {      data.depId = this.state.superId;    }    if (this.state.nameSearch) {      data.aName = this.state.nameSearch;    }    if (this.state.releaseDate[0]) {      data.startTime = this.state.releaseDate[0]    }    if (this.state.releaseDate[1]) {      data.endTime = this.state.releaseDate[1]    }    $.ajax({      method: "get",      dataType: "json",      crossDomain: false,      url: globalConfig.context + api,      data: data,      success: function (data) {        let theArr = [];        if (data.error.length !== 0) {          if (data.error && data.error.length) {            message.warning(data.error[0].message);          }        } else {          data.data.children = data.data.list;          data.data.children = data.data.children.concat(data.data.aList);          theArr.push(data.data);          theArr = this.handleTabsInfor(theArr);          this.setState({            ispage: data.data.pageNo,            dataSource: theArr,          });        }      }.bind(this),    }).always(      function () {        this.setState({          loading: false,        });      }.bind(this)    );  };  //表格数据处理  handleTabsInfor(infor) {    for (let i = 0; i < infor.length; i++) {      if (!infor[i].key) {        infor[i].key = infor[i].id ? infor[i].id : (infor[i].aid ? infor[i].aid : i)      }      if (infor[i].children) {        for (let c = 0; c < infor[i].children.length; c++) {          infor[i].children[c].key = infor[i].children[c].id;          infor[i].children[c].children = infor[i].children[c].list;          if (infor[i].children[c].aName) { infor[i].children[c].name = infor[i].children[c].aName }          if (infor[i].children[c].aList && Array.isArray(infor[i].children[c].aList) && infor[i].children[c].aList.length) {            if (infor[i].children[c].children && Array.isArray(infor[i].children[c].children)) {              for (let t of infor[i].children[c].aList) {                t.key = t.aid;                t.name = t.aName;              }              infor[i].children[c].children = infor[i].children[c].children.concat(infor[i].children[c].aList);            }          }          this.handleTabsInfor(infor[i].children);        }      }    }    return infor;  }  reset() {    this.setState({      nameSearch: '',      releaseDate: [moment(Date.now() - 777600000).format('YYYY-MM-DD'), moment(Date.now()).format('YYYY-MM-DD')],    }, () => {      this.loadData();    });  };  //获取上级组织  selectSuperId() {    this.state.data = []    $.ajax({      method: "get",      dataType: "json",      crossDomain: false,      url: globalConfig.context + "/api/admin/organization/selectSuperId",      data: {},      success: function (data) {        let theArr = [];        let theId = [];//用于保存上级组织的ID和名称        let thedata = data.data;        if (!thedata) {          if (data.error && data.error.length) {            message.warning(data.error[0].message);          };          thedata = {};        };        for (var i = 0; i < data.data.length; i++) {          let theData = data.data[i];          theArr.push(            <Select.Option value={theData.id} key={theData.id}>{theData.name}</Select.Option>          );          theId.push(            [theData.id, theData.name]          );        };        this.setState({          SuperArr: thedata,          contactsOption: theArr,          theId: theId,          orderStatusOptions: data.data,        });        if (!this.state.superId) {          this.setState({            superId: data.data[0].id          }, () => {            this.loadData();          })        }      }.bind(this),    }).always(function () {      this.setState({        loading: false      });    }.bind(this));  }  changeList(arr) {    const newArr = [];    this.state.columns.forEach(item => {      arr.forEach(val => {        if (val === item.title) {          newArr.push(item);        }      });    });    this.setState({      changeList: newArr    });  }  render() {    return (      <div className="user-content">        <div className="content-title">          <span>部门统计</span>        </div>        <Tabs          defaultActiveKey="1"          className="test">          <TabPane tab="搜索" key="1">            <div className="user-search" style={{ display: 'flex', alignItems: 'center' }}>              <div>                <Select                  showSearch                  optionFilterProp="children"                  placeholder="请选择部门"                  style={{ width: 200, marginLeft: 10 }}                  value={this.state.superId}                  onChange={(e) => { this.setState({ superId: e }) }}                  notFoundContent="未获取到上级组织列表">                  {this.state.contactsOption}                </Select>              </div>              <Input                placeholder="客户名称"                value={this.state.nameSearch}                style={{ width: 150, marginRight: 10, marginLeft: 10 }}                onChange={(e) => {                  this.setState({ nameSearch: e.target.value });                }}              />              <div style={{                marginTop: '10px',              }}>                <RangePicker                  allowClear={window.adminData.shiroList.indexOf("11") == -1}                  disabledDate={(current) => {//“运营管理”角色只能查看部分时间段(暂时10天)的数据                    let iskeep = window.adminData.shiroList.indexOf("11") != -1                    return iskeep && current && current.valueOf() < Date.now() - 864000000;                  }}                  value={[                    this.state.releaseDate[0]                      ? moment(this.state.releaseDate[0])                      : null,                    this.state.releaseDate[1]                      ? moment(this.state.releaseDate[1])                      : null,                  ]}                  onChange={(data, dataString) => {                    this.setState({ releaseDate: dataString });                  }}                />              </div>              <Button                type="primary"                style={{ marginLeft: "10px", marginRight: 10 }}                onClick={() => {                  this.loadData();                }}              >                搜索              </Button>              <Button onClick={this.reset}>重置</Button>            </div>          </TabPane>          <TabPane tab="更改表格显示数据" key="2">            <div style={{ marginLeft: 10 }}>              <ChooseList                columns={this.state.columns}                changeFn={this.changeList}                changeList={this.state.changeList}                top={55}                margin={11}              />            </div>          </TabPane>        </Tabs>        <div className="patent-table">          <Spin spinning={this.state.loading}>            <Table              size="middle"              scroll={{ y: 550 }}              columns={                this.state.changeList                  ? this.state.changeList                  : this.state.columns              }              dataSource={this.state.dataSource}              pagination={false}            />          </Spin>        </div>        {this.state.customerVisible ? <CustomerDetails          aid={this.state.aid}          type={this.state.type}          aName={this.state.aName}          startTime={this.state.releaseDate[0]}          endTime={this.state.releaseDate[1]}          visible={this.state.customerVisible}          onCancel={() => {            this.setState({              customerVisible: false,              aid: '',              type: '',            })          }}        /> : <div />}      </div>    )  }}export default DepartmentStatistics;
 |