update1

components/common/applyBtn.vue

@@ -48,4 +48,13 @@ export default {
     padding: 0;text-align: center;font-size: 14px;
   }
 }
+
+
+.appley-btn.shouye {
+  height: 55px;
+  width: 180px;
+  line-height: 55px;
+  color: #00b96b;
+  background: #fff;
+}
 </style>

pages/index.vue

@@ -13,8 +13,9 @@
                class="index-carousel-box">
             <div class="client-container">
               <div class="banner-btn-groups" :class="[`btn-${index}`]">
-                <freeTrialBtn class="free-train-btn btn-item shouye" myType="kaoshi" :select="true" v-if="index !==3"
+                <freeTrialBtn class="free-train-btn btn-item shouye" myType="kaoshi" :select="true" v-if="index < 2"
                               @need-select="onNeedSelect"/>
+                <applyBtn class="apply-btn btn-item shouye" v-else  @active-pc="onApplyBtnActive" />
                 <onlineInformationBtn class="online-information-btn btn-item shouye"/>
               </div>
             </div>
@@ -513,13 +514,15 @@ export default {
 
 .banner-btn-groups.btn-0 {
   .free-train-btn {
-    background: #ffbb1a;
-    color: #fff;
+    background: #fff;
+    color: #93C751;
+    border-radius: 50px;
   }
 
   .online-information-btn {
-    background: #3dd281;
+    background: #93C751;
     color: #fff;
+    border-radius: 50px;
     border-color: #fff;
   }
 
@@ -528,13 +531,15 @@ export default {
 .banner-btn-groups.btn-1 {
 
   .free-train-btn {
-    background: #ffbb1a;
-    color: #fff;
+    background: #fff;
+    border-radius: 50px;
+    color: #40d486;
   }
 
   .online-information-btn {
-    background: #2a846a;
+    background: #40d486;
     color: #fff;
+    border-radius: 50px;
     border-color: #fff;
   }
 
@@ -543,14 +548,16 @@ export default {
 .banner-btn-groups.btn-2 {
   top: 444px;
 
-  .free-train-btn {
-    background: #ffbb1a;
-    color: #fff;
+  .apply-btn {
+    background: #fff;
+    border-radius: 50px;
+    color: #2a846a;
   }
 
   .online-information-btn {
-    background: #8ec754;
+    background: #2a8469;
     color: #fff;
+    border-radius: 50px;
     border-color: #fff;
   }
 }
@@ -558,10 +565,16 @@ export default {
 .banner-btn-groups.btn-3 {
   top: 470px;
 
+  .apply-btn {
+    background: #ffbb1a;
+    border-radius: 50px;
+    color: #fff;
+  }
+
   .online-information-btn {
-    background: #3ef897;
-    color: #007e37;
-    border-color: #3ef897;
+    background: #8ec754;
+    color: #fff;
+    border-color: #fff;
   }
 }
 </style>