|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 3.0 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 3.1 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
@ -0,0 +1,426 @@ |
||||
<template> |
||||
<div> |
||||
<el-card shadow="hover" class="m-b-10"> |
||||
<div class="title m-b-20"><img src="../../../assets/img/index/plan.png" alt=""> 我的考试计划</div> |
||||
<div> |
||||
<el-date-picker v-model="date" align="right" unlink-panels type="daterange" start-placeholder="开始日期" end-placeholder="结束日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" clearable></el-date-picker> |
||||
</div> |
||||
</el-card> |
||||
|
||||
<el-card shadow="hover" class="m-b-30"> |
||||
<div class="text-center text-grey m-b-10">考试计划表</div> |
||||
|
||||
<el-table |
||||
:data="listData" |
||||
ref="table" |
||||
row-key="id" |
||||
class="table" |
||||
stripe |
||||
header-align="center" |
||||
> |
||||
<el-table-column type="index" width="100" label="序号" align="center"> |
||||
<template |
||||
slot-scope="scope" |
||||
>{{scope.$index + (page - 1) * pageSize + 1}}</template> |
||||
</el-table-column> |
||||
<el-table-column prop="assessmentName" label="考核名称" align="center"></el-table-column> |
||||
<el-table-column label="考核类型" align="center"> |
||||
<template slot-scope="scope"> |
||||
{{getTypeName(scope.row.type)}} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="duration" label="考核时长（分钟）" align="center"></el-table-column> |
||||
<el-table-column prop="createTime" label="创建时间" align="center"></el-table-column> |
||||
<el-table-column prop="name" label="考核状态" align="center"> |
||||
<template slot-scope="scope"> |
||||
{{getStateName(scope.row.state)}} |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
<div class="pagination"> |
||||
<el-pagination |
||||
background |
||||
@current-change="handleCurrentChange" |
||||
:current-page="page" |
||||
:page-size="pageSize" |
||||
layout="total,prev, pager, next" |
||||
:total="total" |
||||
></el-pagination> |
||||
</div> |
||||
</el-card> |
||||
|
||||
<el-card shadow="hover" class="m-b-10"> |
||||
<div class="title"><img src="../../../assets/img/index/testPaper.png" alt=""> 待批阅的试卷</div> |
||||
</el-card> |
||||
|
||||
<el-card shadow="hover" class="m-b-30"> |
||||
<ul class="review"> |
||||
<li v-for="(item,index) in reviewList" :key="index"> |
||||
<div class="btn flex j-end"> |
||||
<button type="button" @click="review(item)"><img src="../../../assets/img/index/edit.png" alt=""> 批阅</button> |
||||
</div> |
||||
<p class="text">考试名称：{{item.assessmentName}}</p> |
||||
<p class="text">{{item.startTime}} 到 {{item.endTime}}</p> |
||||
<div class="member flex"> |
||||
<p class="m-r-20">应试人数：<span>{{item.shouldArrive}}人</span></p> |
||||
<p>已考试人数：<span>{{item.alreadyExam}}人</span></p> |
||||
</div> |
||||
</li> |
||||
</ul> |
||||
<div class="pagination"> |
||||
<el-pagination |
||||
background |
||||
@current-change="handleReviewCurrentChange" |
||||
:current-page="pageReview" |
||||
:page-size="pageSizeReview" |
||||
layout="total,prev, pager, next" |
||||
:total="totalReview" |
||||
></el-pagination> |
||||
</div> |
||||
</el-card> |
||||
|
||||
<el-card shadow="hover" class="m-b-10"> |
||||
<div class="title"><img src="../../../assets/img/index/class.png" alt=""> 学生管理</div> |
||||
</el-card> |
||||
|
||||
<el-card shadow="hover" class="m-b-30"> |
||||
<ul class="class"> |
||||
<li v-for="(item,index) in classList" :key="index" :class="'index' + index"> |
||||
<p class="name">{{item.className}}</p> |
||||
<p class="text">班级：{{item.className}}</p> |
||||
<!-- <p class="text">人数：30人</p> --> |
||||
<!-- <p class="text">创建时间：测试</p> --> |
||||
<div class="action flex j-end"> |
||||
<button class="edit" @click="editClass(item)"></button> |
||||
<button class="del" @click="delClass(item)"></button> |
||||
</div> |
||||
</li> |
||||
</ul> |
||||
<div class="pagination"> |
||||
<el-pagination |
||||
background |
||||
@current-change="handleClassCurrentChange" |
||||
:current-page="pageClass" |
||||
:page-size="pageSizeClass" |
||||
layout="total,prev, pager, next" |
||||
:total="totalClass" |
||||
></el-pagination> |
||||
</div> |
||||
</el-card> |
||||
|
||||
<el-card shadow="hover" class="m-b-10"> |
||||
<div class="title"><img src="../../../assets/img/index/msg.png" alt=""> 待回复提问</div> |
||||
</el-card> |
||||
<el-card shadow="hover"> |
||||
<ul class="list"> |
||||
<li v-for="(item,index) in msgList" :key="index"> |
||||
<div class="item"> |
||||
<div class="inner"> |
||||
<img class="avatar" :src="item.userAvatars" alt=""> |
||||
<div class="texts"> |
||||
<div class="title"> |
||||
<span class="username">{{item.userName}}</span> |
||||
<span class="publish">发表于</span> |
||||
<span class="date">{{item.createTime}}</span> |
||||
</div> |
||||
<div class="desc" v-html="item.content"></div> |
||||
</div> |
||||
</div> |
||||
<div class="action"> |
||||
<button v-if="item.userId != userId" class="btn" @click="showReply(item)">回复</button> |
||||
<button v-else class="btn" @click="delMsg(item)">删除</button> |
||||
</div> |
||||
<div class="reply" v-if="item.showReply"> |
||||
<quill :border="true" v-model="item.replyContent" :toTop="false" :height="150" /> |
||||
<div class="m-t-10 text-right"> |
||||
<el-button type="primary" size="mini" @click="submitComment(item)">提交</el-button> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</li> |
||||
</ul> |
||||
</el-card> |
||||
|
||||
<el-dialog title="编辑班级" :visible.sync="classVisible" width="24%" center :close-on-click-modal="false"> |
||||
<el-input placeholder="请输入班级名称" v-model="curClass.className"></el-input> |
||||
<span slot="footer" class="dialog-footer"> |
||||
<el-button @click="classVisible = false">取消</el-button> |
||||
<el-button type="primary" @click="saveClass">确定</el-button> |
||||
</span> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
<script> |
||||
import { mapState,mapGetters,mapActions } from 'vuex' |
||||
import quill from '@/components/quill' |
||||
import util from '@/libs/util' |
||||
export default { |
||||
data() { |
||||
return { |
||||
date: [util.formatDate('yyyy-MM-dd'),util.formatDate('yyyy-MM-dd')], |
||||
startTime: '', |
||||
endTime: '', |
||||
page: 1, |
||||
pageSize: 10, |
||||
total: 0, |
||||
listData: [], |
||||
pageReview: 1, |
||||
pageSizeReview: 5, |
||||
totalReview: 0, |
||||
reviewList: [], |
||||
pageClass: 1, |
||||
pageSizeClass: 5, |
||||
totalClass: 0, |
||||
classList: [], |
||||
classListAll: [], |
||||
msgList: [], |
||||
curClass: {}, |
||||
classVisible: false, |
||||
}; |
||||
}, |
||||
computed: { |
||||
...mapState('user', [ |
||||
'userId','clientId' |
||||
]), |
||||
...mapGetters('assessment', [ |
||||
'getTypeName','getStateName' |
||||
]) |
||||
}, |
||||
watch: { |
||||
date: function(val){ |
||||
if(val){ |
||||
this.startTime = val[0] |
||||
this.endTime = val[1] |
||||
}else{ |
||||
this.startTime = '' |
||||
this.endTime = '' |
||||
} |
||||
this.getData() |
||||
} |
||||
}, |
||||
components: { |
||||
quill |
||||
}, |
||||
mounted() { |
||||
this.getData() |
||||
this.getReview() |
||||
this.getClass() |
||||
this.getMsg() |
||||
}, |
||||
methods: { |
||||
...mapActions('assessment', [ |
||||
'setAssInfo' |
||||
]), |
||||
getData() { |
||||
this.$post(`${this.api.waitExam}?userId=${this.userId}&pageNum=${this.page}&pageSize=${this.pageSize}&startTime=${this.startTime}&endTime=${this.endTime}`) |
||||
.then(res => { |
||||
this.listData = this.handleList(res.data.list.list) |
||||
this.total = res.data.list.totalCount |
||||
}).catch(err => {}) |
||||
}, |
||||
handleCurrentChange(val) { |
||||
this.page = val |
||||
this.getData() |
||||
}, |
||||
getReview() { |
||||
this.$post(`${this.api.waitReview}?userId=${this.userId}&pageNum=${this.pageReview}&pageSize=${this.pageSizeReview}&startTime=${this.startTime}&endTime=${this.endTime}`) |
||||
.then(res => { |
||||
this.reviewList = res.data.list.list |
||||
this.totalReview = res.data.list.totalCount |
||||
}) |
||||
}, |
||||
handleReviewCurrentChange(val) { |
||||
this.pageReview = val |
||||
this.getReview() |
||||
}, |
||||
review(row){ |
||||
this.setAssInfo({ |
||||
id: row.id |
||||
}) |
||||
this.$router.push('/assessment/review') |
||||
}, |
||||
getClass() { |
||||
this.$post(`${this.api.getMineClass}?userId=${this.userId}`) |
||||
.then(res => { |
||||
this.classListAll = res.data.list |
||||
this.totalClass = res.data.list.length |
||||
this.handleClassPage() |
||||
}).catch(err => {}) |
||||
}, |
||||
handleClassPage(){ |
||||
this.classList = this.classListAll.slice((this.pageClass - 1) * this.pageSizeClass,this.pageClass * this.pageSizeClass) |
||||
}, |
||||
handleClassCurrentChange(val) { |
||||
this.pageClass = val |
||||
this.handleClassPage() |
||||
}, |
||||
editClass(row){ |
||||
this.classVisible = true |
||||
this.curClass = row |
||||
}, |
||||
delClass(item){ |
||||
this.$confirm('确定要删除吗？', '提示', { |
||||
type: 'warning' |
||||
}).then(() => { |
||||
this.$post(`${this.api.deleteClass}?classIds=${item.classId}`).then(res => { |
||||
this.$message.success('删除成功') |
||||
this.getClass() |
||||
}).catch(res => {}) |
||||
}).catch(() => {}) |
||||
}, |
||||
saveClass(){ |
||||
if(!this.curClass.className) return this.$message.warning('请输入班级名称') |
||||
if(isNaN(this.curClass.className)) return this.$message.warning('班级名称必须为数字') |
||||
let data = { |
||||
className: this.curClass.className, |
||||
classId: this.curClass.classId, |
||||
gradeId: '' |
||||
} |
||||
this.$post(this.api.updateClass,data).then(res => { |
||||
this.$message.success('编辑成功') |
||||
this.classVisible = false |
||||
}).catch(res => {}) |
||||
}, |
||||
getMsg() { |
||||
this.$post(`${this.api.waitReply}?schoolId=${this.clientId}&userId=${this.userId}`) |
||||
.then(res => { |
||||
this.msgList = this.handleList(res.data.list) |
||||
}).catch(err => {}) |
||||
}, |
||||
handleList(list){ |
||||
list.map(n => { |
||||
n.userAvatars = n.userAvatars ? n.userAvatars : 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png' |
||||
n.showReply = false |
||||
n.replyContent = '' |
||||
n.children = [] |
||||
n.showChildren = false |
||||
}) |
||||
return list |
||||
}, |
||||
showReply(row){ |
||||
row.showReply = !row.showReply |
||||
}, |
||||
delMsg(row){ |
||||
this.$post(`${this.api.waitReplyDel}?userId=${this.userId}&bid=${row.bid}`).then(res => { |
||||
this.$message.success('删除成功') |
||||
this.getMsg() |
||||
}).catch(res => {}) |
||||
}, |
||||
submitComment(row){ |
||||
let data = { |
||||
bid: row.bid, |
||||
content: row.replyContent, |
||||
commentUserId: this.userId, |
||||
schoolId: this.clientId, |
||||
} |
||||
this.$post(this.api.saveComment,data).then(res => { |
||||
this.$message.success('提交成功') |
||||
row.replyContent = '' |
||||
this.getMsg() |
||||
}).catch(res => {}) |
||||
}, |
||||
} |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
@import "@/styles/pages/messageBoard.scss"; |
||||
|
||||
.title{ |
||||
display: flex; |
||||
align-items: center; |
||||
font-size: 16px; |
||||
color: #6f6f6f; |
||||
img{ |
||||
width: 20px; |
||||
margin-right: 5px; |
||||
} |
||||
} |
||||
.review{ |
||||
display: flex; |
||||
justify-content: space-between; |
||||
li{ |
||||
width: 32%; |
||||
min-height: 180px; |
||||
padding: 20px 30px; |
||||
margin-right: 10px; |
||||
background: url(../../../assets/img/index/testPaper-icon.png) 90% 70% no-repeat,url(../../../assets/img/index/bg.png) 0 0/100% 100% no-repeat; |
||||
button{ |
||||
color: #198cff; |
||||
font-size: 12px; |
||||
background-color: transparent; |
||||
border: 0; |
||||
cursor: pointer; |
||||
img{ |
||||
width: 15px; |
||||
margin-right: 5px; |
||||
} |
||||
} |
||||
.text{ |
||||
margin-bottom: 20px; |
||||
font-size: 14px; |
||||
color: #444; |
||||
} |
||||
.member{ |
||||
font-size: 14px; |
||||
color: #444; |
||||
span{ |
||||
color: #198cff; |
||||
font-weight: bold; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
.class{ |
||||
display: flex; |
||||
li{ |
||||
width: 19%; |
||||
padding: 15px 20px; |
||||
margin-right: .5%; |
||||
background: url(../../../assets/img/index/bg1.png) 0 0/100% 100% no-repeat; |
||||
&.index1{ |
||||
background-image: url(../../../assets/img/index/bg2.png); |
||||
} |
||||
&.index2{ |
||||
background-image: url(../../../assets/img/index/bg3.png); |
||||
} |
||||
&.index3{ |
||||
background-image: url(../../../assets/img/index/bg4.png); |
||||
} |
||||
&.index4{ |
||||
background-image: url(../../../assets/img/index/bg5.png); |
||||
} |
||||
.name{ |
||||
padding-bottom: 5px; |
||||
margin-bottom: 10px; |
||||
text-align: center; |
||||
color: #fff; |
||||
font-size: 16px; |
||||
font-weight: bold; |
||||
border-bottom: 1px solid #fff; |
||||
} |
||||
.text{ |
||||
font-size: 14px; |
||||
color: #fff; |
||||
line-height: 1.8; |
||||
} |
||||
.action{ |
||||
margin-bottom: 20px; |
||||
.edit{ |
||||
width: 20px; |
||||
height: 20px; |
||||
margin-right: 15px; |
||||
background-color: transparent; |
||||
border: 0; |
||||
background: url(../../../assets/img/index/pen.png) 0 0/100% 100% no-repeat; |
||||
cursor: pointer; |
||||
} |
||||
.del{ |
||||
@extend .edit; |
||||
width: 16px; |
||||
background-image: url(../../../assets/img/index/del.png); |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,23 @@ |
||||
import BasicLayout from '@/layouts/home'; |
||||
|
||||
const meta = {}; |
||||
|
||||
const pre = 'index-'; |
||||
|
||||
export default { |
||||
path: '/index', |
||||
name: 'index', |
||||
redirect: { |
||||
name: `${pre}list` |
||||
}, |
||||
meta, |
||||
component: BasicLayout, |
||||
children: [ |
||||
{ |
||||
name: `${pre}list`, |
||||
path: `list`, |
||||
component: () => import('@/pages/index/list'), |
||||
meta: { title: '首页' } |
||||
}, |
||||
] |
||||
}; |
||||
@ -0,0 +1,85 @@ |
||||
.list{ |
||||
li{ |
||||
padding-bottom: 10px; |
||||
border-top: 1px solid #f1f1f1; |
||||
&:first-child{ |
||||
border-top: 0; |
||||
} |
||||
.inner{ |
||||
position: relative; |
||||
display: flex; |
||||
justify-content: space-between; |
||||
padding: 10px 0 20px; |
||||
.avatar{ |
||||
width: 40px; |
||||
height: 40px; |
||||
border-radius: 50%; |
||||
} |
||||
.texts{ |
||||
flex: 1; |
||||
margin-left: 10px; |
||||
.title{ |
||||
margin-bottom: 5px; |
||||
font-size: 14px; |
||||
.username{ |
||||
color: $main-color; |
||||
} |
||||
.publish{ |
||||
margin: 0 5px; |
||||
color: #d6d6d6; |
||||
} |
||||
.date{ |
||||
color: #b5b5b5; |
||||
} |
||||
} |
||||
} |
||||
.right{ |
||||
.index{ |
||||
font-size: 12px; |
||||
color: #ccc; |
||||
} |
||||
} |
||||
} |
||||
.action{ |
||||
text-align: right; |
||||
.btn{ |
||||
padding: 2px 4px; |
||||
color: $main-color; |
||||
font-size: 12px; |
||||
background-color: #fff; |
||||
border: 1px solid; |
||||
border-radius: 4px; |
||||
cursor: pointer; |
||||
&:hover{ |
||||
opacity: .8; |
||||
} |
||||
&:first-child{ |
||||
margin-right: 5px; |
||||
} |
||||
} |
||||
} |
||||
.reply{ |
||||
margin-top: 20px; |
||||
} |
||||
} |
||||
&.children{ |
||||
padding: 0 10px 10px; |
||||
margin: 10px 0 0 30px; |
||||
background-color: #f3f4f6; |
||||
li{ |
||||
border-top-color: #fff; |
||||
} |
||||
} |
||||
} |
||||
.toggle{ |
||||
margin: 10px 0; |
||||
text-align: center; |
||||
color: $main-color; |
||||
font-size: 12px; |
||||
span{ |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
/deep/.quill{ |
||||
background-color: #fff; |
||||
} |
||||