|
|
@@ -12,13 +12,15 @@
|
|
|
>
|
|
|
<div class="mb-4 tab-btns">
|
|
|
<el-button
|
|
|
- v-for="(val, key) in EXAM_OBJECT_TYPE"
|
|
|
- :key="key"
|
|
|
+ v-for="item in objectTypeList"
|
|
|
+ :key="item.value"
|
|
|
size="medium"
|
|
|
- :type="examObjectType === key ? 'primary' : 'default'"
|
|
|
- :disabled="selectedExamObjectType && selectedExamObjectType !== key"
|
|
|
- @click="selectMenu(key)"
|
|
|
- >{{ val }}
|
|
|
+ :type="examObjectType === item.value ? 'primary' : 'default'"
|
|
|
+ :disabled="
|
|
|
+ selectedExamObjectType && selectedExamObjectType !== item.value
|
|
|
+ "
|
|
|
+ @click="selectMenu(item.value)"
|
|
|
+ >{{ item.name }}
|
|
|
</el-button>
|
|
|
</div>
|
|
|
<div class="user-search">
|
|
|
@@ -34,7 +36,9 @@
|
|
|
|
|
|
<el-row type="flex" :gutter="10">
|
|
|
<el-col :span="12">
|
|
|
- <h3 class="user-part-title">班级/学生</h3>
|
|
|
+ <h3 class="user-part-title">
|
|
|
+ {{ showStudent ? "班级/学生" : "班级" }}
|
|
|
+ </h3>
|
|
|
<div class="user-tree">
|
|
|
<el-tree
|
|
|
ref="UserTree"
|
|
|
@@ -98,18 +102,33 @@ export default {
|
|
|
return [];
|
|
|
},
|
|
|
},
|
|
|
+ selectedIds: {
|
|
|
+ type: Array,
|
|
|
+ default() {
|
|
|
+ return [];
|
|
|
+ },
|
|
|
+ },
|
|
|
courseCode: {
|
|
|
type: String,
|
|
|
default: "",
|
|
|
},
|
|
|
+ objectTypes: {
|
|
|
+ type: Array,
|
|
|
+ default() {
|
|
|
+ return ["TEACH_CLAZZ_STUDENT", "BASIC_CLAZZ_STUDENT"];
|
|
|
+ },
|
|
|
+ },
|
|
|
+ showStudent: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false,
|
|
|
+ },
|
|
|
},
|
|
|
- components: {},
|
|
|
data() {
|
|
|
return {
|
|
|
modalIsShow: false,
|
|
|
examObjectType: "TEACH_CLAZZ_STUDENT",
|
|
|
basicCourseCode: null,
|
|
|
- EXAM_OBJECT_TYPE,
|
|
|
+ objectTypeList: [],
|
|
|
dataTree: {
|
|
|
TEACH_CLAZZ_STUDENT: [],
|
|
|
BASIC_CLAZZ_STUDENT: [],
|
|
|
@@ -171,15 +190,31 @@ export default {
|
|
|
if (!this.dataTree[val].length) {
|
|
|
await this.getStudents();
|
|
|
}
|
|
|
- this.userTree = this.dataTree[val];
|
|
|
+ this.userTree = this.getUserTree(val);
|
|
|
this.updateUserTreeDisableInfo(this.disabledIds);
|
|
|
},
|
|
|
+ getUserTree(examObjectType) {
|
|
|
+ let userTree = this.dataTree[examObjectType];
|
|
|
+ if (this.showStudent) return userTree;
|
|
|
+
|
|
|
+ return userTree.map((item) => {
|
|
|
+ let nitem = { ...item };
|
|
|
+ nitem.children = [];
|
|
|
+ return nitem;
|
|
|
+ });
|
|
|
+ },
|
|
|
clearTypeData(type = "BASIC_CLAZZ_STUDENT") {
|
|
|
this.dataTree[type] = [];
|
|
|
},
|
|
|
checkChange() {
|
|
|
// console.log("check click");
|
|
|
const selectedKeys = this.$refs.UserTree.getCheckedKeys(true);
|
|
|
+ if (!this.showStudent) {
|
|
|
+ this.selectedUsers = this.userTree.filter((item) =>
|
|
|
+ selectedKeys.includes(item.id)
|
|
|
+ );
|
|
|
+ return;
|
|
|
+ }
|
|
|
const disabledIds = [...selectedKeys, ...this.disabledIds];
|
|
|
const disabledStdIds = disabledIds.map((item) => item.split("_")[1]);
|
|
|
|
|
|
@@ -206,11 +241,26 @@ export default {
|
|
|
},
|
|
|
removeSelectStudent(node) {
|
|
|
// console.log("node remove");
|
|
|
+ if (!this.showStudent) {
|
|
|
+ this.selectedUsers = this.selectedUsers.filter(
|
|
|
+ (item) => item.id !== node.data.id
|
|
|
+ );
|
|
|
+ this.$refs.UserTree.setCheckedKeys(
|
|
|
+ this.selectedUsers.map((item) => item.id)
|
|
|
+ );
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
this.$refs.UserSelectedTree.remove(node);
|
|
|
this.setTreeSelectedKeys();
|
|
|
this.checkChange();
|
|
|
},
|
|
|
setTreeSelectedKeys() {
|
|
|
+ if (!this.showStudent) {
|
|
|
+ const selectedUsersIds = this.selectedUsers.map((item) => item.id);
|
|
|
+ this.$refs.UserTree.setCheckedKeys(selectedUsersIds);
|
|
|
+ return;
|
|
|
+ }
|
|
|
let selectedUserIds = [];
|
|
|
this.selectedUsers.forEach((item) => {
|
|
|
item.children.forEach((elem) => {
|
|
|
@@ -220,28 +270,45 @@ export default {
|
|
|
this.$refs.UserTree.setCheckedKeys(selectedUserIds);
|
|
|
},
|
|
|
async visibleChange() {
|
|
|
+ this.objectTypeList = this.objectTypes.map((field) => {
|
|
|
+ return {
|
|
|
+ name: EXAM_OBJECT_TYPE[field],
|
|
|
+ value: field,
|
|
|
+ };
|
|
|
+ });
|
|
|
+ if (!this.objectTypeList.length) return;
|
|
|
+ if (this.objectTypeList.length === 1) {
|
|
|
+ this.examObjectType = this.objectTypeList[0].value;
|
|
|
+ }
|
|
|
+
|
|
|
if (this.basicCourseCode !== this.courseCode) {
|
|
|
this.clearSelectedExamObjectType();
|
|
|
this.basicCourseCode = this.courseCode;
|
|
|
- await this.getStudents("TEACH_CLAZZ_STUDENT");
|
|
|
+ await this.getStudents(this.examObjectType);
|
|
|
}
|
|
|
|
|
|
- this.selectMenu(this.examObjectType);
|
|
|
+ await this.selectMenu(this.examObjectType);
|
|
|
+
|
|
|
+ if (this.selectedIds && this.selectedIds.length) {
|
|
|
+ this.$refs.UserTree.setCheckedKeys(this.selectedIds);
|
|
|
+ this.checkChange();
|
|
|
+ }
|
|
|
},
|
|
|
labelChange() {
|
|
|
if (this.filterLabel) {
|
|
|
const escapeRegexpString = (value = "") =>
|
|
|
String(value).replace(/[|\\{}()[\]^$+*?.]/g, "\\$&");
|
|
|
const reg = new RegExp(escapeRegexpString(this.filterLabel), "i");
|
|
|
- this.userTree = this.dataTree[this.examObjectType].filter((item) =>
|
|
|
+ this.userTree = this.getUserTree(this.examObjectType).filter((item) =>
|
|
|
reg.test(item.label)
|
|
|
);
|
|
|
} else {
|
|
|
- this.userTree = this.dataTree[this.examObjectType];
|
|
|
+ this.userTree = this.getUserTree(this.examObjectType);
|
|
|
}
|
|
|
this.setTreeSelectedKeys();
|
|
|
},
|
|
|
updateUserTreeDisableInfo(disabledIds) {
|
|
|
+ if (!this.showStudent) return;
|
|
|
const disabledStdIds = disabledIds.map((item) => item.split("_")[1]);
|
|
|
|
|
|
this.userTree.forEach((item) => {
|
|
|
@@ -260,13 +327,25 @@ export default {
|
|
|
open() {
|
|
|
this.modalIsShow = true;
|
|
|
},
|
|
|
+ getFullSelectedUsers() {
|
|
|
+ let userTree = this.dataTree[this.examObjectType];
|
|
|
+ const selectedUsersIds = this.selectedUsers.map((item) => item.id);
|
|
|
+ return userTree.filter((item) => selectedUsersIds.includes(item.id));
|
|
|
+ },
|
|
|
submit() {
|
|
|
if (!this.selectedUsers.length) {
|
|
|
this.$message.error("请选择考试对象");
|
|
|
return;
|
|
|
}
|
|
|
this.selectedExamObjectType = this.examObjectType;
|
|
|
- this.$emit("modified", this.selectedUsers);
|
|
|
+ const selectedUsers = this.showStudent
|
|
|
+ ? this.selectedUsers
|
|
|
+ : this.getFullSelectedUsers();
|
|
|
+
|
|
|
+ this.$emit("modified", {
|
|
|
+ selectedStudents: selectedUsers,
|
|
|
+ isSelectStudent: this.showStudent,
|
|
|
+ });
|
|
|
this.cancel();
|
|
|
},
|
|
|
},
|
