huxiaofeng666/jwl-applet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

提交

Browse Source
This commit is contained in:
脆皮鸭
2023-08-20 01:59:40 +08:00
parent e635b5c431
commit a90c28f6fd
11 changed files with 307 additions and 360 deletions
Download Patch File Download Diff File Expand all files Collapse all files

402
src/pages/questionBank/components/Question.vue
View File

@@ -5,23 +5,23 @@
<view class="type_item" v-for="(item,index) of tabsList" :key="index" :class="tCurrent==item.value?'checked':'unchecked'" @tap="sectionChange(item.value)">{{item.label}}</view>
</view>
</view>
<swiper class="swiper mt20" :current="swiperIndex" :duration="duration" :autoplay="false" :disable-programmatic-animation="true" @change="onChange" @animationfinish="onAnimationfinish" @touchend="touchEnd" >
<swiper class="swiper mt20" :current="swiperIndex" :duration="duration" :autoplay="false" :disable-programmatic-animation="true" @change="onChange" @animationfinish="onAnimationfinish" @touchend="touchEnd" >
<swiper-item v-for="(quesItem,quesIndex) in swiperList" :key="quesIndex">
<scroll-view scroll-y="true" class="swiper-scroll">
<view>
<view class="m14lr">
<text class="tag_box">{{quesItem.questionTypeDesc}}</text>
<text class="fs18">{{quesItem.questionDesc}}</text>
<text class="tag_box">{{getQuestType(quesItem.type)}}</text>
<text class="fs18">{{quesItem.question}}</text>
</view>
<view class="flex m14lr ai-c mt20" v-for="(item,index) in quesItem.optionList"
:key="item.op" @tap="answerQues(item.op,index)">
:key="item.op" @tap="answerQues(item.opValue,index)">
<template
v-if="quesItem.clickAnswer&&item.op===quesItem.rightOp">
<u-icon class="mr15" name="checkmark-circle-fill" color="#05C341" size="30"></u-icon>
v-if="quesItem.clickAnswer&&quesItem.trueAnswer.includes(item.opValue)">
<u-icon class="mr15" name="checkmark-circle-fill" color="#05C341" size="32"></u-icon>
</template>
<template
v-else-if="quesItem.clickAnswer===item.op&&item.op!==quesItem.rightAnswer">
<u-icon class="mr15" name="close-circle-fill" color="red" size="30"></u-icon>
v-else-if="quesItem.clickAnswer&&quesItem.clickAnswer.includes(item.opValue)&&!quesItem.trueAnswer.includes(item.opValue)">
<u-icon class="mr15" name="close-circle-fill" color="red" size="32"></u-icon>
</template>
<template v-else-if="!item.chooseOption">
<view class="option_item">{{item.op}}</view>
@@ -29,17 +29,17 @@
<text class="fs18">{{item.opDesc}}</text>
</view>
<view class="m14lr mt30"
v-if="quesItem.clickAnswer&&quesItem.clickAnswer!==quesItem.rightOp || tCurrent===1">
v-if="quesItem.clickAnswer&&!quesItem.trueAnswer.includes(quesItem.clickAnswer) || tCurrent===1">
<view class="answer_box">
<text class="fs18 fw600 cor-000">答案:{{quesItem.rightOp}}</text>
<view class="fs18 cor-000" style="text-indent:2em;"> 这里是相关解释文字，这里是相关解释文字相关解释文字</view>
<text class="fs18 fw600 cor-000">答案:{{getRightOp(quesItem.trueAnswer)}}</text>
<view class="fs18 cor-000" style="text-indent:2em;"> {{quesItem.bestAnswer}}</view>
</view>
</view>
</view>
</scroll-view>
</swiper-item>
</swiper>
<view class="wp100 flex jc-sb ai-c p14 bc-fff" v-if="isShowAll" style="position: fixed;bottom: 0;left: 0;">
<view class="wp100 flex jc-sb ai-c p14 bc-fff" v-if="isShowAll" style="position: fixed;bottom: 0;left: 0;">
<view style="width: 220rpx;">
<button v-if="type==='practice'" class="btn">四步学科一</button>
<view v-else class="btn" style="text-align: center;" @tap="submitPaper">
@@ -219,7 +219,7 @@ export default {
rightList:[],
wrongList:[],
collectList:storage.get('collectList') || [],
questionList: [],//数据源
questionList: [{isCollect:true}],//数据源
swiperList: [], // 轮播图数据列表
swiperIndex: 0, // 轮播图当前位置
isChange: false, // 是否切换
@@ -228,10 +228,33 @@ export default {
}
},
onLoad() {
this.getQuestionList()
this.renderSwiper(0)
},
methods: {
//获取正确选项
getRightOp(val){
let rightOp=''
this.questionList[this.topicIndex].optionList.forEach(item=>{
if(this.questionList[this.topicIndex].trueAnswer.includes(item.opValue)){
if(rightOp){
rightOp=rightOp+'、'+item.op
}else{
rightOp=item.op
}
}
})
return rightOp
},
//获取题类型
getQuestType(val){
if(val=='1'){
return '判断'
}else if(val=='2'){
return '单选'
}else if(val=='3'){
return '多选'
}
},
//开通VIP
toVip(){
this.showVip=true
@@ -364,22 +387,37 @@ export default {
this.topicIndex = index;
this.renderSwiper(index);
},
isArrEqual(arr1, arr2){
return arr1.length === arr2.length && arr1.every((ele) => arr2.includes(ele));
},
//答题
answerQues(op, index) {
if (!this.questionList[this.topicIndex].clickAnswer) {
this.questionList[this.topicIndex].optionList[index].chooseOption = op
this.questionList[this.topicIndex].clickAnswer = op
}
const falseList =storage.get('wrongList') || []
const trueList =storage.get('rightList') || []
if (!this.questionList[this.topicIndex].clickAnswer) {
this.questionList[this.topicIndex].optionList[index].chooseOption =`${this.questionList[this.topicIndex].optionList[index].chooseOption?this.questionList[this.topicIndex].optionList[index].chooseOption:''}${op}`
this.questionList[this.topicIndex].clickAnswer = `${this.questionList[this.topicIndex].optionList[index].clickAnswer?this.questionList[this.topicIndex].optionList[index].clickAnswer:''}${op}`
}
if(this.tCurrent!==1){
if(this.questionList[this.topicIndex].clickAnswer===this.questionList[this.topicIndex].rightOp){
const arr1=this.questionList[this.topicIndex].clickAnswer.split('')
const arr2=this.questionList[this.topicIndex].trueAnswer.split('')
if(this.isArrEqual(arr1,arr2)){
if(!this.rightList.includes(this.questionList[this.topicIndex].questionId)){
this.rightList.push(this.questionList[this.topicIndex].questionId)
}
console.log(this.rightList);
if(!trueList.includes(this.questionList[this.topicIndex].questionId)){
trueList.push(this.questionList[this.topicIndex].questionId)
storage.set('rightList',trueList)
}
if(this.wrongList.includes(this.questionList[this.topicIndex].questionId)){
const wIndex=this.wrongList.indexOf(this.questionList[this.topicIndex].questionId)
this.wrongList.splice(wIndex,1)
}
if(falseList.includes(this.questionList[this.topicIndex].questionId)){
const wIndex=falseList.indexOf(this.questionList[this.topicIndex].questionId)
falseList.splice(wIndex,1)
storage.set('wrongList',falseList)
}
if(this.topicIndex<this.questionList.length-1){
this.topicIndex ++;
this.qIndex=this.topicIndex
@@ -403,6 +441,15 @@ export default {
if(!this.wrongList.includes(this.questionList[this.topicIndex].questionId)){
this.wrongList.push(this.questionList[this.topicIndex].questionId)
}
if(!falseList.includes(this.questionList[this.topicIndex].questionId)){
falseList.push(this.questionList[this.topicIndex].questionId)
storage.set('wrongList',falseList)
}
if(trueList.includes(this.questionList[this.topicIndex].questionId)){
const rIndex=trueList.indexOf(this.questionList[this.topicIndex].questionId)
trueList.splice(rIndex,1)
storage.set('wrongList',trueList)
}
}
}
},
@@ -411,309 +458,18 @@ export default {
this.getQuestionList()
this.renderSwiper(0)
},
getQuestionList() {
this.questionList = [{
questionId: 0,
questionTypeDesc: '单选',
questionDesc: '第一题，在实习期内驾驶机动车的，应当在车身后部粘贴或者悬挂哪种标志？',
optionList: [{
op: 'A',
opDesc: '注意新手标志'
}, {
op: 'B',
opDesc: '注意新手标志'
}, {
op: 'C',
opDesc: '注意新手标志'
}, {
op: 'D',
opDesc: '注意新手标志'
}],
rightOp: 'C',
}, {
questionId: 1,
questionTypeDesc: '单选',
questionDesc: '第二题，在实习期内驾驶机动车的，应当在车身后部粘贴或者悬挂哪种标志？',
optionList: [{
op: 'A',
opDesc: '注意新手标志'
}, {
op: 'B',
opDesc: '注意新手标志'
}, {
op: 'C',
opDesc: '注意新手标志'
}, {
op: 'D',
opDesc: '注意新手标志'
}],
rightOp: 'B',
}, {
questionId: 2,
questionTypeDesc: '单选',
questionDesc: '第三题，在实习期内驾驶机动车的，应当在车身后部粘贴或者悬挂哪种标志？',
optionList: [{
op: 'A',
opDesc: '注意新手标志'
}, {
op: 'B',
opDesc: '注意新手标志'
}, {
op: 'C',
opDesc: '注意新手标志'
}, {
op: 'D',
opDesc: '注意新手标志'
}],
rightOp: 'A',
},
{
questionId: 3,
questionTypeDesc: '单选',
questionDesc: '第四题，在实习期内驾驶机动车的，应当在车身后部粘贴或者悬挂哪种标志？',
optionList: [{
op: 'A',
opDesc: '注意新手标志'
}, {
op: 'B',
opDesc: '注意新手标志'
}, {
op: 'C',
opDesc: '注意新手标志'
}, {
op: 'D',
opDesc: '注意新手标志'
}],
rightOp: 'A',
}, {
questionId: 4,
questionTypeDesc: '单选',
questionDesc: '第5题，在实习期内驾驶机动车的，应当在车身后部粘贴或者悬挂哪种标志？',
optionList: [{
op: 'A',
opDesc: '注意新手标志'
}, {
op: 'B',
opDesc: '注意新手标志'
}, {
op: 'C',
opDesc: '注意新手标志'
}, {
op: 'D',
opDesc: '注意新手标志'
}],
rightOp: 'A',
},
{
questionId: 5,
questionTypeDesc: '单选',
questionDesc: '第6题，在实习期内驾驶机动车的，应当在车身后部粘贴或者悬挂哪种标志？',
optionList: [{
op: 'A',
opDesc: '注意新手标志'
}, {
op: 'B',
opDesc: '注意新手标志'
}, {
op: 'C',
opDesc: '注意新手标志'
}, {
op: 'D',
opDesc: '注意新手标志'
}],
rightOp: 'A',
}, {
questionId: 6,
questionTypeDesc: '单选',
questionDesc: '第7题，在实习期内驾驶机动车的，应当在车身后部粘贴或者悬挂哪种标志？',
optionList: [{
op: 'A',
opDesc: '注意新手标志'
}, {
op: 'B',
opDesc: '注意新手标志'
}, {
op: 'C',
opDesc: '注意新手标志'
}, {
op: 'D',
opDesc: '注意新手标志'
}],
rightOp: 'A',
}, {
questionId: 7,
questionTypeDesc: '单选',
questionDesc: '第8题，在实习期内驾驶机动车的，应当在车身后部粘贴或者悬挂哪种标志？',
optionList: [{
op: 'A',
opDesc: '注意新手标志'
}, {
op: 'B',
opDesc: '注意新手标志'
}, {
op: 'C',
opDesc: '注意新手标志'
}, {
op: 'D',
opDesc: '注意新手标志'
}],
rightOp: 'A',
}, {
questionId: 8,
questionTypeDesc: '单选',
questionDesc: '第9题，在实习期内驾驶机动车的，应当在车身后部粘贴或者悬挂哪种标志？',
optionList: [{
op: 'A',
opDesc: '注意新手标志'
}, {
op: 'B',
opDesc: '注意新手标志'
}, {
op: 'C',
opDesc: '注意新手标志'
}, {
op: 'D',
opDesc: '注意新手标志'
}],
rightOp: 'C',
}, {
questionId: 9,
questionTypeDesc: '单选',
questionDesc: '第10题，在实习期内驾驶机动车的，应当在车身后部粘贴或者悬挂哪种标志？',
optionList: [{
op: 'A',
opDesc: '注意新手标志'
}, {
op: 'B',
opDesc: '注意新手标志'
}, {
op: 'C',
opDesc: '注意新手标志'
}, {
op: 'D',
opDesc: '注意新手标志'
}],
rightOp: 'B',
}, {
questionId: 10,
questionTypeDesc: '单选',
questionDesc: '第11题，在实习期内驾驶机动车的，应当在车身后部粘贴或者悬挂哪种标志？',
optionList: [{
op: 'A',
opDesc: '注意新手标志'
}, {
op: 'B',
opDesc: '注意新手标志'
}, {
op: 'C',
opDesc: '注意新手标志'
}, {
op: 'D',
opDesc: '注意新手标志'
}],
rightOp: 'A',
},
{
questionId: 11,
questionTypeDesc: '单选',
questionDesc: '第12题，在实习期内驾驶机动车的，应当在车身后部粘贴或者悬挂哪种标志？',
optionList: [{
op: 'A',
opDesc: '注意新手标志'
}, {
op: 'B',
opDesc: '注意新手标志'
}, {
op: 'C',
opDesc: '注意新手标志'
}, {
op: 'D',
opDesc: '注意新手标志'
}],
rightOp: 'A',
}, {
questionId: 12,
questionTypeDesc: '单选',
questionDesc: '第13题，在实习期内驾驶机动车的，应当在车身后部粘贴或者悬挂哪种标志？',
optionList: [{
op: 'A',
opDesc: '注意新手标志'
}, {
op: 'B',
opDesc: '注意新手标志'
}, {
op: 'C',
opDesc: '注意新手标志'
}, {
op: 'D',
opDesc: '注意新手标志'
}],
rightOp: 'A',
},
{
questionId: 13,
questionTypeDesc: '单选',
questionDesc: '第14题，在实习期内驾驶机动车的，应当在车身后部粘贴或者悬挂哪种标志？',
optionList: [{
op: 'A',
opDesc: '注意新手标志'
}, {
op: 'B',
opDesc: '注意新手标志'
}, {
op: 'C',
opDesc: '注意新手标志'
}, {
op: 'D',
opDesc: '注意新手标志'
}],
rightOp: 'A',
}, {
questionId: 14,
questionTypeDesc: '单选',
questionDesc: '第15题，在实习期内驾驶机动车的，应当在车身后部粘贴或者悬挂哪种标志？',
optionList: [{
op: 'A',
opDesc: '注意新手标志'
}, {
op: 'B',
opDesc: '注意新手标志'
}, {
op: 'C',
opDesc: '注意新手标志'
}, {
op: 'D',
opDesc: '注意新手标志'
}],
rightOp: 'A',
}, {
questionId: 15,
questionTypeDesc: '单选',
questionDesc: '第16题，在实习期内驾驶机动车的，应当在车身后部粘贴或者悬挂哪种标志？',
optionList: [{
op: 'A',
opDesc: '注意新手标志'
}, {
op: 'B',
opDesc: '注意新手标志'
}, {
op: 'C',
opDesc: '注意新手标志'
}, {
op: 'D',
opDesc: '注意新手标志'
}],
rightOp: 'A',
}
]
if(this.tCurrent===1){
this.questionList=this.questionList.map(item=>{
return{
...item,
clickAnswer:item.rightOp
}
})
}
getQuestionList(val) {
console.log(val);
this.questionList=val.map(item=>{
let isCollect=false
if(this.collectList.includes(item.questionId)){
isCollect=true
}
return {
isCollect:isCollect,
...item
}
})
}
}
}

11
src/pages/questionBank/questionBank.vue
View File

@@ -3,7 +3,7 @@
<!-- <u-navbar :title="navTitle" @rightClick="rightClick" :autoBack="true">
</u-navbar> -->
<j-navbar>{{navTitle}}</j-navbar>
<Question :tabsList="tabsList" :isShowAll="true" />
<Question ref="question" :tabsList="tabsList" :isShowAll="true"></Question>
</view>
</template>
@@ -27,16 +27,21 @@
},{
label:"背题",
value:1
}]
}],
questionArr:[]
}
},
onLoad(op) {
if(op&&op.navTitle){
this.navTitle=op.navTitle
if(this.navTitle==='顺序答题'){
this.questionArr=[...this.orderQuestion]
this.$refs.question.getQuestionList(this.questionArr)
}
}
},
computed: {
...mapState(useQuestionStore, ["orderQuestionList"]) //映射函数，取出tagslist
...mapState(useQuestionStore, ["orderQuestion"]) //映射函数，取出tagslist
},
methods: {
rightClick() {

53
src/pages/questionBank/videoDetail.vue
View File

@@ -2,12 +2,18 @@
<view>
<sunny-video style="width: 100%" videoHeight="422rpx" ref="sunny-video" title="测试视频" src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20200317.mp4" @timeupdate="timeupdate" />
<view class="p14 bc-fff">
<u-scroll-list :indicator="false" v-if="videoType=='test'">
<view class="flex ai-c jc-sb mt15">
<view class="tab_iem mr15" :class="videoIndex===item.value?'checked_tab':''" v-for="(item,index) of testList" :key="index" @tap="checkTest(item.value)">{{item.label}}</view>
</view>
</u-scroll-list>
<view class="flex ai-c jc-sb mt10 wp100">
<text class="fs18 fw600 cor-000">C1捷达-基础操作视频讲解</text>
<view class="flex" @tap="popupShow=true">
<view class="flex" @tap="popupShow=true" v-if="videoType!='test'">
<text class="fs14 cor-666">更多</text>
<u-icon color="#666" name="arrow-right" size="18"></u-icon>
</view>
<view v-else class="fs14 cor-666">共9条路线</view>
</view>
<view>
</view>
@@ -53,6 +59,30 @@
export default{
data(){
return{
videoIndex:0,
testList:[{
label:"八一考场",
value:0,
},{
label:"富凯考场",
value:1
},{
label:"新亚考场",
value:2
},{
label:"庐江考场",
value:3
},{
label:"富凯考场",
value:4
},{
label:"新亚考场",
value:5
},{
label:"庐江考场",
value:6
}],
videoType:'',
popupShow:false,
nowVideo:0,
videoList:[{
@@ -82,7 +112,15 @@
}]
}
},
onLoad(op){
if(op.type){
this.videoType=op.type
}
},
methods:{
checkTest(val){
this.videoIndex=val
},
checkVideo(val){
this.nowVideo=val
}
@@ -130,4 +168,17 @@
background: #00B74F;
border-radius: 8rpx;
}
.tab_iem{
width: 145rpx;
height: 56rpx;
line-height: 56rpx;
text-align: center;
background: #F5F5F5;
border-radius: 10rpx;
color:#333
}
.checked_tab{
background: linear-gradient(90deg, #11DF20 0%, #01B74F 100%);
color:#fff
}
</style>