130 lines
4.1 KiB
Vue
130 lines
4.1 KiB
Vue
<template>
|
||
<view>
|
||
<!-- <u-navbar title="本次练题结果" @rightClick="rightClick" :autoBack="true"></u-navbar>-->
|
||
<j-navbar backPath="/pages/index/index">本次练题结果</j-navbar>
|
||
<view class="p14 wp100">
|
||
<GradesChart :titleName="rightPencentDesc" :actualValue="Number(rightPencent)" />
|
||
<view class="top_box flex jc-c" style="flex-direction: column;">
|
||
<view class="wp100 text-center" style="margin-top: -80px;">
|
||
<text v-if="Number(rightPencent * 100)>=90">太棒了！正确率很高了！</text>
|
||
<text v-else>继续努力吧，正确率有点低~</text>
|
||
<view class="flex ai-c jc-c mt10">
|
||
<view class="text-center wp50" @tap="toQuestionBank">
|
||
<view>{{wrongList.length}}/{{allDoNum}}</view>
|
||
<text>本次错题</text>
|
||
</view>
|
||
<view class="text-center wp50 flex jc-c ai-c" style="flex-direction: column;" @tap="toContiune">
|
||
<u-icon name="file-text" size="28"></u-icon>
|
||
<text>继续做题</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="p14">
|
||
<view class="bc-fff p14" style="border-radius: 20rpx;">
|
||
<view class="flex ai-c jc-sb">
|
||
<view>
|
||
<text class="fs18 cor-000 fw600">累计练题</text>
|
||
<text class="fs14 cor-666 ml10">{{allRightList.length+allWrongList.length}}题</text>
|
||
</view>
|
||
<text class="fs14 cor-666">未做题{{getNotDoNum}}题</text>
|
||
</view>
|
||
<view class="mt10">
|
||
<u-line-progress :percentage="percent" activeColor="#05C341" height="16"></u-line-progress>
|
||
</view>
|
||
<view class="p14 mt10 flex ai-c jc-sb" style="border-radius: 20rpx;background-color: rgb(253,249,238);">
|
||
<view>
|
||
<text class="fs16 cor-666">题目太多？试试</text>
|
||
<text class="fs16 cor-000 fw600">精简500题</text>
|
||
</view>
|
||
<view style="width: 220rpx;">
|
||
<button style="background-color:rgb(246,211,115);height: 80rpx;border-radius: 40rpx;width: 220rpx;color:rgb(102,65,0)">开始答题</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
mapState,
|
||
mapActions
|
||
} from 'pinia' //引入映射函数
|
||
import storage from '@/jtools/storage';
|
||
import useQuestionStore from '@/jtools/store/question' //引入store
|
||
import GradesChart from "./components/GradesChart.vue"
|
||
export default {
|
||
components: {
|
||
GradesChart
|
||
},
|
||
data() {
|
||
return {
|
||
rightPencent:0,
|
||
rightPencentDesc:'',
|
||
allDoNum:0,
|
||
wrongList:[],
|
||
subject:1,
|
||
allRightList:[],
|
||
allWrongList:[],
|
||
percent:undefined,
|
||
navTitle:'顺序练习',
|
||
}
|
||
},
|
||
onLoad(op){
|
||
if(op.allDoNum){
|
||
this.allDoNum=op.allDoNum
|
||
}
|
||
if(op.navTitle){
|
||
this.navTitle=op.navTitle
|
||
}
|
||
if(op.wrongList){
|
||
this.wrongList=JSON.parse(op.wrongList)
|
||
this.rightPencent=this.allDoNum>0?((this.allDoNum-this.wrongList.length)/this.allDoNum).toFixed(2):0
|
||
this.rightPencentDesc=(this.rightPencent*100).toFixed(0)+'%'
|
||
}
|
||
if(op.subject){
|
||
this.subject=op.subject
|
||
this.allRightList=storage.get(`rightList_subject${this.subject}`) || []
|
||
this.allWrongList=storage.get(`wrongList_subject${this.subject}`) || []
|
||
this.percent=(((this.allRightList.length+this.wrongList.length) / this[`orderQuestion_subject${this.subject}`].length)*100).toFixed(0)
|
||
}
|
||
},
|
||
onUnload() {
|
||
//#ifdef MP-WEIXIN
|
||
uni.reLaunch({
|
||
url:"/pages/index/index"
|
||
})
|
||
//#endif
|
||
},
|
||
computed: {
|
||
...mapState(useQuestionStore, ["orderQuestion_subject1","orderQuestion_subject4"]), //映射函数，取出tagslist
|
||
getNotDoNum(){
|
||
return this[`orderQuestion_subject${this.subject}`].length-(this.allRightList.length+this.allWrongList.length)
|
||
}
|
||
},
|
||
methods: {
|
||
toQuestionBank(){
|
||
const list =JSON.stringify(this.wrongList)
|
||
uni.navigateTo({
|
||
url:"/pages/questionBank/questionBank?navTitle=错题&subject="+this.subject+"&questionList="+list
|
||
})
|
||
},
|
||
toContiune(){
|
||
uni.navigateTo({
|
||
url:"/pages/questionBank/questionBank?navTitle="+this.navTitle+"&subject="+this.subject
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.top_box {
|
||
padding: 15px;
|
||
background-color: #fdfdfd;
|
||
border-radius: 20rpx;
|
||
}
|
||
</style>
|