From 94da5161fcc39a88e0337e67573a3dd96691b39c Mon Sep 17 00:00:00 2001
From: fuliqi <fuliqi@qq.com>
Date: 星期四, 06 六月 2024 17:11:12 +0800
Subject: [PATCH] 试卷管理和试卷模板ui
---
src/views/Manage/TestPaper/index.vue | 332 +++++++++++++++++++++++++++++++++++--------------------
1 files changed, 212 insertions(+), 120 deletions(-)
diff --git a/src/views/Manage/TestPaper/index.vue b/src/views/Manage/TestPaper/index.vue
index f6cf92e..2678e79 100644
--- a/src/views/Manage/TestPaper/index.vue
+++ b/src/views/Manage/TestPaper/index.vue
@@ -7,64 +7,48 @@
<TitleIndex title='璇曞嵎绠＄悊' />
<div class="content">
<!-- 璇曞嵎鐢熸垚鎸夐挳 -->
- <div style="padding-bottom:20px; border-bottom: 3px solid #409EFF;margin-bottom: 20px;">
+ <div style="padding-bottom:20px; border-bottom: 3px solid #409EFF;margin-bottom: 20px;display: flex; align-items: center;">
+ <el-page-header @back="goBack()"/>
<el-button
type="primary"
@click="getCreate"
>璇曞嵎鐢熸垚</el-button>
+ <el-button
+ type="primary"
+ @click="toTemplate"
+ >闅忔満璇曞嵎妯℃澘</el-button>
</div>
-
<!-- 鎼滅储 -->
<div>
<el-form
:inline="true"
- :model="formLabelAlign"
- class="demo-form-inline"
+ :model="queryParam"
label-width="80px"
>
<el-form-item>
- <el-input v-model="formLabelAlign.type"></el-input>
+ <el-input v-model="queryParam.id" placeholder="璇曞嵎缂栧彿" style="width: 120px" clearable></el-input>
+ </el-form-item>
+ <el-form-item>
+ <el-input v-model="queryParam.name" placeholder="璇曞嵎鍚�" clearable></el-input>
</el-form-item>
<el-form-item>
<el-select
- v-model="formLabelAlign.region"
+ v-model="queryParam.subjectId"
placeholder="鍏ㄩ儴绉戠洰"
+ clearable
>
- <el-option
- label="鍏ㄩ儴绉戠洰"
- value="shanghai"
- ></el-option>
- <el-option
- label="璇枃"
- value="beijing"
- ></el-option>
- <el-option
- label="鏁板"
- value="beijing"
- ></el-option>
- <el-option
- label="鑻辫"
- value="beijing"
- ></el-option>
+ <el-option v-for="item in subjects" :key="item.id" :label="item.name" :value="item.id"/>
</el-select>
</el-form-item>
<el-form-item>
<el-select
- v-model="formLabelAlign.region"
- placeholder="閫夋嫨棰�"
+ v-model="queryParam.paperType"
+ placeholder="璇曞嵎绫诲瀷"
+ clearable
>
- <el-option
- label="閫夋嫨棰�"
- value="shanghai"
- ></el-option>
- <el-option
- label="闂瓟棰�"
- value="beijing"
- ></el-option>
- <el-option
- label="鍒ゆ柇棰�"
- value="beijing"
- ></el-option>
+ <el-option label="鍥哄畾璇曞嵎" value="1" />
+ <el-option label="闅忔満璇曞嵎" value="2" />
+ <el-option label="闅忓簭璇曞嵎" value="3" />
</el-select>
</el-form-item>
@@ -73,6 +57,7 @@
style="width:100px;"
type="primary"
size="small"
+ @click="getPage"
>鏌ヨ</el-button>
</el-form-item>
</el-form>
@@ -88,20 +73,40 @@
>
<el-table-column
align="center"
- prop="title"
+ prop="id"
+ label="璇曞嵎缂栧彿"
+ >
+ </el-table-column>
+ <el-table-column
+ align="center"
+ prop="name"
label="璇曞嵎鍚�"
>
</el-table-column>
<el-table-column
align="center"
- prop="type"
- label="棰樼洰绫诲瀷"
+ prop="subjectId"
+ label="绉戠洰"
>
+ <template slot-scope="scope">
+ {{ translate(scope.row.subjectId) }}
+ </template>
</el-table-column>
<el-table-column
align="center"
- prop="subject"
- label="绉戠洰"
+ prop="paperType"
+ label="璇曞嵎绫诲瀷"
+ >
+ <template slot-scope="scope">
+ <div v-if="scope.row.paperType === 1">鍥哄畾璇曞嵎</div>
+ <div v-else-if="scope.row.paperType === 2">闅忔満璇曞嵎</div>
+ <div v-else-if="scope.row.paperType === 3">闅忓簭璇曞嵎</div>
+ </template>
+ </el-table-column>
+ <el-table-column
+ align="center"
+ prop="suggestTime"
+ label="寤鸿鏃堕暱(鍒嗛挓)"
>
</el-table-column>
<el-table-column
@@ -114,120 +119,207 @@
label="鎿嶄綔"
align="center"
>
+ <template slot-scope="scope">
<el-button type="text">棰勮</el-button>
<el-button type="text">缂栬緫</el-button>
- <el-button type="text">鍒犻櫎</el-button>
+ <el-button type="text" @click="deletePaper(scope.row)" class="link-left">鍒犻櫎</el-button>
+ </template>
</el-table-column>
</el-table>
+
<div
- class="block"
- style="display: flex; margin-top: 40px;"
+ class="flex"
+ style="justify-content:center;margin-top:20px;"
>
- <el-pagination
- style="margin:auto"
- background
- :page-size="10"
- layout="prev, pager, next, jumper"
- :total="100"
- >
- </el-pagination>
+ <pagination v-show="total>0" :total="total" :page.sync="queryParam.pageIndex" :limit.sync="queryParam.pageSize"
+ @pagination="getPage"/>
</div>
</div>
- </div>
+ <!-- 娣诲姞璇曞嵎瀵硅瘽妗� -->
+ <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body >
+ <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+ <el-form-item label="璇曞嵎鍚嶇О" prop="name" >
+ <el-input v-model="form.name" placeholder="璇疯緭鍏ヨ瘯鍗峰悕绉�" style="width: 300px"/>
+ </el-form-item>
+ <el-form-item label="绉戠洰" prop="subjectId">
+ <el-select v-model="form.subjectId" placeholder="璇烽�夋嫨绉戠洰" style="width: 200px">
+ <el-option
+ v-for="item in subjects"
+ :key="item.id"
+ :label="item.name"
+ :value="item.id"
+ />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="璇曞嵎绫诲瀷" prop="paperType">
+ <el-select v-model="form.paperType" placeholder="璇烽�夋嫨璇曞嵎绫诲瀷" style="width: 200px">
+ <el-option label="鍥哄畾璇曞嵎" value="1" />
+ <el-option label="闅忓簭璇曞嵎" value="3" />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鑰冭瘯鏃堕暱(鍒嗛挓)" prop="suggestTime">
+ <el-input-number v-model="form.suggestTime" placeholder="璇疯緭鍏ヨ�冭瘯鏃堕暱"/>
+ </el-form-item>
+ <el-button type="primary" @click="toCreate">缂栬緫棰樼洰</el-button>
+ </el-form>
+ <div slot="footer" class="dialog-footer">
+ <el-button type="primary" @click="submitForm">纭� 瀹�</el-button>
+ <el-button @click="cancel">鍙� 娑�</el-button>
+ </div>
+ </el-dialog>
+
+
+ </div>
+ </div>
</div>
- </div>
</template>
<script>
+import examPaperApi from '@/api/examPaper'
+import subjectApi from '@/api/subject'
+import Pagination from "@/components/Pagination"
export default {
+ components: {Pagination},
data() {
return {
- formLabelAlign: {
- type: "",
- user: "",
- region: "",
+ // 寮瑰嚭灞傛爣棰�
+ title: "",
+ // 鏄惁鏄剧ず寮瑰嚭灞�
+ open: false,
+ // 鎬绘潯鏁�
+ total: 0,
+ queryParam: {
+ id: null,
+ paperType: null,
+ subjectId: null,
+ pageIndex: 1,
+ pageSize: 10
},
- tableData: [
- {
- title: "褰揂涓嶣涓�璧蜂慨璺�",
- type: "閫夋嫨棰�",
- subject: "璇枃",
- score: 100,
- },
- {
- title: "褰揂涓嶣涓�璧蜂慨璺�",
- type: "閫夋嫨棰�",
- subject: "璇枃",
- score: 100,
- },
- {
- title: "褰揂涓嶣涓�璧蜂慨璺�",
- type: "閫夋嫨棰�",
- subject: "璇枃",
- score: 100,
- },
- {
- title: "褰揂涓嶣涓�璧蜂慨璺�",
- type: "閫夋嫨棰�",
- subject: "璇枃",
- score: 100,
- },
- {
- title: "褰揂涓嶣涓�璧蜂慨璺�",
- type: "閫夋嫨棰�",
- subject: "璇枃",
- score: 100,
- },
- {
- title: "褰揂涓嶣涓�璧蜂慨璺�",
- type: "閫夋嫨棰�",
- subject: "璇枃",
- score: 100,
- },
- {
- title: "褰揂涓嶣涓�璧蜂慨璺�",
- type: "閫夋嫨棰�",
- subject: "璇枃",
- score: 100,
- },
- {
- title: "褰揂涓嶣涓�璧蜂慨璺�",
- type: "閫夋嫨棰�",
- subject: "璇枃",
- score: 100,
- },
- {
- title: "褰揂涓嶣涓�璧蜂慨璺�",
- type: "閫夋嫨棰�",
- subject: "璇枃",
- score: 100,
- },
- ],
+ form: {},
+ tableData: [],
+ subjects: [],
+ // 琛ㄥ崟鏍￠獙
+ rules: {
+ name: [
+ { required: true, message: "璇曞嵎鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }
+ ],
+ subjectId: [
+ { required: true, message: "绉戠洰涓嶈兘涓虹┖", trigger: "blur" }
+ ],
+ paperType: [
+ { required: true, message: "璇曞嵎绫诲瀷涓嶈兘涓虹┖", trigger: "blur" }
+ ],
+ suggestTime: [
+ { required: true, message: "鑰冭瘯鏃堕暱涓嶈兘涓虹┖", trigger: "blur" }
+ ],
+ }
};
+
+ },
+ created () {
+ this.getSubjects();
+ this.getPage()
},
methods: {
+ translate(subjectId) {
+ const subject = this.subjects.find(subject => subject.id == subjectId);
+ return subject ? subject.name : '鏈煡';
+ },
// 杩斿洖涓婁竴涓〉闈�
goBack() {
this.$router.back();
},
- //鎻愪氦鎸夐挳
- onSubmit() {
- console.log("submit!");
+ cancel(){
+ this.open = false;
+ },
+ // 琛ㄥ崟閲嶇疆
+ reset() {
+ this.form = {
+ name: null,
+ subjectId: null,
+ paperType: null,
+ };
},
// 淇敼琛ㄥ崟澶撮儴鐨勯鑹�
getRowClass() {
return "background:#d2d3d6";
},
-
- // 鐢熸垚璇曞嵎
+ /** 鐢熸垚璇曞嵎瀵硅瘽妗� */
getCreate() {
- // 璺宠浆鍒扮敓鎴愰〉闈�
+ this.reset();
+ this.open = true;
+ this.title = "璇曞嵎閰嶇疆";
+ },
+ // 閰嶇疆璇曞嵎棰樼洰
+ toCreate() {
//璺宠浆鍒板搴旂殑绠＄悊椤甸潰
this.$router.push({
path: "/manage/test-paper-generation",
});
},
+ toTemplate() {
+ //璺宠浆鍒版ā鏉跨鐞嗛〉闈�
+ this.$router.push({
+ path: "/manage/paper-template",
+ });
+ },
+ deletePaper (row) {
+ examPaperApi.deletePaper(row.id).then(re => {
+ if (re.code === 1) {
+ this.getPage()
+ this.$message.success("鍒犻櫎鎴愬姛")
+ } else {
+ this.$message.error(re.message)
+ }
+ })
+ },
+ getPage () {
+ this.listLoading = true
+ examPaperApi.pageList(this.queryParam).then(re => {
+ const data = re.data
+ this.tableData = data.list
+ this.total = data.total
+ this.queryParam.pageIndex = data.pageNum
+ this.listLoading = false
+ })
+ },
+ // 鑾峰彇绉戠洰
+ getSubjects() {
+ subjectApi.list().then(re => {
+ this.subjects = re.data
+ })
+ },
+ /** 鎻愪氦鎸夐挳 */
+ submitForm() {
+ this.$refs['form'].validate(valid => {
+ if (valid) {
+ if (this.form.deptId && this.form.deptId.length > 0) {
+ this.form.deptId = this.form.deptId[this.form.deptId.length - 1]
+ }
+ let temp = {
+ ...this.form,
+ category: parseInt(this.form.category)
+ };
+ if (temp.id != null) {
+ updatePoint(temp).then(response => {
+ this.$modal.msgSuccess("淇敼鎴愬姛");
+ this.open = false;
+ this.getList();
+ });
+ } else {
+ addPoint(temp).then(response => {
+ this.$modal.msgSuccess("鏂板鎴愬姛");
+ this.open = false;
+ this.reset()
+ this.getList();
+ });
+ }
+ } else {
+ console.log("error")
+ }
+ })
+ },
},
};
</script>
--
Gitblit v1.8.0