'首页样式'

components/home/banner.vue

@@ -130,7 +130,7 @@ export default {
   overflow: hidden;
   width: 100%;
   // height: 540px;
-  height: 700px;
+  height: 595px;
   .swiperBox {
     height: 100%;
     &:hover {

components/home/header.vue

@@ -167,7 +167,7 @@ export default {
   font-size: 0;
   display: flex;
   align-items: center;
-  padding-right: 22px;
+  padding-right: 37px;
   border-right: 1px solid #F0F1F2;
 }
 
@@ -198,7 +198,7 @@ ul.h-nav-list {
 .h-nav-list > li {
   position: relative;
   display: inline-block;
-  padding: 0 35px;
+  padding: 0 34px;
   line-height: 72px;
   box-sizing: border-box;
   font-size: 15px;

components/products/prodList.vue

@@ -117,15 +117,16 @@ export default {
   border-radius: 0px 0px 18px 18px;
   padding: 10px 22px;
   .product-list-title {
-    color: #343e30;
-    height: 28px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #343E30;
     font-size: 20px;
-    // font-family: PingFangSC-Medium, PingFang SC;
     font-weight: 400;
     line-height: 28px;
     overflow: hidden;//超出一行文字自动隐藏 
     text-overflow: ellipsis;//文字隐藏后添加省略号
     white-space: nowrap;//强制不换行
+
     a {
       color: #343e30;
     }
@@ -138,22 +139,21 @@ export default {
   }
   .product-list-price {
     color: #ea0b4a;
-    font-size: 22px;
+    font-size: 20px;
+    line-height: 38px;
     .price-num {
       font-size: 30px;
-      font-weight: bold;
-      line-height: 26px;
+      font-weight: 600;
+      line-height: 28px;
     }
   }
   .product-list-btn {
-    height: 18px;
-    line-height: 18px;
     font-size: 13px;
     font-family: PingFangSC-Regular, PingFang SC;
     font-weight: 400;
     border: 1px solid rgba(60, 142, 255, 1);
-    height: 27px;
-    line-height: 27px;
+    height: 28px;
+    line-height: 28px;
     border-radius: 14px;
     a {
       padding: 0 15px;

pages/about/contact.vue

@@ -208,7 +208,7 @@ export default {
 }
 .title-en {
   position: absolute;
-  font-size: 78px;
+  font-size: 56px;
   font-family: PingFangSC-Semibold, PingFang SC;
   font-weight: 600;
   color:rgba(35,106,250,1);
@@ -218,10 +218,10 @@ export default {
 .title-zh {
   position: relative;
   display: inline-block;
-  font-size:58px;
+  font-size: 46px;
   font-family:PingFangSC-Semibold,PingFang SC;
-  font-weight:600;
-  color:rgba(38,38,38,1);
+  font-weight: 500;
+  color:#333333;
   text-align: center;
 }
 

pages/about/team.vue

@@ -97,7 +97,7 @@ export default {
 }
 .title-en {
   position: absolute;
-  font-size: 78px;
+  font-size: 56px;
   font-family: PingFangSC-Semibold, PingFang SC;
   font-weight: 600;
   color:rgba(35,106,250,1);
@@ -107,10 +107,10 @@ export default {
 .title-zh {
   position: relative;
   display: inline-block;
-  font-size:58px;
+  font-size: 46px;
   font-family:PingFangSC-Semibold,PingFang SC;
-  font-weight:600;
-  color:rgba(38,38,38,1);
+  font-weight: 500;
+  color:#333333;
   text-align: center;
 }
 

pages/campus/index.vue

@@ -228,7 +228,7 @@ export default {
 }
 .title-en {
   position: absolute;
-  font-size: 78px;
+  font-size: 56px;
   font-family: PingFangSC-Semibold, PingFang SC;
   font-weight: 600;
   color:rgba(35,106,250,1);
@@ -238,10 +238,10 @@ export default {
 .title-zh {
   position: relative;
   display: inline-block;
-  font-size:58px;
-  font-family:PingFangSC-Semibold,PingFang SC;
-  font-weight:600;
-  color:rgba(38,38,38,1);
+  font-size: 46px;
+  font-family: PingFangSC-Semibold,PingFang SC;
+  font-weight: 500;
+  color:#333333;
   text-align: center;
 }
 

pages/index.vue

@@ -122,7 +122,8 @@
             </ul>
             <div class="bottom-line">
               <div class="bottom-line-img">
-                <img :style="lineStyle" src="http://res.training.luojigou.vip/Fl4dXmckxC8m0Lm2-GPbl5-Cp9Rv?imageView2/0/q/50|imageslim" alt="">
+                <div :style="lineStyle" class="line-img-box"></div>
+                <!-- <img :style="lineStyle" src="http://res.training.luojigou.vip/Fl4dXmckxC8m0Lm2-GPbl5-Cp9Rv?imageView2/0/q/50|imageslim" alt=""> -->
               </div>
             </div>
 
@@ -223,7 +224,8 @@
             </ul>
             <div class="bottom-line">
               <div class="bottom-line-img">
-                <img :style="lineCourseStyle" src="http://res.training.luojigou.vip/Fl4dXmckxC8m0Lm2-GPbl5-Cp9Rv?imageView2/0/q/50|imageslim" alt="">
+                <div :style="lineCourseStyle" class="line-img-box"></div>
+                <!-- <img :style="lineCourseStyle" src="http://res.training.luojigou.vip/Fl4dXmckxC8m0Lm2-GPbl5-Cp9Rv?imageView2/0/q/50|imageslim" alt=""> -->
               </div>
             </div>
             <div class="cate-list course-cate-list">
@@ -1258,16 +1260,16 @@ export default {
   },
   computed: {
     lineStyle () {
-      let site = 190 * this.currentTabId + 40* ( (this.currentTabId === 0 ? 1 : this.currentTabId)  - 1 )
+      let site = 190 * this.currentTabId + 42* ( (this.currentTabId === 0 ? 1 : this.currentTabId)  - 1 )
       if( site === 0 ) {
-        site = -5
+        site = -0
       }
       return `transform: translateX(${site + 'px'})`
     },
     lineCourseStyle() {
       let site;
       if( this.currentCourseType === 0 ) {
-        site = -5
+        site = -0
       } else if (this.currentCourseType === 3) {
         site = 400 * this.currentCourseType - 86;
       } else {
@@ -1424,20 +1426,21 @@ export default {
 }
 .title-en {
   position: absolute;
-  font-size: 78px;
+  font-size: 56px;
   font-family: PingFangSC-Semibold, PingFang SC;
   font-weight: 600;
   color:rgba(35,106,250,1);
   opacity: 0.16;
+  line-height: 78px;
 }
 
 .title-zh {
   position: relative;
   display: inline-block;
-  font-size:58px;
-  font-family:PingFangSC-Semibold,PingFang SC;
-  font-weight:600;
-  color:rgba(38,38,38,1);
+  font-size: 46px;
+  font-family: PingFangSC-Semibold,PingFang SC;
+  font-weight: 500;
+  color:#333333;
   text-align: center;
 }
 
@@ -1486,7 +1489,8 @@ ul.cate-nav {
       // transition: all 0.5s ease;
     }
     a {
-      font-size: 32px;
+      font-size: 24px;
+      line-height: 33px;
       color: #747885;
     }
   }
@@ -1500,6 +1504,46 @@ ul.cate-nav {
   }
 }
 
+
+.tabs {
+  .tab-box {
+    display: flex;
+    justify-content: space-between;
+    margin: 0 auto;
+    .tabs-item {
+      a {
+        font-size: 24px;
+        font-family: PingFangSC-Regular, PingFang SC;
+        font-weight: 400;
+        color: #747885;
+        line-height: 33px;
+      }
+    }
+  }
+  .bottom-line {
+    display: flex;
+    justify-content: center;
+    margin-top: 16px;
+    .bottom-line-img {
+      width: 100%;
+      .line-img-box {
+        width: 46px;
+        height: 4px;
+        background-color: $theme_color_fu;
+        box-shadow: 0px 2px 8px 0px rgba(111, 159, 254, 0.8);
+        border-radius: 100px;
+        transition: transform 1s;
+      }
+      // img {
+      //   width: 75px;
+      //   height: 30px;
+      //   transition: transform 1s;
+      // }
+    }
+  }
+}
+
+
 .cate-list {
   display: flex;
   align-items: center;
@@ -1519,50 +1563,52 @@ ul.cate-nav {
 
 // index-thought
 .index-thought {
-  padding: 198px 0 50px;
+  padding: 150px 0 0;
   .i-thought-content {
     position: relative;
     .t-top {
       .title-en {
-        left: -116px;
-        top: -45px;
+        left: -147px;
+        top: -20px;
       }
     }
   }
   .thought-content-box {
     text-align: center;
-    margin: 133px auto 0;
+    margin: 52px auto 0;
     position: relative;
-    max-width: 1350px;
+    max-width: 1200px;
   }
   .map-content {
     width: 100%;
     position: absolute;
-    top: 80px;
+    top: 118px;
     .con-box {
       .con {
         .num {
-          font-size: 106px;
-          font-family: PingFangSC-Semibold, PingFang SC;
-          font-weight: 600;
           color: $theme_color_fu;
-          line-height: 148px;
           text-shadow: 0px 1px 3px #BED3FE;
+          font-size: 72px;
+          font-family: PingFangSC-Medium, PingFang SC;
+          font-weight: 500;
+          color: #0D5CFA;
+          line-height: 100px;
           .unit {
-            font-size: 34px;
-            font-family: PingFangSC-Semibold, PingFang SC;
-            font-weight: 600;
+            font-size: 30px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            line-height: 42px;
             color: $theme_color_fu;
-            line-height: 48px;
           }
         }
         .color-gray {
-          margin-top: 77px;
-          font-size: 24px;
+          margin-top: 35px;
+          font-size: 20px;
           font-family: PingFangSC-Medium, PingFang SC;
           font-weight: 500;
           color: #515564;
-          line-height: 33px;
+          line-height: 28px;
+
         }
       }
     }
@@ -1710,8 +1756,8 @@ ul.cate-nav {
     }
     .title-en {
       position: absolute;
-      top: -45px;
-      left: -112px;
+      top: -20px;
+      left: -136px;
     }
   }
   .thinking-cate-box {
@@ -1719,7 +1765,7 @@ ul.cate-nav {
   }
   ul.thinking-cate-nav {
     position: relative;
-    margin: 124px 0 116px;
+    // margin: 124px 0 116px;
     display: flex;
     justify-content: space-between;
     .tabs-item.selectTabs {
@@ -1752,35 +1798,6 @@ ul.cate-nav {
     }
   }
 
-  .tabs {
-    .tab-box {
-      display: flex;
-      justify-content: space-between;
-      margin: 0 auto;
-      .tabs-item {
-        a {
-          color: #747885;
-          font-size: 32px;
-          font-family:PingFangSC-Regular,PingFang SC;
-          font-weight:400;
-        }
-      }
-    }
-    .bottom-line {
-      display: flex;
-      justify-content: center;
-      margin-top: 16px;
-      .bottom-line-img {
-        width: 100%;
-        img {
-          width: 75px;
-          height: 30px;
-          transition: transform 1s;
-        }
-      }
-    }
-  }
-
   li.thinking-products-kind:first-child {
     margin-left: 0;
   }
@@ -1943,8 +1960,8 @@ ul.cate-nav {
   max-width: 1200px;
   margin: 0 auto;
   .title-en {
-    left: -134px;
-    top: -45px;
+    left: -158px;
+    top: -19px;
   }
   .bottom-line {
     margin-top: 16px;
@@ -2014,11 +2031,11 @@ ul.cate-nav {
     }
     .course-product-price {
       color: #ea0b4a;
-      font-size: 22px;
+      font-size: 20px;
       margin-top: 13px;
       .price-num {
         font-size: 30px;
-        font-weight: bold;
+        font-weight: 600;
         line-height: 26px;;
       }
     }
@@ -2032,6 +2049,10 @@ ul.cate-nav {
       }
       .views {
         color: #418eff;
+        font-size: 15px;
+        font-family: PingFangSC-Regular, PingFang SC;
+        font-weight: 400;
+        line-height: 21px;
       }
     }
   }
@@ -2043,8 +2064,8 @@ ul.cate-nav {
   padding: 217px 0 228px;
   .i-s-content {
     .title-en {
-      left: -125px;
-      top: -45px;
+      left: -140px;
+      top: -30px;
     }
   }
   .scenes-content-box {
@@ -2216,9 +2237,11 @@ ul.cate-nav {
   .i-town-content {
     .title-en {
       left: 50%;
-      transform: translate(-50%);
+      text-align: left;
+      // transform: translate(-50%);
       width: 800px;
-      top: -45px;
+      left: -150px;
+      top: -30px;
     }
     .title-sub {
       margin-top: 28px;
@@ -2381,6 +2404,9 @@ ul.cate-nav {
   .swiper-slide {
     width: 240px;
     font-size: 0;
+    img {
+      border-radius: 12px;
+    }
   }
   .honer-content-box {
     margin-top: 102px;
@@ -2391,7 +2417,7 @@ ul.cate-nav {
 .index-article {
   padding: 180px 0 176px;
   .title-en {
-    top: -45px;
+    top: -22px;
     left: -128px;
   }
   .article-content-box {
@@ -2570,8 +2596,8 @@ ul.cate-nav {
   padding: 180px 0 164px;
   background: url("~assets/images/index/expert_bg.png") no-repeat;
   .title-en {
-    left: -107px;
-    top: -40px;
+    left: -133px;
+    top: -30px;
   }
   #certify {
     position: relative;

pages/news/index.vue

@@ -9,9 +9,9 @@
     <section class="content w1200">
       <div class="aside">
         <ul class="news-cate-list">
-          <li v-for="(item, index) in $store.state.newsNav" :key="index" class="news-cate-item">
+          <li v-for="(item, index) in newsNav" :key="index" class="news-cate-item">
             <div class="icon"><img :src="item.icon" alt="" srcset=""></div>
-            <div :class="['title', cateId == item.id ? 'active' : '']" @click="changeCate(item, index)">{{ item.title }}</div>
+            <div :class="['title', cateId == item.id ? 'active' : '']" @click="changeCate(item, index)">{{ item.type }}</div>
           </li>
         </ul>
       </div>
@@ -20,17 +20,17 @@
           <div class="news-list-item" v-for="(item, index) in newsList" :key="index">
             <div class="news-list-left">
               <nuxt-link :to="{ name: 'news-newsView-id', params: { id: cateId }, query: { cateId: cateId } }">
-                <img :src="item.imgUrl" alt="">
+                <img :src="item.articleImg" alt="">
               </nuxt-link>
             </div>
             <div class="news-list-right">
               <div class="news-list-title">
                 <nuxt-link :to="{ name: 'news-newsView-id', params: { id: cateId }, query: { cateId: cateId } }">
-                {{ item.title }}
+                {{ item.articleTitle }}
                 </nuxt-link>
               </div>
-              <div class="news-list-desc">{{ item.content }}</div>
-              <div class="news-list-bottom">{{ item.time }}</div>
+              <div class="news-list-desc">{{ item.articleIntroduction }}</div>
+              <div class="news-list-bottom">{{ item.createTime }}</div>
             </div>
           </div>
         </section>
@@ -39,11 +39,11 @@
             @size-change="handleSizeChange"
             @current-change="handleCurrentChange"
             :current-page="currentPage"
-            :page-sizes="[100, 200, 300, 400]"
-            :page-size="100"
+            :page-sizes="[10, 20, 40]"
+            :page-size="10"
             background
             layout="total, sizes, prev, pager, next, jumper"
-            :total="400">
+            :total="total">
           </el-pagination>
         </div>
       </div>
@@ -52,22 +52,17 @@
 </template>
 
 <script>
+import axios from "axios";
+
 if (process.browser) { 
   var {WOW} = require('wowjs')
 }
 export default {
   name: 'news',
-  mounted () {
-    if (process.browser) { 
-      new WOW({
-          offset: 0,   
-          live: true
-      }).init()
-    }
-  },
   data() {
     return {
       currentPage: 1,
+      total: 0,
       newsList: [
         {
           title: '中德智慧乔迁逻辑狗智慧乔迁智慧乔迁标题中德智 迁标题中德智迁标题中德智慧乔迁……..',
@@ -107,18 +102,43 @@ export default {
     
   },
   async asyncData({ params, query, store }) {
-    let cateId = query.cateId || 1;
-    console.log(cateId);
+    // 获取分类列表
+    let newsNav = [];
+    const { data } = await axios(`${store.state.wordpressAPI}/official-api/article/type`);
+    if(data.status === 200) {
+      newsNav = data.data;
+    }
+    console.log(newsNav);
+    let cateId = query.cateId || newsNav[0].id;
     return {
-      cateId
+      cateId,
+      newsNav
     }
   },
   created() {
   },
   mounted() {
-
+    if (process.browser) {
+      new WOW({
+        offset: 0,
+        live: true
+      }).init()
+    }
+    this.loadNewsList();
   },
   methods: {
+    async loadNewsList() {
+      const { data } = await axios(`${this.$store.state.wordpressAPI}/official-api/article`, {
+        params: {
+          typeId: this.cateId,
+          page: this.currentPage
+        }
+      });
+      if(data.status === 200) {
+        this.total = data.data.total;
+        this.newsList = data.data.entityList || [];
+      }
+    },
     handleSizeChange() {
 
     },
@@ -128,6 +148,8 @@ export default {
     changeCate(item, index) {
       this.cateId = item.id;
       this.currentIndex = index;
+      this.currentPage = 1;
+      this.loadNewsList();
     }
   },
 };
@@ -138,7 +160,7 @@ export default {
 
 .banner {
   background: url('~assets/images/news/header.png') 100% 100% no-repeat #ffffff;
-  height: 882px;
+  height: 713px;
   .banner-content {
     display: flex;
     flex-direction: column;