Merge remote-tracking branch 'origin/master'

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

@@ -815,19 +815,23 @@ h1,h2,h3,h4,h5,h6,p{font-weight:normal;margin: 0;}
 // 课程开发图片展示行
 .website-course-services{
   li{margin-bottom: 36px;}
+  @media (max-width: 768px){
+    ul{margin-top: 32px;}
+    li{margin-bottom: 12px;}
+  }
 }
 .course-services-box{
   width: 100%;display: flex;align-items: center;
   // 头部图片
-  img{ width: 721px;height: 508px;float: right;}
+  img{ width: 620px;height: 437px;float: right;}
 
   // 内容区域
   .course-services-content{
-    width: 479px;
+    width: 570px;
     float: right;
     box-sizing: border-box;
-    margin: 0 20px;
     display: block;
+    margin-right: 10px;
     @include setFontStyle(-6);
     h4{@include setFontStyle(28);color: #4069e7;margin-bottom: 24px;}
     h5{@include setFontStyle(10);color: #333;margin-bottom: 36px;}
@@ -851,17 +855,17 @@ h1,h2,h3,h4,h5,h6,p{font-weight:normal;margin: 0;}
     span.client-default-Btn{background: #fff;color: #3e7ce7;margin-right: 0;}
   }
   @media (max-width: 768px){
-    display: block;
+    flex-direction: column-reverse;
     // 头部图片
     img{width: 100%;height: auto;float: none;}
     // 内容区域
     .course-services-content{
       width: 100%;float: none;padding: 0 10px;margin: 0;
       @include setFontStyle(-6);
-      h4{@include setFontStyle(4);display: inline-block;margin-bottom: 16px;}
+      h4{@include setFontStyle(4);display: inline-block;margin-bottom: 16px;margin-right: 6px;}
       h5{@include setFontStyle(-5);font-weight: 700;color: rgba(0, 0, 0, 1);display: inline-block;margin-bottom: 16px;}
       i{width:34px;height:3px;margin: 10px 0;}
-      p{margin-bottom: 30px;color: rgba(85, 85, 85, 1);line-height: 24px;font-size: 14px;}
+      p{margin-bottom: 0;color: rgba(85, 85, 85, 1);line-height: 24px;font-size: 12px;}
       .p-before-circle:before{width: 16px;height: 16px;margin-right: 6px;}
       .client-btn-box{text-align: center;margin:40px 0;}
       .client-default-Btn,.client-default-white-Btn{width: 120px;height: 35px;line-height: 35px;}
@@ -870,6 +874,84 @@ h1,h2,h3,h4,h5,h6,p{font-weight:normal;margin: 0;}
   }
 }
 
+// 课程开发banner图
+.website-course-banner{
+  width: 100%;
+  height: 520px;
+  background-color:#fff;
+  background-position-x: center;
+  background-repeat: no-repeat;
+  @media (max-width: 768px){
+    height: 260px;background-size: cover;
+  }
+}
+
+/* 为什么选择我们模块  */
+.website-chose-box{
+  padding-bottom: 80px;
+  .chose-img-box{
+    margin: 48px -14px 0;
+    li{
+      width: 25%;display: inline-block;vertical-align: top;
+      div{height: 260px;background: #f8f8f8;position:relative;text-align: center;margin: 0 14px;}
+      span{width: 100%;height: 200px;display: inline-block;}
+      img{margin: 50px auto 0;}
+      h5{@include setFontStyle(-2);color: rgba(0,0,0,0.85);}
+    }
+  }
+  .client-default-Btn {
+    width: 238px;
+    height: 40px;
+    line-height: 40px;
+    margin: 40px auto 0;
+  }
+  @media (max-width: 768px){
+      padding: 0;
+      .chose-img-box{
+        margin: 20px 0 0;
+        li{
+          width: 50%;margin-bottom: 12px;
+          div{height: 125px;margin: 0 7px;}
+          span{height: 90px;}
+          img{width:60px;margin: 16px auto 0;}
+          h5{@include setFontStyle(-4);color: #101010;}
+        }
+      }
+      .client-default-Btn {
+        width: 238px;
+        height: 40px;
+        line-height: 40px;
+        margin: 40px auto 0;
+      }
+    }
+}
+
+/* 课程开发通用-新闻资讯样式  */
+.website-synopsis-news-box{
+  padding-bottom: 80px;
+  background: #f7f7f7;
+  ul{margin-top: 48px;}
+  li{
+    width: 50%;display: inline-block;vertical-align: top;
+    div{margin: 10px;padding:10px 10px 10px 0;}
+    img{width: 190px;height: 118px;float: left;margin-right: 24px;}
+    h4{@include setFontStyle(-2);color: #333;@include single-line-ellipsis;margin-bottom: 8px;}
+    h4:hover{color: #3e7ce7;cursor: pointer;}
+    span{display: block;@include setFontStyle(-4);color: #666;margin-bottom: 8px;}
+    p{@include setFontStyle(-6);height: 66px;line-height: 22px;color: #999;@include multi-line-ellipsis(3);}
+  }
+  @media (max-width: 768px){
+    li{
+      width: 100%;
+      div{padding:0;margin: 0 0 32px 0;}
+      img{width: 124px;height:78px;margin-right: 16px}
+      h4{@include setFontStyle(-8);margin-bottom: 6px;}
+      span{display: block;@include setFontStyle(-10);}
+      p{@include setFontStyle(-9);@include multi-line-ellipsis(2);height: 40px;line-height: 18px;}
+
+    }
+  }
+}
 /********************************* 麦塔栅格**********************************/
 /*
 栅格说明：

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

@@ -202,27 +202,6 @@
       a{width:238px;height:40px;line-height: 40px;margin: 40px auto 0;background: #005491;border: 1px solid #fff;box-sizing: border-box;}
     }
 
-    /* 为什么选择我们  */
-    .client-chose-box{
-      padding-bottom: 80px;
-      .chose-img-box{
-        margin: 48px -14px 0;
-        li{
-          width: 25%;display: inline-block;vertical-align: top;
-          div{height: 260px;background: #f8f8f8;position:relative;text-align: center;margin: 0 14px;}
-          span{width: 100%;height: 200px;display: inline-block;}
-          img{margin: 50px auto 0;}
-          h5{@include setFontStyle(-2);color: rgba(0,0,0,0.85);}
-        }
-      }
-      .client-default-Btn {
-        width: 238px;
-        height: 40px;
-        line-height: 40px;
-        margin: 40px auto 0;
-      }
-    }
-
     /* 新闻资讯 */
     .client-news-information {
       background: #f9faff;
@@ -321,26 +300,6 @@
         }
       }
 
-      /* 为什么选择我们  */
-      .client-chose-box{
-        padding: 0;
-        .chose-img-box{
-          margin: 20px 0 0;
-          li{
-            width: 50%;margin-bottom: 12px;
-            div{height: 125px;margin: 0 7px;}
-            span{height: 90px;}
-            img{width:60px;margin: 16px auto 0;}
-            h5{@include setFontStyle(-4);color: #101010;}
-          }
-        }
-        .client-default-Btn {
-          width: 238px;
-          height: 40px;
-          line-height: 40px;
-          margin: 40px auto 0;
-        }
-      }
 
       /* 新闻资讯 */
       .client-newsInfo-phone{
@@ -2222,5 +2181,50 @@
     }
     }
   }
+
+  /**************** describe:课程开发梗概  author: TX  date:2022-12-29 ****************/
+  .website-course-synopsis-page{
+    /*发展历程*/
+    .synopsis-company-history{
+      background:#f8f8f8;
+      li{
+        width: 25%;display: inline-block;text-align: center;
+        div{border-right:2px solid #dfdfdf;margin: 32px 0;}
+        p{@include setFontStyle(16);padding: 10px 0 16px;color: #0166CB;font-weight: 600;}
+        h4{@include setFontStyle(-4);color: #565656;padding-bottom: 10px}
+      }
+      li:last-child div{border-right: 0;}
+    }
+
+    /* 核心业务 */
+    .course-services-box{
+      .course-services-content p{width: 80%;}
+    }
+
+    @media (max-width: 768px){
+      /*发展历程*/
+      .synopsis-company-history {
+        ul{
+          display: flex;
+          justify-content: space-between;
+          align-content: center;
+          align-items: center;
+        }
+        li {
+          width: 49%;padding-bottom: 14px;
+          div{border: 0;padding: 24px 0 0;margin: 0;}
+          p{@include setFontStyle(5);padding: 10px 0;}
+          h4{@include setFontStyle(-8);}
+        }
+        i{width: 1px;height:160px;background-color: #dfdfdf;padding-bottom: 0;}
+      }
+
+      /* 核心业务 */
+      .course-services-box{
+        .course-services-content p{width: 100%;}
+        h5{width: 100%;text-align: center;color: #333;font-weight: 400;}
+      }
+    }
+  }
 }
 

components/mtaNav/pcNav.vue

@@ -100,6 +100,7 @@ export default {
       font-size: 18px;
       margin: 0 42px;
       color: #333333;
+      cursor: pointer;
     }
 
     > a:last-child {

pages/courseware/compete.vue

@@ -1,12 +1,26 @@
 <!-- 课程开发课程大赛页面-->
 <template>
-    <div>课程大赛</div>
+    <div class="website-course-compete-page">
+      <!-- 课程开发课程大赛 banner栏 pc-->
+      <div  @click="clickBanner(bannerList[0].url)" :style="{backgroundImage: `url(${competeBannerImg})`}" class="website-course-banner mta-hidden-xs"></div>
+      <!-- 课程开发课程大赛 banner栏 移动端-->
+      <div  @click="clickBanner(bannerList[0].url)" :style="{backgroundImage: `url(${competeBannerPhoneImg})`}" class="website-course-banner mta-hidden-sm"></div>
+
+
+    </div>
 </template>
 
 <script>
     export default {
         name: 'compete',
         layout:'templateB',
+      data() {
+        return {
+          // 发展现状img
+          competeBannerImg: require(`~/static/images/client/course/course-compete-banner.png`),
+          competeBannerPhoneImg: require(`~/static/images/client/course/course-compete-sj-banner.jpg`),
+        }
+      }
     };
 </script>
 

pages/courseware/platform.vue

@@ -1,8 +1,11 @@
 <!-- 课程开发平台运营页面-->
 <template>
     <div class="client-course-platform-page">
-      <!-- 课程开发平台运营 banner栏 -->
-      <div  @click="clickBanner(bannerList[0].url)" :style="{backgroundImage: `url(${platformBannerImg})`}" class="client-course-banner"></div>
+      <!-- 课程开发平台运营 banner栏 pc-->
+      <div  @click="clickBanner(bannerList[0].url)" :style="{backgroundImage: `url(${platformBannerImg})`}" class="website-course-banner mta-hidden-xs"></div>
+      <!-- 课程开发平台运营 banner栏 移动端-->
+      <div  @click="clickBanner(bannerList[0].url)" :style="{backgroundImage: `url(${platformBannerPhoneImg})`}" class="website-course-banner mta-hidden-sm"></div>
+
       <!-- 运营方案 -->
       <div class="website-course-services">
         <h4 class="client-title">运营方案</h4>
@@ -83,7 +86,8 @@
       data() {
         return {
           // 发展现状img
-          platformBannerImg: require(`~/static/images/client/course/course-platform-banner-background.png`),
+          platformBannerImg: require(`~/static/images/client/course/course-platform-banner.png`),
+          platformBannerPhoneImg: require(`~/static/images/client/course/course-platform-sj-banner.jpg`),
           platformImg1:  require(`~/static/images/client/course/course-platform-img1.png`),
           platformImg2:  require(`~/static/images/client/course/course-platform-img2.png`),
           platformImg3:  require(`~/static/images/client/course/course-platform-img3.png`),

pages/courseware/synopsis.vue

@@ -1,12 +1,182 @@
 <!-- 课程开发梗概页面-->
 <template>
-    <div>梗概</div>
+    <div class="website-course-synopsis-page">
+      <!-- 课程开发平台运营 banner栏 pc-->
+      <div  @click="clickBanner(bannerList[0].url)" :style="{backgroundImage: `url(${synopsisBannerImg})`}" class="mta-hidden-xs website-course-banner"></div>
+      <!-- 课程开发平台运营 banner栏 移动端-->
+      <div  @click="clickBanner(bannerList[0].url)" :style="{backgroundImage: `url(${synopsisBannerPhoneImg})`}" class="mta-hidden-sm website-course-banner"></div>
+      <!-- 发展历程-移动端隐藏-->
+      <div class="synopsis-company-history mta-hidden-xs">
+        <div class="client-container">
+          <ul>
+            <li><div><p>2008年</p><h4>公司成立于</h4></div></li>
+            <li><div><p>5,000+</p><h4>服务企业</h4></div></li>
+            <li><div><p>50,000+</p><h4>累计开发课程小时数</h4></div></li>
+            <li><div><p>30+</p><h4>制作开发团队</h4></div></li>
+          </ul>
+        </div>
+      </div>
+      <!-- 发展历程-pc端隐藏-->
+      <div class="synopsis-company-history mta-hidden-sm">
+        <div class="client-container">
+          <ul>
+            <li><div><p>2008年</p><h4>公司成立于</h4></div><div><p>50,000+</p><h4>累计开发课程小时数</h4></div></li>
+            <i></i>
+            <li><div><p>5,000+</p><h4>服务企业</h4></div><div><p>30+</p><h4>制作开发团队</h4></div></li>
+          </ul>
+        </div>
+      </div>
+
+      <!-- 核心业务 -->
+      <div class="website-course-services">
+        <h4 class="client-title">核心业务</h4>
+        <ul>
+          <li>
+            <div class="client-container">
+              <div class="course-services-box website-row-reverse">
+                <img :src="synopsisImg1" alt="为企业、院校打造专业的课程定制化服务" />
+                <div class="course-services-content">
+                  <h5>为企业、院校打造专业的课程定制化服务</h5>
+                  <p>定制学习方案，课件资源管理，课程规划，互动社区，学习积分课程进度查看，地图闯关，结业证书，分享资源，一体化线上学习方案协助您完成全流程的课程培训体系。</p>
+                  <div class="client-btn-box"><div rel="nofollow" class="client-default-Btn" @click="onlineConsult">在线咨询</div><span  class="client-default-Btn" @click="goCustom">了解详情</span></div>
+                </div>
+              </div>
+            </div>
+          </li>
+          <li>
+            <div class="client-container">
+              <div class="course-services-box">
+                <img :src="synopsisImg2" alt="帮助企业快速构建自主课程体系" />
+                <div class="course-services-content">
+                  <h5>帮助企业快速构建自主课程体系</h5>
+                  <p>职位评价管理用数据量化+多维度测评，PC端与移动端无缝连接;支持安卓、lOS等操作系统;加速人才培养为公司提供随时随地的个性化的、开放式测评服务。</p>
+                  <div class="client-btn-box"><div rel="nofollow" class="client-default-Btn" @click="onlineConsult">在线咨询</div><span  class="client-default-Btn" @click="goCustom">了解详情</span></div>
+                </div>
+              </div>
+            </div>
+          </li>
+          <li>
+            <div class="client-container">
+              <div class="course-services-box website-row-reverse">
+                <img :src="synopsisImg3" alt="学、测、考、练，打造企业一体化学习模式" />
+                <div class="course-services-content">
+                  <h5>学、测、考、练，打造企业一体化学习模式</h5>
+                  <p>建立培训计划实现项目管理，随时随地查看培训项目的参训状态，获取最精准的参训人员名单、多维度呈现培训数据报告，员工能力考核，实现匹配公司职位发展模型。</p>
+                  <div class="client-btn-box"><div rel="nofollow" class="client-default-Btn" @click="onlineConsult">在线咨询</div><span  class="client-default-Btn" @click="goCustom">了解详情</span></div>
+                </div>
+              </div>
+            </div>
+          </li>
+          <li>
+            <div class="client-container">
+              <div class="course-services-box">
+                <img :src="synopsisImg4" alt="微课大赛助力企业推动培训学习进程" />
+                <div class="course-services-content">
+                  <h5>微课大赛助力企业推动培训学习进程</h5>
+                  <p>数据信息一目了然，支持自定义多维度分析，360项目全貌视图数据展示，方便企业快速决策。</p>
+                  <div class="client-btn-box"><div rel="nofollow" class="client-default-Btn" @click="onlineConsult">在线咨询</div><span  class="client-default-Btn" @click="goCustom">了解详情</span></div>
+                </div>
+              </div>
+            </div>
+          </li>
+        </ul>
+
+      </div>
+
+      <!-- 为什么选择我们 -->
+      <div class="website-chose-box">
+        <div class="client-container">
+          <h4 class="client-title">为什么选择我们</h4>
+          <ul class="chose-img-box">
+            <li>
+              <div>
+                <span><img :src="choseImg1" alt="专业的顾问服务" /></span>
+                <h5>专业的顾问服务</h5>
+              </div>
+            </li>
+            <li>
+              <div>
+                <span><img :src="choseImg3" alt="完善的培训体系" /></span>
+                <h5>完善的培训体系</h5>
+              </div>
+            </li>
+            <li>
+              <div>
+                <span><img :src="choseImg2" alt="可靠的开发技术"/></span>
+                <h5>可靠的开发技术</h5>
+              </div>
+            </li>
+            <li>
+              <div>
+                <span><img :src="choseImg4" alt="成熟的运营能力" /></span>
+                <h5>成熟的运营能力</h5>
+              </div>
+            </li>
+          </ul>
+        </div>
+      </div>
+
+      <!-- 新闻资讯 -->
+      <div class="website-synopsis-news-box">
+        <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>
 </template>
 
 <script>
     export default {
         name: 'synopsis',
         layout:'templateB',
+      async asyncData({ $axios, store }) {
+        // 设置选中菜单
+        store.commit('setActiveNav', '/courseware');
+
+        let [res1,res2] =  await Promise.all([
+                                               await $axios.$post(`/home/news/carousel`,{'newsClassifyId':0,'keyword':'课程'}).then(res=>{
+                                                 return res
+                                               }),
+                                             ])
+        return {
+          topCarousels : res1.data.data ||[],
+        }
+      },
+        data() {
+          return {
+            // 发展现状img
+            synopsisBannerImg: require(`~/static/images/client/course/course-synopsis-banner.png`),
+            synopsisBannerPhoneImg: require(`~/static/images/client/course/course-synopsis-sj-banner.jpg`),
+            synopsisImg1:  require(`~/static/images/client/course/course-synopsis-img1.png`),
+            synopsisImg2:  require(`~/static/images/client/course/course-synopsis-img2.png`),
+            synopsisImg3:  require(`~/static/images/client/course/course-synopsis-img3.png`),
+            synopsisImg4:  require(`~/static/images/client/course/course-synopsis-img4.png`),
+            // 为什么选择我们
+            choseImg1:   require(`~/static/images/client/index/index-chose-service-icon.png`),
+            choseImg2:   require(`~/static/images/client/index/index-chose-system-icon.png`),
+            choseImg3:   require(`~/static/images/client/index/index-chose-tech-icon.png`),
+            choseImg4:   require(`~/static/images/client/index/index-chose-operate-icon.png`),
+          }
+        },
+      methods:{
+        onlineConsult(){
+          window.open('https://p.qiao.baidu.com/cps/chat?siteId=17930746&userId=40179606&siteToken=d9c57b2ea4cbedbb044677ef47a1e2d1')
+        },
+        goCustom(){
+          this.$router.push({ name: 'custom' });
+          this.$router.push({ path: '/courseware/custom' });
+        },
+      },
     };
 </script>
 

pages/index.vue

@@ -118,7 +118,7 @@
     </div>
 
     <!-- 为什么选择我们 -->
-    <div class="client-chose-box">
+    <div class="website-chose-box">
       <div class="client-container">
         <h4 class="client-title">为什么选择我们</h4>
         <ul class="chose-img-box">