SOURCE

<template>
  <div class="page-exception page-full">
    <div class="page-content">
      <ue-exception :type="type">
        <template v-if="getBtnStatus()">
          <el-button
            type="primary"
            @click="btnHandle"
          >
            {{ $t('common.exception.btn') }}
          </el-button>
        </template>
      </ue-exception>
    </div>
  </div>
</template>

<script>
import ueException from '@/components/ue/ueException'
export default {
  name: 'Exception',
  components: {
    ueException
  },
  props: {
    // 异常类型
    type: {
      type: String,
      default: ''
    },
    // 返回首页按钮状态
    btn: {
      type: Boolean,
      default: false
    }
  },
  data () {
    return {
    }
  },
  computed: {
  },
  methods: {
    // 按钮状态
    getBtnStatus () {
      const { btn, $route } = this
      const { query } = $route

      if (!btn && !query['btn']) {
        return $route.name === 'exception' && window.history.length > 1
      }

      return btn || ['true', '1'].includes(query['btn'])
    },
    // 按钮事件
    btnHandle (e) {
      const { $router } = this
      const num = 3
      const goNum = -1

      window.history.length >= num ? $router.go(goNum) : $router.replace('/')
    }
  }
}
</script>
<style lang="scss">
.page-exception {
  &:first-child {
    &.page-full {
      height: calc(100% - #{$common-spacing}) !important;
    }
    .page-content:first-child:last-child {
      box-shadow: none;
      background: transparent;
      margin-top: $common-spacing;
      min-height: calc(100% - #{$common-spacing});
    }
  }
  .ue-exception {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }
}
</style>
console 命令行工具 X clear

                    
>
console