sdz/ks-app-employment-service
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改

Browse Source
This commit is contained in:
WX0lxh
2025-11-05 08:51:21 +08:00
parent 73664abe4b
commit 9a706c1275
1 changed files with 198 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

247
packageB/train/practice/startPracticing.vue
View File

@@ -3,9 +3,10 @@
<image src="../../../static/images/train/bj.jpg" class="bjImg" mode=""></image> <image src="../../../static/images/train/bj.jpg" class="bjImg" mode=""></image>
<div class="con-box"> <div class="con-box">
<div class="header"> <div class="header">
<div>正确率：0%</div> <div>正确率：{{accuracyRate}}%</div>
<div>用时：00:00</div> <div>用时：{{formattedTime}}</div>
<div class="headBtn">暂停</div> <div class="headBtn" v-if="isRunning" @click="pause">暂停</div>
<div class="headBtn" v-if="!isRunning" @click="start">继续</div>
</div> </div>
<div class="problemCard"> <div class="problemCard">
<div v-for="(item,index) in problemData" :key="index"> <div v-for="(item,index) in problemData" :key="index">
@@ -37,15 +38,15 @@
<span>错误</span> <span>错误</span>
</div> </div>
</div> </div>
<div class="analysis"> <div class="analysis" v-if="analysis">
<div class="analysisHead correct"> <div class="analysisHead correct" v-if="judgWhether=='正确'">
<div>回答正确！</div> <div>回答正确！</div>
<div></div> <div></div>
</div> </div>
<!-- <div class="analysisHead errors" v-if="judgWhether=='错误'"> <div class="analysisHead errors" v-if="judgWhether=='错误'">
<div>回答错误！</div> <div>回答错误！</div>
<div></div> <div></div>
</div> --> </div>
<div class="analysisCon"> <div class="analysisCon">
<div class="parse1">正确答案：</div> <div class="parse1">正确答案：</div>
<div class="parse2" v-if="item.type=='single'" style="color: #30A0FF;font-weight: bold;">{{String.fromCharCode(65 + Number(item.answer))}}.</div> <div class="parse2" v-if="item.type=='single'" style="color: #30A0FF;font-weight: bold;">{{String.fromCharCode(65 + Number(item.answer))}}.</div>
@@ -66,38 +67,38 @@
</div> </div>
</div> </div>
<div class="problemBtns"> <div class="problemBtns">
<div class="events">提交答案</div> <div v-if="analysis&&judgWhether!=''&&questionIndex!=problemData.length" @click="questionIndex.value+=1">下一题</div>
<div>下一题</div> <div v-else :class="(radio==''&&radio2==''&&checkList.length==0&&isRunning)?'events':''">提交答案</div>
</div> </div>
</template> </template>
</div> </div>
</div> </div>
<div class="footer"> <div class="footer">
<div class="footerLeft"> <div class="footerLeft">
<div class="zuo events"></div> <div class="zuo" :class="questionIndex==1?'events':''" @click="questionIndex-=1"></div>
<div class="you"></div> <div class="you" :class="questionIndex==problemData.length?'events':''" @click="questionIndex+=1"></div>
<div style="text-align: center;font-size: 24rpx;"> <div @click="collect(1)" style="text-align: center;font-size: 24rpx;" v-if="(problemData[questionIndex - 1]?.isCollect || 0)!=1">
<image :src="urls+'wsc.png'" mode=""></image> <image :src="urls+'wsc.png'" mode="" style="width: 34rpx;height: 32rpx;"></image>
<div>收藏</div> <div>收藏</div>
</div> </div>
<!-- <div style="text-align: center;font-size: 24rpx;"> <div @click="collect(0)" style="text-align: center;font-size: 24rpx;" v-if="(problemData[questionIndex - 1]?.isCollect || 0)==1">
<image :src="urls+'video-sc.png'" mode=""></image> <image :src="urls+'video-sc.png'" mode="" style="width: 34rpx;height: 32rpx;"></image>
<div>取消</div> <div>取消</div>
</div> --> </div>
</div> </div>
<div class="footerBtn">完成练习</div> <div class="footerBtn">完成练习</div>
<div class="footerLeft"> <div class="footerLeft">
<div> <div>
<div class="icons" style="background-color: #1CADF5;">√</div> <div class="icons" style="background-color: #1CADF5;">√</div>
<div class="texts" style="color: #1CADF5;">1</div> <div class="texts" style="color: #1CADF5;">{{correctIndex}}</div>
</div> </div>
<div> <div>
<div class="icons" style="background-color: #FF6668;">×</div> <div class="icons" style="background-color: #FF6668;">×</div>
<div class="texts" style="color: #FF6668;">0</div> <div class="texts" style="color: #FF6668;">{{errorsIndex}}</div>
</div> </div>
<div> <div @click="dialogVisible=true">
<div></div> <div><span style="color: #1CADF5;">{{questionIndex}}</span>/{{problemData.length}}</div>
<div></div> <div>题号</div>
</div> </div>
</div> </div>
</div> </div>
@@ -108,18 +109,22 @@
<div>题号</div> <div>题号</div>
<div style="font-size: 40rpx;" @click="clones()">×</div> <div style="font-size: 40rpx;" @click="clones()">×</div>
</div> </div>
<div class="questionNums">
<div class="questions" :class="item.whether=='正确'?'questionCorrect':item.whether=='错误'?'questionError':questionIndex==(index+1)?'questionsActive':''" @click="switchs(index)" v-for="(item,index) in problemList" :key="index">{{index+1}}</div>
</div>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script setup> <script setup>
import { reactive, inject, watch, ref, onMounted } from 'vue'; import { reactive, inject, watch, ref, onMounted,onBeforeUnmount,computed } from 'vue';
import { onLoad, onShow } from '@dcloudio/uni-app'; import { onLoad, onShow } from '@dcloudio/uni-app';
const { $api,urls , navTo, vacanciesTo, formatTotal, config } = inject('globalFunction'); const { $api,urls , navTo, vacanciesTo, formatTotal, config } = inject('globalFunction');
import useUserStore from '@/stores/useUserStore'; import useUserStore from '@/stores/useUserStore';
import useDictStore from '@/stores/useDictStore'; import useDictStore from '@/stores/useDictStore';
const userInfo = ref({});
const Authorization = ref('');
const radio = ref(''); const radio = ref('');
const radio2 = ref(''); const radio2 = ref('');
const checkList = ref([]); const checkList = ref([]);
@@ -127,30 +132,121 @@ const questionIndex = ref(1);
const correctIndex = ref(0); const correctIndex = ref(0);
const errorsIndex = ref(0); const errorsIndex = ref(0);
const accuracyRate = ref(0); const accuracyRate = ref(0);
const dialogVisible = ref(true); const elapsedTime = ref(0);
const problemData = reactive([ const analysis = ref(false);
{ const judgWhether = ref('');
type:'single', const isRunning = ref(false);
content:"君不见黄河之水天上来，下一句是？", const dialogVisible = ref(false);
fraction:5, const problemData = ref([]);
trainChooses:"奔流到海不复回,朝如青丝暮成雪,人生得意须尽欢,莫使金樽空对月", const problemList = ref([]);
},{ let timer = null;
type:'multiple', const formattedTime = computed(() => {
content:"以下哪些是欧姆定律的适用条件？", const minutes = Math.floor(elapsedTime.value / 60)
fraction:8, const seconds = elapsedTime.value % 60
trainChooses:"线性电阻,恒定温度,金属导体,半导体材料", return `${padTime(minutes)}:${padTime(seconds)}`
});
watch(questionIndex, (newVal, oldVal) => {
radio.value=""
radio2.value=""
checkList.value=[]
analysis.value=false
judgWhether.value=""
});
},{ // watch(problemData, (newVal, oldVal) => {
type:'judge', // problemList.value=[];
content:"功率越大的电器，其电阻值越小", // newVal.forEach((item,i)=>{
fraction:2, // problemList.value.push({index:i+1,whether:""})
trainChooses:[ // })
"正确", // });
"错误",
] onLoad((options) => {
userInfo.value = uni.getStorageSync('userInfo') || {};
Authorization.value=uni.getStorageSync('Padmin-Token')||''
queryData();
});
onShow(()=>{
})
onBeforeUnmount(() => {
if (timer) {
clearInterval(timer); // 清除定时器
timer = null; // 防止内存泄漏，确保下次不会再误用已清除的定时器
} }
]); });
function queryData(){
problemData.value=[]
let header={
'Authorization':Authorization.value,
'Content-Type':"application/x-www-form-urlencoded"
}
$api.myRequest('/train/public/trainPractice/getQuestions', {
userId: userInfo.value.userId
},'post',9100,header).then((resData) => {
resData.forEach((item,i)=>{
problemData.value.push(item)
problemList.value.push({index:i+1,whether:""})
})
start()
accuracyRates()
});
}
function collect(is){
let header={
'Authorization':Authorization.value,
'Content-Type':"application/x-www-form-urlencoded"
}
$api.myRequest('/train/public/questionUser/addOrUpdateCollect', {
userId: userInfo.value.userId,
questionId:problemData.value[this.questionIndex-1].questionId,
collect:is
},'post',9100,header).then((resData) => {
problemData.value[questionIndex.value-1].isCollect=is
});
};
//正确率
function accuracyRates(){
let header={
'Authorization':Authorization.value,
'Content-Type':"application/x-www-form-urlencoded"
}
$api.myRequest('/train/public/trainPractice/getCount', {
userId: userInfo.value.userId,
},'post',9100,header).then((resData) => {
// debugger
// accuracyRate.value=resData.truePresent
});
};
//提交答案
function submit(){
let indexs=questionIndex.value-1
let parm={
questionId:problemData.value[indexs].questionId,
userId:userInfo.value.userId,
answer:this.problemData.value[indexs].answer
}
if(problemData.value[indexs].type=='single'){
parm.submitAnswer=radio.value
}else if(this.problemData[indexs].type=='multiple'){
parm.submitAnswer=this.checkList.join(',')
}else if(this.problemData[indexs].type=='judge'){
parm.submitAnswer=this.radio2
}
startTrainingApi.submitAnswer(parm).then((res)=>{
if(res&&res.code==200){
this.analysis=true
this.judgWhether=res.msg
this.problemList[indexs].whether=res.msg
if(res.msg=='正确'){
this.correctIndex++
}else if(res.msg=='错误'){
this.errorsIndex++
}
this.accuracyRates()
}
})
};
function selected(i){ function selected(i){
radio.value=i radio.value=i
}; };
@@ -194,9 +290,28 @@ function indexToLetter(index) {
// 将索引转换为对应的字母 // 将索引转换为对应的字母
return String.fromCharCode(65 + index); return String.fromCharCode(65 + index);
}; };
function padTime(time) {
return time < 10 ? `0${time}` : time
};
function start() {
if (isRunning.value) return
isRunning.value = true
timer = setInterval(() => {
elapsedTime.value++
}, 1000)
};
function pause() {
if (!isRunning.value) return
clearInterval(timer)
isRunning.value = false
};
function clones(){ function clones(){
dialogVisible.value=false dialogVisible.value=false
} };
function switchs(i){
questionIndex.value=(i+1)
dialogVisible.value=false
};
</script> </script>
<style lang="stylus" scoped> <style lang="stylus" scoped>
@@ -358,20 +473,20 @@ function clones(){
font-size: 30rpx; font-size: 30rpx;
text-align: center text-align: center
.zuo{ .zuo{
width: 24rpx; width: 26rpx;
height: 24rpx; height: 26rpx;
border-top: 2px solid #666 border-top: 2px solid #666
border-left: 2px solid #666 border-left: 2px solid #666
transform: rotate(-45deg); /* 鼠标悬停时旋转360度 */ transform: rotate(-45deg); /* 鼠标悬停时旋转360度 */
margin-left: 50rpx; margin-left: 60rpx;
} }
.you{ .you{
width: 24rpx; width: 26rpx;
height: 24rpx; height: 26rpx;
border-right: 2px solid #666 border-right: 2px solid #666
border-bottom: 2px solid #666 border-bottom: 2px solid #666
transform: rotate(-45deg); /* 鼠标悬停时旋转360度 */ transform: rotate(-45deg); /* 鼠标悬停时旋转360度 */
margin-left: 30rpx; // margin-left: 30rpx;
margin-right: 50rpx; margin-right: 50rpx;
} }
.icons{ .icons{
@@ -423,6 +538,36 @@ function clones(){
font-size: 30rpx; font-size: 30rpx;
font-weight: 600; font-weight: 600;
} }
.questionNums{
width: 100%;
display: flex;
flex-wrap: wrap;
}
.questions{
width: 60rpx;
height: 60rpx;
text-align: center;
line-height: 60rpx;
border-radius: 8rpx;
border: 2px solid #E0E0E0;
font-size: 28rpx;
margin-right: 15px;
cursor: pointer;
}
.questionsActive{
background-color: #F0F9FF;
border: 2px solid #409EFF;
}
.questionCorrect{
background-color: #F0F9FF;
border: 2px solid #64BC38;
color: #6BC441;
}
.questionError{
background-color: #FFF1F0;
border: 2px solid #F56C6C;
color: #F36B6B;
}
} }
} }
} }