班级、班级学员管理

xiangpei

2024-06-13 edb23abd0a3b49143b25a2e6f4043de2fb109513

 src/views/class-management/ClassStaff.vue

@@ -1,14 +1,23 @@
<!-- 班级人员管理 -->
<template>
  <div class="c">
    <div class="bg">
      <div class="main">
        <div class="content">
          <!-- 班级名称 -->
          <div style="padding-bottom:20px; border-bottom: 3px solid #409EFF;margin-bottom: 20px;">
            <span>{{title}}</span>
            <el-button @click="handlerAddStudent" type="primary" size="small">新增学员</el-button>
            <el-button @click="open = true" type="primary" size="small">学员调整</el-button>
  <div class="app-container">
    <div style="display: flex; flex-direction: row">
      <div style="padding-bottom:20px">
        <span class="item">{{ title }}</span>
        <el-button class="item" @click="handlerAddStudent" type="primary" size="small">新增学员</el-button>
        <el-button class="item" @click="open = true" type="primary" size="small">学员调整</el-button>
      </div>
      <div>
        <el-form :inline="true" :model="searchForm" class="demo-form-inline">
          <el-form-item label="学员姓名">
            <el-input v-model="searchForm.studentName" size="small" clearable @clear="page"
                      placeholder="学员姓名"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="page">查询</el-button>
          </el-form-item>
        </el-form>
      </div>
          </div>
          <!-- 表格 -->
          <el-table
@@ -60,18 +69,10 @@
            class="block"
            style="display: flex; margin-top: 40px;"
          >
            <pagination v-show="total>0" :total="total" :page.sync="searchForm.pageNum" :limit.sync="searchForm.pageSize"
      <pagination v-show="total>0" :total="total" :page.sync="searchForm.pageNum"
                  :limit.sync="searchForm.pageSize"
                        @pagination="page"/>
          </div>
        </div>
      </div>

    </div>
    <PopUp
      ref="popUp"
      @children="parentGoods"
    />

    <el-dialog
      :title="studentTitle"
      :visible.sync="addOpen"
@@ -131,23 +132,21 @@
</template>
<script>
// 引入彈出窗口組件
import PopUp from "../../../components/PopUp/Question.vue";
import UserApi from "@/api/user";
import { updateClassesUser, getClassesUsers, deleteClassesUserById, addClassesUser, edit } from "@/api/classesUser";
import UserApi from '@/api/user'
import { updateClassesUser, getClassesUsers, deleteClassesUserById, addClassesUser, edit } from '@/api/classesUser'
import Pagination from '@/components/Pagination'

export default {
  // 注册
  components: {
    PopUp,
  },
  components: { Pagination },
  data() {
    return {
      studentForm: {
        realName: "",
        sex: "",
        phone: "",
        realName: '',
        sex: '',
        phone: '',
        age: null,
        account: "",
        password: ""
        account: '',
        password: ''
      },
      studentRules: {
        realName: [
@@ -163,12 +162,12 @@
          { required: true, message: '请填写学员登录账号', trigger: 'blur' },
        ]
      },
      studentTitle: "新增学员",
      studentTitle: '新增学员',
      addOpen: false,
      total: 0,
      studentList: [],
      searchForm: {
        examName: "",
        studentName: '',
        pageSize: 10,
        pageNum: 1,
        classesId: null
@@ -179,18 +178,17 @@
      },
      open: false,
      // 班级名称
      title: "19级软件四班",
      title: '19级软件四班',
      formLabelAlign: {
        type: "",
        user: "",
        region: "",
        type: '',
        user: '',
        region: '',
      },
      tableData: [
      ],
    };
      tableData: [],
    }
  },
  mounted() {
    this.classes.id = this.$route.query.classesId;
    this.classes.id = this.$route.query.classesId
    this.page()
    this.getClassesCurrentUserList(this.classes.id)
    this.getStudentList()
@@ -198,11 +196,11 @@
  methods: {
    handlerEditStudent(row) {
      this.studentForm = row
      this.studentTitle = "编辑学员"
      this.studentTitle = '编辑学员'
      this.addOpen = true
    },
    handlerAddStudent() {
      this.studentTitle = "添加学员"
      this.studentTitle = '添加学员'
      this.addOpen = true
    },
    submitStudentForm() {
@@ -226,9 +224,9 @@
    },
    resetStudentForm() {
      this.studentForm = {
        realName: "",
        sex: "",
        phone: "",
        realName: '',
        sex: '',
        phone: '',
        age: null
      }
    },
@@ -244,10 +242,10 @@
    },
    sexFormatter(row) {
      if (row.sex === 1) {
        return "男"
        return '男'
      }
      if (row.sex === 2) {
        return "女"
        return '女'
      }
    },
    getClassesCurrentUserList(classesId) {
@@ -260,7 +258,7 @@
    },
    getStudentList() {
      UserApi.studentList().then(res => {
        this.studentList = res.data;
        this.studentList = res.data
      })
    },
    // 获取当前班级学员分页
@@ -273,7 +271,8 @@
    submitForm() {
      updateClassesUser(this.classes).then(res => {
        this.$message.success(res.data.message)
        this.page();
        this.page()
        this.open = false
      })
    },
    handleClose() {
@@ -283,15 +282,15 @@
      if (! item.realName) {
        return null
      }
      return item.realName.indexOf(query) > -1;
      return item.realName.indexOf(query) > -1
    },
    // 返回上一个页面
    goBack() {
      this.$router.back();
      this.$router.back()
    },
    // 修改表单头部的颜色
    getRowClass() {
      return "background:#d2d3d6";
      return 'background:#d2d3d6'
    },

    // 生成试卷
@@ -299,34 +298,31 @@
      // 跳转到生成页面
      //跳转到对应的管理页面
      this.$router.push({
        path: "/manage/test-paper-generation",
      });
    },

    // 点击后调用弹窗组件的方法,开启弹窗
    getDialogFormVisible() {
      this.$refs.popUp.showDialog();
        path: '/manage/test-paper-generation',
      })
    },
    // 弹窗
    // 接收弹窗组件返回的表单值
    parentGoods(obj) {
      console.log(obj, "弹窗组件的表单值");
      console.log(obj, '弹窗组件的表单值')
    },
  },
};
}
</script>
<style scoped lang="scss">
.flex {
  display: flex;
}

// 内容
.content {
  width: 1262px;
  margin-bottom: 80px;
  background-color: #fff;
  padding: 20px 40px;
  border-radius: 10px;
}
.item {
  margin-right: 5px;
}
</style>