课程开发课程大赛开发

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

@@ -2247,5 +2247,86 @@
       }
     }
   }
+
+  /**************** describe:课程开发课程大赛  author: TX  date:2022-12-29 ****************/
+  .website-course-compete-page{
+    padding-bottom: 94px;
+    // 默认大标题
+    .client-subtitle-title{width: 900px;margin-top: 40px;}
+
+    // 新大标题
+    .course-compete-title{
+      text-align: center;position: relative;height: 102px;line-height: 102px;
+      em{font-size: 124px;font-weight: 600;color: #0077ff;opacity: 0.18;position: absolute;transform: translate(5%);}
+      span{font-size: 36px;font-weight: 400;color: #333;}
+    }
+    // 新副标题
+    .course-compete-subtitle-title{
+      font-size: 24px;font-weight: 400;text-align: center;color: #0066cc;display: flex;
+      justify-content: center;align-items: center;margin-top: 55px;
+      i{width: 10px;height: 1px;margin: 0 8px;display: block;background: #0066cc;}
+    }
+
+    // 按钮
+    .course-compete-btn{width: 138px;height: 50px;line-height:50px;background: #0065cd;border-radius: 6px;display: block;
+      font-size: 16px;font-weight: 400;color: #ffffff;text-align: center;margin: 0 auto;}
+
+    // 蓝色背景
+    .compete-blue-bj{background: #f3f8fe;}
+
+    // 栋科提供的服务
+    .dk-service-box{
+      padding-bottom: 94px;
+      ul{display: flex;justify-content: space-between;margin: 120px 0;}
+      li{width: 283px;height: 227px;background-size: cover;background-repeat: no-repeat;background-position: center;}
+      li:nth-child(1) {background-image: url("~static/images/client/course/course-compete-dk1.png");}
+      li:nth-child(2) {background-image: url("~static/images/client/course/course-compete-dk2.png");}
+      li:nth-child(3) {background-image: url("~static/images/client/course/course-compete-dk3.png");}
+      li:nth-child(4) {background-image: url("~static/images/client/course/course-compete-dk4.png");}
+      p{font-size: 24px;color: #fff;font-weight: normal;margin: 155px 0 0;}
+      }
+
+    // 知识萃取
+    .compete-introduce-box{
+      padding: 100px 0;
+      img{max-width: 100%;margin: 80px auto 90px;}
+    }
+
+    @media (max-width: 768px){
+      padding: 24px 0;
+      // 默认大标题
+      .client-subtitle-title{width: 90%;margin-top: 20px;text-align: center;}
+
+      // 新大标题
+      .course-compete-title{
+        height: 51px;line-height: 51px;
+        em{font-size: 62px;transform: translate(5%);}
+        span{font-size: 18px;}
+      }
+
+      // 新副标题
+      .course-compete-subtitle-title{
+        font-size: 15px;margin-top: 32px;
+        i{width: 5px;height: 1px;margin: 0 4px;}
+      }
+
+      // 按钮
+      .course-compete-btn{width: 90px;height: 30px;line-height:30px;font-size: 12px;border-radius: 4px;}
+
+      // 栋科提供的服务
+      .dk-service-box{
+        padding: 16px 0 24px;
+        ul{justify-content: center;flex-wrap: wrap;margin: 32px 0;}
+        li{width: 141px;height: 113px;margin: 10px;}
+        p{font-size: 12px;margin: 78px 0 0;}
+       }
+
+      // 知识萃取
+      .compete-introduce-box{
+        padding: 50px 0;
+        img{margin: 42px auto;}
+      }
+    }
+  }
 }
 

pages/courseware/compete.vue

@@ -6,6 +6,61 @@
       <!-- 课程开发课程大赛 banner栏 移动端-->
       <div  @click="clickBanner(bannerList[0].url)" :style="{backgroundImage: `url(${competeBannerPhoneImg})`}" class="website-course-banner mta-hidden-sm"></div>
 
+      <!--  栋科提供的服务 -->
+      <div class="dk-service-box">
+        <h4 class="client-title">栋科提供的服务</h4>
+        <h5 class="client-subtitle-title">当学员对平台学习有了一定参与度，学习运营的重心将转移到挖掘优秀员工经验，对知识进行沉淀。可以采用众包众筹的方式，通过案例征集、微课开发等一系列活动，促进学员进行知识分享和输出。</h5>
+        <div class="client-container tc">
+          <ul class="learn-box-list">
+            <li><p>知识萃取</p></li>
+            <li><p>微课培训</p></li>
+            <li><p>微课大赛</p></li>
+            <li><p>案例征集</p></li>
+          </ul>
+          <a class="course-compete-btn" href="https://p.qiao.baidu.com/cps/chat?siteId=17930746&userId=40179606&siteToken=d9c57b2ea4cbedbb044677ef47a1e2d1" target="_blank">在线咨询</a>
+        </div>
+      </div>
+      <!--知识萃取-->
+      <div class="compete-introduce-box compete-blue-bj">
+        <div class="client-container">
+          <h4 class="course-compete-title"><em>01</em><span>知识萃取</span></h4>
+          <h5 class="client-subtitle-title">帮助企业进行关键岗位知识与技能挖掘，形成具有易学习、易掌握、易应用的课程资源，并通过实际工作检验，不断修正，形成岗位专业技能课程体系，将隐性经验显性化，显性经验系统化。</h5>
+          <img :src="competeZscqPcImg" class="mta-hidden-xs">
+          <img :src="competeZscqPcImg" class="mta-hidden-sm">
+          <a class="course-compete-btn" href="https://p.qiao.baidu.com/cps/chat?siteId=17930746&userId=40179606&siteToken=d9c57b2ea4cbedbb044677ef47a1e2d1" target="_blank">在线咨询</a>
+        </div>
+      </div>
+      <!--微课培训-->
+      <div class="compete-introduce-box">
+        <div class="client-container">
+          <h4 class="course-compete-title"><em>02</em><span>微课培训</span></h4>
+          <h5 class="client-subtitle-title">帮助组织快速掌握知识沉淀与知识萃取的方法，获得一批高质量学习资源，培养一批具备知识转化与应用能力的内部培训师。</h5>
+          <p class="course-compete-subtitle-title"><i></i>栋科微课训练营<i></i></p>
+          <img :src="competeZscqPcImg" class="mta-hidden-xs">
+          <img :src="competeZscqPcImg" class="mta-hidden-sm">
+          <a class="course-compete-btn" href="https://p.qiao.baidu.com/cps/chat?siteId=17930746&userId=40179606&siteToken=d9c57b2ea4cbedbb044677ef47a1e2d1" target="_blank">在线咨询</a>
+        </div>
+      </div>
+      <!--微课大赛-->
+      <div class="compete-introduce-box compete-blue-bj">
+        <div class="client-container">
+          <h4 class="course-compete-title"><em>03</em><span>微课大赛</span></h4>
+          <h5 class="client-subtitle-title">栋科企业微课大赛，是一场发动企业全员参与的学习资源建设活动。通过“以赛代训”的方式，集中产出移动学习资源，推动企业移动学习的进程，助力企业高效沉淀一批优质的微课，极大减免企业培训成本！</h5>
+          <img :src="competeZscqPcImg" class="mta-hidden-xs">
+          <img :src="competeZscqPcImg" class="mta-hidden-sm">
+          <a class="course-compete-btn" href="https://p.qiao.baidu.com/cps/chat?siteId=17930746&userId=40179606&siteToken=d9c57b2ea4cbedbb044677ef47a1e2d1" target="_blank">在线咨询</a>
+        </div>
+      </div>
+      <!--案例征集-->
+      <div class="compete-introduce-box">
+        <div class="client-container">
+          <h4 class="course-compete-title"><em>04</em><span>案例征集</span></h4>
+          <p class="course-compete-subtitle-title"><i></i>栋科案例征集活动特点<i></i></p>
+          <img :src="competeZscqPcImg" class="mta-hidden-xs">
+          <img :src="competeZscqPcImg" class="mta-hidden-sm">
+          <a class="course-compete-btn" href="https://p.qiao.baidu.com/cps/chat?siteId=17930746&userId=40179606&siteToken=d9c57b2ea4cbedbb044677ef47a1e2d1" target="_blank">在线咨询</a>
+        </div>
+      </div>
 
     </div>
 </template>
@@ -19,6 +74,7 @@
           // 发展现状img
           competeBannerImg: require(`~/static/images/client/course/course-compete-banner.png`),
           competeBannerPhoneImg: require(`~/static/images/client/course/course-compete-sj-banner.jpg`),
+          competeZscqPcImg: require(`~/static/images/client/course/compete-zscq-pc-img.png`),
         }
       }
     };