|
@@ -1,6 +1,58 @@
|
|
|
<template>
|
|
|
<section class="auditory-recognition-container flex-center flex-col wh-full relative">
|
|
|
<water-title title="词图匹配" />
|
|
|
+ <div v-if="isMainWin" class="text-[42px] text-[#0F308C]">
|
|
|
+ {{ Topics.question }}
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div v-if="!isMainWin && showTopics" class="flex-center flex-col text-100px text-[#0F308C]">
|
|
|
+ {{ TopicsVal[currentIndex].correct }}
|
|
|
+ </div>
|
|
|
+ <div class="w-80% h-60% my-30px flex-center flex-col">
|
|
|
+ <template v-if="showTopics">
|
|
|
+ <el-image
|
|
|
+ v-if="isMainWin"
|
|
|
+ src="/static/image/cognitiveAbility/SpeechTraining/Auditory/play.png"
|
|
|
+ fit="contain"
|
|
|
+ class="w-[300px] h-[160px] mb-40px cursor-pointer hover:scale-101"
|
|
|
+ @click="handlePlay"
|
|
|
+ />
|
|
|
+ <div class="w-full flex flex-row justify-between">
|
|
|
+ <div v-for="(item, index) in TopicsVal[currentIndex].choices" :key="index" class="flex flex-col items-center">
|
|
|
+ <div
|
|
|
+ class="w-360px h-180px flex-center rounded-58px text-96px cursor-pointer bg-[#F9F9F9] border-[#E7E7E7] border-1px text-[#0F308C]"
|
|
|
+ @click="handleItemClick(item, index)"
|
|
|
+ >
|
|
|
+ <div v-if="isMainWin">{{ item }}</div>
|
|
|
+ <div v-else>{{ index + 1 }}</div>
|
|
|
+ </div>
|
|
|
+ <el-image
|
|
|
+ :src="`/static/image/cognitiveAbility/SpeechTraining/${useClickIndex === index || item === TopicsVal[currentIndex].userAnswer ? 'Options-right' : 'Options-Blank'}.png`"
|
|
|
+ fit="contain"
|
|
|
+ class="w-[120px] h-[120px] cursor-pointer mt-30px"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div v-if="!isMainWin" class="w-[300px] h-[140px]">
|
|
|
+ <el-image
|
|
|
+ v-if="showSubmitBtn"
|
|
|
+ src="/static/image/cognitiveAbility/SpeechTraining/verify-bg.png"
|
|
|
+ fit="contain"
|
|
|
+ class="w-[300px] h-[140px] cursor-pointer hover:scale-101"
|
|
|
+ @click="handleSubmit"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-image
|
|
|
+ v-if="showNextBtn"
|
|
|
+ src="/static/image/cognitiveAbility/SpeechTraining/next.png"
|
|
|
+ fit="contain"
|
|
|
+ class="!absolute bottom-[24px] right-[140px] w-[300px] h-[140px] cursor-pointer hover:scale-101"
|
|
|
+ @click="handleNext()"
|
|
|
+ />
|
|
|
|
|
|
<VoiceImp ref="VoiceImpRef" />
|
|
|
</section>
|
|
@@ -10,7 +62,7 @@
|
|
|
/*
|
|
|
* 组件名: CATAuditoryTrainingWordImgMatching
|
|
|
* 组件用途: 常规听康复训练 - 词图匹配
|
|
|
- * 创建日期: 2024/11/14
|
|
|
+ * 创建日期: 2024/11/12
|
|
|
* 编写者: JutarryWu
|
|
|
*/
|
|
|
|
|
@@ -24,7 +76,6 @@ defineOptions({
|
|
|
import Topics from './topics.json'
|
|
|
|
|
|
interface TopicsType {
|
|
|
- question: string
|
|
|
choices: string[]
|
|
|
correct: string
|
|
|
userAnswer: string
|
|
@@ -68,6 +119,7 @@ const handlePlay = () => {
|
|
|
const handleItemClick = (item: string, index: number) => {
|
|
|
if (isSubmitting) return // 如果再提交进程中,不响应点击事件
|
|
|
if (!isMainWin.value) {
|
|
|
+ VoiceImpRef.value.videoPlay()
|
|
|
TopicsVal.value[currentIndex.value].userAnswer = item
|
|
|
useClickIndex.value = index
|
|
|
showSubmitBtn.value = true
|
|
@@ -90,20 +142,22 @@ const handleSubmit = () => {
|
|
|
async function exec() {
|
|
|
isMainWin.value = window.location.href.includes('win=main')
|
|
|
if (isMainWin.value) {
|
|
|
- // TopicsVal.value = Topics.map((item) => {
|
|
|
- // item.choices = item.choices.sort(() => Math.random() - 0.5)
|
|
|
- // return item
|
|
|
- // })
|
|
|
- // localStorage.setItem('two-win-auditory-recognition-init-data', JSON.stringify(TopicsVal.value))
|
|
|
- // setTimeout(() => {
|
|
|
- // showNextBtn.value = true
|
|
|
- // }, 6600)
|
|
|
+ TopicsVal.value = Topics.topics
|
|
|
+ .map((item) => {
|
|
|
+ item.choices = item.choices.sort(() => Math.random() - 0.5)
|
|
|
+ return item
|
|
|
+ })
|
|
|
+ .sort(() => Math.random() - 0.5)
|
|
|
+ localStorage.setItem('two-win-auditory-recognition-init-data', JSON.stringify(TopicsVal.value))
|
|
|
+ setTimeout(() => {
|
|
|
+ showNextBtn.value = true
|
|
|
+ }, 6600)
|
|
|
} else {
|
|
|
taskBeginTime = Date.now()
|
|
|
- // VoiceImpRef.value.videoPlay(
|
|
|
- // 'Speech-Auditory',
|
|
|
- // 'static/voice/cognitiveAbility/SpeechTraining/Auditory/Recognition/1.mp3'
|
|
|
- // )
|
|
|
+ VoiceImpRef.value.videoPlay(
|
|
|
+ 'Speech-Auditory',
|
|
|
+ 'static/voice/cognitiveAbility/SpeechTraining/Auditory/Recognition/1.mp3'
|
|
|
+ )
|
|
|
}
|
|
|
}
|
|
|
|
|
@@ -149,7 +203,10 @@ onMounted(() => {
|
|
|
isSubmitting = true
|
|
|
emits('gameOver', {
|
|
|
min: formatSeconds(Date.now() - taskBeginTime),
|
|
|
- content: JSON.stringify(TopicsVal.value),
|
|
|
+ content: JSON.stringify({
|
|
|
+ question: Topics.question,
|
|
|
+ topics: TopicsVal.value
|
|
|
+ }),
|
|
|
score: TopicsVal.value.filter((item) => item.userAnswer === item.correct).length + ''
|
|
|
})
|
|
|
localStorage.removeItem('tow-win-auditory-recognition-isSubmitting')
|
|
@@ -159,7 +216,4 @@ onMounted(() => {
|
|
|
})
|
|
|
</script>
|
|
|
|
|
|
-<style scoped lang="scss">
|
|
|
-.auditory-recognition-container {
|
|
|
-}
|
|
|
-</style>
|
|
|
+<style scoped lang="scss"></style>
|