Merge branch 'developerB' into developer

src/main/java/com/caimei/www/controller/unlimited/ProductController.java

@@ -43,7 +43,8 @@ public class ProductController extends BaseController {
     private static final String ACTIVITY_TOP_PATH = "activity/activityTopic";
     private static final String CLOUD_BEAUTY_PATH = "activity/beautyTopic";
     private static final String ACTIVITY_COUPON_EXP = "activity/couponExp";
-    private static final String ACTIVITY_ATTESTAION = "activity/attestation";
+    private static final String ACTIVITY_ATTESTAION = "activity/attestation-new";
+    private static final String ACTIVITY_ATTESTAION_NEW = "activity/attestation";
     private static final String ACTIVITY_APPROVE_IFRAME = "activity/approveIframe.html";
     /**
      * 优惠券活动商品列表
@@ -385,6 +386,14 @@ public class ProductController extends BaseController {
         return ACTIVITY_ATTESTAION;
     }
 
+    /**
+     *
+     */
+    @GetMapping("/attestation-new.html")
+    public String getAttestationNewPath() {
+        return ACTIVITY_ATTESTAION_NEW;
+    }
+
     /**
      * H5配套商品页
      */

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

@@ -0,0 +1,502 @@
+@charset "utf-8";
+li{list-style:none}
+/**
+ * PC端
+ */
+@media screen and (min-width:768px){
+    .el-carousel__item {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+    }
+    .el-carousel__item h3 {
+        color: #475669;
+        font-size: 14px;
+        opacity: 0.75;
+        line-height: 200px;
+        margin: 0;
+    }
+    .el-carousel__indicator--horizontal .el-carousel__button {
+        width: 6px;
+        height: 6px;
+        background: transparent;
+        background: rgba(255, 111, 0, 0.45);
+        border-radius: 50%;
+        opacity: 1;
+    }
+    .el-carousel__indicator--horizontal.is-active .el-carousel__button{
+        width: 6px;
+        height: 6px;
+        background: #FF5B00;
+        border-radius: 50%;
+        opacity: 1;
+    }
+    .section_banner{width: 100%;height: 420px;background: url("/img/activity/attestation/Authentication-new.png");background-size: cover;-webkit-box-sizing: border-box;box-sizing: border-box;padding-top: 140px;}
+    .section_banner h1{font-size: 60px;line-height: 36px;margin-bottom: 30px;text-align: center;color: #FFFFFF;}
+    .section_banner p{font-size: 36px;line-height: 36px;margin-bottom: 30px;text-align: center;color: #FFFFFF;}
+    .section{width: 100%;}
+    .inner{width: 1200px;margin: 0 auto;}
+    .section_main{width: 100%;-webkit-box-sizing: border-box;box-sizing: border-box;}
+    /*section_main 01*/
+    .section_main.one{height: 723px;background-color: #FFFFFF;padding: 80px 0;}
+    .section_main.one .title{width: 100%;margin-bottom: 80px;}
+    .section_main.one .title h1{line-height: 40px;text-align: center;font-size: 40px;color: #333333;font-weight: normal;}
+    .section_main.one .section_content{width: 100%;height: 404px;-webkit-box-sizing: border-box;box-sizing: border-box;}
+    .section_main.one .section_content .image{width: 568px;height: 404px;float: left;}
+    .section_main.one .section_content .image img{width: 100%;height: 100%;display: block;}
+    .section_main.one .section_content .text{width: 476px;height: 100%;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 62px 0 0 0;float: right;}
+    .section_main.one .section_content .text .h1{font-size: 28px;line-height: 36px;color: #464646;text-align: justify;margin-bottom: 52px;}
+    .section_main.one .section_content .text p{font-size: 16px;line-height: 32px;color: #707070;padding-left: 10px;position: relative;}
+    .section_main.one .section_content .text p:before{content: '';width: 6px;height: 6px;background-color: #D4D4D4;position: absolute;left: 0;top: 13px;border-radius: 50%;}
+    /*section_main 02*/
+    .section_main.two{height: 560px;background-color: #FFF8F9;padding: 98px 0;}
+    .section_main.two .title{width: 100%;margin-bottom: 115px;}
+    .section_main.two .title h1{line-height: 40px;text-align: center;font-size: 40px;color: #333333;font-weight: normal;}
+    .section_main.two .title p{line-height: 40px;text-align: center;font-size: 16px;color: #707070;font-weight: normal;}
+    .section_main.two .section_content{width: 100%;height: 140px;-webkit-box-sizing: border-box;box-sizing: border-box;}
+    .section_main.two .section_content .section_li{width: 100px;height: 140px;float: left;margin: 0 100px;}
+    .section_main.two .section_content .section_li .li_icon{width: 100px;height: 100px;display: block;margin-bottom: 30px;}
+    .section_main.two .section_content .section_li p{line-height: 20px;font-size: 20px;color: #333333;text-align: center;}
+    /*section_main 03*/
+    .section_main.three{height: 720px;background: url("/img/activity/attestation/section_image_bg.png");background-size: cover;padding: 100px 0;}
+    .section_main.three .title{width: 100%;margin-bottom: 106px;}
+    .section_main.three .title h1{line-height: 40px;text-align: center;font-size: 40px;color: #FFFFFF;font-weight: normal;}
+    .section_main.three .section_content{width: 100%;height: auto;-webkit-box-sizing: border-box;box-sizing: border-box;}
+    .section_main.three .section_content .text-left{width:757px;float: left;}
+    .section_main.three .section_content .text-right{width:443px;float: left;}
+    .section_main.three .section_content .text-left .text-ti{width:100%;height:62px;margin-bottom: 84px;}
+    .section_main.three .section_content .text-left .text-ti-a{width:200px;height:62px;-webkit-box-sizing:border-box;box-sizing:border-box;float: left;border: 1px solid transparent;margin-left: 48px;text-align: center;line-height: 60px;font-size: 24px;color: #FFFFFF;opacity: 0.7;-o-transition: all .4s;-webkit-transition: all .4s;transition: all .4s;}
+    .section_main.three .section_content .text-left p{width: 100%;padding-left: 46px;height: 23px;line-height: 23px;font-size: 18px;color: #FFFFFF;position: relative;margin-bottom: 66px;opacity: 0.7;-o-transition: all .4s;-webkit-transition: all .4s;transition: all .4s;}
+    .section_main.three .section_content .text-left p:before{content: '';width: 23px;height: 23px;background: url(/img/activity/attestation/section_icon_x.png);position: absolute;left: 0;top: 0;border-radius: 50%;}
+    .section_main.three .section_content .text-right .text-ti{width:100%;height:62px;margin-bottom: 84px;}
+    .section_main.three .section_content .text-right .text-ti-a{width:200px;height:62px;-webkit-box-sizing:border-box;box-sizing:border-box;float: left;border: 1px solid transparent;margin-left: 48px;text-align: center;line-height: 62px;font-size: 24px;color: #FFFFFF;opacity: 0.7;-o-transition: all .4s;-webkit-transition: all .4s;transition: all .4s;}
+    .section_main.three .section_content .text-right p{width: 100%;padding-left: 46px;height: 23px;line-height: 23px;font-size: 18px;color: #FFFFFF;position: relative;margin-bottom: 66px;opacity: 0.7;-o-transition: all .4s;-webkit-transition: all .4s;transition: all .4s;}
+    .section_main.three .section_content .text-right p:before{content: '';width: 23px;height: 23px;background: url(/img/activity/attestation/section_icon_d.png);position: absolute;left: 0;top: 0;border-radius: 50%;}
+    .section_main.three .section_content .text-left:hover p{opacity: 1;}
+    .section_main.three .section_content .text-left:hover .text-ti-a{border: 1px solid #FFFFFF;opacity: 1;}
+    .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 .el-carousel__arrow{
+        display: none;
+    }
+    .section_main.four .pageNoChangeLeft {
+        position: absolute;
+        width: 40px;
+        height: 48px;
+        background-color: rgb(255, 255, 255);
+        border-radius: 2px;
+        color: #FF5B00;
+        top: 450px;
+        left: 250px;
+        border: 1px solid #FF5B00;
+        text-align: center;
+        line-height: 48px;
+        font-size: 17px;
+        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;
+        font-size: 17px;
+        cursor: pointer;
+    }
+    .section_main.four .isActivePage {
+        color: #FF5B00;
+        border: 1px solid #FF5B00;
+    }
+    .section_main.four .title{width: 100%;margin-bottom: 100px;}
+
+    .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 .authlist {
+        cursor: pointer;
+        width: 8px;
+        height: 8px;
+        background: #FF990066;
+        border-radius: 50%;
+    }
+    .section_main.four .section_content .isAuthlist {
+        background: #FF5B00;
+        cursor: pointer;
+        width: 8px;
+        height: 8px;
+        border-radius: 50%;
+    }
+    .section_main.four .section_content .section_li{width: 288px;height: 380px;float: left;position: relative;margin-right: 15px;-webkit-box-sizing: border-box;box-sizing: border-box;border-radius: 4px;float: left; vertical-align: top;-webkit-perspective: 1000px;perspective: 1000px;}
+    .section_main.four .section_content .section_li:last-child{margin-right: 0;}
+    .section_main.four .section_content .section_li .box{position: absolute;height: 100%;width: 100%;-webkit-backface-visibility: hidden;backface-visibility: hidden;-webkit-transform-style: preserve-3d;transform-style: preserve-3d;-webkit-transition: ease-in-out 600ms;-o-transition: ease-in-out 600ms;transition: ease-in-out 600ms;}
+    .section_main.four .section_content .section_li .bg{width: 100%;height: 380px;background-size: 100% 100%;}
+    .section_main.four .section_content .section_li .front{-webkit-box-sizing: border-box;box-sizing: border-box;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-around;border:1px solid #D4D4D4;border-radius: 4px;padding: 32px 0;}
+    .section_main.four .section_content .section_li .front .icon{width: 100px;height: 100px;display: block;margin: 0 auto;border-radius: 50%;border: 1px solid #cccccc;}
+    .section_main.four .section_content .section_li .front h1{line-height: 20px;font-size: 20px;text-align: center;font-weight: normal;color: #333333;}
+    .section_main.four .section_content .section_li .front p{text-align: center;font-size: 20px;line-height: 20px;color: #333333;}
+    .section_main.four .section_content .section_li .front .isAuthH1 {
+        line-height: 20px;font-size: 20px;text-align: center;color: #FFFFFF;font-weight: normal;
+    }
+    .section_main.four .section_content .section_li .front .isAuthBtn {
+        background: linear-gradient(-90deg, #FFBA63, #F3920D);border: 1px solid #fff;color: #fff;
+    }
+    .section_main.four .section_content .section_li .back{-webkit-transform: rotateY(-180deg);transform: rotateY(-180deg);}
+    .section_main.four .section_content .section_li .back .content-box{width: 100%;height: 100%;position: absolute;top: 0;left: 0;-webkit-box-sizing: border-box;box-sizing: border-box;display: flex;flex-direction: column;justify-content: space-around;padding: 32px 0;}
+    .section_main.four .section_content .section_li .back .content-box h1{line-height: 20px;font-size: 20px;text-align: center;color: #FFFFFF;font-weight: normal;}
+    .section_main.four .section_content .section_li .back .content-box .line{width: 32px;height: 2px;background: #FFFFFF;margin: 0 auto;}
+    .section_main.four .section_content .section_li .back .content-box p{line-height: 20px;font-size: 16px;text-align: center;color: #FFFFFF;}
+    .section_main.four .section_content .section_li .back .content-box .icon {
+        width: 100px;height: 100px;display: block;margin: 0 auto;border-radius: 50%;border: 1px solid #cccccc;
+    }
+    .section_main.four .section_content .section_li .isAuthActive {
+        background: linear-gradient(-90deg, #FFBA63, #F3920D);
+    }
+    .section_main.four .section_content .section_li .back .bg1{
+        background: linear-gradient(-90deg, #FFBA63, #F3920D);
+    }
+    .section_main.four .section_content .section_li .back .bg2{
+        background: linear-gradient(-90deg, #FFBA63, #F3920D);
+    }
+    .section_main.four .section_content .section_li .back .bg3{
+        background: linear-gradient(-90deg, #FFBA63, #F3920D);
+    }
+    .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: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);}
+    /*section_main 05*/
+    .section_main.five{height: 700px;background: #F7F7F7;padding: 100px 0;}
+    .section_main.five .title{width: 100%;margin-bottom: 106px;}
+    .section_main.five .title h1{line-height: 40px;text-align: center;font-size: 40px;color: #333333;font-weight: normal;}
+    .section_main.five .section_content{width: 100%;height: 333px;-webkit-box-sizing: border-box;box-sizing: border-box;}
+    .section_main.five .section_content .text-left{width:632px;float: left;margin-right: 234px;}
+    .section_main.five .section_content .text-left img{width:632px;height: 333px;display: block;-webkit-transform-style: preserve-3d;transform-style: preserve-3d;-webkit-transition: ease-in-out 400ms;-o-transition: ease-in-out 400ms;transition: ease-in-out 400ms;}
+    .section_main.five .section_content .text-right{float: left;-webkit-box-sizing: border-box;box-sizing: border-box;padding-top: 90px;}
+    .section_main.five .section_content .text-right .text-right-text{width: 325px;height: 123px;position: relative;}
+    .section_main.five .section_content .text-right .text-right-text img{width: 130px;height: 123px;display: block;}
+    .section_main.five .section_content .text-right .text-right-text .p{line-height: 28px;font-size: 28px;text-align: center;color: #464646;position: absolute;top: 45px;right: 0;}
+    .section_main.five .section_content:hover .text-left img{-webkit-transform: translateY(-20px);-ms-transform: translateY(-20px);transform: translateY(-20px);}
+    /*section_main 06*/
+    .section_main.six{height: 700px;background: #FFFFFF;padding: 115px 0;}
+    .section_main.six .section_content{width: 100%;height: 467px;-webkit-box-sizing: border-box;box-sizing: border-box;}
+    .section_main.six .section_content .text-left{float: left;-webkit-box-sizing: border-box;box-sizing: border-box;padding-top: 130px;}
+    .section_main.six .section_content .text-left .text-right-text{width: 325px;height: 123px;position: relative;}
+    .section_main.six .section_content .text-left .text-right-text img{width: 148px;height: 123px;display: block;}
+    .section_main.six .section_content .text-left .text-right-text .p{line-height: 28px;font-size: 28px;text-align: center;color: #464646;position: absolute;top: 45px;right: 0;}
+    .section_main.six .section_content .text-right{width:633px;float: right;}
+    .section_main.six .section_content .text-right img{width:632px;height: 467px;display: block;-webkit-transform-style: preserve-3d;transform-style: preserve-3d;-webkit-transition: ease-in-out 400ms;-o-transition: ease-in-out 400ms;transition: ease-in-out 400ms;}
+    .section_main.six .section_content:hover .text-right img{-webkit-transform: translateY(-20px);-ms-transform: translateY(-20px);transform: translateY(-20px);}
+    /*section_main 07*/
+    .section_main.seven{height: 700px;background: #F7F7F7;padding: 100px 0;}
+    .section_main.seven .section_content{width: 100%;height: 497px;-webkit-box-sizing: border-box;box-sizing: border-box;}
+    .section_main.seven .section_content .text-left{width:697px;float: left;margin-right: 176px;}
+    .section_main.seven .section_content .text-left img{width:697px;height: 497px;display: block;-webkit-transform-style: preserve-3d;transform-style: preserve-3d;-webkit-transition: ease-in-out 400ms;-o-transition: ease-in-out 400ms;transition: ease-in-out 400ms;}
+    .section_main.seven .section_content .text-right{float: left;-webkit-box-sizing: border-box;box-sizing: border-box;padding-top: 162px;}
+    .section_main.seven .section_content .text-right .text-right-text{width: 325px;height: 123px;position: relative;}
+    .section_main.seven .section_content .text-right .text-right-text img{width: 146px;height: 123px;display: block;}
+    .section_main.seven .section_content .text-right .text-right-text .p{line-height: 28px;font-size: 28px;text-align: center;color: #464646;position: absolute;top: 45px;right: 0;}
+    .section_main.seven .section_content:hover .text-left img{-webkit-transform: translateY(-20px);-ms-transform: translateY(-20px);transform: translateY(-20px);}
+    /*section_main 08*/
+    .section_main.eight{height: 0;background: #FFFFFF;padding: 0;}
+    .section_main.eight .title{width: 100%;margin-bottom: 71px;}
+    .section_main.eight .title h1{line-height: 40px;text-align: center;font-size: 40px;color: #333333;font-weight: normal;}
+    .section_main.eight .section_content{width: 100%;height: 483px;-webkit-box-sizing: border-box;box-sizing: border-box;}
+    .section_main.eight .section_content img{width:987px;height: 483px;display: block;margin: 0 auto;-webkit-transform-style: preserve-3d;transform-style: preserve-3d;-webkit-transition: ease-in-out 400ms;-o-transition: ease-in-out 400ms;transition: ease-in-out 400ms;}
+    .section_main.eight .section_content:hover img{-webkit-transform: translateY(-20px);-ms-transform: translateY(-20px);transform: translateY(-20px);}
+    /*section_main 09*/
+    .section_main.nine{background: #F7F7F7;padding: 79px 0;}
+    .section_main.nine .title{width: 100%;margin-bottom: 99px;}
+    .section_main.nine .title h1{line-height: 40px;text-align: center;font-size: 40px;color: #333333;font-weight: normal;}
+    .section_main.nine .title h1 span{ font-size: 24px;color: #999; }
+    .section_main.nine .section_content{width: 100%;-webkit-box-sizing: border-box;box-sizing: border-box;height: 160px;}
+    .section_main.nine .section_content .section_li{position: relative; width: 390px;height: 160px;-webkit-box-sizing: border-box;box-sizing: border-box;margin-right: 15px;margin-bottom: 15px;background-color: #FFFFFF;padding: 20px;-webkit-transition: all .4s;-o-transition: all .4s;transition: all .4s;border-bottom-width: 1px;border-bottom-color: #fff;border-bottom-style: solid; cursor: pointer;}
+    /*.section_main.nine .section_content .section_li:nth-child(3n){margin-right: 0;}*/
+    .section_main.nine .section_content .section_li img{float: left; width: 120px;height: 120px;display: block;border-radius: 50%;border: 1px solid #F5F5F5;}
+    .section_main.nine .section_content .section_li .content{ float: left ;margin-left: 18px; width: 208px;}
+    .section_main.nine .section_content .section_li .icon-marks{display: block; width: 40px;height: 40px;background: url(/img/activity/attestation/icon-marks.png) no-repeat center;background-size: 40px;}
+    .section_main.nine .section_content .section_li .name{font-size: 16px;color: #333;line-height: 1.6em;margin-top: 20px; width: 100%; word-break: break-all; text-align: left; -webkit-transition: color .2s; -o-transition: color .2s; transition: color .2s}
+    .section_main.nine .section_content .section_li:hover { -webkit-transform: translateY(-15px); -ms-transform: translateY(-15px); transform: translateY(-15px);border-bottom-color: #BC1724}
+    .section_main.nine .section_content .section_li:hover .name{color: #BC1724}
+    .section_main.nine .section_content .section_li:hover .icon-marks{ background-image: url("/img/activity/attestation/icon-marks-active.png")}
+    .section_main.nine .section_content.mobile{display: none !important;}
+    /*section_main 10*/
+    .section_main.ten{ background: #fff; padding: 0; }
+    .section_main.ten .title{width: 100%;margin-bottom: 99px;}
+    .section_main.ten .title h1{line-height: 40px;text-align: center;font-size: 40px;color: #333333;font-weight: normal;}
+    .section_main.ten .section_content{width: 100%;-webkit-box-sizing: border-box;box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}
+    .section_main.ten .section_content .section_li{ display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 288px; height: 218px; /*float: left ;margin:0 16px 16px 0;*/background-size: 288px;background-repeat: no-repeat; -webkit-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s;cursor: pointer}
+    .section_main.ten .section_content .section_li .logo{ width: 98px;height: 98px;margin-bottom: 28px;border-radius: 50%; }
+    .section_main.ten .section_content .section_li .name{ font-size: 20px; color: #fff }
+    /*.section_main.ten .section_content .section_li:nth-child(1){background-image: url("/img/activity/attestation/section_bg_club_01.png");margin-right: 80px; }*/
+    .section_main.ten .section_content .section_li:nth-child(1){background-image: url("/img/activity/attestation/section_bg_device_03.png"); margin-right: 16px;}
+    .section_main.ten .section_content .section_li:nth-child(2){background-image: url("/img/activity/attestation/section_bg_device_01.png"); margin-right: 16px;}
+    .section_main.ten .section_content .section_li:nth-child(3){background-image: url("/img/activity/attestation/section_bg_device_02.png"); margin-right: 16px;}
+    .section_main.ten .section_content .section_li:nth-child(4){background-image: url("/img/activity/attestation/section_bg_device_04.png"); }
+    .section_main.ten .section_content .section_li:hover { -webkit-transform: translateY(-15px); -ms-transform: translateY(-15px); transform: translateY(-15px);border-bottom-color: #BC1724}
+    .section_main.ten .section_content.mobile{display: none !important; }
+    /*侧边栏-联系我们*/
+    .section-tel{width: 52px;height: 92px;position: fixed;right: 0;top: 50%;z-index: 99;border-radius: 2px;-webkit-box-shadow: 0px 2px 12px 0px rgba(43, 43, 43, 0.1);box-shadow: 0px 2px 12px 0px rgba(43, 43, 43, 0.1);}
+    .section-tel .box{width: 52px;height: 46px;background: #FFFFFF;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 9px 12px;cursor: pointer;position: relative;}
+    .section-tel .box .code{width: 27px;height: 27px;background:#FFFFFF url("/img/activity/attestation/code_1.png");background-size: cover;-o-transition: all .1s;-webkit-transition: all .1s;transition: all .1s;}
+    .section-tel .box .tel{width: 26px;height: 28px;background:#FFFFFF url("/img/activity/attestation/phone_1.png");background-size: cover;-o-transition: all .1s;-webkit-transition: all .1s;transition: all .1s;}
+    .section-tel .box .box-code{width: 148px;height: 170px;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 17px 24px;background-color:#FFFFFF;position: absolute;left: -173px;top: -78px;display: none;-o-transition: all .4s;-webkit-transition: all .4s;transition: all .4s;border-radius: 4px;-webkit-box-shadow: 0px 2px 12px 0px rgba(43, 43, 43, 0.1);box-shadow: 0px 2px 12px 0px rgba(43, 43, 43, 0.1);}
+    .section-tel .box .box-code:before{content: '';width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:10px solid #FFFFFF;position: absolute;right:-10px;top: 50%;}
+    .section-tel .box .box-code p{text-align: center;line-height: 20px;font-size: 14px;color: #333333;margin-bottom: 12px;}
+    .section-tel .box .box-code img{width: 100px;height: 100px;display: block;}
+    .section-tel .box .box-tel{width: 180px;height: 70px;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 20px 10px;background-color: #FFFFFF;position: absolute;left: -210px;top: -20px;display: none;-o-transition: all .4s;-webkit-transition: all .4s;transition: all .4s;border-radius: 4px;-webkit-box-shadow: 0px 2px 12px 0px rgba(43, 43, 43, 0.1);box-shadow: 0px 2px 12px 0px rgba(43, 43, 43, 0.1);}
+    .section-tel .box .box-tel:before{content: '';width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:10px solid #FFFFFF;position: absolute;right:-10px;top: 44%;}
+    .section-tel .box .box-tel p{text-align: center;line-height: 30px;font-size: 20px;color: #BC1724;}
+    .section-tel .box:hover{background:#BC1724;}
+    .section-tel .box.code:hover .code{background:#BC1724 url("/img/activity/attestation/code_2.png");}
+    .section-tel .box.tel:hover .tel{background:#BC1724 url("/img/activity/attestation/phone_2.png");}
+    .section-tel .box.code:hover .box-code{left: -159px;display: block;}
+    .section-tel .box.tel:hover .box-tel{left: -190px;display: block;}
+
+    /*温馨提示*/
+    .popup-tip { width: 100vw; height: 100vh;position: fixed; top: 0; left: 0;z-index: 9999; }
+    .popup-tip .mask{position: fixed;width: 100vw; height: 100vh; top: 0; left: 0; z-index: 1;background: rgba(0,0,0,.7)}
+    .popup-tip .content {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;  position: absolute; width: 380px;height: 320px; z-index: 2 ;top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%);background: #fff;}
+    .popup-tip .content .title{ font-size: 24px; color: #101010; }
+    .popup-tip .content .tip { font-size: 16px; color: #BC1724;margin-top: 25px;}
+    .popup-tip .content .close{ position: absolute; right: 8px;top: 8px; width: 36px;height: 36px; background: url("/img/activity/attestation/icon-close.png") no-repeat center; cursor: pointer;}
+
+    /*底部*/
+    .foot{width:100%;height:130px;background:#262626;}
+    .footer{width:1190px;margin:0 auto;text-align:center;height: 130px;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 39px 0;}
+    .footer p{line-height: 30px;color: #FFFFFF;}
+    .footer p span{margin:0 5px}
+    .footer p span a{color: #FFFFFF;}
+    .footer p span img.icp{width: 18px;height: 18px;display: inline-block;}
+}
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+    .section_banner{width: 100%;height: 42vw;background: url("/img/activity/logo-new/H5-banner_.png");background-size: cover;-webkit-box-sizing: border-box;box-sizing: border-box;padding-top: 11vw;}
+    .section_banner h1{font-size: 6.4vw;line-height: 36px;margin-bottom: 4.3vw;text-align: center;color: #FFFFFF;}
+    .section_banner p{font-size: 4vw;line-height: 4vw;text-align: center;color: #FFFFFF;}
+    .section{width: 100%;}
+    .inner{width: 100%;}
+    .section_main{width: 100%;-webkit-box-sizing: border-box;box-sizing: border-box;}
+    /*section_main 01*/
+    .section_main.one{height: 131.3vw;background-color: #FFFFFF;padding: 10.5vw 0;}
+    .section_main.one .title{width: 100%;margin-bottom: 10vw;}
+    .section_main.one .title h1{line-height: 4.9vw;text-align: center;font-size: 4.8vw;color: #333333;font-weight: normal;}
+    .section_main.one .section_content{width: 100%;height: auto;-webkit-box-sizing: border-box;box-sizing: border-box;}
+    .section_main.one .section_content .image{width: 72.7vw;height: 51.7vw;margin: 0 auto;margin-bottom: 10vw;}
+    .section_main.one .section_content .image img{width: 100%;height: 100%;display: block;}
+    .section_main.one .section_content .text{width: 100%;height: auto;-webkit-box-sizing: border-box;box-sizing: border-box;padding:0 14.4vw;}
+    .section_main.one .section_content .text .h1{font-size: 4vw;line-height: 5.2vw;font-weight: bold; color: #464646;text-align: justify;margin-bottom: 5.2vw;}
+    .section_main.one .section_content .text p{font-size: 3vw;line-height: 6.6vw;color: #707070;padding-left: 3vw;position: relative;}
+    .section_main.one .section_content .text p:before{content: '';width: 6px;height: 6px;background-color: #D4D4D4;position: absolute;left: 0;top: 2.4vw;border-radius: 50%;}
+    /*section_main 02*/
+    .section_main.two{height: 93vw;background-color: #FFF8F9;padding: 8vw 0 0 0;}
+    .section_main.two .title{width: 100%;margin-bottom: 8vw;}
+    .section_main.two .title h1{line-height: 8.6vw;text-align: center;font-size: 5vw;color: #333333;font-weight: normal;}
+    .section_main.two .title p{line-height: 4.8vw;text-align: center;font-size: 3.4vw;color: #707070;font-weight: normal;}
+    .section_main.two .section_content{width: 100%;height: auto;-webkit-box-sizing: border-box;box-sizing: border-box;}
+    .section_main.two .section_content .section_li{width: 16.4vw;height: auto;float: left;margin: 0 16vw;margin-bottom: 6vw;}
+    .section_main.two .section_content .section_li .li_icon{width: 16.4vw;height: 16.4vw;display: block;margin-bottom: 2vw;}
+    .section_main.two .section_content .section_li p{line-height: 6vw;font-size: 3.2vw;color: #333333;text-align: center;}
+    /*section_main 03*/
+    .section_main.three{height: 90vw;background: url("/img/activity/attestation/section_image_bg_h5.png");background-size: cover;padding: 10vw 0 0 0;}
+    .section_main.three .title{width: 100%;margin-bottom: 8vw;}
+    .section_main.three .title h1{line-height: 4.9vw;text-align: center;font-size: 5.2vw;color: #FFFFFF;font-weight: normal;}
+    .section_main.three .section_content{width: 100%;height: auto;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 7vw;overflow: hidden;}
+    .section_main.three .section_content .text-left{width:44%;float: left;-webkit-box-sizing: border-box;box-sizing: border-box;margin-right:7vw;}
+    .section_main.three .section_content .text-right{width:44%;float: left;-webkit-box-sizing: border-box;box-sizing: border-box;}
+    .section_main.three .section_content .text-left .text-ti{width:100%;height:6.4vw;margin-bottom: 4vw;}
+    .section_main.three .section_content .text-left .text-ti-a{width:200px;height:6.4vw;-webkit-box-sizing:border-box;box-sizing:border-box;float: left;margin-left: 6vw;text-align: left;line-height: 6.4vw;font-size: 4vw;color: #FFFFFF;}
+    .section_main.three .section_content .text-left p{width: 100%;padding-left: 5vw;height:auto;line-height: 6vw;font-size: 2.4vw;color: #FFFFFF;position: relative;margin-bottom: 4vw;}
+    .section_main.three .section_content .text-left p:before{content: '';width:3.6vw;height: 3.6vw;background: url(/img/activity/attestation/section_icon_x.png);background-size: cover;position: absolute;left: 0;top: 4vw;border-radius: 50%;}
+    .section_main.three .section_content .text-right .text-ti{width:100%;height:6.4vw;margin-bottom: 4vw;}
+    .section_main.three .section_content .text-right .text-ti-a{width:200px;height:6.4vw;-webkit-box-sizing:border-box;box-sizing:border-box;float: left;margin-left: 6vw;text-align: left;line-height: 6.4vw;font-size: 4vw;color: #FFFFFF;}
+    .section_main.three .section_content .text-right p{width: 100%;padding-left: 5vw;height:auto;line-height: 6vw;font-size: 2.4vw;color: #FFFFFF;position: relative;margin-bottom: 4vw;}
+    .section_main.three .section_content .text-right p:before{content: '';width:3.6vw;height: 3.6vw;background: url(/img/activity/attestation/section_icon_d.png);background-size: cover;position: absolute;left: 0;top: 4vw;border-radius: 50%;}
+    /*section_main 04*/
+    .section_main.four{background-color: #FFFFFF;padding: 10vw 0 0 0;}
+    .el-carousel__item h3 {
+        color: #475669;
+        font-size: 18px;
+        opacity: 0.75;
+        line-height: 300px;
+        margin: 0;
+    }
+    .el-carousel__arrow{
+        display: none;
+    }
+    .el-carousel__indicator--horizontal .el-carousel__button {
+        width: 6px;
+        height: 6px;
+        background: transparent;
+        background: rgba(255, 111, 0, 0.45);
+        border-radius: 50%;
+        opacity: 1;
+    }
+    .el-carousel__indicator--horizontal.is-active .el-carousel__button{
+        width: 6px;
+        height: 6px;
+        background: #FF5B00;
+        border-radius: 50%;
+        opacity: 1;
+    }
+    .section_main.four .el-carousel__item {
+        background: #fff;
+        display: flex;
+        flex-wrap: wrap;
+        padding: 0 0%;
+        justify-content: space-between;
+    }
+    .section_main.four .el-carousel__item .authlistH5{
+        width: 48%;
+        height: 48%;
+        border: 1px solid #ccc;
+        overflow: hidden;
+        display: flex;
+        justify-content: space-around;
+        flex-direction: column;
+    }
+    .section_main.four .el-carousel__item .authlistH5 .icon {
+        border-radius: 50%;
+        border: 1px solid #ccc;
+        width: 18vw;
+        padding: 3vw;
+        background: #fff;
+    }
+    .section_main.four .el-carousel__item .isAuthActive {
+        background: linear-gradient(-90deg, #FFBA63, #F3920D);
+    }
+    .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 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 .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;}
+    .section_main.four .section_content .section_li .li_text{float: left;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 8vw 0;}
+    .section_main.four .section_content .section_li .li_text h1{line-height: 6vw;text-align: left;font-size: 4vw;color: #333333;font-weight: normal;margin-bottom: 2vw;}
+    .section_main.four .section_content .section_li .li_text p{line-height: 4.9vw;text-align: left;font-size: 3.2vw;color: #808080;}
+    .section_main.four .section_content .section_li.li02 .li_text{margin-right: 9vw;}
+    .section_main.four .section_content .section_li.li02 .li_icon{margin-right: 0vw;}
+    /*section_main 05*/
+    .section_main.five{height: 66vw;background: #F7F7F7;padding: 10vw 0 0 0;-webkit-box-sizing: border-box;box-sizing: border-box;}
+    .section_main.five .title{width: 100%;margin-bottom: 8vw;}
+    .section_main.five .title h1{line-height: 4.9vw;text-align: center;font-size: 4.8vw;color: #333333;font-weight: normal;}
+    .section_main.five .section_content{width: 100%;height: 27.6vw;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 7vw;}
+    .section_main.five .section_content .text-left{width:48.2vw;float: left;margin-right: 6vw;}
+    .section_main.five .section_content .text-left img{width:48.2vw;height: 27.6vw;display: block;}
+    .section_main.five .section_content .text-right{float: left;-webkit-box-sizing: border-box;box-sizing: border-box;padding-top: 5vw;}
+    .section_main.five .section_content .text-right .text-right-text{width: 30.5vw;height: 12.3vw;position: relative;}
+    .section_main.five .section_content .text-right .text-right-text img{width: 13vw;height:12.3vw;display: block;}
+    .section_main.five .section_content .text-right .text-right-text .p{line-height: 4.8vw;font-size: 3.2vw;text-align: center;color: #464646;position: absolute;top:4vw;right: -3vw;}
+    /*section_main 06*/
+    .section_main.six{height: 50.2vw;background: #FFFFFF;padding: 10vw 0 0 0;-webkit-box-sizing: border-box;box-sizing: border-box;}
+    .section_main.six .section_content{width: 100%;height: 33.9vw;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 7vw;}
+    .section_main.six .section_content .text-left{float: left;-webkit-box-sizing: border-box;box-sizing: border-box;padding-top:10vw;}
+    .section_main.six .section_content .text-left .text-right-text{width: 30.5vw;height:12.3vw;position: relative;}
+    .section_main.six .section_content .text-left .text-right-text img{width: 14.8vw;height: 12.3vw;display: block;}
+    .section_main.six .section_content .text-left .text-right-text .p{line-height: 4.8vw;font-size: 3.2vw;text-align: center;color: #464646;position: absolute;top:4vw;right: -3vw;}
+    .section_main.six .section_content .text-right{width:48.2vw;float: right;}
+    .section_main.six .section_content .text-right img{width:48.2vw;height: 34.7vw;display: block;}
+    /*section_main 07*/
+    .section_main.seven{height: 58vw;background: #F7F7F7;padding: 10vw 0 0 0;}
+    .section_main.seven .title{width: 100%;margin-bottom: 8vw;}
+    .section_main.seven .title h1{line-height: 4.9vw;text-align: center;font-size: 4.8vw;color: #333333;font-weight: normal;}
+    .section_main.seven .section_content{width: 100%;height: 34.7vw;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 7vw;}
+    .section_main.seven .section_content .text-left{width:48.2vw;float: left;margin-right: 6vw;}
+    .section_main.seven .section_content .text-left img{width:48.2vw;height: 34.7vw;display: block;}
+    .section_main.seven .section_content .text-right{float: left;-webkit-box-sizing: border-box;box-sizing: border-box;padding-top: 10vw;}
+    .section_main.seven .section_content .text-right .text-right-text{width: 30.5vw;height: 12.3vw;position: relative;}
+    .section_main.seven .section_content .text-right .text-right-text img{width: 13vw;height:12.3vw;display: block;}
+    .section_main.seven .section_content .text-right .text-right-text .p{line-height: 4.8vw;font-size: 3.2vw;text-align: center;color: #464646;position: absolute;top:4vw;right: -3vw;}
+    /*section_main 08*/
+    .section_main.eight{height: 0;background: #FFFFFF;padding: 0;}
+    .section_main.eight .title{width: 100%;margin-bottom: 8vw;}
+    .section_main.eight .title h1{line-height: 4.9vw;text-align: center;font-size: 4.8vw;color: #333333;font-weight: normal;}
+    .section_main.eight .section_content{width: 100%;height: 46.4vw;-webkit-box-sizing: border-box;box-sizing: border-box;}
+    .section_main.eight .section_content img{width:82.1vw;height: 46.4vw;display: block;margin: 0 auto;}
+    /*section_main 09*/
+    .section_main.nine{height: 100vw;background: #F7F7F7;padding:10vw 0 0 0;}
+    .section_main.nine .title{width: 100%;margin-bottom: 8vw;}
+    .section_main.nine .title h1{line-height: 4.9vw;text-align: center;font-size: 4.8vw;color: #333333;font-weight: normal;}
+    .section_main.nine .title h1 span{ display: block; font-size: 3vw;color: #999; margin-top: 2.4vw }
+    .section_main.nine .section_content{width: 100%;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 6.4vw;}
+    .section_main.nine .section_content .section_li{width: 42.2vw;height: 18.6vw;float: left;-webkit-box-sizing: border-box;box-sizing: border-box;margin-right: 2.7vw;margin-bottom:2.4vw;padding:2.4vw;background-color: #FFFFFF;}
+    .section_main.nine .section_content .section_li:nth-child(2n){margin-right: 0;}
+    .section_main.nine .section_content .section_li img{float: left; width: 10vw;height: 10vw; margin-top: 1.6vw; display: block;border: 1px solid #F5F5F5;border-radius: 50%;}
+    .section_main.nine .section_content .section_li .content{float: left;margin-left: 2.4vw;width: 24vw;}
+    .section_main.nine .section_content .section_li .content .name{font-size: 2.6vw;color: #333;line-height: 1.6em;margin-top: 1.2vw}
+    .section_main.nine .section_content .section_li .icon-marks{display: block; width: 4vw;height: 4vw;background: url(/img/activity/attestation/icon-marks.png) no-repeat center;background-size: 4vw;}
+    .section_main.nine .section_content.pc{display: none !important;}
+    /*section_main 10*/
+    .section_main.ten{ background: #fff; padding:0;}
+    .section_main.ten .title{width: 100%;margin-botgbtom:  8vw;}
+    .section_main.ten .title h1{line-height: 4.9vw;text-align: center;font-size: 4.8vw;color: #333333;font-weight: normal;}
+    .section_main.ten .section_content{width: 100%;-webkit-box-sizing: border-box;box-sizing: border-box;margin-top: 8.2vw;display: flex;justify-content: space-between; align-items: center;flex-wrap: wrap;}
+    .section_main.ten .section_content .section_li{ display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 40vw; height: 29.6vw; background-size: 40vw; background-repeat: no-repeat;margin-bottom: 2.4vw;margin-right: 2.4vw;}
+    .section_main.ten .section_content .section_li:nth-child(2n) { margin-right: 0}
+    .section_main.ten .section_content .section_li .logo{ width: 12.9vw;height: 12.9vw;margin-bottom: 3.3vw;border-radius: 50%; }
+    .section_main.ten .section_content .section_li .name{ font-size: 3.6vw; color: #fff }
+    .section_main.ten .section_content .section_li {background-size: cover; background-position: center;}
+    .section_main.ten .section_content .section_li_0{background-image: url(/img/activity/attestation/section_bg_device_03.png) }
+    .section_main.ten .section_content .section_li_1{background-image: url(/img/activity/attestation/section_bg_device_01.png) }
+    .section_main.ten .section_content .section_li_2{background-image: url(/img/activity/attestation/section_bg_device_02.png) }
+    .section_main.ten .section_content .section_li_3{background-image: url(/img/activity/attestation/section_bg_device_04.png) }
+    /*.section_main.ten .section_content .section_li:nth-child(3){background-image: url("/img/activity/attestation/section_bg_club_02.png") }*/
+    /*.section_main.ten .section_content .section_li:nth-child(4){background-image: url("/img/activity/attestation/section_bg_device_02.png") }*/
+    /*.section_main.ten .section_content.pc{display: none !important; }*/
+    /*侧边栏-联系我们*/
+    .section-tel{width: 52px;height: 92px;position: fixed;right: 0;top: 50%;z-index: 99;border-radius: 2px;-webkit-box-shadow: 0px 2px 12px 0px rgba(43, 43, 43, 0.1);box-shadow: 0px 2px 12px 0px rgba(43, 43, 43, 0.1);}
+    .section-tel .box{width: 52px;height: 46px;background: #FFFFFF;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 9px 12px;cursor: pointer;position: relative;}
+    .section-tel .box .code{width: 27px;height: 27px;background:#FFFFFF url("/img/activity/attestation/code_1.png");background-size: cover;-o-transition: all .1s;-webkit-transition: all .1s;transition: all .1s;}
+    .section-tel .box .tel{width: 26px;height: 28px;background:#FFFFFF url("/img/activity/attestation/phone_1.png");background-size: cover;-o-transition: all .1s;-webkit-transition: all .1s;transition: all .1s;}
+    .section-tel .box .box-code{width: 148px;height: 170px;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 17px 24px;background-color:#FFFFFF;position: absolute;left: -173px;top: -78px;display: none;-o-transition: all .4s;-webkit-transition: all .4s;transition: all .4s;border-radius: 4px;-webkit-box-shadow: 0px 2px 12px 0px rgba(43, 43, 43, 0.1);box-shadow: 0px 2px 12px 0px rgba(43, 43, 43, 0.1);}
+    .section-tel .box .box-code:before{content: '';width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:10px solid #FFFFFF;position: absolute;right:-10px;top: 50%;}
+    .section-tel .box .box-code p{text-align: center;line-height: 20px;font-size: 14px;color: #333333;margin-bottom: 12px;}
+    .section-tel .box .box-code img{width: 100px;height: 100px;display: block;}
+    .section-tel .box .box-tel{width: 180px;height: 70px;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 20px 10px;background-color: #FFFFFF;position: absolute;left: -210px;top: -20px;display: none;-o-transition: all .4s;-webkit-transition: all .4s;transition: all .4s;border-radius: 4px;-webkit-box-shadow: 0px 2px 12px 0px rgba(43, 43, 43, 0.1);box-shadow: 0px 2px 12px 0px rgba(43, 43, 43, 0.1);}
+    .section-tel .box .box-tel:before{content: '';width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:10px solid #FFFFFF;position: absolute;right:-10px;top: 44%;}
+    .section-tel .box .box-tel p{text-align: center;line-height: 30px;font-size: 20px;color: #BC1724;}
+    .section-tel .box:hover{background:#BC1724;}
+    .section-tel .box.code:hover .code{background:#BC1724 url("/img/activity/attestation/code_2.png");}
+    .section-tel .box.tel:hover .tel{background:#BC1724 url("/img/activity/attestation/phone_2.png");}
+    .section-tel .box.code:hover .box-code{left: -159px;display: block;}
+    .section-tel .box.tel:hover .box-tel{left: -190px;display: block;}
+
+    /*温馨提示*/
+    .popup-tip { width: 100vw; height: 100vh;position: fixed; top: 0; left: 0;z-index: 9999; }
+    .popup-tip .mask{position: fixed;width: 100vw; height: 100vh; top: 0; left: 0; z-index: 1;background: rgba(0,0,0,.7)}
+    .popup-tip .content {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;  position: absolute; width: 76vw;height: 70.5vw; z-index: 2 ;top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%);background: #fff;}
+    .popup-tip .content .title{ font-size: 4.8vw; color: #101010; }
+    .popup-tip .content .tip { font-size: 3.2vw; color: #BC1724;margin-top: 7vw;}
+    .popup-tip .content .close{ position: absolute; right: 4vw;top: 4vw; width: 6vw;height: 6vw; background: url("/img/activity/attestation/icon-close.png") no-repeat center; cursor: pointer;}
+    /*底部*/
+    .foot{width:100%;height:auto;background:#262626;}
+    .footer{width:100%;padding:4vw 0;background:#262626;margin-top:4vw;text-align:center}
+    .footer p span a{color: #FFFFFF;}
+    .footer .logo img{width:9.2vw;height:8vw;vertical-align:middle}
+    .footer .dizhi{display:inline-table;color:#ccc;font-size:3.1vw;line-height:4.8vw;vertical-align:super}
+}

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

@@ -0,0 +1,295 @@
+new Vue({
+    mixins: [cmSysVitaMixins],
+    data: {
+        popupVisiable: false,
+        twoData: [
+            {icon: '/img/activity/attestation/section_icon_1.png', text: '自主授权'},
+            {icon: '/img/activity/attestation/section_icon_2.png', text: '自主认证'},
+            {icon: '/img/activity/attestation/section_icon_3.png', text: '自主管理'},
+            {icon: '/img/activity/attestation/section_icon_4.png', text: '更快更专业'}
+        ],
+        //认证通合作伙伴
+        suppileData: [
+            {
+                logo: '/img/activity/attestation/9.png',
+                name: 'Ross',
+                entryRoute: '/12/ross',
+                secondRoute: '',
+                redirect: ''
+            },
+            {
+                logo: '/img/activity/attestation/10.png',
+                name: '上海禾雅堂科技有限公司',
+                entryRoute: '/15/hty',
+                secondRoute: '',
+                redirect: 'http://zprz.hoyabeauty.com'
+            },
+            {
+                logo: '/img/activity/attestation/1.jpg',
+                name: '上海品辉医疗科技有限公司',
+                entryRoute: '/4/ph',
+                secondRoute: ''
+            },
+            {
+                logo: '/img/activity/attestation/2.jpg',
+                name: '科医人医疗激光设备贸易公司',
+                entryRoute: '',
+                secondRoute: ''
+            },
+            {
+                logo: '/img/activity/attestation/3.jpg',
+                name: '广州埃墨莉素生物科技有限公司',
+                entryRoute: '/10/ldm',
+                secondRoute: '',
+                redirect: ''
+            },
+        ],
+        // 认证通快捷入口
+        firstEntryList: [
+            {
+                id: 1,
+                logo: '/img/activity/logo-new/ross-new.png',
+                name: 'ROS\'S机构认证',
+                entryRoute: '/12/ross',
+                secondRoute: '',
+                redirect: '',
+                className: {
+                    bg: true,
+                    bg1: true,
+                },
+            },
+            {
+                id: 2,
+                logo: '/img/activity/logo-new/ph-new.jpg',
+                name: '品辉机构认证',
+                entryRoute: '/4/ph/approve/club',
+                secondRoute: '',
+                className: {
+                    bg: true,
+                    bg2: true,
+                },
+            },
+            {
+                id: 3,
+                logo: '/img/activity/logo-new/ldm-new.png',
+                name: 'LDM机构认证',
+                entryRoute: '/10/ldm/approve/club',
+                secondRoute: '',
+                redirect: '',
+                className: {
+                    bg: true,
+                    bg3: true,
+                },
+            },
+            {
+                id: 4,
+                logo: '/img/activity/logo-new/hyt-new.jpg',
+                name: '禾雅堂机构认证',
+                entryRoute: '/15/hty',
+                secondRoute: '',
+                // redirect: 'http://zprz.hoyabeauty.com',
+                redirect: '',
+                className: {
+                    bg: true,
+                    bg4: true,
+                },
+            },
+            {
+                id: 5,
+                logo: '/img/activity/logo-new/wm-new.png',
+                name: '唯美概念机构认证',
+                entryRoute: '/21/app',
+                secondRoute: '',
+                redirect: '',
+                className: {
+                    bg: true,
+                    bg5: true,
+                },
+            },
+        ],
+        isAuthActiveNum: 0,
+        initPageList: [],
+        startX: '',
+        startY: '',
+        moveY: '',
+        moveX: '',
+        startTime: ''
+    },
+    mounted() {
+        this.initPageList = this.firstEntryList.map((item, index) => {
+            if (index < 4) {
+                return item
+            }
+        })
+        // this.initSwiper1()
+        this.cmSysParams.pageType = 5;
+        this.cmSysParams.pageLabel = '认证通';
+        this.initSwiper2()
+        this.slideBanner()
+    },
+    computed: {
+        computFirstEntryListleft() {
+            return this.firstEntryList.map((item, index) => {
+                if (index < 4) {
+                    return item
+                }
+            })
+        },
+    },
+    methods: {
+        changePageNoLeft() {
+            this.$refs.pcSwiper.prev()
+            // console.log(bool)
+            // if (bool) {
+            //     if (this.initPageList[3].id === 5) {
+            //         this.initPageList = this.firstEntryList.filter((item, index) => index!==4)
+            //         console.log(this.initPageList)
+            //     } else {
+            //         this.isAuthActiveNum--
+            //     }
+            //     console.log(this.isAuthActiveNum)
+            // }
+        },
+        changePageNoRight() {
+            this.$refs.pcSwiper.next()
+            // if (bool) {
+            //     if (this.initPageList[3].id === 4 && this.isAuthActiveNum === 3) {
+            //         this.initPageList = this.firstEntryList.filter((item, index) => index!==0)
+            //         console.log(this.initPageList)
+            //     } else {
+            //         this.isAuthActiveNum++
+            //     }
+            // }
+        },
+        start(e) {
+            this.startX = e.touches[0].clientX;
+            this.startY = e.touches[0].clientY;
+        },
+        move(e) {
+            this.moveX = e.touches[0].clientX;
+            this.moveY = e.touches[0].clientY;
+            var nowtime = new Date().getTime();
+            if (this.startTime == undefined || nowtime > this.startTime) {
+                if (this.startX - this.moveX <= 0) { // 右滑触发
+                    this.prev();
+                    return false;
+                } else {
+                    this.next();
+                    return false;
+                }
+            }
+        },
+        prev() {
+            this.$refs.nop.prev();
+            this.startTime = new Date().getTime() + 500;
+        },
+        next() {
+            this.$refs.nop.next();
+            this.startTime = new Date().getTime() + 500;
+        },
+        changePageNo(index) {
+            this.isAuthActiveNum = index
+        },
+        changePageNoLink(index, item) {
+            this.isAuthActiveNum = index
+            this.handleClick(item)
+        },
+        initSwiper1() {
+            const swiper = new Swiper("#mySwiper1", {
+                slidesPerView: 2,
+                spaceBetween: 15,
+                loop: true,
+                autoplay: {
+                    delay: 2000,
+                },
+            });
+            swiper.el.onmouseover = function () {
+                swiper.autoplay.stop();
+            }
+            swiper.el.onmouseout = function () {
+                swiper.autoplay.start();
+            }
+        },
+        // 滑动切换
+        slideBanner() {
+            //选中的轮播图
+            let box = document.querySelector('.el-carousel__container');
+            let startPointX = 0
+            let stopPointX = 0
+            //重置坐标
+            let resetPoint = () => {
+                startPointX = 0
+                stopPointX = 0
+            }
+            //手指按下
+            box.addEventListener("touchstart", function (e) {
+                //手指点击位置的X坐标
+                startPointX = e.changedTouches[0].pageX
+            });
+            //手指滑动
+            box.addEventListener("touchmove", function (e) {
+                //手指滑动后终点位置X的坐标
+                stopPointX = e.changedTouches[0].pageX
+            });
+            //当手指抬起的时候，判断图片滚动离左右的距离
+            let that = this
+            box.addEventListener("touchend", function (e) {
+                console.log(1111)
+                if (stopPointX == 0 || startPointX - stopPointX == 0) {
+                    resetPoint()
+                    return
+                }
+                if (startPointX - stopPointX > 0) {
+                    resetPoint()
+                    that.$refs.slideCarousel.next()
+                    return
+                }
+                if (startPointX - stopPointX < 0) {
+                    resetPoint()
+                    that.$refs.slideCarousel.prev()
+                    return
+                }
+            });
+        },
+        initSwiper2() {
+            const swiper = new Swiper("#mySwiper2", {
+                slidesPerView: 3,
+                spaceBetween: 15,
+                loop: true,
+                autoplay: {
+                    delay: 2000,
+                },
+            });
+            swiper.el.onmouseover = function () {
+                swiper.autoplay.stop();
+            }
+            swiper.el.onmouseout = function () {
+                swiper.autoplay.start();
+            }
+        },
+
+        handleClick: function (data) {
+            if (data.redirect) {
+                window.open(data.redirect, '_blank')
+                return
+            }
+            if (!data.entryRoute) {
+                this.popupVisiable = true;
+                return false
+            }
+            var zplmDomain = $('#zplmDomain').val()
+            // 将要跳转的链接
+            var baseUrl = zplmDomain + data.entryRoute + data.secondRoute
+            window.open(baseUrl, '_blank')
+        }
+    }
+}).$mount('#attestation');
+
+// $(function(){
+//     var swiper = new Swiper("#mySwiper1", {
+//         slidesPerView: 3,
+//         spaceBetween: 15,
+//         freeMode: true,
+//         autoPlay: true,
+//     });
+// })

src/main/resources/static/js/supplier-center/article/article-edit.js

@@ -35,7 +35,7 @@ var articleEdit = new Vue({
             // 来源
             source: '',
             // 状态
-            status: 1,
+            status: 0,
             // 文章分类
             typeId: ''
         },
@@ -89,7 +89,10 @@ var articleEdit = new Vue({
         formValidate: {},
         variable: '',
         remoteLoading: false,
-        labelList: []
+        labelList: [],
+        validTime: null,
+        isValidSave: 0, // 是否开启自动保存
+        isFocus: false, // 是否聚焦
     },
     watch: {
         chooseLabels: function chooseLabels(newVal) {
@@ -101,7 +104,7 @@ var articleEdit = new Vue({
             }
             if (newVal === oldVal) return;
             this.chooseLabels = newVal.split(',');
-        }
+        },
     },
     created: function created() {
         this.init();
@@ -115,6 +118,16 @@ var articleEdit = new Vue({
         localStorage.removeItem('articleId');
     },
     methods: {
+        onFocused() {
+            this.validTime = null
+            console.log(111)
+            clearTimeout(this.validTime)
+        },
+        onBlured() {
+            this.isFocus = true
+            this.validFormRule()
+            console.log(222)
+        },
         // 页面初始化
         init: function init() {
             var articleId = localStorage.getItem('articleId') || 0;
@@ -141,6 +154,26 @@ var articleEdit = new Vue({
                 }
             });
         },
+        // 自动保存校验
+        validFormRule() {
+            this.$refs.ruleForm.validate(valide=>{
+                if(valide){
+                    this.validTime = null
+                    clearTimeout(this.validTime)
+                    this.validTime = setTimeout(() => {
+                        if (this.validTime) {
+                            this.handleSave()
+                        }
+                        clearTimeout(this.validTime)
+                        this.validTime = null
+                    }, 2000)
+                }
+            })
+        },
+        handlerTypeId() {
+            this.onFocused()
+            this.onBlured()
+        },
         // 设置表单初始数据
         setFormData: function setFormData(shopArticle) {
             for (var key in this.formData) {
@@ -193,6 +226,9 @@ var articleEdit = new Vue({
         handleUploadSuccess: function handleUploadSuccess(response, file, fileList) {
             this.formData.guidanceImage = response.data;
             this.articleImageList = fileList;
+            this.onFocused()
+            this.onBlured()
+            console.log(fileList)
         },
         // 图片移除
         handleImageRemove: function handleImageRemove(response, file, fileList) {
@@ -205,7 +241,7 @@ var articleEdit = new Vue({
             this.$refs.ruleForm.validate(valide=>{
                 if(!valide) return;
                 // _this.save();
-                const params = {..._this.formData, labelIds: _this.formData.labelIds.join(',')}
+                const params = {..._this.formData, labelIds: (_this.formData.labelIds && _this.formData.labelIds.length > 0) ? _this.formData.labelIds.join(',') : ''}
                 _this.sensitiveWordsValidate(params)
             });
         },
@@ -220,7 +256,7 @@ var articleEdit = new Vue({
                 if(!valide) return;
                 // _this.save();
                 const date = new Date()
-                const params = {..._this.formData, labelIds: _this.formData.labelIds.join(','), publishDate: date.getFullYear() + '-'+(date.getMonth() +1)+'-'+date.getDay() +' ' + date.getHours() + ':' +date.getMinutes() + ':' +date.getSeconds()}
+                const params = {..._this.formData, labelIds: (_this.formData.labelIds && _this.formData.labelIds.length > 0) ? _this.formData.labelIds.join(',') : '', publishDate: date.getFullYear() + '-'+(date.getMonth() +1)+'-'+date.getDay() +' ' + date.getHours() + ':' +date.getMinutes() + ':' +date.getSeconds()}
                 window.localStorage.setItem('articelData', JSON.stringify(params))
                 window.open('/supplier/article/preview.html');
             });

src/main/resources/static/js/supplier-center/encyclopedia/components/content-edit/index.js

@@ -5,7 +5,7 @@ const contentEdit = {
     <div class="el-input" :id="editId">
         <div class="bk-toolbar" @click="handleToolBarClick" v-show="isFocus"></div>
         <div class="bk-bubble" @click="handleBubbleClick" v-show="bubbleNum>0">{{bubbleNum}}</div>
-        <div class="el-input__inner bk-input" contenteditable="plaintext-only" @focus="isFocus = true" @blur="onBlur" v-html="value"></div>
+        <div class="el-input__inner bk-input" contenteditable="plaintext-only" @focus="onFocus" @blur="onBlur" v-html="value"></div>
         <ul class="bk-literature" v-show="showBubble && bubbleNum>0">
             <li v-for="item in refList" :key="item.ctrlId">
                 <div>{{item | reference}}</div>
@@ -77,9 +77,14 @@ const contentEdit = {
         // 失去焦点
         onBlur() {
             setTimeout(() => {
+                this.$parent.$parent.$parent.onBlured && this.$parent.$parent.$parent.onBlured() // 调用父组件方法
                 this.isFocus = false
             }, 200)
         },
+        onFocus() {
+            this.isFocus = true
+            this.$parent.$parent.$parent.onFocused() && this.$parent.$parent.$parent.onFocused() // 调用父组件方法
+        },
         // 工具栏点击
         handleToolBarClick() {
             this.$emit('toolbar', this.contentEdit)

src/main/resources/static/js/supplier-center/encyclopedia/edit.js

@@ -255,7 +255,8 @@ const edit = new Vue({
         formValidate: {},
         referenceImageList: [],
         labelList: [],
-        remoteLoading: false
+        remoteLoading: false,
+        validTime: null,
     },
     created() {
         this.formData.id = CAIMEI.getUrlParam('id') || ''
@@ -274,7 +275,48 @@ const edit = new Vue({
         $('.navLayout').find('.navList').eq(3).addClass("on").find('.con').show().find('a').eq(0).addClass("on");
         this.initAutoInput('.seo-auto-input', 'seoKeyword')
     },
+    watch: {
+        referenceDialog(val) {
+            if (val) {
+                setTimeout(() => {
+                    this.onFocused()
+                }, 500)
+            }
+        },
+    },
     methods: {
+        onFocused() {
+            this.validTime = null
+            console.log(111)
+            clearTimeout(this.validTime)
+        },
+        onBlured() {
+            this.isFocus = true
+            this.validFormRule()
+            console.log(222)
+        },
+        // 自动保存校验
+        validFormRule() {
+            this.$refs.ruleForm.validate(valid => {
+                if (valid) {
+                    this.validTime = null
+                    clearTimeout(this.validTime)
+                    this.validTime = setTimeout(() => {
+                        if (this.validTime) {
+                            this.handleConfirm()
+                        }
+                        clearTimeout(this.validTime)
+                        this.validTime = null
+                    }, 2000)
+                }
+            })
+        },
+        handlerDiscrip() {
+            this.onFocused()
+        },
+        handlerTypeId() {
+            this.onBlured()
+        },
         // 获取表单数据
         fetchEntryData(){
             const self = this
@@ -452,6 +494,7 @@ const edit = new Vue({
                 this.referenceData = initReferenceData()
                 this.$refs.referenceForm.clearValidate()
                 this.referenceDialog = false
+                this.onBlured()
             } catch (e) {
                 console.log(e)
             }
@@ -484,6 +527,7 @@ const edit = new Vue({
             if(this.referenceData.imageUrl){
                 this.referenceImageList = [{ url: this.referenceData.imageUrl, type: 'image' }]
             }
+            console.log(1111)
         },
         // 参考资料删除
         handleReferenceDelete(item) {
@@ -506,10 +550,12 @@ const edit = new Vue({
         // 新增信息栏
         handleInfoAdd() {
             this.formData.infoList.push(this.genereateInfo())
+            this.onFocused()
         },
         // 删除信息栏
         handleInfoRemove(index) {
             this.formData.infoList.splice(index, 1)
+            this.onFocused()
         },
         // 正文目录数据
         genereateTextInfo(type, index) {
@@ -530,14 +576,17 @@ const edit = new Vue({
         // 添加正文目录
         handleAddTextInfo(index, type) {
             this.formData.textInfoList.splice(index + 1, 0, this.genereateTextInfo(type, index + 1))
+            this.onFocused()
         },
         // 删除正文目录
         handleRemoveTextInfo(index, type) {
             this.formData.textInfoList.splice(index, 1)
+            this.onFocused()
         },
         // 文件上传成功
         handleUploadSuccess(fileList) {
             this.fileList = [...this.fileList, ...fileList]
+            this.onBlured()
         },
         // 文件移除
         handleFileRemove(file) {
@@ -547,6 +596,7 @@ const edit = new Vue({
         handleCoverUploadSuccess(fileList) {
             this.coverList = fileList
             this.formData.image = fileList[0].url
+            this.onBlured()
         },
         // 封面删除
         handleCoverRemove(file) {

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

@@ -0,0 +1,168 @@
+<!DOCTYPE html>
+<html lang="zh-CN" xmlns:th="https://www.thymeleaf.org" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+      xsi:schemaLocation="https://www.thymeleaf.org ">
+<head>
+    <title>采美365网-认证通-一款专业的正品认证SaaS软件系统</title>
+    <template th:replace="components/head-link"></template>
+    <link rel="stylesheet" href="/lib/swiper.min.css"/>
+    <link rel="stylesheet" th:href="@{/lib/element-ui/element-ui-min.css}" />
+    <link th:href="@{/css/activity/attestation-new.css(v=${version})}" rel="stylesheet" type="text/css">
+    <template th:replace="components/analysis"></template>
+</head>
+<body>
+<input type="hidden" th:value="${zplmDomain}" id="zplmDomain">
+<!-- 引用头部 -->
+<template th:replace="components/header"></template>
+
+<!-- 商品列表 -->
+<div id="attestation" >
+<!-- banner   -->
+    <div class="section_banner"></div>
+    <div class="section">
+        <div class="section_main ten">
+            <div class="inner">
+            </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 isActivePage" @click="changePageNoLeft" v-if="isPC"><</div>
+            <div class="pageNoChangeRight isActivePage" @click="changePageNoRight" v-if="isPC">></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">
+                        <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' : ''">
+                                    <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-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' : ''">
+                                    <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-item>
+                    </el-carousel>
+                </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>
+                        <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>
+                                            <img :src="item.logo" alt="" class="icon">
+                                        </div>
+                                        <div :class="isAuthActiveNum === index ? 'isAuthtext' : ''">{{item.name}}</div>
+                                        <div>
+                                            <el-button @click="changePageNoLink(index, item)" :class="isAuthActiveNum === index ? 'isAuthBtn' : ''">立即查看</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>
+                                            <img :src="item.logo" alt="" class="icon">
+                                        </div>
+                                        <div :class="isAuthActiveNum === index ? 'isAuthtext' : ''">{{item.name}}</div>
+                                        <div>
+                                            <el-button @click="changePageNoLink(index, item)" :class="isAuthActiveNum === index ? 'isAuthBtn' : ''">立即查看</el-button>
+                                        </div>
+                                    </div>
+                                </el-carousel-item>
+                            </div>
+                        </el-carousel>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="section_main eight">
+            <div class="inner">
+            </div>
+        </div>
+    </div>
+    <div class="section-tel">
+        <div class="box code">
+            <div class="code"></div>
+            <div class="box-code">
+                <p>扫码咨询</p>
+                <img src="/img/common/qr_code_kefu.png" alt="">
+            </div>
+        </div>
+        <div class="box tel">
+            <div class="tel"></div>
+            <div class="box-tel">
+                <p>0755-22907771</p>
+            </div>
+        </div>
+    </div>
+    <!-- 温馨提示 -->
+    <div class="popup-tip" v-if="popupVisiable" v-cloak>
+        <div class="mask" @click.stop="popupVisiable = false"></div>
+        <div class="content">
+            <span class="close" @click.stop="popupVisiable = false"></span>
+            <div class="title">温馨提示</div>
+            <img src="/img/activity/attestation/icon-popup-tip.png"/>
+            <div class="tip">正在建立合作中...</div>
+        </div>
+    </div>
+</div>
+<!-- 引入底部 -->
+<template th:replace="article/components/article-footer"></template>
+<template th:replace="components/foot-link"></template>
+
+<script charset="utf-8" type="text/javascript"
+        th:src="@{/js/common/serviceapi/product.service.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript"
+        th:src="@{/js/common/serviceapi/shopping.service.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/lib/element-ui/element-ui.min.js}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/mixins/cmSysMixins.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/activity/attestation-new.js(v=${version})}"></script>
+</body>
+</html>

src/main/resources/templates/supplier-center/article/article-edit.html

@@ -38,12 +38,12 @@
                         <el-form :model="formData" :rules="rules" ref="ruleForm" label-position="top">
                             <!-- 标题 -->
                             <el-form-item label="标题" prop="title" class="mint-filter">
-                                <el-input v-model="formData.title" placeholder="请输入文章标题"></el-input>
+                                <el-input v-model="formData.title" placeholder="请输入文章标题" @focus="onFocused" @blur="onBlured"></el-input>
                                 <div class="mint-message" v-if="formValidate.title">{{formValidate.title}}</div>
                             </el-form-item>
                             <!-- 文章标签 -->
                             <el-form-item label="文章标签" prop="label" class="mint-filter">
-                                <el-input v-model="formData.label" placeholder="请输入文章标签"></el-input>
+                                <el-input v-model="formData.label" placeholder="请输入文章标签" @focus="onFocused" @blur="onBlured"></el-input>
                                 <div class="mint-message" v-if="formValidate.label">{{formValidate.label}}</div>
                             </el-form-item>
                             <el-form-item  label="">
@@ -58,13 +58,13 @@
                                 </div>
                                 <!-- 新增标签 -->
                                 <div class="label-add">
-                                    <el-input v-model="addLabelName" placeholder="请输入标签名"></el-input>
+                                    <el-input v-model="addLabelName" placeholder="请输入标签名" @focus="onFocused" @blur="onBlured"></el-input>
                                     <button class="add-tag" type="button" @click.stop="addLabel">添加</button>
                                 </div>
                             </el-form-item>
                             <!-- SEO关键词 -->
                             <el-form-item label="SEO关键词" prop="keyword" class="mint-filter">
-                                <el-input v-model="formData.keyword" placeholder="请输入SEO关键词" class="seo-auto-input"></el-input>
+                                <el-input v-model="formData.keyword" placeholder="请输入SEO关键词" class="seo-auto-input" @focus="onFocused" @blur="onBlured"></el-input>
                                 <div class="mint-message" v-if="formValidate.keyword">{{formValidate.keyword}}</div>
                             </el-form-item>
                             <!-- 关联标签库 -->
@@ -88,27 +88,27 @@
                             </el-form-item>
                             <!-- 发布人 -->
                             <el-form-item label="发布人" prop="publisher" class="mint-filter">
-                                <el-input v-model="formData.publisher" placeholder="请填写发布人姓名"></el-input>
+                                <el-input v-model="formData.publisher" placeholder="请填写发布人姓名" @focus="onFocused" @blur="onBlured"></el-input>
                                 <div class="mint-message" v-if="formValidate.publisher">{{formValidate.publisher}}</div>
                             </el-form-item>
                             <!-- 来源 -->
                             <el-form-item label="来源" prop="source">
-                                <el-input v-model="formData.source" placeholder="请填写文章来源"></el-input>
+                                <el-input v-model="formData.source" placeholder="请填写文章来源" @focus="onFocused" @blur="onBlured"></el-input>
                             </el-form-item>
                             <!-- 推荐语(描述) -->
                             <el-form-item label="推荐语(描述)" prop="recommendContent" class="mint-filter">
-                                <el-input type="textarea" :rows="3" v-model="formData.recommendContent" placeholder="请填写推荐语(描述)"></el-input>
+                                <el-input type="textarea" :rows="3" v-model="formData.recommendContent" placeholder="请填写推荐语(描述)" @focus="onFocused" @blur="onBlured"></el-input>
                                 <div class="mint-message" v-if="formValidate.recommendContent">{{formValidate.recommendContent}}</div>
                             </el-form-item>
                             <!-- 文章内容 -->
                             <el-form-item label="文章内容" prop="articleContent" class="mint-filter">
-                                <el-input v-model="formData.articleContent" v-show="false"></el-input>
-                                <editor v-model="formData.articleContent" placeholder="请输入文章内容"></editor>
+                                <el-input v-model="formData.articleContent" v-show="false" @focus="onFocused" @blur="onBlured"></el-input>
+                                <editor v-model="formData.articleContent" placeholder="请输入文章内容" @focus="onFocused" @blur="onBlured"></editor>
                                 <div class="mint-message" v-if="formValidate.articleContent">{{formValidate.articleContent}}</div>
                             </el-form-item>
                             <!-- 文章分类 -->
                             <el-form-item label="文章分类" prop="typeId">
-                                <el-select v-model="formData.typeId" class="max-width">
+                                <el-select v-model="formData.typeId" class="max-width" @change="handlerTypeId">
                                     <template v-for="(typeInfo, index) in articleTypeList">
                                         <el-option :label="typeInfo.typeName" :value="typeInfo.typeId" :key="typeInfo.typeId"></el-option>
                                     </template>
@@ -135,7 +135,7 @@
                                 <span class="cm-label"><em>*</em>状态:</span>
                                 <el-radio-group v-model="formData.status">
                                     <el-radio :label="1">发布</el-radio>
-                                    <el-radio :label="0">暂不发布</el-radio>
+                                    <el-radio :label="0">存草稿</el-radio>
                                 </el-radio-group>
                             </el-form-item>
                         </el-form>

src/main/resources/templates/supplier-center/article/article-list.html

@@ -146,11 +146,11 @@
                                 </td>
                                 <td>
                                     <span class="state primary" v-if="articleInfo.status === 1">已发布</span>
-                                    <span class="state danger" v-else>暂不发布</span>
+                                    <span class="state danger" v-else>存草稿</span>
                                 </td>
                                 <td class="option">
                                     <div class="option">
-                                        <button class="form-button stop" @click="clickOption(articleInfo, 2)">{{ articleInfo.status === 1 ? '暂不发布':'发布' }}</button>
+                                        <button class="form-button stop" @click="clickOption(articleInfo, 2)">{{ articleInfo.status === 1 ? '存草稿':'发布' }}</button>
                                         <button class="form-button edit" @click="clickOption(articleInfo, 1)">编辑</button><br>
                                         <button class="form-button search" @click="clickOption(articleInfo, 3)">查看</button>
                                         <button class="form-button delete" @click="clickOption(articleInfo, 4)">删除</button>

src/main/resources/templates/supplier-center/encyclopedia/edit.html

@@ -30,12 +30,12 @@
         <div class="wrap clear">
             <!--左侧导航-->
             <template th:replace="supplier-center/components/tableft"></template>
-            <div class="right ">
+            <div class="right " >
                 <div class="top-tip">温馨提示：在采美百科发布词条能提升您的品牌关键词在搜索中的曝光率。（注：未填写的信息项将不会显示在词条页）</div>
                 <div class="valide-form">
                     <el-form :rules="rules" :model="formData" ref="ruleForm" label-position="top">
                         <el-form-item label="词条名称：" prop="name">
-                            <el-input v-model="formData.name" placeholder="请输入词条名称"></el-input>
+                            <el-input v-model="formData.name" placeholder="请输入词条名称" @focus="onFocused" @blur="onBlured"></el-input>
                             <div class="el-form-item__error" v-if="formValidate.name">敏感词：{{formValidate.name}}</div>
                         </el-form-item>
                         <el-form-item label="义项名：" prop="alias">
@@ -62,14 +62,14 @@
                         <el-form-item>
                             <label class="el-form-item__label">概述图册：<span>（注：未上传图片将不会显示在词条页上，最多上传6张）</span></label>
                             <input type="file" v-show="false"/>
-                            <file-upload @upload-success="handleUploadSuccess" @remove="handleFileRemove" :list="fileList" :limit="6"></file-upload>
+                            <file-upload @upload-success="handleUploadSuccess" @remove="handleFileRemove" :list="fileList" :limit="6" @click.native="handlerDiscrip"></file-upload>
                         </el-form-item>
                         <!-- 信息栏 -->
                         <div class="bk-label">信息栏<span></span><span class="bk-info-add" @click="handleInfoAdd">增加信息项</span></div>
                         <div class="bk-form-item-group" v-for="(item, index) in formData.infoList" :key="index">
                             <span class="bk-info-remove" v-if="formData.infoList.length > 4" @click="handleInfoRemove(index)">删除</span>
                             <el-form-item>
-                                <el-input v-model="item.infoName" :placeholder="getInfoNamePlaceHolder(index)"></el-input>
+                                <el-input v-model="item.infoName" :placeholder="getInfoNamePlaceHolder(index)" @focus="onFocused" @blur="onBlured"></el-input>
                                 <div class="el-form-item__error" v-if="formValidate.infoList">敏感词：{{formValidate.infoList}}</div>
                             </el-form-item>
                             <el-form-item>
@@ -88,7 +88,7 @@
                         <el-form-item v-for="(item, index) in formData.textInfoList" :key="index">
                             <div class="bk-form-item">
                                 <template v-if="item.dictionaryType !== 3">
-                                    <el-input v-model="item.dictionaryContent" :placeholder="item.placeholder"></el-input>
+                                    <el-input v-model="item.dictionaryContent" :placeholder="item.placeholder" @focus="onFocused" @blur="onBlured"></el-input>
                                 </template>
                                 <template v-else>
                                     <content-edit
@@ -122,17 +122,17 @@
                         <div class="bk-label"><em>*</em>头图<i>（建议图片尺寸210px*210px，并上传白底图片）</i></div>
                         <el-form-item prop="image">
                             <el-input v-show="false" v-model="formData.image"></el-input>
-                            <file-upload @upload-success="handleCoverUploadSuccess" @remove="handleCoverRemove" :list="coverList"></file-upload>
+                            <file-upload @click.native="handlerDiscrip" @upload-success="handleCoverUploadSuccess" @remove="handleCoverRemove" :list="coverList"></file-upload>
                         </el-form-item>
                         <el-form-item label="分类：" prop="typeId">
-                            <el-select class="max-width" v-model="formData.typeId">
+                            <el-select class="max-width" v-model="formData.typeId" @click.native="handlerDiscrip" @change="handlerTypeId">
                                 <template v-for="item in typeList">
                                     <el-option :label="item.name" :value="item.typeId"></el-option>
                                 </template>
                             </el-select>
                         </el-form-item>
                         <el-form-item label="SEO关键词：">
-                            <el-input v-model="formData.seoKeyword" placeholder="例如：面膜" class="seo-auto-input"></el-input>
+                            <el-input v-model="formData.seoKeyword" placeholder="例如：面膜" class="seo-auto-input"  @focus="onFocused" @blur="onBlured"></el-input>
                             <div class="el-form-item__error" v-if="formValidate.seoKeyword">敏感词：{{formValidate.seoKeyword}}</div>
                         </el-form-item>
                         <!-- 关联标签库 -->
@@ -149,6 +149,8 @@
                                     reserve-keyword
                                     :remote-method="fetchQueryKeywordList"
                                     :loading="remoteLoading"
+                                    @click.native="handlerDiscrip"
+                                    @change="handlerTypeId"
                             >
                                 <el-option v-for="item in labelList" :key="item.id" :label="item.keyword" :value="item.id"></el-option>
                             </el-select>