部分代码调整

.env.development

@@ -4,6 +4,7 @@ VITE_APP_SETTING = true
 VITE_APP_TITLE = InsomniaCognitionH5
 # 接口请求地址，会设置到 axios 的 baseURL 参数上
 VITE_APP_API_BASE_URL = https://byly.jue-ming.com:8112/
+# VITE_APP_API_BASE_URL = http://192.168.1.4:8112/
 # 调试工具，可设置 eruda 或 vconsole，如果不需要开启则留空
 VITE_APP_DEBUG_TOOL =
 

src/components/CountDown/index.vue

@@ -5,6 +5,8 @@
    * 创建日期: 2024/8/16
    * 编写者: JutarryWu
    */
+import { formatSeconds } from '@/utils'
+
 const props = defineProps({
   time: {
     type: Number,
@@ -22,6 +24,10 @@ const props = defineProps({
     type: Number,
     default: 36,
   },
+  isFormat: {
+    type: Boolean,
+    default: false,
+  },
 })
 const emit = defineEmits(['endCountDown'])
 const countTimer = ref<ReturnType<typeof setInterval> | null>(null)
@@ -35,7 +41,7 @@ async function exec() {
   countDownStr.value = props.text
 
   countTimer.value = setInterval(() => {
-    countDownStr.value = `${secondNum.value}`
+    countDownStr.value = props.isFormat ? formatSeconds(secondNum.value * 1000) : `${secondNum.value}`
     showSpan.value = true
     secondNum.value--
     if (secondNum.value < 0) {
@@ -64,7 +70,7 @@ onBeforeUnmount(() => {
     class="van-count-down-container absolute-center h-[45px] w-[90%] translate-[-50%] text-center align-bottom"
     :style="{ color, fontSize: `${size}px` }"
   >
-    {{ countDownStr }}<span v-if="showSpan" class="ml-[4px] mt-[8px] text-[28px]">s</span>
+    {{ countDownStr }}<span v-if="showSpan && !isFormat" class="ml-[4px] mt-[8px] text-[28px]">s</span>
   </section>
 </template>
 

src/utils/index.ts

@@ -52,13 +52,13 @@ function formatSeconds(fmtSeconds: number): string {
 
   if (hours === 0) {
     if (hours === 0 && minutes === 0) {
-      return `${seconds.toString().padStart(2, '0')}秒`
+      return `${seconds.toString()}秒`
     }
     else {
-      return `${minutes.toString().padStart(2, '0')}分 ${seconds.toString().padStart(2, '0')}秒`
+      return `${minutes.toString()}分 ${seconds.toString().padStart(2, '0')}秒`
     }
   }
-  return `${hours.toString().padStart(2, '0')}时 ${minutes.toString().padStart(2, '0')}分 ${seconds.toString().padStart(2, '0')}秒`
+  return `${hours.toString()}时 ${minutes.toString().padStart(2, '0')}分 ${seconds.toString().padStart(2, '0')}秒`
 }
 
 function isAndroidOrIos(): 'android' | 'ios' | 'unknown' {

src/views/cognitiveTasks/BreadthTraining/components/BTRandomPentagram.vue

@@ -35,7 +35,7 @@ const starHeight = 30
 // 游戏面板宽度
 const gameWidth = ref(350)
 // 游戏面板高度
-const gameHeight = ref(500)
+const gameHeight = ref(450)
 
 const pentagramList = ref<pentagram[]>([])
 

src/views/cognitiveTasks/BreadthTraining/index.vue

@@ -41,6 +41,10 @@ const mainData: IMainData = reactive({
   dataList: [],
 })
 
+const percentage = computed(() => {
+  return Math.round((currentIndex.value / mainData.dataList.length) * 100)
+})
+
 // 当前进度
 // const percentage = computed(() => {
 //   return Math.round((currentIndex.value / mainData.dataList.length) * 100)
@@ -181,7 +185,7 @@ function reOverFn() {
   }, 320)
   setTimeout(() => {
     changeShow.value = false
-  }, 2000)
+  }, 3320)
 }
 
 const showCountDown = ref(false) // 显示倒计时
@@ -254,6 +258,7 @@ onMounted(() => {
     <count-down v-if="showCountDown" :time="5" color="#fff" @end-count-down="exec" />
 
     <div v-else class="breadth-training-container w-full flex flex-col items-center gap-y-[15px]">
+      <van-progress :pivot-text="`${percentage}%`" color="#ffc400" :percentage="percentage" class="mt-[20px] w-[90%]" />
       <BTRandomPentagram
         ref="BTRandomPentagramRef"
         :count="mainData.dataList[currentIndex]?.count"

src/views/cognitiveTasks/ContinueAddition/index.vue

@@ -26,8 +26,8 @@ const wrongTwo = ref(0)
 const additionNumCount = ref(2)
 // 统计每个层级答对个数
 const rightCountList: Result[] = reactive([])
-// 测试时长 100 秒
-const gameDuration = ref(100 * 1000)
+// 测试时长 300 秒
+const gameDuration = ref(300)
 // 游戏结束时间戳
 const gameEndTime = ref(0)
 // 游戏开始时间戳
@@ -71,10 +71,10 @@ function createComputeSpanText() {
 }
 
 function userClick(answer: number) {
-  // 如果游戏时长大于或等于 100 秒，则游戏结束
+  // 如果游戏时长大于或等于 300 秒，则游戏结束
   gameEndTime.value = performance.now()
   const duration = gameEndTime.value - gameStartTime.value
-  if (duration >= gameDuration.value) {
+  if (duration >= gameDuration.value * 1000) {
     // 游戏结束，发送数据
     sendData()
     return
@@ -135,6 +135,9 @@ function sendData() {
     return acc
   }, 0)
 
+  gameData.gameId = subjectInfo.value.id
+  gameData.gameName = subjectInfo.value.name
+
   gameData.levelList = rightCountList.map((item) => {
     return {
       level: item.name,
@@ -180,49 +183,67 @@ onMounted(() => {
   <section class="app-container">
     <van-nav-bar class="self-nav-bar" :title="subjectInfo.name" left-arrow @click-left="router.go(-1)" />
     <count-down v-if="showCountDown" :time="5" color="white" @end-count-down="endCountDown" />
-    <div v-else style="" class="w-[90%] mx-auto mt-[15px] p-[15px] border-6 border-white border-solid rounded-[8px] bg-[#425363]">
-      <div class="h-[80px] flex flex-row justify-center items-center bg-[#D2E2F1] rounded-[8px]">
-        <span class="text-[40px] text-[#222222]">{{ showSpanText }}</span>
+    <div v-else style="" class="mx-auto mt-[15px] w-[90%] border-6 border-white rounded-[8px] border-solid bg-[#425363] p-[15px]">
+      <div class="h-[80px] flex flex-row items-center justify-center rounded-[8px] bg-[#D2E2F1]">
+        <span
+          class="text-[#222222]"
+          :class="{
+            'text-[40px]': showSpanText.length <= 11,
+            'text-[36px]': showSpanText.length === 12,
+            'text-[34px]': showSpanText.length === 13,
+            'text-[32px]': [14, 15].includes(showSpanText.length),
+            'text-[30px]': [16, 17].includes(showSpanText.length),
+            'text-[27px]': [18, 19].includes(showSpanText.length),
+            'text-[24px]': [20, 21].includes(showSpanText.length),
+            'text-[21px]': [22, 23].includes(showSpanText.length),
+            'text-[19px]': [24, 25].includes(showSpanText.length),
+          }"
+        >
+          {{ showSpanText }}
+        </span>
       </div>
-      <div class="flex flex-row justify-between mt-[24px]">
-        <div class="w-[72px] h-[72px] flex flex-row justify-center items-center bg-white rounded-[8px]" @click="userClick(1)">
+      <div class="mt-[24px] flex flex-row justify-between">
+        <div class="h-[72px] w-[72px] flex flex-row items-center justify-center rounded-[8px] bg-white" @click="userClick(1)">
           <span class="text-[32px] text-[#222222]">1</span>
         </div>
-        <div class="w-[72px] h-[72px] flex flex-row justify-center items-center bg-white rounded-[8px]" @click="userClick(2)">
+        <div class="h-[72px] w-[72px] flex flex-row items-center justify-center rounded-[8px] bg-white" @click="userClick(2)">
           <span class="text-[32px] text-[#222222]">2</span>
         </div>
-        <div class="w-[72px] h-[72px] flex flex-row justify-center items-center bg-white rounded-[8px]" @click="userClick(3)">
+        <div class="h-[72px] w-[72px] flex flex-row items-center justify-center rounded-[8px] bg-white" @click="userClick(3)">
           <span class="text-[32px] text-[#222222]">3</span>
         </div>
       </div>
-      <div class="flex flex-row justify-between mt-[24px]">
-        <div class="w-[72px] h-[72px] flex flex-row justify-center items-center bg-white rounded-[8px]" @click="userClick(4)">
+      <div class="mt-[24px] flex flex-row justify-between">
+        <div class="h-[72px] w-[72px] flex flex-row items-center justify-center rounded-[8px] bg-white" @click="userClick(4)">
           <span class="text-[32px] text-[#222222]">4</span>
         </div>
-        <div class="w-[72px] h-[72px] flex flex-row justify-center items-center bg-white rounded-[8px]" @click="userClick(5)">
+        <div class="h-[72px] w-[72px] flex flex-row items-center justify-center rounded-[8px] bg-white" @click="userClick(5)">
           <span class="text-[32px] text-[#222222]">5</span>
         </div>
-        <div class="w-[72px] h-[72px] flex flex-row justify-center items-center bg-white rounded-[8px]" @click="userClick(6)">
+        <div class="h-[72px] w-[72px] flex flex-row items-center justify-center rounded-[8px] bg-white" @click="userClick(6)">
           <span class="text-[32px] text-[#222222]">6</span>
         </div>
       </div>
-      <div class="flex flex-row justify-between mt-[24px]">
-        <div class="w-[72px] h-[72px] flex flex-row justify-center items-center bg-white rounded-[8px]" @click="userClick(7)">
+      <div class="mt-[24px] flex flex-row justify-between">
+        <div class="h-[72px] w-[72px] flex flex-row items-center justify-center rounded-[8px] bg-white" @click="userClick(7)">
           <span class="text-[32px] text-[#222222]">7</span>
         </div>
-        <div class="w-[72px] h-[72px] flex flex-row justify-center items-center bg-white rounded-[8px]" @click="userClick(8)">
+        <div class="h-[72px] w-[72px] flex flex-row items-center justify-center rounded-[8px] bg-white" @click="userClick(8)">
           <span class="text-[32px] text-[#222222]">8</span>
         </div>
-        <div class="w-[72px] h-[72px] flex flex-row justify-center items-center bg-white rounded-[8px]" @click="userClick(9)">
+        <div class="h-[72px] w-[72px] flex flex-row items-center justify-center rounded-[8px] bg-white" @click="userClick(9)">
           <span class="text-[32px] text-[#222222]">9</span>
         </div>
       </div>
-      <div class="flex flex-row justify-center mt-[24px]">
-        <div class="w-[72px] h-[72px] flex flex-row justify-center items-center bg-white rounded-[8px]" @click="userClick(0)">
+      <div class="mt-[24px] flex flex-row justify-center">
+        <div class="h-[72px] w-[72px] flex flex-row items-center justify-center rounded-[8px] bg-white" @click="userClick(0)">
           <span class="text-[32px] text-[#222222]">0</span>
         </div>
       </div>
     </div>
+    <div class="absolute bottom-[16px] left-[50%] h-[45px] w-[200px] translate-x-[-50%]">
+      <count-down v-if="!showCountDown" text="" is-format :time="gameDuration" :size="32" color="white" @end-count-down="userClick(0)" />
+    </div>
   </section>
 </template>
 

src/views/cognitiveTasks/spatialOrientationAbility/index.vue

@@ -43,8 +43,8 @@ const showCountDownBottom = ref(false) // 显示底部倒计时
 const showSubmit = ref(false) // 显示画布
 const isSubmit = ref(false) // 是否提交进程中
 
-const levelNum = [3, 4, 5] // 正式测试：3个难度等级需要呈现的刺激目标数
-const tryCount = 1 // 正式测试：每个难度等级需要进行的试次数
+const levelNum = [3, 4] // 正式测试：3个难度等级需要呈现的刺激目标数
+const tryCount = 2 // 正式测试：每个难度等级需要进行的试次数
 const currentIndex = ref(0) // 当前试次索引值：练习模式2次最大为1， 正式测试45次
 const itemAngle = ref(0) // 选项物品实际角度
 const roundSliderVal = ref(0) // 圆形滑杆产生的值（即：用户操作实际角度）