bbs.hoolihome.com/layouts/error.vue

<template>
  <section class="page-container container-error">
    <my-header ref="myHeader"/>
    <div class="page-wrap">
      <img
        src="//static.hoolihome.com/pc/3.0.0/assets/img/v3.1/no-data.png"
        class="photo">
      <h1 class="title">{{ error.statusCode }}</h1>
      <h2 class="info">{{ error.message }}</h2>
      <nuxt-link
        v-if="error.statusCode === 404"
        class="button"
        to="/">{{ $t("home") }}</nuxt-link>
    </div>
    <my-footer :friendship-link-arr="friendshipLinkArr"/>
  </section>
</template>

<script>
import MyHeader from '~/components/common/MyHeader'
import MyFooter from '~/components/common/MyFooter'
import { php_api_link_list } from '~/common/apis.js'

export default {
  components: {
    MyHeader,
    MyFooter
  },
  props: {
    error: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      locale: this.$store.state.locale,
      friendshipLinkArr: []
    }
  },
  scrollToTop: true,
  mounted() {
    this.loadFriendshipLink()
  },
  methods: {
    handleShowView() {
      this.$refs.myHeader.handleShowView('LoginByPassword')
    },
    loadFriendshipLink() {
      this.$axios
        .$post(php_api_link_list)
        .then(res => {
          if (res) {
            let { code, data } = res
            code = parseInt(code)
            if (code === 0 && data && Array.isArray(data.list)) {
              this.friendshipLinkArr = data.list
            }
          }
        })
        .catch(e => {})
    }
  }
}
</script>

<style lang="less" scoped>
.page-container {
  .page-wrap {
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    align-items: center;
    max-width: 1200px;
    min-height: 400px;
    margin: 0 auto;
    .photo {
      width: 70px;
    }
    .title {
      max-width: 200px;
      height: 22px;
      margin-top: 24px;
      font-size: 14px;
      font-family: PingFangSC-Regular;
      font-weight: 400;
      color: rgba(153, 153, 153, 1);
      text-align: center;
      line-height: 22px;
    }
    .info {
      max-width: 200px;
      height: 22px;
      margin-top: 10px;
      font-size: 14px;
      font-family: PingFangSC-Regular;
      font-weight: 400;
      color: rgba(153, 153, 153, 1);
      text-align: center;
      line-height: 22px;
    }
    .button {
      max-width: 200px;
      height: 22px;
      margin-top: 10px;
      font-size: 14px;
      font-family: PingFangSC-Regular;
      font-weight: 400;
      color: #ff523d;
      text-align: center;
      line-height: 22px;
    }
  }
}
</style>