parent
5ae8d84b88
commit
095587c343
@ -1,99 +0,0 @@
|
|||||||
<!--
|
|
||||||
* 成绩统计页面
|
|
||||||
*
|
|
||||||
* @Author: ShanZhu
|
|
||||||
* @Date: 2023-11-23
|
|
||||||
-->
|
|
||||||
<template>
|
|
||||||
<div id="grade">
|
|
||||||
<div ref="box" class="box"></div>
|
|
||||||
<div class="notFound" v-if="isNull">
|
|
||||||
<i class="iconfont icon-LC_icon_tips_fill"></i
|
|
||||||
><span>该考生未参加考试</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
name: "grade",
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
isNull: false, //原始数据
|
|
||||||
tableDataX: [], //x轴数据 保存次数
|
|
||||||
tableDataY: [], //y轴数据 保存分数
|
|
||||||
};
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.score();
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
score() {
|
|
||||||
let studentId = this.$route.query.studentId;
|
|
||||||
this.$axios(`/api/score/${studentId}`).then((res) => {
|
|
||||||
//根据学生Id查询成绩
|
|
||||||
if (res.data.code == 200) {
|
|
||||||
let rootData = res.data.data;
|
|
||||||
rootData.forEach((element, index) => {
|
|
||||||
|
|
||||||
// 科目名称转列显示
|
|
||||||
var insertIntervalString = (
|
|
||||||
originStr,
|
|
||||||
disNum = 10,
|
|
||||||
insertStr = "\n"
|
|
||||||
) =>
|
|
||||||
originStr.replace(
|
|
||||||
new RegExp("(.{" + disNum + "})", "g"),
|
|
||||||
"$1" + insertStr
|
|
||||||
);
|
|
||||||
// 每隔一个字符插入一个回车
|
|
||||||
var subject = insertIntervalString(element.subject, 3, "\n");
|
|
||||||
|
|
||||||
this.tableDataX.push(subject);
|
|
||||||
this.tableDataY.push(element.etScore);
|
|
||||||
});
|
|
||||||
let boxDom = this.$refs["box"];
|
|
||||||
let scoreCharts = this.$echarts.init(boxDom);
|
|
||||||
let option = {
|
|
||||||
xAxis: {
|
|
||||||
type: "category",
|
|
||||||
data: this.tableDataX,
|
|
||||||
},
|
|
||||||
yAxis: {
|
|
||||||
type: "value",
|
|
||||||
},
|
|
||||||
series: [
|
|
||||||
{
|
|
||||||
data: this.tableDataY,
|
|
||||||
type: "line",
|
|
||||||
itemStyle: { normal: { label: { show: true } } },
|
|
||||||
},
|
|
||||||
],
|
|
||||||
};
|
|
||||||
scoreCharts.setOption(option);
|
|
||||||
scoreCharts.on("mouseover", (params) => {
|
|
||||||
console.log(params.value);
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
this.isNull = true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="less" scoped>
|
|
||||||
#grade {
|
|
||||||
position: relative;
|
|
||||||
.box {
|
|
||||||
width: 600px;
|
|
||||||
height: 400px;
|
|
||||||
}
|
|
||||||
.notFound {
|
|
||||||
position: absolute;
|
|
||||||
top: 0px;
|
|
||||||
left: 0px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,169 +0,0 @@
|
|||||||
<!--
|
|
||||||
* 开始成绩页面
|
|
||||||
*
|
|
||||||
|
|
||||||
-->
|
|
||||||
<template>
|
|
||||||
<div class="score">
|
|
||||||
<br>
|
|
||||||
<div class="total">
|
|
||||||
<div class="look">
|
|
||||||
本次考试成绩
|
|
||||||
</div>
|
|
||||||
<div class="show">
|
|
||||||
<div class="number" :class="{'border': isTransition}">
|
|
||||||
<span>{{score}}</span>
|
|
||||||
<span>分数</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<ul class="time">
|
|
||||||
<li class="start"><span>开始时间</span> <span>{{startTime}}</span></li>
|
|
||||||
<li class="end"><span>结束时间</span> <span>{{endTime}}</span></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
isTransition: false, //是否渲染完成
|
|
||||||
score: 0, //总分
|
|
||||||
startTime: null, //考试开始时间
|
|
||||||
endTime: null, //考试结束时间
|
|
||||||
}
|
|
||||||
},
|
|
||||||
created() {
|
|
||||||
this.transiton()
|
|
||||||
this.getScore()
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
transiton() { //一秒后过渡
|
|
||||||
setTimeout(() => {
|
|
||||||
this.isTransition = true
|
|
||||||
},1000)
|
|
||||||
},
|
|
||||||
getScore() {
|
|
||||||
let score = this.$route.query.score
|
|
||||||
let startTime = this.$route.query.startTime
|
|
||||||
let endTime = this.$route.query.endTime
|
|
||||||
this.score = score
|
|
||||||
this.startTime = startTime
|
|
||||||
this.endTime = endTime
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="less" scoped>
|
|
||||||
.show {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
img {
|
|
||||||
width: 160px;
|
|
||||||
height: 160px;
|
|
||||||
}
|
|
||||||
.img1Transform {
|
|
||||||
opacity: 1 !important;
|
|
||||||
transform: translateX(30px) !important;
|
|
||||||
transition: all 0.6s ease !important;
|
|
||||||
}
|
|
||||||
.img2Transform {
|
|
||||||
opacity: 1 !important;
|
|
||||||
transform: translateX(-30px) !important;
|
|
||||||
transition: all 0.6s ease !important;
|
|
||||||
}
|
|
||||||
.img1 {
|
|
||||||
margin-top: 70px;
|
|
||||||
opacity: 0;
|
|
||||||
transform: translateX(0px);
|
|
||||||
transition: all 0.6s ease;
|
|
||||||
}
|
|
||||||
.img2 {
|
|
||||||
margin-top: 30px;
|
|
||||||
opacity: 0;
|
|
||||||
transform: translateX(0px);
|
|
||||||
transition: all 0.6s ease;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.time {
|
|
||||||
padding: 0px 70px;
|
|
||||||
li {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-around;
|
|
||||||
padding: 10px;
|
|
||||||
margin: 20px 0px;
|
|
||||||
}
|
|
||||||
li:nth-child(1) {
|
|
||||||
background-color: #fcf8e3;
|
|
||||||
}
|
|
||||||
li:nth-child(2) {
|
|
||||||
background-color: #e9f5e9;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.border {
|
|
||||||
border: 6px solid #36aafd !important;
|
|
||||||
transition: all 2s ease;
|
|
||||||
width: 160px !important;
|
|
||||||
height: 160px !important;
|
|
||||||
transform: rotate(360deg) !important;
|
|
||||||
opacity: 1 !important;
|
|
||||||
}
|
|
||||||
.score {
|
|
||||||
max-width: 800px;
|
|
||||||
margin: 0 auto;
|
|
||||||
.title {
|
|
||||||
margin: 60px 0px 30px 0px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
flex-direction: column;
|
|
||||||
.name {
|
|
||||||
font-size: 26px;
|
|
||||||
color: inherit;
|
|
||||||
font-weight: 500;
|
|
||||||
}
|
|
||||||
.description {
|
|
||||||
font-size: 14px;
|
|
||||||
color: #888;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.total {
|
|
||||||
border: 1px solid #dbdbdb;
|
|
||||||
background-color: #fff;
|
|
||||||
padding: 40px;
|
|
||||||
.look {
|
|
||||||
border-bottom: 1px solid #dbdbdb;
|
|
||||||
padding: 0px 0px 14px 14px;
|
|
||||||
color: #36aafd;
|
|
||||||
}
|
|
||||||
.number {
|
|
||||||
opacity: 0;
|
|
||||||
border: 6px solid #fff;
|
|
||||||
transform: rotate(0deg);
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
flex-direction: column;
|
|
||||||
margin: 0 auto;
|
|
||||||
width: 160px;
|
|
||||||
height: 160px;
|
|
||||||
border-radius: 50%;
|
|
||||||
margin-top: 80px;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
transition: all 1s ease;
|
|
||||||
|
|
||||||
span:nth-child(1) {
|
|
||||||
font-size: 36px;
|
|
||||||
font-weight: 600;
|
|
||||||
}
|
|
||||||
span:nth-child(2) {
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
@ -1,273 +0,0 @@
|
|||||||
<!--
|
|
||||||
* 点击试卷缩略信息
|
|
||||||
*
|
|
||||||
|
|
||||||
-->
|
|
||||||
<template>
|
|
||||||
<div id="msg">
|
|
||||||
<div class="title">
|
|
||||||
<span>试卷列表</span>
|
|
||||||
<span>/ {{examData.source}}</span>
|
|
||||||
</div>
|
|
||||||
<div class="wrapper">
|
|
||||||
<ul class="top">
|
|
||||||
<li class="example">{{examData.source}}</li>
|
|
||||||
<li><i class="iconfont icon-pen-"></i></li>
|
|
||||||
<li><i class="iconfont icon-share"></i></li>
|
|
||||||
<li class="right">
|
|
||||||
<div>
|
|
||||||
<span class="count">总分</span>
|
|
||||||
<span class="score">{{score[0]+score[1]+score[2]}}</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<ul class="bottom">
|
|
||||||
<li>更新于{{examData.examDate}}</li>
|
|
||||||
<li>来自 {{examData.institute}}</li>
|
|
||||||
<li class="btn">{{examData.type}}</li>
|
|
||||||
<li class="right"><el-button @click="toAnswer(examData.examCode)">{{$store.state.isPractice==true?'开始练习':'开始考试'}}</el-button></li>
|
|
||||||
</ul>
|
|
||||||
<ul class="info">
|
|
||||||
<li @click="dialogVisible = true"><a href="javascript:;"><i class="iconfont icon-info"></i>考生须知</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="content">
|
|
||||||
<el-collapse v-model="activeName" >
|
|
||||||
<el-collapse-item class="header" name="0">
|
|
||||||
<template slot="title">
|
|
||||||
<div class="title">
|
|
||||||
<span>{{examData.source}}</span><i class="header-icon el-icon-info"></i>
|
|
||||||
<span class="time">{{score[0]+score[1]+score[2]}}分 / {{examData.totalTime}}分钟</span>
|
|
||||||
<el-button type="primary" size="small">点击查看试题详情</el-button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<el-collapse class="inner">
|
|
||||||
<el-collapse-item>
|
|
||||||
<template slot="title">
|
|
||||||
<div class="titlei">选择题 (共{{topicCount[0]}}题 共计{{score[0]}}分)</div>
|
|
||||||
</template>
|
|
||||||
<div class="contenti">
|
|
||||||
<ul class="question" v-for="(list, index) in topic[1]" :key="index">
|
|
||||||
<li>{{index+1}}. {{list.question}} {{list.score}}分</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</el-collapse-item>
|
|
||||||
<el-collapse-item>
|
|
||||||
<template slot="title">
|
|
||||||
<div class="titlei">填空题 (共{{topicCount[1]}}题 共计{{score[1]}}分)</div>
|
|
||||||
</template>
|
|
||||||
<div class="contenti">
|
|
||||||
<ul class="question" v-for="(list, index) in topic[2]" :key="index">
|
|
||||||
<li>{{topicCount[0]+index+1}}.{{list.question}} {{list.score}}分</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</el-collapse-item>
|
|
||||||
<el-collapse-item>
|
|
||||||
<template slot="title">
|
|
||||||
<div class="titlei">判断题 (共{{topicCount[2]}}题 共计{{score[2]}}分)</div>
|
|
||||||
</template>
|
|
||||||
<div class="contenti">
|
|
||||||
<ul class="question" v-for="(list, index) in topic[3]" :key="index">
|
|
||||||
<li>{{topicCount[0]+topicCount[1]+index+1}}. {{list.question}} {{list.score}}分</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</el-collapse-item>
|
|
||||||
</el-collapse>
|
|
||||||
</el-collapse-item>
|
|
||||||
|
|
||||||
</el-collapse>
|
|
||||||
</div>
|
|
||||||
<!--考生须知对话框-->
|
|
||||||
<el-dialog
|
|
||||||
title="考生须知"
|
|
||||||
:visible.sync="dialogVisible"
|
|
||||||
width="30%">
|
|
||||||
<span>{{examData.tips}}</span>
|
|
||||||
<span slot="footer" class="dialog-footer">
|
|
||||||
<el-button @click="dialogVisible = false">知道了</el-button>
|
|
||||||
</span>
|
|
||||||
</el-dialog>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
dialogVisible: false, //对话框属性
|
|
||||||
activeName: '0', //默认打开序号
|
|
||||||
topicCount: [],//每种类型题目的总数
|
|
||||||
score: [], //每种类型分数的总数
|
|
||||||
examData: { //考试信息
|
|
||||||
// source: null,
|
|
||||||
// totalScore: null,
|
|
||||||
},
|
|
||||||
topic: { //试卷信息
|
|
||||||
|
|
||||||
},
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.init()
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
//初始化页面数据
|
|
||||||
init() {
|
|
||||||
let examCode = this.$route.query.examCode //获取路由传递过来的试卷编号
|
|
||||||
this.$axios(`/api/exam/${examCode}`).then(res => { //通过examCode请求试卷详细信息
|
|
||||||
res.data.data.examDate = res.data.data.examDate.substr(0,10)
|
|
||||||
this.examData = { ...res.data.data}
|
|
||||||
let paperId = this.examData.paperId
|
|
||||||
this.$axios(`/api/paper/${paperId}`).then(res => { //通过paperId获取试题题目信息
|
|
||||||
this.topic = {...res.data}
|
|
||||||
let keys = Object.keys(this.topic) //对象转数组
|
|
||||||
keys.forEach(e => {
|
|
||||||
let data = this.topic[e]
|
|
||||||
this.topicCount.push(data.length)
|
|
||||||
let currentScore = 0
|
|
||||||
for(let i = 0; i< data.length; i++) { //循环每种题型,计算出总分
|
|
||||||
currentScore += data[i].score
|
|
||||||
}
|
|
||||||
this.score.push(currentScore) //把每种题型总分存入score
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
},
|
|
||||||
toAnswer(id) {
|
|
||||||
this.$router.push({path:"/answer",query:{examCode: id}})
|
|
||||||
},
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="less" scoped>
|
|
||||||
.bottom {
|
|
||||||
.right{
|
|
||||||
.el-button{
|
|
||||||
color: #409EFF;
|
|
||||||
border-color: #c6e2ff;
|
|
||||||
background-color: #ecf5ff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.right {
|
|
||||||
margin-left: auto;
|
|
||||||
}
|
|
||||||
.inner .contenti .question {
|
|
||||||
margin-left: 40px;
|
|
||||||
color: #9a9a9a;
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
.content .inner .titlei {
|
|
||||||
margin-left: 20px;
|
|
||||||
font-size: 16px;
|
|
||||||
color: #88949b;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
.content .title .time {
|
|
||||||
font-size: 16px;
|
|
||||||
margin-left: 420px;
|
|
||||||
color: #999;
|
|
||||||
}
|
|
||||||
.content .stitle {
|
|
||||||
background-color: #0195ff;
|
|
||||||
}
|
|
||||||
.content .title span {
|
|
||||||
margin-right: 10px;
|
|
||||||
}
|
|
||||||
#msg .content .title {
|
|
||||||
font-size: 20px;
|
|
||||||
margin: 0px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
.content {
|
|
||||||
margin-top: 20px;
|
|
||||||
background-color: #fff;
|
|
||||||
}
|
|
||||||
.content .header {
|
|
||||||
padding: 10px 30px;
|
|
||||||
}
|
|
||||||
.wrapper .info {
|
|
||||||
margin: 20px 0px 0px 20px;
|
|
||||||
border-top: 1px solid #eee;
|
|
||||||
padding: 20px 0px 10px 0px;
|
|
||||||
}
|
|
||||||
.wrapper .info a {
|
|
||||||
color: #88949b;
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
.wrapper .info a:hover {
|
|
||||||
color: #0195ff;
|
|
||||||
}
|
|
||||||
.wrapper .bottom .btn {
|
|
||||||
cursor: pointer;
|
|
||||||
padding: 5px 10px;
|
|
||||||
border: 1px solid #88949b;
|
|
||||||
border-radius: 4px;
|
|
||||||
}
|
|
||||||
.wrapper .bottom {
|
|
||||||
display: flex;
|
|
||||||
margin-left: 20px;
|
|
||||||
color: #999;
|
|
||||||
font-size: 14px;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
.wrapper .bottom li {
|
|
||||||
margin-right: 14px;
|
|
||||||
}
|
|
||||||
#msg {
|
|
||||||
background-color: #eee;
|
|
||||||
width: 980px;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
#msg .title {
|
|
||||||
margin: 20px;
|
|
||||||
}
|
|
||||||
#msg .wrapper {
|
|
||||||
background-color: #fff;
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
.wrapper .top {
|
|
||||||
display: flex;
|
|
||||||
margin: 20px;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
.wrapper .top .right {
|
|
||||||
margin-left: auto;
|
|
||||||
}
|
|
||||||
.wrapper .top .example {
|
|
||||||
color: #333;
|
|
||||||
font-size: 22px;
|
|
||||||
font-weight: 700;
|
|
||||||
}
|
|
||||||
.wrapper .top li i {
|
|
||||||
margin-left: 20px;
|
|
||||||
color: #88949b;
|
|
||||||
}
|
|
||||||
.wrapper .right .count {
|
|
||||||
margin-right: 60px;
|
|
||||||
color: #fff;
|
|
||||||
padding: 4px 10px;
|
|
||||||
background-color: #88949b;
|
|
||||||
border-top-left-radius: 4px;
|
|
||||||
border-bottom-left-radius: 4px;
|
|
||||||
border: 1px solid #88949b;
|
|
||||||
}
|
|
||||||
.wrapper .right .score {
|
|
||||||
position: absolute;
|
|
||||||
left: 53px;
|
|
||||||
top: -5px;
|
|
||||||
padding: 1px 12px;
|
|
||||||
font-size: 20px;
|
|
||||||
color: #88949b;
|
|
||||||
border: 1px dashed #88949b;
|
|
||||||
border-left: none;
|
|
||||||
border-top-right-radius: 4px;
|
|
||||||
border-bottom-right-radius: 4px;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
.wrapper .right div {
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,151 +0,0 @@
|
|||||||
<!--
|
|
||||||
* 学生考试首页
|
|
||||||
*
|
|
||||||
|
|
||||||
-->
|
|
||||||
<template>
|
|
||||||
<div id="student">
|
|
||||||
<el-row class="padding-50">
|
|
||||||
<el-col :span="24">
|
|
||||||
<ul class="list">
|
|
||||||
<li class="logo"><span>在线考试系统</span></li>
|
|
||||||
<li @click="exam()"><a href="javascript:;" >考试中心</a></li>
|
|
||||||
<li @click="practice()"><a href="javascript:;" >试卷练习</a></li>
|
|
||||||
<li><router-link to="/scoreTable">我的分数</router-link></li>
|
|
||||||
<li><router-link to="/message">交流区</router-link></li>
|
|
||||||
<li class="right" @mouseenter="flag = !flag" @mouseleave="flag = !flag">
|
|
||||||
<a href="javascript:;"><i class="iconfont icon-Userselect icon"></i>{{user.userName}}</a>
|
|
||||||
<div class="msg" v-if="flag">
|
|
||||||
<p @click="manage()">修改密码</p>
|
|
||||||
<p class="exit" @click="exit()">退出</p>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
<!--路由区域-->
|
|
||||||
<div class="main">
|
|
||||||
<router-view></router-view>
|
|
||||||
</div>
|
|
||||||
<v-footer></v-footer>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import myFooter from "@/components/student/myFooter"
|
|
||||||
import {mapState} from 'vuex'
|
|
||||||
export default {
|
|
||||||
components: {
|
|
||||||
"v-footer": myFooter
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
flag: false,
|
|
||||||
user: {}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
created() {
|
|
||||||
this.userInfo()
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
exit() { //退出登录
|
|
||||||
this.$router.push({path:"/"}) //跳转到登录页面
|
|
||||||
this.$cookies.remove("cname") //清除cookie
|
|
||||||
this.$cookies.remove("cid")
|
|
||||||
this.$cookies.remove("rb_token") //清除cookie
|
|
||||||
this.$cookies.remove("rb_role")
|
|
||||||
},
|
|
||||||
manage() { //跳转到修改密码页面
|
|
||||||
this.$router.push({path: '/manager'})
|
|
||||||
},
|
|
||||||
userInfo() {
|
|
||||||
let studentName = this.$cookies.get("cname")
|
|
||||||
let studentId = this.$cookies.get("cid")
|
|
||||||
console.log(`studentId${studentId}`)
|
|
||||||
console.log(`studentName ${studentName}`)
|
|
||||||
this.user.userName = studentName
|
|
||||||
this.user.studentId = studentId
|
|
||||||
},
|
|
||||||
practice() { //跳转练习模式
|
|
||||||
let isPractice = true
|
|
||||||
this.$store.commit("practice", isPractice)
|
|
||||||
this.$router.push({path:'/startExam'})
|
|
||||||
},
|
|
||||||
exam() { //跳转考试模式
|
|
||||||
let isPractice = false
|
|
||||||
this.$store.commit("practice", isPractice)
|
|
||||||
this.$router.push({path:'/student'})
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed:mapState(["isPractice"])
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
.right .icon {
|
|
||||||
margin-right: 6px;
|
|
||||||
}
|
|
||||||
#student .padding-50 {
|
|
||||||
margin: 0 auto;
|
|
||||||
padding: 0 50px;
|
|
||||||
box-shadow: 0 0 10px 4px rgba(1,149,255,0.1);
|
|
||||||
background-color: #fff;
|
|
||||||
}
|
|
||||||
.list a {
|
|
||||||
text-decoration: none;
|
|
||||||
color: #334046;
|
|
||||||
}
|
|
||||||
li {
|
|
||||||
list-style: none;
|
|
||||||
height: 60px;
|
|
||||||
line-height: 60px;
|
|
||||||
}
|
|
||||||
#student .list{
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
#student .list li {
|
|
||||||
padding: 0 20px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
#student .list li:hover {
|
|
||||||
background-color: #0195ff;
|
|
||||||
transition: all 2s ease;
|
|
||||||
}
|
|
||||||
#student .list li:hover a {
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
#student .list .right {
|
|
||||||
margin-left: auto;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
#student .list li.right :hover a {
|
|
||||||
color: #000;
|
|
||||||
}
|
|
||||||
#student .list .logo {
|
|
||||||
display: flex;
|
|
||||||
font-weight: bold;
|
|
||||||
color: #2f6c9f;
|
|
||||||
}
|
|
||||||
#student .list .logo i {
|
|
||||||
font-size: 50px;
|
|
||||||
}
|
|
||||||
.right .msg {
|
|
||||||
text-align: center;
|
|
||||||
position: absolute;
|
|
||||||
top: 60px;
|
|
||||||
left: 0px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
border-radius: 2px;
|
|
||||||
border-bottom: 3px solid #0195ff;
|
|
||||||
background-color: #fff;
|
|
||||||
}
|
|
||||||
.right .msg p {
|
|
||||||
height: 40px;
|
|
||||||
line-height: 40px;
|
|
||||||
width: 105px;
|
|
||||||
}
|
|
||||||
.right .msg p:hover {
|
|
||||||
background-color: #0195ff;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,110 +0,0 @@
|
|||||||
<!--
|
|
||||||
* 管理中心
|
|
||||||
*
|
|
||||||
|
|
||||||
-->
|
|
||||||
<template>
|
|
||||||
<div id='manager'>
|
|
||||||
<el-form :model="ruleForm2" status-icon :rules="rules2" ref="ruleForm2" label-width="100px" class="demo-ruleForm">
|
|
||||||
<h3 class="alter">修改你的密码</h3>
|
|
||||||
<el-form-item label="密码" prop="pass" class="pass">
|
|
||||||
<el-input type="password" v-model="ruleForm2.pass" autocomplete="off"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="确认密码" prop="checkPass">
|
|
||||||
<el-input type="password" v-model="ruleForm2.checkPass" autocomplete="off"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" @click="submitForm('ruleForm2')">提交</el-button>
|
|
||||||
<el-button @click="resetForm('ruleForm2')">重置</el-button>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
var validatePass = (rule, value, callback) => {
|
|
||||||
if (value === '') {
|
|
||||||
callback(new Error('请输入密码'));
|
|
||||||
} else {
|
|
||||||
if (this.ruleForm2.checkPass !== '') {
|
|
||||||
this.$refs.ruleForm2.validateField('checkPass');
|
|
||||||
}
|
|
||||||
callback();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
var validatePass2 = (rule, value, callback) => {
|
|
||||||
if (value === '') {
|
|
||||||
callback(new Error('请再次输入密码'));
|
|
||||||
} else if (value !== this.ruleForm2.pass) {
|
|
||||||
callback(new Error('两次输入密码不一致!'));
|
|
||||||
} else {
|
|
||||||
callback();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
return {
|
|
||||||
ispass: true,
|
|
||||||
ruleForm2: {
|
|
||||||
pass: '',
|
|
||||||
checkPass: ''
|
|
||||||
},
|
|
||||||
rules2: {
|
|
||||||
pass: [
|
|
||||||
{ validator: validatePass, trigger: 'blur' }
|
|
||||||
],
|
|
||||||
checkPass: [
|
|
||||||
{ validator: validatePass2, trigger: 'blur' }
|
|
||||||
]
|
|
||||||
}
|
|
||||||
};
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
submitForm(formName) {
|
|
||||||
this.$refs[formName].validate((valid) => {
|
|
||||||
if (valid) {
|
|
||||||
let studentId = this.$cookies.get("cid")
|
|
||||||
this.$axios({ //修改密码
|
|
||||||
url: '/api/studentPWD',
|
|
||||||
method: 'put',
|
|
||||||
data: {
|
|
||||||
pwd: this.ruleForm2.pass,
|
|
||||||
studentId
|
|
||||||
}
|
|
||||||
}).then(res => {
|
|
||||||
if(res.data != null ) { //修改成功提示
|
|
||||||
this.$message({
|
|
||||||
message: '密码修改成功...',
|
|
||||||
type: 'success'
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
console.log('error submit!!');
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
resetForm(formName) {
|
|
||||||
this.$refs[formName].resetFields();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
#manager .pass label{
|
|
||||||
color: red;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
#manager {
|
|
||||||
width: 600px;
|
|
||||||
margin: 0 auto;
|
|
||||||
margin-top: 100px;
|
|
||||||
text-align: center;
|
|
||||||
margin-bottom: 300px;
|
|
||||||
}
|
|
||||||
#manager .alter {
|
|
||||||
margin: 30px 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,43 +0,0 @@
|
|||||||
<!--
|
|
||||||
* 页脚部分
|
|
||||||
*
|
|
||||||
-->
|
|
||||||
<template>
|
|
||||||
<footer id="footer">
|
|
||||||
<ul>
|
|
||||||
<li><a href="javascript:;">关于我们</a></li>
|
|
||||||
<li><a href="javascript:;">免责声明</a></li>
|
|
||||||
<li><a href="javascript:;">使用协议</a></li>
|
|
||||||
<li>@Copyright 杭州水果捞</li>
|
|
||||||
</ul>
|
|
||||||
</footer>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
name: "myFooter"
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
#footer a {
|
|
||||||
color: #919698;
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
#footer {
|
|
||||||
background-color: #eee;
|
|
||||||
}
|
|
||||||
#footer ul {
|
|
||||||
margin-top: 40px;
|
|
||||||
border-top: 1px solid #d5d5d5;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
height: 80px;
|
|
||||||
line-height: 80px;
|
|
||||||
}
|
|
||||||
#footer ul li {
|
|
||||||
color: #919698;
|
|
||||||
font-size: 14px;
|
|
||||||
margin-right: 20px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
Loading…
Reference in new issue