nuxtProject/components/footer.vue

<template>
  <div class="client-footer">
    <div class="client-container mta-hidden-xs">
      <div class="link-box">
        <h4>友情链接</h4>
        <div class="link-a-box">
          <a :href="item.url" v-for="(item,index) in requestData" :key="index">{{item.name}}</a>
        </div>
      </div>
      <div class="contact-box">
        <div class="contact-left-box">
          <dl>
            <dd><i class="logo"></i></dd>
          </dl>

          <dl>
            <dt>产品服务</dt>
            <dd @click="goExamPage">在线考试系统</dd>
            <dd @click="goPeixunPage">在线培训系统</dd>
            <dd @click="goKechengPage">课程定制开发</dd>
            <dd @click="goKechengPage">通用课程资源</dd>
            <div style="display: none">
              <a :href="`${baseUrl}/examsystem`"></a>
              <a :href="`${baseUrl}/trainsystem`"></a>
              <a :href="`${baseUrl}/courseware`"></a>
              <a :href="`${baseUrl}/introduction`"></a>
            </div>
          </dl>
          <dl>
            <dt>新闻资讯</dt>
            <dd @click="goaboutUs">行业新闻</dd>
            <dd @click="goaboutUs">成功案例</dd>
          </dl>
          <dl>
            <dt>联系我们</dt>
            <dd>
              公司邮箱: service@llisoft.com
            </dd>
            <dd>
              联系电话：400-0990-883
            </dd>
            <dd>
              公司地址：大连市沙河口区数码路北段25号201室
            </dd>
          </dl>
        </div>
        <div class="contact-right-box">
          <div class="right-sw-box">
            <img :src="swTwoCodeImg" alt="商务合作扫微信"/>
          </div>
        </div>
      </div>

      <h5>版本所有 © 2021 大连青谷软件有限公司 备案号：辽ICP备15006970号-6</h5>
    </div>
    <div class="mta-hidden-sm phone-footer-box">
      <p>版本所有 © 大连青谷软件有限公司 </p>
      <a href="https://beian.miit.gov.cn/#/Integrated/index">备案号：辽ICP备15006970号-6</a>
    </div>
  </div>
</template>

<script>
  import {mapState, mapGetters} from 'vuex';

  export default {
    name: 'mtaFooter',
    computed: {
      baseUrl() {
        return this.getBaseUrl;
      },
      requestData() {
        return this.getFooterYouQingLianJie;
      },
      ...mapGetters(['getFooterYouQingLianJie','getBaseUrl']),
    },
    data() {
      return {
        swTwoCodeImg: require(`~/static/images/client/component/sw-two-code.png`),
        footerData: [
          {
            name: '首页',
            url: '/',
          },
          {
            name: '体验中心',
            url: '/tiyanCenter',
          },
          {
            name: '电话咨询',
            url: 'tel:400-052-2130',
          },
          {
            name: '在线咨询',
            url: 'https://p.qiao.baidu.com/cps/chat?siteId=17930048&userId=40179606&siteToken=e767a987c8404575246ab0084fb2c9bd',
          }

        ]
      }
    },
    methods: {
      goToPage(item) {
        window.location.href = item.url
      },
      // 考试链接
      goExamPage() {
        this.$router.push({name: 'examsystem'});
      },
      // 培训链接
      goPeixunPage() {
        this.$router.push({name: 'trainsystem'});
      },
      // 课程开发链接
      goKechengPage() {
        this.$router.push({name: 'courseware'});
      },
      // 关于帮助中心
      goaboutUs() {
        this.$router.push({name: 'introduction'});
      },
    },
  }
</script>