|
|
@@ -4,139 +4,32 @@
|
|
|
<el-dialog :visible.sync="InterestClaEditvisible" width="442px">
|
|
|
<template slot="title">
|
|
|
<div class="dia_title_box">
|
|
|
- <span>编辑兴趣班</span>
|
|
|
+ <span>{{ lang.ssInterestClass }}</span>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<div class="dia_box_item" v-loading="isLoading">
|
|
|
<div class="addcla_box_item">
|
|
|
- <span class="addcla_box_item_span">兴趣班名称:</span>
|
|
|
+ <span class="addcla_box_item_span">{{ lang.ssInterClaNameColon }}</span>
|
|
|
<el-input
|
|
|
v-model.trim="clainfo.name"
|
|
|
- placeholder="请输入兴趣班名称"
|
|
|
+ :placeholder="lang.ssEnterInterClaNm"
|
|
|
></el-input>
|
|
|
</div>
|
|
|
- <!-- <div class="addcla_box_item" style="position: relative">
|
|
|
- <span class="addcla_box_item_span">搜索学生:</span>
|
|
|
- <el-input
|
|
|
- v-model.trim="searchStuName"
|
|
|
- placeholder="请输入学生姓名,多个姓名请用中文逗号(,)分隔"
|
|
|
- slot="reference"
|
|
|
- @change="searchStu"
|
|
|
- @focus="popoverVisible = true"
|
|
|
- ></el-input>
|
|
|
-
|
|
|
- <div class="search_stu_box" v-if="popoverVisible" v-loading="editTabloading">
|
|
|
- <div class="search_stu_box_content">
|
|
|
- <el-tag
|
|
|
- v-for="item in searchStuData"
|
|
|
- :key="item.userid"
|
|
|
- closable
|
|
|
- :type="item.acc"
|
|
|
- @close="handleClose(item)"
|
|
|
- >
|
|
|
- <el-tooltip
|
|
|
- class="item"
|
|
|
- effect="dark"
|
|
|
- :content="item.acc"
|
|
|
- placement="top-start"
|
|
|
- >
|
|
|
- <span>{{ item.username }}</span>
|
|
|
- </el-tooltip>
|
|
|
- </el-tag>
|
|
|
- </div>
|
|
|
- <div class="search_stu_box_footer">
|
|
|
- <div>输入学生共{{ searchStuData.length }}人</div>
|
|
|
- <div>
|
|
|
- <el-button size="small" @click="selectNoneStu">取消</el-button>
|
|
|
- <el-button size="small" type="primary" @click="selectStu"
|
|
|
- >确定</el-button
|
|
|
- >
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="addcla_box_item">
|
|
|
- <span class="addcla_box_item_span">已选择:</span>
|
|
|
- <div class="selected_stu_box">
|
|
|
- <el-tag
|
|
|
- v-for="(item, index) in selectedStuData"
|
|
|
- :key="index"
|
|
|
- closable
|
|
|
- :type="item.acc"
|
|
|
- @close="handleSelectedStuClose(item)"
|
|
|
- >
|
|
|
- <span>{{ item.username }}</span>
|
|
|
- </el-tag>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- 选择学生(可以多选)
|
|
|
- </div>
|
|
|
- <el-table
|
|
|
- :data="interestClaAllStuData"
|
|
|
- ref="tableData"
|
|
|
- style="width: 100%"
|
|
|
- :header-cell-style="{ background: '#E7EAF0' }"
|
|
|
- height="300px"
|
|
|
- :show-header="false"
|
|
|
- class="tableList"
|
|
|
- @selection-change="handleInterestClaSelectionChange"
|
|
|
- >
|
|
|
- <el-table-column
|
|
|
- type="selection"
|
|
|
- :selectable="checkSelectable"
|
|
|
- width="55px"
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- v-for="(item, index) in studentColumns"
|
|
|
- :key="index"
|
|
|
- :label="item.label"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <div v-if="item.label == '账号'">
|
|
|
- <span>{{ scope.row.acc.split("@")[0] }}</span>
|
|
|
- </div>
|
|
|
- <div class="cla_box" v-else-if="item.label == '班级'">
|
|
|
- <span
|
|
|
- class="cla_span"
|
|
|
- v-for="(cla, ind) in scope.row.classname.split('/')"
|
|
|
- :key="ind + 'cla'"
|
|
|
- >
|
|
|
- {{ cla }}
|
|
|
- </span>
|
|
|
- </div>
|
|
|
- <div v-else>
|
|
|
- <span>{{ scope.row[item.prop] }}</span>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- <div class="page_box">
|
|
|
- <div>第{{ (page - 1) * pageSize + 1 }}~{{ page * pageSize }}条,共{{ total }}条</div>
|
|
|
- <el-pagination
|
|
|
- background
|
|
|
- @current-change="handlePageChange"
|
|
|
- :current-page.sync="page"
|
|
|
- :page-size="pageSize"
|
|
|
- layout="prev, pager, next"
|
|
|
- :total="total"
|
|
|
- >
|
|
|
- </el-pagination>
|
|
|
- </div> -->
|
|
|
</div>
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
- <el-button @click="cancelAllSelection">取消</el-button>
|
|
|
+ <el-button @click="cancelAllSelection">{{ lang.Cancel }}</el-button>
|
|
|
<el-button type="primary" @click="confirmInterestClaEdit"
|
|
|
- >确定</el-button
|
|
|
+ >{{ lang.Confirm }}</el-button
|
|
|
>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
+import { myMixin } from "@/mixins/mixin.js"
|
|
|
export default {
|
|
|
+ mixins: [ myMixin ],
|
|
|
name: "editInterstcla",
|
|
|
props: {
|
|
|
interestClaEditInfo: {
|
|
|
@@ -164,139 +57,29 @@ export default {
|
|
|
role: this.$route.query.role,
|
|
|
clainfo: {}, // 班级信息
|
|
|
studentColumns: [
|
|
|
- { label: "姓名", prop: "username" },
|
|
|
- { label: "账号", prop: "acc" },
|
|
|
- { label: "班级", prop: "classname" },
|
|
|
+ { label: this.lang.StudentName, prop: "username" },
|
|
|
+ { label: this.lang.Account, prop: "acc" },
|
|
|
+ { label: this.lang.Class, prop: "classname" },
|
|
|
],
|
|
|
- editTabloading: false, // 编辑表格加载中
|
|
|
- searchStuName: "", // 兴趣班编辑搜索学生姓名
|
|
|
- selectedStuData: [], // 兴趣班编辑已选择学生数据
|
|
|
- popoverVisible: false, // 兴趣班编辑搜索学生弹框显示
|
|
|
- searchStuData: [], // 兴趣班编辑搜索学生数据
|
|
|
InterestClaEditvisible: false, // 兴趣班编辑信息
|
|
|
- interestClaAllStuData: [], // 兴趣班编辑所有学生数据
|
|
|
isLoading: false, // 是否加载中
|
|
|
- page: 1,
|
|
|
- total: 0,
|
|
|
- pageSize: 10,
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
- // 判断行是否可选
|
|
|
- checkSelectable(row) {
|
|
|
- return row.classid.indexOf(this.clainfo.id) == -1; // 状态为disabled的行禁用选择
|
|
|
- },
|
|
|
- // 删除搜索学生标签
|
|
|
- handleClose(item) {
|
|
|
- this.searchStuData = this.searchStuData.filter(
|
|
|
- (e) => e.userid !== item.userid
|
|
|
- );
|
|
|
- },
|
|
|
- // 删除已选择学生
|
|
|
- handleSelectedStuClose(item) {
|
|
|
- // 从已选择数据中移除
|
|
|
- this.selectedStuData = this.selectedStuData.filter(
|
|
|
- (e) => e.userid !== item.userid
|
|
|
- );
|
|
|
- // 如果该学生在当前页的表格中,取消其选中状态
|
|
|
- this.$nextTick(() => {
|
|
|
- if (this.$refs.tableData) {
|
|
|
- const row = this.interestClaAllStuData.find(
|
|
|
- (row) => row.userid === item.userid
|
|
|
- );
|
|
|
- if (row) {
|
|
|
- this.$refs.tableData.toggleRowSelection(row, false);
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- // 关闭搜索学生弹框
|
|
|
- selectNoneStu() {
|
|
|
- this.popoverVisible = false;
|
|
|
- this.searchStuData = [];
|
|
|
- this.searchStuName = "";
|
|
|
- },
|
|
|
- // 确定添加搜索学生
|
|
|
- selectStu() {
|
|
|
- this.popoverVisible = false;
|
|
|
- // 获取已存在的 userid 集合,避免重复添加
|
|
|
- const existingIds = new Set(this.selectedStuData.map(item => item.userid));
|
|
|
- // 过滤掉重复的,只添加新的学生
|
|
|
- const newStuData = this.searchStuData.filter(item => !existingIds.has(item.userid));
|
|
|
- this.selectedStuData.push(...newStuData);
|
|
|
- this.handleSelectedStuData(this.selectedStuData);
|
|
|
-
|
|
|
- this.searchStuData = [];
|
|
|
- this.searchStuName = "";
|
|
|
+ // 取消编辑兴趣班
|
|
|
+ cancelAllSelection() {
|
|
|
+ this.InterestClaEditvisible = false;
|
|
|
},
|
|
|
- // 兴趣班搜索学生
|
|
|
- searchStu() {
|
|
|
- if (!this.searchStuName) {
|
|
|
+ // 编辑兴趣班确定
|
|
|
+ confirmInterestClaEdit() {
|
|
|
+ if (this.clainfo.name == "") {
|
|
|
this.$message({
|
|
|
- message: "请输入学生姓名",
|
|
|
+ message: this.lang.ssEnterInterClaNm,
|
|
|
type: "error",
|
|
|
});
|
|
|
return;
|
|
|
}
|
|
|
- this.editTabloading = true;
|
|
|
- // 处理输入:去除多余空格,确保逗号分隔格式正确
|
|
|
- let inpValue = this.searchStuName
|
|
|
- .split(",")
|
|
|
- .map((name) => name.trim())
|
|
|
- .filter((name) => name)
|
|
|
- .join(",");
|
|
|
- console.log('inpValue',inpValue);
|
|
|
-
|
|
|
- let params = {
|
|
|
- oid: this.oid,
|
|
|
- inp: inpValue,
|
|
|
- };
|
|
|
- this.ajax
|
|
|
- .get(this.$store.state.api + "selectchStu", params)
|
|
|
- .then((res) => {
|
|
|
- console.log(res.data[0], "res");
|
|
|
- let box = res.data[0].filter((item) => item.classid.indexOf(this.clainfo.id) == -1);
|
|
|
- this.searchStuData = box;
|
|
|
- this.editTabloading = false;
|
|
|
- })
|
|
|
- .catch((err) => {
|
|
|
- this.editTabloading = false;
|
|
|
- console.error(err);
|
|
|
- });
|
|
|
- // this.selectedStuData = console.log(this.searchStuName);
|
|
|
- },
|
|
|
- handleInterestClaSelectionChange(val) {
|
|
|
- // console.log("handleInterestClaSelectionChange", val);
|
|
|
- // 关键:selection-change 的 val 只包含“当前页”勾选项
|
|
|
- // 为了支持“跨页保留 + 当前页可取消”,需要:
|
|
|
- // 1) 先把 selectedStuData 中属于当前页的数据全部移除
|
|
|
- // 2) 再把 val(当前页实际选中的)合并回去
|
|
|
- const currentPageIds = new Set(
|
|
|
- (this.interestClaAllStuData || []).map((row) => row.userid)
|
|
|
- );
|
|
|
- const otherPageSelected = (this.selectedStuData || []).filter(
|
|
|
- (item) => !currentPageIds.has(item.userid)
|
|
|
- );
|
|
|
- this.selectedStuData = [...otherPageSelected, ...val];
|
|
|
- },
|
|
|
- handlePageChange(val) {
|
|
|
- // console.log("handlePageChange", val);
|
|
|
- this.page = val;
|
|
|
- this.getdata();
|
|
|
- },
|
|
|
- cancelAllSelection() {
|
|
|
- // this.$refs.tableData.clearSelection();
|
|
|
- // this.selectedStuData = [];
|
|
|
- // this.searchStuData = [];
|
|
|
- // this.searchStuName = "";
|
|
|
- // this.clainfo = {};
|
|
|
- this.InterestClaEditvisible = false;
|
|
|
- },
|
|
|
- handleSizeChange(val) {
|
|
|
- console.log("val", val);
|
|
|
- this.pageSize = val;
|
|
|
- this.page = 1;
|
|
|
- this.getdata();
|
|
|
+ this.confirmClaEdit();
|
|
|
},
|
|
|
// 修改班级名称确定
|
|
|
confirmClaEdit() {
|
|
|
@@ -310,23 +93,16 @@ export default {
|
|
|
.then((res) => {
|
|
|
if (res.data[0] && res.data[0][0].classname == 1) {
|
|
|
this.$message({
|
|
|
- message: "班级名称不能相同",
|
|
|
+ message: this.lang.Cannotsameothercla,
|
|
|
type: "error",
|
|
|
});
|
|
|
- if (this.selectedStuData.length > 0) {
|
|
|
- this.moveInterestClaStudent();
|
|
|
- }
|
|
|
+ this.addOp3('1', "", { type: "interest_class_edit" }, err)
|
|
|
} else {
|
|
|
this.$message({
|
|
|
- message: "修改成功",
|
|
|
+ message: this.lang.Editsuccessful,
|
|
|
type: "success",
|
|
|
});
|
|
|
- // if (this.selectedStuData.length > 0) {
|
|
|
- // this.moveInterestClaStudent();
|
|
|
- // } else {
|
|
|
- this.cancelAllSelection();
|
|
|
- this.$emit("getCascaderData");
|
|
|
- // }
|
|
|
+ this.addOp3('1', "", { type: "interest_class_edit" }, "success")
|
|
|
}
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
@@ -335,127 +111,9 @@ export default {
|
|
|
type: "error",
|
|
|
});
|
|
|
console.error(err);
|
|
|
+ this.addOp3('1', "", { type: "interest_class_edit" }, err)
|
|
|
});
|
|
|
},
|
|
|
- // 编辑兴趣班确定
|
|
|
- confirmInterestClaEdit() {
|
|
|
- if (this.clainfo.name == "") {
|
|
|
- this.$message({
|
|
|
- message: "请输入兴趣班名称",
|
|
|
- type: "error",
|
|
|
- });
|
|
|
- return;
|
|
|
- }
|
|
|
- this.confirmClaEdit();
|
|
|
- },
|
|
|
- // 移动学生到兴趣班
|
|
|
- moveInterestClaStudent() {
|
|
|
- const promises = this.selectedStuData.map((item) => {
|
|
|
- let box = [...item.classid.split(","), this.clainfo.id];
|
|
|
- box = box.filter((item) => item != "");
|
|
|
- return this.moveClassStudentPromise(item, box.join(","));
|
|
|
- });
|
|
|
- Promise.all(promises)
|
|
|
- .then(() => {
|
|
|
- this.$message({
|
|
|
- message: "添加成功",
|
|
|
- type: "success",
|
|
|
- });
|
|
|
- this.cancelAllSelection();
|
|
|
- this.$emit("getCascaderData");
|
|
|
- })
|
|
|
- .catch((err) => {
|
|
|
- console.error(err);
|
|
|
- this.$message({
|
|
|
- message: "添加失败",
|
|
|
- type: "error",
|
|
|
- });
|
|
|
- });
|
|
|
- },
|
|
|
- moveClassStudentPromise(item, cid) {
|
|
|
- return new Promise((resolve, reject) => {
|
|
|
- let params = [
|
|
|
- {
|
|
|
- userid: item.userid,
|
|
|
- username: item.acc,
|
|
|
- alias: item.username,
|
|
|
- ph: item.phonenumber,
|
|
|
- sid: item.studentid,
|
|
|
- cid: cid,
|
|
|
- },
|
|
|
- ];
|
|
|
- console.log(params);
|
|
|
-
|
|
|
- this.ajax
|
|
|
- .post(this.$store.state.api + "updateStudentInfo", params)
|
|
|
- .then((res) => {
|
|
|
- resolve(res);
|
|
|
- })
|
|
|
- .catch((err) => {
|
|
|
- console.error(err);
|
|
|
- reject(err);
|
|
|
- });
|
|
|
- });
|
|
|
- },
|
|
|
- // 学生管理全部学生
|
|
|
- getdata() {
|
|
|
- this.isLoading = true;
|
|
|
- let params = {
|
|
|
- oid: this.oid,
|
|
|
- cid: "",
|
|
|
- inp: "",
|
|
|
- page: this.page,
|
|
|
- num: this.pageSize,
|
|
|
- };
|
|
|
- this.ajax
|
|
|
- .get(this.$store.state.api + "selectStudentManage", params)
|
|
|
- .then((res) => {
|
|
|
- this.total = res.data[0].length > 0 ? res.data[0][0].num : 0;
|
|
|
- let box1 = res.data[0];
|
|
|
- box1.forEach((e) => {
|
|
|
- // let list = e.classname.split(",");
|
|
|
- let kk = [];
|
|
|
- this.cascaderData.forEach(item => {
|
|
|
- item.children.forEach(item2 => {
|
|
|
- if (e.classid && e.classid.indexOf(item2.id) != -1) {
|
|
|
- kk.push(item.name + item2.name);
|
|
|
- }else{
|
|
|
- }
|
|
|
- });
|
|
|
- });
|
|
|
- e.classname = kk.join("/");
|
|
|
- // if (e.classname && e.classname != "null") {
|
|
|
- // e.classname =
|
|
|
- // (e.gname !== null && e.gname !== undefined ? e.gname : "") +
|
|
|
- // e.classname;
|
|
|
- // } else {
|
|
|
- // e.classname = "-";
|
|
|
- // }
|
|
|
- });
|
|
|
- this.interestClaAllStuData = res.data[0];
|
|
|
- this.isLoading = false;
|
|
|
- // 恢复表格选中状态
|
|
|
- this.handleSelectedStuData(this.selectedStuData);
|
|
|
- })
|
|
|
- .catch((err) => {
|
|
|
- this.isLoading = false;
|
|
|
- console.error(err);
|
|
|
- });
|
|
|
- },
|
|
|
- // 恢复表格选中状态
|
|
|
- handleSelectedStuData(val) {
|
|
|
- console.log("handleSelectedStuData", val);
|
|
|
- this.$nextTick(() => {
|
|
|
- if (this.$refs.tableData && val.length > 0) {
|
|
|
- const selectedIds = new Set(val.map((item) => item.userid));
|
|
|
- this.interestClaAllStuData.forEach((row) => {
|
|
|
- if (selectedIds.has(row.userid)) {
|
|
|
- this.$refs.tableData.toggleRowSelection(row, true);
|
|
|
- }
|
|
|
- });
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
},
|
|
|
};
|
|
|
</script>
|