| | |
| | | <div class="c"> |
| | | <div class="bg"> |
| | | <div class="main"> |
| | | <TitleIndex title='班级管理' /> |
| | | <div class="main-1"> |
| | | <div |
| | | class="main-btn flex" |
| | | style="justify-content:space-between" |
| | | > |
| | | <div> |
| | | <s-button |
| | | colorType="deepBlue" |
| | | <el-button |
| | | type="primary" |
| | | style="margin-right:20px;" |
| | | @click="$router.push('/manage/class-management/Class-staff')" |
| | | >新增班级</s-button> |
| | | @click="handlerAdd" |
| | | >新增班级</el-button> |
| | | </div> |
| | | <div |
| | | class="flex" |
| | | style="align-items:center" |
| | | > |
| | | <p style="padding-right:10px">排序方式</p> |
| | | <el-select> |
| | | <el-option></el-option> |
| | | </el-select> |
| | | <p style="margin-left:20px;margin-right: 10px;">所在单位</p> |
| | | <el-select> |
| | | <el-option></el-option> |
| | | </el-select> |
| | | <!-- <el-select v-model="searchData.deptId">--> |
| | | <!-- <el-option></el-option>--> |
| | | <!-- </el-select>--> |
| | | </div> |
| | | </div> |
| | | <div> |
| | |
| | | <el-button>通知</el-button> |
| | | <el-button @click="routersTo()">成员管理</el-button> |
| | | <el-button>添加成员</el-button> |
| | | <el-select |
| | | v-model="value" |
| | | style="width:74px;margin-left: 10px;" |
| | | placeholder="选择" |
| | | > |
| | | <el-option |
| | | v-for="item in options" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | > |
| | | </el-option> |
| | | </el-select> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | |
| | | class="flex" |
| | | style="justify-content:center;margin-top:20px;" |
| | | > |
| | | <el-pagination |
| | | background |
| | | layout="prev, pager, next" |
| | | :total="1000" |
| | | > |
| | | </el-pagination> |
| | | <pagination v-show="total>0" :total="total" :page.sync="searchForm.pageIndex" :limit.sync="searchForm.pageSize" |
| | | @pagination="page"/> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | </div> |
| | | |
| | | |
| | | <el-dialog |
| | | :title="title" |
| | | :visible.sync="open" |
| | | width="700px" |
| | | :before-close="handleClose"> |
| | | <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-col :span="11"> |
| | | <el-form-item prop="startTime"> |
| | | <el-date-picker |
| | | v-model="form.startTime" |
| | | type="date" |
| | | value-format="yyyy-MM-dd" |
| | | placeholder="开始日期"> |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col class="line" :span="2">-</el-col> |
| | | <el-col :span="11"> |
| | | <el-form-item prop="endTime"> |
| | | <el-date-picker |
| | | v-model="form.endTime" |
| | | type="date" |
| | | value-format="yyyy-MM-dd" |
| | | placeholder="结束日期"> |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="备注信息" prop="remark"> |
| | | <el-input type="textarea" v-model="form.remark" size="small"></el-input> |
| | | </el-form-item> |
| | | </el-form> |
| | | <span slot="footer" class="dialog-footer"> |
| | | <el-button @click="handleClose">取 消</el-button> |
| | | <el-button type="primary" @click="submitForm">确 定</el-button> |
| | | </span> |
| | | </el-dialog> |
| | | |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import { addClasses, editClasses, getClassess } from "@/api/classes"; |
| | | import Pagination from "@/components/Pagination" |
| | | export default { |
| | | components: {Pagination}, |
| | | data() { |
| | | return { |
| | | total: 0, |
| | | open: false, |
| | | title: "", |
| | | value: "", |
| | | searchData: { |
| | | searchForm: { |
| | | subject: null, |
| | | pageSize: 10, |
| | | pageNum: 1 |
| | | }, |
| | | form: { |
| | | id: null, |
| | | className: "", |
| | | status: "", |
| | | verifyStatus: "", |
| | | startTime: null, |
| | | endTime: null, |
| | | remark: "" |
| | | }, |
| | | rules: { |
| | | className: [ |
| | | { required: true, message: '请输入班级名称', trigger: 'blur' }, |
| | | { min: 1, max: 30, message: '长度在 1 到 30 个字符', trigger: 'blur' } |
| | | ], |
| | | startTime: [ |
| | | { required: true, message: '请选择班级开始时间', trigger: 'change' }, |
| | | ], |
| | | endTime: [ |
| | | { required: true, message: '请选择班级结束时间', trigger: 'change' }, |
| | | ], |
| | | }, |
| | | tableData: [ |
| | | { |
| | | class: "软件工程", |
| | | grade: "2019级", |
| | | unit: "螺丝部", |
| | | teacher: "秋梨膏", |
| | | phone: "182-9384-9302", |
| | | email: "info@exaple.com", |
| | | openingTime: "2022/3/29", |
| | | }, |
| | | { |
| | | class: "软件工程", |
| | | grade: "2019级", |
| | | unit: "螺丝部", |
| | | teacher: "秋梨膏", |
| | | phone: "182-9384-9302", |
| | | email: "info@exaple.com", |
| | | openingTime: "2022/3/29", |
| | | }, |
| | | { |
| | | class: "软件工程", |
| | | grade: "2019级", |
| | | unit: "螺丝部", |
| | | teacher: "秋梨膏", |
| | | phone: "182-9384-9302", |
| | | email: "info@exaple.com", |
| | | openingTime: "2022/3/29", |
| | | }, |
| | | { |
| | | class: "软件工程", |
| | | grade: "2019级", |
| | | unit: "螺丝部", |
| | | teacher: "秋梨膏", |
| | | phone: "182-9384-9302", |
| | | email: "info@exaple.com", |
| | | openingTime: "2022/3/29", |
| | | }, |
| | | { |
| | | class: "软件工程", |
| | | grade: "2019级", |
| | | unit: "螺丝部", |
| | | teacher: "秋梨膏", |
| | | phone: "182-9384-9302", |
| | | email: "info@exaple.com", |
| | | openingTime: "2022/3/29", |
| | | }, |
| | | { |
| | | class: "软件工程", |
| | | grade: "2019级", |
| | | unit: "螺丝部", |
| | | teacher: "秋梨膏", |
| | | phone: "182-9384-9302", |
| | | email: "info@exaple.com", |
| | | openingTime: "2022/3/29", |
| | | }, |
| | | { |
| | | class: "软件工程", |
| | | grade: "2019级", |
| | | unit: "螺丝部", |
| | | teacher: "秋梨膏", |
| | | phone: "182-9384-9302", |
| | | email: "info@exaple.com", |
| | | openingTime: "2022/3/29", |
| | | }, |
| | | { |
| | | class: "软件工程", |
| | | grade: "2019级", |
| | | unit: "螺丝部", |
| | | teacher: "秋梨膏", |
| | | phone: "182-9384-9302", |
| | | email: "info@exaple.com", |
| | | openingTime: "2022/3/29", |
| | | }, |
| | | { |
| | | class: "软件工程", |
| | | grade: "2019级", |
| | | unit: "螺丝部", |
| | | teacher: "秋梨膏", |
| | | phone: "182-9384-9302", |
| | | email: "info@exaple.com", |
| | | openingTime: "2022/3/29", |
| | | }, |
| | | |
| | | ], |
| | | pageData: { |
| | | size: 7, |
| | | page: 1, |
| | | }, |
| | | }; |
| | | }, |
| | | methods: { |
| | | // // 查看详情 |
| | | // detailsTo() { |
| | | // this.$router.push({ |
| | | // name: "teacherDetail", |
| | | // }); |
| | | // }, |
| | | page() { |
| | | getClassess(this.searchForm).then(res => { |
| | | this.tableData = res.data.data |
| | | }) |
| | | }, |
| | | resetForm() { |
| | | this.form = { |
| | | id: null, |
| | | className: "", |
| | | status: "", |
| | | verifyStatus: "", |
| | | startTime: null, |
| | | endTime: null, |
| | | remark: "" |
| | | } |
| | | }, |
| | | submitForm() { |
| | | this.$refs['form'].validate((valid) => { |
| | | if (valid) { |
| | | if (this.form.id) { |
| | | editClasses(this.form).then(res => { |
| | | this.$message.success("修改成功") |
| | | }) |
| | | } else { |
| | | addClasses(this.form).then(res => { |
| | | this.$message.success("添加班级成功") |
| | | }) |
| | | } |
| | | this.resetForm() |
| | | } else { |
| | | return false; |
| | | } |
| | | }); |
| | | }, |
| | | handleClose() { |
| | | this.open = false |
| | | this.resetForm() |
| | | }, |
| | | handlerAdd() { |
| | | this.open = true |
| | | this.title = "新增班级" |
| | | }, |
| | | // 跳转(查看班级人员情况) |
| | | routersTo() { |
| | | this.$router.push({ |
| | |
| | | background-color: rgb(45, 92, 248); |
| | | } |
| | | } |
| | | </style> |
| | | </style> |