From edb23abd0a3b49143b25a2e6f4043de2fb109513 Mon Sep 17 00:00:00 2001
From: xiangpei <xiangpei@timesnew.cn>
Date: 星期四, 13 六月 2024 10:35:52 +0800
Subject: [PATCH] 班级、班级学员管理
---
src/views/class-management/Class.vue | 311 +++++++++++++++++++++++++--------------------------
1 files changed, 155 insertions(+), 156 deletions(-)
diff --git a/src/views/class-management/Class.vue b/src/views/class-management/Class.vue
index 9cdd5a9..91a17f6 100644
--- a/src/views/class-management/Class.vue
+++ b/src/views/class-management/Class.vue
@@ -1,120 +1,113 @@
<!-- 鐝骇绠＄悊 -->
<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-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>
+ <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>
+ <pagination v-show="total>0" :total="total" :page.sync="searchForm.pageIndex"
+ :limit.sync="searchForm.pageSize"
+ @pagination="page"/>
<el-dialog
title="鐝骇閫氱煡"
:visible.sync="notifyOpen"
@@ -122,7 +115,7 @@
: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>
+ <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>
@@ -181,12 +174,13 @@
</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 } from '@/api/classes'
+import { addClassesNotify } from '@/api/classesNotify'
+import Pagination from '@/components/Pagination'
+
export default {
- components: {Pagination},
- data() {
+ components: { Pagination },
+ data () {
return {
notifyOpen: false,
notifyForm: {
@@ -197,10 +191,10 @@
loading: true,
total: 0,
open: false,
- title: "",
- value: "",
+ title: '',
+ value: '',
searchForm: {
- className:'',
+ className: '',
status: '',
subject: null,
pageSize: 10,
@@ -208,12 +202,12 @@
},
form: {
id: null,
- className: "",
- status: "",
- verifyStatus: "",
+ className: '',
+ status: '',
+ verifyStatus: '',
startTime: null,
endTime: null,
- remark: ""
+ remark: ''
},
notifyRules: {
notifyContent: [
@@ -233,18 +227,16 @@
{ required: true, message: '璇烽�夋嫨鐝骇缁撴潫鏃堕棿', trigger: 'change' },
],
},
- tableData: [
-
- ],
- };
+ tableData: [],
+ }
},
methods: {
- handlerOpenNotify(row) {
+ 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 +248,99 @@
}
})
},
- 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: '',
+ 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;
+ handlerEdit (row) {
+ this.form = row
this.open = true
},
- handleClose() {
+ handleClose () {
this.open = false
this.resetForm()
},
- handlerAdd() {
+ handlerAdd () {
this.open = true
- this.title = "鏂板鐝骇"
+ this.title = '鏂板鐝骇'
},
// 璺宠浆(鏌ョ湅鐝骇浜哄憳鎯呭喌)
- studentManager(classesId) {
- this.$router.push({ path: "class-management/Class-staff", query: { classesId: classesId } });
+ studentManager (classesId) {
+ this.$router.push({ path: '/classes/class-management/Class-staff', query: { classesId: classesId } })
},
// 杩斿洖涓婁竴涓〉闈�
- goBack() {
- this.$router.back();
+ goBack () {
+ this.$router.back()
},
},
- created() {
+ created () {
this.page()
},
-};
+}
</script>
<style scoped lang="scss">
.flex {
display: flex;
}
+
.mian-1-top {
margin: 10px 0;
align-items: center;
+
& input {
height: 30px;
width: 200px;
@@ -359,10 +353,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 +367,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