提交
This commit is contained in:
875
pages/selfStudy/selfStudy.vue
Normal file
875
pages/selfStudy/selfStudy.vue
Normal file
@@ -0,0 +1,875 @@
|
||||
<template style="">
|
||||
<view class="" style="background-color: #d4eaf0; min-height: calc(100vh); padding: 20rpx;">
|
||||
<public-module></public-module>
|
||||
<z-nav-bar :title="pagetitle" backState="2000">
|
||||
<text slot="right" style="padding-right: 20rpx; font-size: 26rpx; color: #666;"
|
||||
@click="showPopup = true">考试说明</text>
|
||||
</z-nav-bar>
|
||||
<!-- 有考试结果时候 -->
|
||||
<template v-if="exameResult.id">
|
||||
<view class="border_radius_10 haveResult">
|
||||
<view class="scoreBox">
|
||||
本次考试卷面成绩为:<text class="score PM_font">{{exameResult.score}} 分</text>
|
||||
</view>
|
||||
<view class="flex_box flex_between">
|
||||
<button type="primary" size="mini" @click="goToClass">返回课程</button>
|
||||
<button type="warn" size="mini" @click="goToPaper">查看试卷</button>
|
||||
</view>
|
||||
<view class="result_imgBox">
|
||||
<image src="../../static/jiesuan_Icon.jpg" mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<!-- 没有考试结果的时候 -->
|
||||
<template v-else>
|
||||
<view style="padding: 20rpx; " class="timeBox border_radius_10 flex_box flex_between align-items_box"
|
||||
v-if="secondTimeDif > 0">
|
||||
<!-- <view class=""> -->
|
||||
<view class="">
|
||||
<text><i style="color: #00aaff; font-style: normal; margin-right: 10rpx;" class="">{{curIndex1+1}}
|
||||
</i> / {{testPaper.length}}</text>
|
||||
<text class="checkQuestBtn small_btn border_radius_10" @click="showQuestIndex = true">全部题目</text>
|
||||
</view>
|
||||
<view class="flex_box align-items_box" v-if="secondTimeDif > 0">
|
||||
<view class="">
|
||||
剩余时间:
|
||||
</view>
|
||||
<view class="">
|
||||
<uni-countdown @timeup="timeup" :font-size="20" :show-day="false"
|
||||
:hour="timeDif.hour"
|
||||
:minute="timeDif.minutes"
|
||||
:second="timeDif.second"
|
||||
color="#ffaa7f" />
|
||||
</view>
|
||||
</view>
|
||||
<!-- </view> -->
|
||||
<!-- <pre>{{testPaper}}</pre> -->
|
||||
</view>
|
||||
<view class="question border_radius_10" v-if="curQuestion.id">
|
||||
<view class="">
|
||||
<text class="questionType">{{curQuestion.type == 0 ? '单选题' : '多选题'}}</text>
|
||||
<!-- <text class="checkQuestBtn small_btn border_radius_10" @click="showQuestIndex = true">检查</text> -->
|
||||
<view class="questionItem" v-if="curQuestion.id">
|
||||
<view class="">
|
||||
<text>{{curQuestion.content}}</text>
|
||||
</view>
|
||||
<view class="optionsBox">
|
||||
<view
|
||||
:class="['item','border_radius_10',curQuestion.answerIds.includes(item.id) ? 'choosed' : '']"
|
||||
@click="clickOption(item, index)" v-for="(item, index) in curQuestion.options"
|
||||
:key="index">
|
||||
<text>{{item.content}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="btnBox " style="overflow: hidden;">
|
||||
<view class="flex_box flex_between">
|
||||
<view class="item">
|
||||
<button @click="showPrevQuestion" type="default" plain="true" :disabled="curIndex1 == 0"
|
||||
size="mini">上一题</button>
|
||||
</view>
|
||||
<view class="item" v-show="curIndex1 == testPaper.length-1 && !isOvertime">
|
||||
<button @click="sumitAnswer" type="primary" size="mini">交 卷</button>
|
||||
</view>
|
||||
<view class="item">
|
||||
<button @click="showNextQuestion" type="primary"
|
||||
:disabled="curIndex1 == testPaper.length-1" size="mini">下一题</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<u-popup key="1" :show="showPopup" :round="10" @close="hidePopup">
|
||||
<view class="guanli">
|
||||
<h3>考试说明</h3>
|
||||
<view class="tips border_radius_10">
|
||||
<text>①、每位学员共有两次考试的机会,如第一次考试成绩达标则不用进行第二次的考试,请认真对待每次考试;<br />
|
||||
②、请在倒计时结束前完成答题,倒计时结束后将自动交卷。</text>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
<u-popup key="2" :show="showQuestIndex" :round="10" @close="hidePopup">
|
||||
<view class="guanli">
|
||||
<h3>题目索引</h3>
|
||||
<view class="" style="text-align: center; font-size: 28rpx; line-height: 50rpx; color: #666;">
|
||||
<text>红框标识未作答,绿色框标识已选定答案,灰色框标识您未查看的题目</text>
|
||||
</view>
|
||||
<view class="">
|
||||
<view class="questIndx questIndxPup flex_box">
|
||||
<!-- <scroll-view class="scroll-view_H" scroll-x="true">
|
||||
<view class="scroll-view-item_H" v-for="index of getallLIst" :key="index"> -->
|
||||
<text v-for="index of getallLIst" @click="clickIndex(index)" :key="index"
|
||||
:class="[ haveAnswerList.includes(index-1) ? 'green' : '', noAnswerList.includes(index-1) ? 'red' : '',(curIndex1+1) == index ? 'cur' :'']">{{index}}</text>
|
||||
<!-- </view>
|
||||
</scroll-view> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
<u-popup :show="protocolShow" mode="center" round="6" :key="3">
|
||||
<view class="popup_box">
|
||||
<view class="title">温馨提示</view>
|
||||
<view class="content">
|
||||
<view class="center">
|
||||
用户您好,本次考试时间为 <text style="color: red; font-weight: bold; font-size: 30rpx;">{{testDuration}}</text> 分钟<br />
|
||||
<view style="color: red; font-weight: bold"> 注: </view>
|
||||
<view>
|
||||
<text>①、每位学员共有两次考试的机会,如第一次考试成绩达标则不用进行第二次的考试,请认真对待每次考试;<br />
|
||||
②、请在倒计时结束前完成答题,倒计时结束后将自动交卷;</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="button_box">
|
||||
<u-button size="small" text="稍后再考" @click="cancelClick"></u-button>
|
||||
<u-button text="开始考试" color="#258feb" size="small" @click="onHandleClickBuy"></u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import $http from '@/config/requestConfig.js';
|
||||
import debounce from "@/common/debounce.js";
|
||||
import {
|
||||
mapState,mapMutations
|
||||
} from "vuex";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
testDuration:'45', // 考试时长
|
||||
protocolShow:false,
|
||||
flag:false,
|
||||
showPopup: false,
|
||||
code: 0, // 英文code
|
||||
courseId: undefined,
|
||||
testPaper: [],
|
||||
curQuestion: {
|
||||
answerIds: []
|
||||
},
|
||||
result: {}, // 考试结果
|
||||
curIndex1: 0,
|
||||
paperCreateTime: 0,
|
||||
examId: undefined,
|
||||
endTime: undefined, // 结束时间戳
|
||||
timeDif:{}, // 时间差(结束 - 现在)
|
||||
isOvertime: false, // 是否超时
|
||||
step: 8, /// 步长
|
||||
// questIndexList: [],
|
||||
nowPart: 1,
|
||||
|
||||
maxNumber: 0,
|
||||
minNumber: 0,
|
||||
noAnswerList: [],
|
||||
haveAnswerList:[],
|
||||
exameResult:{},
|
||||
showQuestIndex:false,
|
||||
secondTimeDif:undefined,
|
||||
pagetitle:'', // 页面标题
|
||||
}
|
||||
},
|
||||
async onLoad(e) {
|
||||
console.log('收到得值',e);
|
||||
this.courseId = e.id
|
||||
// this.testDuration = e.testDuration
|
||||
this.protocolShow = true
|
||||
this.pagetitle = '准备考试'
|
||||
},
|
||||
onHide() {
|
||||
if (!this.isOvertime) {}
|
||||
},
|
||||
onShow() {
|
||||
// this.endTime = this.hourUp(1)
|
||||
// console.log('this.endTime', this.endTime.getTime());
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (!this.isOvertime) { // 如果中途退出
|
||||
// this.giveZero()
|
||||
}
|
||||
|
||||
},
|
||||
computed: {
|
||||
...mapState(["userInfo"]),
|
||||
getallLIst() {
|
||||
const numbers = Array.from(Array(this.testPaper.length).keys(), n => n + 1);
|
||||
console.log('numbers', numbers);
|
||||
return numbers
|
||||
}
|
||||
|
||||
},
|
||||
methods: {
|
||||
...mapMutations(['setPaperEndTime']),
|
||||
cancelClick(){
|
||||
this.protocolShow = false
|
||||
uni.navigateBack({
|
||||
delta: 2
|
||||
});
|
||||
// uni.navigateTo({
|
||||
// url: `/pages/course/courseDetail?id=${this.courseId}`
|
||||
// })
|
||||
},
|
||||
onHandleClickBuy(){ // 确定开始考试
|
||||
debounce(async () => {
|
||||
this.protocolShow = false
|
||||
if (this.testPaper.length <= 0) {
|
||||
this.pagetitle = '获取试卷'
|
||||
this.getTestPage()
|
||||
}else{
|
||||
uni.showToast({
|
||||
title:'页面发生错误,请退出后重新进入页面或联系客服人员',
|
||||
icon:'none',
|
||||
duration:3000
|
||||
})
|
||||
}
|
||||
},300)
|
||||
},
|
||||
// 获取服务器时间
|
||||
async getServerTime() {
|
||||
var time = 0
|
||||
await $http.request({
|
||||
url: "common/classExam/getServerTime",
|
||||
method: "POST",
|
||||
data: {},
|
||||
header: { //默认 无 说明:请求头
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
})
|
||||
.then(async (res) => {
|
||||
if (res.code == 0) {
|
||||
time = res.serverTime
|
||||
} else {
|
||||
time = -1
|
||||
}
|
||||
}).catch(e => {
|
||||
time = -1
|
||||
});
|
||||
return time
|
||||
},
|
||||
// 单个题的提交
|
||||
saveQuestAnswer(paperId,questIndex,ids){
|
||||
console.log('收到的值',paperId,questIndex,ids);
|
||||
$http.request({
|
||||
url: "common/classExam/submitOption",
|
||||
method: "POST",
|
||||
data: {
|
||||
"id": paperId, //试卷id
|
||||
"no": questIndex, // 提索引 1....
|
||||
"answer": ids // 答案id
|
||||
},
|
||||
header: { //默认 无 说明:请求头
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
})
|
||||
.then(res => {
|
||||
|
||||
if (res.code == 0) {
|
||||
console.log('提交成功');
|
||||
}else{
|
||||
uni.showToast({
|
||||
title: e.errMsg,
|
||||
icon: 'error'
|
||||
})
|
||||
}
|
||||
|
||||
}).catch(e => {
|
||||
console.log(e, '数据报错')
|
||||
uni.showToast({
|
||||
title: e.errMsg,
|
||||
icon: 'error'
|
||||
})
|
||||
});
|
||||
},
|
||||
getNoAnswerList() {
|
||||
var list = []
|
||||
// if (this.curIndex1 > 0) {
|
||||
for (var i = 0; i < this.testPaper.length; i++) {
|
||||
if (this.testPaper[i].answerIds.length == 0 && this.testPaper[i].hadOpend) {
|
||||
console.log('fuhe?');
|
||||
list.push(i)
|
||||
}
|
||||
}
|
||||
// }
|
||||
return list
|
||||
},
|
||||
gethaveAnswerList() {
|
||||
var list = []
|
||||
// if (this.curIndex1 > 0) {
|
||||
for (var i = 0; i < this.testPaper.length; i++) {
|
||||
if (this.testPaper[i].answerIds.length > 0 && this.testPaper[i].hadOpend) {
|
||||
// console.log('fuhe?');
|
||||
list.push(i)
|
||||
}
|
||||
}
|
||||
// }
|
||||
return list
|
||||
},
|
||||
// 倒计时结束 (超时)
|
||||
timeup() {
|
||||
this.isOvertime = true
|
||||
this.sumbitPaper()
|
||||
let that = this
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: "考试结束,系统已为您自动交卷,点击按钮返回课程",
|
||||
confirmText: '知道了',
|
||||
showCancel: false,
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
// that.goToClass()
|
||||
uni.navigateTo({
|
||||
url: `/pages/course/courseDetail?id=${that.courseId}`
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
goToPaper(){
|
||||
uni.navigateTo({
|
||||
url: `/pages/miniClass/paperBack?id=${this.examId}`
|
||||
})
|
||||
|
||||
},
|
||||
// 获取交卷数据
|
||||
sumitAnswer() {
|
||||
debounce(async () => {
|
||||
let that = this
|
||||
// this.noAnswerList = await this.getNoAnswerList()
|
||||
if(this.noAnswerList.length > 0){
|
||||
this.showQuestIndex = true
|
||||
uni.showModal({
|
||||
title:'提示',
|
||||
content:'您有未作答的题目,是否继续交卷操作?',
|
||||
cancelText:'点错了',
|
||||
confirmText:'确定',
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
that.sumbitPaper()
|
||||
}
|
||||
},
|
||||
})
|
||||
}else{
|
||||
that.sumbitPaper()
|
||||
}
|
||||
},300)
|
||||
},
|
||||
// q请求提交试卷
|
||||
sumbitPaper(ids) {
|
||||
let that = this
|
||||
if(that.flag){
|
||||
return
|
||||
}
|
||||
that.flag = true
|
||||
uni.showLoading({
|
||||
title:'正在交卷'
|
||||
})
|
||||
$http.request({
|
||||
url: "common/classExam/submitExamPaper",
|
||||
method: "POST",
|
||||
data: {
|
||||
id: that.examId
|
||||
},
|
||||
header: { //默认 无 说明:请求头
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
})
|
||||
.then(res => {
|
||||
uni.hideLoading()
|
||||
if (res.code == 0) {
|
||||
console.log('交卷结果',res);
|
||||
uni.showToast({
|
||||
title: '交卷成功',
|
||||
icon: 'success'
|
||||
})
|
||||
setTimeout( ()=>{
|
||||
that.exameResult = res.examPaper
|
||||
// this.timeup()
|
||||
that.showQuestIndex = false
|
||||
that.secondTimeDif = 0
|
||||
that.isOvertime = true
|
||||
uni.setStorage({
|
||||
key:'paperEndTime',
|
||||
data:{
|
||||
time: 0,
|
||||
examId: undefined
|
||||
},
|
||||
success: function () {
|
||||
console.log('时间存储成功');
|
||||
}
|
||||
})
|
||||
|
||||
},300)
|
||||
}else{
|
||||
that.flag = false
|
||||
uni.showToast({
|
||||
title: e.errMsg,
|
||||
icon: 'error'
|
||||
})
|
||||
}
|
||||
|
||||
}).catch(e => {
|
||||
that.flag = false
|
||||
uni.hideLoading()
|
||||
console.log(e, '数据报错')
|
||||
// this.status = 3
|
||||
uni.showToast({
|
||||
title: e.errMsg,
|
||||
icon: 'error'
|
||||
})
|
||||
});
|
||||
},
|
||||
showPrevQuestion() {
|
||||
// 上一题
|
||||
this.curIndex1--
|
||||
// this.curQuestion.answerIds = []
|
||||
this.curQuestion = {
|
||||
...this.testPaper[this.curIndex1]
|
||||
}
|
||||
this.testPaper[this.curIndex1].hadOpend = true
|
||||
console.log('----------------', this.testPaper );
|
||||
this.noAnswerList = this.getNoAnswerList()
|
||||
this.haveAnswerList = this.gethaveAnswerList()
|
||||
},
|
||||
showNextQuestion() {
|
||||
debounce(async () => {
|
||||
// 下一题
|
||||
this.curIndex1++
|
||||
// this.curQuestion.answerIds = []
|
||||
this.curQuestion = {
|
||||
...this.testPaper[this.curIndex1]
|
||||
}
|
||||
this.testPaper[this.curIndex1].hadOpend = true
|
||||
// console.log('+++++++++++++++', this.testPaper, );
|
||||
this.noAnswerList = this.getNoAnswerList()
|
||||
this.haveAnswerList = this.gethaveAnswerList()
|
||||
},300)
|
||||
},
|
||||
clickOption(item, index) {
|
||||
// debounce(async () => {
|
||||
console.log('item', item, index, this.curIndex1);
|
||||
if (this.curQuestion.type == 0) {
|
||||
this.testPaper[this.curIndex1].answerIds = [item.id]
|
||||
this.curQuestion.answerIds = [item.id]
|
||||
// console.log('666666666', this.testPaper, this.curQuestion.answerIds);
|
||||
this.$forceUpdate()
|
||||
} else if (this.curQuestion.type == 1) {
|
||||
console.log('多选');
|
||||
var isIN = this.curQuestion.answerIds.findIndex(itemss => {
|
||||
return itemss == item.id
|
||||
})
|
||||
if (isIN >= 0) {
|
||||
console.log('有重复的,删除对应的', isIN);
|
||||
this.testPaper[this.curIndex1].answerIds.splice(isIN, 1)
|
||||
this.curQuestion.answerIds.splice(isIN, 1)
|
||||
} else {
|
||||
this.testPaper[this.curIndex1].answerIds.push(item.id)
|
||||
|
||||
this.curQuestion.answerIds = [...this.testPaper[this.curIndex1].answerIds]
|
||||
}
|
||||
}
|
||||
this.noAnswerList = this.getNoAnswerList()
|
||||
this.haveAnswerList = this.gethaveAnswerList()
|
||||
console.log('this.testPaper.',this.testPaper.id);
|
||||
this.saveQuestAnswer(this.examId,this.curIndex1+1,this.curQuestion.answerIds.join(','))
|
||||
console.log('noAnswerList', this.noAnswerList)
|
||||
// },300)
|
||||
},
|
||||
setDesc() {
|
||||
const letterArr = []
|
||||
// 字母A的code值是65,但因为已经到字母D了,所以直接从69E开始循环
|
||||
for (let i = 65; i < 91; i++) {
|
||||
letterArr[i] = String.fromCharCode(i)
|
||||
}
|
||||
return letterArr
|
||||
},
|
||||
async getTestPage() {
|
||||
uni.showLoading({
|
||||
title: '正在生成试卷'
|
||||
})
|
||||
console.log('this.courseId',this.courseId);
|
||||
await $http.request({
|
||||
url: "common/classExam/generateExamPaper",
|
||||
method: "POST",
|
||||
data: {
|
||||
// "classId":
|
||||
"type":"2",//考试类型 1小班 2自考
|
||||
"relationId": parseInt(this.courseId), //小班id、课程id
|
||||
},
|
||||
header: { //默认 无 说明:请求头
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
})
|
||||
.then(async res => {
|
||||
uni.hideLoading()
|
||||
if (res.code == 0) {
|
||||
// that.isHave = true
|
||||
res.examPaper.forEach(item => {
|
||||
item.answerIds = []
|
||||
item.hadOpend = false // 是否呗打开过
|
||||
var code = 0
|
||||
item.options.forEach(item1 => {
|
||||
const randomAbc = this.setDesc().splice(65)
|
||||
item1.content = randomAbc[code] + '、' + item1.content
|
||||
code++
|
||||
})
|
||||
})
|
||||
this.testPaper = res.examPaper
|
||||
this.examId = res.id
|
||||
this.paperCreateTime = 1
|
||||
this.endTime = res.planEndTime
|
||||
var severNowTime = await this.getServerTime()
|
||||
this.secondTimeDif = this.endTime - severNowTime // 时间差 毫秒
|
||||
let that = this
|
||||
if(this.secondTimeDif > 0){
|
||||
this.timeDif.hour = parseInt((this.secondTimeDif % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60))
|
||||
this.timeDif.minutes = parseInt((this.secondTimeDif % (1000 * 60 * 60)) / (1000 * 60))
|
||||
this.timeDif.second = (this.secondTimeDif % (1000 * 60)) / 1000
|
||||
console.log('this.endTime',this.timeDif.hour, this.timeDif.minutes, this.timeDif.second);
|
||||
}else{
|
||||
uni.showModal({
|
||||
title:'提示',
|
||||
content:'您的时间已经结束,即将返回课程页面',
|
||||
confirmText:'好的',
|
||||
showCancel:fals,
|
||||
success: (res) => {
|
||||
if(res.confirm){
|
||||
that.goToClass()
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
this.curQuestion = {
|
||||
...this.testPaper[this.curIndex1]
|
||||
}
|
||||
this.testPaper[this.curIndex1].hadOpend = true
|
||||
uni.showToast({
|
||||
title: '获取成功',
|
||||
icon: 'success'
|
||||
})
|
||||
console.log(res, '试卷', this.curQuestion)
|
||||
this.pagetitle = '正在考试'
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.errMsg,
|
||||
icon: 'none',
|
||||
duration: 3000
|
||||
})
|
||||
}
|
||||
|
||||
}).catch(e => {
|
||||
uni.hideLoading()
|
||||
console.log(e, '数据报错')
|
||||
// this.status = 3
|
||||
uni.showToast({
|
||||
title: e.errMsg,
|
||||
icon: 'none',
|
||||
duration: 3000
|
||||
})
|
||||
setTimeout(()=>{
|
||||
this.goToClass()
|
||||
},1000)
|
||||
});
|
||||
},
|
||||
giveZero() {
|
||||
// 没有完成完成考试,记为0分
|
||||
},
|
||||
showElart() {
|
||||
// uni.showModal({
|
||||
// title:'提示',
|
||||
// content:"您还没有完成考试,确定要离开吗?离开后成绩会记为0分,是否继续?"
|
||||
// })
|
||||
},
|
||||
goToClass() {
|
||||
uni.navigateTo({
|
||||
url: `/pages/course/courseDetail?id=${this.courseId}`
|
||||
})
|
||||
},
|
||||
hidePopup() {
|
||||
this.showPopup = false
|
||||
this.showQuestIndex = false
|
||||
},
|
||||
clickIndex(val) {
|
||||
this.curIndex1 = val - 1
|
||||
console.log('val', val, this.curIndex1, this.testPaper.length);
|
||||
for (var i = 0; i < this.curIndex1; i++) {
|
||||
this.testPaper[i].hadOpend = true
|
||||
}
|
||||
this.curQuestion = this.testPaper[this.curIndex1]
|
||||
this.testPaper[this.curIndex1].hadOpend = true
|
||||
this.hidePopup()
|
||||
this.noAnswerList = this.getNoAnswerList()
|
||||
this.haveAnswerList = this.gethaveAnswerList()
|
||||
},
|
||||
hourUp(start,e) {
|
||||
// 比现在多几个小时
|
||||
// var end = Date.now()
|
||||
var startTimeDate = new Date(start)
|
||||
var startTime = startTimeDate.getTime();
|
||||
var step = 1000 * 60 * 60 * e // 时间间隔
|
||||
var interval = startTime + step; //开始 + 时长 = 结束的毫秒数
|
||||
// var a = new Date(interval)
|
||||
console.log('aaaaaaaaaa结束时间的毫秒数,时间戳',interval);
|
||||
return interval
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "@/style/mixin.scss";
|
||||
.popup_box {
|
||||
padding-bottom: 20rpx;
|
||||
width: 85vw;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
height: auto;
|
||||
|
||||
.title {
|
||||
font-family: PangMenZhengDaoBiaoTiTiMianFeiBan;
|
||||
font-weight: normal;
|
||||
font-size: 46rpx;
|
||||
color: $themeColor;
|
||||
background-color: #f5f5f5;
|
||||
// line-height: 46rpx;
|
||||
padding: 20rpx;
|
||||
// border-leradius: 6px;
|
||||
border-top-left-radius: 6px;
|
||||
border-top-right-radius: 6px;
|
||||
}
|
||||
|
||||
.content {
|
||||
font-size: 26rpx;
|
||||
letter-spacing: 0.15rpx;
|
||||
padding: 20rpx;
|
||||
color: #3f3f3f;
|
||||
|
||||
.top {
|
||||
margin: 30rpx 0;
|
||||
}
|
||||
|
||||
.center {
|
||||
line-height: 40rpx;
|
||||
// padding:0 10rpx;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
width: 100%;
|
||||
margin-top: 60rpx;
|
||||
|
||||
font-size: 24rpx;
|
||||
line-height: 26rpx;
|
||||
color: #b0b0b0;
|
||||
}
|
||||
}
|
||||
|
||||
.button_box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 20rpx;
|
||||
|
||||
.u-button {
|
||||
margin-left: 40rpx;
|
||||
}
|
||||
|
||||
.u-button:nth-child(1) {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.questIndx { overflow: hidden;
|
||||
margin-top: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
span{padding: 20rpx 0; display: inline-block;}
|
||||
.red{border-color: #f56c6c; color: #f56c6c;}
|
||||
.green{
|
||||
border-color: #67c23a; color: #67c23a;
|
||||
}
|
||||
text {
|
||||
font-size: 28rpx;
|
||||
background-color: #fff;
|
||||
// padding: 6rpx 10rpx;
|
||||
display: flex;
|
||||
// justify-content: center;
|
||||
border-radius: 10rpx;
|
||||
// align-items: center;
|
||||
width: 70rpx;
|
||||
height: 70rpx;
|
||||
line-height: 70rpx;
|
||||
text-align: center;
|
||||
border: 1px solid #eee;
|
||||
}
|
||||
|
||||
.cur {
|
||||
background-color: #409eff;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.guanli {
|
||||
padding: 40rpx;
|
||||
max-height: 60vh;
|
||||
overflow-y: scroll;
|
||||
h3 {
|
||||
text-align: center;
|
||||
margin-bottom: 20rpx;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
|
||||
.tips {
|
||||
background: #fbe8e8;
|
||||
color: #f56c6c;
|
||||
line-height: 50rpx;
|
||||
font-size: 28rpx;
|
||||
padding: 10rpx 20rpx;
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
.questionType {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 20rpx;
|
||||
background-color: $themeColor;
|
||||
color: #fff;
|
||||
padding: 10rpx 20rpx;
|
||||
border-radius: 0 50rpx 50rpx 0;
|
||||
}
|
||||
.checkQuestBtn {
|
||||
margin-left: 10rpx;
|
||||
// position: absolute;
|
||||
// right: 20rpx;
|
||||
// top: 20rpx;
|
||||
font-size: 28rpx;
|
||||
// border: 1px solid $themeColor;
|
||||
background-color: #409eff;
|
||||
color: #fff;
|
||||
// padding: 10rpx 20rpx;
|
||||
// border-radius: 0 50rpx 50rpx 0;
|
||||
}
|
||||
// .checkQuestBtn {
|
||||
// position: absolute;
|
||||
// right: 20rpx;
|
||||
// top: 20rpx;
|
||||
// border: 1px solid $themeColor;
|
||||
// color: $themeColor;
|
||||
// // padding: 10rpx 20rpx;
|
||||
// // border-radius: 0 50rpx 50rpx 0;
|
||||
// }
|
||||
.scroll-Y {
|
||||
height: 300rpx;
|
||||
}
|
||||
|
||||
.scroll-view_H {
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scroll-view-item {
|
||||
// height: 300rpx;
|
||||
line-height: 300rpx;
|
||||
text-align: center;
|
||||
font-size: 36rpx;
|
||||
}
|
||||
|
||||
.scroll-view-item_H {
|
||||
display: inline-block;
|
||||
width: 13%;
|
||||
// height: 300rpx;
|
||||
overflow: hidden;
|
||||
// line-height: 300rpx;
|
||||
text-align: center;
|
||||
font-size: 36rpx;
|
||||
}
|
||||
|
||||
.haveResult {
|
||||
background-color: #fff;
|
||||
padding: 20rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.scoreBox {
|
||||
margin-top: 100rpx;
|
||||
color: #333;
|
||||
margin-bottom: 50rpx;
|
||||
}
|
||||
|
||||
.score {
|
||||
font-size: 50rpx;
|
||||
}
|
||||
|
||||
.question {
|
||||
padding: 20rpx;
|
||||
padding-top: 100rpx;
|
||||
background-color: #fff;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.optionsBox {
|
||||
margin: 30rpx 0;
|
||||
|
||||
.item {
|
||||
border: 1px solid #eee;
|
||||
padding: 20rpx 16rpx;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.choosed {
|
||||
border-color: #b3d8ff;
|
||||
color: #409eff;
|
||||
background-color: #ecf5ff;
|
||||
}
|
||||
|
||||
.right {
|
||||
border-color: #c2e7b0;
|
||||
color: #67c23a;
|
||||
background-color: #f0f9eb;
|
||||
}
|
||||
|
||||
.wrong {
|
||||
border-color: #fbc4c4;
|
||||
color: #f56c6c;
|
||||
background-color: #fef0f0;
|
||||
}
|
||||
}
|
||||
|
||||
.result_imgBox {
|
||||
width: 100%;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.timeBox {
|
||||
background-color: #fff;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.questIndx {
|
||||
|
||||
.cur {
|
||||
border-color:#409eff ;
|
||||
background-color: #409eff;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.questIndxPup{
|
||||
justify-content: space-around;
|
||||
flex-wrap: wrap;
|
||||
text{
|
||||
display: inline-block; margin: 10rpx;
|
||||
}
|
||||
}
|
||||
.btnBox {
|
||||
.item {
|
||||
width: 40%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user