
<template>
    <el-card shadow="never" body-class="card_css" class="list-card-follow" style="padding-bottom: 20px;">
        <template #header>
          <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
            <el-form-item>
              <el-date-picker
                v-model="followUpData"
                type="datetimerange"
                range-separator="-"
                start-placeholder="开始时间"
                end-placeholder="结束时间"
                value-format="YYYY-MM-DD HH:mm:ss"
                @change="getDate"
                style="width: 200px"
              />
            </el-form-item>
            <el-form-item>
                <el-input
                    v-model="queryParams.blurry"
                    placeholder="搜索关键词"
                    clearable
                    @input="handleQuery"
                    style="width: 200px">
                    <template #prefix>
                      <el-icon class="el-input__icon"><search /></el-icon>
                    </template>
                  </el-input>
            </el-form-item>
              <el-form-item>
                  <el-button @click="exportFollow" :loading="exportLoading" v-hasPermi="[`${props.perPrefix}:detail:tab_gjjl_dc`]">
                      导出
                  </el-button>
              </el-form-item>

          </el-form>
        </template>
        <div style="height:100%">
          <Follow :followParams="queryParams" :btnRole="roleBtn" :isPagination='true' ref='followRef'></Follow>
        </div>
    </el-card>

  </template>

  <script setup name="FollowUp" lang="ts">
  import auth from '@/plugins/auth'
  import { FollowQuery } from '@/api/customer/follow/types';
  import Follow from '@/components/Follow/index.vue'
  import { listExport } from '@/api/public'
import downloadPlugins from '@/plugins/download'

  const props = defineProps({
        resourceType: {
            type: String,
            default: true
        },
        resourceTypeId: {
            type: String,
            default: true
        },
        perPrefix:{
            type: String

        }
    })

  const queryParams:FollowQuery = reactive({
    blurry:'',
    followUpStartDate:'',
    followUpEndDate:'',
    resourceType:props.resourceType=='10'||props.resourceType=='11'?'':props.resourceType,
    resourceTypeId:props.resourceType=='10'||props.resourceType=='11'?'':props.resourceTypeId,
    customerId:props.resourceType=='10'||props.resourceType=='11'?props.resourceTypeId:'',
  })
  const followUpData = ref<[]>([])
  const getDate = (data:any) =>{
    queryParams.followUpStartDate = data ? data[0] : ''
    queryParams.followUpEndDate = data? data[1] : ''
    handleQuery()
  }


  const followRef = ref()
  /** 搜索按钮操作 */
  const handleQuery = () => {
    followRef.value.getData()
  }


  const roleBtn = ref([
      { type: 'commit', hasPermi: `${ props.perPrefix }:detail:tab_gjjl_tj` },
      { type: 'detail', hasPermi: `${ props.perPrefix }:detail:tab_gjjl_xq` },
      // { type: 'remove', hasPermi: `${ props.perPrefix }:detail:tab_gjjl_sc` },
      {type: 'edit', hasPermi: `${ props.perPrefix }:detail:tab_gjjl_bj`},
  ])

  const exportLoading = ref(false)
  const exportFollow = () => {
    if(Object.keys(followRef.value.followList).length == 0) {
        ElMessage.error('无数据可导出')
        return false
    }
    let params = JSON.parse(JSON.stringify(queryParams))
    params.pageSize = 999999
    params.pageIndex = 1
    exportLoading.value = true
    listExport({ templateCode: 'EXPORT_FOLLOW_UP_EXCEL', ...params }).then(res => {
        try {
            downloadPlugins.download('export', res)
        }catch {
            ElMessage.error('导出失败，请稍后再试')
        }
        exportLoading.value = false
    })
  }

  onMounted(() => {
  });
  </script>

  <style lang="scss" scoped>
  .el-select{
    width: 200px;
  }
  </style>
