|
|
@@ -1,72 +1,78 @@
|
|
|
-<template>
|
|
|
+<template>
|
|
|
<div class="exam">
|
|
|
- <div v-if="flag == true">
|
|
|
- <van-progress :percentage="exampercentage" :show-pivot="false" />
|
|
|
- </div>
|
|
|
- <van-row v-if="flag == false">
|
|
|
- <van-cell center title="显示中文">
|
|
|
- <template #right-icon>
|
|
|
- <van-switch v-model="chineseFlag" size="24" />
|
|
|
- </template>
|
|
|
- </van-cell>
|
|
|
- <van-cell center style="margin-bottom:4vh" title="自动发音">
|
|
|
- <template #right-icon>
|
|
|
- <van-switch v-model="autoPlayFlag" size="24" />
|
|
|
- </template>
|
|
|
- </van-cell>
|
|
|
- </van-row>
|
|
|
+ <div v-if="flag == true">
|
|
|
+ <van-progress :percentage="exampercentage" :show-pivot="false" />
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <van-row v-if="flag == false">
|
|
|
+ <van-cell center title="显示中文">
|
|
|
+ <template #right-icon>
|
|
|
+ <van-switch v-model="chineseFlag" size="24" />
|
|
|
+ </template>
|
|
|
+ </van-cell>
|
|
|
+ <van-cell center style="margin-bottom:4vh" title="自动发音">
|
|
|
+ <template #right-icon>
|
|
|
+ <van-switch v-model="autoPlayFlag" size="24" />
|
|
|
+ </template>
|
|
|
+ </van-cell>
|
|
|
+ </van-row>
|
|
|
|
|
|
<van-row type="flex" justify="center">
|
|
|
<van-col span="22" class="word-center">
|
|
|
- <div style="padding-top: 1rem" v-if="flag == false">
|
|
|
- <p >近5条记录</p>
|
|
|
- <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
|
|
|
- <van-list
|
|
|
- v-model="loading"
|
|
|
- :finished="finished"
|
|
|
- finished-text="没有更多了"
|
|
|
- @load="onLoad"
|
|
|
- >
|
|
|
- <van-cell v-for="item in list" :key="item" :title="item" />
|
|
|
- </van-list>
|
|
|
- </van-pull-refresh>
|
|
|
+ <div style="padding-top: 1rem" v-if="flag == false">
|
|
|
+
|
|
|
+ <p style="font-size:14px;">近5条记录</p>
|
|
|
+
|
|
|
+ <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
|
|
|
+ <van-list
|
|
|
+ v-model="loading"
|
|
|
+ :finished="finished"
|
|
|
+ finished-text="加载完成"
|
|
|
+ @load="onLoad"
|
|
|
+ >
|
|
|
+ <van-cell v-for="item in list" :key="item" :title="item" />
|
|
|
+ </van-list>
|
|
|
+ </van-pull-refresh>
|
|
|
|
|
|
-<p style="padding-top: 1rem"></p>
|
|
|
- <van-button round class="start-btn"
|
|
|
- type="info"
|
|
|
- loading-text="加载中..."
|
|
|
- :loading="examLoading"
|
|
|
- @click="exam"> 开 始 测 试 </van-button>
|
|
|
+ <p style="padding-top: 1rem"></p>
|
|
|
+
|
|
|
+ <van-button round class="start-btn"
|
|
|
+ type="info"
|
|
|
+ loading-text="加载中..."
|
|
|
+ :loading="examLoading"
|
|
|
+ @click="exam">开 始 测 试
|
|
|
+ </van-button>
|
|
|
</div>
|
|
|
|
|
|
- <van-popup
|
|
|
- v-model="showCountDown"
|
|
|
- :style="{ height: '100%', width: '100%' }"
|
|
|
- >
|
|
|
- <div style="padding-top: 60%; font-size: 40px">
|
|
|
- <van-circle
|
|
|
- v-model="currentRate"
|
|
|
- :rate="rate"
|
|
|
- :speed="50"
|
|
|
- size="240px"
|
|
|
- :clockwise="false"
|
|
|
- text="即将开始"
|
|
|
- />
|
|
|
+ <van-popup
|
|
|
+ v-model="showCountDown"
|
|
|
+ :style="{ height: '100%', width: '100%' }"
|
|
|
+ >
|
|
|
+ <div style="padding-top: 60%; font-size: 40px">
|
|
|
+ <van-circle
|
|
|
+ v-model="currentRate"
|
|
|
+ :rate="rate"
|
|
|
+ :speed="50"
|
|
|
+ size="220px"
|
|
|
+ :clockwise="false"
|
|
|
+ text="即将开始"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </van-popup>
|
|
|
+
|
|
|
+ <div class="word word-center" v-if="flag == true">
|
|
|
+ <span>{{ word.split("_")[0] }}</span
|
|
|
+ ><span style="color: green">{{ key }}</span
|
|
|
+ ><span>{{ word.split("_")[1] }}</span>
|
|
|
+ <span v-if="chineseFlag" id="translation">{{ translation[wordIndex] }}</span>
|
|
|
</div>
|
|
|
- </van-popup>
|
|
|
- <div class="word word-center" v-if="flag == true">
|
|
|
- <span>{{ word.split("_")[0] }}</span
|
|
|
- ><span style="color: green">{{ key }}</span
|
|
|
- ><span>{{ word.split("_")[1] }}</span>
|
|
|
- <span v-if="chineseFlag" id="translation">
|
|
|
- {{ translation[wordIndex] }}
|
|
|
- </span>
|
|
|
- </div>
|
|
|
- <audio id="audio" preload="meta" controls v-show="flag == true">
|
|
|
- <source :src="chats[0]" />
|
|
|
- </audio>
|
|
|
+
|
|
|
+ <audio id="audio" preload="meta" controls v-show="flag == true">
|
|
|
+ <source :src="chats[0]" />
|
|
|
+ </audio>
|
|
|
</van-col>
|
|
|
</van-row>
|
|
|
+
|
|
|
<van-row type="flex" justify="center">
|
|
|
<!-- <van-col span="4"> -->
|
|
|
<div style="margin-top: 1rem; margin-bottom: 1rem">
|
|
|
@@ -100,74 +106,77 @@
|
|
|
<van-field v-model="key" label="答案" readonly /> type="flex" justify="center"
|
|
|
</div> -->
|
|
|
</van-row>
|
|
|
- <van-row type="flex" justify="center" v-if="flag == true">
|
|
|
- <van-col span="2">
|
|
|
- <van-button round @click="inputKey('q')" type="info">Q</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('a')" type="info">A</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('z')" type="info">Z</van-button>
|
|
|
- </van-col>
|
|
|
- <van-col span="2">
|
|
|
- <van-button round @click="inputKey('w')" type="info">W</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('s')" type="info">S</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('x')" type="info">X</van-button>
|
|
|
- </van-col>
|
|
|
- <van-col span="2">
|
|
|
- <van-button round @click="inputKey('e')" type="info">E</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('d')" type="info">D</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('c')" type="info">C</van-button>
|
|
|
- </van-col>
|
|
|
- <van-col span="2">
|
|
|
- <van-button round @click="inputKey('r')" type="info">R</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('f')" type="info">F</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('v')" type="info">V</van-button>
|
|
|
- </van-col>
|
|
|
- <van-col span="2">
|
|
|
- <van-button round @click="inputKey('t')" type="info">T</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('g')" type="info">G</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('b')" type="info">B</van-button>
|
|
|
- </van-col>
|
|
|
- <van-col span="2">
|
|
|
- <van-button round @click="inputKey('y')" type="info">Y</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('h')" type="info">H</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('n')" type="info">N</van-button>
|
|
|
- </van-col>
|
|
|
- <van-col span="2">
|
|
|
- <van-button round @click="inputKey('u')" type="info">U</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('j')" type="info">J</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('m')" type="info">M</van-button>
|
|
|
- </van-col>
|
|
|
- <van-col span="2">
|
|
|
- <van-button round @click="inputKey('i')" type="info">I</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('k')" type="info">K</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('o')" type="info">O</van-button>
|
|
|
- </van-col>
|
|
|
- <van-col span="2">
|
|
|
- <van-button round @click="inputKey('l')" type="info">L</van-button>
|
|
|
- <van-divider />
|
|
|
- <van-button round @click="inputKey('p')" type="info">P</van-button>
|
|
|
- </van-col>
|
|
|
- </van-row>
|
|
|
- <van-row type="flex" justify="center">
|
|
|
- <div v-if="flag == true" style="margin-top: 2.6rem">
|
|
|
- <van-button round class="next-btn" @click="nextBtn" type="info">下 一 题</van-button>
|
|
|
- </div>
|
|
|
- </van-row>
|
|
|
+
|
|
|
+ <van-row type="flex" justify="center" v-if="flag == true">
|
|
|
+ <van-col span="2">
|
|
|
+ <van-button round @click="inputKey('q')" type="info">Q</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('a')" type="info">A</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('z')" type="info">Z</van-button>
|
|
|
+ </van-col>
|
|
|
+ <van-col span="2">
|
|
|
+ <van-button round @click="inputKey('w')" type="info">W</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('s')" type="info">S</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('x')" type="info">X</van-button>
|
|
|
+ </van-col>
|
|
|
+ <van-col span="2">
|
|
|
+ <van-button round @click="inputKey('e')" type="info">E</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('d')" type="info">D</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('c')" type="info">C</van-button>
|
|
|
+ </van-col>
|
|
|
+ <van-col span="2">
|
|
|
+ <van-button round @click="inputKey('r')" type="info">R</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('f')" type="info">F</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('v')" type="info">V</van-button>
|
|
|
+ </van-col>
|
|
|
+ <van-col span="2">
|
|
|
+ <van-button round @click="inputKey('t')" type="info">T</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('g')" type="info">G</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('b')" type="info">B</van-button>
|
|
|
+ </van-col>
|
|
|
+ <van-col span="2">
|
|
|
+ <van-button round @click="inputKey('y')" type="info">Y</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('h')" type="info">H</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('n')" type="info">N</van-button>
|
|
|
+ </van-col>
|
|
|
+ <van-col span="2">
|
|
|
+ <van-button round @click="inputKey('u')" type="info">U</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('j')" type="info">J</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('m')" type="info">M</van-button>
|
|
|
+ </van-col>
|
|
|
+ <van-col span="2">
|
|
|
+ <van-button round @click="inputKey('i')" type="info">I</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('k')" type="info">K</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('o')" type="info">O</van-button>
|
|
|
+ </van-col>
|
|
|
+ <van-col span="2">
|
|
|
+ <van-button round @click="inputKey('l')" type="info">L</van-button>
|
|
|
+ <van-divider />
|
|
|
+ <van-button round @click="inputKey('p')" type="info">P</van-button>
|
|
|
+ </van-col>
|
|
|
+ </van-row>
|
|
|
+
|
|
|
+ <van-row type="flex" justify="center">
|
|
|
+ <div v-if="flag == true" style="margin-top: 2.1rem">
|
|
|
+ <van-button round class="next-btn" @click="nextBtn" type="info">下 一 题</van-button>
|
|
|
+ </div>
|
|
|
+ </van-row>
|
|
|
+
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -202,6 +211,8 @@ export default {
|
|
|
loading: false,
|
|
|
finished: false,
|
|
|
refreshing: false,
|
|
|
+ score: 0,
|
|
|
+ errorStr:"",
|
|
|
};
|
|
|
},
|
|
|
mounted() {
|
|
|
@@ -223,7 +234,7 @@ export default {
|
|
|
if (words.split(",").length > keys.split(",").length) {
|
|
|
Dialog.confirm({
|
|
|
title: "提示",
|
|
|
- message: "您今天还有未完成的测试,是否继续?",
|
|
|
+ message: "您有未完成的测试,是否继续?",
|
|
|
})
|
|
|
.then(() => {
|
|
|
this.words = words.split(",");
|
|
|
@@ -270,7 +281,7 @@ export default {
|
|
|
exam() {
|
|
|
this.examLoading = true;
|
|
|
apiFunc.getWords().then((res) => {
|
|
|
- this.wordInfo = res.data;
|
|
|
+ // this.wordInfo = res.data;
|
|
|
for (let i = 0; i < 50; i++) {
|
|
|
this.words.push(res.data[i].subWord);
|
|
|
this.chats.push(res.data[i].online);
|
|
|
@@ -350,34 +361,34 @@ export default {
|
|
|
this.keys
|
|
|
);
|
|
|
this.$refs.countDown.pause();
|
|
|
- let score = 0;
|
|
|
- let errorStr = "";
|
|
|
+ this.score = 0;
|
|
|
+ this.errorStr = "";
|
|
|
for (let i = 0; i < 50; i++) {
|
|
|
- if (this.keys[i] == this.correctKeys[i]) {
|
|
|
- score += 2;
|
|
|
+ if (this.keys[i].toLowerCase() == this.correctKeys[i].toLowerCase()) {
|
|
|
+ this.score += 2;
|
|
|
}else{
|
|
|
- errorStr = errorStr + this.words[i] + " 所填 " + this.keys[i] + " 答案 " + this.correctKeys[i] + "\n";
|
|
|
+ this.errorStr = this.errorStr + this.words[i] + " 所填 " + this.keys[i] + " 答案 " + this.correctKeys[i] + "\n";
|
|
|
}
|
|
|
}
|
|
|
- apiFunc.submitGrade(score, Cookies.get("userName")).then((res) => {
|
|
|
+ apiFunc.submitGrade(this.score, Cookies.get("userName")).then((res) => {
|
|
|
if (res.data === 1) {
|
|
|
Dialog.alert({
|
|
|
title: "测试结束",
|
|
|
- message: "分数为 " + score,
|
|
|
+ message: "分数为 " + this.score,
|
|
|
}).then(() => {
|
|
|
// on close
|
|
|
this.flag = false;
|
|
|
this.showWordCountDown = false;
|
|
|
- this.onRefresh();
|
|
|
- if (score < 100) {
|
|
|
+ localStorage.clear();
|
|
|
+ if (this.score < 100) {
|
|
|
//this.scoreLess100 = true;
|
|
|
Dialog.alert(
|
|
|
- {
|
|
|
- title: "答错",
|
|
|
- message: errorStr,
|
|
|
+ {
|
|
|
+ message: "答错" + "\n" + this.errorStr,
|
|
|
}
|
|
|
- )
|
|
|
- };
|
|
|
+ ).then(()=>{ this.$router.go(0);});
|
|
|
+ }else{ this.$router.go(0); };//this.$router.go(0);解决测试1次后，不退出，再测试，分数不变的问题，Dialog.alert,不能阻塞后面的语句
|
|
|
+
|
|
|
});
|
|
|
}
|
|
|
});
|
|
|
@@ -409,34 +420,33 @@ export default {
|
|
|
this.keys
|
|
|
);
|
|
|
this.$refs.countDown.pause();
|
|
|
- let score = 0;
|
|
|
- let errorStr = "";
|
|
|
+ this.score = 0;
|
|
|
+ this.errorStr = "";
|
|
|
for (let i = 0; i < 50; i++) {
|
|
|
- if (this.keys[i] == this.correctKeys[i]) {
|
|
|
- score += 2;
|
|
|
+ if (this.keys[i].toLowerCase() == this.correctKeys[i].toLowerCase()) {
|
|
|
+ this.score += 2;
|
|
|
}else{
|
|
|
- errorStr = errorStr + this.words[i] + " 所填 " + this.keys[i] + " 答案 " + this.correctKeys[i] + "\n";
|
|
|
+ this.errorStr = this.errorStr + this.words[i] + " 所填 " + this.keys[i] + " 答案 " + this.correctKeys[i] + "\n";
|
|
|
}
|
|
|
}
|
|
|
- apiFunc.submitGrade(score, Cookies.get("userName")).then((res) => {
|
|
|
+ apiFunc.submitGrade(this.score, Cookies.get("userName")).then((res) => {
|
|
|
if (res.data === 1) {
|
|
|
Dialog.alert({
|
|
|
title: "测试结束",
|
|
|
- message: "分数为 " + score,
|
|
|
+ message: "分数为 " + this.score,
|
|
|
}).then(() => {
|
|
|
// on close
|
|
|
this.flag = false;
|
|
|
this.showWordCountDown = false;
|
|
|
- this.onRefresh();
|
|
|
- if (score < 100) {
|
|
|
+ localStorage.clear();
|
|
|
+ if (this.score < 100) {
|
|
|
//this.scoreLess100 = true;
|
|
|
Dialog.alert(
|
|
|
- {
|
|
|
- title: "答错",
|
|
|
- message: errorStr,
|
|
|
+ {
|
|
|
+ message: "答错" + "\n" + this.errorStr,
|
|
|
}
|
|
|
- )
|
|
|
- };
|
|
|
+ ).then(()=>{ this.$router.go(0);});
|
|
|
+ }else{ this.$router.go(0); };//this.$router.go(0);解决测试1次后，不退出，再测试，分数不变的问题，Dialog.alert,不能阻塞后面的语句
|
|
|
});
|
|
|
}
|
|
|
});
|
|
|
@@ -495,7 +505,7 @@ export default {
|
|
|
.word {
|
|
|
height: 9rem;
|
|
|
line-height: 9rem;
|
|
|
- font-size: 45px;
|
|
|
+ font-size: 40px;
|
|
|
font-weight: 900;
|
|
|
color: lightslategray;
|
|
|
font-family: "Gentona Free Demo";
|
