nuxtProject/pages/introduction/index.vue

<template>
  <div class="client-aboutUs-page">
    <!-- 关于我们banner栏 -->
    <div class="aboutUs-banner">
      <div
        :style="{backgroundImage: `url(${bannerList[0].pic || require(`~/static/images/client/train/train-banner-background.png`)})`}"
        class="client-platform-banner"></div>
      <div>
        <h4>关于青谷软件</h4>
        <p>移动化、平台化、知识化、智能化</p>
      </div>
    </div>

    <!-- 公司简介 -->
    <div class="company-profile-box">
      <img src="#" alt="">
      <div class="client-container">
          <h4>公司介绍</h4>
          <p>大连青谷软件有限公司成立于2013年10月。公司凭借成熟的项目研发和管理经验，致力于为客户提供全方位的在线教育解决方案，实现移动化、平台化、智能化学系管理模式，让学系变得更轻松。</p>
          <p>目前，青谷软件70%的员工拥有技术背景，这样可以保障我们在项目实施的各个环节（特别是售后服务），能第一时间为客户提供技术支持，让客户无后顾之忧。</p>
      </div>
    </div>

    <!-- 我们提供什么 -->
    <div class="brand-introduction-box">
      <h4>我们提供什么</h4>
      <ul>
        <li>
          <i></i>
          <span>在线考试系统租赁/采购</span>
        </li>
        <li>
          <i></i>
          <span>在线培训系统租赁/采购</span>
        </li>
        <li>
          <i></i>
          <span>课件定制开发服务</span>
        </li>
        <li>
          <i></i>
          <span>行业通用类课程资源</span>
        </li>
      </ul>
    </div>


    <!-- 我么你始终专注教育系统研发，更懂用户需求 -->
    <div class="corporate-culture-box">
      <h4>我们始终专注教育系统研发</h4>
      <ul>
        <li><img src="#" alt=""></li>
        <li><img src="#" alt=""></li>
        <li><img src="#" alt=""></li>
        <li><img src="#" alt=""></li>
      </ul>
    </div>


    <!-- 地图 -->
    <div class="client-container">
      <div class="contact-us-box fn-clear">
        <img src="#" alt="背景图">
        <img src="#" alt="地图" />
      </div>
    </div>

  </div>


</template>

<script>
  import {BannerImgs} from "@/defaultConfig";

  export default {
    name:     'introduction',
    layout:   'templateB',
    async asyncData({$axios, store}) {
      const arr = [
        $axios.$post(`/home/banner/list`, {'code': BannerImgs.guanyuwomen}),
      ];
      const [res2] = await Promise.all(arr);
      return {
        bannerList: res2.data.data || [],
      }
    },
    data() {
      return {};
    },
    head(){
      return {
        title: '麦塔考培系统_大连栋科软件工程有限公司',
        meta: [
          {
            name: 'keywords',
            content: '麦塔考试系统,麦塔培训系统'
          },
          {
            name:'description',
            content:'大连栋科软件工程有限公司是专业的教育软件与数字化资源服务供应商，创立于2007年，总部位于大连软件园。公司凭借成熟的项目研发和管理经验，致力于为客户提供全方位的在线教育解决方案，实现移动化、平台化、知识化、智能化学习管理模式，让学习变得更轻松。'
          }
        ],
      }
    },
    computed: {},
    methods:  {},
    created() {

    },
    mounted() {
    },
    beforeDestroy() {
    },
  };
</script>
<style>

</style>