push

lib/paas/view/service/error-403.vue

@@ -0,0 +1,74 @@
+<template>
+  <div :key="'error403_' + $route.name">
+    <a-page-header>
+      <template #extra>
+        <a-button @click="onBack">返回</a-button>
+      </template>
+    </a-page-header>
+    <div class="page-404">
+      <h2>403</h2>
+      <h3>您没有该页面的权限</h3>
+      <p>请联系管理员，或者点击链接继续浏览</p>
+      <div class="op-list">
+        <router-link :to="{ name: 'root' }">返回首页</router-link>
+        <span>|</span>
+        <ns-button type="link" @click="onBack">返回上页</ns-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+  import { defineComponent } from 'vue';
+
+  export default defineComponent({
+    name: 'NsViewError403',
+
+    setup() {},
+
+    methods: {
+      onBack() {
+        this.$router.go(-1);
+      },
+    },
+  });
+</script>
+
+<style lang="less" scoped>
+  .page-404 {
+    margin: 150px auto 0;
+    width: 500px;
+    text-align: center;
+
+    h2 {
+      font-size: 160px;
+      letter-spacing: 20px;
+      color: @primary-color;
+      text-align: center;
+    }
+
+    h3 {
+      padding: 10px 0;
+      font-size: 36px;
+      letter-spacing: 3px;
+      color: @text-color;
+      text-align: center;
+    }
+
+    p {
+      font-size: 14px;
+      color: @text-color-secondary;
+    }
+
+    .op-list {
+      border-top: 1px solid @border-color-base;
+      width: 76%;
+      margin: 0 auto;
+
+      span {
+        padding-left: 16px;
+        color: @text-color-secondary;
+      }
+    }
+  }
+</style>