testSubmit.vue 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. <template>
  2. <!-- <div class="test-center"> -->
  3. <div class="test-submit">
  4. <div class="content-group">
  5. <img :src="submit" alt="" />
  6. <h2>提交成功</h2>
  7. </div>
  8. <button class="home-btn" @click="goTo">返回试题列表</button>
  9. </div>
  10. <!-- </div> -->
  11. </template>
  12. <script setup>
  13. import { ref } from 'vue'
  14. import submit from '@/assets/icon/submit.png'
  15. import { useRouter } from 'vue-router'
  16. const router = useRouter()
  17. const goTo = () => {
  18. router.push('/evaluation')
  19. }
  20. </script>
  21. <style scoped lang="scss">
  22. @use 'sass:math';
  23. // 定义rpx转换函数
  24. @function rpx($px) {
  25. @return math.div($px, 750) * 100vw;
  26. }
  27. // .test-center{
  28. // width: 100%;
  29. // height: 100%;
  30. // }
  31. .test-submit {
  32. display: flex;
  33. flex-direction: column;
  34. align-items: center;
  35. }
  36. .content-group {
  37. display: flex;
  38. align-items: center;
  39. gap: rpx(5);
  40. }
  41. .test-submit img {
  42. width: rpx(20);
  43. height: rpx(20);
  44. }
  45. .home-btn {
  46. width: rpx(100);
  47. margin-top: rpx(20);
  48. margin-left: rpx(10);
  49. background-color: #9e78e7;
  50. color: white;
  51. border: none;
  52. border-radius: rpx(5);
  53. cursor: pointer;
  54. transition: background-color 0.3s;
  55. }
  56. .home-btn:hover {
  57. border: none;
  58. }
  59. </style>