样式修改

src/components/Enterprise/hotPromoted.vue

@@ -24,9 +24,10 @@
           <span class="welfareTag mr-5" v-for="(k, i) in item.enterprise.welfareList" :key="i">{{ k }}</span>
         </div>
         <!-- 职位列表 -->
+        <!-- :class="{'company-job-item-hover': k.active}" -->
         <ul class="company-job-list">
-          <li class="company-job-item" v-for="(k, i) in item.jobList" :key="i" :class="{'company-job-item-hover': k.active}" @mouseenter="k.active = true" @mouseleave="k.active = false" @click="handleClickPosition(k)">
-            <div class="job-info" @mouseenter="k.active = true" @mouseleave="k.active = false" @click.stop="handleClickPosition(k)">
+          <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">
                 <span v-ellipse-tooltip.top :class="['name', 'cursor-pointer', {'default-active': k.active }]" :style="{'max-width': !k.payFrom && !k.payTo ? '290px' : '200px'}">{{ formatName(k.name) }}</span>
                 <span v-if="!k.payFrom && !k.payTo" class="salary">面议</span>
@@ -43,7 +44,7 @@
                 </span>
                 <span class="font-size-13 float-right">{{ timesTampChange(k.updateTime, 'Y-M-D') }}</span>
               </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">
@@ -120,7 +121,7 @@ const handleMoreEnterprise = (item) => {
   min-width: calc((100% - 24px) / 3);
   max-width: calc((100% - 24px) / 3);
   margin: 0 12px 12px 0;
-  height: 360px;
+  height: 360px + 12px;
   border-radius: 12px;
   padding: 0;
   overflow: hidden;
@@ -180,7 +181,7 @@ const handleMoreEnterprise = (item) => {
   line-height: 18px;
 }
 .company-job-list {
-  padding: 4px 20px 12px;
+  padding: 4px 10px 12px;
 }
 ul li {
   list-style: none
@@ -188,11 +189,11 @@ ul li {
 .company-job-item {
   display: block;
   height: auto;
-  padding: 12px 0;
+  padding: 12px 10px;
   margin: 0;
-  &-hover {
-    background-color: #f2f4f7;
-  }
+  // &-hover {
+  //   background-color: #f2f4f7;
+  // }
 }
 .salary {
   font-size: 16px;