From 1bff236fdad53af7f5616ddeedba47af3df7b7e9 Mon Sep 17 00:00:00 2001
From: xiangpei <xiangpei@timesnew.cn>
Date: 星期四, 13 六月 2024 09:38:28 +0800
Subject: [PATCH] 考试管理
---
src/api/exam.js | 61 +++++++
src/router.js | 12 +
src/views/exam/exam/ExamManage.vue | 364 ++++++++++++++++++---------------------------
3 files changed, 218 insertions(+), 219 deletions(-)
diff --git a/src/api/exam.js b/src/api/exam.js
new file mode 100644
index 0000000..04b3180
--- /dev/null
+++ b/src/api/exam.js
@@ -0,0 +1,61 @@
+import axios from "./request";
+
+// 鑾峰彇鑰冭瘯鍒嗛〉
+export const getExams = (params) => {
+ return axios({
+ url: "/api/exam/page",
+ method: "GET",
+ params: params
+ })
+}
+
+// 鑾峰彇鑰冭瘯鍒楄〃
+export const getExamList = () => {
+ return axios({
+ url: "/api/exam/list",
+ method: "GET"
+ })
+}
+
+// 閫氳繃id鑾峰彇鑰冭瘯
+export const getExamById = (params) => {
+ return axios({
+ url: "/api/exam/" + params,
+ method: "GET"
+ })
+}
+
+// 閫氳繃id鍒犻櫎鑰冭瘯
+export const deleteExamById = (params) => {
+ return axios({
+ url: "/api/exam/" + params,
+ method: "DELETE"
+ })
+}
+
+// 鎵归噺鍒犻櫎鑰冭瘯
+export const deleteExamByIds = (params) => {
+ return axios({
+ url: "/api/exam/batch",
+ method: "DELETE",
+ data: params
+ })
+}
+
+// 淇敼鑰冭瘯
+export const editExam = (params) => {
+ return axios({
+ url: "/api/exam/",
+ method: "PUT",
+ data: params
+ })
+}
+
+// 娣诲姞鑰冭瘯
+export const addExam = (params) => {
+ return axios({
+ url: "/api/exam/",
+ method: "POST",
+ data: params
+ })
+}
diff --git a/src/router.js b/src/router.js
index 1632554..d0e8b31 100644
--- a/src/router.js
+++ b/src/router.js
@@ -37,6 +37,18 @@
]
},
{
+ path: '/exam',
+ component: Layout,
+ children: [
+ {
+ path: '/manage',
+ component: () => import('@/views/exam/exam/ExamManage'),
+ name: 'Exam',
+ meta: { title: '鑰冭瘯绠＄悊', icon: 'exam', affix: true }
+ }
+ ]
+ },
+ {
path: '/user',
component: Layout,
name: 'UserPage',
diff --git a/src/views/exam/exam/ExamManage.vue b/src/views/exam/exam/ExamManage.vue
index f609511..472322f 100644
--- a/src/views/exam/exam/ExamManage.vue
+++ b/src/views/exam/exam/ExamManage.vue
@@ -1,100 +1,89 @@
<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="210px">
+ <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
+ 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,7 +104,8 @@
</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">
@@ -140,27 +130,28 @@
</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: "",
+ examPlace: '',
+ status: '',
+ startTime: '',
+ endTime: '',
time: [],
},
examRules: {
@@ -184,73 +175,72 @@
],
},
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) {
+ 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) {
+ deleteExam (id) {
deleteExamById(id).then(res => {
- this.$message.success("鍒犻櫎鎴愬姛")
+ this.$message.success('鍒犻櫎鎴愬姛')
this.page()
})
},
- handlerEdit(row) {
+ handlerEdit (row) {
this.examForm = row
this.examForm.time = [row.startTime, row.endTime]
- this.title = "淇敼鑰冭瘯"
+ this.title = '淇敼鑰冭瘯'
this.open = true
},
- addOrEditExam() {
+ addOrEditExam () {
this.$refs['examForm'].validate((valid) => {
if (valid) {
this.examForm.startTime = this.examForm.time[0]
@@ -259,119 +249,55 @@
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: '',
+ endTime: '',
}
},
- 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