精选企业

.env.localDev

@@ -4,12 +4,12 @@ VITE_NODE_ENV = 'development'
 VITE_APP_TITLE = 门墩儿
 
 # 访问路径
-VITE_ACCESS_BASE_URL = 'http://localhost:3000'
-# VITE_ACCESS_BASE_URL = 'https://www.menduner.com'
+# VITE_ACCESS_BASE_URL = 'http://localhost:3000'
+VITE_ACCESS_BASE_URL = 'https://www.menduner.com'
 
 # 请求路径
-VITE_BASE_URL = 'http://192.168.3.80'
-# VITE_BASE_URL = 'https://www.menduner.com'
+# VITE_BASE_URL = 'http://192.168.3.80'
+VITE_BASE_URL = 'https://www.menduner.com'
 
 # 预览路径
 VITE_PREVIEW_URL = 'http://192.168.3.91:8012'

src/components/Enterprise/hotPromoted.vue

@@ -3,16 +3,12 @@
     <div class="sub-li" v-for="(item, index) in list" :key="index">
       <div v-if="item">
         <!-- 公司信息 -->
-        <div class="company-info-top align-center" @click.stop="jumpToEnterpriseDetail(item.enterprise.id, false)">
+        <div class="company-info-top align-center" :class="{'elevation-5': item.active}" @click.stop="jumpToEnterpriseDetail(item.enterprise.id, false)" @mouseenter="item.active = true" @mouseleave="item.active = false">
           <div class="float-left">
             <v-img :src="item?.enterprise.logoUrl || 'https://minio.citupro.com/dev/menduner/company-avatar.png'" alt="" width="77" height="77" style="border-radius: 4px;"/>
           </div>
           <div class="company-info cursor-pointer">
             <h3 v-ellipse-tooltip>{{ formatName(item.enterprise.anotherName || item.enterprise.name) }}</h3>
-            <!-- <h3 :ref="el => { if(el) companyNameRefs[index] = el }">
-              {{ formatName(item.enterprise.anotherName || item.enterprise.name) }}
-              <v-tooltip v-if="isTextOverflow[index]" activator="parent" location="top">{{ formatName(item.enterprise.anotherName || item.enterprise.name) }}</v-tooltip>
-            </h3> -->
             <p>
               {{ item?.enterprise.scaleName }}
               <span class="septal-line" v-if="item.enterprise.industryName"></span>
@@ -20,12 +16,13 @@
             </p>
           </div>
         </div>
-        <div v-ellipse-tooltip class="px-5 py-1 ellipsis-tag" :style="{'height': '33px', 'border-bottom': item.enterprise.welfareList && item.enterprise.welfareList.length ? '1px solid #EBEBEB' : 'none'}">
-          <span class="welfareTag mr-5" v-for="(k, i) in item.enterprise.welfareList" :key="i">{{ k }}</span>
+
+        <div v-if="item?.enterprise?.welfareTagStr" style="padding: 6px 0; border-bottom: 1px solid #EBEBEB">
+          <div v-ellipse-tooltip class="px-5 welfareTag ellipsis-tag">{{ item.enterprise.welfareTagStr }}</div>
         </div>
+
         <!-- 职位列表 -->
-        <!-- :class="{'company-job-item-hover': k.active}" -->
-        <ul class="company-job-list">
+        <ul class="company-job-list pt-3">
           <li v-for="(k, i) in item.jobList" :key="i" @mouseenter="k.active = true" @mouseleave="k.active = false" @click="handleClickPosition(k)">
             <v-card :elevation="k.active ? 5 : 0" class="company-job-item cursor-pointer mb-3">
               <div class="mb-2 d-flex">
@@ -33,22 +30,22 @@
                 <span v-if="!k.payFrom && !k.payTo" class="salary">面议</span>
                 <span v-else class="salary">{{ k.payFrom ? k.payFrom + '-' : '' }}{{ k.payTo }}{{ k.payName ? '/' + k.payName : '' }}</span>
               </div>
-              <div style="height: 24px; overflow: hidden; color: #808080;">
-                <span v-for="(j, index) in desc" :key="index">
-                  <span v-if="k[j] || j === 'areaName'" class="mr-1 font-size-13">
-                    {{ j === 'areaName' ? !k.areaId ? '全国' : k.area?.str : k[j] }}
-                    <!-- {{ (j === 'areaName' && !k.areaId) ? '全国' : k[j] }} -->
+              <div class="d-flex font-size-13" style="height: 24px; overflow: hidden; color: #808080; line-height: 24px;">
+                <div class="text-truncate mr-3" style="flex: 1">
+                  <span v-for="(j, index) in desc" :key="index">
+                    <span v-if="k[j] || j === 'areaName'" class="mr-1">
+                      {{ j === 'areaName' ? !k.areaId ? '全国' : k.area?.str : k[j] }}
+                    </span>
+                    <span v-if="index !== desc.length - 1 && (k[j] || j === 'areaName') && k[desc[index + 1]]" class="septal-line ml-1"></span>
                   </span>
-                  <span v-if="index !== desc.length - 1 && (k[j] || j === 'areaName') && k[desc[index + 1]]" class="septal-line ml-1"></span>
-                  <!-- <span v-if="k[j] && index !== desc.length - 1 && (k[desc[index + 1]] || (j === 'areaName' && !k.areaId))" class="septal-line ml-1"></span> -->
-                </span>
-                <span class="font-size-13 float-right">{{ timesTampChange(k.updateTime, 'Y-M-D') }}</span>
+                </div>
+                <div style="width: 73px;">{{ timesTampChange(k.updateTime, 'Y-M-D') }}</div>
               </div>
             </v-card>
           </li>
         </ul>
-        <div class="moreBtn d-flex align-center justify-center" @click.stop="handleMoreEnterprise(item)" @mouseenter="item.active = true" @mouseleave="item.active = false">
-          <span :style="{'border-bottom': item.active ? '1px solid #fff' : 'none'}">{{ $t('position.moreBtn') }}</span>
+        <div class="moreBtn d-flex align-center justify-center" @click.stop="handleMoreEnterprise(item)">
+          <span>{{ $t('position.moreBtn') }}</span>
           <v-icon>mdi-menu-right</v-icon>
         </div>
       </div>
@@ -72,25 +69,11 @@ const props = defineProps({
 
 const router = useRouter()
 
-// const isTextOverflow = ref({})
-// const companyNameRefs = ref({})
-// 检查文本是否溢出
-// const checkTextOverflow = () => {
-//   Object.entries(companyNameRefs.value).forEach(([index, element]) => {
-//     if (element) {
-//       isTextOverflow.value[index] = element.scrollWidth > element.clientWidth
-//     }
-//   })
-// }
-
 const list = ref([])
 watch(
   () => props.items, 
   (newVal) => {
     list.value = newVal
-    // nextTick(() => {
-    //   checkTextOverflow()
-    // })
   },
   { immediate: true },
   { deep: true }
@@ -104,9 +87,9 @@ const handleClickPosition = (k) => {
 
 // 查看更多职位
 const handleMoreEnterprise = (item) => {
-  // if (!item.enterprise.id) return
-  // window.open(`/recruit/personal/company/details/${item.enterprise.id}?key=recruitmentPositions`)
-  window.open(`/recruit/personal/position?content=${item.enterprise.anotherName || item.enterprise.name}`)
+  if (!item.enterprise.id) return
+  const name = formatName(item.enterprise.anotherName || item.enterprise.name)
+  window.open(`/recruit/personal/position?content=${name.includes('&') ? encodeURIComponent(name) : name}`)
 }
 </script>
 
@@ -121,7 +104,7 @@ const handleMoreEnterprise = (item) => {
   min-width: calc((100% - 24px) / 3);
   max-width: calc((100% - 24px) / 3);
   margin: 0 12px 12px 0;
-  height: 360px + 12px;
+  height: 370px;
   border-radius: 12px;
   padding: 0;
   overflow: hidden;
@@ -145,13 +128,12 @@ const handleMoreEnterprise = (item) => {
 }
 .company-info-top {
   display: flex;
-  height: 110px;
-  padding: 16px 20px;
+  height: 90px;
+  margin: 12px 12px 0 12px;
+  padding: 0 12px;
   overflow: hidden;
   border-bottom: 1px solid #EBEBEB;
-  &:hover {
-    background-color: #f2f4f7;
-  }
+  border-radius: 8px;
 }
 .welfareTag {
   color: #CEC149;
@@ -191,9 +173,7 @@ ul li {
   height: auto;
   padding: 12px 10px;
   margin: 0;
-  // &-hover {
-  //   background-color: #f2f4f7;
-  // }
+  border-radius: 8px;
 }
 .salary {
   font-size: 16px;
@@ -207,7 +187,6 @@ ul li {
 }
 .name {
   position: relative;
-  // max-width: 200px;
   line-height: 22px;
   font-weight: 700;
   color: #404040;
@@ -226,5 +205,11 @@ ul li {
   cursor: pointer;
   font-size: 14px;
   background: linear-gradient(to right, #12ebb0, #427daa);
+  &:hover {
+    font-size: 16px;
+    span {
+      font-weight: 700;
+    }
+  }
 }
-</style>
+</style>

src/components/Position/item.vue

@@ -10,8 +10,8 @@
             </div>
           </div>
           <div class="d-flex justify-space-between align-center">
-            <div>
-              <span v-for="(j, i) in desc" :key="i" class="font-size-13" style="color: #808080;">
+            <div class="text-truncate" style="color: #808080;" :style="{'width': !item.payFrom && !item.payTo ? '290px' : '190px'}">
+              <span v-for="(j, i) in desc" :key="i" class="font-size-13" style="">
                 <span
                   v-if="item[j.value] || j.value === 'areaName'"
                   class="mr-1 d-inline-block"

src/views/recruit/personal/home/components/popularEnterprises.vue

@@ -9,7 +9,9 @@
     <HotPromoted v-if="items.length" class="mt-5" :items="items"></HotPromoted>
     <Empty v-else :elevation="false" class="mt-3" message="暂无精选企业"></Empty>
     <div v-if="items.length" class="text-center">
-      <v-btn class="buttons btnColor" color="primary" @click.stop="handleToMore">{{ $t('enterprise.moreBtn') }}</v-btn>
+      <v-hover v-slot="{ isHovering, props }">
+        <v-btn v-bind="props" v-ripple.center class="buttons btnColor" :class="isHovering ? 'elevation-10' : 'elevation-5'" @click.stop="handleToMore">{{ $t('enterprise.moreBtn') }}</v-btn>
+      </v-hover>
     </div>
   </div>
 </template>
@@ -29,6 +31,7 @@ const getHotEnterpriseList = async () => {
     let jobList = []
     const enterprise = dealDictObjData({}, e.enterprise)
     if (e.jobList && e.jobList.length) jobList = dealDictArrayData([], e.jobList).slice(0, 2)
+    if (enterprise.welfareList?.length) enterprise.welfareTagStr = enterprise.welfareList.map((element, index) => (index === 0 ? element : ('\xa0'.repeat(4)) + element)).join('');
     return { enterprise, jobList, active: false }
   })
 }