From 80889e7f32480ae76896f3bd042baa82a0fc9e9e Mon Sep 17 00:00:00 2001
From: luohairen <3399054449@qq.com>
Date: 星期四, 14 十一月 2024 11:39:07 +0800
Subject: [PATCH] 班级成绩图表分析
---
src/views/class-management/Class.vue | 407 +++++++++++++++++++++++++++++++++-------------------------
1 files changed, 231 insertions(+), 176 deletions(-)
diff --git a/src/views/class-management/Class.vue b/src/views/class-management/Class.vue
index 9cdd5a9..35d3390 100644
--- a/src/views/class-management/Class.vue
+++ b/src/views/class-management/Class.vue
@@ -1,149 +1,169 @@
<!-- 鐝骇绠＄悊 -->
<template>
- <div class="c">
- <div class="bg">
- <div class="main">
- <div class="main-1">
- <div
- class="main-btn flex"
- style="justify-content:space-between"
- >
- <div>
- <el-button
- type="primary"
- size="small"
- style="margin-right:20px;"
- @click="handlerAdd"
- >鏂板鐝骇</el-button>
- </div>
- <el-form :inline="true" :model="searchForm" class="demo-form-inline">
- <el-form-item label="鐝骇鍚嶇О">
- <el-input v-model="searchForm.className" size="small" clearable @clear="page" placeholder="鐝骇鍚嶇О"></el-input>
- </el-form-item>
- <el-form-item label="鐝骇鐘舵��">
- <el-select v-model="searchForm.status" size="small" clearable @change="page" placeholder="鐝骇鐘舵��">
- <el-option label="姝ｅ父" value="normal"></el-option>
- <el-option label="瑙ｆ暎" value="dissolution"></el-option>
- </el-select>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" @click="page">鏌ヨ</el-button>
- </el-form-item>
- </el-form>
- </div>
- <div>
- <div>
- <el-table
- v-loading="loading"
- :data="tableData"
- border
- :row-style="{height:'42px'}"
- :cell-style="{padding: '0'}"
- >
- <el-table-column
- align="center"
- label="鐝骇"
- prop="className"
- width="180px"
- ></el-table-column>
- <el-table-column
- label="鐘舵��"
- align="center"
- width="80px"
- prop="status"
- >
- <template slot-scope="scope">
- <el-tag v-if="scope.row.status === '姝ｅ父'" type="success">{{scope.row.status}}</el-tag>
- <el-tag v-if="scope.row.status === '瑙ｆ暎'" type="danger">{{scope.row.status}}</el-tag>
- </template>
- </el-table-column>
- <el-table-column
- width="100px"
- align="center"
- label="鍗曚綅"
- prop="unit"
- ></el-table-column>
- <el-table-column
- align="center"
- width="100px"
- label="鏁欏笀"
- prop="createUserName"
- ></el-table-column>
- <el-table-column
- align="center"
- width="120px"
- label="鑱旂郴鐢佃瘽"
- prop="teacherPhone"
- ></el-table-column>
- <el-table-column
- width="140px"
- label="寮�鐝椂闂�"
- align="center"
- prop="startTime"
- ></el-table-column>
- <el-table-column
- width="140px"
- label="缁撴潫鏃堕棿"
- align="center"
- prop="endTime"
- ></el-table-column>
- <el-table-column
- label="鎿嶄綔"
- align="center"
- fixed="right"
- >
- <template slot-scope="scope">
- <el-button v-if="scope.row.status !== '瑙ｆ暎'" size="small" @click="handlerEdit(scope.row)" type="primary">淇敼</el-button>
- <el-button v-if="scope.row.status !== '瑙ｆ暎'" size="small" type="warning">鐝骇楠岃瘉</el-button>
- <el-button v-if="scope.row.status !== '瑙ｆ暎'" size="small" @click="handlerOpenNotify(scope.row)" type="info">閫氱煡</el-button>
- <el-button v-if="scope.row.status !== '瑙ｆ暎'" @click="studentManager(scope.row.id)" size="small" type="success">鎴愬憳绠＄悊</el-button>
- <el-button v-if="scope.row.status !== '瑙ｆ暎'" @click="dissolution(scope.row.id)" type="danger" size="small">瑙ｆ暎</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 style="margin-right:10px;">
+ <el-button
+ type="primary"
+ size="small"
+ @click="handlerAdd"
+ >鏂板鐝骇
+ </el-button>
</div>
-
- </div>
-
- <el-dialog
- title="鐝骇閫氱煡"
- :visible.sync="notifyOpen"
- width="600px"
- :before-close="handleClose">
- <el-form :model="notifyForm" :rules="notifyRules" ref="notifyForm" label-width="100px" class="demo-ruleForm">
- <el-form-item label="閫氱煡鐝骇锛�" prop="className">
- <span>{{notifyForm.className}}</span>
+ <div>
+ <el-form :inline="true" :model="searchForm" class="demo-form-inline">
+ <el-form-item label="鐝骇鍚嶇О">
+ <el-input v-model="searchForm.className" size="small" clearable @clear="page" @input="page"
+ placeholder="鐝骇鍚嶇О"></el-input>
</el-form-item>
- <el-form-item label="閫氱煡鍐呭锛�" prop="notifyContent">
- <el-input type="textarea" v-model="notifyForm.notifyContent" size="small"></el-input>
+ <el-form-item label="鐝骇鐘舵��">
+ <el-select v-model="searchForm.status" size="small" clearable @change="page" placeholder="鐝骇鐘舵��">
+ <el-option label="姝ｅ父" value="normal"></el-option>
+ <el-option label="瑙ｆ暎" value="dissolution"></el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" size="small" @click="page">鏌ヨ</el-button>
</el-form-item>
</el-form>
- <span slot="footer" class="dialog-footer">
- <el-button @click="handleNotifyClose">鍙� 娑�</el-button>
- <el-button type="primary" @click="submitNotifyForm">纭� 瀹�</el-button>
- </span>
- </el-dialog>
+ </div>
+ </div>
+ <el-table
+ v-loading="loading"
+ :data="tableData"
+ border
+ :row-style="{height:'42px'}"
+ :cell-style="{padding: '0'}"
+ >
+ <el-table-column
+ align="center"
+ label="鐝骇鍚嶇О"
+ prop="className"
+ width="180px"
+ ></el-table-column>
+ <el-table-column
+ label="鐘舵��"
+ align="center"
+ width="80px"
+ prop="status"
+ >
+ <template slot-scope="scope">
+ <el-tag v-if="scope.row.status === '姝ｅ父'" type="success">{{ scope.row.status }}</el-tag>
+ <el-tag v-if="scope.row.status === '瑙ｆ暎'" type="danger">{{ scope.row.status }}</el-tag>
+ </template>
+ </el-table-column>
+<!-- <el-table-column-->
+<!-- width="100px"-->
+<!-- align="center"-->
+<!-- label="鍗曚綅"-->
+<!-- prop="unit"-->
+<!-- ></el-table-column>-->
+ <el-table-column
+ align="center"
+ width="300px"
+ label="鏁欏笀"
+ prop="teacherNamesStr"
+ ></el-table-column>
+<!-- <el-table-column-->
+<!-- align="center"-->
+<!-- width="120px"-->
+<!-- label="鑱旂郴鐢佃瘽"-->
+<!-- prop="teacherPhone"-->
+<!-- ></el-table-column>-->
+ <el-table-column
+ width="140px"
+ label="寮�鐝椂闂�"
+ align="center"
+ prop="startTime"
+ ></el-table-column>
+ <el-table-column
+ width="140px"
+ label="缁撴潫鏃堕棿"
+ align="center"
+ prop="endTime"
+ ></el-table-column>
+ <el-table-column
+ label="鎿嶄綔"
+ align="center"
+ fixed="right"
+ >
+ <template slot-scope="scope">
+ <el-button v-show="scope.row.status !== '瑙ｆ暎'" size="small" @click="handlerEdit(scope.row)"
+ type="primary">淇敼
+ </el-button>
+<!-- <el-button v-show="scope.row.status !== '瑙ｆ暎'" size="small" type="warning">鐝骇楠岃瘉</el-button>-->
+<!-- <el-button v-show="scope.row.status !== '瑙ｆ暎'" size="small" @click="handlerOpenNotify(scope.row)"-->
+<!-- type="info">閫氱煡-->
+<!-- </el-button>-->
+ <el-button v-show="scope.row.status !== '瑙ｆ暎'" @click="studentManager(scope.row.id,scope.row.className)" size="small"
+ type="success">鎴愬憳绠＄悊
+ </el-button>
+ <el-popconfirm
+ class="confirm"
+ title="纭畾瑕佽В鏁ｈ鐝骇锛�"
+ @confirm="dissolution(scope.row.id)"
+ >
+ <el-button slot="reference" v-show="scope.row.status !== '瑙ｆ暎'" type="danger"
+ size="small">瑙ｆ暎
+ </el-button>
+ </el-popconfirm>
+ <el-popconfirm
+ class="confirm"
+ title="纭畾瑕佹仮澶嶈鐝骇鍚楋紵"
+ @confirm="recover(scope.row.id)"
+ >
+ <el-button slot="reference" v-show="scope.row.status === '瑙ｆ暎'" type="success"
+ size="small">鎭㈠姝ｅ父
+ </el-button>
+ </el-popconfirm>
+ </template>
+ </el-table-column>
+ </el-table>
+
+ <pagination v-show="total>0" :total="total" :page.sync="searchForm.currentPage"
+ :limit.sync="searchForm.pageSize"
+ @pagination="page"/>
+<!-- <el-dialog-->
+<!-- title="鐝骇閫氱煡"-->
+<!-- :visible.sync="notifyOpen"-->
+<!-- width="600px"-->
+<!-- :before-close="handleNotifyClose"-->
+<!-- :close-on-click-modal="false">-->
+<!-- <el-form :model="notifyForm" :rules="notifyRules" ref="notifyForm" label-width="100px" class="demo-ruleForm">-->
+<!-- <el-form-item label="閫氱煡鐝骇锛�" prop="className">-->
+<!-- <span>{{ notifyForm.className }}</span>-->
+<!-- </el-form-item>-->
+<!-- <el-form-item label="閫氱煡鍐呭锛�" prop="notifyContent">-->
+<!-- <el-input type="textarea" v-model="notifyForm.notifyContent" size="small"></el-input>-->
+<!-- </el-form-item>-->
+<!-- </el-form>-->
+<!-- <span slot="footer" class="dialog-footer">-->
+<!-- <el-button @click="handleNotifyClose">鍙� 娑�</el-button>-->
+<!-- <el-button type="primary" @click="submitNotifyForm">纭� 瀹�</el-button>-->
+<!-- </span>-->
+<!-- </el-dialog>-->
<el-dialog
:title="title"
:visible.sync="open"
width="700px"
- :before-close="handleClose">
+ :before-close="handleClose"
+ :close-on-click-modal="false">
<el-form :model="form" :rules="rules" ref="form" label-width="100px" class="demo-ruleForm">
<el-form-item label="鐝骇鍚嶇О" prop="className">
<el-input v-model="form.className" size="small"></el-input>
</el-form-item>
- <el-form-item label="鐝骇鏃堕棿" required>
+ <el-form-item label="鑰佸笀閰嶇疆" prop="teacherList">
+ <el-select v-model="form.teacherList" multiple clearable size="small" placeholder="璇烽�夋嫨">
+ <el-option
+ v-for="item in teacherList"
+ :key="item.id"
+ :label="item.realName"
+ :value="item.id">
+ </el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鐝骇鏃堕棿">
<el-col :span="11">
<el-form-item prop="startTime">
<el-date-picker
@@ -181,13 +201,15 @@
</template>
<script>
-import { addClasses, editClasses, getClassess, dissolution } from "@/api/classes";
-import { addClassesNotify } from "@/api/classesNotify";
-import Pagination from "@/components/Pagination"
+import { addClasses, editClasses, getClassess, dissolution, recover, getTeacherList } from '@/api/classes'
+import { addClassesNotify } from '@/api/classesNotify'
+import Pagination from '@/components/Pagination'
+
export default {
- components: {Pagination},
- data() {
+ components: { Pagination },
+ data () {
return {
+ teacherList: [],
notifyOpen: false,
notifyForm: {
className: '',
@@ -197,23 +219,24 @@
loading: true,
total: 0,
open: false,
- title: "",
- value: "",
+ title: '',
+ value: '',
searchForm: {
- className:'',
+ className: '',
status: '',
subject: null,
pageSize: 10,
- pageNum: 1
+ currentPage: 1
},
form: {
id: null,
- className: "",
- status: "",
- verifyStatus: "",
+ className: '',
+ teacherList: [],
+ status: '',
+ verifyStatus: '',
startTime: null,
endTime: null,
- remark: ""
+ remark: ''
},
notifyRules: {
notifyContent: [
@@ -233,18 +256,21 @@
{ required: true, message: '璇烽�夋嫨鐝骇缁撴潫鏃堕棿', trigger: 'change' },
],
},
- tableData: [
-
- ],
- };
+ tableData: [],
+ }
},
methods: {
- handlerOpenNotify(row) {
+ getTeacherList () {
+ getTeacherList().then(res => {
+ this.teacherList = res.data.data
+ })
+ },
+ handlerOpenNotify (row) {
this.notifyOpen = true
this.notifyForm.className = row.className
this.notifyForm.classesId = row.id
},
- submitNotifyForm() {
+ submitNotifyForm () {
this.$refs['notifyForm'].validate((valid) => {
if (valid) {
let _this = this
@@ -256,97 +282,121 @@
}
})
},
- clearNotifyForm() {
+ clearNotifyForm () {
this.notifyForm = {
className: '',
notifyContent: ''
}
},
- handleNotifyClose() {
+ handleNotifyClose () {
this.notifyOpen = false
this.clearNotifyForm()
},
- page() {
+ page () {
getClassess(this.searchForm).then(res => {
this.tableData = res.data.data
this.total = res.data.total
this.loading = false
})
},
- resetForm() {
+ resetForm () {
this.form = {
id: null,
- className: "",
- status: "",
- verifyStatus: "",
+ className: '',
+ teacherList: [],
+ status: '',
+ verifyStatus: '',
startTime: null,
endTime: null,
- remark: ""
+ remark: ''
}
},
- submitForm() {
+ submitForm () {
this.$refs['form'].validate((valid) => {
if (valid) {
if (this.form.id) {
editClasses(this.form).then(res => {
- this.$message.success("淇敼鎴愬姛")
+ this.$message.success('淇敼鎴愬姛')
this.resetForm()
this.open = false
this.page()
})
} else {
addClasses(this.form).then(res => {
- this.$message.success("娣诲姞鐝骇鎴愬姛")
+ this.$message.success('娣诲姞鐝骇鎴愬姛')
this.resetForm()
this.open = false
this.page()
})
}
} else {
- return false;
+ return false
}
- });
+ })
},
- dissolution(id) {
+ dissolution (id) {
dissolution(id).then(res => {
this.$message.success(res.data.message)
this.page()
})
},
- handlerEdit(row) {
- this.form = row;
+ recover (id) {
+ recover(id).then(res => {
+ this.$message.success(res.data.message)
+ this.page()
+ })
+ },
+ handlerEdit (row) {
+ this.form = row
this.open = true
},
- handleClose() {
+ handleClose () {
this.open = false
this.resetForm()
},
- handlerAdd() {
+ handleNotifyClose () {
+ this.notifyOpen = false
+ this.resetNotifyForm()
+ },
+ resetNotifyForm () {
+ this.notifyForm = {
+ className: '',
+ notifyContent: '',
+ classesId: null
+ }
+ },
+ handlerAdd () {
this.open = true
- this.title = "鏂板鐝骇"
+ this.title = '鏂板鐝骇'
},
// 璺宠浆(鏌ョ湅鐝骇浜哄憳鎯呭喌)
- studentManager(classesId) {
- this.$router.push({ path: "class-management/Class-staff", query: { classesId: classesId } });
+ studentManager (classesId,className) {
+ this.$router.push({ path: '/classes/class-management/Class-staff', query: { classesId: classesId, className: className } })
},
// 杩斿洖涓婁竴涓〉闈�
- goBack() {
- this.$router.back();
+ goBack () {
+ this.$router.back()
},
},
- created() {
+ created () {
this.page()
- },
-};
+ this.getTeacherList()
+ }
+}
</script>
<style scoped lang="scss">
+.confirm {
+ margin-left: 5px;
+}
.flex {
display: flex;
}
+
.mian-1-top {
margin: 10px 0;
align-items: center;
+
& input {
height: 30px;
width: 200px;
@@ -359,10 +409,12 @@
border-left: 5px solid rgb(16, 71, 247);
padding-left: 10px;
margin: 30px 0;
+
& p {
font-weight: 700;
}
}
+
&-1 {
width: 1227px;
// height: 784px;
@@ -371,15 +423,18 @@
border-radius: 10px;
padding: 32px 40px;
}
+
&-btn {
padding-bottom: 10px;
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);
}
--
Gitblit v1.8.0