|
@@ -0,0 +1,335 @@
|
|
|
+<template>
|
|
|
+ <div class="fixedBox">
|
|
|
+ <el-card>
|
|
|
+ <div class="boxWrap">
|
|
|
+ <p>
|
|
|
+ 班级合并<span style="color: red"> {{ compoundList.length }} </span>
|
|
|
+ </p>
|
|
|
+ <el-popover placement="top" v-model="isLook" trigger="manual">
|
|
|
+ <div>
|
|
|
+ <p class="title">
|
|
|
+ 班级合并列表
|
|
|
+ <i class="el-icon-minus minus" @click="isLook = false"></i>
|
|
|
+ </p>
|
|
|
+
|
|
|
+ <el-divider></el-divider>
|
|
|
+ </div>
|
|
|
+ <el-button type="text" style="float: right" @click="clearCom"
|
|
|
+ >清空列表</el-button
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <el-radio-group v-model="radio" @change="changeMasterClass">
|
|
|
+ <el-table
|
|
|
+ :data="dataList"
|
|
|
+ height="300px"
|
|
|
+ :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
|
|
|
+ >
|
|
|
+ <el-table-column align="center" label="主班" width="110">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-radio :label="scope.row.id"></el-radio>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ width="180px"
|
|
|
+ label="班级名称"
|
|
|
+ prop="name"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column align="center" label="班级类型">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>{{ scope.row.type | coursesType }}</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ width="180px"
|
|
|
+ prop="teacherName"
|
|
|
+ label="已选学生数"
|
|
|
+ >
|
|
|
+ <!-- -->
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ {{
|
|
|
+ scope.row.studentList ? scope.row.studentList.length : 0
|
|
|
+ }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <el-table-column align="center" label="操作" width="200px">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button type="text" @click="cancleCom(scope.row)"
|
|
|
+ >取消</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ type="text"
|
|
|
+ @click="showStudentList(scope.row)"
|
|
|
+ :disabled="scope.row.id == radio"
|
|
|
+ >添加学生</el-button
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-radio-group>
|
|
|
+ </div>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ size="mini"
|
|
|
+ style="float: right; margin-top: 20px"
|
|
|
+ @click="submitClass"
|
|
|
+ >确定</el-button
|
|
|
+ >
|
|
|
+ <i
|
|
|
+ class="el-icon-copy-document"
|
|
|
+ slot="reference"
|
|
|
+ @click="isLook = true"
|
|
|
+ ></i>
|
|
|
+ </el-popover>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ <el-dialog
|
|
|
+ :visible.sync="studentListModalVisible"
|
|
|
+ title="学员列表"
|
|
|
+ append-to-body
|
|
|
+ width="800px"
|
|
|
+ >
|
|
|
+ <viewStudentList
|
|
|
+ :classId="activeRow.id"
|
|
|
+ :disabledList="allStudentList"
|
|
|
+ :list="studentList"
|
|
|
+ :chioseList="activeRow.studentList"
|
|
|
+ v-if="studentListModalVisible"
|
|
|
+ :showOk="true"
|
|
|
+ :isChiose="true"
|
|
|
+ @close="closeStudentView"
|
|
|
+ />
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <el-dialog
|
|
|
+ :visible.sync="calenderStudentVisible"
|
|
|
+ title="学员缴费列表"
|
|
|
+ append-to-body
|
|
|
+ width="800px"
|
|
|
+ >
|
|
|
+ <!-- studentIds:[],
|
|
|
+ masterClassGroupId:'',
|
|
|
+ classGroupStudents:[] -->
|
|
|
+ <calenderStudentList
|
|
|
+ ref='calenderStudentList'
|
|
|
+ v-if="calenderStudentVisible"
|
|
|
+ :classList="dataList"
|
|
|
+ :studentIds="studentIds"
|
|
|
+ :masterClassGroupId="masterClassGroupId"
|
|
|
+ :classGroupStudents="classGroupStudents"
|
|
|
+ :mergeInfo="mergeInfo"
|
|
|
+ @refresh='refresh'
|
|
|
+ />
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="calenderStudentVisible = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="submitInfo"
|
|
|
+ >确 定</el-button
|
|
|
+ >
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+// import compoundClass from './compoundClass' compoundClass
|
|
|
+import viewStudentList from "./student-list";
|
|
|
+import calenderStudentList from "./calenderStudentList";
|
|
|
+import { getClassAllStudent } from "@/api/studentManager";
|
|
|
+import { getStudentPaymentCalenders } from "@/api/buildTeam";
|
|
|
+let that;
|
|
|
+export default {
|
|
|
+ props: ["compoundList"],
|
|
|
+ components: { viewStudentList, calenderStudentList },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ radio: "",
|
|
|
+ dataList: this.compoundList,
|
|
|
+ isLook: false,
|
|
|
+ show: false,
|
|
|
+ idList: "",
|
|
|
+ studentList: [],
|
|
|
+ studentListModalVisible: false,
|
|
|
+ activeRow: null,
|
|
|
+ calenderStudentVisible: false,
|
|
|
+ studentIds: [],
|
|
|
+ masterClassGroupId: "",
|
|
|
+ classGroupStudents: [],
|
|
|
+ mergeInfo: {},
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ that = this;
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ cancleCom(row) {
|
|
|
+ this.$emit("cancleCompound", row);
|
|
|
+ },
|
|
|
+ clearCom() {
|
|
|
+ this.$emit("clearCom");
|
|
|
+
|
|
|
+ },
|
|
|
+ async submitClass() {
|
|
|
+ if (!this.radio) {
|
|
|
+ this.$message.error("请选择一个主班");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // let arr = []
|
|
|
+ // 主班id
|
|
|
+ // 第一个是所有学员 this.radio
|
|
|
+ // 班级和学生id的键值对
|
|
|
+ // 第三个是主班编号 this.radio
|
|
|
+ let idList = []; // 所有的班级id
|
|
|
+ this.classGroupStudents = [];
|
|
|
+ let flag = false;
|
|
|
+ this.dataList.forEach((com) => {
|
|
|
+ // arr.push(com.type)
|
|
|
+ if (
|
|
|
+ (!com.studentList && com.id != this.radio) ||
|
|
|
+ (com.studentList?.length <= 0 && com.id != this.radio)
|
|
|
+ ) {
|
|
|
+ flag = true;
|
|
|
+ }
|
|
|
+ if (com.id != this.radio) {
|
|
|
+ this.classGroupStudents.push({
|
|
|
+ [com.id]: com.studentList.map((stu) => stu.userId).join(","),
|
|
|
+ });
|
|
|
+ }
|
|
|
+ idList.push(com.id);
|
|
|
+ });
|
|
|
+ if (this.dataList.length <= 1) {
|
|
|
+ this.$message.error("请至少选择2个班级");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (flag) {
|
|
|
+ this.$message.error("请保证每个班至少勾选一名学员");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // 做判断
|
|
|
+ this.show = true;
|
|
|
+ this.isLook = false;
|
|
|
+ this.masterClassGroupId = this.radio;
|
|
|
+ this.studentIds = this.allStudentList.map((stu) => {
|
|
|
+ return stu.userId;
|
|
|
+ });
|
|
|
+
|
|
|
+ try {
|
|
|
+ const rest = await getStudentPaymentCalenders({
|
|
|
+ studentIds: this.studentIds,
|
|
|
+ masterClassGroupId: this.masterClassGroupId,
|
|
|
+ classGroupStudents: this.classGroupStudents,
|
|
|
+ });
|
|
|
+ this.mergeInfo = rest.data;
|
|
|
+ this.calenderStudentVisible = true;
|
|
|
+ } catch (e) {
|
|
|
+ console.log(e);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 试着请求
|
|
|
+ },
|
|
|
+ getList() {
|
|
|
+ this.$emit("getList");
|
|
|
+ },
|
|
|
+ refresh(){
|
|
|
+ this.clearCom()
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ closeReset() {
|
|
|
+ this.clearCom();
|
|
|
+ this.show = false;
|
|
|
+ this.$emit("getList");
|
|
|
+ },
|
|
|
+ showStudentList(row) {
|
|
|
+ // row.id
|
|
|
+ this.activeRow = row;
|
|
|
+ getClassAllStudent({ classGroupId: row.id }).then((res) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.studentList = res.data.map((item) => {
|
|
|
+ return {
|
|
|
+ userId: item.userId,
|
|
|
+ nickName: item.name,
|
|
|
+ gender: item.gender,
|
|
|
+ phone: item.parentsPhone,
|
|
|
+ subjectNames: item.subjectName,
|
|
|
+ };
|
|
|
+ });
|
|
|
+ this.studentListModalVisible = true;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ closeStudentView(list) {
|
|
|
+ this.activeRow.studentList = list;
|
|
|
+ this.dataList.splice(1, 0);
|
|
|
+ this.studentListModalVisible = false;
|
|
|
+ },
|
|
|
+ changeMasterClass(val) {
|
|
|
+ this.dataList.forEach((classes) => {
|
|
|
+ if (classes.id == val) {
|
|
|
+ classes.studentList = null;
|
|
|
+ this.dataList.splice(1, 0);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ submitInfo(){
|
|
|
+ this.$refs.calenderStudentList.submit()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ compoundList(val) {
|
|
|
+ this.dataList = val;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ allStudentList() {
|
|
|
+ let arr = [];
|
|
|
+ that.dataList.forEach((classes) => {
|
|
|
+ if (classes.studentList) {
|
|
|
+ arr = arr.concat(
|
|
|
+ classes.studentList.map((stu) => {
|
|
|
+ stu.classId = classes.id;
|
|
|
+ return stu;
|
|
|
+ })
|
|
|
+ );
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return arr;
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.title {
|
|
|
+ line-height: 44px;
|
|
|
+}
|
|
|
+.fixedBox {
|
|
|
+ position: fixed;
|
|
|
+ bottom: 20px;
|
|
|
+ right: 10px;
|
|
|
+ z-index: 100;
|
|
|
+ width: 200px;
|
|
|
+ background-color: #fff;
|
|
|
+ font-size: 14px;
|
|
|
+
|
|
|
+ .boxWrap {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ justify-content: space-between;
|
|
|
+ i {
|
|
|
+ font-size: 18px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+/deep/.el-divider--horizontal {
|
|
|
+ margin: 0 !important;
|
|
|
+}
|
|
|
+.minus {
|
|
|
+ float: right;
|
|
|
+ line-height: 44px;
|
|
|
+ padding-right: 20px;
|
|
|
+ font-size: 20px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+</style>
|