nuxtProject/pages/courseware/platform.vue

<!-- 课程开发平台运营页面-->
<template>
    <div class="client-course-platform-page">
      <!-- 课程开发平台运营 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>
        <ul>
          <li>
            <div class="client-container">
              <div class="course-services-box website-row-reverse">
                <img :src="platformImg1" alt="学习项目运营-完善的课程培训体系" />
                <div class="course-services-content">
                  <h4>01</h4>
                  <h5>学习项目运营-完善的课程培训体系</h5>
                  <p>定制学习方案，课件资源管理，课程规划，互动社区，学习积分课程进度查看，地图闯关，结业证书，分享资源，一体化线上学习方案协助您完成全流程的课程培训体系。</p>
                </div>
              </div>
            </div>
          </li>
          <li>
            <div class="client-container">
              <div class="course-services-box">
                <img :src="platformImg2" alt="测评系统-满足人才管理计划" />
                <div class="course-services-content">
                  <h4>02</h4>
                  <h5>测评系统-满足人才管理计划</h5>
                  <p>职位评价管理用数据量化+多维度测评，PC端与移动端无缝连接;支持安卓、lOS等操作系统;加速人才培养为公司提供随时随地的个性化的、开放式测评服务。</p>
                </div>
              </div>
            </div>
          </li>
          <li>
            <div class="client-container">
              <div class="course-services-box website-row-reverse">
                <img :src="platformImg3" alt="培训管理系统-线上线下全方位融合" />
                <div class="course-services-content">
                  <h4>03</h4>
                  <h5>培训管理系统-线上线下全方位融合</h5>
                  <p>建立培训计划实现项目管理，随时随地查看培训项目的参训状态，获取最精准的参训人员名单、多维度呈现培训数据报告，员工能力考核，实现匹配公司职位发展模型。</p>
                </div>
              </div>
            </div>
          </li>
          <li>
            <div class="client-container">
              <div class="course-services-box">
                <img :src="platformImg4" alt="培训数据看板-灵活、智慧、全面" />
                <div class="course-services-content">
                  <h4>04</h4>
                  <h5>培训数据看板-灵活、智慧、全面</h5>
                  <p>数据信息一目了然，支持自定义多维度分析，360项目全貌视图数据展示，方便企业快速决策。</p>
                </div>
              </div>
            </div>
          </li>
        </ul>

      </div>

      <!-- 产品功能 -->
      <div class="course-product-function">
        <div class="client-container">
          <h4 class="client-title">产品功能</h4>
          <ul class="course-product-box">
            <li><div><h5>多层级权限管理</h5><p>满足多层级架构管理体系，根据企业复杂的组织架构控制用户功能权限、数据访问权限、资源访问权限。支持按用户、用户组、角色设置权限。</p></div></li>
            <li><div><h5>模块化学习应用</h5><p>图文、视频、直播、考试、学分、积分，运用多红学习模块达成的关键成功要素</p></div></li>
            <li><div><h5>游戏化学习方式</h5><p>游戏化学习对战模式，多种答题模式;随机组卷满足各类题目需求。</p></div></li>
            <li><div><h5>定制化培训</h5><p>定制化培训为企业瞄准特定的业务问题，并在目标问题上进行有效解决，参训人员能够更好地聚焦培训内容，实现高效学习。</p></div></li>
            <li><div><h5>数据获取与监管</h5><p>可视化数据实现可追踪、可衡量、可管理，数据质量，帮助建立健全完善的考核制度。</p></div></li>
            <li><div><h5>随时随地学习</h5><p>适配PC、手机、平板全面打通，学员可利用碎片化时间学习。</p></div></li>
          </ul>
        </div>
      </div>

      <!--  应用场景 -->
      <div class="application-scenario-box">
        <div class="client-container tc">
          <h4 class="client-title">应用场景</h4>
          <ul class="application-scenario-list">
            <li>
              <p>销售人员在入职后，根据不同岗位和职能自动匹配课程，不限制学习场景。通过签到+学习+考试3大功能模块，为员工提供对应的课程和培训资料。</p>
              <h4>销售培训</h4>
            </li>
            <li>
              <p>用数据量化+考试测评，辅助匹配职位评价管理，学习+考试+测评+数据报表多维度培训，需要学习和考试配合上下级测评全部达标，满足人管理计划。</p>
              <h4>能力测评</h4>
            </li>
            <li>
              <p>支持定期设置培训管理计划，帮助企业进行人才培养体系管理，帮助提升领导力，建立核心岗位能力模型</p>
              <h4>培训管理</h4>
            </li>
          </ul>
        </div>
      </div>
    </div>
</template>

<script>
    export default {
        name: 'platform',
        layout:'templateB',
      data() {
        return {
          // 发展现状img
          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`),
          platformImg4:  require(`~/static/images/client/course/course-platform-img4.png`),
        }
        }
    };
</script>

<style scoped>

</style>