<script setup>
	import commonSelect from '@/components/CommonSelector/index.vue'
	import { genKey, clone } from '@/utils/systemUtils'

	const props = defineProps({
		title: {
			type: String,
			required: false,
			default: ''
		},
		dataList: {
			type: Array,
			required: false,
			default: () => []
		},
		readonly: {
			type: Boolean,
			required: false,
			default: false
		},
		enumId: {
			type: String,
			required: true
		}
	})

	const columns = [
		{
			title: '序号',
			customRender: ({ text, record, index }) => `${index + 1}`
		},
		{
			title: '检验项目',
			dataIndex: 'inspectionItemId'
		},
		{
			title: '检验值',
			dataIndex: 'inspectionValue'
		},
		{
			title: '单项结论',
			dataIndex: 'singleConclusion'
		},
		{
			title: '检验方法',
			dataIndex: 'inspectionMethod'
		},
		...(!props.readonly
			? [
					{
						title: '操作',
						dataIndex: 'action',
						align: 'center',
						width: 250
					}
			  ]
			: [])
	]

	const acTableData = ref(props.dataList)

	watch(
		() => props.dataList,
		(n, o) => {
			if (n) {
				console.log(n)
				acTableData.value = n
			}
		}
	)

	const add = () => {
		acTableData.value.push({
			inspectionItemId: null, // 检测项目 ids
			inspectionMethod: null, // 检验方法
			inspectionValue: null, // 值
			singleConclusion: null, // 符合/不符合
			key: genKey('aqct')
		})
	}

	const del = (data) => {
		acTableData.value = acTableData.value.filter((d) => d.key !== data.key)
	}

	const getTableData = () => {
		const list = clone(acTableData.value)
		list.forEach((d) => delete d.key)
		return list
	}

	defineExpose({
		getTableData
	})
</script>

<template>
	<a-table :columns="columns" :data-source="acTableData" bordered :pagination="false">
		<template #bodyCell="{ column, text, record }">
			<template v-if="column.dataIndex === 'inspectionItemId'">
				<common-select
					v-model:value="record.inspectionItemId"
					:type="props.enumId"
					load-type="enum"
					class="select"
					:readonly="readonly"
				/>
			</template>
			<template v-if="column.dataIndex === 'inspectionValue'">
				<a-input v-model:value="record.inspectionValue" :readonly="readonly" />
			</template>
			<template v-if="column.dataIndex === 'singleConclusion'">
				<common-select
					v-model:value="record.singleConclusion"
					type="DXJL"
					load-type="static"
					class="select"
					:readonly="readonly"
				/>
			</template>
			<template v-if="column.dataIndex === 'inspectionMethod'">
				<a-input v-model:value="record.inspectionMethod" :readonly="readonly" />
			</template>
			<template v-if="column.dataIndex === 'action'">
				<a-button @click="del(record)" danger>删除</a-button>
			</template>
		</template>
		<template #title>
			<span>{{ props.title }}</span>
			<a-button v-if="!readonly" @click="add" style="margin-left: 10px">添加</a-button>
		</template>
	</a-table>
</template>

<style scoped lang="less">
	.select {
		min-width: 120px;
	}
</style>
