errors.vue 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
  1. <template>
  2. <div class="container">
  3. <img class="error-image" src="@/assets/images/error-image.png" />
  4. <div class="container-right">
  5. <div class="error-mainInfoTwo">{{ defaultObj.error_two }}</div>
  6. <a-button style="margin-top: 30px" type="primary" @click="evBack">{{ defaultObj.button_text }}</a-button>
  7. </div>
  8. </div>
  9. </template>
  10. <script setup>
  11. import { useRoute, useRouter } from 'vue-router'
  12. import {useI18n} from 'vue-i18n'
  13. const {t} = useI18n();
  14. const router = useRouter()
  15. const route = useRoute()
  16. const defaultObj = {
  17. button_text: t('error.Previous'),
  18. error_code: 404,
  19. error_two: t('error.notFound'),
  20. hasShowButton: true,
  21. }
  22. console.log(t('error.Previous'));
  23. const evBack = () => {
  24. //
  25. router.go(-1)
  26. // window.console.log('跳转')
  27. }
  28. </script>
  29. <style lang="less" scoped>
  30. .container {
  31. display: flex !important;
  32. flex-direction: row !important;
  33. min-height: 100vh;
  34. flex: auto;
  35. background-color: @bg_color_4;
  36. align-items: center !important;
  37. justify-content: center !important;
  38. }
  39. .container-right {
  40. display: flex;
  41. flex-direction: column;
  42. align-items: flex-start;
  43. justify-content: space-around;
  44. margin-left: 90px;
  45. }
  46. .error-mainInfoTwo {
  47. font-size: 36px;
  48. font-weight: bold;
  49. color: @text_color_1;
  50. }
  51. </style>