Skip to content

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

update

上级 cb0a7d22
隐藏空白字符变更
内嵌 并排
正在显示 包含 109 行增加 和 93 行删除
src/pages/login/index.vue
浏览文件 @ 3ad33ebe
...@@ -4,20 +4,32 @@ ...@@ -4,20 +4,32 @@
<div class="mian-cont900 por"> <div class="mian-cont900 por">
<div class="title">{{ data.name }}</div> <div class="title">{{ data.name }}</div>
<div class="exam-time"> <div class="exam-time">
<div class="tit">考试时间1</div> <div class="tit">考试时间</div>
<div class="line"></div> <div class="line"></div>
<div class="time"> <div class="time">{{ data.start_time }} - {{ data.end_time }}</div>
{{ data.start_time }} - {{ data.end_time }}
</div>
</div> </div>
<div class="mian-form"> <div class="mian-form">
<!-- <div class="form prohibit"> --> <!-- <div class="form prohibit"> -->
<div :class="loginParam.is ? 'form prohibit' : 'form'"> <div :class="loginParam.is ? 'form prohibit' : 'form'">
<div class="tips">{{ tips }}</div> <div class="tips">{{ tips }}</div>
<!-- 您登录的次数已超过最大限制 --> <!-- 您登录的次数已超过最大限制 -->
<input type="text" @click="fullScreen" v-model="examineeNumber" placeholder="请输入准考证号" v-show="!loginParam.is" @keydown="keydown($event)"> <input
<input type="text" @click="fullScreen" placeholder="请输入准考证号" readonly="readonly" class="prohibit" v-show="loginParam.is"> type="text"
<div class="btn" @click="login">登录</div> @click="fullScreen"
v-model="examineeNumber"
placeholder="请输入准考证号"
v-show="!loginParam.is"
@keydown="keydown($event)"
/>
<input
type="text"
@click="fullScreen"
placeholder="请输入准考证号"
readonly="readonly"
class="prohibit"
v-show="loginParam.is"
/>
<div class="btn" @click="login">登录1</div>
<!-- <div class="btn prohibit">登录</div> --> <!-- <div class="btn prohibit">登录</div> -->
<div class="time-tips" v-show="loginParam.is">{{ loginParam.countTimeText }}</div> <div class="time-tips" v-show="loginParam.is">{{ loginParam.countTimeText }}</div>
</div> </div>
...@@ -56,25 +68,26 @@ export default { ...@@ -56,25 +68,26 @@ export default {
} }
}, },
mounted() { mounted() {
action.Login.getExamInfo(this.$route.params.examId).then(res => { action.Login.getExamInfo(this.$route.params.examId)
window.localStorage.setItem('examInfo', JSON.stringify(res)) .then(res => {
this.data = res window.localStorage.setItem('examInfo', JSON.stringify(res))
if (this.getEnabledTime() < 0) { this.data = res
this.examTimeInit() if (this.getEnabledTime() < 0) {
} else { this.examTimeInit()
let claearTimes = null } else {
claearTimes = setInterval(() => { let claearTimes = null
// console.log(this.getAfterTime()) claearTimes = setInterval(() => {
if (this.getAfterTime() <= 0) { // console.log(this.getAfterTime())
this.tips = '超过登录时间' if (this.getAfterTime() <= 0) {
this.loginParam.is = true this.tips = '超过登录时间'
clearInterval(claearTimes) this.loginParam.is = true
} clearInterval(claearTimes)
}, 1000) }
this.loginParam.is = false }, 1000)
} this.loginParam.is = false
}).finally(res => { }
}) })
.finally(res => {})
}, },
methods: { methods: {
sendExamInfo(studentId) { sendExamInfo(studentId) {
...@@ -83,10 +96,11 @@ export default { ...@@ -83,10 +96,11 @@ export default {
exam_id: this.data.exam_id, exam_id: this.data.exam_id,
status: 2 status: 2
} }
action.Login.sendExamInfo(param).then(res => { action.Login.sendExamInfo(param)
}).catch(err => { .then(res => {})
console.log(err) .catch(err => {
}) console.log(err)
})
}, },
closePop() { closePop() {
this.fullScreen() this.fullScreen()
...@@ -124,23 +138,24 @@ export default { ...@@ -124,23 +138,24 @@ export default {
}, },
// 倒计时 // 倒计时
countDown(time) { countDown(time) {
const lefttime = parseInt((time) / 1000) const lefttime = parseInt(time / 1000)
const h = this.addZero(parseInt(lefttime / (60 * 60) % 24)) const h = this.addZero(parseInt((lefttime / (60 * 60)) % 24))
const m = this.addZero(parseInt(lefttime / 60 % 60)) const m = this.addZero(parseInt((lefttime / 60) % 60))
const s = this.addZero(parseInt(lefttime % 60)) const s = this.addZero(parseInt(lefttime % 60))
this.loginParam.countTimeText = `距离开考还有: ${h} : ${m} : ${s}` 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
if (typeof rfs !== 'undefined' && rfs) { if (typeof rfs !== 'undefined' && rfs) {
rfs.call(el) rfs.call(el)
} }
return false return false
}, },
// 禁止input输入空格 // 禁止input输入空格
keydown (event) { keydown(event) {
console.log(event.keyCode) console.log(event.keyCode)
if (event.keyCode === 32 || event.keyCode === 187 || event.keyCode === 107) { if (event.keyCode === 32 || event.keyCode === 187 || event.keyCode === 107) {
event.returnValue = false event.returnValue = false
...@@ -153,45 +168,46 @@ export default { ...@@ -153,45 +168,46 @@ export default {
this.$alert('请输入准考证号') this.$alert('请输入准考证号')
return false return false
} }
action.Login.userLogin(this.data.exam_id, { examinee_number: this.examineeNumber }).then(res => { action.Login.userLogin(this.data.exam_id, { examinee_number: this.examineeNumber })
window.localStorage.setItem('studentInfo', JSON.stringify(res)) .then(res => {
const status = parseInt(res.sheet_status) window.localStorage.setItem('studentInfo', JSON.stringify(res))
// this.sendExamInfo(res.info.student_id) const status = parseInt(res.sheet_status)
if (status === 0) { // this.sendExamInfo(res.info.student_id)
this.$router.replace({ if (status === 0) {
name: 'confirmInfo' this.$router.replace({
}) name: 'confirmInfo'
} })
status === 1 && (this.$alert('已提交考卷')) }
}).catch(err => { status === 1 && this.$alert('已提交考卷')
if (err.message.indexOf('error') !== -1) { })
this.$alert('网络异常，请保持网络通畅', { .catch(err => {
callback: action => {} if (err.message.indexOf('error') !== -1) {
}) this.$alert('网络异常，请保持网络通畅', {
} else { callback: action => {}
this.$alert(err.message, { })
callback: action => {} } else {
}) this.$alert(err.message, {
} callback: action => {}
}) })
}
})
} }
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.welcome-msg {
.welcome-msg{
padding-top: 130px; padding-top: 130px;
&::v-deep img{ &::v-deep img {
width: 100%; width: 100%;
display: block; display: block;
} }
} }
.mian-cont900{ .mian-cont900 {
margin: 0 auto; margin: 0 auto;
width: 900px; width: 900px;
&.por{ &.por {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 50%; left: 50%;
...@@ -199,119 +215,119 @@ export default { ...@@ -199,119 +215,119 @@ export default {
margin-bottom: -115px; margin-bottom: -115px;
} }
} }
.login-box{ .login-box {
width: 100%; width: 100%;
height: 100%; height: 100%;
background: #fff; background: #fff;
.content{ .content {
position: relative; position: relative;
width: 100%; width: 100%;
height: 50%; height: 50%;
// height: 387px; // height: 387px;
background: url(../../assets/images/login-bg.png); background: url(../../assets/images/login-bg.png);
background-size: 100% 100%; background-size: 100% 100%;
.title{ .title {
padding-top: 110px; padding-top: 110px;
font-size: 36px; font-size: 36px;
font-weight: 600; font-weight: 600;
color: #FFFFFF; color: #ffffff;
line-height: 50px; line-height: 50px;
letter-spacing: 7px; letter-spacing: 7px;
text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5); text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5);
} }
.exam-time{ .exam-time {
padding-top: 20px; padding-top: 20px;
.tit{ .tit {
font-size: 18px; font-size: 18px;
font-weight: bold; font-weight: bold;
color: #FFFFFF; color: #ffffff;
line-height: 25px; line-height: 25px;
text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5); text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5);
} }
.line{ .line {
width: 24px; width: 24px;
height: 2px; height: 2px;
background: #FFFFFF; background: #ffffff;
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.5); box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.5);
margin: 10px 0; margin: 10px 0;
} }
.time{ .time {
height: 25px; height: 25px;
font-size: 18px; font-size: 18px;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 400;
color: #FFFFFF; color: #ffffff;
line-height: 25px; line-height: 25px;
text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5); text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5);
} }
} }
.mian-form{ .mian-form {
width: 100%; width: 100%;
height: 230px; height: 230px;
background: #FFFFFF; background: #ffffff;
box-shadow: 0px 2px 12px 0px rgba(177, 186, 195, 0.3); box-shadow: 0px 2px 12px 0px rgba(177, 186, 195, 0.3);
border-radius: 5px; border-radius: 5px;
margin-top: 20px; margin-top: 20px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
.form{ .form {
position: relative; position: relative;
display: flex; display: flex;
&.prohibit{ &.prohibit {
input{ input {
background: #EEEEEE; background: #eeeeee;
border: 1px solid #CCCCCC; border: 1px solid #cccccc;
} }
.btn{ .btn {
color: #ccc; color: #ccc;
background: #eee; background: #eee;
} }
} }
} }
input{ input {
padding-left: 15px; padding-left: 15px;
width: 585px; width: 585px;
height: 40px; height: 40px;
border-radius: 4px; border-radius: 4px;
border: 1px solid #CCCCCC; border: 1px solid #cccccc;
font-size: 14px; font-size: 14px;
outline: none; outline: none;
&::-webkit-input-placeholder{ &::-webkit-input-placeholder {
color: #999999; color: #999999;
} }
&.prohibit{ &.prohibit {
background: #EEEEEE; background: #eeeeee;
border: 1px solid #CCCCCC; border: 1px solid #cccccc;
} }
} }
.btn{ .btn {
width: 180px; width: 180px;
height: 42px; height: 42px;
background: #C01540; background: #c01540;
border-radius: 4px; border-radius: 4px;
margin-left: 20px; margin-left: 20px;
font-size: 14px; font-size: 14px;
font-weight: bold; font-weight: bold;
color: #FFFFFF; color: #ffffff;
line-height: 40px; line-height: 40px;
text-align: center; text-align: center;
font-style: normal; font-style: normal;
&.prohibit{ &.prohibit {
color: #ccc; color: #ccc;
background: #eee; background: #eee;
} }
} }
.tips{ .tips {
position: absolute; position: absolute;
top: -80%; top: -80%;
left: 0; left: 0;
font-size: 18px; font-size: 18px;
font-weight: 400; font-weight: 400;
color: #C01540; color: #c01540;
line-height: 25px; line-height: 25px;
} }
.time-tips{ .time-tips {
position: absolute; position: absolute;
bottom: -80%; bottom: -80%;
left: 0; left: 0;
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论