考试系统页面开发

assets/scss/cus-client/cus-client-common.scss

@@ -579,6 +579,7 @@ h1,h2,h3,h4,h5,h6,p{font-weight:normal;margin: 0;}
     .el-carousel{width: 560px;height: 379px;flex-shrink: 0;}
     .el-carousel__container{height: 379px;}
     .cpfw-img-box{width: 100%;height: 379px;display: block;background-position: center;background-repeat: no-repeat;background-size: cover;}
+    img{width: 560px;}
 
     // 内容区域
     .products-services-content{
@@ -587,8 +588,12 @@ h1,h2,h3,h4,h5,h6,p{font-weight:normal;margin: 0;}
       box-sizing: border-box;
       margin: 0 20px;
       @include setFontStyle(-6);
-      h5{@include setFontStyle(4);color: rgba(0,0,0,0.85);margin-bottom: 32px;font-weight: bold;}
-      i{width:50px;height:5px;display: block;background: #3e7ce7;margin: 24px 0;}
+      h5{
+        @include setFontStyle(4);color: rgba(0,0,0,0.85);margin-bottom: 32px;font-weight: bold;
+        // 考试培训 数字
+        p{display: inline-block;vertical-align: middle;}
+        i{font-weight: 400;font-size: 150px;color: rgba(215, 215, 215, 0.6);display: inline-block;vertical-align: middle;font-style: normal;margin: 0 12px;}
+      }
       p{line-height: 24px;color:rgb(16, 16, 16);margin-bottom: 56px;text-align: justify;font-weight: bold;}
       .p-before-circle{margin-bottom: 6px;}
       .p-before-circle:before{
@@ -624,10 +629,6 @@ h1,h2,h3,h4,h5,h6,p{font-weight:normal;margin: 0;}
   }
 }
 .products-contrary-box{flex-direction: row-reverse;}
-// 考试平台和培训平台样式--多下边线
-.platform-products-services{
-  li:not(:last-child){border-bottom:1px solid #eee; }
-}
 
 // 详情页内容
 .industrydetails-content{

assets/scss/cus-client/cus-client-page.scss

@@ -224,222 +224,106 @@
         .free-trial-default-btn{position: absolute;top:260px;left: 50%;margin-left: -119px;}
       }
 
-      /* 产品体验*/
-      .platform-products-experience{
-        >p{font-size: 20px;line-height: 20px;text-align: center;margin: 30px 0 42px;}
-        .experience-ul-box{
-          margin: 0 -16px;text-align: center;
-          li{
-            width:25%;display: inline-block;text-align: center;font-size: 16px;
-            >div{
-              margin: 0 16px;padding:32px 18px;box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 6px 0px;border-radius: 10px;position: relative;
-              div{font-size:20px;color:#fff;position: absolute;right: 0;left: 0;top: 0;bottom: 305px;box-sizing: border-box;transition: 0.5s;overflow: hidden;border-radius: 10px;line-height: 305px;background: rgba(0,0,0,.6);cursor: default;}
-            }
-            i{display: inline-block;width: 46px;height: 46px;background-repeat: no-repeat;background-size: contain;margin-bottom: 24px;}
-            h5{font-size: 22px;color: rgb(16, 16, 16);margin-bottom: 24px;}
-            p{font-size: 16px;padding: 0;margin: 0;color: #101010;line-height: 26px;}
-            a{width: 180px;height: 40px;line-height: 40px;display: inline-block;margin-top: 24px;text-align: center;background-color: #3e7ce7;
-              border-color: rgba(255, 0, 0, 0);border-width: 1px;border-style: solid;color: rgb(255, 255, 255);border-radius:4px;font-weight: normal;cursor: pointer}
-            span{display: block;transition: 0.5s;position: absolute;top: 0;bottom: 305px;left: 0;right: 0;overflow: hidden;}
-            em{width:180px;height:180px;display: block;margin: 24px auto;background-image:url("~static/images/client/exam/exam-code-img.png")}
-            em.px-img-box{background-image:url("~static/images/client/train/train-code-img.png")}
-          }
-          li:nth-child(1) i{background-image:url("~static/images/client/exam/exam-tel-icon.png")}
-          li:nth-child(2) i{background-image:url("~static/images/client/exam/exam-pc-icon.png")}
-          li:nth-child(3) i{background-image:url("~static/images/client/exam/exam-sz-icon.png")}
-          li:nth-child(4) i{background-image:url("~static/images/client/exam/exam-sx-icon.svg")}
-        }
-      }
-
-      /* 产品优势 */
-      .platform-products-services{
-          li:not(:last-child){border-bottom:1px solid #eee; }
-      }
-
-      /* 产品功能 */
-      .platform-product-function{
-        background: #f8f8f8;
-        padding-bottom: 32px;
-        // ul
-        .product-function-box{
-          margin-top: 48px;
-          li{
-            width: 50%;display: inline-block;transition: .3s all linear;
-            div{padding: 12px 16px 12px 8px;margin: 0 32px 24px;background: #fff;}
-            i{width: 158px;height: 120px;margin-right:24px;float:left;background-size: cover;background-repeat: no-repeat;}
-            h5{@include setFontStyle(-2);color: rgba(0,0,0,0.85);margin: 12px 0 8px 0;}
-            p{@include setFontStyle(-6);height:66px;line-height: 22px;color: rgba(0,0,0,0.65);@include multi-line-ellipsis(3);}
-          }
-        }
-        .product-function-box li:nth-child(1) i,.product-function-icon1{background-image:url("~static/images/client/exam/product-function-icon1.png");}
-        .product-function-box li:nth-child(2) i,.product-function-icon2{background-image:url("~static/images/client/exam/product-function-icon2.png");}
-        .product-function-box li:nth-child(3) i,.product-function-icon3{background-image:url("~static/images/client/exam/product-function-icon3.png");}
-        .product-function-box li:nth-child(4) i,.product-function-icon4{background-image:url("~static/images/client/exam/product-function-icon4.png");}
-        .product-function-box li:nth-child(5) i,.product-function-icon5{background-image:url("~static/images/client/exam/product-function-icon5.png");}
-        .product-function-box li:nth-child(6) i,.product-function-icon6{background-image:url("~static/images/client/exam/product-function-icon6.png");}
-        .product-function-box li:nth-child(7) i,.product-function-icon7{background-image:url("~static/images/client/exam/product-function-icon7.png");}
-        .product-function-box li:nth-child(8) i,.product-function-icon8{background-image:url("~static/images/client/exam/product-function-icon8.png");}
-        .product-function-box li:hover{div{box-shadow: 0 2px 4px 0 #D4DBFF;border-radius: 8px;cursor: default}}
-      }
-
-      /* 应用场景 */
-      .platform-application-scenarios{
-         background: #FFF;
-         padding-bottom: 80px;
-        .application-scenarios-box{margin: 48px -12px 0;}
-        li{
-          width: 33.33%;
-          display: inline-block;
-          vertical-align: top;
-          color: #fff;
-          .application-scenarios-img{width: 100px;height: 100px;background-size: cover;margin: 0 auto 24px;}
-          .application-scenarios-content{
-            padding: 50px 30px 40px;margin: 0 12px;background: #FFF;
-            h5{@include setFontStyle(0);text-align: center;margin-bottom: 24px;}
-            p{@include setFontStyle(-4);line-height: 24px;text-align: justify;@include multi-line-ellipsis(5);min-height: 118px;max-height: 118px}
-          }
-        }
+    // 考试应用场景
+    .client-scene-box{
+      ul{
+        margin-top: 24px;
+        li{width: 25%;display: inline-block;margin: 24px 0;text-align: center;cursor: default;}
+        span{width: 100px;height: 100px;border-radius: 50%;display: inline-block;text-align: center;transition: .3s;}
+        i{width: 60px;height: 60px;background-size: cover;display: inline-block;margin-top: 20px;}
+        p{font-weight: 700;font-size: 20px;color: rgb(16, 16, 16);margin: 12px 0;}
         li:nth-child(1){
-          .application-scenarios-img {background-image: url("~static/images/client/exam/application-scenarios-img1.png");}
-          .application-scenarios-content{background: #ffbf00;}
+          span{background-color: rgb(0, 150, 136);}
+          i{background-image: url("~static/images/client/exam/exam-scene-icon1.png");}
         }
         li:nth-child(2){
-          .application-scenarios-img {background-image: url("~static/images/client/exam/application-scenarios-img2.png");}
-          .application-scenarios-content{background: #3799db;}
+          span{background-color: rgb(255, 152, 0);}
+          i{background-image: url("~static/images/client/exam/exam-scene-icon2.png");}
         }
         li:nth-child(3){
-          .application-scenarios-img {background-image: url("~static/images/client/exam/application-scenarios-img3.png");}
-          .application-scenarios-content{background: #63ba86;}
+          span{background-color: rgb(234, 73, 79);}
+          i{background-image: url("~static/images/client/exam/exam-scene-icon3.png");}
+        }
+        li:nth-child(4){
+          span{background-color: rgb(64, 158, 255);}
+          i{background-image: url("~static/images/client/exam/exam-scene-icon4.png");}
+        }
+        li:nth-child(5){
+          span{background-color: rgb(255, 128, 108);}
+          i{background-image: url("~static/images/client/exam/exam-scene-icon5.png");}
+        }
+        li:nth-child(6){
+          span{background-color: rgb(179, 111, 238);}
+          i{background-image: url("~static/images/client/exam/exam-scene-icon6.png");}
+        }
+        li:nth-child(7){
+          span{background-color: rgb(72, 97, 132);}
+          i{background-image: url("~static/images/client/exam/exam-scene-icon7.png");}
+        }
+        li:nth-child(8){
+          span{background-color: rgb(160, 212, 104);}
+          i{background-image: url("~static/images/client/exam/exam-scene-icon8.png");}
+        }
+        li:nth-child(9){
+          span{background-color: rgb(68, 70, 147);}
+          i{background-image: url("~static/images/client/exam/exam-scene-icon9.png");}
+        }
+        li:nth-child(10){
+          span{background-color: rgb(174, 102, 66);}
+          i{background-image: url("~static/images/client/exam/exam-scene-icon10.png");}
+        }
+        li:nth-child(11){
+          span{background-color: rgb(110, 87, 123);}
+          i{background-image: url("~static/images/client/exam/exam-scene-icon11.png");}
+        }
+        li:nth-child(12){
+          span{background-color: rgb(116, 120, 124);}
+          i{background-image: url("~static/images/client/exam/exam-scene-icon12.png");}
+        }
+        li:hover{
+          span{transform: translateY(-8px);;}
         }
       }
-    @media (max-width: 768px){
-      /* 网站banner */
-      .client-platform-banner{
-        height: 150px;
-        div{background-size: cover;}
-        .free-trial-default-btn{top: 90px;margin-left: -61px;}
-      }
-
-      // 产品体验
-      .platform-products-experience{
-        .sjxyd-icon {background-image: url("~static/images/client/exam/exam-tel-icon.png")}
-        .dnxyd-icon {background-image: url("~static/images/client/exam/exam-pc-icon.png")}
-        .dngld-icon {background-image: url("~static/images/client/exam/exam-sz-icon.png")}
-        .skrz-icon {background-image: url("~static/images/client/exam/exam-sx-icon.svg")}
-        >p{font-weight: 400;font-size: 14px;color: rgba(85, 85, 85, 1);margin: 24px 0 16px;}
-      }
-
-      // 产品优势
-      .platform-products-services{
-        li:not(:last-child) {border: 0;}
-        .products-services-content div{text-align: center;margin-bottom: 40px;}
-      }
+    }
 
-      // 产品功能
-      .platform-product-function{
-        padding-bottom: 16px;
-        // swiper
-        .experience-swiper-box{
-          // swiper 内容区域
-          .experience-content-box{
-            height:328px;margin: 16px 4% 20px;padding: 16px 16px 46px;box-sizing: border-box;box-shadow: rgb(170, 209, 249) 0 0 6px -1px;background-color: #fff;
-            i{width: 150px;height: 122px;}
-            h5{width: 100%;text-align: left;margin-bottom: 12px;}
-            p{text-align: justify;line-height: 24px;margin: 0;@include multi-line-ellipsis(4);}
-          }
-          // 分页
-          .swiper-pagination-style {width: 200px;margin-left: -90px;bottom: 50px;}
-          // 左右滑动
-          .experience-swiper-tip{margin: 0}
+    // 轻松组织一场考试
+    .platform-products-services{
+      .client-title{margin-bottom: 46px;}
+      .products-services-content{
+        h5{margin: 0;}
+        .client-btn-box {
+          margin-top: 80px;
         }
       }
+    }
 
-      // 应用场景
-      .platform-application-scenarios{
-        padding-bottom: 16px;
-        // swiper
-        .experience-swiper-box{
-          margin-top: 16px;
-          .experience-content-box{
-            height: 295px;box-shadow:none;padding: 16px;box-sizing: border-box;margin: 0 4% 40px;
-            h5{margin-bottom: 12px;color: #fff}
-            p{text-align: justify;line-height: 24px;margin: 0;@include multi-line-ellipsis(45);color: #fff}
-          }
-          .scenarios-gwks-box{
-            background-color: #ffbf00;
-            i{background-image: url("~static/images/client/exam/application-scenarios-img1.png");}
-          }
-          .scenarios-dxjs-box{
-            background-color: #3799db;
-            i{background-image: url("~static/images/client/exam/application-scenarios-img2.png");}
-          }
-          .scenarios-zgks-box{
-            background-color: #63ba86;
-            i{background-image: url("~static/images/client/exam/application-scenarios-img3.png");}
-          }
-          // 分页
-          .swiper-pagination-style {width: 76px;margin-left: -30px;bottom:25px;}
-          // 左右滑动
-          .experience-swiper-tip{margin: 0}
-
+    // 满足12大考试应用场景
+    .client-examOrg-box{
+      height: 560px;background-position: center;background-image: url("~static/images/client/exam/exam-org-bj.png");background-color: rgba(248, 248, 248, 0.8);background-blend-mode: overlay;background-position: center;
+      .exam-dl-box{display: flex;justify-content: space-between;margin-top: 42px;}
+      dt{font-weight: 400;font-size: 20px;color: rgba(0, 0, 0, 1);margin-bottom: 24px;}
+      dd{font-weight: 400;font-size: 16px;color: rgba(0, 0, 0, 1);margin-bottom: 12px;}
+      dd:before{width: 5px;height: 5px;background: #00aeba;content: '';display: inline-block;vertical-align: middle;margin-right: 6px;border-radius: 50%;}
+      // 按钮
+      .client-btn-box{
+        text-align: center;margin-top: 42px;
+        .client-default-Btn,.client-default-white-Btn {
+          width: 150px;height: 40px;line-height: 40px;display: inline-block;background: #00aeba;border: 1px solid #00aeba;box-sizing: border-box;margin-right: 24px;
         }
-
+        .client-default-white-Btn {background: #fff;color: #00aeba;margin-right: 0;}
       }
+
     }
   }
 
   /********  describe: 培训平台--图片（和考试默认图片不同） author: TX  date:2020-08-14  ********/
   .client-train-page{
 
-    /* 产品体验*/
-    .platform-products-experience{
-      .experience-ul-box li{
-          em{background-image:url("~static/images/client/train/train-code-img.png")}
-      }
-    }
-
     /* 网站banner */
     .client-platform-banner{
       background-color:#1F2772;
     }
 
-    /* 产品功能 */
-    .platform-product-function{
-      // ul
-      .product-function-box{
-        li:nth-child(1){i{background-image:url("~static/images/client/train/product-function-icon1.png");}}
-        li:nth-child(2){i{background-image:url("~static/images/client/train/product-function-icon2.png");}}
-        li:nth-child(3){i{background-image:url("~static/images/client/train/product-function-icon3.png");}}
-        li:nth-child(4){i{background-image:url("~static/images/client/train/product-function-icon4.png");}}
-        li:nth-child(5){i{background-image:url("~static/images/client/train/product-function-icon5.png");}}
-        li:nth-child(6){i{background-image:url("~static/images/client/train/product-function-icon6.png");}}
-        li:nth-child(7){i{background-image:url("~static/images/client/train/product-function-icon7.png");}}
-        li:nth-child(8){i{background-image:url("~static/images/client/train/product-function-icon8.png");}}
-      }
-    }
-
-    /* 应用场景 */
-    .train-application-scenarios{
-      li:nth-child(1){
-        .application-scenarios-img {
-          background-image: url("~static/images/client/train/application-scenarios-img1.png");
-        }
-      }
-      li:nth-child(2){
-        .application-scenarios-img {
-          background-image: url("~static/images/client/train/application-scenarios-img2.png");
-        }
-      }
-      li:nth-child(3){
-        .application-scenarios-img {
-          background-image: url("~static/images/client/train/application-scenarios-img3.png");
-        }
-      }
-    }
-    @media (max-width: 768px){
-      /* 网站banner */
-      .client-platform-banner .free-trial-default-btn{top: 95px;}
-    }
   }
 
   /********  describe: 课程开发 author: TX  date:2020-08-24  ********/
@@ -1316,40 +1200,7 @@
       .experience-swiper-box .swiper-pagination-style {width: 80px;margin-left: -30px;}
     }
   }
-  // 立即注册弹窗
-  .register-now-dialog{
-      .el-dialog{
-        width:540px;
-        // 关闭图标
-        .el-icon-close:before{color: #fff}
-        // 弹窗头部
-        .el-dialog__header{height: 100px;background: #363fdc;}
-        // 弹窗body
-        .el-dialog__body{
-          height:200px;position: relative;background: #fff;
-          .register-now-box{
-            position: absolute;top: -100px;left: 0;right: 0;
-            >p{font-size: 18px;color: #fff;text-align: center;line-height: 24px;margin-bottom: 8px}
-            >span{
-              margin-top: 36px;color: #666;font-size: 16px;display: block;text-align: center;
-              .tel-code{font-size: 30px;color:#1f68b4;font-weight: bold;}
-            }
-          }
-        }
-        .system-box{
-          width:400px;height:160px;background: #fff;border: 1px solid #b5b5b5;border-radius: 4px;padding: 10px 8px;margin: 16px auto;display:flex;justify-content: space-around;align-items: center;
-          a{
-            display: inline-block;
-            i{width: 158px;height: 120px;display: block;background-size: cover;}
-          }
 
-          span{width: 1px;min-height: 100px;display:inline-block;background:#e8e8e8;@include setFontStyle(-4);margin: 10px;}
-          p{@include setFontStyle(-4);color: rgba(0,0,0,0.85);line-height: 24px;text-align: center;}
-        }
-        .system-box:nth-child(1){i{background-image:url("~static/images/client/exam/product-function-icon3.png");} }
-        .system-box:nth-child(3){i{background-image:url("~static/images/client/train/product-function-icon6.png");} }
-      }
-  }
 
   // 系统维护弹窗
   .system-maintain-dialog{

pages/examsystem/index.vue

@@ -3,88 +3,41 @@
     <div class="client-platform-page">
 
       <!-- 考试平台页 banner栏 -->
-      <div class="client-platform-banner">
+      <div class="client-platform-banner" v-if="bannerList.length>0">
         <div  @click="clickBanner(bannerList[0].url)" :style="{backgroundImage: `url(${bannerList[0].pic||require(`~/static/images/client/exam/exam-banner-background.png`)})`}"></div>
         <a rel="nofollow" class="free-trial-default-btn" @click="FreeTrial">免费试用</a>
       </div>
-      <!--  产品体验 -->
-      <div class="platform-products-experience client-container">
-        <h4 class="client-title">产品体验</h4>
-        <p>无需注册，即可免费体验麦塔在线考试系统</p>
-        <ul class="experience-ul-box mta-hidden-xs">
-          <li>
-            <div @mouseenter="enterCode" @mouseleave="leaveCode"><i></i>
-              <h5>手机学员端</h5>
-              <p>用手机扫描二维码</p>
-              <p>考生30秒体验答卷</p>
-              <a style="cursor: default">扫码体验</a>
-              <span ref="codeBtn" v-if="youkeFlag"><em></em></span>
-              <div ref="codeBtn" v-if="!youkeFlag">系统升级中...</div>
-            </div>
-          </li>
-          <li><div><i></i><h5>电脑学员端</h5><p>支持市面各种主流浏览器</p><p>支持十万量级的考试并发</p><a @click="KsTyBtn('https://youkeksc.mtavip.com/c/youke')">立即体验</a></div></li>
-          <li><div><i></i><h5>电脑管理端</h5><p>欢迎体验麦塔系统后台</p><p>三步轻松组织一场考试</p><a @click="KsTyBtn('https://youkeksa.mtavip.com/a/youke')">后台体验</a></div></li>
-          <li><div><i></i><h5>更新日志</h5><p>麦塔想您所想，不止于功能</p><p>我们一直在更新迭代</p><a  class="client-default-Btn" @click="goCheckLog">查看日志</a></div></li>
-        </ul>
-        <!-- 手机轮播 -->
-        <div class="experience-swiper-box mta-hidden-sm">
-          <div v-swiper:mySwiper="swiperOption" class="swiper-container">
-            <div class="swiper-wrapper">
-              <div class="swiper-slide">
-                <div class="experience-content-box">
-                  <i class="sjxyd-icon"></i>
-                  <h5>手机学员端</h5>
-                  <p>点击立即体验按钮，考生30秒体验答卷</p>
-                  <a style="cursor: default" @click="ykFreeTrial">立即体验</a>
-                </div>
-              </div>
-              <div class="swiper-slide">
-                <div class="experience-content-box">
-                  <i  class="dnxyd-icon"></i>
-                  <h5>电脑学员端</h5>
-                  <p>支持市面各种主流浏览器</p>
-                  <p>支持十万量级的考试并发</p>
-                  <a @click="KsTyBtn('https://youkeksc.mtavip.com/c/youke')">立即体验</a>
-                </div>
-              </div>
-              <div class="swiper-slide">
-                <div class="experience-content-box">
-                  <i class="dngld-icon"></i>
-                  <h5>电脑管理端</h5>
-                  <p>欢迎体验麦塔系统后台</p>
-                  <p>三步轻松组织一场考试</p>
-                  <a @click="KsTyBtn('https://youkeksa.mtavip.com/a/youke')">后台体验</a></div>
-              </div>
-              <!--<div class="swiper-slide">
-                <div class="experience-content-box">
-                  <i class="skrz-icon"></i>
-                  <h5>更新日志</h5>
-                  <p>麦塔想您所想，不止于功能</p>
-                  <p>我们一直在更新迭代</p>
-                  <a  class="client-default-Btn" @click="goCheckLog">查看日志</a>
-                </div>
-              </div>-->
-            </div>
-            <div class="swiper-pagination swiper-pagination-style"></div>
-            <p class="experience-swiper-tip">←左右滑动查看更多→</p>
-          </div>
+      <!-- 行业学习需求 -->
+      <div class="client-scene-box">
+        <div class="client-container">
+          <h4 class="client-title">满足12大考试应用场景</h4>
+          <ul>
+            <li><div><span><i></i></span><p>招聘考试</p></div></li>
+            <li><div><span><i></i></span><p>资格考试</p></div></li>
+            <li><div><span><i></i></span><p>员工考试</p></div></li>
+            <li><div><span><i></i></span><p>需求调研</p></div></li>
+            <li><div><span><i></i></span><p>渠道考核</p></div></li>
+            <li><div><span><i></i></span><p>随堂测验</p></div></li>
+            <li><div><span><i></i></span><p>知识竞猜</p></div></li>
+            <li><div><span><i></i></span><p>模拟考试</p></div></li>
+            <li><div><span><i></i></span><p>职业考核</p></div></li>
+            <li><div><span><i></i></span><p>岗位晋升</p></div></li>
+            <li><div><span><i></i></span><p>经销商考试</p></div></li>
+            <li><div><span><i></i></span><p>党章考试</p></div></li>
+          </ul>
         </div>
       </div>
-
-
-
       <div class="platform-products-services">
-        <h4 class="client-title">产品优势</h4>
+        <h4 class="client-title">轻松组织一场考试</h4>
         <ul>
           <li>
             <div class="client-container">
               <div class="products-services-box products-contrary-box">
-              <img :src="advantagesImg1" alt="万人并发运行顺畅" />
+              <img :src="advantagesImg1" alt="创建考试" />
               <div class="products-services-content">
-                <h5>良好高并发性和访问安全性</h5>
-                <i></i>
-                <p>采用的运行稳定、安全性很高的JAVA语言开发；拥有强大的考试并发负载能力，支持万人以上考生同时在线考试；分布式微服务架构、开放、安全、高能、高可靠的服务调用； 为企业快速、灵活构建大规模分布式服务应用提供基础；</p>
-                <div><a rel="nofollow" class="client-default-Btn" @click="FreeTrial">免费试用</a></div>
+                <h5><span>创建考试</span><i>1</i></h5>
+                <p class="p-before-circle">手动录入或批量导入试题，完善考试系统试题库</p>
+                <div class="client-btn-box"><div rel="nofollow" class="client-default-Btn" @click="FreeTrial">免费试用</div><span  class="client-default-Btn" @click="goExamPage">在线咨询</span></div>
               </div>
             </div>
             </div>
@@ -92,12 +45,11 @@
           <li>
             <div class="client-container">
               <div class="products-services-box">
-              <img :src="advantagesImg2" alt="考试监控预防作弊" />
+              <img :src="advantagesImg2" alt="发布考试" />
               <div class="products-services-content">
-                <h5>严格的考试监控防作弊功能</h5>
-                <i></i>
-                <p>试题乱序、选项乱序、禁止右键复制粘贴；人脸识别登录，防止替考；考试过程禁止切屏，解决离开考试界面的问题；考试过程中头像抓拍和视频监控防止作弊</p>
-                <div><a rel="nofollow" class="client-default-Btn" @click="FreeTrial">免费试用</a></div>
+                <h5><span>发布考试</span><i>2</i></h5>
+                <p class="p-before-circle">可选择创建新试卷，或从试卷库中选择一张试卷进行考试</p>
+                <div class="client-btn-box"><div rel="nofollow" class="client-default-Btn" @click="FreeTrial">免费试用</div><span  class="client-default-Btn" @click="goExamPage">在线咨询</span></div>
               </div>
             </div>
             </div>
@@ -105,12 +57,11 @@
           <li>
             <div class="client-container">
               <div class="products-services-box products-contrary-box">
-              <img :src="advantagesImg3" alt="微信答题一扫就考" />
+              <img :src="advantagesImg3" alt="开始考试" />
               <div class="products-services-content">
-                <h5>PC移动支持多终端，随时随地考试</h5>
-                <i></i>
-                <p>支持PC使用，更支持移动端H5使用，还可以支持微信绑定答题，学员用手机扫描二维码，轻松答题支持专属APP的定制</p>
-                <div><a rel="nofollow" class="client-default-Btn"  @click="FreeTrial">免费试用</a></div>
+                <h5><span>开始考试</span><i>3</i></h5>
+                <p class="p-before-circle">学员使用电脑或移动设备进行考试</p>
+                <div class="client-btn-box"><div rel="nofollow" class="client-default-Btn" @click="FreeTrial">免费试用</div><span  class="client-default-Btn" @click="goExamPage">在线咨询</span></div>
               </div>
             </div>
             </div>
@@ -118,12 +69,11 @@
           <li>
             <div class="client-container">
               <div class="products-services-box">
-              <img :src="advantagesImg4" alt="功能丰富的在线考试" />
+              <img :src="advantagesImg4" alt="自动批阅" />
               <div class="products-services-content">
-                <h5>丰富的考试管理功能</h5>
-                <i></i>
-                <p>多层级组织架构快速搭建，多级权限管理人员设置；支持多种题型，单选、多选、判断、填空、简答、阅读理解、公式题、音频题、图片题、视频题，同时支持word和Excel批量导入题库；支持随机抽取试题，每个考生题目随机生成；多种考试参数设置：答题倒计时，答卷限时，成绩发布，选择按人员、部门、职位发布考试。支持学员证书和积分获取，支持刷题模式的练习管理。</p>
-                <div><a rel="nofollow" class="client-default-Btn" @click="FreeTrial">免费试用</a></div>
+                <h5><span>自动批阅</span><i>4</i></h5>
+                <p class="p-before-circle">支持自动评卷。系统可根据事先录入的正确答案进行判分</p>
+                <div class="client-btn-box"><div rel="nofollow" class="client-default-Btn" @click="FreeTrial">免费试用</div><span  class="client-default-Btn" @click="goExamPage">在线咨询</span></div>
               </div>
             </div>
             </div>
@@ -132,159 +82,65 @@
 
       </div>
 
-      <!--  产品功能 -->
-      <div class="platform-product-function">
+      <!-- 六大管理中心，助你轻松组织考试 -->
+      <div class="client-examOrg-box">
         <div class="client-container">
-          <h4 class="client-title">产品功能</h4>
-          <ul class="product-function-box mta-hidden-xs">
-            <li><div><i></i><h5>用户权限管理</h5><p>多层级组织架构和角色权限的快速搭建，可分层独立管理，解决大型组织的复杂培训管理需求，支持和用户的OA、HR、ERP、教务、微信、钉钉等系统对接单点登录和用户信息同步</p></div></li>
-            <li><div><i></i><h5>考试防作弊管理</h5><p>支持人脸识别登录，防止替考；考试过程禁止切屏，解决离开考试界面的问题；考试过程中头像抓拍和视频监控防止作弊</p></div></li>
-            <li><div><i></i><h5>多种组卷模式</h5><p>支持固定选题组卷、按比例随机抽题组卷，满足各种组卷需求；整卷答题适用于正规考试，逐题模式适用于竞赛闯关考试</p></div></li>
-            <li><div><i></i><h5>丰富的题库管理</h5><p>可以按科目多维度建设题库，支持单选、多选、判断题、填空题、简答题多种题型，同时支持word、Excel批量上传试题、图片，公式，一键轻松导入</p></div></li>
-            <li><div><i></i><h5>智能考试安排</h5><p>几十种考试参数设置，全方位把控考试细节，适应各种考试场景，考试安排智能化，随时随地，快速考试</p></div></li>
-            <li><div><i></i><h5>个性化定制</h5><p>定义主题背景、品牌、logo，搭建您的专属在线考试平台</p></div></li>
-            <li><div><i></i><h5>多维度统计分析</h5><p>从用户、考试、成绩、试题、排名、机构等层面多维度的统计系统数据</p></div></li>
-            <li><div><i></i><h5>性能稳定数据安全</h5><p>企业级技术框架，保证大并发考试的稳定；数据备份恢复，保障安全性</p></div></li>
-          </ul>
-          <!-- 手机轮播 -->
-          <div class="experience-swiper-box mta-hidden-sm">
-            <div v-swiper:mySwiperGn="swiperOptionGn" class="swiper-container">
-              <ul class="swiper-wrapper">
-                <li class="swiper-slide">
-                  <div class="experience-content-box">
-                    <i class="product-function-icon1"></i><h5>用户权限管理</h5>
-                    <p>多层级组织架构和角色权限的快速搭建，可分层独立管理，解决大型组织的复杂培训管理需求，支持和用户的OA、HR、ERP、教务、微信、钉钉等系统对接单点登录和用户信息同步</p>
-                  </div>
-                </li>
-                <li class="swiper-slide">
-                  <div class="experience-content-box">
-                    <i class="product-function-icon2"></i><h5>考试防作弊管理</h5>
-                    <p>支持人脸识别登录，防止替考；考试过程禁止切屏，解决离开考试界面的问题；考试过程中头像抓拍和视频监控防止作弊</p>
-                  </div>
-                </li>
-                <li class="swiper-slide">
-                  <div class="experience-content-box">
-                    <i class="product-function-icon3"></i><h5>多种组卷模式</h5>
-                    <p>支持固定选题组卷、按比例随机抽题组卷，满足各种组卷需求；整卷答题适用于正规考试，逐题模式适用于竞赛闯关考试</p>
-                  </div>
-                </li>
-                <li class="swiper-slide">
-                  <div class="experience-content-box">
-                    <i class="product-function-icon4"></i><h5>丰富的题库管理</h5>
-                    <p>可以按科目多维度建设题库，支持单选、多选、判断题、填空题、简答题多种题型，同时支持word、Excel批量上传试题、图片，公式，一键轻松导入</p>
-                  </div>
-                </li>
-                <li class="swiper-slide">
-                  <div class="experience-content-box">
-                    <i class="product-function-icon5"></i><h5>智能考试安排</h5>
-                    <p>几十种考试参数设置，全方位把控考试细节，适应各种考试场景，考试安排智能化，随时随地，快速考试</p>
-                  </div>
-                </li>
-                <li class="swiper-slide">
-                  <div class="experience-content-box">
-                    <i class="product-function-icon6"></i><h5>个性化定制</h5>
-                    <p>定义主题背景、品牌、logo，搭建您的专属在线考试平台</p>
-                  </div>
-                </li>
-                <li class="swiper-slide">
-                  <div class="experience-content-box">
-                    <i class="product-function-icon7"></i><h5>多维度统计分析</h5>
-                    <p>从用户、考试、成绩、试题、排名、机构等层面多维度的统计系统数据</p>
-                  </div>
-                </li>
-                <li class="swiper-slide">
-                  <div class="experience-content-box">
-                    <i class="product-function-icon8"></i><h5>性能稳定数据安全</h5>
-                    <p>企业级技术框架，保证大并发考试的稳定；数据备份恢复，保障安全性</p>
-                  </div>
-                </li>
-              </ul>
-              <div class="swiper-pagination swiper-pagination-style"></div>
-              <p class="experience-swiper-tip">←左右滑动查看更多→</p>
-            </div>
+          <h4 class="client-title">六大管理中心，助你轻松组织考试</h4>
+          <div class="exam-dl-box">
+            <dl>
+              <dt>用户管理中心</dt>
+              <dd>机构管理</dd>
+              <dd>部门管理</dd>
+              <dd>人员管理</dd>
+              <dd>角色管理</dd>
+              <dd>权限管理</dd>
+            </dl>
+            <dl>
+              <dt>试题管理中心</dt>
+              <dd>试题分类</dd>
+              <dd>试题类型</dd>
+              <dd>试题难度</dd>
+              <dd>手动录入</dd>
+              <dd>批量添加</dd>
+            </dl>
+            <dl>
+              <dt>试卷管理中心</dt>
+              <dd>固定试卷</dd>
+              <dd>随机试卷</dd>
+              <dd>指定分数</dd>
+              <dd>试卷导出</dd>
+            </dl>
+            <dl>
+              <dt>考试管理中心</dt>
+              <dd>考生范围</dd>
+              <dd>时间范围</dd>
+              <dd>防止作弊</dd>
+              <dd>评卷范围</dd>
+              <dd>查看成绩</dd>
+              <dd>错题重做</dd>
+              <dd>证书管理</dd>
+            </dl>
+            <dl>
+              <dt>统计管理中心</dt>
+              <dd>用户属性</dd>
+              <dd>考试分析</dd>
+              <dd>大数据分析</dd>
+            </dl>
+            <dl>
+              <dt>系统管理中心</dt>
+              <dd>用户注册</dd>
+              <dd>注册审核</dd>
+              <dd>试卷审核</dd>
+              <dd>考试审核</dd>
+              <dd>数据备份</dd>
+              <dd>接口对接</dd>
+            </dl>
           </div>
-          <a rel="nofollow" class="free-trial-default-btn" @click="FreeTrial">免费试用</a>
+          <div class="client-btn-box"><div rel="nofollow" class="client-default-Btn" @click="FreeTrial">免费试用</div><span  class="client-default-white-Btn" @click="goExamPage">在线咨询</span></div>
         </div>
       </div>
 
-
-      <!-- 应用场景 -->
-      <div class="platform-application-scenarios">
-        <div class="client-container">
-          <h4 class="client-title">应用场景</h4>
-          <ul class="application-scenarios-box mta-hidden-xs">
-            <li>
-              <div class="application-scenarios-content">
-                <div class="application-scenarios-img"></div>
-                <h5>岗位考试</h5>
-                <p>无论传统的培训还是新型的在线培训，企业都需要利用考核来进行培训效果评估，可以实现人才岗位胜任力测评、按需培训、绩效考核等功能，为领导者对员工素质进行评价和分析提供有力的数据支持。</p>
-              </div>
-            </li>
-            <li>
-              <div class="application-scenarios-content">
-                <div class="application-scenarios-img"></div>
-                <h5>大型竞赛</h5>
-                <p>多种组卷、考试模式，可以覆盖大多数竞赛场景，报名注册只需简单一步就搞定，无中间流程，企业还可自由定制证书，合格后进行发放，降低使用成本，规范、快捷、高效，万人同考无压力。</p>
-              </div>
-            </li>
-            <li>
-              <div class="application-scenarios-content">
-                <div class="application-scenarios-img"></div>
-                <h5>资格考试</h5>
-                <p>不限次发布考试，特殊题型可使用拍照上传功能，考生后台记录历史成绩，通过考试分析及时了解考生知识掌握情况，在线考试能突破时间空间限制，有利于组织大规模的考试，提高教学考核方式的灵活性。</p>
-              </div>
-            </li>
-          </ul>
-          <!-- 手机轮播 -->
-          <div class="experience-swiper-box mta-hidden-sm">
-            <div v-swiper:mySwiperCj="swiperOptionCj" class="swiper-container">
-              <ul class="swiper-wrapper">
-                <li class="swiper-slide">
-                  <div class="experience-content-box scenarios-gwks-box">
-                    <i class="product-function-icon1"></i><h5>岗位考试</h5>
-                    <p>无论传统的培训还是新型的在线培训，企业都需要利用考核来进行培训效果评估，可以实现人才岗位胜任力测评、按需培训、绩效考核等功能，为领导者对员工素质进行评价和分析提供有力的数据支持。</p>
-                  </div>
-                </li>
-                <li class="swiper-slide">
-                  <div class="experience-content-box scenarios-dxjs-box">
-                    <i class="product-function-icon2"></i><h5>大型竞赛</h5>
-                    <p>多种组卷、考试模式，可以覆盖大多数竞赛场景，报名注册只需简单一步就搞定，无中间流程，企业还可自由定制证书，合格后进行发放，降低使用成本，规范、快捷、高效，万人同考无压力。</p>
-                  </div>
-                </li>
-                <li class="swiper-slide">
-                  <div class="experience-content-box scenarios-zgks-box">
-                    <i class="product-function-icon3"></i><h5>资格考试</h5>
-                    <p>不限次发布考试，特殊题型可使用拍照上传功能，考生后台记录历史成绩，通过考试分析及时了解考生知识掌握情况，在线考试能突破时间空间限制，有利于组织大规模的考试，提高教学考核方式的灵活性。</p>
-                  </div>
-                </li>
-              </ul>
-              <div class="swiper-pagination swiper-pagination-style"></div>
-              <p class="experience-swiper-tip">←左右滑动查看更多→</p>
-            </div>
-          </div>
-          <a rel="nofollow" class="free-trial-default-btn" @click="FreeTrial">免费试用</a>
-        </div>
-      </div>
-
-      <!-- 新闻资讯 -->
-      <div class="platform-news-information mta-hidden-xs">
-        <div class="client-container">
-          <h4 class="client-title">新闻资讯</h4>
-          <ul>
-            <li style="font-size: 16px" v-for="(item, index) in topCarousels">
-              <div>
-                <img :src="item.pic" alt="新闻资讯" />
-                <h4 @click="checkInfo(item)">{{ item.title }}</h4>
-                <span>发布时间：{{item.yyyy }}-{{ item.mmdd }}</span>
-                <p>{{ item.intro }}</p>
-              </div>
-            </li>
-          </ul>
-        </div>
-      </div>
     </div>
-    <!-- 系统维护-->
-    <el-dialog :close-on-click-modal="false" :visible.sync="systemMaintainDl" class="system-maintain-dialog"></el-dialog>
   </div>
 
 
@@ -300,84 +156,22 @@
       // 设置选中菜单
       store.commit('setActiveNav', '/examsystem');
 
-      let [res1, res2] = await Promise.all([
+      let [res1] = await Promise.all([
                                              await $axios.$post(`/home/banner/list`, { 'code': 2 }).then(res => {
                                                return res;
                                              }),
-                                             await $axios.$post(`/home/news/carousel`, { 'newsClassifyId': 0,'keyword':'考试' }).then(res => {
-                                               return res;
-                                             })
                                            ]);
-      console.log(res2.data.data);
       return {
         bannerList: res1.data.data||[],
-        topCarousels: res2.data.data||[],
-
       };
 
     },
     data() {
       return {
-        SystemWidthFlag:false,// 判断是否是手机端，默认为false，默认为PC端
         advantagesImg1:  require(`~/static/images/client/exam/product-advantages-img1.png`),
         advantagesImg2:  require(`~/static/images/client/exam/product-advantages-img2.png`),
         advantagesImg3:  require(`~/static/images/client/exam/product-advantages-img3.png`),
         advantagesImg4:  require(`~/static/images/client/exam/product-advantages-img4.png`),
-        youkeFlag:false,// 控制游客系统是否维护中
-        systemMaintainDl:false,// 系统维护弹窗
-        swiperData: [
-          { imgUrl: require(`~/static/images/client/index/index-products-kaoshi.png`)},
-          { imgUrl: require(`~/static/images/client/index/index-products-peixun.png`) },
-          { imgUrl: require(`~/static/images/client/index/index-products-kejian.png`) },
-        ],
-        swiperOption: {
-          pagination: {
-            el: '.swiper-pagination',
-            bulletClass: 'my-bullet-swiper', // 自定义设置默认类名
-            bulletActiveClass: 'my-bullet-active-swiper', // 自定义滑块活跃类名
-            clickable: true, // 点击当前滑块切换到对应的轮播图片
-          },
-          autoplay: {
-            delay: 5000,
-          },
-          paginationClickable: true,
-          speed: 800,
-          loop: true,
-          observer: true,
-          observeParents: true,
-        },
-        swiperOptionGn: {
-          pagination: {
-            el: '.swiper-pagination',
-            bulletClass: 'my-bullet-swiper', // 自定义设置默认类名
-            bulletActiveClass: 'my-bullet-active-swiper', // 自定义滑块活跃类名
-            clickable: true, // 点击当前滑块切换到对应的轮播图片
-          },
-          autoplay: {
-            delay: 5000,
-          },
-          paginationClickable: true,
-          speed: 800,
-          loop: true,
-          observer: true,
-          observeParents: true,
-        },
-        swiperOptionCj: {
-          pagination: {
-            el: '.swiper-pagination',
-            bulletClass: 'my-bullet-swiper', // 自定义设置默认类名
-            bulletActiveClass: 'my-bullet-active-swiper', // 自定义滑块活跃类名
-            clickable: true, // 点击当前滑块切换到对应的轮播图片
-          },
-          autoplay: {
-            delay: 5000,
-          },
-          paginationClickable: true,
-          speed: 800,
-          loop: true,
-          observer: true,
-          observeParents: true,
-        },
       };
     },
     head(){
@@ -397,100 +191,10 @@
     },
     computed:   {},
     methods:    {
-      // 游客系统试用
-      ykFreeTrial(){
-        if(this.youkeFlag){
-          // 没升级
-          window.open('https://youkeksc.mtavip.com/kscmdist/#/youke')
-        }else{
-          // 升级中
-          this.$message({customClass:'phone-message-box',type: 'warning',message: '系统升级中，请稍后再试...'});
-        }
-      },
-      // 免费试用
-      FreeTrial(){
-        this.getSystemWidth();
-          // 没升级
-          if(this.SystemWidthFlag){
-            window.open('https://cdnks.mtavip.com/mdist/#/webRegister?flug=1')
-          }else{
-            window.open('https://cdnks.mtavip.com/a/register?flug=1')
-
-          }
-      },
-      // 判断是否为移动端
-      getSystemWidth(){
-        var browserWidth=document.documentElement.clientWidth;
-        if(browserWidth <= 768){
-          this.SystemWidthFlag = true;
-        }else{
-          this.SystemWidthFlag = false;
-        }
-      },
-      // 考试体验按钮
-      KsTyBtn(btnUrl){
-        this.getSystemWidth();
-        if(this.youkeFlag) {
-          if(this.SystemWidthFlag){
-            this.$router.push({ name: 'copyUrl', query: { url: btnUrl, } });
-          }else {
-            window.open(btnUrl);
-          }
-        }else{
-          if(this.SystemWidthFlag){
-            // 升级中
-            this.$message({customClass:'phone-message-box',type: 'warning',message: '系统升级中，请稍后再试...'});
-          }else{
-            this.systemMaintainDl = true;
-          }
-        }
-      },
-
-      //  describe: 查看日志 author: Wgy date:6/8/21
-
-      goCheckLog(){
-        this.$router.push({ name: 'checkLogKaoshi' });
-      },
-      // 鼠标移入
-      enterCode(){
-        if(this.youkeFlag){
-        this.$refs.codeBtn.style.bottom ='90px';
-        }else{
-          this.$refs.codeBtn.style.bottom ='0';
-        }
-      },
-
-      // 鼠标移出
-      leaveCode(){
-        this.$refs.codeBtn.style.bottom ='305px';
-      },
-
-      clickBanner(data){
-        if(data){
-          window.open(data)
-        }
-
-      },
-
-      checkInfo(data) {
-        const opt = {
-          id: data.code,
-        };
-        this.$router.push({ name: 'news-id', params: opt });
-      },
     },
     created() {
-      // 页面初始化
-      this.$axios.$post('/home/youke/stop').then(res=>{
-        if (res.data === '1') {
-          this.youkeFlag = false;
-        }else{
-          this.youkeFlag = true;
-        }
-      });
     },
     mounted() {
-      this.getSystemWidth();
     },
     beforeDestroy() {
     },

static/images/client/exam/application-scenarios-icon2.svg

@@ -1,22 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40">
-  <defs>
-    <linearGradient id="2-a" x1="50%" x2="115.878%" y1="41.195%" y2="58.805%">
-      <stop offset="0%" stop-color="#D4AA37"/>
-      <stop offset="100%" stop-color="#F9F0C4"/>
-    </linearGradient>
-    <linearGradient id="2-b" x1="50%" x2="54.16%" y1="0%" y2="100%">
-      <stop offset="0%" stop-color="#D4AA37"/>
-      <stop offset="100%" stop-color="#F9F0C4"/>
-    </linearGradient>
-    <linearGradient id="2-c" x1="50%" x2="88.131%" y1="0%" y2="100%">
-      <stop offset="0%" stop-color="#D4AA37"/>
-      <stop offset="100%" stop-color="#F9F0C4"/>
-    </linearGradient>
-  </defs>
-  <g fill="none" fill-rule="evenodd">
-    <polygon fill="url(#2-a)" points="13 14.215 17.497 15.988 18.202 15.579 13.705 13.805"/>
-    <polygon fill="url(#2-b)" points="22.804 23.387 23.613 28.998 24.317 28.588 23.508 22.977"/>
-    <polygon fill="url(#2-c)" points="20.176 12 19.47 12.41 21.52 18.259 26.025 21.544 26.731 21.134 22.224 17.85"/>
-    <polygon fill="#FEBF11" points="17.497 15.988 13 14.215 16.29 19.716 15.561 24.468 19.564 24.288 23.612 28.998 22.803 23.388 26.024 21.544 21.519 18.259 19.47 12.411"/>
-  </g>
-</svg>

static/images/client/exam/exam-sx-icon.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="80" height="80" class="svg-icon" style="fill: rgb(0, 64, 151);"><path d="M12 4V1L8 5l4 4V6c3.31 0 6 2.69 6 6 0 1.01-.25 1.97-.7 2.8l1.46 1.46A7.93 7.93 0 0 0 20 12c0-4.42-3.58-8-8-8zm0 14c-3.31 0-6-2.69-6-6 0-1.01.25-1.97.7-2.8L5.24 7.74A7.93 7.93 0 0 0 4 12c0 4.42 3.58 8 8 8v3l4-4-4-4v3z"></path></svg>