From eb010c8d0f12c4861d2fde556f8ca441ba5e10d9 Mon Sep 17 00:00:00 2001
From: lohir <3399054449@qq.com>
Date: 星期三, 16 十月 2024 09:59:24 +0800
Subject: [PATCH] bug
---
src/views/exam/exam/ExamManage.vue | 407 +++++++++++++++++++++++++--------------------------------
1 files changed, 180 insertions(+), 227 deletions(-)
diff --git a/src/views/exam/exam/ExamManage.vue b/src/views/exam/exam/ExamManage.vue
index f609511..a2e8232 100644
--- a/src/views/exam/exam/ExamManage.vue
+++ b/src/views/exam/exam/ExamManage.vue
@@ -1,100 +1,100 @@
<template>
- <div class="c">
- <div class="bg">
- <div class="main">
- <div class="main-1">
- <div class="main-btn">
- <el-button
- type="primary"
- @click="openAdd"
- >瀹夋帓鑰冭瘯
- </el-button>
- </div>
- <div>
- <el-form :inline="true" :model="searchForm" class="demo-form-inline">
- <el-form-item label="鑰冭瘯鍚嶇О">
- <el-input v-model="searchForm.examName" @input="page" clearable size="small" clearable @clear="page" placeholder="鐝骇鍚嶇О"></el-input>
- </el-form-item>
- <el-form-item label="鍙傝�冪彮绾�">
- <el-select v-model="searchForm.classesId" @change="page" clearable @clear="page">
- <el-option v-for="classes in classesList" :key="classes.id" :value="classes.id" :label="classes.className"/>
- </el-select>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" @click="page" size="small">鏌ヨ</el-button>
- </el-form-item>
- </el-form>
- <div>
- <el-table :data="tableData">
- <el-table-column
- label="鑰冭瘯鍚嶇О"
- prop="examName"
- ></el-table-column>
- <el-table-column
- label="鑰冭瘯璇曞嵎"
- prop="examPaperName"
- ></el-table-column>
- <el-table-column
- label="鍙傝�冪彮绾�"
- prop="className"
- ></el-table-column>
- <el-table-column
- label="鐝骇浜烘暟"
- prop="studentNum"
- ></el-table-column>
- <el-table-column
- label="鑰冭瘯鍦扮偣"
- prop="examPlace"
- ></el-table-column>
- <el-table-column
- label="鑰冭瘯鐘舵��"
- prop="status"
- :formatter="statusFormatter"
- ></el-table-column>
- <el-table-column
- label="鍒涘缓鏃堕棿"
- width="150px"
- prop="createTime"
- ></el-table-column>
- <el-table-column
- label="鑰冭瘯鏃堕棿"
- width="200px"
- algin="center"
- >
- <template slot-scope="scope">
- <div>{{scope.row.startTime}}</div>
- <div>鑷�</div>
- <div>{{scope.row.endTime}}</div>
- </template>
- </el-table-column>
- <el-table-column label="鎿嶄綔" fiexd="right" width="150px">
- <template slot-scope="scope">
- <el-button
- type="primary"
- size="small"
- @click="handlerEdit(scope.row)"
- >淇敼
- </el-button>
- <el-button type="danger" size="small" @click="deleteExam(scope.row.id)">鍒犻櫎</el-button>
- <el-button type="success" size="small" @click="markPaper(scope.row)">闃呭嵎</el-button>
- </template>
- </el-table-column>
- </el-table>
- </div>
- <div
- class="flex"
- style="justify-content:center;margin-top:20px;"
- >
- <pagination v-show="total>0" :total="total" :page.sync="searchForm.pageIndex" :limit.sync="searchForm.pageSize"
- @pagination="page"/>
- </div>
- </div>
- </div>
+ <div class="app-container">
+ <div style="display: flex; flex-direction: row">
+ <div>
+ <el-button type="primary" size="small" style="margin-right: 10px" @click="openAdd">瀹夋帓鑰冭瘯</el-button>
</div>
-
+ <div>
+ <el-form :inline="true" :model="searchForm" class="demo-form-inline">
+ <el-form-item label="鑰冭瘯鍚嶇О">
+ <el-input v-model="searchForm.examName" @input="page" clearable size="small" clearable @clear="page"
+ placeholder="鐝骇鍚嶇О"></el-input>
+ </el-form-item>
+ <el-form-item label="鍙傝�冪彮绾�">
+ <el-select v-model="searchForm.classesId" @change="page" clearable @clear="page">
+ <el-option v-for="classes in classesList" :key="classes.id" :value="classes.id"
+ :label="classes.className"/>
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" @click="page" size="small">鏌ヨ</el-button>
+ </el-form-item>
+ </el-form>
+ </div>
</div>
+ <el-table :data="tableData" border>
+ <el-table-column
+ label="鑰冭瘯鍚嶇О"
+ prop="examName"
+ ></el-table-column>
+ <el-table-column
+ label="鑰冭瘯璇曞嵎"
+ prop="examPaperName"
+ ></el-table-column>
+ <el-table-column
+ label="鍙傝�冪彮绾�"
+ prop="className"
+ ></el-table-column>
+ <!-- <el-table-column-->
+ <!-- label="鐝骇浜烘暟"-->
+ <!-- prop="studentNum"-->
+ <!-- ></el-table-column>-->
+ <el-table-column
+ label="鑰冭瘯鍦扮偣"
+ prop="examPlace"
+ ></el-table-column>
+ <el-table-column
+ label="鑰冭瘯鐘舵��"
+ prop="status"
+ :formatter="statusFormatter"
+ ></el-table-column>
+ <el-table-column
+ label="鑰冭瘯鏃堕棿"
+ width="180px"
+ algin="center"
+ >
+ <template slot-scope="scope">
+ <div>{{ scope.row.startTime }}</div>
+ <div>鑷�</div>
+ <div>{{ scope.row.endTime }}</div>
+ </template>
+ </el-table-column>
+ <el-table-column
+ label="鍒涘缓鏃堕棿"
+ width="150px"
+ prop="createTime"
+ ></el-table-column>
+ <el-table-column label="鎿嶄綔" fiexd="right" width="280px">
+ <template slot-scope="scope">
+ <el-button
+ type="primary"
+ size="small"
+ @click="handlerEdit(scope.row)"
+ >淇敼
+ </el-button>
+ <el-popconfirm
+ v-if="scope.row.status === 'not_start'"
+ style="margin: 0 5px"
+ title="纭畾瑕佸垹闄よ鑰冭瘯鍚楋紵"
+ @confirm="deleteExam(scope.row.id)"
+ >
+ <el-button slot="reference" type="danger" size="small">鍒犻櫎</el-button>
+ </el-popconfirm>
-
+ <el-button v-if="scope.row.status === 'finished'" type="success" size="small" @click="markPaper(scope.row)">
+ 闃呭嵎
+ </el-button>
+ <el-button type="warning" size="small" @click="monitor(scope.row)">鐩戞帶</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ <div
+ class="flex"
+ style="justify-content:center;margin-top:20px;"
+ >
+ <pagination v-show="total>0" :total="total" :page.sync="searchForm.pageIndex" :limit.sync="searchForm.pageSize"
+ @pagination="page"/>
+ </div>
<el-dialog width="500px" :title="title" @close="closeHandler" :visible.sync="open" :destroy-on-close="true"
:append-to-body="true" :close-on-click-modal="false">
<el-form :model="examForm" :rules="examRules" ref="examForm">
@@ -115,16 +115,20 @@
</el-form-item>
<el-form-item label="鑰冭瘯璇曞嵎" :label-width="formLabelWidth" prop="examPaperId">
<el-select v-model="examForm.examPaperId" :disabled="!examForm.examPaperType" placeholder="璇峰厛閫夋嫨璇曞嵎绫诲瀷">
- <el-option v-for="examPaper in examPaperList" :key="examPaper.id" :value="examPaper.id" :label="examPaper.name"/>
+ <el-option v-for="examPaper in examPaperList" :key="examPaper.id" :value="examPaper.id"
+ :label="examPaper.name"/>
</el-select>
</el-form-item>
<el-form-item label="寮�濮嬫椂闂�" :label-width="formLabelWidth" prop="time">
<el-date-picker
v-model="examForm.time"
- type="daterange"
+ type="datetimerange"
+ format="yyyy-MM-dd HH:mm:ss"
+ value-format="yyyy-MM-dd HH:mm:ss"
range-separator="鑷�"
start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡">
+ end-placeholder="缁撴潫鏃ユ湡"
+ >
</el-date-picker>
</el-form-item>
<el-form-item label="鑰冭瘯鍦扮偣" :label-width="formLabelWidth" prop="examPlace">
@@ -140,28 +144,29 @@
</template>
<script>
-import Pagination from "@/components/Pagination"
-import { getExams, addExam, editExam, deleteExamById } from "@/api/exam"
-import { myClasses } from "@/api/classes"
-import examPaperAPI from "@/api/examPaper"
+import Pagination from '@/components/Pagination'
+import { getExams, addExam, editExam, deleteExamById } from '@/api/exam'
+import { myClasses } from '@/api/classes'
+import examPaperAPI from '@/api/examPaper'
+
export default {
components: { Pagination },
- data() {
+ data () {
return {
- formLabelWidth: "80px",
+ formLabelWidth: '80px',
classesList: [],
examPaperList: [],
examForm: {
id: null,
- examName: "",
- examPaperId: "",
- classesId: "",
+ examName: '',
+ examPaperId: '',
+ classesId: '',
examPaperType: null,
- examPlace: "",
- status: "",
- startTime: "",
- endTime: "",
- time: [],
+ examPlace: '',
+ status: '',
+ startTime: null,
+ endTime: null,
+ time: []
},
examRules: {
examName: [
@@ -181,76 +186,87 @@
],
time: [
{ required: true, message: '璇烽�夋嫨鑰冭瘯鏃堕棿', trigger: 'change' }
- ],
+ ]
},
total: 0,
- title: "瀹夋帓鑰冭瘯",
+ title: '瀹夋帓鑰冭瘯',
open: false,
searchForm: {
- examName: "",
+ examName: '',
subject: null,
pageIndex: 1,
pageSize: 10
},
- tableData: [
- ],
- };
+ tableData: []
+ }
},
- mounted() {
- this.page();
+ mounted () {
+ this.page()
this.getMyClasses()
this.MyExamPaperList()
},
methods: {
- markPaper(row) {
+ // 鑰冭瘯鐩戞帶鍒楄〃
+ monitor (row) {
+ this.$router.push({ path: '/exam/monitor', query: { examId: row.id } })
+ },
+ markPaper (row) {
// 璺宠浆闃呭嵎椤甸潰
- this.$router.push({path: "/exam/mark/paper", query: {examName: row.examName, examId: row.id}})
+ this.$router.push({ path: '/exam/mark/paper', query: { examName: row.examName, examId: row.id } })
},
- timeFormatter(row) {
- return row.startTime + "鑷�" + row.endTime
+ timeFormatter (row) {
+ return row.startTime + '鑷�' + row.endTime
},
- statusFormatter(row) {
- if (row.status === "ing") {
- return "杩涜涓�"
- } else if (row.status === "not_start") {
- return "鏈紑濮�"
- } else if (row.status === "finished") {
- return "宸茬粨鏉�"
+ statusFormatter (row) {
+ if (row.status === 'ing') {
+ return '杩涜涓�'
+ } else if (row.status === 'not_start') {
+ return '鏈紑濮�'
+ } else if (row.status === 'finished') {
+ return '宸茬粨鏉�'
}
},
- MyExamPaperList() {
+ MyExamPaperList () {
let param = {
- "paperType": this.examForm.examPaperType
+ 'paperType': this.examForm.examPaperType
}
examPaperAPI.myExamPaperList(param).then(res => {
this.examForm.examPaperId = null
this.examPaperList = res.data
})
},
- getMyExamPaperList() {
- if (! this.examForm.examPaperType) {
+ getMyExamPaperList () {
+ if (!this.examForm.examPaperType) {
return
}
this.MyExamPaperList()
},
- getMyClasses() {
+ getMyClasses () {
myClasses().then(res => {
this.classesList = res.data.data
})
},
- deleteExam(id) {
- deleteExamById(id).then(res => {
- this.$message.success("鍒犻櫎鎴愬姛")
- this.page()
+ deleteExam (row) {
+ this.$confirm('纭鏄惁鍒犻櫎' + row.examName + '?', '鎻愮ず', {
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning'
+ }).then(() => {
+ deleteExamById(row.id).then(res => {
+ this.$message.success('鍒犻櫎鎴愬姛')
+ this.page()
+ })
})
},
- handlerEdit(row) {
- this.examForm = row
- this.examForm.time = [row.startTime, row.endTime]
- this.title = "淇敼鑰冭瘯"
+ handlerEdit (row) {
+ this.examForm = {
+ ...row,
+ time: [row.startTime, row.endTime]
+ }
+ this.title = '淇敼鑰冭瘯'
this.open = true
},
- addOrEditExam() {
+ addOrEditExam () {
this.$refs['examForm'].validate((valid) => {
if (valid) {
this.examForm.startTime = this.examForm.time[0]
@@ -259,119 +275,56 @@
editExam(this.examForm).then(res => {
this.open = false
this.clearForm()
- this.$message.success("鎿嶄綔鎴愬姛")
+ this.$message.success('鎿嶄綔鎴愬姛')
this.page()
})
} else {
addExam(this.examForm).then(res => {
this.open = false
this.clearForm()
- this.$message.success("鎿嶄綔鎴愬姛")
+ this.$message.success('鎿嶄綔鎴愬姛')
this.page()
})
}
}
})
},
- clearForm() {
+ clearForm () {
this.examForm = {
id: null,
- examName: "",
- examPaperId: "",
- classesId: "",
- examPaperType: "",
- examPlace: "",
- status: "",
- startTime: "",
- endTime: "",
+ examName: '',
+ examPaperId: '',
+ classesId: '',
+ examPaperType: '',
+ examPlace: '',
+ status: '',
+ startTime: null,
+ endTime: null,
+ time: []
}
},
- closeHandler() {
+ closeHandler () {
this.open = false
this.clearForm()
},
- openAdd() {
- this.title = this.examForm.id ? "淇敼鑰冭瘯" : "瀹夋帓鑰冭瘯"
+ openAdd () {
+ this.title = this.examForm.id ? '淇敼鑰冭瘯' : '瀹夋帓鑰冭瘯'
this.open = true
},
- formatterType(row) {
+ formatterType (row) {
},
- page() {
+ page () {
getExams(this.searchForm).then(res => {
this.tableData = res.data.data
this.total = res.data.total
})
},
- routerTo(url) {
- this.$router.push(url);
+ routerTo (url) {
+ this.$router.push(url)
},
- },
-};
+ }
+}
</script>
<style scoped lang="scss">
-.flex {
- display: flex;
-}
-
-.mian-1-top {
- margin: 10px 0;
- align-items: center;
-
- & input {
- height: 30px;
- width: 200px;
- margin-right: 20px;
- }
-}
-
-// .c{
-// background-image:url('../../assets/img/loginBackground.jpg');
-// width:100vw;
-// height:calc(100vh - 75px);
-// background-size: cover;
-// }
-// .bg{
-// width:100%;
-// height:100%;
-// background: rgba(255,255,255,0.2);
-// display: flex;
-// justify-content: center;
-
-// }
-.main {
- &-title {
- border-left: 5px solid rgb(16, 71, 247);
- padding-left: 10px;
- margin: 50px 0;
-
- & p {
- font-weight: 700;
- }
- }
-
- &-1 {
- width: 1227px;
- height: 784px;
- background: white;
- box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.1);
- border-radius: 10px;
- padding: 32px 40px;
- }
-
- &-btn {
- padding-bottom: 32px;
- border-bottom: 3px solid rgb(16, 71, 247);
- }
-}
-
-.deepBlue {
- background: rgb(16, 71, 247);
- color: white;
- border: none;
-
- &:hover {
- background-color: rgb(45, 92, 248);
- }
-}
</style>
--
Gitblit v1.8.0