公司搜索展示调整

src/styles/recruit/company.css

@@ -37,7 +37,7 @@
   min-width: calc((100% - 36px) / 4);
   max-width: calc((100% - 36px) / 4);
   margin: 0 12px 12px 0;
-  height: 130px;
+  height: 160px;
   border-radius: 12px;
   padding: 0;
   overflow: hidden;
@@ -71,9 +71,9 @@
 
 .company-info h3 {
   height: 22px;
-  font-size: 16px;
-  font-weight: 400;
-  color: var(--color-222);
+  font-size: 18px;
+  font-weight: 700;
+  color: var(--color-333);
   line-height: 22px;
   margin: 0 0 4px 0;
   padding: 0;
@@ -93,15 +93,32 @@
 
 .company-info-bottom {
   width: 100%;
-  height: 41px;
+  height: 70px;
+  padding: 10px 15px;
+}
+
+.name {
+  position: relative;
+  line-height: 22px;
+  color: #404040;
+  margin-right: 8px;
   overflow: hidden;
+  text-overflow: ellipsis;
   white-space: nowrap;
-  padding: 10px 20px;
-  background-color: #f8fcfb;
-  font-size: 14px;
-  color: var(--color-666);
+  transition: all linear .2s;
 }
 
-.company-info-bottom .bottom-tag {
-  width: 243px;
+.salary {
+  font-size: 16px;
+  float: right;
+  color: var(--v-error-base);
+  line-height: 22px;
+  max-width: none;
+  text-align: right;
+  flex: 1;
+}
+
+.job-hover:hover {
+  color: var(--v-primary-base);
+  background-color: #f2f4f7;
 }

src/styles/recruit/company.min.css

@@ -1 +1 @@
-.label-title{width:64px;font-weight:500;margin-right:24px;color:var(--color-222)}.label-content{flex:1}.label-color{color:var(--color-222);font-size:14px;margin-right:24px;display:inline-block;cursor:pointer}.label-color:hover{color:var(--v-primary-base)}.actives{color:var(--v-primary-base);font-weight:600}.company-box{display:flex;flex-wrap:wrap}.sub-li{position:relative;width:calc((100% - 36px) / 4);min-width:calc((100% - 36px) / 4);max-width:calc((100% - 36px) / 4);margin:0 12px 12px 0;height:130px;border-radius:12px;padding:0;overflow:hidden;transition:all .2s linear;background-color:#fff;cursor:pointer}.sub-li:nth-child(4n){margin-right:0}.sub-li:hover{box-shadow:0 16px 40px 0 rgba(153,153,153,0.3)}.company-info{float:left;margin-left:16px;width:282px}.company-info-top{display:flex;height:90px;line-height:90px;padding:0 20px;align-items:center;overflow:hidden}.company-info h3{height:22px;font-size:16px;font-weight:400;color:var(--color-222);line-height:22px;margin:0 0 4px 0;padding:0;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.company-info p{height:18px;font-size:13px;font-weight:400;color:var(--color-999);line-height:18px}.company-info-bottom{width:100%;height:41px;overflow:hidden;white-space:nowrap;padding:10px 20px;background-color:#f8fcfb;font-size:14px;color:var(--color-666)}.company-info-bottom .bottom-tag{width:243px}
+.label-title{width:64px;font-weight:500;margin-right:24px;color:var(--color-222)}.label-content{flex:1}.label-color{color:var(--color-222);font-size:14px;margin-right:24px;display:inline-block;cursor:pointer}.label-color:hover{color:var(--v-primary-base)}.actives{color:var(--v-primary-base);font-weight:600}.company-box{display:flex;flex-wrap:wrap}.sub-li{position:relative;width:calc((100% - 36px) / 4);min-width:calc((100% - 36px) / 4);max-width:calc((100% - 36px) / 4);margin:0 12px 12px 0;height:160px;border-radius:12px;padding:0;overflow:hidden;transition:all .2s linear;background-color:#fff;cursor:pointer}.sub-li:nth-child(4n){margin-right:0}.sub-li:hover{box-shadow:0 16px 40px 0 rgba(153,153,153,0.3)}.company-info{float:left;margin-left:16px;width:282px}.company-info-top{display:flex;height:90px;line-height:90px;padding:0 20px;align-items:center;overflow:hidden}.company-info h3{height:22px;font-size:18px;font-weight:700;color:var(--color-333);line-height:22px;margin:0 0 4px 0;padding:0;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.company-info p{height:18px;font-size:13px;font-weight:400;color:var(--color-999);line-height:18px}.company-info-bottom{width:100%;height:70px;padding:10px 15px}.name{position:relative;line-height:22px;color:#404040;margin-right:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:all linear .2s}.salary{font-size:16px;float:right;color:var(--v-error-base);line-height:22px;max-width:none;text-align:right;flex:1}.job-hover:hover{color:var(--v-primary-base);background-color:#f2f4f7}

src/styles/recruit/company.scss

@@ -36,7 +36,7 @@
   min-width: calc((100% - 36px) / 4);
   max-width: calc((100% - 36px) / 4);
   margin: 0 12px 12px 0;
-  height: 130px;
+  height: 160px;
   border-radius: 12px;
   padding: 0;
   overflow: hidden;
@@ -65,9 +65,9 @@
 }
 .company-info h3 {
   height: 22px;
-  font-size: 16px;
-  font-weight: 400;
-  color: var(--color-222);
+  font-size: 18px;
+  font-weight: 700;
+  color: var(--color-333);
   line-height: 22px;
   margin: 0 0 4px 0;
   padding: 0;
@@ -85,14 +85,29 @@
 }
 .company-info-bottom {
   width: 100%;
-  height: 41px;
+  height: 70px;
+  padding: 10px 15px;
+}
+.name {
+  position: relative;
+  line-height: 22px;
+  color: #404040;
+  margin-right: 8px;
   overflow: hidden;
+  text-overflow: ellipsis;
   white-space: nowrap;
-  padding: 10px 20px;
-  background-color: #f8fcfb;
-  font-size: 14px;
-  color: var(--color-666);
-  .bottom-tag {
-    width: 243px;
-  }
+  transition: all linear .2s;
+}
+.salary {
+  font-size: 16px;
+  float: right;
+  color: var(--v-error-base);
+  line-height: 22px;
+  max-width: none;
+  text-align: right;
+  flex: 1;
+}
+.job-hover:hover {
+  color: var(--v-primary-base);
+  background-color: #f2f4f7;
 }

src/views/about/index.vue

@@ -96,7 +96,7 @@ const introduce = [
   },
   {
     name: 'Nelson Li 李可',
-    job: '助理总经理兼武汉费尔蒙酒店业主代表',
+    job: '泛海酒店投资管理有限公司副总经理兼武汉泛海费尔蒙酒店业主代表',
     company: '泛海酒店投资管理有限公司',
     avatar: 'https://minio.citupro.com/dev/menduner/home/about/%E5%9B%BE%E7%89%877.png',
     desc: '世界每时每刻都在发生变化，唯一不变的是我们对于这个行业的初心和热情。很高兴看到一群有梦想的酒店人为了遇见更好的自己，为了中国酒店业的未来勇敢的迈出了这一步…“精诚所至 金石为开”，愿“门墩儿”与中国酒店人共同成长，加油！'

src/views/recruit/personal/company/components/companyItem.vue

@@ -1,18 +1,33 @@
 <template>
   <div class="company-box">
-    <div class="sub-li" v-for="item in list" :key="item.id" @mouseenter="item.active = true" @mouseleave="item.active = false">
-      <div class="company-info-top" @click="handleClickEnterprise(item)">
+    <div class="sub-li" v-for="item in list" :key="item.enterprise.id">
+      <div class="company-info-top" @click="handleClickEnterprise(item)" @mouseenter="item.active = true" @mouseleave="item.active = false">
         <div class="float-left">
-          <v-img :src="item.logoUrl || 'https://minio.citupro.com/dev/menduner/company-avatar.png'" :alt="item.anotherName" :width="40" style="height: 40px;border-radius: 4px;"/>
+          <v-img :src="item.enterprise.logoUrl || 'https://minio.citupro.com/dev/menduner/company-avatar.png'" :alt="item.enterprise.anotherName" :width="40" style="height: 40px;border-radius: 4px;"/>
         </div>
         <div class="company-info">
-          <h3 :class="{'default-active': item.active }" style="width: 200px;">{{ item.anotherName }}</h3>
-          <p>{{ item.financingName }}<span class="mx-2" v-if="item.financingName && item.industryName">|</span>{{ item.industryName }}</p>
+          <h3 :class="{'default-active': item.active }" style="width: 200px;">{{ item.enterprise.anotherName }}</h3>
+          <p>
+            {{ item.enterprise.financingName }}
+            <span class="septal-line" v-if="item.enterprise.financingName && item.enterprise.industryName"></span>
+            {{ item.enterprise.industryName }}
+          </p>
         </div>
       </div>
+      <v-divider class="mx-4"></v-divider>
       <div class="company-info-bottom">
-        <div class="bottom-tag ellipsis">
-          <span class="mr-2" v-for="(k, i) in item.welfareList" :key="i">{{ k }}</span>
+        <div v-if="item?.job && Object.keys(item.job).length" class="job-hover">
+          <div class="mb-1 d-flex">
+            <p :class="['mr-3', 'cursor-pointer', 'name']" :style="{'max-width': !item.job.payFrom && !item.job.payTo ? '200px' : '120px'}">{{ item.job.name }}</p>
+            <span v-if="!item.job.payFrom && !item.job.payTo" class="salary">面议</span>
+            <span v-else class="salary">{{ item.job.payFrom ? item.job.payFrom + '-' : '' }}{{ item.job.payTo }}{{ item.job.payName ? '/' + item.job.payName : '' }}</span>
+          </div>
+          <div style="height: 24px; overflow: hidden; color: #808080;">
+            <span v-for="(j, index) in desc" :key="index">
+              <span v-if="item.job[j]" class="mr-1 font-size-13">{{ item.job[j] }}</span>
+              <span v-if="item.job[j] && index !== desc.length - 1 && item.job[desc[index + 1]]" class="septal-line ml-1"></span>
+            </span>
+          </div>
         </div>
       </div>
     </div>
@@ -25,8 +40,10 @@ defineProps({
   list: Array
 })
 
+const desc = ['areaName', 'eduName', 'expName']
+
 const handleClickEnterprise = (item) => {
-  window.open(`/recruit/personal/company/details/${item.id}?key=briefIntroduction`)
+  window.open(`/recruit/personal/company/details/${item.enterprise.id}?key=briefIntroduction`)
 }
 </script>
 

src/views/recruit/personal/company/index.vue

@@ -31,7 +31,7 @@ import buttons from '@/views/recruit/personal/components/buttons.vue'
 import { ref } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { getEnterpriseSearch } from '@/api/enterprise'
-import { dealDictArrayData } from '@/utils/position'
+import { dealDictObjData } from '@/utils/position'
 import headSearch from '@/components/headSearch'
 import scaleType from './components/scaleType'
 import financingStatus from './components/financingStatus.vue'
@@ -80,7 +80,11 @@ const getCompanyData = async () => {
     return
   }
   total.value = number
-  items.value = dealDictArrayData([], list)
+  items.value = list.map(e => {
+    e.enterprise = dealDictObjData({}, e.enterprise)
+    if (e.jobList && e.jobList.length) e.job = dealDictObjData({}, e.jobList[0])
+    return e
+  })
 }
 
 const handleClear = () => {