人才标注

components.d.ts

@@ -75,7 +75,4 @@ declare module 'vue' {
     VerifySlide: typeof import('./src/components/Verifition/Verify/VerifySlide.vue')['default']
     WangEditor: typeof import('./src/components/FormUI/wangEditor/index.vue')['default']
   }
-  export interface ComponentCustomProperties {
-    vLoading: typeof import('element-plus/es')['ElLoadingDirective']
-  }
 }

src/views/recruit/enterprise/newTalentMap/labeling/index.vue

@@ -19,34 +19,15 @@
 				itemKey="id"
 				@pageHandleChange="handleChangePage"
 			>
-				<template #workTerritory="{ item }">
-					<div class="ellipsis" style="max-width: 150px;">
-						{{ item.workTerritory }}
-						<v-tooltip activator="parent" location="top">{{ item.workTerritory }}</v-tooltip>
-					</div>
-				</template>
-				<template #workHistory="{ item }">
-					<div class="ellipsis" style="max-width: 150px;">
-						{{ item.workHistory }}
-						<v-tooltip activator="parent" location="top">{{ item.workHistory }}</v-tooltip>
-					</div>
-				</template>
 				<template #actions="{ item }">
-					<v-btn variant="text" color="primary" @click.stop="handleDetail(item)">详 情</v-btn>
-					<v-btn :disabled="!item.userPersonList || !item.userPersonList.length" variant="text" color="primary" @click.stop="handleContactInformation(item)">
-						联系方式
-					</v-btn>
+					<v-btn variant="text" color="primary" @click.stop="handleAnnotation(item)">标注</v-btn>
+					<v-btn variant="text" color="error" @click.stop="handleDisabled(item)">禁用</v-btn>
+					<v-btn variant="text" color="#008970" @click.stop="handleEnable(item)">启用</v-btn>
+					<v-btn variant="text" color="error" @click.stop="handleDelete(item)">删除</v-btn>
 				</template>
 			</CtTable>
 		</v-card>
 
-		<v-navigation-drawer v-model="showDetail" absolute location="right" rounded temporary width="700" class="pa-5">
-			<div style="width: 300px; height: 300px; margin: 0 auto;">
-				<v-img :src="detail?.picUrl" width="300" height="300" />
-			</div>
-			<div class="mt-10" v-if="detail?.detailIntroduction" v-html="detail?.detailIntroduction.replace(/\n/g, '</br>')"></div>
-		</v-navigation-drawer>
-
 		<!-- 无权限提示 -->
 		<CtDialog :visible="showDialog" :widthType="4" :footer="false" titleClass="text-h6" title="系统提示" @close="showDialog = false">
 			<div class="d-flex align-center flex-column">
@@ -61,50 +42,93 @@
 			</div>
 		</CtDialog>
 
-		<!-- 联系方式 -->
-		<CtDialog :visible="showContactDialog" title="当前联系方式匹配人员" :footer="false" widthType="0" @close="showContactDialog = false">
-			<CtTable
-				:loading="false"
-				:items="contactList"
-				:headers="contactHeaders"
-				:elevation="0"
-				:isTools="false"
-				:showPage="false"
-				itemKey="user.id"
-			>
-				<template #name="{ item }">
-					<div class="d-flex align-center cursor-pointer">
-						<v-badge
-							v-if="item?.person?.sex === '1' || item?.person?.sex === '2'"
-							bordered
-							offset-y="6"
-							:color="badgeColor(item)"
-							:icon="badgeIcon(item)">
-							<v-avatar size="40" :image="getUserAvatar(item.person.avatar, item.person.sex)"></v-avatar>
-						</v-badge>
-						<v-avatar v-else size="40" :image="getUserAvatar(item.person?.avatar, item.person?.sex)"></v-avatar>
-						<span class="ml-3">{{ item?.person?.name || item?.phone }}</span>
-					</div>
-				</template>
-				<template #actions="{ item }">
-					<v-btn variant="text" color="primary" @click.stop="handleContactInformation({ userPersonList: [item] })">联系方式</v-btn>
-				</template>
-			</CtTable>
+		<!-- 标注 -->
+		<CtDialog :visible="showAnnotationDialog" title="人才标注" :footer="false" widthType="1" @close="showAnnotationDialog = false">
+			<v-row>
+				<v-col cols="4">
+					<v-card elevation="3" class="pa-3" style="height: 100%">
+						<p>名片</p>
+						<p>门墩儿新任命</p>
+						<p>门墩儿用户简历</p>
+					</v-card>
+				</v-col>
+				<v-col cols="8">
+					<v-card elevation="3" class="pa-3">
+						<div class="base-info pa-3">
+							<div class="d-flex align-center">
+								<div v-for="(val, index) in talentInfoKeys" :key="index" class="common-width">
+									<p v-ellipse-tooltip>{{ talentItem[val.key] }}</p>
+									<p v-ellipse-tooltip>{{ talentItem[val.value] }}</p>
+								</div>
+							</div>
+							<div class="d-flex align-center my-6">
+								<div class="common-width">{{ talentItem.phone }}</div>
+								<div class="common-width">{{ talentItem.email }}</div>
+							</div>
+							<div>{{ talentItem.address }}</div>
+						</div>
+						<div class="my-5">
+							<p>自动标注</p>
+							<v-chip
+								v-for="(item, index) in talentItem.automaticDimensionTags" :key="index"
+								class="chip mx-2 mt-4"
+								label color="primary"
+							>
+								{{ item }}
+								<v-icon size="18" color="primary" style="margin-left: 6px;" @click="closeClick(index, 'automaticDimensionTags')">mdi-close-circle</v-icon>
+							</v-chip>
+						</div>
+						<div>
+							<p>人工标注</p>
+							<v-chip
+								v-for="(item, index) in talentItem.manualAnnotationTags" :key="index"
+								class="chip mx-2 mt-4 cursor-pointer"
+								label color="primary"
+							>
+								{{ item }}
+								<v-icon size="18" color="primary" style="margin-left: 6px;" @click="closeClick(index, 'manualAnnotationTags')">mdi-close-circle</v-icon>
+							</v-chip>
+
+							<div class="mt-5">
+								<v-chip
+									v-for="(item, index) in tagList" :key="index"
+									class="chip mx-2 mt-4 cursor-pointer"
+									label color="primary"
+									:disabled="talentItem.manualAnnotationTags.includes(item)"
+									@click="handleAdd(item)"
+								>
+									<v-icon icon="mdi-plus" start></v-icon>
+									{{ item }}
+								</v-chip>
+							</div>
+						</div>
+						<v-divider class="mt-5"></v-divider>
+						<div class="d-flex justify-space-evenly my-5">
+							<v-btn variant="outlined" width="120" color="primary" elevation="5" @click="handleClose">取 消</v-btn>
+							<v-btn width="120" color="primary" elevation="5" @click="handleSave">保 存</v-btn>
+						</div>
+					</v-card>
+				</v-col>
+			</v-row>
 		</CtDialog>
 	</div>
 </template>
 
 <script setup>
 defineOptions({ name: 'NewTalentMapAnnotation' })
-import { ref, computed } from 'vue'
-import { getNewAppointmentsPage, getNewAppointmentsDetail } from '@/api/recruit/enterprise/newlyAppointed'
+import { ref } from 'vue'
+import { getNewAppointmentsPage } from '@/api/recruit/enterprise/newlyAppointed'
 import { useUserStore } from '@/store/user'
 import Snackbar from '@/plugins/snackbar'
-import { getUserAvatar } from '@/utils/avatar'
-import { dealDictObjData } from '@/utils/position'
+import Confirm from '@/plugins/confirm'
+import { useI18n } from '@/hooks/web/useI18n'
+import { timesTampChange } from '@/utils/date'
 
+const { t } = useI18n()
 const store = useUserStore()
 const loading = ref(false)
+const showDialog = ref(false)
+const showAnnotationDialog = ref(false)
 const total = ref(10)
 const query = ref({
   pageSize: 10,
@@ -112,39 +136,21 @@ const query = ref({
 })
 const items = ref([])
 const headers = [
-	{ title: '宣布日期', key: 'announceTime', sortable: false },
-  { title: '中文名', key: 'nameChinese', sortable: false },
-  { title: '英文名', key: 'nameEnglish', sortable: false },
-  { title: '性别', key: 'gender', sortable: false },
+  { title: '姓名', key: 'nameChinese', sortable: false },
   { title: '职位', key: 'position', sortable: false },
-  { title: '任职酒店', key: 'inaugurationHotel', sortable: false },
-  { title: '酒店品牌', key: 'hotelBrand', sortable: false },
-  { title: '工作地域', key: 'workTerritory', sortable: false },
-  { title: '过往工作酒店品牌', key: 'workHistory', sortable: false },
+  { title: '酒店', key: 'inaugurationHotel', sortable: false },
+  { title: '标签数量', key: 'tagNum', sortable: false },
+  { title: '人才状态', key: 'tagNum', sortable: false },
+  { title: '创建时间', key: 'createTime', sortable: false, value: item => timesTampChange(item.createTime) },
+  { title: '创建人', key: 'createUser', sortable: false },
+  { title: '修改时间', key: 'updateTime', sortable: false, value: item => timesTampChange(item.updateTime) },
+  { title: '修改人', key: 'updateUser', sortable: false },
   { title: '操作', key: 'actions', sortable: false, align: 'center' }
 ]
 const formItems = ref({
   options: [
 		{
       type: 'text',
-      key: 'nameChinese',
-      value: '',
-      label: '中文名',
-			clearable: true,
-			hideDetails: true,
-			width: 200
-    },
-		{
-      type: 'text',
-      key: 'nameEnglish',
-      value: '',
-      label: '英文名',
-			clearable: true,
-			hideDetails: true,
-			width: 200
-    },
-		{
-      type: 'text',
       key: 'position',
       value: '',
       label: '职位',
@@ -156,41 +162,22 @@ const formItems = ref({
       type: 'text',
       key: 'inaugurationHotel',
       value: '',
-      label: '任职酒店',
-			clearable: true,
-			hideDetails: true,
-			width: 200
-    },
-		{
-      type: 'text',
-      key: 'hotelBrand',
-      value: '',
-      label: '酒店品牌',
-			clearable: true,
-			hideDetails: true,
-			width: 200
-    },
-		{
-      type: 'text',
-      key: 'workTerritory',
-      value: '',
-      label: '工作地域',
+      label: '酒店',
 			clearable: true,
 			hideDetails: true,
 			width: 200
     },
 		{
       type: 'text',
-      key: 'workHistory',
+      key: 'nameChinese',
       value: '',
-      label: '过往工作酒店品牌',
+      label: '姓名',
 			clearable: true,
 			hideDetails: true,
 			width: 200
     }
   ]
 })
-const showDialog = ref(false)
 
 // 获取企业权益信息
 const info = ref(localStorage.getItem('entBaseInfo') ? JSON.parse(localStorage.getItem('entBaseInfo')) : {})
@@ -235,6 +222,7 @@ const handleSearch = async (obj) => {
 	query.value.pageNo = 1
 	getList()
 }
+
 // 重置
 const handleReset = (obj) => {
 	query.value = Object.assign(query.value, obj)
@@ -242,64 +230,86 @@ const handleReset = (obj) => {
 	getList()
 }
 
-// 查看详情
-const showDetail = ref(false)
-const detail = ref({})
-const handleDetail = async (item) => {
-	await store.getEnterpriseInfo(true)
-	// 没有权限提示联系门墩儿
-	if (!info.value?.entitlement?.newAppointment) {
-		showDialog.value = true
-		return
-	}
-	const result = await getNewAppointmentsDetail(item.id)
-	if (!result || !Object.keys(result).length) return Snackbar.warning('暂无详细信息，去查看其他人的信息吧~') 
-	detail.value = result
-	showDetail.value = true
+// 标注
+const tagList = ['富强', '民主', '文明', '和谐', '自由', '平等', '公正', '法治', '爱国', '敬业', '诚信', '友善']
+const talentItem = ref({
+	name: '张三',
+	enName: 'Tom',
+	postName: '总经理',
+	enPostName: 'General Manager',
+	inaugurationHotel: '南京洲际酒店',
+	enInaugurationHotel: 'Nanjing InterContinental Hotel',
+	groupName: '洲际集团',
+	enGroupName: 'IHG',
+	phone: '13800138000',
+	email: 'zhangsan@163.com',
+	address: '南京市人民路123号',
+	automaticDimensionTags: ['富强', '民主', '文明', '和谐'],
+	manualAnnotationTags: [],
+})
+const talentInfoKeys = [
+	{ key: 'name', value: 'enName' },
+	{ key: 'postName', value: 'enPostName' },
+	{ key: 'inaugurationHotel', value: 'enInaugurationHotel' },
+	{ key: 'groupName', value: 'enGroupName' },
+]
+const handleAnnotation = (item) => {
+	console.log(item, '标注')
+	showAnnotationDialog.value = true
 }
 
-// 查看联系方式
-const contactList = ref([])
-const showContactDialog = ref(false)
-const contactHeaders = ref([
-  { title: '中文名', key: 'name', sortable: false },
-  { title: '英文名', key: 'person.foreignName', sortable: false },
-	{ title: '求职状态', key: 'person.jobStatusName', sortable: false },
-	{ title: '工作经验', key: 'person.expName', sortable: false },
-	{ title: '最高学历', key: 'person.eduName', sortable: false },
-	{ title: '联系电话', key: 'phone', sortable: false, value: item => item?.person?.phone || item.user.phone },
-  { title: '电子邮箱', key: 'email', sortable: false, value: item => item?.person?.email || item.user.email },
-  { title: '操作', key: 'actions', sortable: false, align: 'center' }
-])
-const handleContactInformation = async ({ userPersonList }) => {
-	await store.getEnterpriseInfo(true)
-	// 没有权限提示联系门墩儿
-	if (!info.value?.entitlement?.newAppointment) {
-		showDialog.value = true
-		return
-	}
-	// 只匹配到一个用户的直接查看详情
-	if (userPersonList.length === 1) {
-		window.open(`/recruit/enterprise/talentPool/details/${userPersonList[0].user.id}`)
-		return
-	}
-	// 匹配到多个用户，展示列表
-	contactList.value = userPersonList.map(e => {
-		if (e?.person) e.person = Object.assign(e.person, dealDictObjData({}, e.person))
-		return e
-	})
-	showContactDialog.value = true
+// 删除
+const closeClick = (index, dataKey) => {
+	talentItem.value[dataKey].splice(index, 1)
 }
 
-const badgeColor = computed(() => (item) => {
-  return (item.person && item.person.sex) ? (item.person.sex === '1' ? '#1867c0' : 'error') : 'error'
-})
+// 手动标注添加
+const handleAdd = (item) => {
+	talentItem.value.manualAnnotationTags.push(item)
+}
 
-const badgeIcon = computed(() => (item) => {
-  return (item.person && item.person.sex) ? (item.person.sex === '1' ? 'mdi-gender-male' : 'mdi-gender-female') : 'mdi-gender-female'
-})
+// 禁用
+const handleDisabled = (item) => {
+	console.log(item, '禁用')
+	Confirm(t('common.confirmTitle'), '是否确定禁用此人才数据？').then(async () => {
+    Snackbar.success(t('common.operationSuccessful'))
+  })
+}
+
+// 启用
+const handleEnable = (item) => {
+	console.log(item, '启用')
+	Confirm(t('common.confirmTitle'), '是否确定启用此人才数据？').then(async () => {
+    Snackbar.success(t('common.operationSuccessful'))
+  })
+}
+
+// 删除
+const handleDelete = (item) => {
+	console.log(item, '删除')
+	Confirm(t('common.confirmTitle'), '是否确定删除？').then(async () => {
+    // await deleteInvoiceTitle(id)
+    Snackbar.success(t('common.delMsg'))
+    // getList()
+  })
+}
+
+const handleClose = () => {
+	showAnnotationDialog.value = false
+}
+
+const handleSave = async () => {
+	handleClose()
+}
 </script>
 
 <style scoped lang="scss">
-
+.base-info {
+	background-color: #f7f8fa;
+	border-radius: 6px;
+}
+.common-width {
+	width: 25%;
+	max-width: 25%;
+}
 </style>

src/views/recruit/personal/PersonalCenter/tradeOrder/components/detail.vue

@@ -41,7 +41,7 @@
       </v-card>
 
       <v-row no-gutters class="mt-3">
-        <v-col span="6">
+        <v-col cols="6">
           <!-- 订单信息 -->
           <v-card class="pa-5">
             <h3>订单信息</h3>
@@ -55,7 +55,7 @@
             </div>
           </v-card>
         </v-col>
-        <v-col span="6" class="ml-3">
+        <v-col cols="6" class="ml-3">
           <!-- 物流信息 -->
           <v-card class="pa-5" style="height: 100%">
             <h3>物流信息</h3>