Newer
Older
urbanLifeline_YanAn / src / views / error / 401.vue
@zhangqy zhangqy on 3 Oct 1 KB first commit
  1. <template>
  2. <div class="errPage-container">
  3. <el-button icon="arrow-left" class="pan-back-btn" @click="back">
  4. 返回
  5. </el-button>
  6. <el-row>
  7. <el-col :span="12">
  8. <h1 class="text-jumbo text-ginormous">
  9. 401错误!
  10. </h1>
  11. <h2>您没有访问权限!</h2>
  12. <h6>对不起,您没有访问权限,请不要进行非法操作!您可以返回主页面</h6>
  13. <ul class="list-unstyled">
  14. <li class="link-type">
  15. <router-link to="/">
  16. 回首页
  17. </router-link>
  18. </li>
  19. </ul>
  20. </el-col>
  21. <el-col :span="12">
  22. <img :src="errGif" width="313" height="428" alt="Girl has dropped her ice cream.">
  23. </el-col>
  24. </el-row>
  25. </div>
  26. </template>
  27.  
  28. <script setup>
  29. import errImage from "@/assets/401_images/401.gif";
  30.  
  31. let { proxy } = getCurrentInstance();
  32.  
  33. const errGif = ref(errImage + "?" + +new Date());
  34.  
  35. function back() {
  36. if (proxy.$route.query.noGoBack) {
  37. proxy.$router.push({ path: "/" });
  38. } else {
  39. proxy.$router.go(-1);
  40. }
  41. }
  42. </script>
  43.  
  44. <style lang="scss" scoped>
  45. .errPage-container {
  46. width: 800px;
  47. max-width: 100%;
  48. margin: 100px auto;
  49. .pan-back-btn {
  50. background: #008489;
  51. color: #fff;
  52. border: none !important;
  53. }
  54. .pan-gif {
  55. margin: 0 auto;
  56. display: block;
  57. }
  58. .pan-img {
  59. display: block;
  60. margin: 0 auto;
  61. width: 100%;
  62. }
  63. .text-jumbo {
  64. font-size: 60px;
  65. font-weight: 700;
  66. color: #484848;
  67. }
  68. .list-unstyled {
  69. font-size: 14px;
  70. li {
  71. padding-bottom: 5px;
  72. }
  73. a {
  74. color: #008489;
  75. text-decoration: none;
  76. &:hover {
  77. text-decoration: underline;
  78. }
  79. }
  80. }
  81. }
  82. </style>