修改认证通样式

src/main/resources/static/css/activity/attestation-new.css

@@ -87,10 +87,10 @@ li{list-style:none}
         height: 48px;
         background-color: rgb(255, 255, 255);
         border-radius: 2px;
-        color: #FF5B00;
+        color: rgb(178, 178, 178);
         top: 450px;
         left: 250px;
-        border: 1px solid #FF5B00;
+        border: 1px solid #ccc;
         text-align: center;
         line-height: 48px;
         font-size: 17px;
@@ -165,13 +165,13 @@ li{list-style:none}
         background: linear-gradient(-90deg, #FFBA63, #F3920D);
     }
     .section_main.four .section_content .section_li .back .bg2{
-        background: linear-gradient(-90deg, #FFBA63, #F3920D);
+        background: linear-gradient(-90deg, #3bb5d2, #0160aa);
     }
     .section_main.four .section_content .section_li .back .bg3{
-        background: linear-gradient(-90deg, #FFBA63, #F3920D);
+        background: linear-gradient(-90deg, #1b3250, #0b1529);
     }
-    .section_main.four .section_content .section_li .back .bg4{background: linear-gradient(-90deg, #FFBA63, #F3920D);}
-    .section_main.four .section_content .section_li .back .bg5{background: linear-gradient(-90deg, #FFBA63, #F3920D);}
+    .section_main.four .section_content .section_li .back .bg4{background: linear-gradient(-90deg, #77b2d0, #4496c3);}
+    .section_main.four .section_content .section_li .back .bg5{background: linear-gradient(-90deg, #8395b3, #cddbef);}
 
     .section_main.four .section_content .section_li:hover .front{-webkit-transform: rotateY(180deg);transform: rotateY(180deg);}
     .section_main.four .section_content .section_li:hover .back{-webkit-transform: rotateY(0deg);transform: rotateY(0deg);}
@@ -361,7 +361,8 @@ li{list-style:none}
     .section_main.four .el-carousel__item .authlistH5{
         width: 48%;
         height: 48%;
-        border: 1px solid #ccc;
+        box-shadow: 0px 6px 28px 0px rgba(51,51,51,0.1);
+        margin: 1%;
         overflow: hidden;
         display: flex;
         justify-content: space-around;

src/main/resources/static/js/activity/attestation-new.js

@@ -113,7 +113,9 @@ new Vue({
         startY: '',
         moveY: '',
         moveX: '',
-        startTime: ''
+        startTime: '',
+        isActivePageLeft: false,
+        isActivePageRight: true
     },
     mounted() {
         this.initPageList = this.firstEntryList.map((item, index) => {
@@ -138,6 +140,8 @@ new Vue({
     },
     methods: {
         changePageNoLeft() {
+            this.isActivePageRight = false
+            this.isActivePageLeft = true
             this.$refs.pcSwiper.prev()
             // console.log(bool)
             // if (bool) {
@@ -151,6 +155,8 @@ new Vue({
             // }
         },
         changePageNoRight() {
+            this.isActivePageRight = true
+            this.isActivePageLeft = false
             this.$refs.pcSwiper.next()
             // if (bool) {
             //     if (this.initPageList[3].id === 4 && this.isAuthActiveNum === 3) {

src/main/resources/templates/activity/attestation-new.html

@@ -26,8 +26,8 @@
         <div class="section_main four">
 <!--            <div class="pageNoChangeLeft isActivePage" @click="changePageNoLeft( firstEntryList[0].id!== 1 || isAuthActiveNum !== 0)" v-if="isPC"><</div>-->
 <!--            <div class="pageNoChangeRight isActivePage" @click="changePageNoRight(firstEntryList[0].id === 1)" v-if="isPC">></div>-->
-            <div class="pageNoChangeLeft isActivePage" @click="changePageNoLeft" v-if="isPC"><</div>
-            <div class="pageNoChangeRight isActivePage" @click="changePageNoRight" v-if="isPC">></div>
+            <div class="pageNoChangeLeft" :class="isActivePageLeft ? 'isActivePage' : ''" @click="changePageNoLeft" v-if="isPC"><</div>
+            <div class="pageNoChangeRight" :class="isActivePageRight ? 'isActivePage' : ''" @click="changePageNoRight" v-if="isPC">></div>
             <div class="inner">
                 <div class="title">
                     <h1>正品查询快捷入口</h1>
@@ -51,34 +51,34 @@
                     <el-carousel indicator-position="outside" height="500px" ref="pcSwiper" :autoplay="false">
                         <el-carousel-item>
                             <div class="section_li li1" v-for="(item, index) in firstEntryList" :key="index" v-if="index<4" @click="changePageNoLink(index, item)">
-                                <div class="box front" :class="isAuthActiveNum === index ? 'isAuthActive' : ''">
+                                <div class="box front">
                                     <img :src="item.logo" alt="" class="icon">
-                                    <h1 :class="isAuthActiveNum === index ? 'isAuthH1' : ''">{{ item.name }}</h1>
-                                    <p><el-button :plain="true" :class="isAuthActiveNum === index ? 'isAuthBtn' : ''" @click="changePageNoLink(index, item)">立即查看</el-button></p>
+                                    <h1>{{ item.name }}</h1>
+                                    <p><el-button :plain="true" @click="changePageNoLink(index, item)">立即查看</el-button></p>
                                 </div>
                                 <div class="box back">
                                     <div :class="item.className"></div>
                                     <div class="content-box">
                                         <img :src="item.logo" alt="" class="icon">
                                         <h1>{{ item.name }}</h1>
-                                        <p><el-button @click="changePageNoLink(index, item)" :plain="true" style="background: linear-gradient(-90deg, #FFBA63, #F3920D);border: 1px solid #fff;color: #fff;">立即查看</el-button></p>
+                                        <p><el-button @click="changePageNoLink(index, item)" :plain="true" style="border: 1px solid #fff;">立即查看</el-button></p>
                                     </div>
                                 </div>
                             </div>
                         </el-carousel-item>
                         <el-carousel-item>
                             <div class="section_li li1" v-for="(item, index) in firstEntryList" :key="index" v-if="index>3" @click="changePageNoLink(index, item)">
-                                <div class="box front" :class="isAuthActiveNum === index ? 'isAuthActive' : ''">
+                                <div class="box front">
                                     <img :src="item.logo" alt="" class="icon">
                                     <h1 :class="isAuthActiveNum === index ? 'isAuthH1' : ''">{{ item.name }}</h1>
-                                    <p><el-button :plain="true" :class="isAuthActiveNum === index ? 'isAuthBtn' : ''" @click="changePageNoLink(index, item)">立即查看</el-button></p>
+                                    <p><el-button :plain="true" @click="changePageNoLink(index, item)">立即查看</el-button></p>
                                 </div>
                                 <div class="box back">
                                     <div :class="item.className"></div>
                                     <div class="content-box">
                                         <img :src="item.logo" alt="" class="icon">
                                         <h1>{{ item.name }}</h1>
-                                        <p><el-button @click="changePageNoLink(index, item)" :plain="true" style="background: linear-gradient(-90deg, #FFBA63, #F3920D);border: 1px solid #fff;color: #fff;">立即查看</el-button></p>
+                                        <p><el-button @click="changePageNoLink(index, item)" :plain="true">立即查看</el-button></p>
                                     </div>
                                 </div>
                             </div>
@@ -95,24 +95,24 @@
                         <el-carousel indicator-position="outside" ref="nop" height="600px" :autoplay="false">
                             <div @touchmove="move($event)" @touchstart="start($event)">
                                 <el-carousel-item>
-                                    <div v-for="(item, index) in firstEntryList" :key="item.id" v-if="index < 4" class="authlistH5" :class="isAuthActiveNum === index ? 'isAuthActive' : ''" @click="changePageNoLink(index, item)">
+                                    <div v-for="(item, index) in firstEntryList" :key="item.id" v-if="index < 4" class="authlistH5" @click="changePageNoLink(index, item)">
                                         <div>
                                             <img :src="item.logo" alt="" class="icon">
                                         </div>
-                                        <div :class="isAuthActiveNum === index ? 'isAuthtext' : ''">{{item.name}}</div>
+                                        <div>{{item.name}}</div>
                                         <div>
-                                            <el-button @click="changePageNoLink(index, item)" :class="isAuthActiveNum === index ? 'isAuthBtn' : ''">立即查看</el-button>
+                                            <el-button @click="changePageNoLink(index, item)">立即查看</el-button>
                                         </div>
                                     </div>
                                 </el-carousel-item>
                                 <el-carousel-item>
-                                    <div v-for="(item, index) in firstEntryList" :key="item.id" v-if="index > 3" class="authlistH5" :class="isAuthActiveNum === index ? 'isAuthActive' : ''" @click="changePageNoLink(index, item)">
+                                    <div v-for="(item, index) in firstEntryList" :key="item.id" v-if="index > 3" class="authlistH5" @click="changePageNoLink(index, item)">
                                         <div>
                                             <img :src="item.logo" alt="" class="icon">
                                         </div>
-                                        <div :class="isAuthActiveNum === index ? 'isAuthtext' : ''">{{item.name}}</div>
+                                        <div>{{item.name}}</div>
                                         <div>
-                                            <el-button @click="changePageNoLink(index, item)" :class="isAuthActiveNum === index ? 'isAuthBtn' : ''">立即查看</el-button>
+                                            <el-button @click="changePageNoLink(index, item)">立即查看</el-button>
                                         </div>
                                     </div>
                                 </el-carousel-item>