|
|
|
|
@ -0,0 +1,893 @@ |
|
|
|
|
<template> |
|
|
|
|
<div> |
|
|
|
|
<el-container class="scrollbar" v-if="ishow"> |
|
|
|
|
<el-header> |
|
|
|
|
<div class="flex between"> |
|
|
|
|
<div class="flex" style="width: 28%"> |
|
|
|
|
<p>实训项目</p> |
|
|
|
|
<el-select |
|
|
|
|
v-model="value1" |
|
|
|
|
placeholder="请选择" |
|
|
|
|
class="select" |
|
|
|
|
:disabled="projectPermissions != 0" |
|
|
|
|
@change="selectProject" |
|
|
|
|
style="flex: 1" |
|
|
|
|
> |
|
|
|
|
<el-option |
|
|
|
|
v-for="item in value" |
|
|
|
|
:key="item.projectId" |
|
|
|
|
:label="item.projectName" |
|
|
|
|
:value="item.projectId" |
|
|
|
|
></el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</div> |
|
|
|
|
<div class="countDownBox"> |
|
|
|
|
<div style="margin-left: -40px;"> |
|
|
|
|
<div :sendSync="sendSync" :autoStart="autoStart" :defaultVal="defaultVal"> |
|
|
|
|
实训{{text}}时间 |
|
|
|
|
<span class="timeSpan">{{day}}</span>天 |
|
|
|
|
<span class="timeSpan">{{hour}}</span>小时 |
|
|
|
|
<span class="timeSpan">{{minutes}}</span>分 |
|
|
|
|
<span class="timeSpan">{{seconds}}</span>秒 |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="countDownBox"> |
|
|
|
|
<div> |
|
|
|
|
总得分： |
|
|
|
|
<span class="gradeSpan">{{grade}}</span> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div> |
|
|
|
|
<el-button |
|
|
|
|
style="backgroundColor: #202020;color: #d0d0d0;font-size:14px;" |
|
|
|
|
v-show="projectPermissions == 0" |
|
|
|
|
@click="reload" |
|
|
|
|
>重新开始</el-button> |
|
|
|
|
<el-button class="submit-btn" style="margin-right:7px" @click="Submit()" :disabled="isSubmit">提交</el-button> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</el-header> |
|
|
|
|
<el-container> |
|
|
|
|
<el-aside width="30%"> |
|
|
|
|
<div class="aside-header"> |
|
|
|
|
<div class="header_h flex"> |
|
|
|
|
<i class="el-icon-s-order"></i> |
|
|
|
|
<p>实验目标</p> |
|
|
|
|
</div> |
|
|
|
|
<div class="font_css"> |
|
|
|
|
<div class="experimentalGoal"> |
|
|
|
|
<div class="break-all" v-html="experimentalGoal"></div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="aside-footer"> |
|
|
|
|
<div class="header_h flex"> |
|
|
|
|
<i class="el-icon-s-management"></i> |
|
|
|
|
<p>实验任务</p> |
|
|
|
|
</div> |
|
|
|
|
<div> |
|
|
|
|
<el-row> |
|
|
|
|
<el-col :span="24"> |
|
|
|
|
<el-card shadow="hover"> |
|
|
|
|
<el-table :data="tableData" :stripe="true" height="405"> |
|
|
|
|
<el-table-column type="index"></el-table-column> |
|
|
|
|
<el-table-column prop="judgmentPointsName" label="判分标准" align="center"></el-table-column> |
|
|
|
|
<el-table-column prop="right" label="完成结果" align="center"> |
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
<i |
|
|
|
|
v-if="scope.row.right=='0'" |
|
|
|
|
class="el-icon-check" |
|
|
|
|
style="color:green;font-size:20px" |
|
|
|
|
></i> |
|
|
|
|
<i |
|
|
|
|
v-else-if="scope.row.right=='-1'" |
|
|
|
|
class="el-icon-close" |
|
|
|
|
style="color:red;font-size:20px" |
|
|
|
|
></i> |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
<el-table-column prop="score" label="得分" align="center"></el-table-column> |
|
|
|
|
</el-table> |
|
|
|
|
</el-card> |
|
|
|
|
</el-col> |
|
|
|
|
</el-row> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</el-aside> |
|
|
|
|
<el-main> |
|
|
|
|
<el-tabs v-model="activeName" type="card"> |
|
|
|
|
<el-tab-pane label="案例" name="first"> |
|
|
|
|
<div class="break-all" v-html="caseDescription"></div> |
|
|
|
|
</el-tab-pane> |
|
|
|
|
<el-tab-pane label="实验要求" name="second"> |
|
|
|
|
<el-collapse v-model="activeNames"> |
|
|
|
|
<el-collapse-item v-for="(loop, index) in points" :key="index"> |
|
|
|
|
<template slot="title"> |
|
|
|
|
<i class="el-icon-s-ticket"></i> |
|
|
|
|
<span style="font-size:16px">{{loop.judgmentPointsName}}</span> |
|
|
|
|
</template> |
|
|
|
|
<div class="break-all" v-html="loop.experimentalRequirements"></div> |
|
|
|
|
</el-collapse-item> |
|
|
|
|
</el-collapse> |
|
|
|
|
</el-tab-pane> |
|
|
|
|
<el-tab-pane label="实验提示" name="fifth" > |
|
|
|
|
<div class="break-all" v-html="experimentSuggests"></div> |
|
|
|
|
</el-tab-pane> |
|
|
|
|
</el-tabs> |
|
|
|
|
</el-main> |
|
|
|
|
</el-container> |
|
|
|
|
</el-container> |
|
|
|
|
<!-- </div> --> |
|
|
|
|
|
|
|
|
|
<div |
|
|
|
|
:style="ishow ? {position: 'fixed', left: '85%',top:'50%'} : {position: 'fixed',top:'50%'}" |
|
|
|
|
> |
|
|
|
|
<div @click="step()"> |
|
|
|
|
<img src="../assets/img/left.png" alt class="m_step" v-if="ishow" /> |
|
|
|
|
<img src="../assets/img/right.png" alt class="n_step" v-if="!ishow" /> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
<script> |
|
|
|
|
import newmain from "../util/newMain"; |
|
|
|
|
import axios from "axios"; |
|
|
|
|
import * as $ from "jquery"; |
|
|
|
|
import { get } from "http"; |
|
|
|
|
//返回格式化时间，传参例如："yyyy-MM-dd hh:mm:ss" |
|
|
|
|
function formatDate(fmt,date) { |
|
|
|
|
var date = date ? date : new Date() |
|
|
|
|
var o = { |
|
|
|
|
"M+" : date.getMonth()+1, //月份 |
|
|
|
|
"d+" : date.getDate(), //日 |
|
|
|
|
"h+" : date.getHours(), //小时 |
|
|
|
|
"m+" : date.getMinutes(), //分 |
|
|
|
|
"s+" : date.getSeconds(), //秒 |
|
|
|
|
"q+" : Math.floor((date.getMonth()+3)/3), //季度 |
|
|
|
|
"S" : date.getMilliseconds() //毫秒 |
|
|
|
|
}; |
|
|
|
|
if(/(y+)/.test(fmt)) { |
|
|
|
|
fmt=fmt.replace(RegExp.$1, (date.getFullYear()+"").substr(4 - RegExp.$1.length)); |
|
|
|
|
} |
|
|
|
|
for(var k in o) { |
|
|
|
|
if(new RegExp("("+ k +")").test(fmt)){ |
|
|
|
|
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length))); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
return fmt; |
|
|
|
|
} |
|
|
|
|
export default { |
|
|
|
|
data() { |
|
|
|
|
return { |
|
|
|
|
systemId: this.$config.systemId, |
|
|
|
|
test: [], |
|
|
|
|
ishow: false, |
|
|
|
|
grade: "00", |
|
|
|
|
exampleData: "", |
|
|
|
|
codeid: "", |
|
|
|
|
codeIds: [], |
|
|
|
|
judgmentPointsIds: [], |
|
|
|
|
text: "", |
|
|
|
|
isStart: false, |
|
|
|
|
globalTimer: null, //获取setInterval对象值 |
|
|
|
|
millisecond: 0, |
|
|
|
|
countVal: this.defaultVal, //获取初始值 |
|
|
|
|
pauseTime: 0, |
|
|
|
|
day: 0, |
|
|
|
|
seconds: 0, |
|
|
|
|
minutes: 0, |
|
|
|
|
hour: 0, |
|
|
|
|
createTime: "", //开始时间 |
|
|
|
|
actEndTime: "", //倒计时结束时间 |
|
|
|
|
value1: "", //选中后绑定的对象 |
|
|
|
|
value: [], |
|
|
|
|
experimentalGoal: "", //实验目标 |
|
|
|
|
caseDescription: "", //案例描述 |
|
|
|
|
experimentSuggests: "", //实验提示 |
|
|
|
|
judgmentPointsName: "", // 判分点名称 |
|
|
|
|
points: [], |
|
|
|
|
activeNames: [], |
|
|
|
|
tableData: [], |
|
|
|
|
activeName: "first", |
|
|
|
|
schoolId: '', |
|
|
|
|
studentId: "", |
|
|
|
|
courseId: "", |
|
|
|
|
projectId: "", |
|
|
|
|
assessmentId: "", |
|
|
|
|
projectPermissions: 0, //项目权限(0、练习 1、考核 2、竞赛) |
|
|
|
|
isSubmit: false, |
|
|
|
|
entryTime: formatDate('yyyy-MM-dd hh:mm:ss'), |
|
|
|
|
startTime: '', |
|
|
|
|
stopTime: '', |
|
|
|
|
isSelected: false, |
|
|
|
|
userId: '', |
|
|
|
|
workbenchCus: this.workbench, |
|
|
|
|
isRecovery: false |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
watch: { |
|
|
|
|
countVal: { |
|
|
|
|
deep: true, |
|
|
|
|
handler: function(val, oldVal) { |
|
|
|
|
let vm = this; |
|
|
|
|
if (vm.needSendSunc) { |
|
|
|
|
vm.passToParent(val); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
needSendSunc: { |
|
|
|
|
deep: true, |
|
|
|
|
handler: function(val) { |
|
|
|
|
let vm = this; |
|
|
|
|
if (val) { |
|
|
|
|
vm.passToParent(vm.countString); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
props: { |
|
|
|
|
sendSync: { |
|
|
|
|
type: Boolean, |
|
|
|
|
default: false |
|
|
|
|
}, |
|
|
|
|
autoStart: { |
|
|
|
|
type: Boolean, |
|
|
|
|
default: false |
|
|
|
|
}, |
|
|
|
|
defaultVal: { |
|
|
|
|
type: Number, |
|
|
|
|
default: null |
|
|
|
|
}, |
|
|
|
|
codeId: { |
|
|
|
|
type: Number, |
|
|
|
|
default: 0 |
|
|
|
|
}, |
|
|
|
|
workbench: { |
|
|
|
|
type: Array, |
|
|
|
|
default: [] |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
computed: { |
|
|
|
|
needSendSunc: function() { |
|
|
|
|
return this.sendSync; |
|
|
|
|
}, |
|
|
|
|
// 倒计时 |
|
|
|
|
second: function() { |
|
|
|
|
return this.num(this.seconds); |
|
|
|
|
}, |
|
|
|
|
minute: function() { |
|
|
|
|
return this.num(this.minutes); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
mounted() { |
|
|
|
|
this.schoolId = this.getCookie("schoolId"); |
|
|
|
|
this.assessmentId = this.getCookie("assessmentId"); |
|
|
|
|
this.userId = this.getCookie("userId"); |
|
|
|
|
this.studentId = this.getCookie("studentId"); |
|
|
|
|
this.projectId = this.getCookie("projectId"); |
|
|
|
|
// this.courseId = this.getCookie("courseId"); |
|
|
|
|
this.startTime = this.getCookie("startTime") ? new Date(this.getCookie("startTime")).getTime() : '' |
|
|
|
|
this.stopTime = this.getCookie("stopTime") ? new Date(this.getCookie("stopTime")).getTime() : '' |
|
|
|
|
|
|
|
|
|
this.projectPermissions = this.projectId ? 1 : 0 |
|
|
|
|
if(this.projectId){ |
|
|
|
|
this.getQueryProject(); |
|
|
|
|
}else{ |
|
|
|
|
this.getProjects(); |
|
|
|
|
let codeCache = localStorage.getItem('codeCache') |
|
|
|
|
if(codeCache){ |
|
|
|
|
codeCache = JSON.parse(codeCache) |
|
|
|
|
if(codeCache.systemId && codeCache.systemId == this.$config.systemId){ |
|
|
|
|
this.$confirm('是否要继续上次的实验？', '提示', { |
|
|
|
|
confirmButtonText: '是', |
|
|
|
|
cancelButtonText: '否', |
|
|
|
|
type: 'success' |
|
|
|
|
}).then(() => { |
|
|
|
|
this.value1 = codeCache.projectId |
|
|
|
|
this.workbenchCus = codeCache.workbench |
|
|
|
|
this.isRecovery = true |
|
|
|
|
this.selectProject() |
|
|
|
|
let codeIds = [] |
|
|
|
|
codeCache.workbench.map(n => codeIds.push(n.code.codeId)) |
|
|
|
|
codeIds = codeIds.filter(n => n) |
|
|
|
|
this.codeIds = codeIds |
|
|
|
|
this.$emit('recoveryCode',codeCache.workbench1) |
|
|
|
|
}).catch(() => { |
|
|
|
|
localStorage.removeItem('codeCache') |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
this.assessmentId && this.projectId && this.checkVer() |
|
|
|
|
this.codeId && this.codeIds.push(this.codeId) |
|
|
|
|
//兄弟组件传值 |
|
|
|
|
newmain.$on("codeid", val => { |
|
|
|
|
this.codeid = val; |
|
|
|
|
let codeId = this.codeid; |
|
|
|
|
this.codeIds.push(codeId); |
|
|
|
|
}); |
|
|
|
|
// 更改tableData |
|
|
|
|
newmain.$on("updateJud", item => { |
|
|
|
|
let list = this.tableData |
|
|
|
|
list.map(n => { |
|
|
|
|
if(n.judgmentPointsId == item.id) n.isError = item.isError |
|
|
|
|
}) |
|
|
|
|
this.tableData = list |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
checkVer() { |
|
|
|
|
let data = { |
|
|
|
|
userId: this.userId, |
|
|
|
|
id: this.assessmentId |
|
|
|
|
} |
|
|
|
|
this.$get(this.api.qualifications,data).then(res => { |
|
|
|
|
if(res.message == 'false'){ |
|
|
|
|
this.isSubmit = true; |
|
|
|
|
newmain.$emit("isSubmit", this.isSubmit); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
//重新开始 |
|
|
|
|
reload() { |
|
|
|
|
this.$post(this.api.DeleteCodes, this.codeIds).then(res => { |
|
|
|
|
this.getClearTime() |
|
|
|
|
localStorage.removeItem('codeCache') |
|
|
|
|
this.codeIds = [] |
|
|
|
|
this.isSubmit = false |
|
|
|
|
newmain.$emit("isSubmit", this.isSubmit) |
|
|
|
|
let workbench = this.workbench |
|
|
|
|
workbench.map(n => { |
|
|
|
|
n.code = { |
|
|
|
|
code: '', |
|
|
|
|
codeId: '' |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
this.$emit('recoveryCode',workbench) |
|
|
|
|
let tableData = this.tableData |
|
|
|
|
tableData.map(n => { |
|
|
|
|
delete n.score |
|
|
|
|
delete n.right |
|
|
|
|
}) |
|
|
|
|
this.tableData = JSON.parse(JSON.stringify(tableData)) |
|
|
|
|
this.startCountFn() |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
Submit() { |
|
|
|
|
if(!this.codeIds.length) return this.$message.error('请先完成实验') |
|
|
|
|
this.$confirm("此操作将视为结束考试, 是否继续?", "提示", { |
|
|
|
|
confirmButtonText: "确定", |
|
|
|
|
cancelButtonText: "取消", |
|
|
|
|
type: "warning", |
|
|
|
|
center: true |
|
|
|
|
}) |
|
|
|
|
.then(() => { |
|
|
|
|
this.actEndTime = new Date().getTime(); |
|
|
|
|
this.getClearTime(); |
|
|
|
|
//提交代码与判分点进行判断 |
|
|
|
|
this.$post(this.api.Submit, { |
|
|
|
|
// projectPermissions: 0, |
|
|
|
|
createTime: this.startTime, |
|
|
|
|
endTime: this.stopTime, |
|
|
|
|
projectId: this.projectId, |
|
|
|
|
projectPermissions: this.projectPermissions, |
|
|
|
|
// assessmentId: 1, |
|
|
|
|
assessmentId: this.assessmentId ? this.assessmentId : '', |
|
|
|
|
codeIds: this.codeIds, |
|
|
|
|
judgmentPointsIds: this.judgmentPointsIds, |
|
|
|
|
// studentId: 54, |
|
|
|
|
studentId: this.studentId, |
|
|
|
|
record: { |
|
|
|
|
courseId: 1, |
|
|
|
|
// courseId: this.courseId, |
|
|
|
|
projectId: this.projectId, |
|
|
|
|
createTime: this.startTime, |
|
|
|
|
endTime: this.stopTime, |
|
|
|
|
startTime: this.entryTime |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
.then(res => { |
|
|
|
|
localStorage.removeItem('codeCache') |
|
|
|
|
this.isSubmit = true |
|
|
|
|
newmain.$emit("isSubmit", this.isSubmit); |
|
|
|
|
let list = res.message |
|
|
|
|
let workbench = this.workbenchCus.length ? this.workbenchCus : this.workbench |
|
|
|
|
let result = [] |
|
|
|
|
workbench.map(n => { |
|
|
|
|
result.push(list.find(e => e.judgmentPointsId == n.judgmentPointsId)) |
|
|
|
|
}) |
|
|
|
|
let tableData = this.tableData |
|
|
|
|
result.map(n => { |
|
|
|
|
if(tableData.find(e => e.judgmentPointsId == n.judgmentPointsId).isError){ |
|
|
|
|
n.score = 0 |
|
|
|
|
n.right = -1 |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
this.tableData = result |
|
|
|
|
//计算总分 |
|
|
|
|
var s = 0; |
|
|
|
|
this.tableData.forEach(element => { |
|
|
|
|
this.test = element.score; |
|
|
|
|
s += this.test; |
|
|
|
|
this.grade = s; |
|
|
|
|
}); |
|
|
|
|
}) |
|
|
|
|
.catch(err => {}); |
|
|
|
|
}) |
|
|
|
|
.catch(() => { |
|
|
|
|
this.$message({ |
|
|
|
|
type: "info", |
|
|
|
|
message: "已取消提交" |
|
|
|
|
}); |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
// 倒计时 |
|
|
|
|
timeFormat(param) { |
|
|
|
|
return param < 10 ? "0" + param : param; |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
//控制面板 |
|
|
|
|
step() { |
|
|
|
|
$(".m_step").toggleClass("n_step"); |
|
|
|
|
this.ishow = !this.ishow; |
|
|
|
|
}, |
|
|
|
|
// 清除时间 |
|
|
|
|
getClearTime() { |
|
|
|
|
clearInterval(this.globalTimer); |
|
|
|
|
clearInterval(this.countVal); |
|
|
|
|
this.globalTimer = ""; |
|
|
|
|
if(this.projectPermissions != 0){ |
|
|
|
|
this.countVal = ""; |
|
|
|
|
this.day = "00"; |
|
|
|
|
this.seconds = "00"; |
|
|
|
|
this.minutes = "00"; |
|
|
|
|
this.hour = "00"; |
|
|
|
|
}else{ |
|
|
|
|
this.text = '所用' |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
handleData(project,type){ |
|
|
|
|
if(!this.isSelected){ |
|
|
|
|
this.value = project; |
|
|
|
|
this.value1 = project[0].projectId; |
|
|
|
|
} |
|
|
|
|
this.projectId = type == 2 ? project[0].projectId : this.projectId |
|
|
|
|
if(type == 2) this.getQueryProject(0,1) |
|
|
|
|
this.projectPermissions = type == 1 ? project[0].projectPermissions : this.projectPermissions |
|
|
|
|
this.$emit("tell", this.value1, this.projectPermissions,this.isRecovery ? this.workbenchCus : []); |
|
|
|
|
this.experimentalGoal = project[0].experimentalGoal; |
|
|
|
|
this.caseDescription = project[0].caseDescription; |
|
|
|
|
this.experimentSuggests = project[0].experimentSuggests; |
|
|
|
|
this.actEndTime = project[0].endTime; |
|
|
|
|
this.isRecovery = false |
|
|
|
|
}, |
|
|
|
|
getQueryProject(projectId,type) { |
|
|
|
|
//项目名称+实验目标+案例描述+实验提示+实验要求 |
|
|
|
|
this.$get(this.api.QueryProject, { |
|
|
|
|
// studentId: 54, |
|
|
|
|
// projectId: 305, |
|
|
|
|
// assessmentId: 1, |
|
|
|
|
studentId: this.studentId, |
|
|
|
|
projectId: projectId ? projectId : this.projectId, |
|
|
|
|
assessmentId: this.assessmentId |
|
|
|
|
}) |
|
|
|
|
.then(res => { |
|
|
|
|
if(!type){ |
|
|
|
|
this.handleData(res.message.project,1) |
|
|
|
|
this.projectId = res.message.project[0].projectId |
|
|
|
|
} |
|
|
|
|
this.points = res.message.points; |
|
|
|
|
this.tableData = res.message.points; |
|
|
|
|
let arr1 = this.tableData; |
|
|
|
|
let result1 = arr1.map(e => e.judgmentPointsId); |
|
|
|
|
this.judgmentPointsIds = this.judgmentPointsIds.concat(result1); |
|
|
|
|
|
|
|
|
|
if (this.projectPermissions == "1") { |
|
|
|
|
this.text = "剩余"; |
|
|
|
|
var interval = setInterval(() => { |
|
|
|
|
// 获取当前时间，同时得到活动结束时间数组 |
|
|
|
|
let newTime = new Date().getTime(); |
|
|
|
|
// 对结束时间进行处理渲染到页面 |
|
|
|
|
let endTime = new Date(this.actEndTime).getTime(); |
|
|
|
|
let obj = null; // 如果活动未结束，对时间进行处理 |
|
|
|
|
if (endTime - newTime > 0) { |
|
|
|
|
let time = (endTime - newTime) / 1000; // 获取天、时、分、秒 |
|
|
|
|
let day = parseInt(time / (60 * 60 * 24)); |
|
|
|
|
let hou = parseInt((time % (60 * 60 * 24)) / 3600); |
|
|
|
|
let min = parseInt(((time % (60 * 60 * 24)) % 3600) / 60); |
|
|
|
|
let sec = parseInt(((time % (60 * 60 * 24)) % 3600) % 60); |
|
|
|
|
obj = { |
|
|
|
|
day: this.timeFormat(day), |
|
|
|
|
hou: this.timeFormat(hou), |
|
|
|
|
min: this.timeFormat(min), |
|
|
|
|
sec: this.timeFormat(sec) |
|
|
|
|
}; |
|
|
|
|
} else { |
|
|
|
|
// 活动已结束，全部设置为'00' |
|
|
|
|
obj = { |
|
|
|
|
day: "00", |
|
|
|
|
hou: "00", |
|
|
|
|
min: "00", |
|
|
|
|
sec: "00" |
|
|
|
|
}; |
|
|
|
|
clearInterval(interval); |
|
|
|
|
} |
|
|
|
|
this.day = obj.day; |
|
|
|
|
this.hour = obj.hou; |
|
|
|
|
this.minutes = obj.min; |
|
|
|
|
this.seconds = obj.sec; |
|
|
|
|
}, 1000); |
|
|
|
|
} else if (this.projectPermissions == "0") { |
|
|
|
|
this.text = "已用"; |
|
|
|
|
// 获取当前时间 |
|
|
|
|
this.createTime = new Date().getTime(); |
|
|
|
|
//自动开始 |
|
|
|
|
if (this.autoStart) { |
|
|
|
|
this.startCountFn(); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
.catch(err => {}); |
|
|
|
|
}, |
|
|
|
|
getProjects(){ |
|
|
|
|
let data = { |
|
|
|
|
systemId: this.systemId, |
|
|
|
|
// schoolId: this.schoolId |
|
|
|
|
schoolId: '' |
|
|
|
|
} |
|
|
|
|
this.$get(`${this.api.queryTestProject}`,data).then(res => { |
|
|
|
|
this.handleData(res.message,2) |
|
|
|
|
}).catch(res => {}); |
|
|
|
|
}, |
|
|
|
|
selectProject(){ |
|
|
|
|
this.isSelected = true |
|
|
|
|
this.assessmentId = '' |
|
|
|
|
this.judgmentPointsIds = [] |
|
|
|
|
this.codeIds = [] |
|
|
|
|
this.getQueryProject(this.value1) |
|
|
|
|
this.isSubmit = false |
|
|
|
|
this.countVal = 0 |
|
|
|
|
newmain.$emit("isSubmit", this.isSubmit) |
|
|
|
|
}, |
|
|
|
|
counterFn(counterTime) { |
|
|
|
|
let leave1 = counterTime % (24 * 3600 * 1); //计算天数后剩余的毫秒数 |
|
|
|
|
let leave2 = leave1 % (3600 * 1); //计算小时数后剩余的毫秒数 |
|
|
|
|
let leave3 = leave2 % (60 * 1); //计算分钟数后剩余的毫秒数 |
|
|
|
|
let day = Math.floor(counterTime / (24 * 3600 * 1)); //计算相差天数 |
|
|
|
|
let hour = Math.floor(leave1 / (3600 * 1)); //计算相差小时 |
|
|
|
|
let minutes = Math.floor(leave2 / (60 * 1)); //计算相差分钟 |
|
|
|
|
let seconds = Math.round(leave3 / 1); //计算相差秒 |
|
|
|
|
day = day >= 10 ? day : "0" + day; |
|
|
|
|
hour = hour >= 10 ? hour : "0" + hour; |
|
|
|
|
minutes = minutes >= 10 ? minutes : "0" + minutes; |
|
|
|
|
seconds = seconds >= 10 ? seconds : "0" + seconds; |
|
|
|
|
this.day = day; |
|
|
|
|
this.hour = hour; |
|
|
|
|
this.minutes = minutes; |
|
|
|
|
this.seconds = seconds; |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
startCountFn() { |
|
|
|
|
if (!this.isStart) { |
|
|
|
|
this.countVal = this.countVal ? this.countVal : 0; |
|
|
|
|
let timer = setInterval(() => { |
|
|
|
|
this.counterFn(this.countVal++); |
|
|
|
|
}, 1000); |
|
|
|
|
this.globalTimer = timer; |
|
|
|
|
this.isStart = true; |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
passToParent(data) { |
|
|
|
|
this.$emit("getDataFromChild", data); |
|
|
|
|
}, |
|
|
|
|
getCookie(cookie_name) { |
|
|
|
|
//获取cookie中指定key的value |
|
|
|
|
var allcookies = document.cookie; //索引长度，开始索引的位置 |
|
|
|
|
var cookie_pos = allcookies.indexOf(cookie_name); // 如果找到了索引，就代表cookie存在,否则不存在 |
|
|
|
|
|
|
|
|
|
if (cookie_pos != -1) { |
|
|
|
|
// 把cookie_pos放在值的开始，只要给值加1即可 |
|
|
|
|
//计算取cookie值得开始索引，加的1为“=” |
|
|
|
|
cookie_pos = cookie_pos + cookie_name.length + 1; //计算取cookie值得结束索引 |
|
|
|
|
var cookie_end = allcookies.indexOf(";", cookie_pos); |
|
|
|
|
|
|
|
|
|
if (cookie_end == -1) { |
|
|
|
|
cookie_end = allcookies.length; |
|
|
|
|
} //得到想要的cookie的值 |
|
|
|
|
var value = unescape(allcookies.substring(cookie_pos, cookie_end)); |
|
|
|
|
} |
|
|
|
|
return value; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped> |
|
|
|
|
.break-all{ |
|
|
|
|
word-break: break-all; |
|
|
|
|
} |
|
|
|
|
.m_step { |
|
|
|
|
height: 150px; |
|
|
|
|
cursor: pointer; |
|
|
|
|
display: block !important; |
|
|
|
|
} |
|
|
|
|
.n_step { |
|
|
|
|
height: 150px; |
|
|
|
|
cursor: pointer; |
|
|
|
|
display: block !important; |
|
|
|
|
} |
|
|
|
|
//el-main |
|
|
|
|
.el-main { |
|
|
|
|
width: 60%; |
|
|
|
|
background-color: #fff; |
|
|
|
|
color: #333; |
|
|
|
|
padding: 0; |
|
|
|
|
font-size: 16px; |
|
|
|
|
margin: 0px 20px 10px 10px; |
|
|
|
|
white-space: pre-wrap; |
|
|
|
|
background: #fff url(../assets/img/bg1.png) top right no-repeat,url(../assets/img/bg2.png) bottom right no-repeat; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
::v-deep .el-collapse-item__wrap { |
|
|
|
|
border-bottom: none; |
|
|
|
|
} |
|
|
|
|
::v-deep .el-collapse-item__header { |
|
|
|
|
border-bottom: none; |
|
|
|
|
} |
|
|
|
|
::v-deep .el-tabs__content { |
|
|
|
|
margin: 0 20px; |
|
|
|
|
} |
|
|
|
|
::v-deep .el-icon-s-ticket:before { |
|
|
|
|
font-size: 16px; |
|
|
|
|
padding: 5px; |
|
|
|
|
color: $main-color; |
|
|
|
|
} |
|
|
|
|
::v-deep .el-collapse-item__arrow { |
|
|
|
|
margin: 0 5px 0 0; |
|
|
|
|
} |
|
|
|
|
::v-deep .el-icon-arrow-right:before { |
|
|
|
|
// content: "\e78f"; |
|
|
|
|
font-size: 12px; |
|
|
|
|
padding: 1px; |
|
|
|
|
margin-left: 10px; |
|
|
|
|
background-color: $main-color; |
|
|
|
|
border-radius: 50%; |
|
|
|
|
color: #ffffff; |
|
|
|
|
} |
|
|
|
|
::v-deep .el-tabs__item { |
|
|
|
|
font-size: 16px; |
|
|
|
|
} |
|
|
|
|
::v-deep .el-tabs--card > .el-tabs__header .el-tabs__nav { |
|
|
|
|
border: none; |
|
|
|
|
} |
|
|
|
|
::v-deep .el-tabs--card > .el-tabs__header .el-tabs__item { |
|
|
|
|
border-left: none; |
|
|
|
|
} |
|
|
|
|
::v-deep .el-tabs--card > .el-tabs__header { |
|
|
|
|
border-bottom: none; |
|
|
|
|
} |
|
|
|
|
::v-deep .el-collapse { |
|
|
|
|
border-bottom: none; |
|
|
|
|
border-top: none; |
|
|
|
|
height: 500px; |
|
|
|
|
overflow: hidden; |
|
|
|
|
overflow-y: auto; |
|
|
|
|
} |
|
|
|
|
::v-deep .el-tabs__item.is-active { |
|
|
|
|
color: #fff; |
|
|
|
|
background-color: $main-color; |
|
|
|
|
} |
|
|
|
|
::v-deep .el-tabs__header { |
|
|
|
|
padding: 5px 20px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
//el-aside |
|
|
|
|
.el-aside { |
|
|
|
|
color: #333; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.el-aside ::v-deep [class*=" el-icon-"], |
|
|
|
|
[class^="el-icon-"] { |
|
|
|
|
line-height: 40px; |
|
|
|
|
font-size: 16px; |
|
|
|
|
} |
|
|
|
|
.aside-header { |
|
|
|
|
margin: 0px 10px 10px 10px; |
|
|
|
|
background-color: #fff; |
|
|
|
|
} |
|
|
|
|
.aside-footer { |
|
|
|
|
margin: 0px 10px 10px 10px; |
|
|
|
|
background-color: #fff; |
|
|
|
|
} |
|
|
|
|
.header_h { |
|
|
|
|
height: 50px; |
|
|
|
|
background: url(../assets/img/header.png) 0 0/100% 100% no-repeat; |
|
|
|
|
justify-content: center; |
|
|
|
|
} |
|
|
|
|
.header_h i { |
|
|
|
|
color: #fff; |
|
|
|
|
} |
|
|
|
|
.header_h p { |
|
|
|
|
line-height: 40px; |
|
|
|
|
font-size: 16px; |
|
|
|
|
color: #fff; |
|
|
|
|
padding-left: 10px; |
|
|
|
|
} |
|
|
|
|
/deep/.el-card{ |
|
|
|
|
border: 0; |
|
|
|
|
border-radius: 0; |
|
|
|
|
} |
|
|
|
|
//表格 |
|
|
|
|
::v-deep .el-card__body { |
|
|
|
|
padding: 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
::v-deep .el-table--striped .el-table__body tr.el-table__row--striped td { |
|
|
|
|
background: #ffebf9; |
|
|
|
|
} |
|
|
|
|
::v-deep .el-table td, |
|
|
|
|
.el-table th.is-leaf { |
|
|
|
|
border-bottom: 0; |
|
|
|
|
} |
|
|
|
|
::v-deep .el-table th > .cell { |
|
|
|
|
font-weight: 100; |
|
|
|
|
} |
|
|
|
|
::v-deep .el-table thead { |
|
|
|
|
color: #ffffff; |
|
|
|
|
font-size: 10px; |
|
|
|
|
th{ |
|
|
|
|
padding: 5px 0; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
::v-deep .el-table th, |
|
|
|
|
.el-table tr { |
|
|
|
|
background-color: #ffc385; |
|
|
|
|
} |
|
|
|
|
::v-deep .el-table { |
|
|
|
|
font-size: 12px; |
|
|
|
|
color: #202020; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/deep/.el-collapse-item__content{ |
|
|
|
|
padding-left: 10px; |
|
|
|
|
padding-right: 10px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
//.el-header |
|
|
|
|
.el-header { |
|
|
|
|
color: #333; |
|
|
|
|
padding: 0 12px 0 20px; |
|
|
|
|
} |
|
|
|
|
.between { |
|
|
|
|
justify-content: space-between; |
|
|
|
|
} |
|
|
|
|
//字体样式 |
|
|
|
|
.font_css { |
|
|
|
|
margin: 0 10px; |
|
|
|
|
text-indent: 2em; |
|
|
|
|
font-size: 14px; |
|
|
|
|
padding: 10px 0; |
|
|
|
|
} |
|
|
|
|
//改变placeholder的样式 |
|
|
|
|
.select ::v-deep input::-webkit-input-placeholder { |
|
|
|
|
color: #333; |
|
|
|
|
} |
|
|
|
|
.select ::v-deep input::-moz-input-placeholder { |
|
|
|
|
color: #333; |
|
|
|
|
} |
|
|
|
|
.select ::v-deep input::-ms-input-placeholder { |
|
|
|
|
color: #333; |
|
|
|
|
} |
|
|
|
|
//下拉框的icon |
|
|
|
|
.select ::v-deep .el-input__icon { |
|
|
|
|
line-height: 60px; |
|
|
|
|
} |
|
|
|
|
//下拉框 |
|
|
|
|
.select ::v-deep .el-select__caret:before { |
|
|
|
|
content: "\e78f"; |
|
|
|
|
font-size: 16px; |
|
|
|
|
padding: 3px; |
|
|
|
|
background-color: $main-color; |
|
|
|
|
border-radius: 50%; |
|
|
|
|
color: #ffffff; |
|
|
|
|
} |
|
|
|
|
.select ::v-deep .el-input--suffix .el-input__inner { |
|
|
|
|
color: #333; |
|
|
|
|
font-size: 14px; |
|
|
|
|
border-radius: 30px; |
|
|
|
|
border: none; |
|
|
|
|
background-color: #fff; |
|
|
|
|
margin-left: 15px; |
|
|
|
|
overflow: hidden; |
|
|
|
|
text-overflow: ellipsis; |
|
|
|
|
white-space: nowrap; |
|
|
|
|
// white-space: pre-line; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.select ::v-deep .el-input { |
|
|
|
|
padding: 10px 0; |
|
|
|
|
} |
|
|
|
|
//实训时间、得分 |
|
|
|
|
.countDownBox { |
|
|
|
|
font-size: 16px; |
|
|
|
|
margin: 0 10px; |
|
|
|
|
padding: 20px 0; |
|
|
|
|
} |
|
|
|
|
.timeSpan { |
|
|
|
|
color: #333333; |
|
|
|
|
padding: 5px 15px; |
|
|
|
|
font-size: 14px; |
|
|
|
|
background: #ffffff; |
|
|
|
|
border-radius: 18px; |
|
|
|
|
margin: 0 5px; |
|
|
|
|
text-align: center; |
|
|
|
|
} |
|
|
|
|
.gradeSpan { |
|
|
|
|
color: #878787; |
|
|
|
|
padding: 10px; |
|
|
|
|
font-size: 14px; |
|
|
|
|
background: #ffc385; |
|
|
|
|
border-radius: 6px; |
|
|
|
|
text-align: center; |
|
|
|
|
} |
|
|
|
|
//重新开始、提交 |
|
|
|
|
.el-header ::v-deep .el-button { |
|
|
|
|
background-color: $main-color; |
|
|
|
|
color: #fff; |
|
|
|
|
border: none; |
|
|
|
|
margin: 5px 0px 5px 5px; |
|
|
|
|
font-size: 16px; |
|
|
|
|
} |
|
|
|
|
.el-header .submit-btn{ |
|
|
|
|
padding-left: 30px; |
|
|
|
|
padding-right: 30px; |
|
|
|
|
background: $main-color url(../assets/img/btn.png) 0 0/100% 100% no-repeat; |
|
|
|
|
} |
|
|
|
|
.el-header ::v-deep .el-button:hover, |
|
|
|
|
.el-button:focus, |
|
|
|
|
.el-button:active { |
|
|
|
|
background-color: $main-color; |
|
|
|
|
color: #fff; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
//公共类 |
|
|
|
|
::v-deep .el-container { |
|
|
|
|
height: 80%; |
|
|
|
|
} |
|
|
|
|
.el-container.is-vertical { |
|
|
|
|
background-color: #f5f5f5; |
|
|
|
|
width: 85%; |
|
|
|
|
height: 70%; |
|
|
|
|
position: fixed; |
|
|
|
|
top: 200px; |
|
|
|
|
bottom: 20px; |
|
|
|
|
left: 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.flex { |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 滚动条的宽度 |
|
|
|
|
.scrollbar ::-webkit-scrollbar { |
|
|
|
|
width: 2px; // 横向滚动条 |
|
|
|
|
height: 6px; // 纵向滚动条 必写 |
|
|
|
|
} |
|
|
|
|
// 滚动条的滑块 |
|
|
|
|
.scrollbar ::-webkit-scrollbar-thumb { |
|
|
|
|
background-color: $main-color; |
|
|
|
|
border-radius: 3px; |
|
|
|
|
box-shadow: inset 0 0 5px #dddddd; |
|
|
|
|
} |
|
|
|
|
.scrollbar ::-webkit-scrollbar-track { |
|
|
|
|
/*滚动条里面轨道*/ |
|
|
|
|
box-shadow: inset 0 0 5px #dddddd; |
|
|
|
|
border-radius: 0; |
|
|
|
|
background: #dddddd; |
|
|
|
|
} |
|
|
|
|
</style> |
