门墩儿招聘样式调整

src/views/menduner/system/person/details/components/expExtend.vue

@@ -3,25 +3,27 @@
     <div class="ml">工作经验 <span v-if="total > queryParams.pageSize">{{ '最多展示' + queryParams.pageSize + '条数据' }}</span></div>
     <el-timeline>
       <template v-for="(val, index) in list" :key="index">
-        <template v-if="retract || index < displayIndex">
+        <template v-if="expandAll || index < foldNum">
           <el-timeline-item center placement="top" color="#0bbd87">
             <div class="timeline-item">
-              <div style="width: 20%;">
+              <div class="timeline-item-time">
                 <span>{{ val?.startTime ? timesTampChange(val.startTime, 'Y-M') : '未填写工作时间' }}</span>
                 <span v-if="val?.startTime"> - {{ val.startTime ? val.endTime ? timesTampChange(val.endTime, 'Y-M') : '至今' : '' }}</span>
                 <span v-if="val?.startTime"> ({{ val.startTime ? getTimeDifferenceInChinese(val.startTime, val.endTime) : '' }})</span>
               </div>
-              <div class="timeline-item-name mx-3">{{ formatName(val.enterpriseName) || '' }}</div>
-              <div class="timeline-item-name">{{ formatName(val.positionName) || '' }}</div>
+              <div class="timeline-item-content">
+                <div class="timeline-item-name">{{ formatName(val.enterpriseName) || '' }}</div>
+                <div class="timeline-item-name">{{ formatName(val.positionName) || '' }}</div>
+              </div>
             </div>
           </el-timeline-item>
         </template>
       </template>
       <!-- 允许折叠情况下数据大于displayIndex 展示折叠按钮 -->
-      <div v-if="list.length > displayIndex && !displayAll" class="showBtn color-primary" @click.stop="retract = Boolean(!retract)">
-        <span>{{ retract ? '折叠' : '展开全部' }}</span>
+      <div v-if="list.length > foldNum && !defaultShowAll" class="showBtn color-primary" @click.stop="expandAll = Boolean(!expandAll)">
+        <span>{{ expandAll ? '折叠' : '展开全部' }}</span>
         <!-- <div class="icons">
-          <i :class="retract ? 'up' : 'down'"></i>
+          <i :class="expandAll ? 'up' : 'down'"></i>
           <i class="el-icon-down"></i>
         </div> -->
       </div>
@@ -40,7 +42,7 @@ import { formatName } from '@/utils'
 const props = defineProps({
   userId: [String, Number],
   data: Array,
-  displayAll: Boolean
+  defaultShowAll: Boolean // 展示所有工作经验
 })
 
 const queryParams = reactive({
@@ -48,8 +50,8 @@ const queryParams = reactive({
   pageSize: 100,
   userId: props.userId
 })
-const retract = ref(!props.displayAll) // 是否默认折叠
-const displayIndex = ref(2) // 默认展示个数-1
+const expandAll = ref(props.defaultShowAll) // 展开/折叠
+const foldNum = ref(2) // 折叠时展示个数-1
 
 const list = ref(props.data || [])
 const total = ref(props.data?.length || 0)
@@ -59,12 +61,13 @@ const getList = async () => {
   loading.value = true
   try {
     const data = await PersonInfoApi.getPersonExpPage(queryParams)
-    list.value = data.list ? data.list.map(exp => {
+    list.value = data.list?.length ? data.list.map(exp => {
       exp.startTimeStr = exp.startTime ? timesTampChange(exp.startTime, 'Y-M') : '未填写工作时间'
       exp.endTimeStr = exp.startTime ? exp.endTime ? timesTampChange(exp.endTime, 'Y-M') : '至今' : ''
       exp.year = exp.endTimeStr ? getTimeDifferenceInChinese(exp.startTime, exp.endTime) : ''
       // 未填写工作经验内容，不展示
       exp.show = Boolean(exp.year) || Boolean(exp.enterpriseName) || Boolean(exp.positionName)
+      return exp
     }) : []
     total.value = data.total
   } finally {
@@ -84,15 +87,37 @@ getList()
     width: 100%;
     color: var(--color-666);
     font-size: 13px;
-    .timeline-item-name {
-      width: 40%;
+    .timeline-item-time {
+      width: 20%;
+      min-width: 200px;
     }
-    .mx-3 {
-      margin: 0 12px;
+    .timeline-item-content {
+      flex: 1;
+      display: flex;
+      align-items: center;
+      .timeline-item-name {
+        width: 50%;
+        padding-left: 12px;
+      }
     }
   }
   .el-timeline-item {
     padding-bottom: 0;
   }
+  .showBtn {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    color: #00b760;
+    cursor: pointer;
+    .icons {
+      display: flex;
+      flex-direction: column;
+      margin-left: 5px;
+      .icon {
+        line-height: 4px;
+      }
+    }
+  }
 }
 </style>

src/views/menduner/system/talentMap/maintenance/gather/components/personCard.vue

@@ -28,33 +28,8 @@
         </div>
       </div>
     </div>
-    <div class="exp" v-if="info?.workExpList?.length">
-      <div class="ml">工作经验</div>
-      <el-timeline>
-        <template v-for="(val, index) in info.workExpList" :key="index">
-          <template v-if="info.showAll || index < 2">
-            <el-timeline-item center placement="top" color="#0bbd87">
-              <div class="timeline-item">
-                <div style="width: 20%;">
-                  <span>{{ val?.startTime ? timesTampChange(val.startTime, 'Y-M') : '未填写工作时间' }}</span>
-                  <span v-if="val?.startTime"> - {{ val.startTime ? val.endTime ? timesTampChange(val.endTime, 'Y-M') : '至今' : '' }}</span>
-                  <span v-if="val?.startTime"> ({{ val.startTime ? getTimeDifferenceInChinese(val.startTime, val.endTime) : '' }})</span>
-                </div>
-                <div class="timeline-item-name mx-3">{{ formatName(val.enterpriseName) || '' }}</div>
-                <div class="timeline-item-name">{{ formatName(val.positionName) || '' }}</div>
-              </div>
-            </el-timeline-item>
-          </template>
-        </template>
-				<div v-if="info.workExpList.length > 2" class="showBtn color-primary" @click.stop="info.showAll = Boolean(!info.showAll)">
-					{{ info.showAll ? '折叠' : '展开全部' }}
-					<!-- <div class="icons">
-            <i :class="info.showAll ? 'up' : 'down'"></i>
-            <i class="el-icon-down"></i>
-					</div> -->
-				</div>
-      </el-timeline>
-    </div>
+    <!-- 工作经验 -->
+    <expExtend :user-id="info?.userId" />
     <div class="button">
       <el-button type="success" plain @click="personClick">{{ props.detailButTxt || '加入人才地图' }}</el-button>
     </div>
@@ -63,6 +38,7 @@
 <script setup>
 defineOptions({ name: 'PersonCard'})
 import { DICT_TYPE } from '@/utils/dict'
+import expExtend from '@/views/menduner/system/person/details/components/expExtend.vue'
 import { timesTampChange, getTimeDifferenceInChinese } from '@/utils/transform/date'
 import { formatName } from '@/utils'
 const emit = defineEmits(['detail'])
@@ -115,42 +91,6 @@ const personClick = () => {
     .firstWorkTime { margin-left: 30px; }
   }
 }
-.exp {
-  margin-top: 20px;
-  color: #666;
-  .timeline-item {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    width: 100%;
-    color: var(--color-666);
-    font-size: 13px;
-    .timeline-item-name {
-      width: 40%;
-    }
-    .mx-3 {
-      margin: 0 12px;
-    }
-  }
-  .el-timeline-item {
-    padding-bottom: 0;
-  }
-}
-.showBtn {
-	display: flex;
-	justify-content: center;
-	align-items: center;
-  color: #00b760;
-  cursor: pointer;
-	.icons {
-		display: flex;
-		flex-direction: column;
-		margin-left: 5px;
-		.icon {
-			line-height: 4px;
-		}
-	}
-}
 .button {
   position: absolute;
   top: 10px;

src/views/menduner/system/talentMap/maintenance/gather/components/search.vue

@@ -109,7 +109,7 @@ const getList = async () => {
       return {
         ...e.person,
         // Boolean(exp.year) || Boolean(exp.enterpriseName) || Boolean(exp.positionName)
-        workExpList: e.work ? [e.work] : []
+        // workExpList: e.work ? [e.work] : []
       }
     }) || []
     total.value = data?.total || 0

src/views/menduner/system/talentMap/maintenance/gather/index.vue

@@ -67,7 +67,7 @@
 
     <!-- 人员搜索 -->
     <Dialog :title="radioObject.menduner" v-model="openSearch" width="1200" @close="openSearch = false">
-      <Search @detail="handleDetail" :detailButTxt="detailButTxt" />
+      <Search @detail="handleDetail" />
     </Dialog>
 
     <!-- 解析文件上传 -->
@@ -125,7 +125,7 @@
     </Dialog>
 
     <!-- 解析回显 -->
-    <Dialog :title="radioObject[radioValue]" v-model="dialog_analysisInfo" width="90%">
+    <Dialog :title="radioObject[radioValue]" v-model="dialog_analysisInfo" width="90%" @close="dialog_analysisInfo = false">
       <div class="analysisInfoBox">
         <div class="analysisFile">
           <!-- 门墩儿人才库 -->
@@ -133,17 +133,8 @@
             <el-tabs v-model="activeName" type="border-card">
               <el-tab-pane label="基本信息" name="info">
                 <el-card shadow="never" class="m-b-20px">
-                  <template #header>
-                    <CardTitle title="人才详情" />
-                  </template>
                   <Info :id="id" :user-id="userId" />
-                </el-card>
-                
-                <el-card shadow="never" class="m-b-20px">
-                  <template #header>
-                    <CardTitle title="工作经历" />
-                  </template>
-                  <Exp :user-id="userId" />
+                  <expExtend :user-id="userId" defaultShowAll />
                 </el-card>
               </el-tab-pane>
 
@@ -249,7 +240,7 @@ import { useUpload } from '@/components/UploadFile/src/useUpload'
 import { commonApi } from '@/api/menduner/common'
 import { Base64 } from 'js-base64'
 import Info from '@/views/menduner/system/person/details/components/info.vue'
-import Exp from '@/views/menduner/system/person/details/components/exp.vue'
+import expExtend from '@/views/menduner/system/person/details/components/expExtend.vue'
 import Attachment from '@/views/menduner/system/person/details/components/attachment.vue'
 
 const baseUrl = import.meta.env.VITE_PREVIEW_URL
@@ -535,7 +526,6 @@ const cardUploadChange = (raw) => {
 }
 
 // 人员搜索
-const detailButTxt = '加入人才地图'
 const openSearch = ref(false)
 const id = ref(null)
 const userId = ref(null)
@@ -592,7 +582,7 @@ const handleAdd = () => {
   analysisLoading.value = false
   analysisType.value = 'create'
   radioValue.value = defaultValue // 重置解析类型
-	// 
+  // 
   openSelect.value = true
 }