Skip to content

C
center-exam-show
提交 af99a9de authored 作者: lihuihui's avatar lihuihui
浏览文件
操作

页面功能开发，提测版本

上级 b98afc5c
全部展开 隐藏空白字符变更
内嵌 并排
正在显示 包含 375 行增加 和 88 行删除
src/action/examAction.js 0 → 100644
浏览文件 @ af99a9de
import BaseACTION from './base_action'
import { Exam } from '@api'
export default class LoginAction extends BaseACTION {
/* 获取考试信息 */
getTopic (examId) { return Exam.getTopic(examId).then(res => res) }
/* 缓存考试 */
setCache (examId, obj) { return Exam.setCache(examId, obj).then(res => res) }
/* 获取缓存 */
getCache (examId) { return Exam.getCache(examId).then(res => res) }
/* 结束考试 */
endExam (examId, obj) { return Exam.endExam(examId, obj).then(res => res) }
/* 进入考试 */
// userLogin (obj) { return Exam.userLogin(obj).then(res => res) }
/* 确认信息 */
// confirmInfo (obj) { return Exam.confirmInfo(obj).then(res => res) }
// /* post传输方式 */
// postTest (obj = {}) {
// return Login.postTest(obj).then(res => {
// return res || { test: 'OK' }
// }).catch(res => {
// return res || { test: 'OK' }
// })
// }
// /* 当前登录用户，检测是否该系统有权限 */
// getInfo () {
// return Login.getInfo().then(res => {
// return res || { test: 'OK' }
// }).catch(res => {
// return res || { test: 'OK' }
// })
// }
}
src/action/index.js
浏览文件 @ af99a9de
import TestAction from './TestAction' import TestAction from './TestAction'
import LoginAction from './LoginAction' import LoginAction from './LoginAction'
import ExamAction from './ExamAction'
const Test = new TestAction() const Test = new TestAction()
const Login = new LoginAction() const Login = new LoginAction()
const Exam = new ExamAction()
const cAction = { const cAction = {
Test, Test,
Login Login,
Exam
} }
export default cAction export default cAction
src/api/exam_api.js 0 → 100644
浏览文件 @ af99a9de
import BaseAPI from './base_api'
export default class ExamAPI extends BaseAPI {
/**
* 获取考试信息
* @param {[string]} examId resource_id
*/
getTopic = (examId) => this.get(`/ehall/v1/exam/sheet/${examId}`, {})
/* 缓存考试 */
setCache = (examId = {}, obj = {}) => this.post(`/ehall/v1/exam/cache/${examId}`, obj, { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } })
/* 获取缓存 */
getCache = (examId) => this.get(`/ehall/v1/exam/cache/${examId}`, {})
/* 缓存考试 */
endExam = (examId = {}, obj = {}) => this.post(`/ehall/v1/exam/sheet/${examId}`, obj, { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } })
/**
* 进入考试
*/
// userLogin = (obj = {}) => this.post('/ehall/v1/user/login', obj, { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } })
// confirmInfo = (obj = {}) => this.post('/ehall/v1/user/confirm', obj, { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } })
// /**
// * post传输方式
// * @param {[object]} obj
// */
// postTest = (obj = {}) => this.post('/passport/rest/login', obj, { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } })
// /**
// * 当前登录用户，检测是否该系统有权限
// */
// getInfo = () => this.post('/user_center/get_user_info', {}, { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } })
}
src/api/index.js
浏览文件 @ af99a9de
import TestAPI from './test_api' import TestAPI from './test_api'
import LoginAPI from './login_api' import LoginAPI from './login_api'
import ExamAPI from './exam_api'
const Test = new TestAPI(webConf) const Test = new TestAPI(webConf)
const Login = new LoginAPI(webConf) const Login = new LoginAPI(webConf)
const Exam = new ExamAPI(webConf)
export { export {
Test, Test,
Login Login,
Exam
} }
src/components/exam/answerCard.vue
浏览文件 @ af99a9de
...@@ -2,75 +2,90 @@ ...@@ -2,75 +2,90 @@
<div> <div>
<div class="info"> <div class="info">
<div class="shape"> <div class="shape">
<img src="https://zws-imgs-pub.ezijing.com/static/public/f2f02f49c3a107e7bf3201c91e29894e.jpg" alt=""> <img :src="info.id_photo" alt="">
</div> </div>
<div class="right"> <div class="right">
<div class="name">陈泽亚</div> <div class="name">{{ info.name }}</div>
<div class="code">CzY1689367</div> <div class="code">{{ info.examinee_number }}</div>
</div> </div>
</div> </div>
<div class="order-num"> <div class="order-num">
<div class="tit">单选题</div> <template v-for="(item, index) in questionParams.question.question_items">
<ul> <div :key="index" v-if="item.question_item_type != 5">
<li <div class="tit">{{ item.question_item_title }}</div>
@click="go(1)" <ul>
:class="questionParams.questionIndex === 0 <template v-for="(cItem, cIndex) in item.question_list">
? questionParams.answerRecord['1'] ? 'stu1 stu2' : 'stu2' <!-- stu1已答 stu2当前 stu3标记 -->
: questionParams.answerRecord['1'] ? 'stu1' : ''">1</li> <li
<!-- stu1已答 stu2当前 stu3标记 --> :key="cItem.q_order + '-' + cIndex"
<!-- questionParams.answerRecord['1'] ? 'stu1' : '' questionParams.questionIndex === 0 ? 'stu2' : ''--> @click="goQuestion(cItem.q_order)"
<!-- <li class="stu1">1</li> :class="questionParams.questionIndex + 1 === cItem.q_order
<li class="stu1">2</li> ? questionParams.answerRecord[item.question_item_id]
<li class="stu1 stu2 stu3">3</li> ? questionParams.answerRecord[item.question_item_id][cItem.id]
<li>4</li> --> ? questionParams.answerRecord[item.question_item_id][cItem.id].answer.length !== 0
<!-- <li class="stu1">1</li> ? questionParams.answerRecord[item.question_item_id][cItem.id].sign
<li class="stu1">2</li> ? 'stu1 stu2 stu3'
<li class="stu1 stu2 stu3">3</li> : 'stu1 stu2'
<li>4</li> --> : questionParams.answerRecord[item.question_item_id][cItem.id].sign
</ul> ? 'stu2 stu3'
<div class="tit">多选题</div> : 'stu2'
<ul> : 'stu2'
<li : 'stu2'
@click="go(2)" : questionParams.answerRecord[item.question_item_id]
:class="questionParams.questionIndex === 1 ? questionParams.answerRecord[item.question_item_id][cItem.id]
? questionParams.answerRecord['2'] ? questionParams.answerRecord['2'].answer.length ? 'stu1 stu2' : 'stu2' : 'stu2' ? questionParams.answerRecord[item.question_item_id][cItem.id].answer.length !== 0
: questionParams.answerRecord['2'] ? questionParams.answerRecord['2'].answer.length ? 'stu1' : '' : ''">2</li> ? questionParams.answerRecord[item.question_item_id][cItem.id].sign
</ul> ? 'stu1 stu3'
<div class="tit">判断题</div> : 'stu1'
<ul> : questionParams.answerRecord[item.question_item_id][cItem.id].sign
<li ? 'stu3'
@click="go(3)" : ''
:class="questionParams.questionIndex === 2 : ''
? questionParams.answerRecord['3'] ? 'stu1 stu2' : 'stu2' : ''
: questionParams.answerRecord['3'] ? 'stu1' : ''">3</li> "
</ul> >{{ cItem.q_order }}</li>
<div class="tit">复合题</div> </template>
<ul> </ul>
<li </div>
@click="go(4)" <div :key="index" v-else>
:class="questionParams.questionIndex === 3 <div class="tit">{{ item.question_item_title }}</div>
? questionParams.answerRecord['4'] ? 'stu1 stu2' : 'stu2' <ul>
: questionParams.answerRecord['4'] ? 'stu1' : ''">4</li> <template v-for="cItem in item.question_list">
</ul> <template v-for="(lItem, lIndex) in cItem.list">
<li
:key="lItem.q_order +'-'+ lIndex"
@click="goQuestion(lItem.q_order)"
:class="questionParams.questionIndex + 1 === lItem.q_order
? questionParams.answerRecord[item.question_item_id]
? questionParams.answerRecord[item.question_item_id][lItem.id]
? questionParams.answerRecord[item.question_item_id][lItem.id].answer.length !== 0
? questionParams.answerRecord[item.question_item_id][lItem.id].sign
? 'stu1 stu2 stu3'
: 'stu1 stu2'
: questionParams.answerRecord[item.question_item_id][lItem.id].sign
? 'stu2 stu3'
: 'stu2'
: 'stu2'
: 'stu2'
: questionParams.answerRecord[item.question_item_id]
? questionParams.answerRecord[item.question_item_id][lItem.id]
? questionParams.answerRecord[item.question_item_id][lItem.id].answer.length !== 0
? questionParams.answerRecord[item.question_item_id][lItem.id].sign
? 'stu1 stu3'
: 'stu1'
: questionParams.answerRecord[item.question_item_id][lItem.id].sign
? 'stu3'
: ''
: ''
: ''
"
>{{ lItem.q_order }}</li>
</template>
</template>
</ul>
</div>
</template>
</div> </div>
<ul class="flag-tips">
<li>
<div class="circle1"></div>
<div class="txt">已答</div>
</li>
<li>
<div class="circle2"></div>
<div class="txt">未答</div>
</li>
<li>
<div class="circle3"></div>
<div class="txt">当前</div>
</li>
<!-- <li>
<div class="circle4"></div>
<div class="txt">标记</div>
</li> -->
</ul>
</div> </div>
</template> </template>
<script> <script>
...@@ -78,7 +93,7 @@ import Bus from '../../components/common/bus.js' ...@@ -78,7 +93,7 @@ import Bus from '../../components/common/bus.js'
export default { export default {
props: { props: {
questionParams: { type: Object, default: () => {} }, questionParams: { type: Object, default: () => {} },
changeTime: { type: Number, default: () => {} } info: { type: Object, default: () => {} }
}, },
mounted() { mounted() {
Bus.$on('monitoringChanges', target => { Bus.$on('monitoringChanges', target => {
...@@ -86,7 +101,7 @@ export default { ...@@ -86,7 +101,7 @@ export default {
}) })
}, },
methods: { methods: {
go(n) { goQuestion(n) {
this.questionParams.questionIndex = n - 1 this.questionParams.questionIndex = n - 1
} }
} }
......
src/pages/exam/examEnd.vue 0 → 100644
浏览文件 @ af99a9de
<template>
<div class="end-box">
<div class="title">{{ examInfo.name }}</div>
<div class="text">感谢您完成测试</div>
<img src="../../assets/images/end-bg.png" alt="">
<div class="pop-progress" v-if="ispop">
<div class="pop-con">
<div class="tit">提示</div>
<div class="count-box">
<div class="anmi" :style="{width:width}"></div>
</div>
<div class="txt">系统交卷中，请不要关闭页面…</div>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
width: '',
ispop: true,
examInfo: JSON.parse(window.sessionStorage.getItem('examInfo'))
}
},
mounted() {
setTimeout(() => {
this.width = '100%'
}, 1000)
setTimeout(() => {
this.ispop = false
}, 4000)
}
}
</script>
<style lang="scss" scoped>
.end-box{
.pop-progress{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background:rgba(0,0,0,0.3);
.pop-con{
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
width: 342px;
height: 220px;
background: #FFFFFF;
border-radius: 5px;
.count-box{
width: 250px;
height: 10px;
background: #EEEEEE;
border-radius: 5px;
margin: 50px auto;
overflow: hidden;
.anmi{
transition: all 3s;
width: 0;
height: 10px;
background: #428AFF;
border-radius: 5px;
}
}
.txt{
font-size: 14px;
color: #262626;
line-height: 20px;
text-align: center;
}
.tit{
text-align: center;
padding-top: 20px;
font-size: 18px;
font-weight: bold;
color: #222222;
line-height: 18px;
}
}
}
width: 100%;
height: 100%;
background: linear-gradient(360deg, #FCFFFF 0%, #E2F6FF 100%);
.title{
padding-top: 80px;
text-align: center;
font-size: 46px;
font-weight: bold;
color: #333333;
line-height: 65px;
letter-spacing: 2px;
}
.text{
text-align: center;
margin-top: 10px;
font-size: 24px;
color: #666666;
line-height: 33px;
letter-spacing: 2px;
margin-bottom: 40px;
}
img{
display: block;
margin: 0 auto;
height: 60%;
}
}
</style>
src/pages/exam/examTime.vue
浏览文件 @ af99a9de
...@@ -18,6 +18,7 @@ ...@@ -18,6 +18,7 @@
export default { export default {
data() { data() {
return { return {
clearTime: null,
date: { date: {
num1: '0', num1: '0',
num2: '0', num2: '0',
...@@ -27,17 +28,30 @@ export default { ...@@ -27,17 +28,30 @@ export default {
} }
}, },
mounted() { mounted() {
setInterval(() => { clearInterval(this.clearTime)
this.clearTime = setInterval(() => {
this.countDown() this.countDown()
}, 1000) }, 1000)
}, },
methods: { methods: {
countDown() { countDown() {
// const date = JSON.parse(window.sessionStorage.getItem('examInfo')).start_time // const date = JSON.parse(window.sessionStorage.getItem('examInfo')).start_time
const date = '2020-10-29 19:00:00' const date = JSON.parse(window.sessionStorage.getItem('examInfo')).start_time
const nowtime = new Date() const nowtime = new Date()
const endtime = new Date(date) const endtime = new Date(date)
const lefttime = parseInt((endtime.getTime() - nowtime.getTime()) / 1000) const lefttime = parseInt((endtime.getTime() - nowtime.getTime()) / 1000)
if (lefttime <= 0) {
clearInterval(this.clearTime)
this.date = {
num1: '0',
num2: '0',
num3: '0',
num4: '0'
}
this.$router.push({
path: `/examAnswer/${JSON.parse(window.sessionStorage.getItem('examInfo')).exam_id}`
})
}
const td = `${this.addZero(parseInt(lefttime / 60 % 60))}${this.addZero(parseInt(lefttime % 60))}` const td = `${this.addZero(parseInt(lefttime / 60 % 60))}${this.addZero(parseInt(lefttime % 60))}`
const arr = td.split('') const arr = td.split('')
Object.keys(this.date).map((item, index) => { Object.keys(this.date).map((item, index) => {
......
src/pages/login/confirmInfo.vue
浏览文件 @ af99a9de
...@@ -70,7 +70,7 @@ export default { ...@@ -70,7 +70,7 @@ export default {
})() })()
: (() => { : (() => {
this.$router.push({ this.$router.push({
name: 'examAnswer' path: `/examAnswer/${this.examInfo.exam_id}`
}) })
})() })()
}, },
......
src/pages/login/index.vue
浏览文件 @ af99a9de
...@@ -12,17 +12,19 @@ ...@@ -12,17 +12,19 @@
</div> </div>
<div class="mian-form"> <div class="mian-form">
<!-- <div class="form prohibit"> --> <!-- <div class="form prohibit"> -->
<div class="form"> <div :class="loginParam.is ? 'form prohibit' : 'form'">
<div class="tips" v-show="false">您登录的次数已超过最大限制</div> <div class="tips">{{ tips }}</div>
<input type="text" @click="fullScreen" v-model="examineeNumber" placeholder="请输入准考证号"> <!-- 您登录的次数已超过最大限制 -->
<!-- <input type="text" placeholder="请输入准考证号" readonly="readonly" class="prohibit"> --> <input type="text" @click="fullScreen" v-model="examineeNumber" placeholder="请输入准考证号" v-show="!loginParam.is">
<input type="text" placeholder="请输入准考证号" readonly="readonly" class="prohibit" v-show="loginParam.is">
<div class="btn" @click="login">登录</div> <div class="btn" @click="login">登录</div>
<!-- <div class="btn prohibit">登录</div> --> <!-- <div class="btn prohibit">登录</div> -->
<div class="time-tips" v-show="false">距离开考还有：3:23:04</div> <div class="time-tips" v-show="loginParam.is">{{ loginParam.countTimeText }}</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="welcome-msg mian-cont900" v-if="data" v-html="data.config.welcome_message"></div>
<!-- <my-dia :title="title" :prompt="prompt" :isPopup="isPopup" v-if="isPopup"> <!-- <my-dia :title="title" :prompt="prompt" :isPopup="isPopup" v-if="isPopup">
<template v-slot:button> <template v-slot:button>
<button>我知道了</button> <button>我知道了</button>
...@@ -40,11 +42,18 @@ export default { ...@@ -40,11 +42,18 @@ export default {
}, },
data() { data() {
return { return {
tips: '',
claerExamTime: null,
title: '提示', title: '提示',
prompt: '从哪女快递费也琴女是儿是而发大V是阿女大是安抚大V vavgrrad', prompt: '从哪女快递费也琴女是儿是而发大V是阿女大是安抚大V vavgrrad',
data: '', data: '',
examineeNumber: '', examineeNumber: '',
isPopup: true isPopup: true,
loginParam: {
clearTime: null,
is: true,
countTimeText: ''
}
} }
}, },
mounted() { mounted() {
...@@ -52,11 +61,65 @@ export default { ...@@ -52,11 +61,65 @@ export default {
// this.$store.commit('setExamInfo', res) // this.$store.commit('setExamInfo', res)
window.sessionStorage.setItem('examInfo', JSON.stringify(res)) window.sessionStorage.setItem('examInfo', JSON.stringify(res))
this.data = res this.data = res
console.log(this.$store.state) if (this.getEnabledTime() < 0) {
this.examTimeInit()
} else {
let claearTimes = null
claearTimes = setInterval(() => {
if (this.getAfterTime() <= 0) {
this.tips = '超过登录时间'
this.loginParam.is = true
clearInterval(claearTimes)
}
}, 1000)
this.loginParam.is = false
}
}).finally(res => { }).finally(res => {
}) })
}, },
methods: { methods: {
getAfterTime() {
const curTime = new Date()
const startTime = new Date(this.data.start_time)
const setStartTime = this.data.config.enabled_after
? new Date(startTime.setMinutes(startTime.getMinutes() + this.data.config.after_login))
: curTime
const countTime = setStartTime.getTime() - curTime.getTime()
return countTime
},
getEnabledTime() {
const curTime = new Date()
const setCurTime = this.data.config.enabled_before
? new Date(curTime.setMinutes(curTime.getMinutes() + this.data.config.before_login))
: curTime
const startTime = new Date(this.data.start_time)
const countTime = setCurTime.getTime() - startTime.getTime()
return countTime
},
examTimeInit() {
this.loginParam.is = true
this.claerExamTime = setInterval(() => {
const date = this.getEnabledTime()
if (date >= 0) {
clearInterval(this.claerExamTime)
this.loginParam.is = false
} else {
this.countDown(Math.abs(date))
}
}, 1000)
},
addZero(i) {
return i < 10 ? '0' + i : i + ''
},
// 倒计时
countDown(time) {
const lefttime = parseInt((time) / 1000)
const h = this.addZero(parseInt(lefttime / (60 * 60) % 24))
const m = this.addZero(parseInt(lefttime / 60 % 60))
const s = this.addZero(parseInt(lefttime % 60))
this.loginParam.countTimeText = `距离开考还有: ${h} : ${m} : ${s}`
},
// 开启全屏
fullScreen() { fullScreen() {
const el = document.documentElement const el = document.documentElement
const rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullscreen const rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullscreen
...@@ -65,23 +128,35 @@ export default { ...@@ -65,23 +128,35 @@ export default {
} }
return false return false
}, },
// 点击登录
login() { login() {
action.Login.userLogin({ examinee_number: this.examineeNumber }).then(res => { if (!this.loginParam.is) {
// this.$store.commit('setStudentInfo', res) action.Login.userLogin({ examinee_number: this.examineeNumber }).then(res => {
window.sessionStorage.setItem('studentInfo', JSON.stringify(res)) // this.$store.commit('setStudentInfo', res)
this.$router.push({ window.sessionStorage.setItem('studentInfo', JSON.stringify(res))
name: 'confirmInfo' const status = parseInt(res.sheet_status)
}) if (status === 0) {
}).catch(err => { this.$router.push({
this.$alert(err.message, { name: 'confirmInfo'
callback: action => {} })
}
status === 1 && (this.$alert('已提交考卷', {
callback: action => {}
}))
}).catch(err => {
this.$alert(err.message, {
callback: action => {}
})
}) })
}) }
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.welcome-msg{
padding-top: 130px;
}
.mian-cont900{ .mian-cont900{
margin: 0 auto; margin: 0 auto;
width: 900px; width: 900px;
......
src/router/routes.js
浏览文件 @ af99a9de
...@@ -10,7 +10,9 @@ export default [ ...@@ -10,7 +10,9 @@ export default [
/* 考试倒计时 */ /* 考试倒计时 */
{ path: '/examTime', name: 'examTime', component: () => import('../pages/exam/examTime.vue') }, { path: '/examTime', name: 'examTime', component: () => import('../pages/exam/examTime.vue') },
/* 答题 */ /* 答题 */
{ path: '/examAnswer', name: 'examAnswer', component: () => import('../pages/exam/examAnswer.vue') }, { path: '/examAnswer/:examId', name: 'examAnswer', component: () => import('../pages/exam/examAnswer.vue') },
/* 结束考试 */
{ path: '/examEnd', name: 'examEnd', component: () => import('../pages/exam/examEnd.vue') },
/* 如果所有页面都没找到 - 指向 */ /* 如果所有页面都没找到 - 指向 */
{ path: '*', component: () => import('@/components/errorPages/404.vue') } { path: '*', component: () => import('@/components/errorPages/404.vue') }
] ]
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论