班级管理，班级列表修改，科目设置

梁保满
1 parent 0ca11cc2
Showing 7 changed files with 780 additions and 333 deletions
package.json
src/api/apis/apis.js
src/api/urls/apis.js
src/router/index.js
src/views/standard/setUp/clazz.vue
src/views/standard/setUp/school.vue
src/views/standard/setUp/student.vue
@@ -21,7 +21,8 @@
     "vue": "^2.6.11",
     "vue-i18n": "^8.4.0",
     "vue-router": "^3.5.1",
-    "vuex": "^3.6.2"
+    "vuex": "^3.6.2",
+    "vuedraggable": "^2.24.3"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "~4.5.0",
@@ -1425,8 +1425,6 @@ export default {
       data,
     });
   },
-
-
   //修改密码
   changePwd(data) {
     return service({
@@ -1435,4 +1433,39 @@ export default {
       data,
     });
   },
+  /**
+   * v1.4
+   */
+  //班级管理
+  classManager(data) {
+    return service({
+      url: setUpUrls.classManager,
+      method: "POST",
+      data,
+    });
+  },
+  //班级排序
+  classSort(data) {
+    return service({
+      url: setUpUrls.classSort,
+      method: "POST",
+      data,
+    });
+  },
+  //学生分班轨迹
+  studentClassLogs(data) {
+    return service({
+      url: setUpUrls.studentClassLogs,
+      method: "POST",
+      data,
+    });
+  },
+  //修改科目
+  updateSubject(data) {
+    return service({
+      url: setUpUrls.updateSubject,
+      method: "POST",
+      data,
+    });
+  },
 };
@@ -367,4 +367,17 @@ export default {
  
   //   修改密码
   changePwd: "/api_html/changePwd",
+
+
+  /**
+   * v1.4
+   */
+  //班级管理
+  classManager: "/api_html/school/manager/classManager",
+  //班级排序
+  classSort: "/api_html/school/manager/classSort",
+  //学生分班轨迹
+  studentClassLogs: "/api_html/school/manager/studentClassLogs",
+  //修改科目
+  updateSubject: "/api_html/school/manager/updateSubject",
 }
@@ -42,6 +42,7 @@ const SetUpConglomerate = () =&gt; import(&quot;@/views/standard/setUp/conglomerate&quot;)
 const SetUpSchool = () => import("@/views/standard/setUp/school")
 const SetUpTeacher = () => import("@/views/standard/setUp/teacher")
 const SetUpStudent = () => import("@/views/standard/setUp/student")
+const SetUpClazz = () => import("@/views/standard/setUp/clazz")
 const ArchivedClazz = () => import("@/views/standard/setUp/archivedClazz")
  
 const PersonalAsk = () => import("@/views/personal/ask/index")
@@ -295,6 +296,13 @@ let addrouters = [
         children: []
       },
       {
+        path: "/setUpClazz",
+        iconCls: "fa fa-sitemap",
+        name: '班级管理',
+        component: SetUpClazz,
+        children: []
+      },
+      {
         path: "/setUpTeacher",
         iconCls: "fa fa-male",
         name: '教师管理',
+<template>
+  <div>
+    <back-box>
+      <template slot="title">
+        <span>班级管理</span>
+      </template>
+      <template slot="btns" v-if="!code">
+        <el-tooltip effect="dark" content="导入班级名单" placement="bottom">
+          <el-button
+            type="primary"
+            icon="el-icon-upload2"
+            size="mini"
+            plain
+            circle
+            @click="diaUp = true"
+          ></el-button>
+        </el-tooltip>
+        <el-tooltip effect="dark" content="导出班级名单" placement="bottom">
+          <el-button
+            type="primary"
+            icon="el-icon-download"
+            size="mini"
+            plain
+            circle
+            @click="exportTeacherExl"
+          ></el-button>
+        </el-tooltip>
+      </template>
+    </back-box>
+    <div class="page-content">
+      <div class="grade-box">
+        <div class="grade-item" v-for="(item, index) in dataList">
+          <p class="h-title">
+            <span>{{ item.gradeName }}</span>
+            <el-button
+              class="sub-btn"
+              type="info"
+              size="mini"
+              round
+              plain
+              @click="openSubject(item)"
+              >科目管理({{ item.subjectNames.length }})</el-button
+            >
+            <span class="txt" v-if="index == 0">拖动班级进行排序</span>
+          </p>
+          <draggable
+            tag="ul"
+            class="grade-info"
+            v-model="item.classList"
+            @start="start"
+            @end="end(item)"
+            v-bind="{
+              animation: 300,
+            }"
+          >
+            <li class="clazz-li" v-for="clazz in item.classList" :key="item.id">
+              <div class="clazz-item">
+                <p class="clazz-name">
+                  {{ clazz.className }}
+                  <i
+                    class="el-icon-edit"
+                    @click.stop="setClass(clazz, item.gradeName)"
+                  ></i>
+                </p>
+                <div class="clazz-class">
+                  <span>学生：{{ clazz.studentCount }}个</span>
+                  <span>教师：{{ clazz.studentCount }}个</span>
+                </div>
+              </div>
+            </li>
+          </draggable>
+        </div>
+      </div>
+    </div>
+    <el-dialog title="导入班级名单" :visible.sync="diaUp" width="600">
+      <up-load
+        id="downTeacher"
+        :url="url"
+        @upSuccess="upSuccess"
+        fileName="班级名单"
+      >
+        <p class="down-txt" slot="down">
+          通过Excel名单导入班级名单，点击
+          <el-link type="danger" @click="downExcel">模板下载</el-link> 。
+        </p>
+      </up-load>
+      <div class="dialog-footer" slot="footer">
+        <el-button @click="diaUp = false">取 消</el-button>
+      </div>
+    </el-dialog>
+    <el-dialog title="修改班级" :visible.sync="diaClass" width="400">
+      <el-form
+        ref="formClass"
+        :model="formClass"
+        :rules="rulesClass"
+        label-width="160px"
+      >
+        <el-form-item label="所在年级：">
+          <span>{{ formClass.gradeName }}</span>
+        </el-form-item>
+        <el-form-item label="班级名称：" prop="studentName">
+          <el-col :span="10">
+            <el-input maxlength="30" v-model.trim="formClass.className" />
+          </el-col>
+        </el-form-item>
+        <el-form-item label="班级编码：">
+          <el-col :span="10">
+            <el-input maxlength="30" v-model.trim="formClass.classCode" />
+          </el-col>
+        </el-form-item>
+        <el-form-item label="入学年份：">
+          <el-col :span="10">
+            <el-date-picker
+              v-model="formClass.intoSchoolYear"
+              type="year"
+              placeholder="选择年"
+            >
+            </el-date-picker>
+          </el-col>
+        </el-form-item>
+      </el-form>
+      <div class="dialog-footer" slot="footer">
+        <el-button @click="_SaveClass" type="primary">确 定</el-button>
+        <el-button @click="diaClass = false">取 消</el-button>
+        <el-popconfirm title="确定删除该班级吗？" @confirm="_RemoveClass">
+          <el-button class="el-button-del" slot="reference" type="danger" plain
+            >删 除</el-button
+          >
+        </el-popconfirm>
+      </div>
+    </el-dialog>
+    <el-dialog :visible.sync="diaSubject" width="400">
+      <p slot="title" class="dia-tit">
+        {{ formClass.gradeName }}
+        <span class="tips">（默认科目和已经有任课老师的提示不能删除）</span>
+      </p>
+      <el-form class="form-box" label-width="80px" v-loading="loadingSub">
+        <el-form-item label="科目：">
+          <div class="subject-box">
+            <el-checkbox-group v-model="subjectNames">
+              <p
+                class="p1"
+                v-for="(item, index) in subjectList"
+                :key="item.default"
+              >
+                <el-checkbox v-if="!item.checked" :label="item.value">{{
+                  item.value
+                }}</el-checkbox>
+                <el-input
+                  class="sub-ipt"
+                  v-else
+                  v-model="item.value"
+                  @keyup.enter.native="_EditSub(item)"
+                ></el-input>
+                <i
+                  class="el-icon el-icon-edit"
+                  v-show="!item.checked"
+                  @click="item.checked = true"
+                ></i>
+                <i
+                  class="el-icon el-icon-check"
+                  v-show="item.checked"
+                  @click="_EditSub(item)"
+                ></i>
+                <i
+                  class="el-icon el-icon-close"
+                  v-show="item.checked"
+                  @click="resetSub(item)"
+                ></i>
+                <i
+                  v-show="!item.checked"
+                  class="el-icon el-icon-delete"
+                  @click="_DelSubject(item, index)"
+                ></i>
+              </p>
+            </el-checkbox-group>
+          </div>
+          <el-col :span="8">
+            <el-input
+              placeholder="添加科目"
+              v-model.trim="subjectName"
+              maxlength="30"
+            >
+              <i
+                slot="suffix"
+                class="el-input__icon el-icon-plus"
+                @click="addSubjectName"
+              ></i>
+            </el-input>
+          </el-col>
+        </el-form-item>
+      </el-form>
+      <div class="dialog-footer" slot="footer">
+        <el-button @click="_SaveSubject" type="primary">确 定</el-button>
+        <el-button @click="diaSubject = false">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { downloadFile } from "@/utils";
+import draggable from "vuedraggable";
+export default {
+  components: {
+    draggable,
+  },
+  data() {
+    return {
+      code: "",
+      loading: false,
+      loadingDown: false,
+      loadingSub: false,
+      diaUp: false,
+      diaClass: false,
+      diaSubject: false,
+      subjectLoading: false,
+      url: "/api_html/school/manager/importClazzClicker",
+      formClass: {
+        //修改班级信息
+        gradeName: "",
+        className: "",
+        classCode: "",
+        intoSchoolYear: "",
+      },
+      rulesClass: {
+        className: [
+          { required: true, message: "请输入班级名称", trigger: "blur" },
+        ],
+      },
+      subjects: [], //科目列表(只有科目)
+      subjectList: [], //科目列表
+      subjectNames: [], //已有科目
+      subjectName: "", //要添加的科目
+      dataList: [],
+    };
+  },
+  async created() {
+    this.code = localStorage.getItem("csCode") || "";
+    this._QueryData();
+    this._QuerySubject();
+  },
+  methods: {
+    openSubject(obj) {
+      this.formClass.gradeName = obj.gradeName;
+      this.subjectNames = [...obj.subjectNames];
+      this.diaSubject = true;
+    },
+    start(e) {
+      console.log(e);
+    },
+    end(obj) {
+      let classListIds = obj.classList.map((item) => {
+        return item.id;
+      });
+      this._SaveComponents(classListIds);
+    },
+    upSuccess(res) {
+      //导入成功
+      this.$message.closeAll();
+      this.$message({
+        showClose: true,
+        message: `成功（${res.data.success}）`,
+        type: "success",
+        duration: 5000,
+      });
+      this.diaUp = false;
+      this._QueryData();
+    },
+    setClass(obj, gradeName) {
+      this.formClass.gradeName = gradeName;
+      this.formClass.classId = obj.id;
+      this.formClass.className = obj.className;
+      this.formClass.classCode = obj.classCode || "";
+      this.formClass.intoSchoolYear = obj.intoSchoolYear
+        ? obj.intoSchoolYear + ""
+        : "";
+      this.diaClass = true;
+    },
+    _RemoveClass() {
+      this.$refs.formClass.validate(async (valid) => {
+        if (valid) {
+          const { data, status, info } = await this.$request.removeClass({
+            classId: this.formClass.classId,
+          });
+          if (status === 0) {
+            this.$message.success("修改成功");
+            this.diaClass = false;
+            this._QueryData();
+          } else {
+            this.$message.error(info);
+          }
+        } else {
+          this.$message.warning("输入有误请检查！");
+          return false;
+        }
+      });
+    },
+    _SaveClass() {
+      this.$refs.formClass.validate(async (valid) => {
+        if (valid) {
+          const { data, status, info } = await this.$request.updateClass({
+            classId: this.formClass.classId,
+            className: this.formClass.className,
+            intoSchoolYear: this.formClass.intoSchoolYear,
+          });
+          if (status === 0) {
+            this.$message.success("修改成功");
+            this.diaClass = false;
+            this._QueryData();
+          } else {
+            this.$message.error(info);
+          }
+        } else {
+          this.$message.warning("输入有误请检查！");
+          return false;
+        }
+      });
+    },
+    addSubjectName() {
+      //添加科目
+      if (!this.subjectName) {
+        this.$message.warning("请填写科目名称");
+        return;
+      } else if (this.subjects.includes(this.subjectName)) {
+        this.$message.warning("科目已存在，请重新填写～");
+        return;
+      }
+      this.subjectList.push({
+        default: this.subjectName,
+        value: this.subjectName,
+        checked: false,
+      });
+      this.subjectNames.push(this.subjectName);
+      this.subjectName = "";
+    },
+    resetSub(item) {
+      item.value = item.default;
+      item.checked = false;
+    },
+    async _EditSub(item) {
+      if (this.subjects.includes(item.value)) {
+        this.$message.warning("科目已存在，请重新填写～");
+        return;
+      }
+      item.checked = false;
+      const { status, info } = await this.$request.updateSubject({
+        subjectName: item.value,
+        oldSubjectName: item.default,
+      });
+      if (status === 0) {
+        this.$message.success(info);
+        let idx = this.subjectNames.findIndex(sub => item==sub)
+        this.subjectNames.splice(idx, 1, item.value);
+        item.default = item.value;
+      } else {
+        item.checked = true;
+        this.$message.error(info);
+      }
+    },
+    async _DelSubject(obj, index) {
+      if (this.subjectLoading) return;
+      this.subjectLoading = true;
+      const { status, info } = await this.$request.delSubject({
+        subjectName: obj.default,
+      });
+      this.subjectLoading = false;
+      if (status === 0) {
+        this.$message.success(info);
+        this.subjectList.splice(index, 1);
+        this._QueryData();
+      } else {
+        this.$message.error(info);
+      }
+    },
+    async _SaveSubject() {
+      //保存修改年级信息
+      if (!this.subjectNames.length) {
+        this.$message.error("请选择科目！");
+        return;
+      }
+      this.loadingSub = true;
+      const { status, info } = await this.$request.updateGrade({
+        gradeName: this.formClass.gradeName,
+        subjectNames: this.subjectNames,
+      });
+      this.loadingSub = false;
+      if (status === 0) {
+        this.$message.success("修改成功~");
+        this.diaSubject = false;
+        this._QueryData();
+        this._QuerySubject();
+      } else {
+        this.$message.error(info);
+      }
+    },
+    async _SaveComponents(classListIds) {
+      this.loading = true;
+      let { status, info } = await this.$request.classSort({
+        classIds: [...classListIds],
+      });
+      this.loading = false;
+      if (status === 0) {
+        this.$message.success("调整成功！");
+      } else {
+        this.$message.error(info);
+      }
+    },
+    async _QueryData() {
+      this.loading = true;
+      let { data, status, info } = await this.$request.classManager();
+      this.loading = false;
+      if (status === 0) {
+        this.dataList = [...data.list] || [];
+      } else {
+        this.$message.error(info);
+      }
+    },
+    async _QuerySubject() {
+      const { data, status, info } = await this.$request.subjectList();
+      if (status === 0) {
+        this.subjects = [...data?.subjectNames] || [];
+        this.subjectList =
+          data?.subjectNames.map((item) => {
+            return {
+              default: item,
+              value: item,
+              checked: false,
+            };
+          }) || [];
+      } else {
+        this.$message.error(info);
+      }
+    },
+    async downExcel() {
+      let data = await this.$request.teacherTemplate();
+      if (data && !data.code) {
+        let blob = new Blob([data], {
+          type: "application/vnd.ms-excel;charset=utf-8",
+        });
+        downloadFile(`班级名单模版.xlsx`, blob);
+      } else {
+        this.$message.error(data.info);
+      }
+    },
+    async exportTeacherExl() {
+      this.loadingDown = true;
+      let data = await this.$request.exportTeacher();
+      this.loadingDown = false;
+      if (data) {
+        let blob = new Blob([data], {
+          type: "application/vnd.ms-excel;charset=utf-8",
+        });
+        downloadFile(`班级名单.xlsx`, blob);
+      } else {
+        this.$message.error("下载失败");
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.page-tit {
+  margin-bottom: 20px;
+}
+.page-content {
+  padding: 20px;
+}
+.grade-box {
+  background: #f8f8f8;
+  padding: 12px 0;
+}
+.el-button-del {
+  margin-left: 10px;
+}
+.h-title {
+  display: flex;
+  align-items: center;
+  .sub-btn {
+    margin-left: 30px;
+  }
+  .txt {
+    margin-left: 30px;
+    font-size: 13px;
+    color: #666;
+  }
+}
+.dia-tit {
+  .tips {
+    font-size: 12px;
+  }
+}
+.grade-item {
+  .grade-info {
+    display: flex;
+    flex-wrap: wrap;
+    padding: 20px 20px 0;
+    .clazz-li {
+      margin-right: 30px;
+      margin-bottom: 20px;
+      position: relative;
+      background: #fff;
+      .el-icon-edit {
+        cursor: pointer;
+        display: none;
+        &:hover {
+          color: #667ffd;
+        }
+      }
+      &:hover {
+        .el-icon-edit {
+          display: inline;
+        }
+      }
+    }
+
+    .clazz-item {
+      width: 220px;
+      box-sizing: border-box;
+      padding: 16px;
+      border-radius: 10px;
+      box-shadow: 1px 1px 3px #888;
+    }
+    .clazz-name {
+      font-size: 16px;
+      font-weight: bold;
+      line-height: 18px;
+      padding-bottom: 12px;
+    }
+    .clazz-class {
+      display: flex;
+      justify-content: space-between;
+      font-size: 15px;
+    }
+  }
+}
+.subject-box {
+  overflow: hidden;
+  position: relative;
+  .p1 {
+    line-height: 20px;
+    margin-bottom: 10px;
+  }
+}
+:deep(.el-checkbox-group) {
+  display: flex;
+  flex-wrap: wrap;
+  .p1 {
+    padding-right: 50px;
+    position: relative;
+    &:hover {
+      .el-icon {
+        display: block;
+        &:hover {
+          color: #667ffd;
+        }
+      }
+      .is-checked ~ .el-icon-delete {
+        display: none;
+      }
+    }
+  }
+  .el-icon {
+    font-size: 14px;
+    color: #999;
+    position: absolute;
+    right: 10px;
+    top: 3px;
+    cursor: pointer;
+    display: none;
+  }
+  .el-icon-check,
+  .el-icon-close {
+    display: block;
+  }
+  .el-icon-edit,
+  .el-icon-check {
+    right: 28px;
+  }
+}
+.sub-ipt {
+  :deep(.el-input__inner) {
+    height: 24px;
+    line-height: 24px;
+  }
+}
+.form-box {
+  :deep(.el-form-item__label) {
+    line-height: 28px;
+  }
+  .el-icon-plus {
+    cursor: pointer;
+    &:hover {
+      color: #667ffd;
+    }
+  }
+}
+</style>
 \ No newline at end of file
@@ -72,7 +72,6 @@
               class="grade-item"
               v-for="item in tableData"
               :key="item.grade"
-              @click="setGrade(item)"
             >
               <p class="grade-name">{{ item.gradeName }}</p>
               <div class="grade-class">
@@ -113,55 +112,6 @@
         <el-button @click="diaUp = false">取 消</el-button>
       </div>
     </el-dialog>
-    <el-dialog title="修改年级信息" :visible.sync="diaGrade" width="800px">
-      <el-form
-        class="form-box"
-        :model="formGrade"
-        :rules="rulesGrade"
-        label-width="160px"
-      >
-        <el-form-item label="科目：" prop="subjectNames">
-          <div class="subject-box" v-loading="subjectLoading" :class="showAll ? 'active' : ''">
-            <span
-              v-show="subjectList.length > 12"
-              class="showAll"
-              @click="showAll = !showAll"
-              >{{ showAll ? "收起" : "更多..." }}</span
-            >
-            <el-checkbox-group v-model="formGrade.subjectNames">
-              <p class="p1" v-for="(item, index) in subjectList" :key="item">
-                <el-checkbox :label="item">{{ item }}</el-checkbox>
-                <i class="el-icon-delete" @click="_DelSubject(item, index)"></i>
-              </p>
-            </el-checkbox-group>
-          </div>
-          <el-col :span="8">
-            <el-input
-              placeholder="添加科目"
-              v-model.trim="subjectName"
-              maxlength="30"
-            >
-              <i
-                slot="suffix"
-                class="el-input__icon el-icon-plus"
-                @click="addSubjectName"
-              ></i>
-            </el-input>
-          </el-col>
-        </el-form-item>
-        <el-form-item label="班级：">
-          <span v-for="(item, index) in formGrade.classList" :key="item.id">{{
-            `${item.className}${
-              index == formGrade.classList.length - 1 ? "" : "、"
-            }`
-          }}</span>
-        </el-form-item>
-      </el-form>
-      <div class="dialog-footer" slot="footer">
-        <el-button @click="editGrade">确 定</el-button>
-        <el-button @click="diaGrade = false">取 消</el-button>
-      </div>
-    </el-dialog>
     <el-dialog title="修改学校信息" :visible.sync="diaSchool" width="400">
       <el-form
         ref="formSchool"
@@ -246,8 +196,6 @@ export default {
       url: "/api_html/school/manager/importClassAndStudent",
       diaUp: false,
       diaSchool: false,
-      diaGrade: false,
-      showAll: false, //修改年级科目显示
       school: {
         schoolName: "",
         managePwd: "",
@@ -286,21 +234,8 @@ export default {
           },
         ],
       },
-      formGrade: {
-        //修改年级
-        gradeName: "",
-        subjectNames: [],
-        classList: [],
-      },
-      rulesGrade: {
-        subjectNames: [
-          { required: true, message: "请选择科目", trigger: "blur" },
-        ],
-      },
       subjectName: "",
       sectionsList: [],
-      subjectLoading:false,
-      subjectList: [],
       diaUpgradeGrade: false, //班级升级
       defaultSections: [],
     };
@@ -321,7 +256,6 @@ export default {
     this.code = localStorage.getItem("csCode") || "";
     this._QueryDataSchool();
     this._QueryDataGrade();
-    this._QuerySubject();
     this._QuerySectionList();
   },
   methods: {
@@ -338,27 +272,6 @@ export default {
       this._QueryDataSchool();
       this._QueryDataGrade();
     },
-    setGrade(obj) {
-      //打开年级设置
-      this.formGrade.subjectNames = obj.subjectNames;
-      this.formGrade.classList = obj.classList;
-      this.formGrade.gradeName = obj.gradeName;
-      this.showAll = false;
-      this.diaGrade = true;
-    },
-    addSubjectName() {
-      //添加科目
-      if (!this.subjectName) {
-        this.$message.warning("请填写科目名称");
-        return;
-      } else if (this.subjectList.includes(this.subjectName)) {
-        this.$message.warning("科目已存在，请重新填写～");
-        return;
-      }
-      this.subjectList.push(this.subjectName);
-      this.formGrade.subjectNames.push(this.subjectName);
-      this.subjectName = "";
-    },
     editSchool() {
       //保存修改学校信息
       if (!this.formSchool.sections.length) {
@@ -398,20 +311,7 @@ export default {
         }
       });
     },
-    async _DelSubject(subject, index) {
-      if(this.subjectLoading)return
-      this.subjectLoading = true
-      const { status, info } = await this.$request.delSubject({
-        subjectName: subject,
-      });
-      this.subjectLoading = false
-      if (status === 0) {
-        this.$message.success(info);
-        this.subjectList.splice(index, 1);
-      } else {
-        this.$message.error(info);
-      }
-    },
+    
     async _UpgradeGrade() {
       this.loading = true;
       const { data, status, info } = await this.$request.upgradeGrade();
@@ -420,34 +320,11 @@ export default {
         this.$message.success("升级成功~");
         this.diaUpgradeGrade = false;
         this._QueryDataGrade();
-        this._QuerySubject();
-      } else {
-        this.$message.error(info);
-      }
-    },
-    async editGrade() {
-      //保存修改年级信息
-      if (!this.formGrade.subjectNames.length) {
-        this.$message.error("请选择科目！");
-        return;
-      }
-      if (this.loading) {
-        return;
-      }
-      this.loading = true;
-      const { data, status, info } = await this.$request.updateGrade({
-        gradeName: this.formGrade.gradeName,
-        subjectNames: this.formGrade.subjectNames,
-      });
-      this.loading = false;
-      if (status === 0) {
-        this.$message.success("修改成功~");
-        this.diaGrade = false;
-        this._QueryDataGrade();
       } else {
         this.$message.error(info);
       }
     },
+
     async _QuerySectionList() {
       //学校学段
       const { data, status, info } = await this.$request.sectionList();
@@ -491,14 +368,7 @@ export default {
         this.$message.error(info);
       }
     },
-    async _QuerySubject() {
-      const { data, status, info } = await this.$request.subjectList();
-      if (status === 0) {
-        this.subjectList = [...data.subjectNames] || [];
-      } else {
-        this.$message.error(info);
-      }
-    },
+    
     async downExcel() {
       let data = await this.$request.classAndStudentTemplate();
       if (data && !data.code) {
@@ -598,7 +468,6 @@ export default {
         padding: 12px 16px;
         border-radius: 10px;
         box-shadow: 1px 1px 3px #888;
-        cursor: pointer;
         transition: all 0.5s;
         &:hover {
           transform: translate(-2px, -5px);
@@ -633,27 +502,6 @@ export default {
 }
 .form-box {
   margin: 0 20px;
-  .subject-box {
-    height: 90px;
-    overflow: hidden;
-    position: relative;
-    &.active {
-      height: auto;
-      overflow: auto;
-    }
-    .showAll {
-      position: absolute;
-      bottom: 0;
-      right: 10px;
-      font-size: 12px;
-      color: #7f7f7f;
-      cursor: pointer;
-      padding: 2px;
-      &:hover {
-        color: #667ffd;
-      }
-    }
-  }
 }
 .el-icon-plus {
   cursor: pointer;
@@ -34,6 +34,23 @@
     </back-box>
     <div class="answer-header">
       <div class="sel-box">
+        <el-select
+          class="sel"
+          v-model="query.gradeName"
+          placeholder="选择年级"
+          @change="changeGrade"
+        >
+          <el-option disabled label="全部" value=""></el-option>
+          <el-option
+            v-for="item in gradeList"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option>
+          <el-option label="未分配" :value="80"></el-option>
+          <el-option label="已毕业" :value="81"></el-option>
+        </el-select>
         <el-input
           placeholder="请输入学生姓名"
           v-model="query.studentName"
@@ -61,30 +78,14 @@
       </div>
     </div>
     <div class="page-content">
-      <!-- <template v-if="!code && role !== 'ROLE_PERSONAL'">
-        <p class="tips" v-show="archivedTotal">
-          <span>另有{{ archivedTotal }}个班级已经归档,</span>
-          <router-link to="/archivedClazz">点击查看&gt;&gt;</router-link>
-        </p>
-      </template> -->
       <div class="stu-box">
-        <div class="stu-list">
-          <div class="h-title">
-            <el-select
-              class="sel"
-              v-model="query.gradeName"
-              placeholder="选择年级"
-              @change="changeGrade"
-            >
-              <el-option
-                v-for="item in gradeList"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"
-              >
-              </el-option>
-            </el-select>
-          </div>
+        <div
+          class="stu-list"
+          v-show="
+            query.gradeName != 80 && query.gradeName != 81 && query.gradeName
+          "
+        >
+          <div class="h-title">班级列表</div>
           <ul class="stu-ul">
             <li
               class="stu-item"
@@ -93,33 +94,19 @@
               :class="query.classId == item.id ? 'active' : ''"
               @click="classDetail(item)"
             >
-              <template v-if="!code && role !== 'ROLE_PERSONAL'">
-                <!-- <el-tooltip effect="dark" content="班级归档" placement="top">
-                  <div class="popconfirm-box">
-                    <i
-                      slot="reference"
-                      class="fa fa-file-archive-o"
-                      @click.stop="openArchivingDia(item, index)"
-                    ></i>
-                  </div>
-                </el-tooltip> -->
-                <el-tooltip effect="dark" content="修改班级" placement="top">
-                  <i
-                    class="el-icon-edit-outline"
-                    @click.stop="setClass(item)"
-                  ></i>
-                </el-tooltip>
-              </template>
               {{ item.className }}（{{ item.studentCount }}）
             </li>
           </ul>
         </div>
         <div class="stu-detail">
-          <div class="clazz-detail" v-if="clazzDetail.stationSn">
+          <p class="total" v-if="studentList.length">
+            共筛选出{{ studentList.length }}名学生。
+          </p>
+          <!-- <div class="clazz-detail" v-if="clazzDetail.stationSn">
             <p>基站SN：{{ clazzDetail.stationSn }}</p>
             <p>配对码：{{ clazzDetail.pairingCode }}</p>
             <p>频点：{{ clazzDetail.frequency }}</p>
-          </div>
+          </div> -->
  
           <ul class="s-ul" v-loading="loading">
             <li
@@ -130,24 +117,26 @@
               <el-popconfirm
                 v-if="!code"
                 title="确定删除吗？"
-                @confirm="removeStu(item, index)"
+                @confirm="removeStu(item, index, $event)"
               >
                 <i class="el-icon-delete" slot="reference"></i>
               </el-popconfirm>
               <i
                 class="el-icon-user-solid"
                 v-if="!code"
-                @click="openChangeClazz(item)"
+                @click.stop="openChangeClazz(item)"
               ></i>
-              <p class="name">
-                {{ item.studentName }}
-              </p>
-              <p class="p2" v-if="!query.classId">
-                {{ item.gradeName }}﹒{{ item.className }}
-              </p>
-              <p class="p1">答题器：{{ item.clickerSn || "--" }}</p>
-              <p class="p1">长学号：{{ item.studentCode }}</p>
-              <p class="p1">短学号：{{ item.shortNumber || "--" }}</p>
+              <div class="s-li-box" @click="sayChange(item)">
+                <p class="name">
+                  {{ item.studentName }}
+                </p>
+                <p class="p2" v-if="!query.classId">
+                  {{ item.gradeName }}﹒{{ item.className }}
+                </p>
+                <p class="p1">答题器：{{ item.clickerSn || "--" }}</p>
+                <p class="p1">长学号：{{ item.studentCode }}</p>
+                <p class="p1">短学号：{{ item.shortNumber || "--" }}</p>
+              </div>
             </li>
           </ul>
           <el-empty
@@ -204,6 +193,25 @@
         <el-button @click="diaChangeClass = false">取 消</el-button>
       </div>
     </el-dialog>
+    <el-dialog title="调班轨迹" :visible.sync="diaChangeClassTrack" width="400">
+      <el-form
+        :model="formClassTrack"
+        label-width="160px"
+        v-loading="loadingClassLogs"
+      >
+        <el-form-item label="学生姓名：">
+          <span>{{ formClassTrack.studentName }}</span>
+        </el-form-item>
+        <el-form-item label="当前班级：">
+          <p v-for="item in formClassTrack.classList">
+            {{ `${item.grade}-${item.className}(${item.createdTime})` }}
+          </p>
+        </el-form-item>
+      </el-form>
+      <div class="dialog-footer" slot="footer">
+        <el-button @click="diaChangeClassTrack = false">关 闭</el-button>
+      </div>
+    </el-dialog>
     <el-dialog title="添加学生" :visible.sync="diaStu" width="400">
       <el-form
         ref="formBox"
@@ -255,39 +263,6 @@
         <el-button @click="diaStu = false">取 消</el-button>
       </div>
     </el-dialog>
-    <el-dialog title="修改班级" :visible.sync="diaClass" width="400">
-      <el-form
-        class="form-box"
-        ref="formClass"
-        :model="formClass"
-        :rules="rulesClass"
-        label-width="160px"
-      >
-        <el-form-item label="所在年级：">
-          <span>{{ formClass.gradeName }}</span>
-        </el-form-item>
-        <el-form-item label="班级名称：" prop="studentName">
-          <el-col :span="10">
-            <el-input maxlength="30" v-model.trim="formClass.className" />
-          </el-col>
-        </el-form-item>
-        <el-form-item label="入学年份：" prop="studentCode">
-          <el-col :span="10">
-            <el-date-picker
-              v-model="formClass.intoSchoolYear"
-              type="year"
-              value-format="yyyy"
-              placeholder="选择年"
-            >
-            </el-date-picker>
-          </el-col>
-        </el-form-item>
-      </el-form>
-      <div class="dialog-footer" slot="footer">
-        <el-button @click="saveClass">确 定</el-button>
-        <el-button @click="diaClass = false">取 消</el-button>
-      </div>
-    </el-dialog>
     <el-dialog title="学生答题器绑定" :visible.sync="diaUp" width="600">
       <up-load
         id="downTeacher"
@@ -304,17 +279,6 @@
         <el-button @click="diaUp = false">取 消</el-button>
       </div>
     </el-dialog>
-    <el-dialog title="班级归档" :visible.sync="diaArchiving" width="400">
-      <p>
-        注意班级归档后，学生解除班级关系且相关老师任课信息将不存在，确认要将班级归档吗？
-      </p>
-      <div class="dialog-footer" slot="footer">
-        <el-button type="danger" @click="archivingClass">确认归档</el-button>
-        <el-button type="primary" @click="diaArchiving = false"
-          >取 消</el-button
-        >
-      </div>
-    </el-dialog>
   </div>
 </template>
  
@@ -326,11 +290,18 @@ export default {
     return {
       code: "",
       role: "",
+      loading: false,
+      loadingDown: false,
+      loadingClassLogs: false,
       diaUp: false,
       url: "/api_html/school/manager/importStudentClicker",
       diaStu: false,
-      diaClass: false,
       diaChangeClass: false,
+      diaChangeClassTrack: false,
+      formClassTrack: {
+        studentName: "",
+        classList: [],
+      },
       clazzDetail: { stationSn: "", pairingCode: "", frequency: "" },
       query: {
         gradeName: "",
@@ -354,16 +325,6 @@ export default {
           { required: true, message: "请输入学生长学号", trigger: "blur" },
         ],
       },
-      formClass: {
-        gradeName: "",
-        className: "",
-        intoSchoolYear: "",
-      },
-      rulesClass: {
-        className: [
-          { required: true, message: "请输入班级名称", trigger: "blur" },
-        ],
-      },
       formStuCla: {
         studentName: "",
         studentId: "",
@@ -393,10 +354,6 @@ export default {
         teacherCourseList: [],
         teacherGradeList: [],
       },
-      diaArchiving: false,
-      archivedTotal: 0, //已归档班级
-      archivingObj: {}, //即将归档班级信息
-      archivingIndex: 0, //即将归档班级下标
     };
   },
   async created() {
@@ -404,7 +361,6 @@ export default {
     this.role =
       this.$store.getters.info.showRole ||
       this.$store.getters.info.permissions[0].role;
-    this._QueryArchivedNum();
     await this._QueryDataGrade();
     await this._QueryClass();
     this._QueryData(3);
@@ -435,34 +391,6 @@ export default {
       this._QueryData(3);
     },
  
-    setClass(obj) {
-      this.formClass.gradeName = obj.gradeName;
-      this.formClass.classId = obj.id;
-      this.formClass.className = obj.className;
-      this.formClass.intoSchoolYear = obj.intoSchoolYear + "";
-      this.diaClass = true;
-    },
-    saveClass() {
-      this.$refs.formClass.validate(async (valid) => {
-        if (valid) {
-          const { data, status, info } = await this.$request.updateClass({
-            classId: this.formClass.classId,
-            className: this.formClass.className,
-            intoSchoolYear: this.formClass.intoSchoolYear,
-          });
-          if (status === 0) {
-            this.$message.success("修改成功");
-            this.diaClass = false;
-            this._QueryClass();
-          } else {
-            this.$message.error(info);
-          }
-        } else {
-          this.$message.warning("输入有误请检查！");
-          return false;
-        }
-      });
-    },
     upSuccess(res) {
       this.$message.closeAll();
       this.$message({
@@ -513,6 +441,11 @@ export default {
         }
       });
     },
+    //学生调班轨迹
+    sayChange(obj) {
+      this._StudentClassLogs(obj);
+      this.diaChangeClassTrack = true;
+    },
     //学生调班弹窗
     openChangeClazz(obj) {
       this.formStuCla.studentId = obj.id;
@@ -551,32 +484,21 @@ export default {
       { leading: true, trailing: false }
     ),
  
-    openArchivingDia(obj, index) {
-      this.archivingObj = { ...obj };
-      this.archivingIndex = index;
-      this.diaArchiving = true;
-    },
-    //班级归档
-    async archivingClass() {
-      const { data, status, info } = await this.$request.classArchiving({
-        classId: this.archivingObj.id,
+    //学生调班轨迹
+    async _StudentClassLogs(obj) {
+      this.loadingClassLogs = true;
+      let { data, info, status } = await this.$request.studentClassLogs({
+        studentId: obj.id,
       });
-      this.diaArchiving = false;
-      if (status === 0) {
-        this.$message.success("归档成功");
-        this.classList.splice(this.archivingIndex, 1);
-        if (this.archivingIndex == this.classList.length) {
-          this.classDetail(this.classList[this.archivingIndex - 1]);
-        } else {
-          this.classDetail(this.classList[this.archivingIndex]);
-        }
-        this._QueryArchivedNum();
-        this._QueryData(3);
+      this.loadingClassLogs = false;
+      if (status == 0) {
+        this.formClassTrack.studentName = obj.studentName;
+        this.formClassTrack.classList = (data.list && [...data.list]) || [];
       } else {
         this.$message.error(info);
       }
     },
-    async removeStu(obj, index) {
+    async removeStu(obj, index, $event) {
       const { data, status, info } = await this.$request.delStudent({
         studentId: obj.id,
       });
@@ -589,28 +511,33 @@ export default {
       }
     },
     async changeGrade(val) {
+      if (!val) return;
       this.query.classId = "";
+      this.query.studentName = "";
+      this.query.studentCode = "";
       await this._QueryClass(val);
       this._QueryData(3);
     },
-    async _QueryArchivedNum() {
-      const { data, status, info } = await this.$request.archivingClassList();
-      if (status === 0) {
-        this.archivedTotal = data?.count || 0;
-      } else {
-        this.$message.error(info);
-      }
-    },
     async _QueryData(type) {
       let query = {};
       if (type == 1) {
+        if (!this.query.studentName) {
+          this.$message.warning("输入学生姓名～");
+          return;
+        }
         this.query.classId = "";
         query.studentName = this.query.studentName;
         this.query.studentCode = "";
+        this.query.gradeName = "";
       } else if (type == 2) {
+        if (!this.query.studentName) {
+          this.$message.warning("输入学生学号～");
+          return;
+        }
         this.query.classId = "";
         query.studentCode = this.query.studentCode;
         this.query.studentName = "";
+        this.query.gradeName = "";
       } else if (type == 3) {
         this.query.studentName = "";
         this.query.studentCode = "";
@@ -619,6 +546,15 @@ export default {
       } else {
         query = this.query;
       }
+      if (query.gradeName == 80) {
+        query.status = 1;
+        delete query.gradeName;
+      } else if (query.gradeName == 81) {
+        query.status = 2;
+        delete query.gradeName;
+      } else {
+        query.status = 0;
+      }
       this.loading = true;
       const { data, status, info } = await this.$request.studentList({
         ...query,
@@ -702,6 +638,7 @@ export default {
     padding-top: 10px;
   }
   .stu-list {
+    min-width: 200px;
     max-height: 80vh;
     .h-title {
       height: 40px;
@@ -766,18 +703,26 @@ export default {
   .stu-detail {
     flex: 1;
     border-left: 0.5px solid #eee;
+    .total {
+      padding: 15px 12px;
+      font-size: 14px;
+      color: #666;
+    }
     .s-ul {
       display: flex;
       flex-wrap: wrap;
       padding-left: 20px;
       .s-li {
-        width: 180px;
-        min-height: 120px;
+        position: relative;
         box-shadow: 2px 2px 5px #7f7f7f;
-        border-radius: 10px;
         margin: 0 20px 20px 0;
-        padding: 0 12px 5px;
-        position: relative;
+        .s-li-box {
+          width: 180px;
+          border-radius: 10px;
+          min-height: 120px;
+          padding: 0 12px 5px;
+          cursor: pointer;
+        }
         .el-icon-user-solid {
           position: absolute;
           top: 8px;