|
@@ -14,7 +14,7 @@
|
|
|
</div>
|
|
|
<div
|
|
|
id="myButton"
|
|
|
- class="divMain absolute left-[165px] top-[305px] flex flex-wrap flex-row gap-x-[20px] mt-[50px] w-[1100px]"
|
|
|
+ class="divMain absolute left-[165px] top-[305px] flex flex-wrap flex-row gap-x-[20px] mt-[50px] w-[1100px] h-[300px]"
|
|
|
:class="checkItems && checkItems.length < 3 ? 'flex-center' : ''"
|
|
|
>
|
|
|
<div v-for="(it, index) in checkItems" :key="it">
|
|
@@ -22,12 +22,19 @@
|
|
|
<!-- <div class="w-[450px] sab ml-[115px] mt-[30px] flex flex-wrap flex-row justify-between">-->
|
|
|
<div
|
|
|
class="bg-[#000] w-[120px] h-[120px] flex-center"
|
|
|
- :class="[it.active ? 'active' : 'normal']"
|
|
|
- @click="checkItemFn(it, index)"
|
|
|
+ :class="[index === flagFlag ? 'active' : 'normal']"
|
|
|
+ @click="checkItemFn(it, isMainWin ? 1 : 0)"
|
|
|
></div>
|
|
|
<span class="color-[#000] fw-700 line-height-[155px]">{{ chengList[index] }}.</span
|
|
|
- ><span class="color-[#333333] line-height-[155px] fw-700 mr-[60px]"> {{ it.name }}</span>
|
|
|
+ ><span class="color-[#333333] line-height-[155px] fw-700 mr-[60px]"> {{ it }}</span>
|
|
|
</div>
|
|
|
+ <el-image
|
|
|
+ v-if="confirmation"
|
|
|
+ src="/static/image/cognitiveAbility/SpeechTraining/next.png"
|
|
|
+ fit="contain"
|
|
|
+ class="!absolute w-[290px] h-[90px] bottom-[-170px] left-[390px] cursor-pointer hover:scale-101"
|
|
|
+ @click="handleClick(it, index, isMainWin ? 1 : 0)"
|
|
|
+ />
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -47,24 +54,27 @@
|
|
|
</div>
|
|
|
<div
|
|
|
id="myButton"
|
|
|
- class="divMain absolute left-[165px] top-[305px] flex flex-wrap flex-row gap-x-[20px] mt-[50px] w-[1100px]"
|
|
|
+ class="divMain absolute left-[165px] top-[305px] flex flex-wrap flex-row gap-x-[20px] mt-[50px] w-[1100px] h-[300px]"
|
|
|
:class="checkItems && checkItems.length < 3 ? 'flex-center' : ''"
|
|
|
>
|
|
|
<div v-for="(it, index) in checkItems" :key="it">
|
|
|
- <div class="text-[80px] w-[350px] flex flex-wrap flex-row justify-between">
|
|
|
+ <div class="text-[80px] w-[350px] h-[150px] flex flex-wrap flex-row justify-between">
|
|
|
<!-- <div class="w-[450px] sab ml-[115px] mt-[30px] flex flex-wrap flex-row justify-between">-->
|
|
|
<div
|
|
|
class="bg-[#000] w-[120px] h-[120px] flex-center"
|
|
|
- :class="[it.active ? 'active' : 'normal']"
|
|
|
+ :class="[index === flagFlag ? 'active' : 'normal']"
|
|
|
@click="checkItemFn(it, isMainWin ? 1 : 0)"
|
|
|
></div>
|
|
|
<span class="color-[#000] fw-700 line-height-[155px]">{{ chengList[index] }}.</span
|
|
|
- ><span class="color-[#333333] line-height-[155px] fw-700 mr-[60px]"> {{ it.name }}</span>
|
|
|
+ ><span class="color-[#333333] line-height-[155px] fw-700 mr-[60px]"> {{ it }}</span>
|
|
|
</div>
|
|
|
- <div
|
|
|
- class="question-imgStart w-[290px] h-[90px] text-[186px] absolute bottom-[-170px] left-[405px]"
|
|
|
- @click="handleClick(it, index)"
|
|
|
- ></div>
|
|
|
+ <el-image
|
|
|
+ v-if="!confirmation"
|
|
|
+ src="/static/image/cognitiveAbility/SpeechTraining/verify-bg.png"
|
|
|
+ fit="contain"
|
|
|
+ class="!absolute w-[290px] h-[90px] bottom-[-170px] left-[390px] cursor-pointer hover:scale-101"
|
|
|
+ @click="handleClick(it, index, isMainWin ? 1 : 0)"
|
|
|
+ />
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -96,12 +106,12 @@ interface LevelData {
|
|
|
}
|
|
|
interface OnceItem {
|
|
|
question: string
|
|
|
- active: boolean
|
|
|
- questions: string[]
|
|
|
choices: string[]
|
|
|
answer: string
|
|
|
+ correct: string
|
|
|
+ userAnswer: string
|
|
|
}
|
|
|
-const gameData = ref(Topics as OnceItem[][])
|
|
|
+const gameData = ref(Topics as OnceItem[])
|
|
|
// 当前游戏等级
|
|
|
let currentLevel = 0
|
|
|
// 得分列表
|
|
@@ -118,11 +128,11 @@ let gameStartTime_record = 0
|
|
|
// 游戏结束时间
|
|
|
let gameEndTime = 0
|
|
|
// 最大游戏等级 6
|
|
|
-const maxLevel = 2
|
|
|
+const maxLevel = 0
|
|
|
// 当前试次
|
|
|
let currentNumber = 0
|
|
|
// 每个等级的最大试次 15
|
|
|
-const maxNumber = 3
|
|
|
+const maxNumber = 2
|
|
|
let timerId: any
|
|
|
const $emits = defineEmits(['close'])
|
|
|
const openDialogRef = ref()
|
|
@@ -138,86 +148,70 @@ const userStore = useUserStore()
|
|
|
// 当前试次的游戏图片数据
|
|
|
const onceData = ref({} as OnceItem)
|
|
|
const checkItems = ref([])
|
|
|
-const handleClick = (answer: string) => {
|
|
|
- console.log(answer, '用户操作数据')
|
|
|
- const correct = false
|
|
|
- // const correct = onceData.value.answer === answer
|
|
|
- // VoiceImpRef.value.videoPlay('click')
|
|
|
- // setTimeout(() => {
|
|
|
- // if (correct) {
|
|
|
- // console.log(VoiceImpRef.value, 'hbbbbbbbbbbbbbbbbbbbbbbbbbdf=============>')
|
|
|
- // if (VoiceImpRef.value) {
|
|
|
- // VoiceImpRef.value.videoPlay('right')
|
|
|
- // }
|
|
|
- // } else {
|
|
|
- // if (VoiceImpRef.value) {
|
|
|
- // VoiceImpRef.value.videoPlay('error')
|
|
|
- // }
|
|
|
- // }
|
|
|
- // }, 200)
|
|
|
- // 收集当前试次的用户操作数据
|
|
|
- gameList.push({
|
|
|
- level: currentLevel,
|
|
|
- correct: correct,
|
|
|
- score: correct ? scoreList[currentLevel] : 0,
|
|
|
- responseEndTime: performance.now(),
|
|
|
- responseStartTime: responseStartTime
|
|
|
- })
|
|
|
- console.log(gameList)
|
|
|
+const sumbitData = ref([])
|
|
|
|
|
|
+const confirmation = ref(false)
|
|
|
+const flagFlag = ref(-1) //选中标志
|
|
|
+const handleClick = (answer: string, index, flag) => {
|
|
|
// 开始下一次
|
|
|
- nextOnce()
|
|
|
+ if (flag === 1) {
|
|
|
+ nextOnce()
|
|
|
+ confirmation.value = false
|
|
|
+ flagFlag.value = -1
|
|
|
+ localStorage.setItem('two-win-Visual-item-confirmation', 'false')
|
|
|
+ localStorage.setItem('two-win-Visual-item-next', 'true')
|
|
|
+ } else {
|
|
|
+ console.log(answer, '用户操作数据', index, flag)
|
|
|
+ const correct = false
|
|
|
+ confirmation.value = true
|
|
|
+ flagFlag.value = -1
|
|
|
+ localStorage.setItem('two-win-Visual-item-confirmation', 'true')
|
|
|
+ // const correct = onceData.value.answer === answer
|
|
|
+ // VoiceImpRef.value.videoPlay('click')
|
|
|
+ // setTimeout(() => {
|
|
|
+ // if (correct) {
|
|
|
+ // console.log(VoiceImpRef.value, 'hbbbbbbbbbbbbbbbbbbbbbbbbbdf=============>')
|
|
|
+ // if (VoiceImpRef.value) {
|
|
|
+ // VoiceImpRef.value.videoPlay('right')
|
|
|
+ // }
|
|
|
+ // } else {
|
|
|
+ // if (VoiceImpRef.value) {
|
|
|
+ // VoiceImpRef.value.videoPlay('error')
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // }, 200)
|
|
|
+ console.log(onceData.value, 'onceData.value')
|
|
|
+ let params = {
|
|
|
+ question: '接下来会给你听一些声音,请在这些声音中选择出屏幕中呈现的词语',
|
|
|
+ choices: ['雷电', '狗叫', '葡萄'],
|
|
|
+ correct: '葡萄',
|
|
|
+ userAnswer: ''
|
|
|
+ }
|
|
|
+ // 收集当前试次的用户操作数据
|
|
|
+ gameList.push(params)
|
|
|
+ console.log(gameList)
|
|
|
+ localStorage.setItem('two-win-Visual-item-submitList', JSON.stringify(gameList))
|
|
|
+ }
|
|
|
}
|
|
|
const checkItemFn = (item: any, flag: number = 0) => {
|
|
|
// if (modeSelect.value === 0) {
|
|
|
console.log(item, '参数')
|
|
|
if (flag === 1) return
|
|
|
+ confirmation.value = false
|
|
|
let tempIndex = -1
|
|
|
+ console.log()
|
|
|
checkItems.value.forEach((item2, index) => {
|
|
|
- item2.active = false
|
|
|
- if (item2.name === item.name) tempIndex = index
|
|
|
+ if (item2 === item) tempIndex = index
|
|
|
})
|
|
|
- checkItems.value[tempIndex].active = true
|
|
|
+ flagFlag.value = tempIndex
|
|
|
if (!isMainWin.value) {
|
|
|
- console.log('本地存储', item)
|
|
|
localStorage.setItem('two-win-Visual-item-List', JSON.stringify(item))
|
|
|
+ localStorage.setItem('two-win-Visual-item-confirmation', 'false')
|
|
|
}
|
|
|
}
|
|
|
const nextOnce = () => {
|
|
|
- // console.log(onceData.value.choices, 'onceData392')
|
|
|
gameEndTime = performance.now()
|
|
|
const gameDuration = gameEndTime - gameStartTime
|
|
|
- console.log(gameDuration, 'gameDuration')
|
|
|
- console.log(gameEndTime, 'gameEndTime')
|
|
|
- console.log(gameStartTime, 'gameStartTime')
|
|
|
- const currentLevelList = gameList.filter((it) => it.level === currentLevel)
|
|
|
- // 当前等级进行 10 个试次以上时,计算正确率
|
|
|
- if (currentLevelList.length >= 3) {
|
|
|
- // 当前等级正确试次个数
|
|
|
- const count = currentLevelList.reduce((acc, curr) => {
|
|
|
- if (curr.correct) {
|
|
|
- acc++
|
|
|
- }
|
|
|
- return acc
|
|
|
- }, 0)
|
|
|
- // 当前等级正确率
|
|
|
- const accuracy = (count / currentLevelList.length) * 100
|
|
|
- // 升降级规则:正确率达到80%难度升级,低于40%降级
|
|
|
- if (accuracy >= 80) {
|
|
|
- if (currentLevel < maxLevel) {
|
|
|
- currentLevel++
|
|
|
- // 删除升级之后的已有数据
|
|
|
- gameList = gameList.filter((it) => it.level !== currentLevel)
|
|
|
- // 重置当前等级试次索引
|
|
|
- currentNumber = 0
|
|
|
- console.log('80%难度升级')
|
|
|
- }
|
|
|
- } else if (accuracy < 40) {
|
|
|
- sendData()
|
|
|
- return
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
// 如果当前等级的试次小于最大试次,则试次加一,否则应该进入下一等级
|
|
|
if (currentNumber < maxNumber) {
|
|
|
currentNumber++
|
|
@@ -232,6 +226,7 @@ const nextOnce = () => {
|
|
|
} else {
|
|
|
// 游戏结束
|
|
|
console.log('游戏结束2')
|
|
|
+ console.log(gameList, '用户操作总数据')
|
|
|
sendData()
|
|
|
return
|
|
|
}
|
|
@@ -242,6 +237,7 @@ const nextOnce = () => {
|
|
|
}
|
|
|
// 发送请求
|
|
|
const sendData = () => {
|
|
|
+ console.log(sumbitData.value, '用户操作总数据主屏')
|
|
|
if (planInfo.value) {
|
|
|
// 计算正确反应数和总反应时
|
|
|
let { correctCount, totalResponseTime, totalScore } = gameList.reduce(
|
|
@@ -266,40 +262,40 @@ const sendData = () => {
|
|
|
|
|
|
const { gameId, gameName, id: planId } = planInfo.value
|
|
|
const data = {
|
|
|
- finish: '1',
|
|
|
- gameId,
|
|
|
- gameName,
|
|
|
- paramList: [
|
|
|
- {
|
|
|
- code: 'score',
|
|
|
- name: '得分',
|
|
|
- value: totalScore
|
|
|
- },
|
|
|
- {
|
|
|
- code: 'correctCount',
|
|
|
- name: '正确反应数',
|
|
|
- value: correctCount
|
|
|
- },
|
|
|
- {
|
|
|
- code: 'avrResponseTime',
|
|
|
- name: '平均反应时',
|
|
|
- value: avrResponseTime
|
|
|
- },
|
|
|
- {
|
|
|
- code: 'avrResponseTime',
|
|
|
- name: '最大难度',
|
|
|
- value: currentLevel + 1
|
|
|
- },
|
|
|
- {
|
|
|
- code: 'gameTotalTime',
|
|
|
- name: '游戏总时长',
|
|
|
- value: Date.now() - gameStartTime_record / 1000
|
|
|
- }
|
|
|
- ],
|
|
|
- planId,
|
|
|
- gamelevel: currentLevel + 1,
|
|
|
- score: totalScore,
|
|
|
- userId: userStore.user.id
|
|
|
+ // finish: '1',
|
|
|
+ // gameId,
|
|
|
+ // gameName,
|
|
|
+ // paramList: [
|
|
|
+ // {
|
|
|
+ // code: 'score',
|
|
|
+ // name: '得分',
|
|
|
+ // value: totalScore
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // code: 'correctCount',
|
|
|
+ // name: '正确反应数',
|
|
|
+ // value: correctCount
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // code: 'avrResponseTime',
|
|
|
+ // name: '平均反应时',
|
|
|
+ // value: avrResponseTime
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // code: 'avrResponseTime',
|
|
|
+ // name: '最大难度',
|
|
|
+ // value: currentLevel + 1
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // code: 'gameTotalTime',
|
|
|
+ // name: '游戏总时长',
|
|
|
+ // value: Date.now() - gameStartTime_record / 1000
|
|
|
+ // }
|
|
|
+ // ],
|
|
|
+ // planId,
|
|
|
+ // gamelevel: currentLevel + 1,
|
|
|
+ // score: totalScore,
|
|
|
+ // userId: userStore.user.id
|
|
|
}
|
|
|
console.log('发送数据', data)
|
|
|
|
|
@@ -321,8 +317,8 @@ const sendData = () => {
|
|
|
}
|
|
|
async function exec() {
|
|
|
// openDialogRef.value.openDialog()
|
|
|
- isMainWin.value = window.location.href.includes('win=main')
|
|
|
- const tempPlan = sessionStorage.getItem('currentPlanInfo')
|
|
|
+ isMainWin.value = window.location.href.includes('win=main') // 主副屏标志
|
|
|
+ const tempPlan = sessionStorage.getItem('currentPlanInfo') // 取患者数据
|
|
|
if (tempPlan) {
|
|
|
planInfo.value = JSON.parse(tempPlan)
|
|
|
}
|
|
@@ -344,14 +340,12 @@ async function exec() {
|
|
|
})
|
|
|
}
|
|
|
const setOnceData = () => {
|
|
|
- // currentLevel
|
|
|
- // currentNumber
|
|
|
- // gameMode
|
|
|
// 记录响应开始时间
|
|
|
responseStartTime = performance.now()
|
|
|
- onceData.value = gameData.value[currentLevel][currentNumber]
|
|
|
+ // onceData.value = gameData.value[currentLevel][currentNumber]
|
|
|
+ onceData.value = gameData.value[currentNumber]
|
|
|
console.log(currentLevel, currentNumber, '1.2')
|
|
|
- onceData.value.choices = shuffleArray(onceData.value.choices)
|
|
|
+ // onceData.value.choices = shuffleArray(onceData.value.choices)
|
|
|
checkItems.value = onceData.value.choices
|
|
|
}
|
|
|
// 随机排列数组
|
|
@@ -367,22 +361,28 @@ onMounted(() => {
|
|
|
exec()
|
|
|
window.addEventListener('storage', (val) => {
|
|
|
if (isMainWin.value) {
|
|
|
- console.log(val.key)
|
|
|
- // if (val.key === 'two-win-Visual-mode-select') {
|
|
|
- // modeSelectFn(Number(val.newValue))
|
|
|
- // localStorage.removeItem('two-win-Visual-mode-select')
|
|
|
- // }
|
|
|
- if (val.key === 'two-win-Visual-item-List' && isJSON(val.newValue!)) {
|
|
|
- let tempVal = JSON.parse(val.newValue!)
|
|
|
+ if (val.key === 'two-win-Visual-item-List') {
|
|
|
+ let tempVal = JSON.parse(localStorage.getItem('two-win-Visual-item-List'))
|
|
|
checkItemFn(tempVal, 0)
|
|
|
- // localStorage.removeItem('two-win-Visual-item-List')
|
|
|
+ localStorage.removeItem('two-win-Visual-item-List')
|
|
|
+ }
|
|
|
+ if (val.key === 'two-win-Visual-item-confirmation') {
|
|
|
+ let a = localStorage.getItem('two-win-Visual-item-confirmation')
|
|
|
+ confirmation.value = a == 'true'
|
|
|
+ flagFlag.value = -1
|
|
|
+ localStorage.removeItem('two-win-Visual-item-confirmation')
|
|
|
+ }
|
|
|
+ if (val.key === 'two-win-Visual-item-submitList') {
|
|
|
+ sumbitData.value = JSON.parse(localStorage.getItem('two-win-Visual-item-submitList'))
|
|
|
+ localStorage.removeItem('two-win-Visual-item-submitList')
|
|
|
+ console.log(sumbitData.value, '主屏接收用户操作数据')
|
|
|
}
|
|
|
- // if (val.key === 'two-win-Visual-mode-start') {
|
|
|
- // startTask()
|
|
|
- // localStorage.removeItem('two-win-Visual-mode-start')
|
|
|
- // }
|
|
|
} else {
|
|
|
console.log('')
|
|
|
+ if (val.key === 'two-win-Visual-item-next') {
|
|
|
+ nextOnce()
|
|
|
+ localStorage.removeItem('two-win-Visual-item-next')
|
|
|
+ }
|
|
|
}
|
|
|
})
|
|
|
})
|
|
@@ -401,8 +401,18 @@ onMounted(() => {
|
|
|
//font-family: 楷体;
|
|
|
text-align: center;
|
|
|
}
|
|
|
- .question-imgStart {
|
|
|
- background-image: url('/static/image/cognitiveAbility/SpeechTraining/verify-bg.png');
|
|
|
+ .question-imgStartZ {
|
|
|
+ cursor: pointer;
|
|
|
+ background-image: url('/static/image/cognitiveAbility/SpeechTraining/next.png');
|
|
|
+ background-size: 100% 100%;
|
|
|
+ background-position: center center;
|
|
|
+ background-repeat: repeat;
|
|
|
+ //font-family: 楷体;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ .question-imgStartF {
|
|
|
+ cursor: pointer;
|
|
|
+ background-image: url('/static/image/cognitiveAbility/SpeechTraining/Visual/verify-bg.png');
|
|
|
background-size: 100% 100%;
|
|
|
background-position: center center;
|
|
|
background-repeat: repeat;
|