云员工入口

src/page/homepage/personability/abilityApply.vue

@@ -378,7 +378,7 @@
                 </div>
                 <!-- <div class="active7" v-if="active == 6">
                 </div> -->
-                <div class="applyIng">提交成功，等待审核</div>
+                <!-- <div class="applyIng">提交成功，等待审核</div>
                 <div class="applySuccessAll">
                     <img src="/assets/ability/applysuccess.png" alt="" />
                     审核通过
@@ -386,7 +386,7 @@
                 <div class="applyFail">
                     <img src="/assets/ability/applyFail.png" alt="" />
                     审核不通过
-                </div>
+                </div> -->
             </div>
         </div>
     </div>

src/page/homepage/personability/abilityUser.vue

@@ -1,7 +1,15 @@
 <template>
     <div class="rencaifuwu">
-        <img style="width: 100%; height: 450px; object-fit: cover" src="/assets/ability/userBanner.png" alt="" />
+        <div class="topbane">
-        <div class="content container">
+            <img style="width: 100%; height: 100%; object-fit: cover" src="/assets/ability/userBanner.png" alt="" />
+            <div class="container ruzhu">
+                <div class="ruzhuBox">
+                    <div class="ruzhuBoxtext">关键云员工，助力<span>软件测试人才</span></div>
+                    <div class="ruzhuBoxbtn" @click="goRuzhu">立即入驻</div>
+                </div>
+            </div>
+        </div>
+        <div class="content">
             <div class="titlePeo" style="margin-top: 60px; margin-bottom: 50px">
                 <div class="titletopt">
                     <img src="/assets/homepage/rihhj.png" alt="" />
@@ -73,6 +81,9 @@ export default {
         dodetail() {
             this.$router.push('/ability/detail')
         },
+        goRuzhu() {
+            this.$router.push('/ability/apply')
+        },
     },
 }
 </script>
@@ -82,6 +93,49 @@ export default {
     width: 1200px;
     margin: auto;
 }
+.topbane {
+    width: 100%;
+    height: 450px;
+    position: relative;
+}
+.ruzhu {
+    position: absolute;
+    top: 100px;
+    left: 50%;
+    transform: translateX(-50%);
+    display: flex;
+    justify-content: flex-end;
+}
+.ruzhuBox {
+    width: 532px;
+    height: 241px;
+    background: url('/assets/ability/applybanner2.png') no-repeat 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+}
+.ruzhuBoxtext {
+    font-weight: 500;
+    font-size: 30px;
+    color: #000000;
+    margin-bottom: 30px;
+}
+.ruzhuBoxtext span {
+    color: #d4393c;
+}
+.ruzhuBoxbtn {
+    width: 150px;
+    height: 40px;
+    background: linear-gradient(90deg, #6b3af8, #2080fe);
+    border-radius: 4px;
+    font-weight: 500;
+    font-size: 18px;
+    color: #f4f5f7;
+    line-height: 40px;
+    text-align: center;
+    cursor: pointer;
+}
 
 .titlePeo p {
     font-weight: bold !important;