submitScore.vue 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110
  1. <template>
  2. <uni-popup ref="popupRef" :animation="false" :is-mask-click="false" type="top"
  3. mask-background-color="rgba(0, 0, 0, 0.4);">
  4. <view class="exam-score-dialog">
  5. <customNavbarVue :title="title" :show-back-btn="true" @back="handleClose"></customNavbarVue>
  6. <view class="score-content-box">
  7. <view class="score-content-name">{{data[nameKey]}}</view>
  8. <view class="content-score-box">
  9. <view>
  10. <view class="score-content-text">正确数量:{{data.rightCount}}</view>
  11. <view class="score-content-text">试题总数:{{data.shitiTotal}}</view>
  12. <view class="score-content-text">及格分数:{{data.okScore}}</view>
  13. <view class="score-content-text">{{labelName}}:{{data.ksScore}}</view>
  14. </view>
  15. <view class="score-content-text"><text>{{data.userScore}}</text>分</view>
  16. </view>
  17. </view>
  18. <view class="progress-text-btn-box">
  19. <text class="progress-text">正确率</text>
  20. <c-progress-circle :progress='data.userAccuracy/100' color='#3fd2a1' size='240rpx'
  21. boderWidth="240rpx" class="progress-circle-box"></c-progress-circle>
  22. <button type="default" class="phone-green-btn score-dialog-btn" @click="handleCheckSj">查看成绩</button>
  23. <button type="default" class="phone-white-btn score-dialog-return-btn" @click="goIndex">退出</button>
  24. </view>
  25. </view>
  26. </uni-popup>
  27. </template>
  28. <script setup>
  29. import {ref,reactive} from "vue";
  30. import customNavbarVue from "@/components/custom-navbar/custom-navbar.vue";
  31. const popupRef = ref(null)
  32. const data = reactive({
  33. ksName: '',
  34. lxName: '',
  35. ksScore: '',
  36. okScore: '',
  37. rightCount: '',
  38. shitiTotal: '',
  39. userScore: '',
  40. })
  41. defineProps({
  42. title: {
  43. type: String,
  44. default: '考试得分'
  45. },
  46. labelName: {
  47. type: String,
  48. default: '考试总分'
  49. },
  50. nameKey: {
  51. type: String,
  52. default: 'ksName'
  53. }
  54. })
  55. const emits = defineEmits(['confirm', 'close'])
  56. function handleClose() {
  57. emits('close');
  58. popupRef.value.close()
  59. }
  60. function goIndex(){
  61. uni.redirectTo({
  62. url: `/pages/client/ShouYe/shouye`
  63. })
  64. }
  65. function handleCheckSj() {
  66. emits('confirm', data);
  67. popupRef.value.close()
  68. }
  69. function showDialog(options) {
  70. data.ksName = options.ksName;
  71. data.lxName = options.lxName;
  72. data.ksScore = options.ksScore;
  73. data.okScore = options.okScore;
  74. data.rightCount = options.rightCount;
  75. data.shitiTotal = options.shitiTotal;
  76. data.userScore = options.userScore;
  77. data.userAccuracy = options.userAccuracy;
  78. popupRef.value.open()
  79. }
  80. defineExpose({
  81. showDialog
  82. })
  83. </script>
  84. <style lang="scss">
  85. .content{
  86. display: flex;
  87. flex-direction: column;
  88. align-items: center;
  89. padding-top: 20rpx;
  90. font-size: 28rpx;
  91. }
  92. .btnBox{
  93. width: 100%;
  94. display: flex;
  95. align-items: center;
  96. margin-top:30rpx;
  97. }
  98. </style>