样式优化

pages/YNEduApp/exam/beforeExam.vue

@@ -21,12 +21,14 @@
         </div>
       </div>
 
-      <div class="explain">*进入考试后，计时结束将自动交卷，退出后将会继续计时，考试期间请勿登录其他设备，否则成绩作废</div>
+      <div class="explain">
+        *进入考试后，计时结束将自动交卷，退出后将会继续计时，考试期间请勿登录其他设备，否则成绩作废
+      </div>
 
       <!-- 底部固定按钮 -->
       <div class="bottom-btn">
         <div class="btn">
-          <u-button type="primary" size="small" shape="circle" text="进入考试" @click="openModal" />
+          <u-button type="primary" shape="circle" text="进入考试" @click="openModal" />
         </div>
       </div>
 
@@ -117,7 +119,7 @@ export default {
   padding: 10px;
   border-radius: 5px;
   background-color: #fff;
-  height: 90vh;
+  height: calc(100vh - 90px);
   box-sizing: border-box;
 
   .title {
@@ -129,14 +131,14 @@ export default {
 
   .subtitle {
     font-size: 14px;
-    color: #666;
+    color: #3185f0;
     margin-top: 10px;
   }
 
   .info {
     display: flex;
     justify-content: space-between;
-    margin-top: 20px;
+    margin-top: 50px;
 
     .duration-wrapper,
     .count-wrapper,
@@ -182,6 +184,7 @@ export default {
     bottom: 0;
     left: 0;
     width: 100%;
+    height: 50px;
     background-color: #fff;
     padding: 10px 0;
     display: flex;

pages/YNEduApp/exam/examination.vue

@@ -2,9 +2,19 @@
   <view :style="{ fontSize: fontSize + 'px' }">
     <u-navbar leftIcon="" title="考试" :placeholder="true">
       <view class="u-nav-slot" slot="right">
-        <u-tag text="小" :type="fontSize == 19 ? 'primary' : 'info'" @click="changeFont(19)" style="margin-right: 8px" ></u-tag>
+        <u-tag
-        <u-tag text="中" :type="fontSize == 21 ? 'primary' : 'info'" @click="changeFont(21)" style="margin-right: 8px"></u-tag>
+          text="小"
-        <u-tag text="大" :type="fontSize == 23 ? 'primary' : 'info'" @click="changeFont(23)"></u-tag>
+          :type="fontSize == 19 ? 'primary' : 'info'"
+          @click="changeFont(19)"
+          style="margin-right: 8px"
+        ></u-tag>
+        <u-tag
+          text="中"
+          :type="fontSize == 21 ? 'primary' : 'info'"
+          @click="changeFont(20.5)"
+          style="margin-right: 8px"
+        ></u-tag>
+        <u-tag text="大" :type="fontSize == 23 ? 'primary' : 'info'" @click="changeFont(22)"></u-tag>
       </view>
     </u-navbar>
     <div class="content" @touchstart="touchStart" @touchmove="touchMove" @touchend="touchEnd">
@@ -70,27 +80,30 @@
           </div>
         </div>
       </div>
-
       <!-- 题目 -->
       <div class="question-wrapper" v-for="(item, index) in questionList" :key="index" v-show="index == currentIndex">
         <div class="question-type-wrapper">
-          <div class="line" />
+          <div class="line" :style="{ height: fontSize - 8 + 'px' }" />
-          <div class="question-type">
+          <div class="question-type" :style="{ fontSize: fontSize - 2 + 'px' }">
             <div v-if="item.examType == 1">单选题（{{ item.questionScore }}分）</div>
             <div v-if="item.examType == 2">多选题（{{ item.questionScore }}分）</div>
             <div v-if="item.examType == 3">判断题（{{ item.questionScore }}分）</div>
           </div>
         </div>
-        <div class="question">{{ currentIndex + 1 }}. {{ item.examTopic }}</div>
+        <div class="question" :style="{ fontSize: fontSize + 2 + 'px' }">
-        <u--image
+          {{ currentIndex + 1 }}. {{ item.examTopic }}
+        </div>
+        <u-image
           v-if="item.examTopicUrl"
           :showLoading="true"
           :src="fileUrl + item.examTopicUrl || ''"
           width="60px"
           height="60px"
-          style="margin-bottom: 10px"
+          style="margin: 0 10px 15px 0"
           @click="clickImg(fileUrl + item.examTopicUrl)"
         />
+        <u-line />
+
         <div class="options">
           <div class="option-wrapper" v-for="(option, optionIndex) in item.listOption" :key="optionIndex">
             <div
@@ -101,13 +114,13 @@
               <div class="option-item">{{ option.optionIdent }}.</div>
               <div class="option-content">{{ option.optionContent }}</div>
             </div>
-            <u--image
+            <u-image
               v-if="option.optionUrl"
               :showLoading="true"
               :src="fileUrl + option.optionUrl || ''"
               width="60px"
               height="60px"
-              style="margin-bottom: 10px"
+              style="margin: 15px 10px 5px 0"
               @click="clickImg(fileUrl + option.optionUrl)"
             />
           </div>
@@ -117,7 +130,7 @@
       <!-- 底部按钮 -->
       <div style="height: 75px"></div>
       <div class="bottom-btn">
-        <div class="btn" v-show="currentIndex != 0">
+        <div class="btn" v-if="currentIndex != 0">
           <u-button shape="circle" text="上一题" @click="currentIndex--" />
         </div>
         <div class="btn" v-if="currentIndex !== questionList.length - 1">
@@ -152,8 +165,6 @@
 </template>
 
 <script>
-import { pathToBase64, base64ToPath } from 'image-tools'
-// import face from '@/uni_modules/mcc-face/index.js'
 import {
   getExamQuestionList,
   insertQuestionAnswerById,
@@ -223,32 +234,15 @@ export default {
   },
   onShow() {
     this.isHide = false
-    // setTimeout(() => {
-    //   if (this.screenCount > this.switchCount) {
-    //     this.$refs.uToast.show({
-    //       message: '切屏次数已达上限, 系统将自动提交',
-    //       duration: 1000
-    //     })
-    //     this.handleConfirmSubmit()
-    //   }
-    // }, 1000)
   },
   onHide() {
-    // this.screenCount++
-    // console.log('🚀 ~ onHide ~ this.screenCount:', this.screenCount)
     setTimeout(() => {
       if (!this.isHide) {
         this.handleConfirmSubmit()
       }
     }, 500)
   },
-  mounted() {
+  
-    // this.getList()
-  },
-  // onUnload() {
-  //   console.log('🚀 ~ onUnload ~ 页面关闭')
-  //   this.handleConfirmSubmit()
-  // },
   methods: {
     changeFont(size) {
       console.log('🚀 ~ changeFont ~ size:', size)
@@ -262,7 +256,6 @@ export default {
         }
         console.log('🚀 ~ 考试 ~ params:', params)
         this.$verificationToken()
-        console.log('🚀 ~ 考试 ~ config:', config)
         uni.request({
           url: config.baseUrl + '/exam-student/studentExam/getExamQuestionList',
           method: 'post',
@@ -281,9 +274,6 @@ export default {
             this.time = Number(data.answerTime) * 60 * 1000
             console.log('🚀 ~ getList ~ this.time:', this.time)
             console.log('🚀 ~ getList ~ this.questionList:', this.questionList)
-            // this.random1 = (data.answerTime / 3) * 60 + Math.ceil(Math.random() * 20) + 20
-            // this.random2 = (data.answerTime / 1.5) * 60 + Math.ceil(Math.random() * 30) + 30
-            // console.log('🚀 ~ getList ~ this.random1:', this.random1, this.random2)
             if (this.questionList.length > 0) {
               this.questionList.forEach((item, index) => {
                 this.$set(item, 'isShow', index < 7)
@@ -315,23 +305,7 @@ export default {
       if (this.time == 0 && !this.isLoading) return
       this.answerTime =
         this.time - (time.days * 24 * 60 * 60 + time.hours * 60 * 60 + time.minutes * 60 + time.seconds) * 1000
-      // console.log('🚀 ~ changeCountDown ~ this.answerTime:', this.answerTime)
+        if (this.answerTime == this.time) {
-      // console.log(
-      //   '🚀 ~ changeCountDown ~ this.answerTime:',
-      //   this.time,
-      //   this.answerTime / 1000,
-      // )
-      // console.log('🚀 ~ changeCountDown ~:', this.answerTime / 1000 == this.random1)
-      // console.log('🚀 ~ changeCountDown ~:', this.answerTime / 1000 == this.random2)
-      // if (this.answerTime / 1000 == this.random1) {
-      //   console.log('🚀 ~ changeCountDown ~ 人脸识别')
-      //   // this.openFaceScan() // Android 人脸识别
-      //   this.openPhotograph() // IOS 拍照识别
-      // } else if (this.answerTime / 1000 == this.random2) {
-      //   // this.openFaceScan()
-      //   this.openPhotograph()
-      // } else
-      if (this.answerTime == this.time) {
         // 提示: 时间结束, 自动提交
         this.$refs.uToast.show({
           message: '考试时间结束, 系统将自动提交',
@@ -473,131 +447,7 @@ export default {
         this.updStudyDurationExamPractice({ userId: params.userId, studyId: this.studyId })
       }
       console.log('🚀 ~ handleConfirmSubmit ~ params:', params, res)
-      // this.showConfirmModal = false
-      // const params2 = {
-      //   examId: this.examId,
-      //   examGrade: res.examGrade,
-      //   examResult: res.examResult,
-      //   gradeAverage: res.gradeAverage,
-      //   answerTime: Math.ceil(this.answerTime / 60000),
-      //   examTime: this.examTime,
-      //   questionCount: this.questionList.length,
-      //   switchCount: this.switchCount,
-      //   examNum: this.examNum,
-      //   examCount: this.examCount,
-      //   examCustom: this.examCustom,
-      //   results: res.examResult,
-      //   studyId: this.studyId || ''
-      // }
-      // uni.navigateTo({
-      //   url: `/pages/YNEduApp/exam/examinationDetails?params=${JSON.stringify(params2)}`
-      // })
     },
-    // 人脸识别
-    // async openFaceScan() {
-    //   face.open(['a'], e => {
-    //     console.log('🚀 ~ e-人脸识别:', e)
-    //     face.close()
-    //     let params = {
-    //       userId: uni.getStorageSync('userId'),
-    //       img: e
-    //     }
-    //     params = JSON.stringify(params)
-    //     this.getFaceRecognition(params)
-    //   })
-    // },
-    // 拍照录入
-    // openPhotograph() {
-    //   this.isHide = true
-    //   setTimeout(() => {
-    //     this.$refs.countDown.pause()
-    //     uni.chooseImage({
-    //       count: 1,
-    //       sizeType: ['compressed'],
-    //       sourceType: ['camera'],
-    //       success: res => {
-    //         this.isHide = false
-    //         let url = ''
-    //         console.log('🚀 ~ res-拍照:', res)
-    //         this.imgToBase64(res.tempFilePaths[0]).then(base64 => {
-    //           url = base64
-    //           console.log('🚀 ~ this.imgToBase64 ~ base64:', url)
-    //           this.getFaceRecognition({ userId: uni.getStorageSync('userId'), img: url })
-    //         })
-    //       },
-    //       fail: err => {
-    //         this.isHide = false
-    //         console.log('🚀 ~ err:', err)
-    //       }
-    //     })
-    //   }, 10)
-    // },
-    // imgToBase64(data) {
-    //   return new Promise((resolve, reject) => {
-    //     pathToBase64(data)
-    //       .then(base64 => {
-    //         resolve(base64)
-    //       })
-    //       .catch(error => {
-    //         console.error(error)
-    //         reject(error)
-    //       })
-    //   })
-    // },
-    // 发送请求
-    // getFaceRecognition(params) {
-    //   console.log('🚀 ~ getFaceRecognition ~ params:', params)
-    //   this.$verificationToken()
-    //   uni.request({
-    //     url: config.baseUrl + '/exam-student/personalCenter/getFaceRecognition',
-    //     method: 'POST',
-    //     header: {
-    //       'content-type': 'application/json',
-    //       Authorization: uni.getStorageSync('access_token')
-    //     },
-    //     data: params,
-    //     success: res => {
-    //       console.log('🚀 ~ openFaceScan ~ res-人脸识别:', res)
-    //       res = res.data
-    //       console.log('🚀 ~ openFaceScan ~ res-人脸识别:', res.code)
-    //       if (res.code == 200) {
-    //         this.$refs.uToast.show({
-    //           message: '人脸识别成功',
-    //           duration: 1000
-    //         })
-    //         this.failCount = 3
-    //         // 继续计时
-    //         this.$refs.countDown.start()
-    //       } else {
-    //         this.failCount--
-    //         if (this.failCount == 0) {
-    //           this.$refs.uToast.show({
-    //             message: '人脸识别失败, 即将结束考试',
-    //             duration: 1500
-    //           })
-    //           setTimeout(() => {
-    //             this.handleConfirmSubmit()
-    //           }, 1000)
-    //         } else {
-    //           this.$refs.uToast.show({
-    //             message: '人脸识别失败, 请重新录入, 剩余次数: ' + this.failCount + '次',
-    //             duration: 1500
-    //           })
-    //           setTimeout(() => {
-    //             this.openPhotograph()
-    //           }, 1700)
-    //         }
-    //       }
-    //     },
-    //     fail(err) {
-    //       console.log('🚀 ~ openFaceScan ~ 人脸识别失败', err)
-    //       this.$refs.uToast.show({
-    //         message: err.errMsg,
-    //         duration: 1000
-    //       })
-    //     }
-    //   })
-    // },
     clickImg(url) {
       this.isHide = true
       uni.previewImage({
@@ -630,6 +480,7 @@ export default {
       this.startX = event.touches[0].clientX
       this.startY = event.touches[0].clientY
       console.log('🚀 ~ touchStart ~ this.startX:', this.startX)
+      console.log('🚀 ~ touchStart ~ this.startY:', this.startY)
     },
     touchMove(event) {
       console.log('🚀 ~ 移动 ~ event:', event)
@@ -637,6 +488,7 @@ export default {
       this.endX = event.touches[0].clientX
       this.endY = event.touches[0].clientY
       console.log('🚀 ~ touchMove ~ this.endX:', this.endX)
+      console.log('🚀 ~ touchMove ~ this.endY:', this.endY)
     },
     touchEnd() {
       // 判断滑动方向
@@ -686,6 +538,7 @@ export default {
   height: 90vh;
 
   .top-content {
+    margin: 10px;
     background: #fff;
     padding: 10px;
     border-radius: 5px;
@@ -749,15 +602,13 @@ export default {
   .question-wrapper {
     padding: 10px;
     .question-type-wrapper {
-      margin: 20px 0;
+      margin: 20px 0 10px;
       display: flex;
       justify-content: flex-start;
       align-items: center;
 
       .line {
-        width: 2px;
+        border: 2px solid #1989fa;
-        height: 11px;
-        background: #1989fa;
         margin-right: 3px;
       }
       .question-type {
@@ -766,13 +617,13 @@ export default {
     }
 
     .question {
+      margin-bottom: 8px;
       font-weight: 800;
       color: #333333;
     }
   }
   .options {
-    margin-top: 10px;
+    margin: 5px 0 30px 20px;
-    margin-bottom: 30px;
     overflow: auto;
     .option-wrapper {
       max-height: 200px;
@@ -797,7 +648,7 @@ export default {
           color: #333;
         }
         .option-content {
-          margin-left: 10px;
+          /* margin-left: 10px; */
           color: #333;
         }
       }
@@ -810,13 +661,19 @@ export default {
     width: 100%;
     background-color: #fff;
     padding: 15px 0;
+    padding-bottom: 18px;
     display: flex;
-    justify-content: flex-end;
+    justify-content: space-between;
     align-items: center;
 
     .btn {
       width: 100px;
-      margin-right: 10px;
+      &:first-child {
+        margin-left: 15px;
+      }
+      &:last-child {
+        margin-right: 15px;
+      }
     }
   }
 }

pages/YNEduApp/exam/examinationDetails.vue

@@ -63,7 +63,7 @@
         />
       </div> -->
       <div class="btn">
-        <u-button type="primary" size="small" shape="circle" text="重新考试" @click="handleResetExamination" />
+        <u-button type="primary" shape="circle" text="重新考试" @click="handleResetExamination" />
       </div>
     </div>
   </view>
@@ -274,7 +274,7 @@ export default {
   .center-container {
     margin: 0 10px;
     width: calc(100% - 20px);
-    height: 250px;
+    height: 275px;
     background: #e8f2fe;
     border-radius: 20px;
     display: flex;
@@ -287,7 +287,7 @@ export default {
       flex-wrap: wrap;
       justify-content: space-around;
       align-items: center;
-      margin: 0 10px;
+      margin: 30px 10px 10px;
 
       .item {
         margin-top: 25px;

pages/YNEduApp/learnProj/learnProjDetail.vue

@@ -289,6 +289,7 @@ export default {
         return
       }
       const params = {
+        ...item,
         id: item.examMsg.id, // 考试id
         cutNum: item.examMsg.isCut, // 切屏次数
         examNum: item.examMsg.examNum, // 考试次数
@@ -297,7 +298,9 @@ export default {
         studyId: this.studyId, // 学习id
         responseTime: item.examMsg.responseTime, // 考试时长
         score: item.examMsg.score, // 总分
-        passScore: item.examMsg.passScore // 及格分数
+        passScore: item.examMsg.passScore, // 及格分数
+        name: item.examMsg.name, // 考试名称
+        validityDate: item.examMsg.validityDate // 考试时间
       }
       console.log('🚀 ~ toggleTheoryExam ~ params:', params)
       uni.navigateTo({