update

src/components/courseDetail.vue

@@ -39,7 +39,7 @@
                 <div class="jd">{{ chapInfo.length }}阶段</div>
                 <div class="jd">{{ rw }}任务</div>
               </div>
-              <div class="cType">
+              <div class="cType" v-if="courseType.length">
                 <div class="all_choose" v-for="(item, index) in courseType" :key="index">
                   <span style="color: #6c6c6c">{{ item + ":" }}</span>
                   <span class="type_children" v-for="(item2, index2) in courseTypeJson[item]" :key="index2">{{ item2
@@ -47,7 +47,7 @@
                 </div>
               </div>
               <div class="cType" style="font-size: 18px; color: #6c6c6c; align-items: flex-start">
-                <div style="min-width: 150px">
+                <div style="min-width: fit-content">
                   创建者：<span style="color: #000">{{
                     courseDetail.username
                   }}</span>
@@ -80,12 +80,15 @@
                 </div>
               </div>
               <div class="btnBox">
-                <div class="now_study" @click="dialogVisible = true">
+                <div class="now_study" @click="dialogVisible = true" v-if="tType != 2">
                   立即学习
                 </div>
               <div class="now_study" @click="dialogVisibleGroup = true">
                  {{courseDetail.userid != userid ? '加入分组' : '设置分组'}}
               </div>
+              <div class="now_group" v-if="groupInfo">
+                <span>所在分组：</span>{{ groupInfo.name }}
+              </div>
             </div>
             </div>
           </div>
@@ -539,7 +542,7 @@
             </div>
           </div>
         </el-dialog>
-        <Group :dialogVisibleGroup.sync="dialogVisibleGroup" :classList="classList" :cid="id" :courseDetail="courseDetail" :userid="userid" :type="tType" :classId="classId"></Group>
+        <Group :dialogVisibleGroup.sync="dialogVisibleGroup" :classList="classList" :cid="id" :courseDetail="courseDetail" :userid="userid" :oid="oid" :type="tType" :classId="classId" @getGroup="getGroup"></Group>
       </div>
     </div>
   </div>
@@ -578,7 +581,8 @@ export default {
       rw: 0,
       chaptersJson: {},
       type: 2,
-      inviteCode: []
+      inviteCode: [],
+      groupInfo:""
     };
   },
   methods: {
@@ -736,6 +740,7 @@ export default {
       // this.total = res.data[0].length > 0 ? res.data[0][0].num : 0;
       this.courseDetail = res.data[0][0];
       this.classList = res.data[3];
+      let groupData = res.data[5];
       var a = res.data[0];
       var b = res.data[1];
       var c = res.data[2];
@@ -753,6 +758,7 @@ export default {
           }
         }
       }
+      this.Tname = []
       for (var k = 0; k < c.length; k++) {
         this.Tname.push(c[k].name);
       }
@@ -788,6 +794,23 @@ export default {
         console.log(this.inviteCode);
         this.addInviteCode();
       }
+      this.groupInfo = ''
+      if(groupData.length){
+        gp:for(var g = 0;g < groupData.length;g++){
+          if(groupData[g].userid == this.userid){
+            let gid = groupData[g].groupCid
+            let groupA = JSON.parse(groupData[g].group).group
+            for(var gA = 0;gA <groupA.length;gA++){
+              if(groupA[gA].id == gid){
+                this.groupInfo = {
+                  name:groupA[gA].name
+                }
+                break gp;
+              }
+            }
+          }
+        }
+      }
       // debugger
     },
     addInviteCode() {
@@ -968,6 +991,9 @@ export default {
           console.error(err);
         });
     },
+    getGroup(){
+      this.getCourseDetail1();
+    },
     getUser() {
       let params = { uid: this.userid };
       this.ajax
@@ -1155,6 +1181,7 @@ export default {
 }
 .btnBox{
   display: flex;
+  margin-top: 20px;
 }
 
 .now_study {
@@ -1167,11 +1194,20 @@ export default {
   border-radius: 5px;
   font-size: 13px;
   cursor: pointer;
-  margin-top: 30px;
 }
 .now_study + .now_study{
   margin-left: 10px;
 }
+
+.now_group{
+  height: 35px;
+  font-size: 14px;
+  line-height: 35px;
+  margin-left: 32px;
+}
+.now_group > span:nth-child(1){
+  color: rgb(108, 108, 108);
+}
 .choose_who {
   display: flex;
   margin: 15px 0 0 25px;

src/components/group/group.vue

@@ -18,13 +18,18 @@
                         <div style="color: rgb(171 171 171); margin: 0 10px 0 0">
                             提示：需要锁定位置，才能点击头像修改座位。
                         </div>
-                        <div type="primary" v-if="groupJson.islock == 1 && groupJson.group.length" class="returnBtn"
+                        <!-- 开放选座 -->
+                        <!-- <div type="primary" v-if="groupJson.islock == 1 && groupJson.group.length" class="returnBtn"
                             style="background-color: #225bc7" @click="lockChair">
                             锁定位置
                         </div>
                         <div type="primary" v-else-if="groupJson.group.length" class="returnBtn"
                             style="background-color: #225bc7" @click="lockChair">
                             解锁位置
+                        </div> -->
+                        <div class="group_switch">
+                            <span>开放选座</span>
+                            <el-switch v-model="islock" active-text="" class="switchCss" @change="lockChair"></el-switch>
                         </div>
                         <div type="primary" @click="updateGroup" class="returnBtn" style="background-color: #225bc7">
                             分组设置
@@ -151,7 +156,7 @@
                                             退出分组
                                         </div>
                                         <div style="margin-top:10px"
-                                            v-if="courseDetail.userid == userid && groupJson.islock == 2 && groupStudent[g.id].length < groupJson.number"
+                                            v-if="courseDetail.userid == userid && groupStudent[g.id].length < groupJson.number"
                                             @click="addGroupStudent(g.id)">
                                             添加组员
                                         </div>
@@ -326,7 +331,7 @@
                 <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%"
+        <el-dialog title="添加学生" :visible.sync="dialogVisibleMember" :append-to-body="true" width="540px" height="80%"
             :before-close="handleClose" class="addNewPP">
             <div class="people">
                 <div class="people_top">
@@ -340,15 +345,15 @@
                     </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;
-                      ">
+                <!-- <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">
+                </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 : '暂无姓名'">
@@ -359,14 +364,21 @@
                             </el-tooltip>
                         </div>
                     </el-checkbox>
-                </el-checkbox-group>
+                </el-checkbox-group> -->
+                <div class="i_box_login2" v-if="classJuri.length">
+                    <div :class="{active:checkboxList3.indexOf(item.userid)!= -1}" v-for="item in classJuri" :key="item.userid" :label="item.userid" @click="addGroupUser(item.userid)">
+                        <el-tooltip placement="top" :content="item.name ? item.name : '暂无姓名'">
+                            <span>{{ item.name ? item.name : "暂无姓名" }}</span>
+                        </el-tooltip>
+                    </div>
+                </div>
                 <div style="text-align: center; margin-top: 10px" v-else>暂无数据</div>
             </div>
-            <div style="margin-top: 10px;">
+            <!-- <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>
+            </div> -->
             <span slot="footer" class="dialog-footer">
                 <el-button @click="dialogVisibleMember = false">取 消</el-button>
                 <el-button type="primary" @click="joinGroup2">确定</el-button>
@@ -377,7 +389,7 @@
 
 <script>
 export default {
-    props: ['cid', 'dialogVisibleGroup', 'classList', 'courseDetail', 'userid',"type","classId"],
+    props: ['cid', 'dialogVisibleGroup', 'classList', 'courseDetail', 'userid', "type", "classId", "oid"],
     data() {
         return {
             groupJson2: {},
@@ -389,6 +401,7 @@ export default {
                 number: undefined,
                 islock: 1,
             },
+            islock:false,
             timer: null,
             groupStudent: {},
             groupStudentUid: {},
@@ -430,14 +443,12 @@ export default {
         selectCStudent() {
             let params = {
                 cid: this.classid,
+                oid: this.oid,
                 cn: this.searchTN,
-                page: this.page,
-                num: this.pageSize
             };
             this.ajax
-                .get(this.$store.state.api + "selectSnameByCidPage", params)
+                .get(this.$store.state.api + "selectSnameByCidGroup", 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
@@ -456,6 +467,7 @@ export default {
                 number: undefined,
                 islock: 1,
             }
+            this.islock = false
             this.getCourseGroup();
         },
         guid() {
@@ -547,6 +559,7 @@ export default {
                 .then((res) => {
                     if (res.data && res.data[0].length) {
                         this.groupJson = JSON.parse(res.data[0][0].group);
+                        this.islock = this.groupJson.islock == 1 ? true : false;
                         this.groupid = res.data[0][0].id;
                         let groupPerson = res.data[1]
                         let group = JSON.parse(res.data[0][0].group).group
@@ -693,6 +706,7 @@ export default {
                 .post(this.$store.state.api + "joinCourseGroup", params)
                 .then((res) => {
                     this.$message.success("加入成功");
+                    this.$emit('getGroup')
                     this.getCourseGroup();
                 })
                 .catch((err) => {
@@ -700,6 +714,13 @@ export default {
                     console.error(err);
                 });
         },
+        addGroupUser(uid){
+            if(this.checkboxList3.indexOf(uid) == -1){
+                this.checkboxList3.push(uid)
+            }else{
+                this.checkboxList3.splice(this.checkboxList3.indexOf(uid),1)
+            }
+        },
         async joinGroup2() {
             if (
                 this.groupStudent[this.gid].length + this.checkboxList3.length >
@@ -738,6 +759,7 @@ export default {
                 .post(this.$store.state.api + "exitCourseGroup", params)
                 .then((res) => {
                     this.$message.success("退出成功");
+                    this.$emit('getGroup')
                     this.getCourseGroup();
                 })
                 .catch((err) => {
@@ -758,12 +780,12 @@ export default {
     watch: {
         dialogVisibleGroup(newValue, oldValue) {
             if (this.classList.length) {
-                if(this.type == 2){
-                    this.classList = this.classList.filter(el =>{
+                if (this.type == 2) {
+                    this.classList = this.classList.filter(el => {
                         return this.classId.indexOf(el.id) != -1
                     })
                     this.classid = this.classList[0].id
-                }else{
+                } else {
                     this.classid = this.classList[0].id
                 }
             } else {
@@ -1085,14 +1107,14 @@ export default {
 
 .people_search>>>.el-input__inner {
     /* height: 25px; */
-    width: 95%;
+    width: 100%;
 }
 
 .search_img {
     width: 20px;
     height: 20px;
     position: absolute;
-    right: 30px;
+    right: 10px;
     top: 50%;
     transform: translateY(-50%);
 }
@@ -1146,4 +1168,54 @@ export default {
     text-overflow: ellipsis;
     white-space: nowrap;
 }
+
+.i_box_login2 {
+    height: calc(100% - 80px);
+    width: 100%;
+    display: flex;
+    flex-wrap: wrap;
+    overflow: auto;
+    padding-bottom: 10px;
+    box-sizing: border-box;
+    align-content: flex-start;
+    padding: 10px 25px 0;
+}
+
+.i_box_login2>div {
+    cursor: pointer;
+    width: 80px;
+    text-align: center;
+    height: 30px;
+    line-height: 30px;
+    padding: 0 5px;
+    overflow: hidden;
+    background: rgb(225, 237, 255);
+    margin: 10px calc((100% - (80px*5)) / 4 ) 0 0 ;
+    color: rgb(37 124 255);
+    border-radius: 5px;
+    box-sizing: border-box;
+}
+.i_box_login2>div:nth-child(5n) {
+    margin: 10px 0 0 0 ;
+}
+.i_box_login2 > .active{
+    background: rgb(92, 157, 255);
+    color: #fff;
+}
+.i_box_login2>div>span {
+    width: 100%;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+}
+
+.group_switch{
+    margin-right: 10px;
+    height: 30px;
+    display: flex;
+    align-items: center;
+}
+.group_switch>span{
+    margin-right: 5px;
+}
 </style>

src/components/studyStudent.vue

@@ -4809,12 +4809,16 @@
           <div style="color: rgb(171 171 171); margin: 0 10px 0 0">
             提示：需要锁定位置，才能点击头像修改座位。
           </div>
-          <div type="primary" v-if="groupJson.islock == 1" class="returnBtn" style="background-color: #225bc7"
+          <!-- <div type="primary" v-if="groupJson.islock == 1" class="returnBtn" style="background-color: #225bc7"
             @click="lockChair">
             锁定位置
           </div>
           <div type="primary" v-else class="returnBtn" style="background-color: #225bc7" @click="lockChair">
             解锁位置
+          </div> -->
+          <div class="group_switch">
+              <span>开放选座</span>
+              <el-switch v-model="islock" active-text="" class="switchCss" @change="lockChair"></el-switch>
           </div>
           <div type="primary" @click="updateGroup" class="returnBtn" style="background-color: #225bc7">
             分组设置
@@ -5581,6 +5585,7 @@ export default {
       videoStart: false,
       recorder: null,
       groupJson: {},
+      islock: false,
       groupJson2: {},
       dialogVisibleGroup: false,
       dialogVisibleGroup2: false,
@@ -10006,7 +10011,7 @@ export default {
           this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
             index
           ].toolChoose[i].groupJson;
-
+        this.islock = this.groupJson.islock == 1 ? true : false;
         this.dialogVisibleGroup = true;
       }
     },
@@ -10552,6 +10557,7 @@ export default {
         }
       }
       this.groupJson = JSON.parse(JSON.stringify(this.groupJson2));
+      this.islock = this.groupJson.islock == 1 ? true : false;
       this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
         this.taskCount
       ].toolChoose[this.toolindex].groupJson = this.groupJson;
@@ -14150,4 +14156,14 @@ ol {
 .isAllWidth {
   width: 100% !important;
 }
+
+.group_switch{
+    margin-right: 10px;
+    height: 30px;
+    display: flex;
+    align-items: center;
+}
+.group_switch>span{
+    margin-right: 5px;
+}
 </style>