| 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
 | | <template> |  |   <div class="middle-box"> |  |     <div class="text-center animated fadeInDown"> |  |       <h1>{{ errorNumber }}</h1> |  |       <h3 class="font-bold">{{ message }}</h3> |  |       <slot></slot> |  |       <div class="error-desc">{{ text }}</div> |  |       <div class="back"> |  |         <el-button type="primary" @click="backHome" icon="md-arrow-round-back">返回首页</el-button> |  |       </div> |  |     </div> |  |   </div> |  | </template> |  | <script> |  | export default { |  |   props: { |  |     errorNumber: { |  |       type: String, |  |       default: "500", |  |     }, |  |     message: { |  |       type: String, |  |       default: "页面未找到!", |  |     }, |  |     text: { |  |       type: String, |  |       default: "唉...好像出了点问题~", |  |     }, |  |   }, |  |   methods: { |  |     backHome: function () { |  |       this.$router.push({ |  |         path: "/home", |  |       }); |  |     }, |  |   }, |  | }; |  | </script> |  | <style lang="less" scoped> |  | body { |  |   background-color: #fff; |  | } |  |   |  | .middle-box { |  |   text-align: center; |  |   padding-top: 80px; |  |   height: 100%; |  |   |  |   // background: #eee; |  |   h1 { |  |     font-size: 140px; |  |     font-weight: 100; |  |   } |  |   |  |   .back { |  |     padding: 10px; |  |   } |  | } |  | </style> | 
 |