yos_web/src/HDrpManagement/contactData/index.vue

<template>
  <div style="background: #f8f8f8;">
    <normal-layout>
      <template #refresh>
        <el-button size="mini" type="text" style="margin-right: 15px;color: #3874f6;font-size: 14px" @click="toTop">{{ $t('返回顶部') }}</el-button>
      </template>
      <template #content>
        <div style="overflow: auto;height: calc(100vh - 220px)" ref="rollRef" @scroll="handleScroll">
          <div style="display: flex;justify-content: space-between;margin: 10px 24px 20px 24px;">
            <depStatus ref="allDepRef" @depData="depData" @personData="depData" @leaveData="depData"></depStatus>
            <div>
              <btnSelect :btn-title="['全部','本年','本季','本月','上月','去年']" :date-type="dateType" @btnClick="btnClick"></btnSelect>
            </div>
          </div>
          <!--  数据概况        -->
          <dataBoard title="联系人数据概况" :mainData="maninInfo" heightNew="145px" @goDetail="goDetail"></dataBoard>
          <dataDetail ref="detailRef" :param="paramDetail" :person="person" :departmentid="depment" :layout="tablecols" :title="detailTitle" :titleHeader="titleHeader" height="calc(100vh - 225px)" tableType="联系人数据概况">
            <template slot="custom">
              <div class="mt-10 inline-16">
                <p class="search__label">{{$t('状态')}}:</p>
                <el-select v-model="isleave" clearable style="margin-right:10px" size="small" :placeholder="$t('请选择状态')" @change="leaveChange" disabled>
                  <el-option :label="$t('在职')" value="1"></el-option>
                  <el-option :label="$t('离职')" value="2"></el-option>
                </el-select>
              </div>
              <div class="inline-16 mt-10" v-if="titleHeader == '关联客户数'">
                <label class="search__label">{{ $t("客户类型") }}:</label>
                <el-select
                    class="inline-16"
                    v-model="paramDetail.content.where.type"
                    size="small"
                    :placeholder="$t('请选择')"
                    @change="selectChange"
                    clearable
                >
                  <el-option
                      v-for="item in option.typeData"
                      :key="item.value"
                      :label="$t(item.value)"
                      :value="item.value"
                  >
                  </el-option>
                </el-select>
              </div>
              <div class="mt-10 inline-16" v-if="titleHeader == '关联客户数'">
                <label class="search__label">{{ $t("合作状态") }}:</label>
                <el-select
                    class="inline-16"
                    v-model="paramDetail.content.where.status"
                    size="small"
                    :placeholder="$t('请选择')"
                    @change="selectChange"
                    clearable
                >
                  <el-option
                      v-for="item in option.status"
                      :key="item.value"
                      :label="$t(item.value)"
                      :value="item.value"
                  >
                  </el-option>
                </el-select>
              </div>
              <div class="mt-10 inline-16" v-if="titleHeader == '关联客户数'">
                <label class="search__label">{{ $t("成交状态") }}:</label>
                <el-select
                    class="inline-16"
                    v-model="paramDetail.content.where.tradingstatus"
                    size="small"
                    :placeholder="$t('请选择')"
                    @change="selectChange"
                    clearable
                >
                  <el-option
                      v-for="item in option.tradingstatus"
                      :key="item.value"
                      :label="$t(item.value)"
                      :value="item.value"
                  >
                  </el-option>
                </el-select>
              </div>
              <div class="mt-10 inline-16" v-if="titleHeader == '关联项目数'">
                <label  class="search__label">{{$t(`项目阶段`)}}:</label>
                <el-select class="inline-16" v-model="paramDetail.content.where.stagename" :placeholder="$t(`请选择项目阶段`)" @change="selectChange" size="small" clearable>
                  <el-option
                      v-for="item in option.stageList"
                      :key="item.stagename"
                      :label="$t(item.stagename)"
                      :value="item.stagename">
                  </el-option>
                </el-select>
              </div>
              <div class="mt-10 inline-16" v-if="titleHeader == '关联项目数'">
                <label  class="search__label">{{$t(`报备进度`)}}:</label>
                <el-select class="inline-16" v-model="paramDetail.content.where.reportstatus" :placeholder="$t(`请选择报备进度`)" @change="selectChange" size="small" clearable>
                  <el-option
                      v-for="item in option.reportstatus"
                      :key="item.value"
                      :label="$t(item.label)"
                      :value="item.value">
                  </el-option>
                </el-select>
              </div>
              <div class="mt-10 inline-16" v-if="titleHeader == '关联项目数'">
                <label  class="search__label">{{$t(`项目类型`)}}:</label>
                <el-select class="inline-16" v-model="paramDetail.content.where.projecttype" :placeholder="$t('请选择项目类型')" @change="selectChange" size="small" clearable>
                  <el-option
                      v-for="item in projectType"
                      :key="item.value"
                      :label="$t(item.value)"
                      :value="item.value">
                    <span style="float: left">{{ $t(item.value) }}</span>
                    <span style="float: right; color: #8492a6; font-size: 12px">{{ item.remarks?$t(item.remarks):$t('暂无描述') }}</span>
                  </el-option>
                </el-select>
              </div>
              <div class="mt-10 inline-16" v-if="titleHeader == '关联项目数' || titleHeader == '关联客户成交金额'">
                <label  class="search__label">{{$t('领域')}}:</label>
                <el-select class="inline-16" v-model="paramDetail.content.where.tradefield" :placeholder="$t('请选择领域')" @change="selectChange" size="small" clearable>
                  <el-option
                      v-for="item in tradefieldSelect"
                      :key="item.value"
                      :label="$t(item.value)"
                      :value="item.value">
                    <span style="float: left">{{ $t(item.value) }}</span>
                    <span style="float: right; color: #8492a6; font-size: 12px">{{ item.remarks?$t(item.remarks):$t('暂无描述') }}</span>
                  </el-option>
                </el-select>
              </div>
              <div class="inline-16 mt-10" v-if="titleHeader == '联系人总数' || titleHeader == '关联项目数' || titleHeader == '关联客户数'">
                <span class="search__label">{{$t('标签')}}:</span>
                <el-select  v-model="tags" :placeholder="$t('请选择标签')" size="small" @change="selectChange" clearable @clear="selectChange" filterable class="inline-16" multiple>
                  <el-option
                      v-for="item in tagList"
                      :key="item.index"
                      :label="$t(item.tag)"
                      :value="item.tag"
                      :disabled="hasDisabledTag(item)">
                  </el-option>
                </el-select>
              </div>
              <div class="mt-10 inline-16" v-if="titleHeader == '关联项目数'">
                <label  class="search__label">{{$t(`项目状态`)}}:</label>
                <el-select class="inline-24" v-model="paramDetail.content.where.status" :placeholder="$t(`请选择项目状态`)" @change="selectChange" size="small" clearable>
                  <el-option
                      v-for="item in option.statusTab"
                      :key="item.value"
                      :label="$t(item.label)"
                      :value="item.value">
                  </el-option>
                </el-select>
              </div>
              <div class="inline-16" v-if="titleHeader == '联系人总数'">
                <label class="search__label">{{ $t('关联') }}:</label>
                <el-select  v-model="paramDetail.content.where.contactstype" :placeholder="$t('请选择关联')" size="small" @change="selectChange" clearable @clear="selectChange" class="inline-16">
                  <el-option :label="$t(`关联线索`)" value="关联线索"></el-option>
                  <el-option :label="$t(`关联客户`)" value="关联客户"></el-option>
                  <el-option :label="$t(`关联项目`)" value="关联项目"></el-option>
                </el-select>
              </div>
            </template>
          </dataDetail>
          <!--  联系人销售贡献度排行        -->
          <salesContribution class="mt-10" ref="salesContributionRef"></salesContribution>
          <!--  近12月联系人新增分析        -->
          <contactsAddAnalysis class="mt-10" ref="contactsAddAnalysisRef"></contactsAddAnalysis>
          <!--  联系人关联线索情况统计       -->
          <statisticsOfClues class="mt-10" ref="statisticsOfCluesRef" :windowWidth="windowWidth"></statisticsOfClues>
          <!--  联系人关联客户情况统计       -->
          <statisticsOfCustomer class="mt-10" ref="statisticsOfCustomerRef" :windowWidth="windowWidth"></statisticsOfCustomer>
          <!--  联系人关联项目情况统计       -->
          <statisticsOfProject class="mt-10" ref="statisticsOfProjectRef" :windowWidth="windowWidth"></statisticsOfProject>
          <!--  联系人跟进情况统计       -->
          <statisticsOfFollow class="mt-10" ref="statisticsOfFollowRef" :windowWidth="windowWidth"></statisticsOfFollow>
          <!--  近12月联系人跟进分析        -->
          <contactsFollowAnalysis class="mt-10" ref="contactsFollowAnalysisRef"></contactsFollowAnalysis>
          <!--  联系人未跟进天数分析        -->
          <statisticsOfUnFollow class="mt-10" ref="statisticsOfUnFollowRef"></statisticsOfUnFollow>
        </div>
      </template>
    </normal-layout>
  </div>
</template>

<script>
import normalLayout from '@/components/normal-basic-layout/normalNew'
import btnSelect from "@/components/btn_select/btnSelect";
import dataBoard from '@/components/dataBoard/index'
import dataDetail from '@/template/dataDetail/index'
import salesContribution from './components/salesContribution'
import depStatus from './components/depStatus'
import contactsAddAnalysis from './components/contactsAddAnalysis'
import contactsFollowAnalysis from './components/contactsFollowAnalysis'
import statisticsOfClues from './components/statisticsOfClues'
import statisticsOfCustomer from './components/statisticsOfCustomer'
import statisticsOfProject from './components/statisticsOfProject'
import statisticsOfFollow from './components/statisticsOfFollow'
import statisticsOfUnFollow from './components/statisticsOfUnFollow'
export default {
  name: "index",
  components:{normalLayout,btnSelect,dataBoard,dataDetail,salesContribution,depStatus,contactsAddAnalysis,contactsFollowAnalysis,statisticsOfClues,statisticsOfCustomer,statisticsOfProject,
    statisticsOfFollow,statisticsOfUnFollow},
  data(){
    return {
      scrollData:'',
      depment:'',
      person:'',
      isleave:'1',
      deplist:[],
      personnelList:[],
      depmentParam:{
        "id": 20230620102004,
        "content": {
          "isleave":1
        }
      },
      dateType:'本年',
      windowWidth: document.documentElement.clientWidth,  //实时屏幕宽度
      userName:JSON.parse(window.sessionStorage.getItem('active_account')).name,
      mainData:'',
      paramMain:{
        "id": 2025072114302202,
        "content": {
          "type": 1,
          "dataid": 58,
          "dateType": "全部",
          "where": {
            "isleave": "1"
          }
        },
      },
      maninInfo:'',
      paramDetail:{
        "id": 2025072213574102,
        "content": {
          "type": 1,
          "dataid": 58,
          "dateType": "本年",
          "pageNumber":1,
          "pageSize":100,
          "where": {
            "isleave": "",
            "condition": "",
            "tag": [],
            "contactstype": "", //关联线索，关联客户，关联项目
            "type":"",
            "status":"",
            "tradingstatus":"",
            "stagename":'',
            "projecttype":'',
            "tradefield":'',
            "reportstatus":''
          }
        },
      },
      tablecols:'',
      detailTitle:'',
      tagList:[],
      tags:[],
      titleHeader:'',
      projectType:[],
      tradefieldSelect:[],
      option: {
        typeData: [],
        customerClassification: [],
        customerGrade: [],
        industryData: [],
        tagData: [],
        stageList:[],
        status: [
          {
            value: "潜在",
          },
          {
            value: "合作中",
          },
          {
            value: "暂缓",
          },
          {
            value: "已终止",
          },
        ],
        tradingstatus: [
          {
            value: "未成交",
          },
          {
            value: "已成交",
          },
          {
            value: "多次成交",
          },
        ],
        reportstatus:[
          {
            value:"未报备",
            label:"未报备"
          },
          {
            value:"报备中",
            label:"报备中"
          },
          {
            value:"已报备",
            label:"已报备"
          },
        ],
        statusTab:[
          {
            value:"跟进中",
            label:"跟进中"
          },
          {
            value:"已成交",
            label:"已成交"
          },
          {
            value:"已失败",
            label:"已失败"
          },
          {
            value:"已结案",
            label:"已结案"
          }
        ],
      },
    }
  },
  watch: {
    windowWidth (val) {
      console.log("实时屏幕宽度：",val );
    }
  },
  methods:{
    /*返回顶部*/
    toTop(){
      this.$refs.rollRef.scrollTop = 0
    },

    /*滚动条*/
    handleScroll(){
      this.scrollData = this.$refs.rollRef.scrollTop
    },

    /*部门人员列表*/
    async departmentrtment() {
      const res = await this.$api.requested(this.depmentParam)
      this.deplist = this.createMenu(res.data.dep)
      this.$refs.allDepRef.deplist = this.deplist
      this.$refs.salesContributionRef.$refs.depStatusCusRef.deplist = this.deplist
      this.$refs.salesContributionRef.$refs.depStatusProRef.deplist = this.deplist
      this.$refs.contactsAddAnalysisRef.$refs.dataTemPlateRef.$refs.depStatusRef.deplist = this.deplist
      this.$refs.contactsFollowAnalysisRef.$refs.dataTemPlateRef.$refs.depStatusRef.deplist = this.deplist
      this.$refs.statisticsOfCluesRef.$refs.dataTemPlateRef.$refs.depStatusRef.deplist = this.deplist
      this.$refs.statisticsOfCustomerRef.$refs.dataTemPlateRef.$refs.depStatusRef.deplist = this.deplist
      this.$refs.statisticsOfProjectRef.$refs.dataTemPlateRef.$refs.depStatusRef.deplist = this.deplist
      this.$refs.statisticsOfFollowRef.$refs.dataTemPlateRef.$refs.depStatusRef.deplist = this.deplist
      this.$refs.statisticsOfUnFollowRef.$refs.dataTemPlateRef.$refs.depStatusRef.deplist = this.deplist

      this.personnelList = res.data.hr
      this.$refs.allDepRef.personnelList = this.personnelList
      this.$refs.salesContributionRef.$refs.depStatusCusRef.personnelList = this.personnelList
      this.$refs.salesContributionRef.$refs.depStatusProRef.personnelList = this.personnelList
      this.$refs.contactsAddAnalysisRef.$refs.dataTemPlateRef.$refs.depStatusRef.personnelList = this.personnelList
      this.$refs.contactsFollowAnalysisRef.$refs.dataTemPlateRef.$refs.depStatusRef.personnelList = this.personnelList
      this.$refs.statisticsOfCluesRef.$refs.dataTemPlateRef.$refs.depStatusRef.personnelList = this.personnelList
      this.$refs.statisticsOfCustomerRef.$refs.dataTemPlateRef.$refs.depStatusRef.personnelList = this.personnelList
      this.$refs.statisticsOfProjectRef.$refs.dataTemPlateRef.$refs.depStatusRef.personnelList = this.personnelList
      this.$refs.statisticsOfFollowRef.$refs.dataTemPlateRef.$refs.depStatusRef.personnelList = this.personnelList
      this.$refs.statisticsOfUnFollowRef.$refs.dataTemPlateRef.$refs.depStatusRef.personnelList = this.personnelList

      this.depment = ''
      this.$refs.allDepRef.depment = this.depment
      this.$refs.salesContributionRef.$refs.depStatusCusRef.depment = this.depment
      this.$refs.salesContributionRef.$refs.depStatusProRef.depment = this.depment
      this.$refs.contactsAddAnalysisRef.$refs.dataTemPlateRef.$refs.depStatusRef.depment = this.depment
      this.$refs.contactsFollowAnalysisRef.$refs.dataTemPlateRef.$refs.depStatusRef.depment = this.depment
      this.$refs.statisticsOfCluesRef.$refs.dataTemPlateRef.$refs.depStatusRef.depment = this.depment
      this.$refs.statisticsOfCustomerRef.$refs.dataTemPlateRef.$refs.depStatusRef.depment = this.depment
      this.$refs.statisticsOfProjectRef.$refs.dataTemPlateRef.$refs.depStatusRef.depment = this.depment
      this.$refs.statisticsOfFollowRef.$refs.dataTemPlateRef.$refs.depStatusRef.depment = this.depment
      this.$refs.statisticsOfUnFollowRef.$refs.dataTemPlateRef.$refs.depStatusRef.depment = this.depment

      this.person = JSON.parse(window.sessionStorage.getItem('active_account')).name
      this.$refs.allDepRef.person = this.person
      this.$refs.salesContributionRef.$refs.depStatusCusRef.person = this.person
      this.$refs.salesContributionRef.$refs.depStatusProRef.person = this.person
      this.$refs.contactsAddAnalysisRef.$refs.dataTemPlateRef.$refs.depStatusRef.person = this.person
      this.$refs.contactsFollowAnalysisRef.$refs.dataTemPlateRef.$refs.depStatusRef.person = this.person
      this.$refs.statisticsOfCluesRef.$refs.dataTemPlateRef.$refs.depStatusRef.person = this.person
      this.$refs.statisticsOfCustomerRef.$refs.dataTemPlateRef.$refs.depStatusRef.person = this.person
      this.$refs.statisticsOfProjectRef.$refs.dataTemPlateRef.$refs.depStatusRef.person = this.person
      this.$refs.statisticsOfFollowRef.$refs.dataTemPlateRef.$refs.depStatusRef.person = this.person
      this.$refs.statisticsOfUnFollowRef.$refs.dataTemPlateRef.$refs.depStatusRef.person = this.person

      const userid = JSON.parse(sessionStorage.getItem('active_account')).userid
      this.otherMethod(userid)
    },
    /*部门结构处理*/
    createMenu (array) {
      var that = this
      let arr = []
      function convertToElementTree(node) {
        // 新节点
        if (node.subdep.length === 0){
          var elNode = {
            label: node["depname"],
            parentid:node['parentid'],
            parentname:node['parentname'],
            departmentid:node["departmentid"],
            value:node["departmentid"],
            remarks:node["remarks"],
            isused:node["isused"],
            changedate:node['changedate'],
            changeby:node['changeby'],
            createdate:node['createdate'],
            createby:node['createby'],
            depno:node['depno'],
            disabled:that.pageOnlyRead,
          }
        }else {
          var elNode = {
            label: node["depname"],
            parentid:node['parentid'],
            parentname:node['parentname'],
            departmentid:node["departmentid"],
            value:node["departmentid"],
            remarks:node["remarks"],
            isused:node["isused"],
            changedate:node['changedate'],
            changeby:node['changeby'],
            createdate:node['createdate'],
            createby:node['createby'],
            depno:node['depno'],
            disabled:that.pageOnlyRead,
            children: []
          }
        }
        if (node.subdep && node.subdep.length > 0) {
          // 如果存在子节点
          for (var index = 0; index < node.subdep.length; index++) {
            // 遍历子节点, 把每个子节点看做一颗独立的树, 传入递归构造子树, 并把结果放回到新node的children中
            elNode.children.push(convertToElementTree(node.subdep[index]));
          }
        }
        return elNode;
      }
      array.forEach((element) => {
        arr.push(convertToElementTree(element))
      });
      return arr
    },
    /*选择部门*/
    selectDep(val) {
      if (val.length === 0){
        const userid = JSON.parse(sessionStorage.getItem('active_account')).userid
        this.otherModel(userid,'0')
      }else {
        this.person = ''
        this.departmentid = val[val.length -1]
        this.otherModel(this.departmentid,'1',this.isleave)
      }
    },
    /*选择人员*/
    selectPerson(val){
      this.depment = ''
      this.departmentid = ''
      this.dataid = val
      this.otherModel(val,'0',this.isleave)
    },
    /*选择在职状态*/
    leaveChange(){
      this.person = ''
      const type = this.depment?'1':'0'
      const dataid = type == 0?-1:this.departmentid
      this.otherModel(dataid,type,this.isleave,'状态')
      this.personData()
    },
    /*获取新的业务员列表*/
    async personData(){
      let param = {
        id: 20230620102004,
        content: {
          isleave:this.isleave
        },
      }
      const res = await this.$api.requested(param)
      this.personnelList = res.data.hr
    },
    /*切换时间*/
    btnClick(data){
      this.dateType = data
      this.queryMainData(this.paramMain.content.dataid,data)
    },
    /*选择部门*/
    depData(id,type,isleave,state){
      this.otherModel(id,type,isleave,state)
    },
    /*其他页面首次调用*/
    otherMethod(dataid){
      const userName = JSON.parse(sessionStorage.getItem('active_account')).name
      /*联系人数据概况*/
      this.paramMain.content.type = '0'
      this.queryMainData(dataid,this.dateType)
      this.$refs.salesContributionRef.paramCus.content.dateType = '本年'
      this.$refs.salesContributionRef.paramPro.content.dateType = '本年'
      this.$refs.salesContributionRef.listData(dataid,0,1)
      this.$refs.contactsAddAnalysisRef.listData(0,dataid,1,null,true)
      this.$refs.contactsFollowAnalysisRef.listData(0,dataid,1,null,true)
      this.$refs.statisticsOfCluesRef.paramTable.content.pageNumber = 1
      this.$refs.statisticsOfCluesRef.listData(dataid,0,1,null,true)
      this.$refs.statisticsOfCustomerRef.listData(dataid,0,1,null,true)
      this.$refs.statisticsOfProjectRef.listData(dataid,0,1,null,true)
      this.$refs.statisticsOfFollowRef.listData(dataid,0,1,null,true)
      this.$refs.statisticsOfUnFollowRef.listData(dataid,0,1,null,true)
    },
    /*其他页面再次调用*/
    otherModel(dataid,type,isleave,state){
      this.paramMain.content.type = type
      this.paramMain.content.where.isleave = isleave
      this.paramMain.content.dataid = dataid
      this.person = state == '状态' ? '' : type == 0  ? dataid : ''
      this.depment = type == 0 ? '' : dataid
      this.isleave = isleave
      this.queryMainData(dataid,this.dateType)

      /*联系人销售贡献度排行*/
      this.$refs.salesContributionRef.$refs.depStatusProRef.person = state == '状态' ? '' : type == 0  ? dataid : ''
      this.$refs.salesContributionRef.$refs.depStatusCusRef.person = state == '状态' ? '' : type == 0 ? dataid : ''
      this.$refs.salesContributionRef.$refs.depStatusCusRef.depment = type == 0 ? '' : dataid
      this.$refs.salesContributionRef.$refs.depStatusProRef.depment = type == 0 ? '' : dataid
      this.$refs.salesContributionRef.$refs.depStatusProRef.isleave = isleave

      this.$refs.salesContributionRef.$refs.depStatusCusRef.isleave = isleave
      this.$refs.salesContributionRef.listData(dataid,type,isleave,state)

      /*近12月联系人新增分析*/
      this.$refs.contactsAddAnalysisRef.$refs.dataTemPlateRef.$refs.depStatusRef.person = state == '状态' ? '' : type == 0  ? dataid : ''
      this.$refs.contactsAddAnalysisRef.$refs.dataTemPlateRef.$refs.depStatusRef.depment = type == 0 ? '' : dataid
      this.$refs.contactsAddAnalysisRef.$refs.dataTemPlateRef.$refs.depStatusRef.isleave = isleave
      this.$refs.contactsAddAnalysisRef.listData(dataid,type,1,state,null)

      /*联系人关联线索情况统计*/
      this.$refs.statisticsOfCluesRef.$refs.dataTemPlateRef.$refs.depStatusRef.person = state == '状态' ? '' : type == 0  ? dataid : ''
      this.$refs.statisticsOfCluesRef.$refs.dataTemPlateRef.$refs.depStatusRef.depment = type == 0 ? '' : dataid
      this.$refs.statisticsOfCluesRef.$refs.dataTemPlateRef.$refs.depStatusRef.isleave = isleave
      this.$refs.statisticsOfCluesRef.paramTable.content.pageNumber = 1
      this.$refs.statisticsOfCluesRef.listData(dataid,type,1,state,null)

      /*联系人关联客户情况统计*/
      this.$refs.statisticsOfCustomerRef.$refs.dataTemPlateRef.$refs.depStatusRef.person = state == '状态' ? '' : type == 0  ? dataid : ''
      this.$refs.statisticsOfCustomerRef.$refs.dataTemPlateRef.$refs.depStatusRef.depment = type == 0 ? '' : dataid
      this.$refs.statisticsOfCustomerRef.$refs.dataTemPlateRef.$refs.depStatusRef.isleave = isleave
      this.$refs.statisticsOfCustomerRef.paramTable.content.pageNumber = 1
      this.$refs.statisticsOfCustomerRef.listData(dataid,type,1,state,null)

      /*联系人关联项目情况统计*/
      this.$refs.statisticsOfProjectRef.$refs.dataTemPlateRef.$refs.depStatusRef.person = state == '状态' ? '' : type == 0  ? dataid : ''
      this.$refs.statisticsOfProjectRef.$refs.dataTemPlateRef.$refs.depStatusRef.depment = type == 0 ? '' : dataid
      this.$refs.statisticsOfProjectRef.$refs.dataTemPlateRef.$refs.depStatusRef.isleave = isleave
      this.$refs.statisticsOfProjectRef.paramTable.content.pageNumber = 1
      this.$refs.statisticsOfProjectRef.listData(dataid,type,1,state,null)

      /*联系人跟进情况统计*/
      this.$refs.statisticsOfFollowRef.$refs.dataTemPlateRef.$refs.depStatusRef.person = state == '状态' ? '' : type == 0  ? dataid : ''
      this.$refs.statisticsOfFollowRef.$refs.dataTemPlateRef.$refs.depStatusRef.depment = type == 0 ? '' : dataid
      this.$refs.statisticsOfFollowRef.$refs.dataTemPlateRef.$refs.depStatusRef.isleave = isleave
      this.$refs.statisticsOfFollowRef.paramTable.content.pageNumber = 1
      this.$refs.statisticsOfFollowRef.listData(dataid,type,1,state,null)

      /*近12月联系人跟进分析*/
      this.$refs.contactsFollowAnalysisRef.$refs.dataTemPlateRef.$refs.depStatusRef.person = state == '状态' ? '' : type == 0  ? dataid : ''
      this.$refs.contactsFollowAnalysisRef.$refs.dataTemPlateRef.$refs.depStatusRef.depment = type == 0 ? '' : dataid
      this.$refs.contactsFollowAnalysisRef.$refs.dataTemPlateRef.$refs.depStatusRef.isleave = isleave
      this.$refs.contactsFollowAnalysisRef.listData(dataid,type,1,state,null)

      /*联系人未跟进天数分析*/
      this.$refs.statisticsOfUnFollowRef.$refs.dataTemPlateRef.$refs.depStatusRef.person = state == '状态' ? '' : type == 0  ? dataid : ''
      this.$refs.statisticsOfUnFollowRef.$refs.dataTemPlateRef.$refs.depStatusRef.depment = type == 0 ? '' : dataid
      this.$refs.statisticsOfUnFollowRef.$refs.dataTemPlateRef.$refs.depStatusRef.isleave = isleave
      this.$refs.statisticsOfUnFollowRef.paramTable.content.pageNumber = 1
      this.$refs.statisticsOfUnFollowRef.listData(dataid,type,1,state,null)
    },
    /*联系人数据概况*/
    async queryMainData(dataid,dateType){
      this.paramMain.content.dataid = dataid
      this.paramMain.content.dateType = dateType
      const res = await this.$api.requested(this.paramMain)
      if (res.code == 0){
        this.tool.showMessage(res,()=>{})
      }else {
        this.mainData = res.data
        this.changeDataStructure()
      }
    },
    changeDataStructure(){
      let that = this
      this.maninInfo = [
        {
          label:'联系人总数',
          value:this.tool.qtyShow(this.mainData.count_phonebook),
          isTooltip:true,
          tooltip:'统计跟进联系人总数量。'
        },
        {
          label:'联系人跟进次数',
          value:this.tool.qtyShow(this.mainData.count_follow),
          isTooltip:true,
          tooltip:'统计在【联系人】应用，跟进联系人次数。'
        },
        {
          label:'关联客户数',
          value:this.tool.qtyShow(this.mainData.count_customer),
          isTooltip:true,
          tooltip:'统计联系人关联的客户数量。'
        },
        {
          label:'关联项目数',
          value:this.tool.qtyShow(this.mainData.count_project),
          isTooltip:true,
          tooltip:'统计联系人关联的项目数量。'
        },
        {
          label:'关联客户成交金额',
          // value:this.tool.formatAmount(this.mainData.amount_customer,2,'¥'),
          value:this.mainData.amount_customer < 10000 ? this.tool.formatAmount(this.mainData.amount_customer,2,'¥'):
              this.tool.formatAmount(this.tool.unitConversion(this.mainData.amount_customer,10000),2,'¥'),
          isTooltip:true,
          isTitle:this.mainData.amount_customer < 10000?false:true,
          tooltip:'统计联系人关联的客户标准、特殊订单下单金额。'
        },
        {
          label:'关联项目成交金额',
          value:this.mainData.amount_project < 10000 ? this.tool.formatAmount(this.mainData.amount_project,2,'¥'):
                this.tool.formatAmount(this.tool.unitConversion(this.mainData.amount_project,10000),2,'¥'),
          isTooltip:true,
          isTitle:this.mainData.amount_project < 10000?false:true,
          tooltip:'统计联系人关联的项目订单下单金额。'
        }
      ]
    },
    goDetail(data){
      this.titleHeader = data
      if (data == '联系人总数'){
        this.paramDetail.id =2025072213574102
        this.tablecols = this.tool.tabelCol(this.$route.name).contactsTotalTable.tablecols
        this.getTagList()
      }else if (data == '联系人跟进次数'){
        this.paramDetail.id = 2025072213575402
        this.tablecols = this.tool.tabelCol(this.$route.name).contactsFollowTable.tablecols
      }else if (data == '关联客户数'){
        this.paramDetail.id = 2025072213580402
        this.tablecols = this.tool.tabelCol(this.$route.name).associatedCustomersTable.tablecols
        this.getSelectData()
        this.getTagList()
      }else if (data == '关联项目数'){
        this.paramDetail.id = 2025072213581302
        this.tablecols = this.tool.tabelCol(this.$route.name).associatedProjectsTable.tablecols
        this.stageData()
        this.getSelectData()
        this.getTagList()
      }else if (data == '关联客户成交金额'){
        this.paramDetail.id = 2025072213582002
        this.tablecols = this.tool.tabelCol(this.$route.name).associatedAmountTable.tablecols
        this.getSelectData()
      }else if (data == '关联项目成交金额'){
        this.paramDetail.id = 2025072213582602
        this.tablecols = this.tool.tabelCol(this.$route.name).associatedAmountTable.tablecols
        this.getSelectData()
      }
      this.detailTitle = this.$t(this.dateType) + '_' + this.$t(data)
      this.paramDetail.content.dataid = this.paramMain.content.dataid
      this.paramDetail.content.type = this.paramMain.content.type
      this.paramDetail.content.dateType = this.paramMain.content.dateType
      this.paramDetail.content.where.isleave = this.paramMain.content.where.isleave
      this.$refs.detailRef.onShow()
    },
    /*获取联系人标签*/
    async getTagList () {
      if (this.titleHeader == '联系人总数'){
        let res = await this.$api.requested({
          "id": 20220929085401,
          "content": {
            "ownertable":"sys_phonebook",
            "ownerid":102
          }
        })
        this.tagList = res.data.option
      }else if (this.titleHeader == '关联客户数'){
        const res = await this.$api.requested({
          id: 20221013104401,
          content: {
            isExport: 1,
            pageNumber: 1,
            pageSize: 100,
            sys_systemtagid: 2,
            where: {
              condition: "",
            },
          },
        });
        this.tagList = this.unique(res.data)
      }else if (this.titleHeader == '关联项目数'){
        const res = await this.$api.requested({
          "id":20221013104401,
          "content":{
            "isExport":1,
            "pageNumber":1,
            "pageSize":100,
            "sys_systemtagid":1,
            "where":{
              "condition":""
            }
          }
        })
        this.tagList = this.unique(res.data)
      }
    },
    /*去重*/
    unique(arr) {
      const res = new Map();
      return arr.filter((arr) => !res.has(arr.tag) && res.set(arr.tag, 1));
    },
    selectChange(){
      this.paramDetail.content.where.tag = this.tags
      this.$refs.detailRef.listData()
    },
    hasDisabledTag (item) {
      let arr = []
      let arr2 = []
      arr = this.tagList.filter(item=>{
        return this.tags.includes(item.tag)
      })
      arr.forEach(e=>{
        arr2 = arr2.concat(e.mutextag)
      })
      arr2 = this.tags.length === 0?[]:arr2
      let _isSame = arr2.some(tag=>item.tag === tag)
      return _isSame
    },
    clearSearchValue () {
      this.$store.dispatch('clearSearchValue')
      this.$refs.detailRef.listData(this.paramDetail.content.pageNumber = 1)
    },
    /*获取自定义选项数据*/
    async getSelectData(){
      if (this.titleHeader == '关联客户数'){
        const res = await this.$store.dispatch("optiontypeselect", "customertypemx")
        this.option.typeData = res.data
      }else if (this.titleHeader == '关联项目数'){
        const res = await this.$store.dispatch("optiontypeselect", "projecttype")
        this.projectType = res.data
        const res1 = await this.$store.dispatch("optiontypeselect", "tradefield")
        this.tradefieldSelect = res1.data
      }else {
        const res1 = await this.$store.dispatch("optiontypeselect", "tradefield")
        this.tradefieldSelect = res1.data
      }
    },
    /*获取阶段*/
    async stageData(){
      const res = await this.$api.requested({
        "id": 20221128143604,
        "content": {
          "pageNumber": 1,
          "pageSize": 99,
          "where": {
            "condition": "",
            "allprojecttype":"",
            "projecttype":""
          }
        }
      })
      this.option.stageList = res.data
    },
  },
  mounted() {
    this.departmentrtment()

    var that = this;
    // <!--把window.onresize事件挂在到mounted函数上-->
    window.onresize = () => {
      return (() => {
        window.fullWidth = document.documentElement.clientWidth;
        that.windowWidth = window.fullWidth; // 宽
      })()
    };
  },
  created() {
    // this.tablecols = this.tool.tabelCol(this.$route.name).contactsTotalTable.tablecols
  }
}
</script>

<style scoped>

</style>