人才合并弹窗

src/views/menduner/system/talentMap/store/components/merge copy.vue

@@ -0,0 +1,97 @@
+<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>

src/views/menduner/system/talentMap/store/components/merge.vue

@@ -1,45 +1,36 @@
 <template>
-	<Dialog title="人才对比" v-model="dialogVisible" class="!w-65%">
-		<div class="color-orange-400">
+	<Dialog title="人才对比" v-model="dialogVisible" class="!w-full !h-full">
+		<!-- <div class="color-orange-400">
 			提示：查询到当前导入的人才姓名与数据库中的记录重复，请选择处理方式
 			<br />
 			1、在下方数据库中查询出的姓名重复记录选中择一条进行合并
 			<br />
 			2、作为新记录提交
-		</div>
+		</div> -->
+		<el-row :gutter="10" class="mt-30px">
+			<el-col :span="12">
+				<el-card>
+					<template #header>
+						<CardTitle title="当前记录" />
+					</template>
+				</el-card>
+			</el-col>
+			<el-col :span="12">
+				<el-card>
+					<template #header>
+						<CardTitle title="重复记录" />
+					</template>
+					<el-carousel :autoplay="false">
+						<el-carousel-item v-for="item in 3" :key="item">
+							<el-button type="primary" size="small">点击合并到此记录</el-button>
+							<h3 text="2xl" justify="center">{{ item }}</h3>
+						</el-carousel-item>
+					</el-carousel>
+				</el-card>
+			</el-col>
+		</el-row>
 
-		<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>
+		<template #footer>
       <el-button @click="submitForm" type="primary" :disabled="newRecordLoading">新记录提交</el-button>
       <el-button @click="dialogVisible = false">取 消</el-button>
     </template>
@@ -94,4 +85,22 @@ const submitForm = async () => {
 	// 	newRecordLoading.value = false
 	// }
 }
-</script>
+</script>
+
+<style scoped>
+.el-carousel__item h3 {
+  color: #475669;
+  /* opacity: 0.75; */
+  /* line-height: 200px; */
+  margin: 0;
+  text-align: center;
+}
+
+.el-carousel__item:nth-child(2n) {
+  background-color: #99a9bf;
+}
+
+.el-carousel__item:nth-child(2n + 1) {
+  background-color: #d3dce6;
+}
+</style>

src/views/menduner/system/talentMap/store/resume/index.vue

@@ -41,7 +41,7 @@
         <el-button type="primary" plain @click="handleAdd">
           <Icon icon="ep:plus" class="mr-5px" /> 新增人才
         </el-button>
-        <!-- <el-button type="success" plain @click="mergeFormRef.open()">人才合并</el-button> -->
+        <el-button type="success" plain @click="mergeFormRef.open()">人才合并</el-button>
       </el-form-item>
     </el-form>
   </ContentWrap>