Merge branch 'dev' of https://git.citupro.com/zhengnaiwen_citu/menduner into dev

src/components/PositionLongStrip/item.vue

@@ -83,8 +83,7 @@ const handlePosition = (item) => {
 .textColor666 { color: #666; }
 .positionItem {
   width: 884px;
-  margin-bottom: 20px;
-  border-radius: 12px;
+  margin-bottom: 12px;
   border-radius: 12px;
   padding: 0;
   overflow: hidden;

src/components/jobTypeCard/index.vue

@@ -32,7 +32,7 @@
         </div>
       </div>
     </v-card>
-    <v-card v-if="rightObj.show" class="card rightCardBox ml-3">
+    <v-card v-if="rightObj.show" class="card rightCardBox">
       <div class="rightCard">
         <div class="categoryName">{{ rightObj.data.nameCn }}</div>
         <div v-for="(item, index) in rightObj.data.children" :key="item.id">
@@ -47,7 +47,7 @@
         </div>
       </div>
     </v-card>
-    <v-card height="392px" v-if="isPage && !rightObj.show" class="card rightCardBox ml-3">
+    <v-card height="392px" v-if="isPage && !rightObj.show" class="card rightCardBox">
       <v-carousel show-arrows="hover" cycle>
         <v-carousel-item v-for="(item, i) in carouselList" :key="i">
           <div style="height: 392px; overflow: hidden;">
@@ -159,6 +159,7 @@ const carouselList = ref([
     }
     .rowItem { justify-content: space-between; }
   }
+  .rightCardBox { margin-left: 4px; }
   .rightCard {
     height: 242px;
     width: 525px;
@@ -235,7 +236,7 @@ const carouselList = ref([
       }
     }
   }
-  .rightCardBox { flex: 1; }
+  .rightCardBox { flex: 1; margin-left: 12px;}
   .rightCard {
     height: 384px;
     // min-width: 786px;

src/views/recruit/position/components/rightRecommend.vue

@@ -0,0 +1,113 @@
+<template>
+  <v-card class="box">
+    <h4 class="h4">推荐职位</h4>
+    <div class="content">
+      <div v-for="item, index in list " :key="index" class="itemBox">
+        <div class="left">
+          <div>{{ item.aaa }}</div>
+          <div class="textColor666 size14">{{ item.bbb }}</div>
+        </div>
+        <div class="right">
+          <div style="color: #fe574a;">{{ item.ccc }}</div>
+          <div class="textColor666 size14">{{ item.ddd }}</div>
+        </div>
+      </div>
+    </div>
+  </v-card>
+</template>
+
+<script setup>
+defineOptions({name: 'retrieval-components-recommendedPositions'})
+const list = [
+  {
+    aaa: '职位名称',
+    bbb: '公司名称',
+    ccc: '9-12K',
+    ddd: '广州·越秀区',
+  },
+  {
+    aaa: '职位名称职位名称职位名称职位名称职位名称',
+    bbb: '公司名称公司名称公司名称公司名称公司名称',
+    ccc: '9-12K',
+    ddd: '广州·越秀区-广州·越秀区广州·越秀区',
+  },
+  // {
+  //   aaa: '职位名称',
+  //   bbb: '公司名称',
+  //   ccc: '9-12K',
+  //   ddd: '广州·越秀区',
+  // },
+  // {
+  //   aaa: '职位名称',
+  //   bbb: '公司名称',
+  //   ccc: '9-12K',
+  //   ddd: '广州·越秀区',
+  // },
+  // {
+  //   aaa: '职位名称',
+  //   bbb: '公司名称',
+  //   ccc: '9-12K',
+  //   ddd: '广州·越秀区',
+  // },
+  // {
+  //   aaa: '职位名称',
+  //   bbb: '公司名称',
+  //   ccc: '9-12K',
+  //   ddd: '广州·越秀区',
+  // },
+  // {
+  //   aaa: '职位名称',
+  //   bbb: '公司名称',
+  //   ccc: '9-12K',
+  //   ddd: '广州·越秀区',
+  // },
+  {
+    aaa: '职位名称',
+    bbb: '公司名称',
+    ccc: '9-12K',
+    ddd: '广州·越秀区',
+  }
+]
+</script>
+<style lang="scss" scoped>
+.textColor666 { color: #666; }
+.size14 { font-size: 14px; }
+.box {
+  width: 100%;
+  min-height: 100px;
+  border-radius: 8px;
+  .h4 {
+    padding: 12px 16px;
+    background: linear-gradient(90deg, #f5fcfc 0, #fcfbfa 100%);
+  }
+  .content {
+    padding: 0 8px;
+    .itemBox {
+      &:hover {
+        background-color: #f3f3f3;
+      }
+      display: flex;
+      justify-content: space-between;
+      padding: 8px 16px;
+      margin: 4px 0;
+      border-radius: 8px;
+      cursor: pointer;
+      .left {
+        width: 148px;
+        margin-right: 12px;
+      }
+      .right {
+        width: calc(100% - 160px);
+        text-align: right;
+      }
+      .left, .right {
+        div {
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+      }
+    }
+  }
+}
+</style>

src/views/recruit/position/index.vue

@@ -3,17 +3,17 @@
   <div class="default-width">
     <div style="width: 100%; height: 20px;"></div>
     <v-card style="z-index: 998">
-      <div class="stickyBox my-5">
+      <div class="stickyBox my-3">
         <headSearch></headSearch>
       </div>
       <cityFilter class="mx-5 mb-3"></cityFilter>
-      <conditionFilter class="mx-5 mb-5"></conditionFilter>
+      <conditionFilter class="mx-5 mb-3"></conditionFilter>
     </v-card>
-    <div class="d-flex mt-5">
+    <div class="d-flex mt-3">
       <div class="mr-3">
         <PositionLongStrip :items="items"></PositionLongStrip>
       </div>
-      <div>右侧列表</div>
+      <rightRecommend></rightRecommend>
     </div>
     <CtPagination
       v-if="total > 0"
@@ -25,6 +25,7 @@
   </div>
 </template>
 <script setup>
+import rightRecommend from './components/rightRecommend'
 import cityFilter from './components/cityFilter'
 import conditionFilter from './components/conditionFilter'
 import headSearch from '@/components/headSearch'