<!-- 检查内容 -->
<script name="fileListTable" lang="ts" setup>
import { ElMessage, ElMessageBox } from 'element-plus'
import { useCheckList, useCheckNoTips } from '@/commonMethods/useCheckList'

const $props = defineProps({
  data: {
    type: Array,
    required: true,
  },
})
const $route = useRoute()
const $router = useRouter()
const list = ref<any[]>([])
watch(() => $props.data, (newVal) => {
  if (newVal.length) {
    list.value = $props.data
  }
  else {
    list.value = []
  }
}, {
  deep: true,
})
const columns = ref([
  { text: '检查内容', value: 'inspectionContent', required: false },
  { text: '检查方法', value: 'inspectionMethod', required: false },
  { text: '检查结果', value: 'inspectionRes', required: true },
  { text: '依据（GJB2725A质量手册、程序文件', value: 'refStandard', required: false, width: '180' },
])

// 检查数据列表
function checkCertificateList() {
  return useCheckList(list.value, columns.value, '文件列表')
}
// 将列表置为不可编辑状态
function setAllRowReadable() {
  for (const item of list.value) {
    item.editable = false
  }
}
defineExpose({
  list,
  checkCertificateList,
})
</script>

<template>
  <el-table
    ref="multipleTableRef" :data="list" style="width: 100%;" border
  >
    <el-table-column align="center" label="序号" width="80" type="index" />
    <el-table-column
      v-for="item in columns" :key="item.value" :prop="item.value" :label="item.text"
      align="center" :width="item.width"
    >
      <template #header>
        <span v-show="item.required && !$route.path.includes('detail')" style="color: red;">*</span><span>{{ item.text }}</span>
      </template>
      <template #default="scope">
        <span v-if="!item.required && $route.path.includes('detail')">{{ scope.row[item.value] }}</span>
        <el-tooltip
          v-if="item.required && !$route.path.includes('detail')"
          class="box-item"
          effect="dark"
          :content="scope.row[item.value]"
          placement="top"
        >
          <el-input
            v-if="item.required && !$route.path.includes('detail')"
            v-model="scope.row[item.value]"
            :autofocus="true" :placeholder="`${item.text}`"
            class="input" type="textarea"
            :rows="6"
          />
        </el-tooltip>
      </template>
    </el-table-column>
  </el-table>
</template>