From 3fdb38dd19c8a61d91d789c83074a7e8a3c10897 Mon Sep 17 00:00:00 2001
From: luohairen <3399054449@qq.com>
Date: 星期四, 31 十月 2024 13:32:12 +0800
Subject: [PATCH] 优化
---
src/views/exam/exam/ExamManage.vue | 223 ++++++++++++++++++++++++++++++++++++++++++-------------
1 files changed, 168 insertions(+), 55 deletions(-)
diff --git a/src/views/exam/exam/ExamManage.vue b/src/views/exam/exam/ExamManage.vue
index 2304018..83b70f0 100644
--- a/src/views/exam/exam/ExamManage.vue
+++ b/src/views/exam/exam/ExamManage.vue
@@ -2,22 +2,46 @@
<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>
+ <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" @clear="page"
- placeholder="鐝骇鍚嶇О"></el-input>
+ <el-input
+ v-model="searchForm.examName"
+ @input="page"
+ clearable
+ size="small"
+ @clear="page"
+ placeholder="鑰冭瘯鍚嶇О"
+ ></el-input>
</el-form-item>
<el-form-item label="鍙傝�冪彮绾�">
- <el-select v-model="searchForm.classesId" @change="page" clearable size="small" @clear="page">
- <el-option v-for="classes in classesList" :key="classes.id" :value="classes.id"
- :label="classes.className"/>
+ <el-select
+ v-model="searchForm.classesId"
+ @change="page"
+ clearable
+ size="small"
+ @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-button type="primary" @click="page" size="small"
+ >鏌ヨ</el-button
+ >
</el-form-item>
</el-form>
</div>
@@ -52,11 +76,7 @@
prop="status"
:formatter="statusFormatter"
></el-table-column>
- <el-table-column
- label="鑰冭瘯鏃堕棿"
- width="180px"
- algin="center"
- >
+ <el-table-column label="鑰冭瘯鏃堕棿" width="180px" algin="center">
<template slot-scope="scope">
<div>{{ scope.row.startTime }}</div>
<div>鑷�</div>
@@ -76,31 +96,54 @@
@click="handlerEdit(scope.row)"
v-if="scope.row.status === 'not_start'"
v-show="scope.row.status !== 'cancel'"
- >淇敼
+ >淇敼
</el-button>
<el-popconfirm
v-if="scope.row.status === 'not_start'"
v-show="scope.row.status !== 'cancel'"
style="margin: 0 5px"
title="纭畾瑕佸垹闄よ鑰冭瘯鍚楋紵"
- @confirm="deleteExam(scope.row.id)"
+ @confirm="deleteExam(scope.row)"
>
- <el-button slot="reference" type="danger" size="small" v-show="scope.row.status !== 'cancel'">鍒犻櫎</el-button>
+ <el-button
+ slot="reference"
+ type="danger"
+ size="small"
+ v-show="scope.row.status !== 'cancel'"
+ >鍒犻櫎</el-button
+ >
</el-popconfirm>
- <el-button v-if="scope.row.status === 'finished'" type="success" size="small" @click="markPaper(scope.row)" v-show="scope.row.status !== 'cancel'">
+ <el-button
+ v-if="scope.row.status === 'finished'"
+ type="success"
+ size="small"
+ @click="markPaper(scope.row)"
+ v-show="scope.row.status !== 'cancel'"
+ >
闃呭嵎
</el-button>
- <el-button v-if="scope.row.status === 'ing'" type="warning" size="small" @click="monitor(scope.row)" v-show="scope.row.status !== 'cancel'">鐩戞帶</el-button>
+ <el-button
+ v-if="scope.row.status === 'ing'"
+ type="warning"
+ size="small"
+ @click="monitor(scope.row)"
+ v-show="scope.row.status !== 'cancel'"
+ >鐩戞帶</el-button
+ >
<el-popconfirm
class="confirm"
style="margin: 0 5px"
title="纭畾瑕佷綔搴熻鑰冭瘯璁板綍鍚楋紵"
@confirm="cancel(scope.row.id)"
>
- <el-button slot="reference" v-show="scope.row.status !== 'cancel'" type="danger"
- size="small"
- v-if="scope.row.status !== 'ing'">浣滃簾
+ <el-button
+ slot="reference"
+ v-show="scope.row.status !== 'cancel'"
+ type="danger"
+ size="small"
+ v-if="scope.row.status !== 'ing'"
+ >浣滃簾
</el-button>
</el-popconfirm>
<el-popconfirm
@@ -108,45 +151,98 @@
title="纭畾瑕佹仮澶嶈鑰冭瘯璁板綍鍚楋紵"
@confirm="recover(scope.row.id)"
>
- <el-button slot="reference" v-show="scope.row.status === 'cancel'" type="success"
- size="small">鎭㈠姝ｅ父
+ <el-button
+ slot="reference"
+ v-show="scope.row.status === 'cancel'"
+ type="success"
+ size="small"
+ >鎭㈠姝ｅ父
</el-button>
</el-popconfirm>
</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 class="flex" style="justify-content: center; margin-top: 20px">
+ <pagination
+ v-show="total > 0"
+ :total="total"
+ :page.sync="searchForm.currentPage"
+ :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-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">
- <el-form-item label="鑰冭瘯鍚嶇О" :label-width="formLabelWidth" prop="examName">
+ <el-form-item
+ label="鑰冭瘯鍚嶇О"
+ :label-width="formLabelWidth"
+ prop="examName"
+ >
<el-input v-model="examForm.examName" autocomplete="off"></el-input>
</el-form-item>
- <el-form-item label="鍙傝�冪彮绾�" :label-width="formLabelWidth" prop="classesId">
+ <el-form-item
+ label="鍙傝�冪彮绾�"
+ :label-width="formLabelWidth"
+ prop="classesId"
+ >
<el-select v-model="examForm.classesId">
- <el-option v-for="classes in classesList" :key="classes.id" :value="classes.id" :label="classes.className"/>
+ <el-option
+ v-for="classes in classesList"
+ :key="classes.id"
+ :value="classes.id"
+ :label="classes.className"
+ />
</el-select>
</el-form-item>
- <el-form-item label="璇曞嵎绫诲瀷" :label-width="formLabelWidth" prop="examPaperType">
- <el-select v-model="examForm.examPaperType" @change="getMyExamPaperList">
+ <el-form-item
+ label="璇曞嵎绫诲瀷"
+ :label-width="formLabelWidth"
+ prop="examPaperType"
+ >
+ <el-select
+ v-model="examForm.examPaperType"
+ @change="getMyExamPaperList"
+ >
<el-option label="鍥哄畾璇曞嵎" :value="1"></el-option>
<el-option label="闅忔満璇曞嵎" :value="2"></el-option>
<el-option label="闅忓簭璇曞嵎" :value="3"></el-option>
</el-select>
</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-form-item
+ label="鑰冭瘯璇曞嵎"
+ :label-width="formLabelWidth"
+ prop="examPaperId"
+ >
+ <el-select
+ @change="handleExamPaperSelect"
+ 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-select>
</el-form-item>
- <el-form-item label="寮�濮嬫椂闂�" :label-width="formLabelWidth" prop="time">
+ <el-form-item v-show="examForm.examPaperId" label="鑰冭瘯鏃堕暱">
+ <div>{{ selectExamPaper.suggestTime }}鍒嗛挓</div>
+ </el-form-item>
+ <el-form-item
+ label="寮�濮嬫椂闂�"
+ :label-width="formLabelWidth"
+ prop="time"
+ >
<el-date-picker
v-model="examForm.time"
type="datetimerange"
@@ -158,7 +254,11 @@
>
</el-date-picker>
</el-form-item>
- <el-form-item label="鑰冭瘯鍦扮偣" :label-width="formLabelWidth" prop="examPlace">
+ <el-form-item
+ label="鑰冭瘯鍦扮偣"
+ :label-width="formLabelWidth"
+ prop="examPlace"
+ >
<el-input v-model="examForm.examPlace" autocomplete="off"></el-input>
</el-form-item>
</el-form>
@@ -172,7 +272,14 @@
<script>
import Pagination from '@/components/Pagination'
-import { getExams, addExam, editExam, deleteExamById, cancel, recover } from '@/api/exam'
+import {
+ getExams,
+ addExam,
+ editExam,
+ deleteExamById,
+ cancel,
+ recover
+} from '@/api/exam'
import { myClasses } from '@/api/classes'
import examPaperAPI from '@/api/examPaper'
@@ -195,6 +302,7 @@
endTime: null,
time: []
},
+ selectExamPaper: {},
examRules: {
examName: [
{ required: true, message: '璇疯緭鍏ヨ�冭瘯鍚嶇О', trigger: 'blur' }
@@ -221,7 +329,7 @@
searchForm: {
examName: '',
subject: null,
- pageIndex: 1,
+ currentPage: 1,
pageSize: 10
},
tableData: []
@@ -235,14 +343,14 @@
methods: {
// 浣滃簾鑰冭瘯
cancel (id) {
- cancel(id).then(res => {
+ cancel(id).then((res) => {
this.$message.success(res.data.message)
this.page()
})
},
// 鎭㈠鑰冭瘯
recover (id) {
- recover(id).then(res => {
+ recover(id).then((res) => {
this.$message.success(res.data.message)
this.page()
})
@@ -253,7 +361,10 @@
},
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
@@ -271,9 +382,9 @@
},
MyExamPaperList () {
let param = {
- 'paperType': this.examForm.examPaperType
+ paperType: this.examForm.examPaperType
}
- examPaperAPI.myExamPaperList(param).then(res => {
+ examPaperAPI.myExamPaperList(param).then((res) => {
this.examForm.examPaperId = null
this.examPaperList = res.data
})
@@ -285,7 +396,7 @@
this.MyExamPaperList()
},
getMyClasses () {
- myClasses().then(res => {
+ myClasses().then((res) => {
this.classesList = res.data.data
})
},
@@ -295,7 +406,7 @@
cancelButtonText: '鍙栨秷',
type: 'warning'
}).then(() => {
- deleteExamById(row.id).then(res => {
+ deleteExamById(row.id).then((res) => {
this.$message.success('鍒犻櫎鎴愬姛')
this.page()
})
@@ -315,14 +426,14 @@
this.examForm.startTime = this.examForm.time[0]
this.examForm.endTime = this.examForm.time[1]
if (this.examForm.id) {
- editExam(this.examForm).then(res => {
+ editExam(this.examForm).then((res) => {
this.open = false
this.clearForm()
this.$message.success('鎿嶄綔鎴愬姛')
this.page()
})
} else {
- addExam(this.examForm).then(res => {
+ addExam(this.examForm).then((res) => {
this.open = false
this.clearForm()
this.$message.success('鎿嶄綔鎴愬姛')
@@ -354,10 +465,9 @@
this.title = this.examForm.id ? '淇敼鑰冭瘯' : '瀹夋帓鑰冭瘯'
this.open = true
},
- formatterType (row) {
- },
+ formatterType (row) {},
page () {
- getExams(this.searchForm).then(res => {
+ getExams(this.searchForm).then((res) => {
this.tableData = res.data.data
this.total = res.data.total
})
@@ -365,6 +475,9 @@
routerTo (url) {
this.$router.push(url)
},
+ handleExamPaperSelect (e) {
+ this.selectExamPaper = this.examPaperList.find((o) => o.id === e)
+ }
}
}
</script>
--
Gitblit v1.8.0