Adam / gulu-admin

Blame view

src/views/error-page/401.vue 2.31 KB
edit raw normal view history
d7d9c38c2   Adam   auto commit the c... 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
 
  <template>
    <div class="errPage-container">
      <el-button icon="el-icon-arrow-left" class="pan-back-btn" @click="back">
        返回
      </el-button>
      <el-row>
        <el-col :span="12">
          <h1 class="text-jumbo text-ginormous">
            Oops!
          </h1>
          gif来源<a href="https://zh.airbnb.com/" target="_blank">airbnb</a> 页面
          <h2>你没有权限去该页面</h2>
          <h6>如有不满请联系你领导</h6>
          <ul class="list-unstyled">
            <li>或者你可以去:</li>
            <li class="link-type">
              <router-link to="/dashboard">
                回首页
              </router-link>
            </li>
            <li class="link-type">
              <a href="https://www.taobao.com/">随便看看</a>
            </li>
            <li><a href="#" @click.prevent="dialogVisible=true">点我看图</a></li>
          </ul>
        </el-col>
        <el-col :span="12">
          <img :src="errGif" width="313" height="428" alt="Girl has dropped her ice cream.">
        </el-col>
      </el-row>
      <el-dialog :visible.sync="dialogVisible" title="随便看">
        <img :src="ewizardClap" class="pan-img">
      </el-dialog>
    </div>
  </template>
  
  <script>
  import errGif from '@/assets/401_images/401.gif'
  
  export default {
    name: 'Page401',
    data() {
      return {
        errGif: errGif + '?' + +new Date(),
        ewizardClap: 'https://wpimg.wallstcn.com/007ef517-bafd-4066-aae4-6883632d9646',
        dialogVisible: false
      }
    },
    methods: {
      back() {
        if (this.$route.query.noGoBack) {
          this.$router.push({ path: '/dashboard' })
        } else {
          this.$router.go(-1)
        }
      }
    }
  }
  </script>
  
  <style lang="scss" scoped>
    .errPage-container {
      width: 800px;
      max-width: 100%;
      margin: 100px auto;
      .pan-back-btn {
        background: #008489;
        color: #fff;
        border: none!important;
      }
      .pan-gif {
        margin: 0 auto;
        display: block;
      }
      .pan-img {
        display: block;
        margin: 0 auto;
        width: 100%;
      }
      .text-jumbo {
        font-size: 60px;
        font-weight: 700;
        color: #484848;
      }
      .list-unstyled {
        font-size: 14px;
        li {
          padding-bottom: 5px;
        }
        a {
          color: #008489;
          text-decoration: none;
          &:hover {
            text-decoration: underline;
          }
        }
      }
    }
  </style>