/*
|
* @Author: Morpheus
|
* @Date: 2021-07-31 16:31:54
|
* @Last Modified by: liu
|
* @Last Modified time: 2021-10-09 16:08:06
|
* menu-name 考试管理
|
*/
|
<template>
|
<!-- <div class="exam">
|
<button class="logout"
|
onmouseover="this.style.backgroundColor='red';"
|
onmouseout="this.style.backgroundColor='';"
|
@click="handleLogout">退出系统</button>
|
<avue-data-pay :option="option" v-if="pageDisable"></avue-data-pay>
|
<div class="no" v-if="!pageDisable">
|
<span>没有找到相应的考试信息</span>
|
</div>
|
</div> -->
|
<div class="startexam">
|
<div class="startexam_heard">
|
{{ option.data[0].title ? option.data[0].title : "保安员证考试" }}
|
</div>
|
<div class="startexam_main">
|
<div class="s_m_img">
|
<img src="/img/exam/startbg.jpg" alt="" />
|
</div>
|
<div class="s_m_value" v-if="option.data[0].list.length != 0">
|
<div v-for="(item, index) in option.data[0].list" :key="index">
|
<span class="s_m_v_title">{{ item.title }}</span>
|
<span>{{ item.value }}</span>
|
</div>
|
<div>
|
<el-button type="primary" round @click="startExam"
|
>开始考试</el-button
|
>
|
</div>
|
</div>
|
<div class="s_m_value" v-else>没有找到相应的考试信息</div>
|
</div>
|
</div>
|
</template>
|
|
|
<script>
|
import { mapState } from "vuex";
|
import { getExamDetail } from "@/api/examapi/examination";
|
import { updateApplyStatus } from "@/api/examapi/applyexam";
|
export default {
|
data() {
|
return {
|
resData: null,
|
sex: "",
|
pageDisable: false,
|
isTime: 2,
|
option: {
|
span: 8,
|
data: [
|
{
|
list: [],
|
},
|
],
|
},
|
};
|
},
|
computed: {
|
...mapState({
|
userInfo: (state) => state.user.userInfo,
|
}),
|
},
|
mounted() {
|
//获取数据
|
this.getUserInfoBYExam();
|
window.startExam = this.startExam;
|
},
|
methods: {
|
//退出登录
|
handleLogout() {
|
this.$confirm("是否退出系统, 是否继续?", "提示", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning",
|
}).then(() => {
|
this.$store.dispatch("LogOut").then(() => {
|
this.$router.push({ path: "/login" });
|
});
|
});
|
},
|
//开始考试跳转
|
startExam() {
|
//判断是否到了考试时间
|
if (this.isTime == 3) {
|
this.$message({
|
type: "warning",
|
message: "未到考试时间!",
|
});
|
return;
|
}
|
//已超过考试截止时间
|
if (this.isTime == 1) {
|
this.$message({
|
type: "warning",
|
message: "已过考试时间!",
|
});
|
return;
|
}
|
var that = this;
|
//去修改考试状态
|
var data = {
|
id: that.resData.applyId,
|
examType: this.resData.examType,
|
examId: this.resData.id,
|
userId: this.userInfo.user_id,
|
candidateNo: this.resData.candidateNo,
|
};
|
// this.$notify({
|
// message:
|
// "考试期间切勿退出登入、关闭浏览器, 否则考试成绩无效, 如有问题及时联系管理人员!",
|
// duration: 6000,
|
// showClose: false,
|
// customClass: "beginS",
|
// // type: "warning",
|
// });
|
// return;
|
updateApplyStatus(data).then((res) => {
|
that.resData["examScoreId"] = res.data.id;
|
this.$store.commit("SetScoreId", res.data.id);
|
console.log(res.data.id, "ididididiidididididid");
|
window.name = "";
|
this.$notify({
|
message:
|
"考试期间切勿退出登入、关闭浏览器, 否则考试成绩无效, 如有问题及时联系管理人员!",
|
duration: 6000,
|
showClose: false,
|
customClass: "beginS",
|
// type: "warning",
|
});
|
that.$router.push({
|
path: `/startexam/${that.resData.id}`,
|
query: that.resData,
|
});
|
});
|
},
|
getUserInfoBYExam() {
|
var that = this;
|
getExamDetail(this.userInfo.user_id).then(
|
(res) => {
|
that.resData = res.data.data[0];
|
|
var data = res.data.data[0];
|
// console.log(data,333);
|
//当前时间
|
var nowD = new Date(),
|
startD = new Date(data.startTime),
|
//考试截止时间
|
endD = new Date(data.endTime);
|
//对比时间
|
//getTime() 方法可返回距 1970 年 1 月 1 日之间的毫秒数。
|
if (nowD.getTime() > startD.getTime()) {
|
if (endD.getTime() < nowD.getTime()) {
|
that.isTime = 1;
|
} else {
|
that.isTime = 2;
|
}
|
} else {
|
that.isTime = 3;
|
}
|
if (res.data.data.length > 0) {
|
that.pageDisable = true;
|
if (data.sex == 1) {
|
that.sex = "男";
|
}
|
if (data.sex == 2) {
|
that.sex = "女";
|
}
|
that.option.data = [
|
{
|
title: that.resData.examName,
|
color: "#ffa820",
|
subtext: "开始考试",
|
click: function () {
|
window.parent.startExam();
|
},
|
list: [
|
{
|
title: "姓名: ",
|
value: that.resData.realName,
|
check: true,
|
},
|
{
|
title: "准考证号: ",
|
value: that.resData.candidateNo,
|
check: true,
|
},
|
{
|
title: "身份证号: ",
|
value: that.resData.idCardNo,
|
check: true,
|
},
|
{
|
title: "性别: ",
|
value: that.sex,
|
check: true,
|
},
|
],
|
},
|
];
|
that.$store.commit("SetexamUserData", that.option.data[0]);
|
}
|
},
|
|
(error) => {
|
window.console.log(error);
|
}
|
);
|
},
|
},
|
};
|
</script>
|
<style lang="scss">
|
//最终
|
.startexam {
|
// width: 100%;
|
// height: 100%;
|
// border: 1px solid red;
|
width: calc(100% - 100px);
|
height: 89%;
|
margin: 2.5% 50px;
|
background-color: rgba($color: #fff, $alpha: 1);
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
flex-direction: column;
|
.startexam_heard {
|
font-size: 34px;
|
color: rgb(240, 114, 29);
|
position: relative;
|
top: -10%;
|
}
|
.startexam_main {
|
width: 960px;
|
height: 300px;
|
// border: 1px solid red;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
box-shadow: 0px 0px 5px 3px rgba($color: #797979, $alpha: 0.2);
|
.s_m_img {
|
width: 50%;
|
height: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
img {
|
width: 90%;
|
height: 90%;
|
}
|
}
|
.s_m_value {
|
width: 50%;
|
height: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
flex-direction: column;
|
div {
|
width: 90%;
|
height: 15%;
|
font-size: 17px;
|
.s_m_v_title {
|
display: inline-block;
|
width: 100px;
|
}
|
}
|
}
|
}
|
}
|
|
.beginS {
|
height: 180px;
|
width: 500px;
|
}
|
.el-notification__content {
|
font-size: 90px !important;
|
line-height: 44px !important;
|
}
|
</style>
|