Merge branch 'developerB' into developerA

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

@@ -80,19 +80,19 @@ li{list-style:none}
     .section_main.three .section_content .text-right:hover p{opacity: 1;}
     .section_main.three .section_content .text-right:hover .text-ti-a{border: 1px solid #FFFFFF;opacity: 1;}
     /*section_main 04*/
-    .section_main.four{height: 838px;background-color: #FFFFFF;padding: 100px 0;position: relative}
+    .section_main.four{height: 700px;background-color: #FFFFFF;padding: 50px 0;}
     .section_main.four .el-carousel__arrow{
         display: none;
     }
+    .el-carousel--horizontal{
+        width: 950px;
+    }
     .section_main.four .pageNoChangeLeft {
-        position: absolute;
         width: 40px;
         height: 48px;
         background-color: rgb(255, 255, 255);
         border-radius: 2px;
         color: rgb(178, 178, 178);
-        top: 450px;
-        left: 250px;
         border: 1px solid #ccc;
         text-align: center;
         line-height: 48px;
@@ -100,14 +100,11 @@ li{list-style:none}
         cursor: pointer;
     }
     .section_main.four .pageNoChangeRight {
-        position: absolute;
         width: 40px;
         height: 48px;
         background-color: rgb(255, 255, 255);
         border-radius: 2px;
         color: rgb(178, 178, 178);
-        top: 450px;
-        right: 250px;
         border: 1px solid #ccc;
         text-align: center;
         line-height: 48px;
@@ -118,10 +115,10 @@ li{list-style:none}
         color: #FF5B00;
         border: 1px solid #FF5B00;
     }
-    .section_main.four .title{width: 100%;margin-bottom: 100px;}
+    .section_main.four .title{width: 100%;margin-bottom: 50px;}
 
     .section_main.four .title h1{line-height: 40px;text-align: center;font-size: 40px;color: #333333;font-weight: normal;}
-    .section_main.four .section_content{width: 100%;height: 460px;-webkit-box-sizing: border-box;box-sizing: border-box;}
+    .section_main.four .section_content{width: 100%;height: 460px;-webkit-box-sizing: border-box;box-sizing: border-box;display: flex;justify-content: space-between;align-items: center}
     .section_main.four .section_content .authlist {
         cursor: pointer;
         width: 8px;
@@ -364,21 +361,37 @@ li{list-style:none}
         padding: 0 0%;
         justify-content: space-between;
     }
-    .section_main.four .el-carousel__item .authlistH5{
-        width: 48%;
-        height: 48%;
-        box-shadow: 0px 6px 28px 0px rgba(51,51,51,0.1);
-        margin: 1%;
-        overflow: hidden;
+    .section_main.four .authlistH5{
+        padding: 3vw;
+        background: #F3F5F6;
+        border-radius: 4px;
+        margin-bottom: 10px;
         display: flex;
-        justify-content: space-around;
-        flex-direction: column;
+        justify-content: space-between;
+        align-items: center;
+    }
+    .section_main.four .authlistH5 .authlistH5_img{
+        width: 20vw;
+    }
+    .section_main.four .authlistH5 .authlistH5_text{
+        font-weight: bold;
+        width: 32vw;
+        height: 8vh;
+    }
+    .section_main.four .authlistH5 .authlistH5_btn {
+        background: #FF5B00;
+        color: white;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        width: 20vw;
+        height: 4vh;
+        border-radius: 4px;
     }
     .section_main.four .el-carousel__item .authlistH5 .icon {
         border-radius: 50%;
         border: 1px solid #ccc;
-        width: 18vw;
-        padding: 3vw;
+        width: 3vw;
         background: #fff;
     }
     .section_main.four .el-carousel__item .isAuthActive {
@@ -387,19 +400,14 @@ li{list-style:none}
     .section_main.four .el-carousel__item .authlistH5 .isAuthtext {
         color: #fff;
     }
-    .section_main.four .el-carousel__item .authlistH5 div{
-        display: flex;
-        justify-content: center;
-        align-items: center;
-    }
     .section_main.four .el-carousel__item .authlistH5 div .isAuthBtn {
         background: linear-gradient(-90deg, #FFBA63, #F3920D);
         border: 1px solid #fff;
         color: #fff !important;
     }
-    .section_main.four .title{width: 100%;margin-bottom: 8vw;}
+    .section_main.four .title{width: 100%;}
     .section_main.four .title h1{line-height: 4.9vw;text-align: center;font-size: 4.8vw;color: #333333;font-weight: normal;}
-    .section_main.four .section_content{width: 100%;height:auto;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 7vw;}
+    .section_main.four .section_content{width: 100%;height:auto;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 5vw 7vw;}
     .section_main.four .section_content .section_li{width: 100%;height: 40vw;border-bottom: 1px solid #E1E1E1;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 12vw;}
     .section_main.four .section_content .section_li:last-child{border-bottom: none;}
     .section_main.four .section_content .section_li .li_icon{width:18.8vw;height: 40vw;float: left;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 10vw 0;margin-right: 9vw;}

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

@@ -24,31 +24,13 @@
             </div>
         </div>
         <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" :class="isActivePageLeft ? 'isActivePage' : ''" @click="changePageNoLeft" v-if="isPC" v-cloak><</div>
-            <div class="pageNoChangeRight" :class="isActivePageRight ? 'isActivePage' : ''" @click="changePageNoRight" v-if="isPC" v-cloak>></div>
             <div class="inner">
                 <div class="title">
                     <h1>正品查询快捷入口</h1>
                 </div>
                 <div class="section_content clear" v-if="isPC">
-<!--                    <div class="section_li li1" v-for="(item, index) in initPageList" :key="index" v-if="index<4" @click="changePageNoLink(index, item)">-->
-<!--                        <div class="box front" :class="isAuthActiveNum === index ? 'isAuthActive' : ''">-->
-<!--                            <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>-->
-<!--                        </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>-->
-<!--                            </div>-->
-<!--                        </div>-->
-<!--                    </div>-->
-                    <el-carousel indicator-position="outside" height="500px" ref="pcSwiper" :autoplay="false" v-if="firstEntryList">
+                    <div class="pageNoChangeLeft" :class="isActivePageLeft ? 'isActivePage' : ''" @click="changePageNoLeft" v-if="isPC" v-cloak><</div>
+                    <el-carousel indicator-position="outside" height="450px" ref="pcSwiper" :autoplay="false" v-if="firstEntryList">
                         <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">
@@ -82,42 +64,26 @@
                                     </div>
                                 </div>
                             </div>
+                            <div class="section_li li1"></div>
+                            <div class="section_li li1"></div>
+                            <div class="section_li li1"></div>
                         </el-carousel-item>
                     </el-carousel>
+                    <div class="pageNoChangeRight" :class="isActivePageRight ? 'isActivePage' : ''" @click="changePageNoRight" v-if="isPC" v-cloak>></div>
                 </div>
-<!--                <div class="pageNum" style="height: 100px;display: flex;justify-content: center;align-items: center" v-if="isPC">-->
-<!--                    <div class="pageNum-box" style="height: 10px;display: flex;justify-content: space-around;width: 100px;">-->
-<!--                        <span @click="changePageNo(index)" @mouseover="changePageNo(index)" :style="{cursor: 'pointer',width: '8px',height: '8px',backgroundColor: isAuthActiveNum === index ? '#FF5B00' : '#FF990066',borderRadius: '50%',transition: '1s'}" v-if="index<4" v-for="(item, index) in firstEntryList" :key="index"></span>-->
-<!--                    </div>-->
-<!--                </div>-->
                 <div class="section_content" v-if="!isPC">
                     <div v-if="firstEntryList">
-                        <el-carousel indicator-position="outside" ref="nop" height="600px" :autoplay="false">
-                            <div @touchmove="move($event)" @touchstart="start($event)" v-if="firstEntryList">
-                                <el-carousel-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 v-cloak>{{item.name}}</div>
-                                        <div>
-                                            <el-button @click="changePageNoLink(index, item)" v-cloak>立即查看</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" @click="changePageNoLink(index, item)">
-                                        <div>
-                                            <img :src="item.logo" alt="" class="icon">
-                                        </div>
-                                        <div v-cloak>{{item.name}}</div>
-                                        <div>
-                                            <el-button @click="changePageNoLink(index, item)" v-cloak>立即查看</el-button>
-                                        </div>
-                                    </div>
-                                </el-carousel-item>
+                        <div v-for="(item, index) in firstEntryList" :key="item.id" class="authlistH5" @click="changePageNoLink(index, item)">
+                            <div class="authlistH5_img">
+                                <img :src="item.logo" alt="" class="icon">
+                            </div>
+                            <div v-cloak class="authlistH5_text">
+                                <div>{{item.name}}</div>
+                            </div>
+                            <div @click="changePageNoLink(index, item)" v-cloak class="authlistH5_btn">
+                                <span>立即查看</span>
                             </div>
-                        </el-carousel>
+                        </div>
                     </div>
                 </div>
             </div>