|
|
@@ -8,63 +8,63 @@
|
|
|
@click="handleClose"
|
|
|
/>
|
|
|
<div v-if="gameActive === '0'">
|
|
|
- <div v-if="showCountDown" class="absolute top-[50%] left-[50%] translate-[-50%] w-[400px] h-[200px] flex-center">
|
|
|
- <div class="w-[120px] h-[120px] relative">
|
|
|
- <wu-count-down :begin="countDownBegin" :num="5" @count-down-end="countDownEnd" />
|
|
|
+ <div v-if="showCountDown" class="absolute top-[50%] left-[50%] translate-[-50%] w-[400px] h-[200px] flex-center">
|
|
|
+ <div class="w-[120px] h-[120px] relative">
|
|
|
+ <wu-count-down :begin="countDownBegin" :num="5" @count-down-end="countDownEnd" />
|
|
|
+ </div>
|
|
|
+ <span v-if="!countDownBegin" class="font-600 text-[36px] text-[#089BAB]">{{ countDownStr }}</span>
|
|
|
</div>
|
|
|
- <span v-if="!countDownBegin" class="font-600 text-[36px] text-[#089BAB]">{{ countDownStr }}</span>
|
|
|
- </div>
|
|
|
- <div
|
|
|
- v-else
|
|
|
- class="absolute top-[50%] left-[50%] translate-[-50%] w-[1600px] h-[960px] rounded-[8px] bg-[#ffffffff] shadow-lg flex-center flex-col"
|
|
|
- >
|
|
|
- <!--模式选择-->
|
|
|
- <div v-if="modeSelect === -1" class="absolute wh-full top-0 left-0 bg-[#ffffff9f] z-3999 flex-center">
|
|
|
- <div class="choice-bg w-800px h-400px flex-center flex-col">
|
|
|
- <span class="inline-block text-45px text-black mb-36px mt-28px">请您选择任务模式：</span>
|
|
|
- <div class="flex flex-row w-76% justify-between mt-18px">
|
|
|
- <el-image
|
|
|
- src="/static/image/cognitiveAbility/SpeechTraining/tips-one.png"
|
|
|
- fit="contain"
|
|
|
- class="w-[280px] h-[90px] cursor-pointer"
|
|
|
- :class="{ 'scale-113': modeActive === 0 }"
|
|
|
- @click="modeSelectFn(0, isMainWin ? 1 : 0)"
|
|
|
- />
|
|
|
- <el-image
|
|
|
- src="/static/image/cognitiveAbility/SpeechTraining/tips-all.png"
|
|
|
- fit="contain"
|
|
|
- class="w-[280px] h-[90px] cursor-pointer"
|
|
|
- :class="{ 'scale-113': modeActive === 1 }"
|
|
|
- @click="modeSelectFn(1, isMainWin ? 1 : 0)"
|
|
|
- />
|
|
|
+ <div
|
|
|
+ v-else
|
|
|
+ class="absolute top-[50%] left-[50%] translate-[-50%] w-[1600px] h-[960px] rounded-[8px] bg-[#ffffffff] shadow-lg flex-center flex-col"
|
|
|
+ >
|
|
|
+ <!--模式选择-->
|
|
|
+ <div v-if="modeSelect === -1" class="absolute wh-full top-0 left-0 bg-[#ffffff9f] z-3999 flex-center">
|
|
|
+ <div class="choice-bg w-800px h-400px flex-center flex-col">
|
|
|
+ <span class="inline-block text-45px text-black mb-36px mt-28px">请您选择任务模式：</span>
|
|
|
+ <div class="flex flex-row w-76% justify-between mt-18px">
|
|
|
+ <el-image
|
|
|
+ src="/static/image/cognitiveAbility/SpeechTraining/tips-one.png"
|
|
|
+ fit="contain"
|
|
|
+ class="w-[280px] h-[90px] cursor-pointer"
|
|
|
+ :class="{ 'scale-113': modeActive === 0 }"
|
|
|
+ @click="modeSelectFn(0, isMainWin ? 1 : 0)"
|
|
|
+ />
|
|
|
+ <el-image
|
|
|
+ src="/static/image/cognitiveAbility/SpeechTraining/tips-all.png"
|
|
|
+ fit="contain"
|
|
|
+ class="w-[280px] h-[90px] cursor-pointer"
|
|
|
+ :class="{ 'scale-113': modeActive === 1 }"
|
|
|
+ @click="modeSelectFn(1, isMainWin ? 1 : 0)"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <el-image
|
|
|
- src="/static/image/cognitiveAbility/SpeechTraining/Visual/bg-title.png"
|
|
|
- fit="contain"
|
|
|
- class="w-[1120px] h-[160px]"
|
|
|
- />
|
|
|
- <div class="w-[1120px] mt-100px flex flex-wrap flex-row justify-between">
|
|
|
- <div
|
|
|
- v-for="(item, index) in checkItems"
|
|
|
- :key="index"
|
|
|
- class="w-[300px] h-[70px] flex-center fw-700 text-[34px] color-[#ffffff] mb-[18px] cursor-pointer hover:scale-102"
|
|
|
- :class="[item.active ? 'active' : 'normal']"
|
|
|
- @click="checkItemFn(item, isMainWin ? 1 : 0)"
|
|
|
- >
|
|
|
- {{ item.name }}
|
|
|
+ <el-image
|
|
|
+ src="/static/image/cognitiveAbility/SpeechTraining/Visual/bg-title.png"
|
|
|
+ fit="contain"
|
|
|
+ class="w-[1120px] h-[160px]"
|
|
|
+ />
|
|
|
+ <div class="w-[1120px] mt-100px flex flex-wrap flex-row justify-between">
|
|
|
+ <div
|
|
|
+ v-for="(item, index) in checkItems"
|
|
|
+ :key="index"
|
|
|
+ class="w-[300px] h-[70px] flex-center fw-700 text-[34px] color-[#ffffff] mb-[18px] cursor-pointer hover:scale-102"
|
|
|
+ :class="[item.active ? 'active' : 'normal']"
|
|
|
+ @click="checkItemFn(item, isMainWin ? 1 : 0)"
|
|
|
+ >
|
|
|
+ {{ item.name }}
|
|
|
+ </div>
|
|
|
</div>
|
|
|
+ <el-image
|
|
|
+ src="/static/image/cognitiveAbility/SpeechTraining/start-bg.png"
|
|
|
+ fit="contain"
|
|
|
+ class="w-[280px] h-[90px] mt-140px cursor-pointer hover:scale-101"
|
|
|
+ @click="startTask"
|
|
|
+ />
|
|
|
</div>
|
|
|
- <el-image
|
|
|
- src="/static/image/cognitiveAbility/SpeechTraining/start-bg.png"
|
|
|
- fit="contain"
|
|
|
- class="w-[280px] h-[90px] mt-140px cursor-pointer hover:scale-101"
|
|
|
- @click="startTask"
|
|
|
- />
|
|
|
- </div>
|
|
|
</div>
|
|
|
- <div>
|
|
|
+ <div>
|
|
|
<Word-word v-if="gameActive === '1'" />
|
|
|
</div>
|
|
|
<VoiceImp ref="VoiceImpRef" />
|
