<!-- 证书监控 -->
<script lang="ts" setup name="CertificationMonitor">
import type { TableColumn } from '@/components/NormalTable/table_interface'
import { certificateMonitorsById } from '@/api/business/schedule/task'
import { getDictByCode } from '@/api/system/dict'
import type { dictType } from '@/global'
const props = defineProps({
  // 样品id
  sampleId: {
    type: String,
    required: true,
    default: '',
  },
  // 客户id
  customerId: {
    type: String,
    required: true,
    default: '',
  },
})

// 查询条件
const searchQuery = ref({
  sampleId: props.sampleId,
  customerId: props.customerId,
  limit: 10,
  offset: 1,
})
// 表格表头
const columns = ref<TableColumn[]>([
  { text: '证书编号', value: 'certificateReportCode', align: 'center', width: '160' },
  { text: '证书名称', value: 'certificateReportName', align: 'center' },
  { text: '证书类别', value: 'certificateReportCategoryName', align: 'center' },
  { text: '证书状态', value: 'certificateStatus', align: 'center' },
  { text: '初次提交审核时间', value: 'submitTime', align: 'center', width: '180' },
  { text: '完成时间', value: 'finishedTime', align: 'center', width: '180' },
  { text: '退回次数', value: 'returns', align: 'center' },
  { text: '制作人', value: 'createUser', align: 'center' },
])

// 应出具证书数
const requireCertifications = ref(0)
// 当前证书数
const currentCertifications = ref(0)
// 证书列表
const list = ref([])
const total = ref(0)
// 加载状态
const loading = ref(false)

const certificationTypeList = ref<dictType[]>([]) // 证书类别
const certificateReportCategoryDict = ref({}) as any

// 获取字典值
const getDict = async () => {
  // 证书类别
  const response = await getDictByCode('certificationType')
  certificationTypeList.value = response.data
  response.data.forEach((item: any) => {
    certificateReportCategoryDict.value[`${item.value}`] = item.name
  })
}
// 查找证书状态及列表
function fetchData(isNowPage = false) {
  if (!isNowPage) {
    // 是否显示当前页，否则跳转第一页
    searchQuery.value.offset = 1
  }
  loading.value = true
  list.value = []
  searchQuery.value.customerId = props.customerId
  searchQuery.value.sampleId = props.sampleId
  certificateMonitorsById({ ...searchQuery.value }).then((res) => {
    list.value = res.data.rows.map((item: { certificationClass: string }) => {
      return {
        ...item,
        certificateReportCategoryName: `${item.certificationClass}` ? certificateReportCategoryDict.value[item.certificationClass] : item.certificationClass, // 证书类别
      }
    })
    total.value = parseInt(res.data.total)
  })
  loading.value = false
}
watch(() => props.sampleId, async () => {
  if (props.sampleId && props.customerId) {
    await getDict()
    fetchData()
  }
})
watch(() => props.customerId, async () => {
  if (props.sampleId && props.customerId) {
    await getDict()
    fetchData()
  }
})

// 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
const changePage = (val: { size?: number; page?: number }) => {
  if (val && val.size) {
    searchQuery.value.limit = val.size
  }
  if (val && val.page) {
    searchQuery.value.offset = val.page
  }
  fetchData(true)
}
onMounted(async () => {
  if (props.sampleId && props.customerId) {
    await getDict()

    fetchData()
  }
})
</script>

<template>
  <div>
    <normal-table
      :data="list"
      :total="total"
      :query="searchQuery"
      :columns="columns"
      :list-loading="loading"
      :pagination="true"
      :page-sizes="[10, 20, 30]"
      @change="changePage"
    >
      <template #preColumns>
        <el-table-column label="序号" width="55" align="center">
          <template #default="scope">
            {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
          </template>
        </el-table-column>
      </template>
    </normal-table>
  </div>
</template>