import React, { Component } from "react";
import {
  message,
  Input,
  Select,
  Button,
  Spin,
  Table,
  Tabs,
  DatePicker,
  AutoComplete,
  Modal,
} from "antd";
import $ from "jquery/src/ajax";
import { ShowModal, } from '@/tools'
import { projectState, publishStatus } from '@/dataDic.js'
import moment from 'moment';
import ShowModalDiv from '@/showModal.jsx';
import './membershipTable.less'
import Progress from './progress'

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

class MembershipTable extends Component {
  constructor(props) {
    super(props);
    this.state = {
      visible: false,
      tid: '',
      searchValues: {
        roleStatus: adminData.isSuperAdmin ? '0' : '1'
      },
      loading: false,
      newData: [],
      columns: [
        {
          title: <div className="color0">序号</div>,
          dataIndex: 'xh',
          key: 'xh',
          width: 44,
          fixed: 'left',
          render: (text, record, index) => {
            return (
              <span>{index + 1}</span>
            )
          }
        },
        {
          title: <div className="color1">会员客户基本信息</div>,
          children: [
            {
              title: <div className="color1">派单信息</div>,
              children: [
                {
                  title: <div className="color1">客户名称</div>,
                  dataIndex: 'userName',
                  key: 'userName',
                  width: 140,
                },
                {
                  title: <div className="color3">合同编号</div>,
                  dataIndex: 'contractNo',
                  key: 'contractNo',
                  width: 110,
                },
                {
                  title: <div className="color1">服务内容</div>,
                  dataIndex: 'taskList',
                  key: 'taskList',
                  width: 140,
                  render: (text, record) => {
                    return (
                      <div>
                        {
                          !!text && text.map(item =>
                            <div key={item.id}>{item.taskName}</div>
                          )
                        }
                      </div>
                    )
                  }
                },
                {
                  title: <div className="color1">服务年份</div>,
                  dataIndex: 'serviceYear',
                  key: 'serviceYear',
                  width: 80,
                },
                {
                  title: <div className="color1">会员级别</div>,
                  dataIndex: 'memberLvl',
                  key: 'memberLvl',
                  width: 44,
                  render: (text, record) => {
                    return (
                      <div>{['', 'A', 'AA', 'AAA'][text]}</div>
                    )
                  }
                },
              ],
            },
            {
              title: <div className="color1">服务团队</div>,
              children: [
                {
                  title: <div className="color3">业务负责人</div>,
                  dataIndex: 'taskName',
                  key: 'taskName',
                  width: 80,
                },
                {
                  title: <div className="color3">项目负责人</div>,
                  dataIndex: 'projectName',
                  key: 'projectName',
                  width: 80,
                },
                {
                  title: <div className="color3">技术咨询师</div>,
                  dataIndex: 'technologyName',
                  key: 'technologyName',
                  width: 80,
                },
                {
                  title: <div className="color3">财税咨询师</div>,
                  dataIndex: 'financeTaxationName',
                  key: 'financeTaxationName',
                  width: 80,
                },
              ],
            },
            {
              title: <div className="color3">基础数据</div>,
              children: [
                {
                  title: <div className="color1">上上年度</div>,
                  children: [
                    {
                      title: <div className="color1">年份</div>,
                      dataIndex: 'beforeLastYear',
                      key: 'beforeLastYear',
                      width: 44,
                    },
                    {
                      title: <div className="color1">销售收入</div>,
                      dataIndex: 'beforeLastRdSalesAmount',
                      key: 'beforeLastRdSalesAmount',
                      width: 44,
                    },
                    {
                      title: <div className="color1">高新研发费用</div>,
                      dataIndex: 'beforeLastRdBudget',
                      key: 'beforeLastRdBudget',
                      width: 44,
                    }
                  ],
                },
                {
                  title: <div className="color1">上年度</div>,
                  children: [
                    {
                      title: <div className="color1">年份</div>,
                      dataIndex: 'lastYear',
                      key: 'lastYear',
                      width: 44,
                    },
                    {
                      title: <div className="color1">销售收入</div>,
                      dataIndex: 'lastRdSalesAmount',
                      key: 'lastRdSalesAmount',
                      width: 44,
                    },
                    {
                      title: <div className="color1">高新研发费用</div>,
                      dataIndex: 'lastRdBudget',
                      key: 'lastRdBudget',
                      width: 44,
                    }
                  ],
                },
                {
                  title: <div className="color1">本年度企业人员情况</div>,
                  children: [
                    {
                      title: <div className="color3">职工总数</div>,
                      dataIndex: 'workersNumber',
                      key: 'workersNumber',
                      width: 44,
                    },
                    {
                      title: <div className="color3">科技人员</div>,
                      dataIndex: 'technologyNumber',
                      key: 'technologyNumber',
                      width: 44,
                    },
                    {
                      title: <div className="color1">占比</div>,
                      dataIndex: 'workersRate',
                      key: 'workersRate',
                      width: 60,
                      render: (text, record) => {
                        return (
                          <span>{text || 0}%</span>
                        )
                      }
                    }
                  ],
                },
              ],
            }
          ],
        },
        {
          title: <div className="color2">&nbsp;</div>,
          children: [
            {
              title: <div className="color2">&nbsp;</div>,
              children: [
                {
                  title: <div className="color2">科研立项与研发投入</div>,
                  children: [
                    {
                      title: <div className="color3">研发立项数量</div>,
                      dataIndex: 'projectApprovalNumber',
                      key: 'projectApprovalNumber',
                      width: 44,
                    },
                    {
                      title: <div className="color3">年度研发预算总额</div>,
                      dataIndex: 'rdBudget',
                      key: 'rdBudget',
                      width: 44,
                    },
                    {
                      title: <div className="color3">年度销售收入预计</div>,
                      dataIndex: 'rdSalesAmount',
                      key: 'rdSalesAmount',
                      width: 44,
                    },
                    {
                      title: <div className="color3">本年度研发费用预算占比</div>,
                      dataIndex: 'rdBudgetRate',
                      key: 'rdBudgetRate',
                      width: 60,
                      render: (text, record) => {
                        return (
                          <span>{text || 0}%</span>
                        )
                      }
                    },
                    {
                      title: <div className="color3">三年研发费用占比预估</div>,
                      dataIndex: 'threeYearsRdBudgetRate',
                      key: 'threeYearsRdBudgetRate',
                      width: 60,
                      render: (text, record) => {
                        return (
                          <span>{text || 0}%</span>
                        )
                      }
                    },
                  ]
                },
                {
                  title: <div className="color2">实时实际情况</div>,
                  children: [
                    {
                      title: <div className="color3">数据周期</div>,
                      dataIndex: 'dataCycle',
                      key: 'dataCycle',
                      width: 70,
                      render: (text, record) => {
                        return (
                          <span>{['第1季度', '上半年', '前3季度', '全年'][text]}</span>
                        )
                      }
                    },
                    {
                      title: <div className="color3">已立项RD数量</div>,
                      dataIndex: 'actualRdNumber',
                      key: 'actualRdNumber',
                      width: 44,
                    },
                    {
                      title: <div className="color3">委外项目数量</div>,
                      dataIndex: 'actualOutsourcingNumber',
                      key: 'actualOutsourcingNumber',
                      width: 44,
                    },
                    {
                      title: <div className="color3">合作项目数量</div>,
                      dataIndex: 'actualCooperateNumber',
                      key: 'actualCooperateNumber',
                      width: 44,
                    },
                    {
                      title: <div className="color3">已归集研发费用总额</div>,
                      dataIndex: 'actualRdAmount',
                      key: 'actualRdAmount',
                      width: 44,
                    },
                    {
                      title: <div className="color3">研发预算完成度</div>,
                      dataIndex: 'rdCompletionProgress',
                      key: 'rdCompletionProgress',
                      width: 44,
                    },
                    {
                      title: <div className="color3">年度实际销售收入</div>,
                      dataIndex: 'actualSalesAmount',
                      key: 'actualSalesAmount',
                      width: 44,
                    },
                    {
                      title: <div className="color3">本年度研发费用占比</div>,
                      dataIndex: 'actualRdRate',
                      key: 'actualRdRate',
                      width: 60,
                      render: (text, record) => {
                        return (
                          <span>{text || 0}%</span>
                        )
                      }
                    },
                    {
                      title: <div className="color3">三年研发费用占比</div>,
                      dataIndex: 'threeYearsActualRdRate',
                      key: 'threeYearsActualRdRate',
                      width: 60,
                      render: (text, record) => {
                        return (
                          <span>{text || 0}%</span>
                        )
                      }
                    },
                  ]
                },
              ]
            },
            {
              title: <div className="color2">报表报送</div>,
              children: [
                {
                  title: <div className="color2">火炬统计</div>,
                  dataIndex: 'torchStatus',
                  key: 'torchStatus',
                  width: 60,
                  render: (text, record) => {
                    return (
                      <span>{this.getTypeData(text, record.torchOther)}</span>
                    )
                  }
                },
                {
                  title: <div className="color2">统计年报</div>,
                  dataIndex: 'statisticsStatus',
                  key: 'statisticsStatus',
                  width: 60,
                  render: (text, record) => {
                    return (
                      <span>{this.getTypeData(text, record.statisticsOther)}</span>
                    )
                  }
                },
                {
                  title: <div className="color2">高企年报</div>,
                  dataIndex: 'chStatus',
                  key: 'chStatus',
                  width: 60,
                  render: (text, record) => {
                    return (
                      <span>{this.getTypeData(text, record.chOther)}</span>
                    )
                  }
                },
                {
                  title: <div className="color2">汇算清缴</div>,
                  children: [
                    {
                      title: <div className="color2">是否完成</div>,
                      dataIndex: 'finalSettlementStatus',
                      key: 'finalSettlementStatus',
                      width: 60,
                      render: (text, record) => {
                        return (
                          <span>{this.getTypeData(text, record.finalSettlementOther)}</span>
                        )
                      }
                    },
                    {
                      title: <div className="color3">加扣RD数量</div>,
                      dataIndex: 'reportFormsRdNumber',
                      key: 'reportFormsRdNumber',
                      width: 44,
                    },
                    {
                      title: <div className="color3">知识产权加扣费用</div>,
                      dataIndex: 'intellectualPropertyAmount',
                      key: 'intellectualPropertyAmount',
                      width: 44,
                    },
                    {
                      title: <div className="color3">加扣研发费用金额</div>,
                      dataIndex: 'reportRdAmount',
                      key: 'reportRdAmount',
                      width: 44,
                    },
                  ]
                },
              ]
            },
            {
              title: <div className="color2">研发奖补</div>,
              children: [
                {
                  title: <div className="color2">研发准备金备案</div>,
                  dataIndex: 'rdReservesStatus',
                  key: 'rdReservesStatus',
                  width: 60,
                  render: (text, record) => {
                    return (
                      <span>{this.getTypeData(text, record.rdReservesOther)}</span>
                    )
                  }
                },
                {
                  title: <div className="color2">研发奖补申请</div>,
                  children: [
                    {
                      title: <div className="color2">是否完成</div>,
                      dataIndex: 'rdAwardCompensationStatus',
                      key: 'rdAwardCompensationStatus',
                      width: 60,
                      render: (text, record) => {
                        return (
                          <span>{this.getTypeData(text, record.rdAwardCompensationOther)}</span>
                        )
                      }
                    },
                    {
                      title: <div className="color3">申请金额</div>,
                      dataIndex: 'rdApplicationFee',
                      key: 'rdApplicationFee',
                      width: 44,
                    },
                    {
                      title: <div className="color3">公示金额</div>,
                      dataIndex: 'rdAnnouncementAmount',
                      key: 'rdAnnouncementAmount',
                      width: 44,
                    },
                    {
                      title: <div className="color3">其他</div>,
                      dataIndex: 'rdAnnouncementOther',
                      key: 'rdAnnouncementOther',
                      width: 44,
                    },
                  ]
                },
              ]
            },
            {
              title: <div className="color3">备查交付与归档</div>,
              children: [
                {
                  title: <div className="color2">加扣备查交付</div>,
                  dataIndex: 'adDeliverStatus',
                  key: 'adDeliverStatus',
                  width: 60,
                  render: (text, record) => {
                    return (
                      <span>{this.getTypeData(text, record.adDeliverOther)}</span>
                    )
                  }
                },
                {
                  title: <div className="color2">加扣是否归档</div>,
                  dataIndex: 'adDeliverFinish',
                  key: 'adDeliverFinish',
                  width: 60,
                  render: (text, record) => {
                    return (
                      <span>{['未归档', '已归档'][text]}</span>
                    )
                  }
                },
                {
                  title: <div className="color2">高新备查交付</div>,
                  dataIndex: 'htDeliverStatus',
                  key: 'htDeliverStatus',
                  width: 60,
                  render: (text, record) => {
                    return (
                      <span>{this.getTypeData(text, record.htDeliverOther)}</span>
                    )
                  }
                },
                {
                  title: <div className="color2">高新是否归档</div>,
                  dataIndex: 'htDeliverFinish',
                  key: 'htDeliverFinish',
                  width: 60,
                  render: (text, record) => {
                    return (
                      <span>{['未归档', '已归档'][text]}</span>
                    )
                  }
                },
              ]
            },
            {
              title: <div className="color2">日常工作</div>,
              children: [
                {
                  title: <div className="color3">召开上年度总结及本年工作计划会议</div>,
                  dataIndex: 'closeMeetingStatus',
                  key: 'closeMeetingStatus',
                  width: 60,
                  render: (text, record) => {
                    return (
                      <span>{this.getTypeData(text, record.closeMeetingOther)}</span>
                    )
                  }
                },
                {
                  title: <div className="color3">阶段性汇报</div>,
                  dataIndex: 'phasedType',
                  key: 'phasedType',
                  width: 44,
                  render: (text, record) => {
                    return (
                      <span>{['', '月度', '季度'][text]}</span>
                    )
                  }
                },
                {
                  title: <div className="color2">立项资料编制</div>,
                  children: [
                    {
                      title: <div className="color2">完成数量</div>,
                      dataIndex: 'projectApprovalWriteNumber',
                      key: 'projectApprovalWriteNumber',
                      width: 44,
                    },
                    {
                      title: <div className="color2">完成率</div>,
                      dataIndex: 'projectApprovalWriteRate',
                      key: 'projectApprovalWriteRate',
                      width: 60,
                      render: (text, record) => {
                        return (
                          <span>{text || 0}%</span>
                        )
                      }
                    },
                  ]
                },
                {
                  title: <div className="color2">加扣预申报</div>,
                  children: [
                    {
                      title: <div className="color2">7月</div>,
                      dataIndex: 'adPrepareJulyStatus',
                      key: 'adPrepareJulyStatus',
                      width: 60,
                      render: (text, record) => {
                        return (
                          <span>{this.getTypeData(text, record.adPrepareJulyOther)}</span>
                        )
                      }
                    },
                    {
                      title: <div className="color2">10月</div>,
                      dataIndex: 'adPrepareOctoberStatus',
                      key: 'adPrepareOctoberStatus',
                      width: 60,
                      render: (text, record) => {
                        return (
                          <span>{this.getTypeData(text, record.adPrepareOctoberOther)}</span>
                        )
                      }
                    },
                  ]
                },
                {
                  title: <div className="color2">知识产权情况</div>,
                  children: [
                    {
                      title: <div className="color3">发明专利</div>,
                      children: [
                        {
                          title: <div className="color3">当年申报数量</div>,
                          dataIndex: 'ipInventionPatentDeclare',
                          key: 'ipInventionPatentDeclare',
                          width: 80,
                        },
                        {
                          title: <div className="color3">当年授权数量</div>,
                          dataIndex: 'ipInventionPatentAuthorize',
                          key: 'ipInventionPatentAuthorize',
                          width: 80,
                        },
                        {
                          title: <div className="color3">企业累计授权数量</div>,
                          dataIndex: 'ipInventionPatentAuthorizeCount',
                          key: 'ipInventionPatentAuthorizeCount',
                          width: 80,
                        },
                      ]
                    },
                    {
                      title: <div className="color3">实用新型专利</div>,
                      children: [
                        {
                          title: <div className="color3">当年申报数量</div>,
                          dataIndex: 'ipUtilityModelDeclare',
                          key: 'ipUtilityModelDeclare',
                          width: 80,
                        },
                        {
                          title: <div className="color3">当年授权数量</div>,
                          dataIndex: 'ipUtilityModelAuthorize',
                          key: 'ipUtilityModelAuthorize',
                          width: 80,
                        },
                        {
                          title: <div className="color3">企业累计授权数量</div>,
                          dataIndex: 'ipUtilityModelAuthorizeCount',
                          key: 'ipUtilityModelAuthorizeCount',
                          width: 80,
                        },
                      ]
                    },
                    {
                      title: <div className="color3">软著</div>,
                      children: [
                        {
                          title: <div className="color3">当年申报数量</div>,
                          dataIndex: 'ipSoftwareWorksDeclare',
                          key: 'ipSoftwareWorksDeclare',
                          width: 80,
                        },
                        {
                          title: <div className="color3">当年授权数量</div>,
                          dataIndex: 'ipSoftwareWorksAuthorize',
                          key: 'ipSoftwareWorksAuthorize',
                          width: 80,
                        },
                        {
                          title: <div className="color3">企业累计授权数量</div>,
                          dataIndex: 'ipSoftwareWorksAuthorizeCount',
                          key: 'ipSoftwareWorksAuthorizeCount',
                          width: 80,
                        },
                        {
                          title: <div className="color3">本年可用高新数</div>,
                          dataIndex: 'ipHt',
                          key: 'ipHt',
                          width: 80,
                        },
                        {
                          title: <div className="color3">I类数量</div>,
                          dataIndex: 'ipHtI',
                          key: 'ipHtI',
                          width: 44,
                        },
                        {
                          title: <div className="color3">II类数量</div>,
                          dataIndex: 'ipHtIi',
                          key: 'ipHtIi',
                          width: 44,
                        },
                      ]
                    },
                  ]
                },
                {
                  title: <div className="color2">公出指标（本年度）</div>,
                  children: [
                    {
                      title: <div className="color2">合同约定次数</div>,
                      dataIndex: 'publicReleaseStipulation',
                      key: 'publicReleaseStipulation',
                      width: 44,
                    },
                    {
                      title: <div className="color2">实际次数</div>,
                      dataIndex: 'publicReleaseActual',
                      key: 'publicReleaseActual',
                      width: 44,
                    },
                  ]
                },
                {
                  title: <div className="color2">培训指标（本年度）</div>,
                  children: [
                    {
                      title: <div className="color2">合同约定次数</div>,
                      dataIndex: 'trainingStipulation',
                      key: 'trainingStipulation',
                      width: 44,
                    },
                    {
                      title: <div className="color2">实际次数</div>,
                      dataIndex: 'trainingActual',
                      key: 'trainingActual',
                      width: 44,
                    },
                    {
                      title: <div className="color2">其他</div>,
                      dataIndex: 'trainingOther',
                      key: 'trainingOther',
                      width: 44,
                    },
                  ]
                },
              ]
            },
            {
              title: <div className="color2">特色工作</div>,
              children: [
                {
                  title: <div className="color2">检查</div>,
                  children: [
                    {
                      title: <div className="color2">高新技术税收优惠政策检查</div>,
                      dataIndex: 'featureHt',
                      key: 'featureHt',
                      width: 80,
                    },
                    {
                      title: <div className="color2">加计扣除税收优惠政策检查</div>,
                      dataIndex: 'featureAd',
                      key: 'featureAd',
                      width: 80,
                    },
                    {
                      title: <div className="color2">税务常规检查</div>,
                      dataIndex: 'featureTr',
                      key: 'featureTr',
                      width: 80,
                    },
                    {
                      title: <div className="color2">税务对研发费用检查</div>,
                      dataIndex: 'featureTe',
                      key: 'featureTe',
                      width: 80,
                    },
                    {
                      title: <div className="color2">税务稽查</div>,
                      dataIndex: 'featureTi',
                      key: 'featureTi',
                      width: 80,
                    }
                  ]
                },
                {
                  title: <div className="color2">其他</div>,
                  children: [
                    {
                      title: <div className="color2">其他</div>,
                      dataIndex: 'featureOther',
                      key: 'featureOther',
                      width: 44,
                    }
                  ]
                },
              ]
            },
            {
              title: <div className="color2">其他事项说明</div>,
              dataIndex: 'other',
              key: 'other',
              width: 90,
            },
          ]

        },
        {
          title: <div className="color5">高新认定</div>,
          dataIndex: 'gxrd',
          key: 'gxrd',
          children: [
            {
              title: <div className="color3">基础情况</div>,
              children: [
                {
                  title: <div className="color3">创新能力评价评分</div>,
                  dataIndex: 'htScore',
                  key: 'htScore',
                  width: 44,
                },
                {
                  title: <div className="color3">实际申报批次</div>,
                  dataIndex: 'htBatch',
                  key: 'htBatch',
                  width: 60,
                  render: (text, record) => {
                    return (
                      <span>{['第1批', '第2批', '第3批'][text]}</span>
                    )
                  }
                },
                {
                  title: <div className="color3">是否重点关注</div>,
                  dataIndex: 'htFocus',
                  key: 'htFocus',
                  width: 44,
                  render: (text, record) => {
                    return (
                      <span>{['否', '是'][text]}</span>
                    )
                  }
                },
              ],
            },
            {
              title: <div className="color3">申报提交</div>,
              children: [
                {
                  title: <div className="color3">网上系统提交</div>,
                  dataIndex: 'webSubmit',
                  key: 'webSubmit',
                  width: 60,
                  render: (text, record) => {
                    return (
                      <span>{this.getTypeData(text, record.webSubmitOther)}</span>
                    )
                  }

                },
                {
                  title: <div className="color3">纸质材料提交</div>,
                  dataIndex: 'paperSubmit',
                  key: 'paperSubmit',
                  width: 60,
                  render: (text, record) => {
                    return (
                      <span>{this.getTypeData(text, record.paperSubmitOther)}</span>
                    )
                  }
                },
              ],
            },
            {
              title: <div className="color3">评审情况</div>,
              children: [
                {
                  title: <div className="color3">审计评审</div>,
                  // reviewProvince
                  children: [{
                    title: <div className="color3">拟公示序号</div>,
                    dataIndex: 'reviewProvinceNumber',
                    key: 'reviewProvinceNumber',
                    width: 44,
                  }],
                },
                {
                  title: <div className="color3">国家备案</div>,
                  // reviewCountry
                  children: [{
                    title: <div className="color3">高企编号</div>,
                    dataIndex: 'reviewCountryNumber',
                    key: 'reviewCountryNumber',
                    width: 44,
                  }],
                },
              ],
            },
          ]
        },
        {
          title: <div className="color4">最近一次更新时间</div>,
          dataIndex: 'updateTime',
          key: 'updateTime',
          width: 80,
        },
      ],
      pagination: {
        defaultCurrent: 1,
        defaultPageSize: 10,
        showQuickJumper: true,
        pageSize: 10,
        onChange: function (page) {
          this.getDetailsList(page);
        }.bind(this),
        showTotal: function (total) {
          return "共" + total + "条数据";
        },
      },
      customerArr: [],
    }

    this.exportExec = this.exportExec.bind(this);
    this.search = this.search.bind(this);
    this.reset = this.reset.bind(this);
    this.supervisor = this.supervisor.bind(this);
    this.httpChange = this.httpChange.bind(this);
    this.blurChange = this.blurChange.bind(this);
    this.selectAuto = this.selectAuto.bind(this);

  }

  componentDidMount() {
    this.getDetailsList()
  }

  getDetailsList(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/taskDetails/detailsList',
      data: datas,
      success: function (data) {
        ShowModal(this)
        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;
          }
          this.setState({
            newData: data.data.list,
            pagination: this.state.pagination,
            pageNo: data.data.pageNo,

          });
        } else {
          this.setState({
            newData: data.data,
            pagination: false,
          });
        }
      }.bind(this),
    }).always(
      function () {
        this.setState({
          loading: false,
        })
      }.bind(this)
    )
  }

  exportExec() {
    message.config({
      duration: 20,
    });
    let loading = message.loading("下载中...");
    this.setState({
      exportPendingLoading: true,
    });
    $.ajax({
      method: "get",
      dataType: "json",
      crossDomain: false,
      url: globalConfig.context + '/api/admin/taskDetails/export',
      data: this.state.searchValues,
      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;
  }

  getTypeData(type, other) {
    let text = ''
    let list = ['其他', '待完成', '已完成', '合同无此项']
    if (!type && type != 0) {
      text = ''
    } else if (type == 0) {
      text = `其他（${other}）`
    } else {
      text = list[type]
    }
    return text
  }

  supervisor(e) {
    $.ajax({
      method: "get",
      dataType: "json",
      crossDomain: false,
      url: globalConfig.context + "/api/admin/customer/listAdminByName",
      data: {
        adminName: e,
      },
      success: function (data) {
        let thedata = data.data;
        if (!thedata) {
          if (data.error && data.error.length) {
            message.warning(data.error[0].message);
          }
          thedata = {};
        }
        this.setState({
          customerArr: thedata,
        });
      }.bind(this),
    }).always(
      function () {

      }.bind(this)
    );
  }
  // 输入触发
  httpChange(e) {
    if (e.length >= 1) {
      this.supervisor(e);
    }
    this.setState({
      auto: e,
    });
  }
  // 选中
  selectAuto(value, options) {
    const { searchValues } = this.state
    let contactLists = this.state.customerArr || [];
    if (value) {
      contactLists.map(function (item) {
        if (item.name == value.toString()) {
          searchValues["projectDebtorId"] = item.id;
        }
      });
    }
    this.setState({
      auto: value,
      searchValues: searchValues,
    });
  }
  // 失去焦点
  blurChange(e) {
    const { searchValues } = this.state
    let contactLists = this.state.customerArr || [];
    if (e) {
      contactLists.map(function (item) {
        if (item.name == e.toString()) {
          searchValues["projectDebtorId"] = item.id;
        }
      });
    }
    this.setState({
      searchValues: searchValues,
    });
  }

  search() {
    this.getDetailsList();
  }

  reset() {
    this.setState({
      auto: undefined,
      searchValues: {
        roleStatus: adminData.isSuperAdmin ? '0' : '1'
      }
    }, () => {
      this.getDetailsList(1)
    })
  }

  render() {
    const { columns, searchValues, newData } = this.state
    const dataSources = this.state.customerArr || [];
    const options = dataSources.map((group) => (
      <Select.Option key={group.id} value={group.name}>
        {group.name}
      </Select.Option>
    ));
    const roleList = adminData.isSuperAdmin
      ? [
        { value: '0', lable: '查询所有' },
        { value: '1', lable: '查询自己' },
        { value: '2', lable: '查看下级' },
        { value: '3', lable: '负责人查询' },
      ]
      : [
        { value: '1', lable: '查询自己' },
        { value: '2', lable: '查看下级' },
        { value: '3', lable: '负责人查询' },
      ]
    return (
      <div className="user-content membershipTable">
        <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>
        <Tabs defaultActiveKey="1" className="test" bordered>
          <TabPane tab="搜索" key="1">
            <div className="user-search" style={{ marginLeft: 10 }}>
              <Input
                placeholder="咨询师姓名"
                style={{ width: 160 }}
                value={searchValues["consultantName"]
                  ? searchValues["consultantName"]
                  : ""}
                onChange={(e) => {
                  searchValues["consultantName"] = e.target.value;
                  this.setState({
                    searchValues: searchValues,
                  });
                }}
              />
              <Input
                placeholder="合同编号"
                style={{ width: 160 }}
                value={searchValues["contractNo"]
                  ? searchValues["contractNo"]
                  : ""}
                onChange={(e) => {
                  searchValues["contractNo"] = e.target.value;
                  this.setState({
                    searchValues: searchValues,
                  });
                }}
              />
              <Input
                placeholder="客户名称"
                style={{ width: 160 }}
                value={searchValues["userName"]
                  ? searchValues["userName"]
                  : ""}
                onChange={(e) => {
                  searchValues["userName"] = e.target.value;
                  this.setState({
                    searchValues: searchValues,
                  });
                }}
              />
              <Input
                placeholder="服务年份"
                style={{ width: 100 }}
                value={searchValues["serviceYear"]
                  ? searchValues["serviceYear"]
                  : ""}
                onChange={(e) => {
                  searchValues["serviceYear"] = e.target.value;
                  this.setState({
                    searchValues: searchValues,
                  });
                }}
              />
              <AutoComplete
                className="certain-category-search"
                dropdownClassName="certain-category-search-dropdown"
                dropdownMatchSelectWidth={false}
                style={{ width: 150 }}
                dataSource={options}
                placeholder='请输入项目负责人'
                value={this.state.auto}
                onChange={this.httpChange}
                filterOption={true}
                onBlur={this.blurChange}
                onSelect={this.selectAuto}
              >
                <Input />
              </AutoComplete>
              {/* <Select
                placeholder="项目状态"
                style={{ width: 160 }}
                value={searchValues["projectStatus"]
                  ? searchValues["projectStatus"]
                  : undefined}
                onChange={(e) => {
                  searchValues["projectStatus"] = e;
                  this.setState({
                    searchValues: searchValues,
                  });
                }}
              >
                {
                  projectState.map(item =>
                    <Option value={item.value} key={item.key}>{item.key}</Option>
                  )
                }
              </Select> */}
              <Select
                placeholder="外包状态"
                style={{ width: 160 }}
                value={searchValues["outSourcingStatus"]
                  ? searchValues["outSourcingStatus"]
                  : undefined}
                onChange={(e) => {
                  searchValues["outSourcingStatus"] = e;
                  this.setState({
                    searchValues: searchValues,
                  });
                }}
              >
                <Option value="0" >外包待审核</Option>
                {/* <Option value="1" >外包审核通过</Option> */}
                <Option value="2" >外包审核驳回</Option>
              </Select>
              <span>更新时间：</span>
              <RangePicker
                value={[
                  searchValues["updateStartTime"]
                    ? moment(searchValues["updateStartTime"])
                    : null,
                  searchValues["updateEndTime"]
                    ? moment(searchValues["updateEndTime"])
                    : null,
                ]}
                onChange={(data, dataString) => {
                  searchValues["updateStartTime"] = String(
                    dataString[0]
                  );
                  searchValues["updateEndTime"] = String(
                    dataString[1]
                  );
                  this.setState({
                    searchValues: searchValues,
                  });
                }}
              />
              <Select
                placeholder="会员级别"
                style={{ width: 100, marginLeft: 10 }}
                value={searchValues["applicationLevel"]
                  ? searchValues["applicationLevel"]
                  : undefined}
                onChange={(e) => {
                  searchValues["applicationLevel"] = e;
                  this.setState({
                    searchValues: searchValues,
                  });
                }}
              >
                <Option value={1} >A</Option>
                <Option value={2} >AA</Option>
                <Option value={3} >AAA</Option>
              </Select>
              <Select
                placeholder="高新公示"
                style={{ width: 100 }}
                value={searchValues["reviewProvince"]
                  ? searchValues["reviewProvince"]
                  : undefined}
                onChange={(e) => {
                  searchValues["reviewProvince"] = e;
                  this.setState({
                    searchValues: searchValues,
                  });
                }}
              >
                <Option value='0'>未公示</Option>
                <Option value='1'>已公示</Option>
              </Select>

              <Select
                placeholder="汇算清缴"
                style={{ width: 100 }}
                value={searchValues["finalSettlementStatus"]
                  ? searchValues["finalSettlementStatus"]
                  : undefined}
                onChange={(e) => {
                  searchValues["finalSettlementStatus"] = e;
                  this.setState({
                    searchValues: searchValues,
                  });
                }}
              >
                <Option value="0" >其他</Option>
                <Option value="1" >待完成</Option>
                <Option value="2" >已完成</Option>
                <Option value="3" >合同无此项</Option>
              </Select>
              <Select
                placeholder="加计扣除"
                style={{ width: 100 }}
                value={searchValues["adDeliverStatus"]
                  ? searchValues["adDeliverStatus"]
                  : undefined}
                onChange={(e) => {
                  searchValues["adDeliverStatus"] = e;
                  this.setState({
                    searchValues: searchValues,
                  });
                }}
              >
                <Option value="0" >其他</Option>
                <Option value="1" >待完成</Option>
                <Option value="2" >已完成</Option>
                <Option value="3" >合同无此项</Option>
              </Select>
              <Select
                placeholder="火炬统计"
                style={{ width: 100 }}
                value={searchValues["torchStatus"]
                  ? searchValues["torchStatus"]
                  : undefined}
                onChange={(e) => {
                  searchValues["torchStatus"] = e;
                  this.setState({
                    searchValues: searchValues,
                  });
                }}
              >
                <Option value="0" >其他</Option>
                <Option value="1" >待完成</Option>
                <Option value="2" >已完成</Option>
                <Option value="3" >合同无此项</Option>
              </Select>
              <Select
                placeholder="统计年报"
                style={{ width: 100 }}
                value={searchValues["statisticsStatus"]
                  ? searchValues["statisticsStatus"]
                  : undefined}
                onChange={(e) => {
                  searchValues["statisticsStatus"] = e;
                  this.setState({
                    searchValues: searchValues,
                  });
                }}
              >
                <Option value="0" >其他</Option>
                <Option value="1" >待完成</Option>
                <Option value="2" >已完成</Option>
                <Option value="3" >合同无此项</Option>
              </Select>
              <Select
                placeholder="高企年报"
                style={{ width: 100 }}
                value={searchValues["chStatus"]
                  ? searchValues["chStatus"]
                  : undefined}
                onChange={(e) => {
                  searchValues["chStatus"] = e;
                  this.setState({
                    searchValues: searchValues,
                  });
                }}
              >
                <Option value="0" >其他</Option>
                <Option value="1" >待完成</Option>
                <Option value="2" >已完成</Option>
                <Option value="3" >合同无此项</Option>
              </Select>
              <Select
                placeholder="查看"
                style={{ width: 100 }}
                value={searchValues["roleStatus"]
                  ? searchValues["roleStatus"]
                  : undefined}
                onChange={(e) => {
                  searchValues["roleStatus"] = e;
                  this.setState({
                    searchValues: searchValues,
                  });
                }}
              >
                {
                  roleList.map((item =>
                    <Option value={item.value} key={item.value} >{item.lable}</Option>
                  ))
                }
                {/* {adminData.isSuperAdmin ? <Option value="0" >查询所有</Option> : null}
                <Option value="1" >查询自己</Option>
                <Option value="2" >查看下级</Option>
                <Option value="3" >负责人查询</Option> */}
              </Select>
              <Button type="primary" style={{ marginLeft: 10 }} onClick={this.search}>
                搜索
              </Button>
              <Button style={{ marginLeft: 10 }} onClick={this.reset}>
                重置
              </Button>
            </div>
          </TabPane>
          <TabPane tab="导出" key="2">
            <Button
              type="primary"
              style={{ margin: '11px 0 10px 10px' }}
              onClick={this.exportExec}
            >
              导出
            </Button>
          </TabPane>
        </Tabs>
        <div className="patent-table">
          <Spin spinning={this.state.loading}>
            <Table
              columns={columns}
              dataSource={newData}
              bordered
              size="middle"
              scroll={{ x: '220%' }}
              pagination={this.state.pagination}
              onRowDoubleClick={e => {
                this.setState({
                  visible: true,
                  tid: e.tid
                })
              }}
            />
          </Spin>
        </div>
        {
          this.state.visible &&
          <Modal
            title="会员进度表"
            visible={this.state.visible}
            onCancel={() => {
              this.setState({
                visible: false,
                tid: '',
              })
              this.getDetailsList(this.state.pageNo)
            }}
            width={1200}
            footer={null}
          >
            <Progress tid={this.state.tid} />
          </Modal>
        }
      </div >
    );
  }
}

export default MembershipTable;