<template>
	<Dialog title="人才对比" v-model="dialogVisible" class="!w-65%">
		<div class="color-orange-400">
			提示：查询到当前导入的人才姓名与数据库中的记录重复，请选择处理方式
			<br />
			1、在下方数据库中查询出的姓名重复记录选中择一条进行合并
			<br />
			2、作为新记录提交
		</div>

		<el-descriptions class="mt-50px" title="当前导入人才信息" border column="4">
			<el-descriptions-item label="姓名">张三</el-descriptions-item>
			<el-descriptions-item label="联系电话">18100000000</el-descriptions-item>
			<el-descriptions-item label="邮箱">zhangsan@example.com</el-descriptions-item>
			<el-descriptions-item label="性别">男</el-descriptions-item>
		</el-descriptions>

		<div class="mt-50px el-descriptions__title">重复记录</div>
		<el-table :data="list" :stripe="true" class="my-10px">
      <el-table-column label="头像" align="center" prop="avatar" width="70px" fixed="left">
        <template #default="scope">
          <el-image
						class="h-60px w-60px"
						:src="scope.row.avatar"
						lazy
						preview-teleported
						:preview-src-list="[scope.row.avatar]"
						fit="contain"
					/>
        </template>
      </el-table-column>
      <el-table-column label="姓名" align="center" prop="name" fixed="left" />
      <el-table-column label="联系电话" align="center" prop="phone" />
      <el-table-column label="邮箱" align="center" prop="email" />
      <el-table-column label="性别" align="center" prop="sexStr" />
      <el-table-column label="操作" align="center" fixed="right" min-width="110">
        <template #default="scope">
          <el-button link type="success" @click="handleMerge(scope.row.id)">合并到此记录</el-button>
        </template>
      </el-table-column>
    </el-table>
    <template #footer>
      <el-button @click="submitForm" type="primary" :disabled="newRecordLoading">新记录提交</el-button>
      <el-button @click="dialogVisible = false">取 消</el-button>
    </template>
  </Dialog>
</template>

<script setup>
defineOptions({ name: 'TalentMapStoreMerge' })

const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗

const mergeLoading = ref(false)
const newRecordLoading = ref(false)
const dialogVisible = ref(false)
const list = ref([
	{
		id: 1,
		name: '张三',
		phone: '13800138000',
		email: 'zhangsan@example.com',
		sexStr: '男',
		avatar: 'https://minio.menduner.com/dev/person/1/img/933de4dc9eb28e2bdf79a1da518a8e1a0e14bf4b78358ea9452fb8e8fdd2f7f6.jpeg'
	},
	{
		id: 2,
		name: '张三',
		phone: '13800138001',
		email: 'lisi@example.com',
		sexStr: '女',
		avatar: 'https://minio.menduner.com/dev/person/1/img/933de4dc9eb28e2bdf79a1da518a8e1a0e14bf4b78358ea9452fb8e8fdd2f7f6.jpeg'
	}
])

const open = async (data) => {
  dialogVisible.value = true
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗

// 人才合并
const handleMerge = async (id) => {
	console.log(id, 'merge')
}

// 新记录提交
const submitForm = async () => {
	// newRecordLoading.value = true

	// try {
	// 	message.success('新记录提交成功')
	// } finally {
	// 	newRecordLoading.value = false
	// }
}
</script>