|
|
@@ -4,7 +4,12 @@
|
|
|
:before-close="handleClose2" class="dialog_diy">
|
|
|
<div v-if="dialogVisibleGroup">
|
|
|
<div class="g_d_btnBox">
|
|
|
- <div class="btn_left">
|
|
|
+ <div class="btn_left" v-if="type == 1">
|
|
|
+ <div @click="setClassid('1')" :class="{ active: classid == '1' }" v-if="!classList.length">全部</div>
|
|
|
+ <div @click="setClassid(item.id)" :class="{ active: classid == item.id }"
|
|
|
+ v-for="(item, index) in classList" :key="index">{{ item.name }}</div>
|
|
|
+ </div>
|
|
|
+ <div class="btn_left" v-if="type == 2">
|
|
|
<div @click="setClassid('1')" :class="{ active: classid == '1' }" v-if="!classList.length">全部</div>
|
|
|
<div @click="setClassid(item.id)" :class="{ active: classid == item.id }"
|
|
|
v-for="(item, index) in classList" :key="index">{{ item.name }}</div>
|
|
|
@@ -145,7 +150,9 @@
|
|
|
" v-else-if="groupStudentUid && groupStudentUid[g.id].indexOf(userid) != -1">
|
|
|
退出分组
|
|
|
</div>
|
|
|
- <div style="margin-top:10px" v-if="courseDetail.userid == userid && groupJson.islock == 2">
|
|
|
+ <div style="margin-top:10px"
|
|
|
+ v-if="courseDetail.userid == userid && groupJson.islock == 2 && groupStudent[g.id].length < groupJson.number"
|
|
|
+ @click="addGroupStudent(g.id)">
|
|
|
添加组员
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -319,12 +326,58 @@
|
|
|
<el-button type="primary" @click="updateChair">确定</el-button>
|
|
|
</span>
|
|
|
</el-dialog>
|
|
|
+ <el-dialog title="添加学生" :visible.sync="dialogVisibleMember" :append-to-body="true" width="500px" height="80%"
|
|
|
+ :before-close="handleClose" class="addNewPP">
|
|
|
+ <div class="people">
|
|
|
+ <div class="people_top">
|
|
|
+ <div class="people_top_right">
|
|
|
+ <div class="people_search">
|
|
|
+ <el-input placeholder="搜索学生的姓名" v-model="searchTN" @keyup.enter.native="getStudent"></el-input>
|
|
|
+ <div class="search_img" @click="getStudent">
|
|
|
+ <img src="../../assets/icon/search.png" alt />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="people_nav">选择成员</div>
|
|
|
+ </div>
|
|
|
+ <div class="t_j_box" style="
|
|
|
+ padding: 20px 0 0 25px;
|
|
|
+ width: calc(100% - 55px);
|
|
|
+ margin-left: 25px;
|
|
|
+ ">
|
|
|
+ <span>姓名</span>
|
|
|
+ <span>账号</span>
|
|
|
+ </div>
|
|
|
+ <el-checkbox-group v-model="checkboxList3" class="people_name" v-if="classJuri.length">
|
|
|
+ <el-checkbox v-for="item in classJuri" :key="item.userid" :label="item.userid">
|
|
|
+ <div class="t_j_box">
|
|
|
+ <el-tooltip placement="top" :content="item.name ? item.name : '暂无姓名'">
|
|
|
+ <span>{{ item.name ? item.name : "暂无姓名" }}</span>
|
|
|
+ </el-tooltip>
|
|
|
+ <el-tooltip placement="top" :content="item.username">
|
|
|
+ <span>{{ item.username }}</span>
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+ </el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ <div style="text-align: center; margin-top: 10px" v-else>暂无数据</div>
|
|
|
+ </div>
|
|
|
+ <div style="margin-top: 10px;">
|
|
|
+ <el-pagination background layout="prev, pager, next" :page-size="pageSize" :total="total"
|
|
|
+ v-if="page && classJuri.length" style="padding-bottom: 20px"
|
|
|
+ @current-change="handleCurrentChange"></el-pagination>
|
|
|
+ </div>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="dialogVisibleMember = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="joinGroup2">确定</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
export default {
|
|
|
- props: ['cid', 'dialogVisibleGroup', 'classList', 'courseDetail', 'userid'],
|
|
|
+ props: ['cid', 'dialogVisibleGroup', 'classList', 'courseDetail', 'userid',"type","classId"],
|
|
|
data() {
|
|
|
return {
|
|
|
groupJson2: {},
|
|
|
@@ -339,6 +392,7 @@ export default {
|
|
|
timer: null,
|
|
|
groupStudent: {},
|
|
|
groupStudentUid: {},
|
|
|
+ allGroupStudentUid: [],
|
|
|
dialogVisibleGroup2: false,
|
|
|
checkDeleteGroup: [],
|
|
|
deleteGroupUser: [],
|
|
|
@@ -348,6 +402,13 @@ export default {
|
|
|
updateGroupArray: [],
|
|
|
updateGroupUser: {},
|
|
|
dialogVisibleUpdateGroup: false,
|
|
|
+ classJuri: [],
|
|
|
+ checkboxList3: [],
|
|
|
+ pageSize: 20,
|
|
|
+ total: 0,
|
|
|
+ page: 1,
|
|
|
+ dialogVisibleMember: false,
|
|
|
+ searchTN: "",
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
@@ -358,6 +419,35 @@ export default {
|
|
|
handleClose(done) {
|
|
|
done();
|
|
|
},
|
|
|
+ getStudent() {
|
|
|
+ this.page = 1
|
|
|
+ this.selectCStudent();
|
|
|
+ },
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.page = val;
|
|
|
+ this.selectCStudent();
|
|
|
+ },
|
|
|
+ selectCStudent() {
|
|
|
+ let params = {
|
|
|
+ cid: this.classid,
|
|
|
+ cn: this.searchTN,
|
|
|
+ page: this.page,
|
|
|
+ num: this.pageSize
|
|
|
+ };
|
|
|
+ this.ajax
|
|
|
+ .get(this.$store.state.api + "selectSnameByCidPage", params)
|
|
|
+ .then((res) => {
|
|
|
+ this.total = res.data[0].length > 0 ? res.data[0][0].num : 0;
|
|
|
+ if (res.data && res.data[0].length) {
|
|
|
+ this.classJuri = res.data[0].filter((el) => {
|
|
|
+ return this.allGroupStudentUid.indexOf(el.userid) == -1
|
|
|
+ });
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
setClassid(cid) {
|
|
|
this.classid = cid
|
|
|
this.groupid = ''
|
|
|
@@ -419,7 +509,7 @@ export default {
|
|
|
}
|
|
|
for (var i = 0; i < this.groupJson2.group.length; i++) {
|
|
|
if (
|
|
|
- this.groupStudentUid[this.groupJson2.group[i].id].length >
|
|
|
+ this.groupStudentUid[this.groupJson2.group[i].id] && this.groupStudentUid[this.groupJson2.group[i].id].length >
|
|
|
this.groupJson2.number
|
|
|
) {
|
|
|
this.$message.error("已经有小组比你设置的人数多，请重新设置");
|
|
|
@@ -472,6 +562,10 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ this.allGroupStudentUid = []
|
|
|
+ for (var j = 0; j < groupPerson.length; j++) {
|
|
|
+ this.allGroupStudentUid.push(groupPerson[j].userid)
|
|
|
+ }
|
|
|
this.groupStudent = groupStudent
|
|
|
this.groupStudentUid = groupStudentUid
|
|
|
this.$forceUpdate();
|
|
|
@@ -606,6 +700,30 @@ export default {
|
|
|
console.error(err);
|
|
|
});
|
|
|
},
|
|
|
+ async joinGroup2() {
|
|
|
+ if (
|
|
|
+ this.groupStudent[this.gid].length + this.checkboxList3.length >
|
|
|
+ this.groupJson.number
|
|
|
+ ) {
|
|
|
+ this.$message.error("位置已满，无法加入");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ for (let i = 0; i < this.checkboxList3.length; i++) {
|
|
|
+ let params = [
|
|
|
+ {
|
|
|
+ gid: this.groupid,
|
|
|
+ g: this.gid,
|
|
|
+ uid: this.checkboxList3[i],
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ const res = await this.ajax.post(this.$store.state.api + "joinCourseGroup", params)
|
|
|
+ if (i == this.checkboxList3.length - 1) {
|
|
|
+ this.$message.success("加入成功");
|
|
|
+ this.dialogVisibleMember = false
|
|
|
+ this.getCourseGroup();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
exitGroup(id) {
|
|
|
if (this.groupJson.islock == 2) {
|
|
|
this.$message.error("位置已被锁定，无法退出");
|
|
|
@@ -627,11 +745,27 @@ export default {
|
|
|
console.error(err);
|
|
|
});
|
|
|
},
|
|
|
+ addGroupStudent(groupid) {
|
|
|
+ this.gid = groupid
|
|
|
+ this.page = 1
|
|
|
+ this.searchTN = ""
|
|
|
+ this.checkboxList3 = []
|
|
|
+ this.selectCStudent()
|
|
|
+ this.getCourseGroup();
|
|
|
+ this.dialogVisibleMember = true
|
|
|
+ }
|
|
|
},
|
|
|
watch: {
|
|
|
dialogVisibleGroup(newValue, oldValue) {
|
|
|
if (this.classList.length) {
|
|
|
- this.classid = this.classList[0].id
|
|
|
+ if(this.type == 2){
|
|
|
+ this.classList = this.classList.filter(el =>{
|
|
|
+ return this.classId.indexOf(el.id) != -1
|
|
|
+ })
|
|
|
+ this.classid = this.classList[0].id
|
|
|
+ }else{
|
|
|
+ this.classid = this.classList[0].id
|
|
|
+ }
|
|
|
} else {
|
|
|
this.classid = '1'
|
|
|
}
|
|
|
@@ -911,4 +1045,105 @@ export default {
|
|
|
border-radius: 5px;
|
|
|
font-size: 14px;
|
|
|
}
|
|
|
+
|
|
|
+.addNewPP>>>.el-dialog__body {
|
|
|
+ padding: 5px 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.people {
|
|
|
+ border: 1px solid rgb(229 229 229);
|
|
|
+ height: 495px;
|
|
|
+ border-radius: 5px;
|
|
|
+ width: 100%;
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.people_top {
|
|
|
+ display: flex;
|
|
|
+ width: 100%;
|
|
|
+ /* justify-content: space-between; */
|
|
|
+ /* align-items: center; */
|
|
|
+ flex-direction: column;
|
|
|
+ padding: 10px 25px 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.people_nav,
|
|
|
+.people_top_right {
|
|
|
+ /* padding: 20px 0 0 20px; */
|
|
|
+}
|
|
|
+
|
|
|
+.people_top_right {
|
|
|
+ height: 40px;
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.people_search {
|
|
|
+ display: flex;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.people_search>>>.el-input__inner {
|
|
|
+ /* height: 25px; */
|
|
|
+ width: 95%;
|
|
|
+}
|
|
|
+
|
|
|
+.search_img {
|
|
|
+ width: 20px;
|
|
|
+ height: 20px;
|
|
|
+ position: absolute;
|
|
|
+ right: 30px;
|
|
|
+ top: 50%;
|
|
|
+ transform: translateY(-50%);
|
|
|
+}
|
|
|
+
|
|
|
+.search_img>img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.people_name {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-start;
|
|
|
+ padding: 10px 0 0 25px;
|
|
|
+ flex-direction: column;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ height: calc(100% - 140px);
|
|
|
+ overflow-y: auto;
|
|
|
+ overflow-x: hidden;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+
|
|
|
+.people_name>>>.el-checkbox {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.people_name>>>.el-checkbox__label {
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ overflow: hidden;
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.t_j_box {
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
+.t_j_box span:nth-child(1) {
|
|
|
+ width: 50%;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-right: 10px;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+
|
|
|
+.t_j_box span:nth-child(2) {
|
|
|
+ width: 50%;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-right: 10px;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
</style>
|
