index.vue 985 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. <template>
  2. <div class="layout-404">
  3. <div class="_404">
  4. <img :src="`${$cdn}images/404.png`" alt="">
  5. <p>{{lang404.txt}}</p>
  6. <div @click="$router.push({name:'home'})">{{lang404.btn}}</div>
  7. </div>
  8. </div>
  9. </template>
  10. <script>
  11. import { mapState } from 'vuex'
  12. export default {
  13. computed: {
  14. ...mapState({
  15. language: state => state.language.current,
  16. lang404: state => state.language.home._404
  17. })
  18. }
  19. }
  20. </script>
  21. <style lang="scss" scoped>
  22. .layout-404{
  23. position: relative;
  24. min-height: 80vh;
  25. ._404{
  26. top: 50%;
  27. left: 50%;
  28. position: absolute;
  29. transform: translate(-50%,-50%);
  30. text-align: center;
  31. font-size: 16px;
  32. color: #2d2d2d;
  33. width: 90%;
  34. img{
  35. width:100%;
  36. }
  37. p{
  38. margin: 30px 0;
  39. }
  40. div{
  41. border: 1px solid #2d2d2d;
  42. border-radius: 8px;
  43. width: 120px;
  44. line-height: 40px;
  45. height: 40px;
  46. margin: 0 auto;
  47. cursor: pointer;
  48. }
  49. }
  50. }
  51. </style>