nuxtProject/pages/restaurant.vue

<template>
  <!-- 食品餐饮-详情页 -->
  <div class="client-restaurant-page">

    <!-- 食品餐饮banner栏 -->
    <div class="industrydetails-banner">
      <div class="industrydetails-banner-box"></div>
      <a rel="nofollow" class="free-trial-default-btn" href="https://cdnks.mtavip.com/a/register?flug=2" target="_blank">免费试用</a>
    </div>

    <!-- 教育行业的发展现状 -->
    <div class="industrydetails-develop-box">
      <h4 class="client-title">食品餐饮业的发展现状</h4>
      <div class="client-container">
        <p>随着社会经济的不断发展，餐饮消费的方式日益多元化与现代化，品牌化、规模化、连锁式、跨区域式餐饮经营是未来的趋势，餐饮文化的传播将越来越国际化和市场化。如何应对蓬勃发展的餐饮形势，不仅只是餐饮企业所面对的问题，同时也是烹饪教育应该思考的问题。</p>
        <img :src="developImg" alt="食品餐饮业的发展现状" />
      </div>
    </div>

    <!-- 我们的系统为您改变了什么 -->
    <div class="restaurant-change-box">
      <h4 class="client-title">我们的系统为您改变了什么</h4>
      <div class="client-container">
        <div class="industrydetails-content fn-clear mt48">
          <div class="change-content-left">
            <h5>传统方式出现的问题</h5>
            <ul>
              <li><i></i><p>人力成本过大，员工素质普遍较低</p></li>
              <li><i></i><p>连锁餐饮企业学习资源共享困难，造成浪费</p></li>
              <li><i></i><p>工作重复乏味，缺乏沟通，员工消极怠工</p></li>
              <li><i></i><p>普遍采用手工操作，原材料种类多导致价格不易控制</p></li>
              <li><i></i><p>餐饮卫生安全隐患问题严重，员工意识不强</p></li>
            </ul>
          </div>
          <img :src="changeImg" alt="vs" />
          <div class="change-content-right">
            <h5>我们能够解决的问题</h5>
            <ul>
              <li><i></i><p>组织在线培训课程、培训考试，提高员工多方面发展能力</p></li>
              <li><i></i><p>大规模并发考试，跨越平台学习，无缝对接电脑端和手机端</p></li>
              <li><i></i><p>建立多层级沟通纽带，考试得积分，积分排行榜，促使员工竞争考试</p></li>
              <li><i></i><p>建立在线审查机制，严格记录把控成本</p></li>
              <li><i></i><p>个性化学习服务，将安全案例制作成微课、长课课程，提高员工食品安全意识</p></li>
            </ul>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
    export default {
        name: 'restaurant',
        layout:     'templateB',
        data() {
          return {
            // 发展现状img
            developImg:   require(`~/static/images/client/industrydetails/restaurant-develop-img.png`),
            // 我们的系统为您改变了什么 img
            changeImg:   require(`~/static/images/client/industrydetails/restaurant-change-img.png`),
          }
        },
    };
</script>

<style scoped>

</style>