课程资源

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

@@ -856,5 +856,59 @@
     .client-default-white-Btn{background: #fff;color: #3e7ce7;left: 50%;margin-left: 30px;}
     }
   }
+
+  /********  describe: 1-X-详情页  author: TX  date:2020-09-03  ********/
+  .client-resources-page{
+    // 图标列表
+    .train-scheme-list{
+      margin: 54px -24px 0;
+      li{width: 25%;display: inline-block;text-align: center}
+      i{width: 100px;height: 100px;display: block;margin: 0 auto;}
+      span{font-size: 14px;color: #333;}
+      div{box-shadow: 0 0 7px 2px #f5f2ff;margin: 24px;padding: 40px 0;}
+      li:nth-child(1) i{background: url("~static/images/client/resources/train-scheme-icon1.png")}
+      li:nth-child(2) i{background: url("~static/images/client/resources/train-scheme-icon2.png")}
+      li:nth-child(3) i{background: url("~static/images/client/resources/train-scheme-icon3.png")}
+      li:nth-child(4) i{background: url("~static/images/client/resources/train-scheme-icon4.png")}
+      li:nth-child(5) i{background: url("~static/images/client/resources/train-scheme-icon5.png")}
+      li:nth-child(6) i{background: url("~static/images/client/resources/train-scheme-icon6.png")}
+      li:nth-child(7) i{background: url("~static/images/client/resources/train-scheme-icon7.png")}
+      li:nth-child(8) i{background: url("~static/images/client/resources/train-scheme-icon8.png")}
+    }
+    // 为企业培训打造学习矩阵
+    .products-services-content p{line-height: 52px;}
+    // 蓝色提醒文字
+    .blue-big-size{
+      font-size: 26px;color: #3e7ce7;padding: 0 5px;
+    }
+
+    // 课程内容形式多样
+    .course-learn-box{
+        background: #f9faff;
+      // video列表
+      .learn-box-list{
+        margin: 54px -16px 0;
+        li{
+          width: 33.33%;display: inline-block;
+          a{display: none;}
+          div{background: #fff;border-radius: 8px;margin: 0 16px 40px;}
+          span{width:342px;height:192px;display: inline-block;margin-top: 16px;border-radius:4px;overflow: hidden;position: relative}
+          i{width: 48px;height: 48px;cursor: pointer;background-image: url("~static/images/client/course/course-video-icon.svg");display: inline-block;position: absolute;
+            left: 50%;margin-left: -24px;z-index: 5;top: 50%;margin-top: -24px;background-size: cover;background-position: bottom;transition: all 0.5s;}
+          img{transition: all 0.5s;}
+          p{@include setFontStyle(-4);color: rgba(0,0,0,0.65);padding: 24px 0 24px;}
+        }
+        li span:hover{img{transform: scale(1.1);}}
+        li i:hover{background-image: url("~static/images/client/course/course-video-icon-a.svg");background-size: cover;background-position: bottom;}
+      }
+    }
+
+    // 新闻资讯
+    .platform-news-information{background: #fff;}
+    // 按钮
+    .client-default-Btn,.client-default-white-Btn{width: 150px;height: 40px;line-height: 40px;display:inline-block;border: 1px solid #3e7ce7;background: #3e7ce7;margin-right: 24px;margin-bottom: 42px;}
+    .client-default-white-Btn{background: #fff;color:#3e7ce7;margin-right: 0 }
+  }
+
 }
 

components/header.vue

@@ -78,7 +78,7 @@
             children: [],
           },
           {
-            content:  '题库资源',
+            content:  '课程资源',
             keyPath:  '/resources',
             children: [],
           },

pages/indexEducation.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="client-platform-page client-indexEducation-page">
 
-    <!-- 题库资源页 banner栏 -->
+    <!-- “1+X”教育 banner栏 -->
     <div class="client-platform-banner">
       <div :style="{backgroundImage: `url(${require(`~/static/images/client/indexEducation/index-education-banner.jpg`)})`}" class="client-platform-banner"></div>
       <!--<a rel="nofollow" class="free-trial-default-btn" href="https://cdnks.mtavip.com/a/register?flug=2" target="_blank">免费试用</a>-->
@@ -103,7 +103,7 @@
     layout:   'templateB',
     async asyncData({ $axios,store }) {
       // 设置选中菜单
-      store.commit('setActiveNav', '/resources');
+      store.commit('setActiveNav', '/indexEducation');
 
 
       let [res1, res2] = await Promise.all([

pages/resources/index.vue

@@ -3,85 +3,36 @@
 
     <!-- 题库资源页 banner栏 -->
     <div class="client-platform-banner">
-      <div :style="{backgroundImage: `url(${require(`~/static/images/client/resources/resources-banner-background.jpg`)})`}" class="client-platform-banner"></div>
-      <!--<a rel="nofollow" class="free-trial-default-btn" href="https://cdnks.mtavip.com/a/register?flug=2" target="_blank">免费试用</a>-->
-      <a rel="nofollow" class="client-default-Btn" href="https://cdnks.mtavip.com/a/register?flug=2" target="_blank" style="display:inline-block;">申请方案</a>
-      <span rel="nofollow" class="client-default-white-Btn" @click="goIntroductionPage">联系我们456</span>
+      <div  :style="{backgroundImage: `url(${require(`~/static/images/client/resources/resources-banner-background.jpg`)})`}" class="client-platform-banner"></div>
     </div>
-    <!--  “1+X”实施意义 -->
-      <div class="platform-products-services">
-      <h4 class="client-title">“1+X”实施意义</h4>
-      <ul>
+    <!--  企业通用岗位培训方案 -->
+    <div class="client-container">
+      <h4 class="client-title">企业通用岗位培训方案</h4>
+      <ul class="train-scheme-list">
+        <li><div><i></i><span>职业素养</span></div></li>
+        <li><div><i></i><span>领导能力</span></div></li>
+        <li><div><i></i><span>人力资源</span></div></li>
+        <li><div><i></i><span>市场营销</span></div></li>
+        <li><div><i></i><span>行政管理</span></div></li>
+        <li><div><i></i><span>财务管理</span></div></li>
+        <li><div><i></i><span>客服服务</span></div></li>
+        <li><div><i></i><span>生产采购</span></div></li>
 
+      </ul>
+    </div>
+    <div class="platform-products-services">
+      <ul>
         <li>
           <div class="client-container">
-            <div class="products-services-box">
-              <img :src="curriculumResourcesImg1" alt="“1+X”实施意义" />
-              <div class="products-services-content">
-                <h5>“1+X”证书制度作为新时代职业教育领域的一项重大创新</h5>
-                <i></i>
-                <p>
-                  <span>1.深化职业教育改革，完善现代职业教育体系</span><br>
-                  <span>2.优化职业教育结构，健全国家职业教育制度</span><br>
-                  <span>3.创新人才培养和评价模式，提高人才培养质量</span><br>
-                  <span>4.对接国际职业标准，促进人才培养国际化</span><br>
-                </p>
-                <div>
-                  <a rel="nofollow" class="client-default-Btn" href="https://cdnks.mtavip.com/a/register?flug=2" target="_blank">申请方案</a>
-                  <span rel="nofollow" class="client-default-white-Btn" @click="goIntroductionPage">联系我们</span>
-                </div>
-              </div>
-            </div>
-          </div>
-        </li>
-        <li>
-          <div class="client-container">
-            <div class="products-services-box products-contrary-box">
-              <h4 class="client-title">“1+X”培训平台</h4>
-              <img :src="curriculumResourcesImg2" alt="“1+X”培训平台" />
-              <div class="products-services-content">
-                <p>麦塔为院校提供“1+X”培训平台，将职业技能实训融入到教学资源中，配套丰富的教学资源及精准的实训设施，为学生顺利取得“1+X”职业技能等级证书保驾护航。</p>
-                <div>
-                  <a rel="nofollow" class="client-default-Btn" href="https://cdnks.mtavip.com/a/register?flug=2" target="_blank">申请方案</a>
-                  <span rel="nofollow" class="client-default-white-Btn" @click="goIntroductionPage">联系我们</span>
-                </div>
-              </div>
-            </div>
-          </div>
-        </li>
-        <li>
-          <div class="client-container">
-            <div class="products-services-box">
-              <h4 class="client-title">职业教育痛点</h4>
-              <img :src="curriculumResourcesImg3" alt="职业教育痛点" />
-              <div class="products-services-content">
-                <h5>海量试题</h5>
-                <i></i>
-                <p>
-                  <span>院校技术人才培养机制欠缺</span><br>
-                  <span>课程设置以理论为主，教学方式单一</span><br>
-                  <span>缺乏针对职业考核要素的实训环境及考核模拟</span><br>
-                </p>
-                <div>
-                  <a rel="nofollow" class="client-default-Btn" href="https://cdnks.mtavip.com/a/register?flug=2" target="_blank">申请方案</a>
-                  <span rel="nofollow" class="client-default-white-Btn" @click="goIntroductionPage">联系我们</span>
-                </div>
-              </div>
-            </div>
-          </div>
-        </li>
-        <li style="margin-bottom: 80px">
-          <div class="client-container">
             <div class="products-services-box products-contrary-box">
-              <h4 class="client-title">麦塔解决方案</h4>
-              <img :src="curriculumResourcesImg4" alt="麦塔解决方案" />
+              <h4 class="client-title">为企业培训打造学习矩阵</h4>
+              <img :src="trainAdvantagesImg1" alt="完善的课程学习体系" />
               <div class="products-services-content">
-                <h5>提供为院校提供“1+X”培训平台，行业领域全面覆盖</h5>
-                <i></i>
                 <p>
-                  <span>提供完整的人才培养解决方案，提供“教、学、训、研、测”一体化的教学实训体系</span><br>
-                  <span>行业内权威人才测评认证能力，提供一套体系化应用型人才测评系统，对测评人专业知识、专业技能、综合素质及内隐特质进行综合评价</span><br>
-                  <span>提供多维度的师资力量建设计划</span><br>
+                  课程总数近<span class="blue-big-size">5000门</span><br>
+                  涵盖<span class="blue-big-size">2000个</span>知识要点<br>
+                  提供<span class="blue-big-size">9大通用岗位</span>培训方案<br>
+                  课程资源<span class="blue-big-size">每月持续更新</span><br>
                 </p>
                 <div>
                   <a rel="nofollow" class="client-default-Btn" href="https://cdnks.mtavip.com/a/register?flug=2" target="_blank">申请方案</a>
@@ -94,6 +45,38 @@
       </ul>
 
     </div>
+    <!--  情景动画 -->
+    <div class="course-learn-box">
+      <h4 class="client-title">课程内容形式多样</h4>
+      <div class="client-container tc">
+        <ul class="learn-box-list">
+          <li><a href="https://1251882694.vod2.myqcloud.com/51d57535vodtransgzp1251882694/9cc031355285890792886057331/v.f30.mp4"></a><div><span><img :src="courseVideoImg16" alt="FLASH动画课程"><i @click="playVideo(15)"></i></span><p>FLASH动画课程</p></div></li>
+          <li><a href="https://spdb.mtavip.com/65615d29a5da4478b8d4ebfd6810d2da/65ab43fa5fb942aab2af981c2f7ea5c7-da005714eae365940692db31fbf6e9b8-fd.mp4"></a><div><span><img :src="courseVideoImg8" alt="视频课程"><i @click="playVideo(7)"></i></span><p>视频课程</p></div></li>
+          <li><a href="https://1251882694.vod2.myqcloud.com/51d57535vodtransgzp1251882694/9ce0a1a35285890792886070899/v.f30.mp4"></a><div><span><img :src="courseVideoImg6" alt="名师讲堂"><i @click="playVideo(5)"></i></span><p>名师讲堂</p></div></li>
+        </ul>
+        <div class="platform-products-services">
+          <a rel="nofollow" class="client-default-Btn" href="https://cdnks.mtavip.com/a/register?flug=2" target="_blank">申请方案</a>
+          <span rel="nofollow" class="client-default-white-Btn" @click="goIntroductionPage">联系我们</span>
+        </div>
+      </div>
+    </div>
+
+    <!-- 新闻资讯 -->
+    <div class="platform-news-information">
+      <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>
 
@@ -122,10 +105,10 @@
     },
     data() {
       return {
-        curriculumResourcesImg1:  require(`~/static/images/client/resources/curriculum-resources-img1.png`),
-        curriculumResourcesImg2:  require(`~/static/images/client/resources/curriculum-resources-img2.png`),
-        curriculumResourcesImg3:  require(`~/static/images/client/resources/curriculum-resources-img3.png`),
-        curriculumResourcesImg4:  require(`~/static/images/client/resources/curriculum-resources-img4.png`),
+        trainAdvantagesImg1:  require(`~/static/images/client/resources/train-scheme-img.png`),
+        courseVideoImg6:  require(`~/static/images/client/course/course-video-img6.png`),
+        courseVideoImg8:  require(`~/static/images/client/course/course-video-img8.png`),
+        courseVideoImg16:  require(`~/static/images/client/course/course-video-img16.png`),
       };
     },
     head(){
@@ -145,9 +128,6 @@
     },
     computed: {},
     methods:  {
-      goIntroductionPage(){
-        this.$router.push({ name: 'introduction' });
-      },
       checkInfo(data) {
         const opt = {
           id: data.code,