<!-- 设备收发管理详情 -- 分包证书报告 -->
<script name="SubpackageCertList" lang="ts" setup>
import dayjs from 'dayjs'
import type { TableColumn } from '@/components/NormalTable/table_interface'
import { fetCertListByEquipmentId } from '@/api/business/subpackage/certificate'
const props = defineProps({
  sampleId: { // 样品id
    type: String,
    required: true, // 设置之后,props必须要接收到这个数据
    default: '',
  },
})
// 查询条件
const listQuery = ref({
  id: props.sampleId, // 样品id
  limit: 20,
  offset: 1,
})
// 表格表头
const columns = ref<TableColumn[]>([
  { text: '证书编号', value: 'certificateNo', align: 'center', width: '160' },
  { text: '证书名称', value: 'certificateName', align: 'center' },
  { text: '受检设备名称', value: 'sampleName', align: 'center' },
  { text: '规格型号', value: 'model', align: 'center' },
  { text: '出厂编号', value: 'manufactureNo', align: 'center' },
  { text: '生产厂家', value: 'manufacturer', align: 'center' },
  { text: '任务单编号', value: 'orderNo', align: 'center' },
  { text: '委托方', value: 'customerName', align: 'center' },
  { text: '分包方名称', value: 'outsourcerName', align: 'center' },
  { text: '联系人', value: 'contacts', align: 'center' },
  { text: '检定日期', value: 'checkDate', align: 'center', width: '120' },
  { text: '检定有效期', value: 'certificateValid', align: 'center', width: '120' },
  { text: '检定结论', value: 'conclusion', align: 'center' },
  { text: '计量标识', value: 'meterIdentifyName', align: 'center' },
  { text: '证书附件', value: 'fileArr', align: 'center', isLink: true, width: '320' },
])
const list = ref([]) // 列表
const total = ref(0) // 数据总数
const loading = ref(false) // 加载状态
// 获取证书报告列表
function fetchData(isNowPage = false) {
  if (!isNowPage) {
    // 是否显示当前页，否则跳转第一页
    listQuery.value.offset = 1
  }
  loading.value = true
  list.value = []
  listQuery.value.id = props.sampleId ? props.sampleId : listQuery.value.id
  fetCertListByEquipmentId(listQuery.value).then((res) => {
    list.value = res.data.map((item: { certificateReportFile: string; checkDate: string; certificateValid: string }) => {
      return {
        ...item,
        checkDate: item.checkDate ? dayjs(item.checkDate).format('YYYY-MM-DD') : item.checkDate,
        certificateValid: item.certificateValid ? dayjs(item.certificateValid).format('YYYY-MM-DD') : item.certificateValid,
        fileArr: [item.certificateReportFile], // 证书附件
      }
    })
    total.value = parseInt(res.data.total)
    loading.value = false
  }).catch(() => loading.value = false)
}

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

<template>
  <detail-block title="分包证书报告">
    <el-table v-loading="loading" :data="list" border style="width: 100%;">
      <el-table-column label="序号" width="55" align="center">
        <template #default="scope">
          {{ (listQuery.offset - 1) * listQuery.limit + scope.$index + 1 }}
        </template>
      </el-table-column>
      <el-table-column
        v-for="item in columns"
        :key="item.value"
        :prop="item.value"
        :label="item.text"
        :width="item.width"
        align="center"
      >
        <template v-if="item.value === 'fileArr'" #default="scope">
          <show-photo :minio-file-name="scope.row.certificateReportFile" width="100%" />
        </template>
      </el-table-column>
    </el-table>
  </detail-block>
</template>