kede-client/js/component/manageCenter/project/summary/projecDataStatistics.jsx

import React from 'react';
import {
  DatePicker,
  Tooltip,
  Button,
  AutoComplete,
  Input,
  Select,
  Spin,
  Table,
  message,
  Form,
  Tabs,
  Switch
} from 'antd';
import $ from 'jquery/src/ajax';
import moment from 'moment';
import { ShowModal, getApprovedState, getWhether, getLiquidationStatus } from "@/tools.js";
import { projectStatusList, salesList } from "@/dataDic";
import { citySelect } from "../../../NewDicProvinceList";
import ShowModalDiv from "@/showModal.jsx";
import { ChooseList } from "../../order/orderNew/chooseList";
import StaffSearch from '../../../../component/common/staffSearch';
import Cascaders from "../../../common/cascaders";

import './index.less';

const TabPane = Tabs.TabPane;
const { RangePicker, MonthPicker } = DatePicker;

const ProjecDataStatistics = Form.create()(React.createClass({

  getInitialState() {
    return {
      searchValues: {},
      loading: false,
      exportPendingLoading: false,
      changeList: undefined,
      dataSource: [],
      pagination: {
        defaultCurrent: 1,
        defaultPageSize: 10,
        showQuickJumper: true,
        pageSize: 10,
        onChange: function (page) {
          this.loadData(page);
        }.bind(this),
        showTotal: function (total) {
          return '共' + total + '条数据';
        }
      },
      columns: [
        {
          title: "销售类型",
          dataIndex: "salesType",
          key: "salesType",
          render: (text, record) => {
            const obj = {
              children: <Tooltip title={salesList[text] + ((text == 3 || text == 4 || text == 5) ? (!record.other ? "" : "，" + record.other) : "")}>
                <span>
                  {salesList[text]}
                </span>
              </Tooltip>,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          },
        },
        {
          title: "订单类型",
          dataIndex: "serviceType",
          key: "serviceType",
          render: (text, record) => {
            const obj = {
              children: <div style={{ maxWidth: 200 }}>{text}</div>,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "结算状态",
          dataIndex: "liquidationStatus",
          key: "liquidationStatus",
          render: (text, record) => {
            const obj = {
              children: getLiquidationStatus(text),
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "催款节点",
          dataIndex: "dunNodeContent",
          key: "dunNodeContent",
          render: (text, record) => {
            const obj = {
              children: <div style={{ maxWidth: 200 }}>{text}</div>,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: '是否会员',
          dataIndex: 'projectType',
          key: 'projectType',
          render: (text, record) => {
            const obj = {
              children: getWhether(text),
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: '是否大客户',
          dataIndex: 'bigCustomer',
          key: 'bigCustomer',
          render: (text, record) => {
            const obj = {
              children: getWhether(text),
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "是否特批",
          dataIndex: "approval",
          key: "approval",
          render: (text, record) => {
            const obj = {
              children: getApprovedState(text),
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: '签单时间',
          dataIndex: 'signTime',
          key: 'signTime',
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "派单时间",
          dataIndex: "createTime",
          key: "createTime",
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: '公司名称',
          dataIndex: 'buyerName',
          key: 'buyerName',
          render: (text, record) => {
            const obj = {
              children: <Tooltip title={text}>
                <div style={{ maxWidth: 200 }}>{text}</div>
              </Tooltip>,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "合同编号",
          dataIndex: "contractNo",
          key: "contractNo",
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: '合同类型',
          dataIndex: 'htlx',
          key: 'htlx',
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: '省份',
          dataIndex: 'province',
          key: 'province',
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "派单公司",
          dataIndex: "depName",
          key: "depName",
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: '签单金额',
          dataIndex: 'totalAmount',
          key: 'totalAmount',
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: '合同收款比例',
          dataIndex: 'contractAmountProportion',
          key: 'contractAmountProportion',
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: '应收款',
          dataIndex: 'orderReceivables',
          key: 'orderReceivables',
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: '已收款',
          dataIndex: 'settlementAmount',
          key: 'settlementAmount',
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "欠款",
          dataIndex: "arrearsAmount",
          key: "arrearsAmount",
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "已报销",
          dataIndex: "expenseAmount",
          key: "expenseAmount",
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "应公出/已公出/超出",
          dataIndex: "shouldPublic",
          key: "shouldPublic",
          render: (text, record) => {
            const obj = {
              children: <span>
                {text + " / " + record.alreadyPublic + " / " + record.exceedPublic}
              </span>,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "总成本/实付",
          dataIndex: "costAmount",
          key: "costAmount",
          render: (text, record) => {
            const obj = {
              children: <span>
                {text + " / " + record.paymentAmount}
              </span>,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "已开票金额",
          dataIndex: "invicueAmount",
          key: "invicueAmount",
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "退款金额",
          dataIndex: "refundAmount",
          key: "refundAmount",
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "财务负责人",
          dataIndex: "financeName",
          key: "financeName",
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "营销负责人",
          dataIndex: "salesmanName",
          key: "salesmanName",
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "项目名称",
          dataIndex: "commodityName",
          key: "commodityName",
          render: (text, record) => {
            return (
              <div style={{ maxWidth: 200 }}>
                {text}
                {!!record.serviceLife && <span>{"-" + record.serviceLife}</span>}
                {!!record.yearSum && <span>{"，共" + record.yearSum + "年"}</span>}
                {!!record.serviceYear && <span>{"，本次" + record.serviceYear}</span>}
              </div>
            )
          }
        },
        {
          title: "项目转入时间",
          dataIndex: "taskDistributionTime",
          key: "taskDistributionTime",
        },
        {
          title: "是否重报",
          dataIndex: "restatementType",
          key: "restatementType",
        },
        {
          title: "是否科技项目",
          dataIndex: "sortType",
          key: "sortType",
        },
        {
          title: "项目数",
          dataIndex: "commodityQuantity",
          key: "commodityQuantity",
        },
        {
          title: "项目成本",
          dataIndex: "projectCostAmount",
          key: "projectCostAmount",
        },
        {
          title: "项目状态",
          dataIndex: "projectStatus",
          key: "projectStatus",
        },
        {
          title: "项目启动时间",
          dataIndex: "taskStartTime",
          key: "taskStartTime",
        },
        {
          title: "项目完成时间",
          dataIndex: "taskEndTime",
          key: "taskEndTime",
        },
        // {
        //   title: "技术组",
        //   dataIndex: "expenseAmount",
        //   key: "expenseAmount",
        // },
        {
          title: "项目负责人",
          dataIndex: "receiverName",
          key: "receiverName",
        },
        {
          title: "满意度",
          dataIndex: "satisfactionDegree",
          key: "satisfactionDegree",
          render: text => {
            return (
              <span>{["非常满意", "满意", "一般", "不满意"][text]}</span>
            )
          }
        },
        {
          title: "项目备注",
          dataIndex: "taskComment",
          key: "taskComment",
          render: text => {
            return (
              <div style={{ maxWidth: 220 }}>{text}</div>
            )
          }
        },
        {
          title: "核算比例",
          dataIndex: "hsbl",
          key: "hsbl",
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "订单情况",
          dataIndex: "orderStatus",
          key: "orderStatus",
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "变更情况",
          dataIndex: "changeType",
          key: "changeType",
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
        {
          title: "退单退款",
          dataIndex: "refundType",
          key: "refundType",
          render: (text, record) => {
            const obj = {
              children: text,
              props: {
                rowSpan: record.rowSpan || 0
              }
            }
            return obj
          }
        },
      ],
      dataSource: [],
      departmentArr: [],
      searchMore: false,
    };
  },

  componentWillMount() {
    this.departmentList();
    this.selectSuperId();
    this.loadData();
  },

  loadData(pageNo) {
    const { searchValues, pagination } = this.state;
    this.setState({
      loading: true,
    });
    let datas = Object.assign(searchValues, {
      pageNo: pageNo || 1,
      pageSize: pagination.pageSize,
    });
    $.ajax({
      method: "get",
      dataType: "json",
      crossDomain: false,
      url: globalConfig.context + "/api/admin/statistis/orderProject",
      data: datas,
      success: function (data) {
        ShowModal(this);
        this.setState({
          loading: false,
        });
        if (data.error && data.error.length === 0) {
          if (data.data.list) {
            pagination.current = data.data.pageNo;
            pagination.total = data.data.totalCount;
            if (data.data && data.data.list && !data.data.list.length) {
              pagination.current = 0;
              pagination.total = 0;
            }
            let dList = this.handleData(data.data.list, "contractNo")
            this.setState({
              dataSource: dList,
              pagination: this.state.pagination,
              pageNo: data.data.pageNo,
            });
          } else {
            this.setState({
              dataSource: data.data,
              pagination: false,
            });
          }
        } else {
          message.warning(data.error[0].message);
        }
      }.bind(this),
    }).always(
      function () {
        this.setState({
          loading: false,
        });
      }.bind(this)
    );
  },

  // 部门
  departmentList() {
    this.setState({
      loading: true,
    });
    $.ajax({
      method: "get",
      dataType: "json",
      crossDomain: false,
      url: globalConfig.context + "/api/admin/organization/selectSuperId",
      data: {},
      success: function (data) {
        let thedata = data.data;
        let theArr = [];
        if (!thedata) {
          if (data.error && data.error.length) {
            message.warning(data.error[0].message);
          }
          thedata = {};
        } else {
          thedata.map(function (item, index) {
            theArr.push({
              key: index,
              name: item.name,
              id: item.id,
            });
          });
        }
        this.setState({
          departmentArr: theArr,
        });
      }.bind(this),
    }).always(
      function () {
        this.setState({
          loading: false,
        });
      }.bind(this)
    );
  },

  // 项目类别
  selectSuperId() {
    $.ajax({
      method: "get",
      dataType: "json",
      crossDomain: false,
      url: globalConfig.context + "/api/admin/ProjectSize/getAllCname",
      data: {
        flag: 0
      },
      success: function (data) {
        let theArr = [];
        let thedata = data.data;
        if (!thedata) {
          if (data.error && data.error.length) {
            message.warning(data.error[0].message);
          }
        }
        for (let i = 0; i < data.data.length; i++) {
          let theData = data.data[i];
          theArr.push(
            <Select.Option value={theData.id} key={theData.cname}>
              {theData.cname}
            </Select.Option>
          );
        }
        this.setState({
          contactsOption: theArr,
          contactsOptionData: data.data,
        });
      }.bind(this)
    }).always(

    );
  },

  changeList(arr) {
    const newArr = [];
    let list = this.state.columns
    list.forEach((item) => {
      arr.forEach((val) => {
        if (val === item.title) {
          newArr.push(item);
        }
      });
    });
    this.setState({
      changeList: newArr,
    });
  },

  exportAll() {
    message.config({
      duration: 20,
    });
    let loading = message.loading("下载中...");
    this.setState({
      exportPendingLoading: true,
    });
    let data = JSON.parse(JSON.stringify(this.state.searchValues));
    $.ajax({
      method: "get",
      dataType: "json",
      crossDomain: false,
      url: "/api/admin/statistis/orderProject/export",
      data,
      success: function (data) {
        if (data.error.length === 0) {
          this.download(data.data);
        } else {
          message.warning(data.error[0].message);
        }
      }.bind(this),
    }).always(
      function () {
        loading();
        this.setState({
          exportPendingLoading: false,
        });
      }.bind(this)
    );
  },

  download(fileName) {
    window.location.href =
      globalConfig.context + "/open/download?fileName=" + fileName;
  },

  handleData(array, key) {
    if (array.length === 0) return
    let arr = [...array]
    let startItem = arr[0]
    startItem.rowSpan = 1
    arr.forEach((item, index) => {
      let nextItem = arr[index + 1] || {}
      if (item[key] === nextItem[key]) {
        startItem.rowSpan++
      } else {
        startItem = nextItem
        startItem.rowSpan = 1
      }
    })
    return arr
  },

  search() {
    this.loadData();
  },

  reset() {
    this.setState({
      financeName: "",
      salesmanName: "",
      techName: "",
      searchValues: JSON.parse(JSON.stringify({})),
    }, () => {
      // this.Cascaders1.empty();
      // this.Cascaders2.empty();
      this.StaffSearch1.httpChange("");
      this.StaffSearch2.httpChange("");
      this.StaffSearch3.httpChange("");
      this.loadData();
    })
  },

  render() {
    const { searchValues } = this.state
    let departmentArr = this.state.departmentArr || [];
    const getRowClassName = (record, index) => {
      // 根据某些条件返回不同的类名
      if (index % 10 + 1 === 1) {
        return 'even-row1';
      } else if (index % 10 + 1 === 2) {
        return 'even-row2';
      } else if (index % 10 + 1 === 3) {
        return 'even-row3';
      } else if (index % 10 + 1 === 4) {
        return 'even-row4';
      } else if (index % 10 + 1 === 5) {
        return 'even-row5';
      } else if (index % 10 + 1 === 6) {
        return 'even-row6';
      } else if (index % 10 + 1 === 7) {
        return 'even-row7';
      } else if (index % 10 + 1 === 8) {
        return 'even-row8';
      } else if (index % 10 + 1 === 9) {
        return 'even-row9';
      } else if (index % 10 + 1 === 10) {
        return 'even-row10';
      }
    };
    return (
      <div className="user-content">
        <ShowModalDiv ShowModal={this.state.showModal} onClose={() => { this.setState({ showModal: false }) }} />
        <div className="content-title" style={{ marginBottom: 10 }}>
          <span style={{ fontWeight: 900, fontSize: 16 }}>项目数据统计</span>
        </div>
        <div className="user-search">
          <Tabs
            defaultActiveKey="1"
            className="test">
            <TabPane tab="搜索" key="1">
              <div
                className="user-search"
                style={{
                  marginTop: "10px",
                  marginLeft: "10px",
                  marginRight: "10px",
                }}
              >
                <Input
                  placeholder="订单编号"
                  style={{
                    width: 220,
                    marginRight: "10px",
                  }}
                  value={searchValues["orderNo"]
                    ? searchValues["orderNo"]
                    : ""}
                  onChange={(e) => {
                    searchValues["orderNo"] = e.target.value;
                    this.setState({
                      searchValues: searchValues,
                    });
                  }}
                />
                <Input
                  placeholder="合同编号"
                  style={{
                    width: 220,
                    marginRight: "10px",
                  }}
                  value={searchValues["contractNo"]
                    ? searchValues["contractNo"]
                    : ""}
                  onChange={(e) => {
                    searchValues["contractNo"] = e.target.value;
                    this.setState({
                      searchValues: searchValues,
                    });
                  }}
                />
                <Input
                  placeholder="企业名称"
                  style={{
                    width: 220,
                    marginRight: "10px",
                  }}
                  value={searchValues["userName"]
                    ? searchValues["userName"]
                    : ""}
                  onChange={(e) => {
                    searchValues["userName"] = e.target.value;
                    this.setState({
                      searchValues: searchValues,
                    });
                  }}
                />
                <Select
                  placeholder="项目分类"
                  style={{ width: 220 }}
                  value={searchValues["businessCategory"]
                    ? searchValues["businessCategory"]
                    : undefined}
                  onChange={(e) => {
                    searchValues["businessCategory"] = e;
                    this.setState({
                      searchValues: searchValues,
                    });
                  }}
                >
                  {this.state.contactsOption}
                </Select>
                <Input
                  placeholder="项目名称"
                  value={searchValues["projectName"]
                    ? searchValues["projectName"]
                    : ""}
                  style={{ width: 220, marginRight: 10 }}
                  onChange={e => {
                    searchValues["projectName"] = e.target.value
                    this.setState({
                      searchValues: searchValues,
                    });
                  }}
                />

                <span style={{ display: !this.state.searchMore && "none" }}>
                  <span
                    style={{
                      display: "inline-block",
                    }}
                  >
                    <span style={{ marginBottom: "10px" }}>订单部门：</span>
                    <Select
                      placeholder="选择订单部门"
                      style={{ width: 170, }}
                      value={searchValues["depId"]
                        ? searchValues["depId"]
                        : undefined}
                      onChange={(e) => {
                        searchValues["depId"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      {departmentArr.map(function (item) {
                        return (
                          <Select.Option key={item.id}>{item.name}</Select.Option>
                        );
                      })}
                    </Select>
                    {/* <Cascaders
                  ref={ref => this.Cascaders1 = ref}
                  placeholder="请选择订单部门"
                  height={28}
                  width={170}
                  onSel={(e) => {
                    searchValues["deps"] = JSON.stringify(e)
                    this.setState({
                      searchValues: searchValues,
                    });
                  }}
                /> */}
                  </span>
                  <span
                    style={{
                      display: "inline-block",
                    }}
                  >
                    <span style={{ marginBottom: "10px" }}>负责部门：</span>
                    <Select
                      placeholder="选择负责部门"
                      style={{ width: 170, }}
                      value={searchValues["liabilitiesDepId"]
                        ? searchValues["liabilitiesDepId"]
                        : undefined}
                      onChange={(e) => {
                        searchValues["liabilitiesDepId"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      {departmentArr.map(function (item) {
                        return (
                          <Select.Option key={item.id}>{item.name}</Select.Option>
                        );
                      })}
                    </Select>
                    {/* <Cascaders
                  ref={ref => this.Cascaders2 = ref}
                  placeholder="请选择负责部门"
                  height={28}
                  width={170}
                  onSel={(e) => {
                    searchValues["thchDeps"] = JSON.stringify(e)
                    this.setState({
                      searchValues: searchValues,
                    });
                  }}
                /> */}
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px", marginBottom: "10px" }}>
                      申报批次:
                    </span>
                    <Select
                      value={searchValues["declarationBatch"]
                        ? searchValues["declarationBatch"]
                        : undefined}
                      placeholder="请选择批次"
                      style={{
                        width: 150,
                        marginRight: "10px",
                      }}
                      onChange={(e) => {
                        searchValues["declarationBatch"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      <Option value={1}>第一批</Option>
                      <Option value={2}>第二批</Option>
                      <Option value={3}>第三批</Option>
                      <Option value={4}>第四批</Option>
                    </Select>
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      项目金额:
                    </span>
                    <Select
                      value={searchValues["projectAmountType"]
                        ? searchValues["projectAmountType"]
                        : undefined}
                      placeholder="请选择项目金额"
                      style={{
                        width: 150,
                        marginRight: "10px",
                      }}
                      onChange={(e) => {
                        searchValues["projectAmountType"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      <Option value={1}>1万以下</Option>
                      <Option value={2}>1~5万</Option>
                      <Option value={3}>5~10万</Option>
                      <Option value={4}>10~20万</Option>
                      <Option value={5}>20万以上</Option>
                    </Select>
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      项目状态:
                    </span>
                    <Select
                      value={(searchValues["projectStatus"] || searchValues["projectStatus"] == 0)
                        ? searchValues["projectStatus"]
                        : undefined}
                      placeholder="请选择项目状态"
                      style={{
                        width: 150,
                        marginRight: "10px",
                      }}
                      onChange={(e) => {
                        searchValues["projectStatus"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      {
                        projectStatusList.map((item) =>
                          <Option value={item.value} key={item.value}>{item.label}</Option>
                        )
                      }
                    </Select>
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      满&nbsp;&nbsp;意&nbsp;&nbsp;度:
                    </span>
                    <Select
                      value={searchValues["satisfactionDegree"]
                        ? searchValues["satisfactionDegree"]
                        : undefined}
                      placeholder="请选择满意度"
                      style={{
                        width: 150,
                        marginRight: "10px",
                      }}
                      onChange={(e) => {
                        searchValues["satisfactionDegree"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      <Option value="0">非常满意</Option>
                      <Option value="1">满意</Option>
                      <Option value="2">一般</Option>
                      <Option value="3">不满意</Option>
                    </Select>
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      派单时间:
                    </span>
                    <RangePicker
                      allowClear={false}
                      style={{ marginRight: "10px", width: 250 }}
                      value={[
                        searchValues["startDate"]
                          ? moment(searchValues["startDate"])
                          : null,
                        searchValues["endDate"]
                          ? moment(searchValues["endDate"])
                          : null,
                      ]}
                      onChange={(data, dataString) => {
                        searchValues["startDate"] = String(
                          dataString[0]
                        );
                        searchValues["endDate"] = String(
                          dataString[1]
                        );
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    />
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      项目转入时间:
                    </span>
                    <RangePicker
                      allowClear={false}
                      style={{ marginRight: "10px", width: 250 }}
                      value={[
                        searchValues["projectStartDate"]
                          ? moment(searchValues["projectStartDate"])
                          : null,
                        searchValues["projectEndDate"]
                          ? moment(searchValues["projectEndDate"])
                          : null,
                      ]}
                      onChange={(data, dataString) => {
                        searchValues["projectStartDate"] = String(
                          dataString[0]
                        );
                        searchValues["projectEndDate"] = String(
                          dataString[1]
                        );
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    />
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      销售类型:
                    </span>
                    <Select
                      value={searchValues["salesType"]
                        ? searchValues["salesType"]
                        : undefined}
                      placeholder="请选择销售类型"
                      style={{
                        width: 150,
                        marginRight: "10px",
                      }}
                      onChange={(e) => {
                        searchValues["salesType"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      <Option value="0">电话新开发</Option>
                      <Option value="1">电话自带资源</Option>
                      <Option value="2">网络</Option>
                      <Option value="3">渠道</Option>
                      <Option value="4">转介绍</Option>
                      <Option value="5">其他</Option>
                      <Option value="6">高新复购</Option>
                      <Option value="7">其他复购</Option>
                      <Option value="8">私有/渠道</Option>
                    </Select>
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      订单类型:
                    </span>
                    <Input
                      placeholder="请输入订单类型"
                      style={{
                        width: 150,
                        marginRight: "10px",
                      }}
                      value={searchValues["serviceType"]
                        ? searchValues["serviceType"]
                        : ""}
                      onChange={(e) => {
                        searchValues["serviceType"] = e.target.value;
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    />
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      结算状态:
                    </span>
                    <Select
                      value={searchValues["liquidationStatus"]
                        ? searchValues["liquidationStatus"]
                        : undefined}
                      placeholder="请选择结算状态"
                      style={{
                        width: 150,
                        marginRight: "10px",
                      }}
                      onChange={(e) => {
                        searchValues["liquidationStatus"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      <Option value="0">首付待付请</Option>
                      <Option value="1">尾款待付清</Option>
                      <Option value="2">已付清</Option>
                      <Option value="3">部分退款</Option>
                      <Option value="4">全部退款</Option>
                    </Select>
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      催款节点:
                    </span>
                    <Select
                      placeholder={"催款节点"}
                      style={{ width: 150 }}
                      value={searchValues["dunType"]
                        ? searchValues["dunType"]
                        : undefined}
                      onChange={(e) => {
                        searchValues["dunType"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      <Option value="0">未启动</Option>
                      <Option value="1">已启动</Option>
                    </Select>
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      签单时间:
                    </span>
                    <RangePicker
                      allowClear={false}
                      style={{ marginRight: "10px", width: 250 }}
                      value={[
                        searchValues["signStartDate"]
                          ? moment(searchValues["signStartDate"])
                          : null,
                        searchValues["signEndDate"]
                          ? moment(searchValues["signEndDate"])
                          : null,
                      ]}
                      onChange={(data, dataString) => {
                        searchValues["signStartDate"] = String(
                          dataString[0]
                        );
                        searchValues["signEndDate"] = String(
                          dataString[1]
                        );
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    />
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      项目完成时间:
                    </span>
                    <RangePicker
                      allowClear={false}
                      style={{ marginRight: "10px", width: 250 }}
                      value={[
                        searchValues["projectCompleteStartTime"]
                          ? moment(searchValues["projectCompleteStartTime"])
                          : null,
                        searchValues["projectCompleteEndTime"]
                          ? moment(searchValues["projectCompleteEndTime"])
                          : null,
                      ]}
                      onChange={(data, dataString) => {
                        searchValues["projectCompleteStartTime"] = String(
                          dataString[0]
                        );
                        searchValues["projectCompleteEndTime"] = String(
                          dataString[1]
                        );
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    />
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      是否特批:
                    </span>
                    <Select
                      placeholder={"是否特批"}
                      style={{ width: 150 }}
                      value={searchValues["approval"]
                        ? searchValues["approval"]
                        : undefined}
                      onChange={(e) => {
                        searchValues["approval"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      <Option value="0">否</Option>
                      <Option value="1">是</Option>
                    </Select>
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      是否会员:
                    </span>
                    <Select
                      placeholder={"是否会员"}
                      style={{ width: 150 }}
                      value={searchValues["projectType"]
                        ? searchValues["projectType"]
                        : undefined}
                      onChange={(e) => {
                        searchValues["projectType"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      <Option value="0">否</Option>
                      <Option value="1">是</Option>
                    </Select>
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      是否重报:
                    </span>
                    <Select
                      placeholder={"是否重报"}
                      style={{ width: 150 }}
                      value={searchValues["restatement"]
                        ? searchValues["restatement"]
                        : undefined}
                      onChange={(e) => {
                        searchValues["restatement"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      <Option value="0">否</Option>
                      <Option value="1">是</Option>
                    </Select>
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      是否变更:
                    </span>
                    <Select
                      placeholder={"是否变更"}
                      style={{ width: 150 }}
                      value={searchValues["changeType"]
                        ? searchValues["changeType"]
                        : undefined}
                      onChange={(e) => {
                        searchValues["changeType"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      <Option value="0">否</Option>
                      <Option value="1">是</Option>
                    </Select>
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      是否退单:
                    </span>
                    <Select
                      placeholder={"是否退单"}
                      style={{ width: 150 }}
                      value={searchValues["refundType"]
                        ? searchValues["refundType"]
                        : undefined}
                      onChange={(e) => {
                        searchValues["refundType"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      <Option value="0">否</Option>
                      <Option value="1">是</Option>
                    </Select>
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      是否大客户:
                    </span>
                    <Select
                      placeholder={"是否大客户"}
                      style={{ width: 150 }}
                      value={searchValues["bigCustomer"]
                        ? searchValues["bigCustomer"]
                        : undefined}
                      onChange={(e) => {
                        searchValues["bigCustomer"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      <Option value="0">否</Option>
                      <Option value="1">是</Option>
                    </Select>
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      是否科技项目:
                    </span>
                    <Select
                      placeholder={"是否科技项目"}
                      style={{ width: 150 }}
                      value={searchValues["orderType"]
                        ? searchValues["orderType"]
                        : undefined}
                      onChange={(e) => {
                        searchValues["orderType"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      <Option value="0">否</Option>
                      <Option value="1">是</Option>
                    </Select>
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      省份选择:
                    </span>
                    <Select
                      placeholder="请选择省份"
                      style={{
                        width: 150,
                      }}
                      value={searchValues["province"]
                        ? searchValues["province"]
                        : undefined}
                      onChange={(e) => {
                        searchValues["province"] = e
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    >
                      {citySelect().map(function (item) {
                        return (
                          <Select.Option key={item.value} value={item.value}>
                            {item.label}
                          </Select.Option>
                        );
                      })}
                    </Select>
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      财务负责人:
                    </span>
                    <StaffSearch
                      ref={ref => this.StaffSearch1 = ref}
                      valueName={this.state.financeName}
                      placeholder="财务负责人"
                      width="150px"
                      onBlurText={e => {
                        this.setState({
                          financeName: e.title
                        })
                      }}
                      onBlurChange={(obj) => {
                        searchValues["financeId"] = obj.value
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    />
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      营销负责人:
                    </span>
                    <StaffSearch
                      ref={ref => this.StaffSearch2 = ref}
                      valueName={this.state.salesmanName}
                      placeholder="营销负责人"
                      width="150px"
                      onBlurText={e => {
                        this.setState({
                          salesmanName: e.title
                        })
                      }}
                      onBlurChange={(obj) => {
                        searchValues["salesmanId"] = obj.value
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    />
                  </span>
                  <span style={{ display: "inline-block" }}>
                    <span style={{ marginRight: "10px" }}>
                      技术负责人:
                    </span>
                    <StaffSearch
                      ref={ref => this.StaffSearch3 = ref}
                      valueName={this.state.techName}
                      placeholder="技术负责人"
                      width="150px"
                      onBlurText={e => {
                        this.setState({
                          techName: e.title
                        })
                      }}
                      onBlurChange={(obj) => {
                        searchValues["techId"] = obj.value
                        this.setState({
                          searchValues: searchValues,
                        });
                      }}
                    />
                  </span>
                </span>

                <Button type="primary" onClick={this.search} style={{ marginRight: 10 }}>
                  搜索
                </Button>
                <Button onClick={this.reset}>重置</Button>
                <span style={{ marginLeft: '10px', marginRight: '20px' }}>
                  更多搜索
                  <Switch
                    checked={this.state.searchMore}
                    onChange={() => {
                      this.setState({
                        searchMore: !this.state.searchMore
                      })
                    }}
                  />
                </span>
              </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>
            {adminData.isSuperAdmin ?
              <TabPane tab="导出EXCEL" key="3">
                <Button
                  type="primary"
                  loading={this.state.exportPendingLoading}
                  onClick={this.exportAll}
                  style={{ margin: 10 }}
                >
                  导出excel
                </Button>
              </TabPane>
              : ""}
          </Tabs>
        </div>
        <div className="patent-table">
          <Spin spinning={this.state.loading}>
            <Table
              columns={this.state.changeList
                ? this.state.changeList
                : this.state.columns}
              dataSource={this.state.dataSource}
              pagination={this.state.pagination}
              bordered
              // rowClassName={getRowClassName}
              scroll={{ x: 4000 }}
            />
          </Spin>
        </div>
      </div >
    );
  }
}));
export default ProjecDataStatistics;