Sfoglia il codice sorgente

banner改为动态获取,修改样式

tanxue 4 anni fa
parent
commit
eb42de5984
2 ha cambiato i file con 20 aggiunte e 62 eliminazioni
  1. 18 60
      assets/scss/cus-client/cus-client-page.scss
  2. 2 2
      pages/index.vue

+ 18 - 60
assets/scss/cus-client/cus-client-page.scss

@@ -14,6 +14,13 @@
       background-position-x: center;
       background-repeat: no-repeat;
     }
+    /* banner-box */
+    .client-banner-box{
+        .el-carousel__container{height: 395px;}
+        .el-carousel__item{
+          img{margin: 0 auto;display: block;}
+        }
+    }
 
     /* 发展历程*/
     .client-company-history{
@@ -402,6 +409,7 @@
       background-position-x: center;
       background-repeat: no-repeat;
     }
+    .client-course-banner:hover{cursor: pointer;}
 
     /* 调转菜单栏 */
     .course-service-nav{width: 100%;height: 72px;background: url("~static/images/client/course/course--nav-bg.png") repeat-x;padding-top: 15px;text-align: center;}
@@ -519,65 +527,15 @@
 
     // 企业发展历程
     .enterprise-development-box{
-      background: #F9FAFF;
-      .development-left{
-        float: left;
-        width: 50%;
-        text-align: right;
-        padding-right: 76px;
-        padding-top: 170px;
-        box-sizing: border-box;
-        .development-content{
-          h4 div{top: -8px;right: -87px;left: auto}
-          p i{margin-left:16px;}
-        }
-      }
-      .development-right{
-        width: 50%;
-        margin-bottom: 80px;
-        float: right;
-        padding-left: 76px;
-        border-left: 1px solid #D1DFFD;
-        box-sizing: border-box;
-        .development-content{
-          h4 div{top: -8px;left: -87px;right: auto}
-          p i{margin-right:16px;}
-        }
-
-      }
-      .development-content{
-        position: relative;
-        h4{
-          @include setFontStyle(8);color: rgba(0,0,0,0.85);margin-bottom: 24px;
-          div{width: 20px;height: 34px;position: absolute;background:#F9FAFF}
-          span{
-            width: 18px;
-            height: 18px;
-            border: 1px solid #2B5CFD;
-            display: inline-block;
-            vertical-align: middle;
-            border-radius: 50%;
-            text-align: center;
-          }
-          i{
-            width: 12px;
-            height: 12px;
-            display: inline-block;
-            vertical-align: top;
-            margin-top: 3px;
-            background-image: url("~static/images/client/aboutUs/development-content-icon.svg");
-          }
-          p{display: inline-block;margin: 0;}
-        }
-        p{
-          margin-bottom: 16px;
-          i{width: 36px;height:24px;line-height:24px;display: inline-block;text-align: center;@include setFontStyle(-6);color: rgba(0,0,0,0.65);background: rgba(121,152,255,0.26);border: 1px solid #7998FF;border-radius: 4px;font-style: normal;}
-          span{@include setFontStyle(-4);color: rgba(0,0,0,0.65);line-height: 24px;}
-        }
-      }
-      .development-content + .development-content {
-        margin-top: 204px;
-      }
+      // 覆盖饿了么样式
+      .el-tabs__nav-wrap::after,.el-tabs__active-bar{display: none;}
+      .el-tabs__nav-wrap,.el-tabs__nav-scroll{overflow: inherit}
+      .el-tabs__header{margin: 0;}
+      .el-tabs__nav{width: 100%;padding-bottom: 20px;border-bottom: 1px dotted #6c9ce1;}
+      .el-tabs__item{width: 170px;height: 45px;line-height:45px;border: 1px solid #3e7ee7;background: #fff;padding: 0;text-align: center;border-radius: 4px;margin-right: 24px;position: relative;}
+      .el-tabs__item.is-active{background: #3e7ee7;color: #fff}
+      .el-tabs__item:after{width: 14px;height: 14px;content: "";display: inline-block;border-radius: 50%;background: #888;position: absolute;bottom: -28px;left: 50%;margin-left: -7px;}
+      .el-tabs__item.is-active:after{background: #3e7ee7;}
     }
 
     // 联系我们
@@ -614,7 +572,7 @@
   .client-newsInfor-page{
     // banner
     .newsInfor-banner{
-      width: 100%;height: 305px;background-image: url("~static/images/client/newsInfor/newsInfor-banner-bg.png");
+      width: 100%;height: 305px;background-image: url("~static/images/client/newsInfor/newsInfor-banner-bg.png");overflow: hidden;
       img{width: 1200px;overflow: hidden;margin: 0 auto;display: block}
     }
 

+ 2 - 2
pages/index.vue

@@ -2,8 +2,8 @@
 
   <div class="client-index-page">
     <!-- 首页banner栏 -->
-    <div class="block">
-      <el-carousel trigger="click" height="150px">
+    <div class="client-banner-box">
+      <el-carousel trigger="click">
         <el-carousel-item v-for="(item,index) in bannerList" :key="index">
           <img @click="clickBanner(item)" :src="item.pic" alt="">
         </el-carousel-item>