提交群聊修改

1

src/views/groupChatManager/model/addChatForm.vue

@@ -10,9 +10,9 @@
         <el-form-item
           label="群聊名称"
           :rules="[{ required: true, message: '请输入群聊名称' }]"
-          prop="name"
+          prop="groupName"
         >
-          <el-input class="w100" v-model="formes.name"></el-input>
+          <el-input class="w100" v-model="formes.groupName"></el-input>
         </el-form-item>
         <el-form-item
           label="群聊类型"
@@ -71,8 +71,9 @@ export default {
     return {
       formes: {
         id: "",
-        name: "",
+        groupName: "",
         groupType: "",
+        type:""
       },
       catgGoupTypeList,
       catTypeList,

src/views/liveClassManager/modals/addGroupmsg.vue

@@ -0,0 +1,254 @@
+<template>
+  <div>
+    <el-dialog
+      width="1000px"
+      title="添加群组"
+      :visible.sync="lookVisible"
+      :before-close="onClose"
+      append-to-body
+    >
+      <div>
+        <el-form :inline="true" :model="searchForm">
+          <el-form-item>
+            <el-input
+              v-model.trim="searchForm.search"
+              clearable
+              @keyup.enter.native="search"
+              placeholder="群组名称"
+            ></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button @click="search" type="primary">搜索</el-button>
+            <el-button @click="onReSet" type="danger">重置</el-button>
+          </el-form-item>
+        </el-form>
+        <div class="tableWrap">
+          <el-table
+            style="width: 100%"
+            :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
+            :data="tableList"
+            @selection-change="handleSelectionChange"
+            @select="onTableSelect"
+            ref="multipleSelection"
+          >
+            <el-table-column type="selection" width="55"> </el-table-column>
+            <el-table-column
+              align="center"
+              prop="id"
+              label="群组"
+            ></el-table-column>
+            <el-table-column
+              align="center"
+              prop="name"
+              label="群组名称"
+            ></el-table-column>
+            <el-table-column
+              align="center"
+              prop="memberNum"
+              label="人数"
+            ></el-table-column>
+          </el-table>
+          <pagination
+            sync
+            :total.sync="rules.total"
+            :page.sync="rules.page"
+            :limit.sync="rules.limit"
+            :page-sizes="rules.page_size"
+            @pagination="getList"
+          />
+        </div>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submit">确 定</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+<script>
+import { getGroupList,getSysGroupList, addGroupMessageList } from "../api";
+import pagination from "@/components/Pagination/index";
+export default {
+  name: "catGroupAddGroupmsg",
+  components: { pagination },
+  data() {
+    return {
+      searchForm: {
+        search: "",
+      },
+      tableList: [],
+      organList: [],
+      rules: {
+        // 分页规则
+        limit: 10, // 限制显示条数
+        page: 1, // 当前页
+        total: 0, // 总条数
+        page_size: [10, 20, 40, 50], // 选择限制显示条数
+      },
+      addMuiscVisible: false,
+      multipleSelection: [],
+      chioseIdList: [],
+      isNewPage: false,
+      lookVisible: false,
+      activeRow: { sendFlag: false },
+      type: "",
+    };
+  },
+
+  mounted() {},
+  methods: {
+    async getList() {
+      try {
+        if (this.type) {
+          const res = await getSysGroupList({
+            ...this.searchForm,
+            page: this.rules.page,
+            rows: this.rules.limit,
+            imSendGroupMessageId: this.activeRow.id,
+          });
+          this.tableList = res.data.rows;
+          this.rules.total = res.data.total;
+          let idList = this.chioseIdList.map((group) => {
+            return group.id;
+          });
+          this.isNewPage = true;
+          this.$nextTick(() => {
+            this.tableList.forEach((course) => {
+              if (idList.indexOf(course.id) != -1) {
+                this.$refs.multipleSelection.toggleRowSelection(course, true);
+              }
+            });
+            this.isNewPage = false;
+          });
+        } else {
+          const res = await getGroupList({
+            ...this.searchForm,
+            page: this.rules.page,
+            rows: this.rules.limit,
+            imSendGroupMessageId: this.activeRow.id,
+          });
+          this.tableList = res.data.rows;
+          this.rules.total = res.data.total;
+          let idList = this.chioseIdList.map((group) => {
+            return group.id;
+          });
+          this.isNewPage = true;
+          this.$nextTick(() => {
+            this.tableList.forEach((course) => {
+              if (idList.indexOf(course.id) != -1) {
+                this.$refs.multipleSelection.toggleRowSelection(course, true);
+              }
+            });
+            this.isNewPage = false;
+          });
+        }
+      } catch (e) {
+        console.log(e);
+      }
+    },
+    search() {
+      this.rules.page = 1;
+      this.getList();
+    },
+    onReSet() {
+      this.searchForm.search = "";
+      this.clearCom();
+      this.search();
+    },
+    async submit() {
+      console.log("添加");
+      if (!this.chioseIdList || this.chioseIdList.length <= 0) {
+        this.$message.error("请至少选择一个群组");
+        return;
+      }
+      try {
+        let idList = this.chioseIdList
+          .map((group) => {
+            return group.id;
+          })
+          .join(",");
+        const res = await addGroupMessageList({
+          groupIds: idList,
+          imSendGroupMessageId: this.activeRow.id,
+        });
+        this.$message.success("添加成功");
+        this.$emit("getList");
+        this.onClose();
+      } catch (e) {
+        console.log(e);
+      }
+
+      // 开始  addGroupMessageList
+      /**
+       *
+
+       */
+      console.log(this.chioseIdList);
+    },
+    handleSelectionChange(val) {
+      if (val.length > 0) {
+        this.chioseIdList = this.chioseIdList.concat(val);
+        this.chioseIdList = this.$helpers.lodash.uniqBy(
+          this.chioseIdList,
+          "id"
+        );
+      } else {
+        if (this.isNewPage) return;
+        let idList = this.chioseIdList.map((group) => {
+          return group.id;
+        });
+        this.$nextTick(() => {
+          let tableIdList = [];
+          this.tableList.forEach((group) => {
+            tableIdList.push(group.id);
+            if (idList.indexOf(group.id) != -1) {
+              this.$refs.multipleSelection.toggleRowSelection(group, false);
+            }
+          });
+          this.chioseIdList = this.$helpers.lodash.remove(
+            this.chioseIdList,
+            function (item) {
+              return tableIdList.indexOf(item.id) == -1;
+            }
+          );
+          if (this.chioseIdList.length <= 0) {
+            this.clearCom();
+          }
+        });
+      }
+    },
+    clearCom() {
+      this.chioseIdList = [];
+      this.$refs.multipleSelection.clearSelection();
+    },
+    onTableSelect(rows, row) {
+      let idList = this.chioseIdList.map((group) => {
+        return group.id;
+      });
+      if (idList.indexOf(row.id) != -1) {
+        this.chioseIdList.splice(idList.indexOf(row.id), 1);
+        if (this.chioseIdList.length <= 0) {
+          this.clearCom();
+        }
+      }
+    },
+    onClose() {
+      this.clearCom();
+      this.lookVisible = false;
+    },
+    openDioag(row, type) {
+      this.activeRow = row;
+      this.type = type;
+      this.lookVisible = true;
+      this.getList();
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.w100 {
+  width: 100%;
+}
+.btnWrap {
+  justify-content: flex-start;
+}
+</style>

src/views/liveClassManager/modals/addStudentList.vue

@@ -1,6 +1,7 @@
 <template>
-  <div class="m-container">
-    <div class="m-core">
+  <div class="">
+    <!-- m-core -->
+    <div class="">
       <el-form :inline="true" :model="searchForm">
         <el-form-item>
           <el-input
@@ -130,18 +131,18 @@
         />
       </div>
     </div>
-    <!-- <setBlack @getList="getList" ref="setBlack" /> -->
+    <addStudentModel @getList="getList" ref="setBlack" />
   </div>
 </template>
 <script>
 import { addLiveGoodsMapper, getBlackList, deteleBlackList } from "../api";
 import { getLiveGoodsMapperList } from "@/views/liveShopManger/api";
 import pagination from "@/components/Pagination/index";
-// import setBlack from "./modals/setBlack";
+import addStudentModel from "./addStudentModel";
 export default {
   name: "liveAddStudentList",
-  // setBlack
-  components: { pagination, },
+  //
+  components: { pagination, addStudentModel},
   data() {
     return {
       searchForm: {

src/views/liveClassManager/modals/addStudentModel.vue

@@ -0,0 +1,227 @@
+<template>
+  <div>
+    <el-dialog
+      width="1000px"
+      title="添加学员"
+      :visible.sync="lookVisible"
+      :before-close="onClose"
+      append-to-body
+    >
+      <div>
+        <el-form :inline="true" :model="searchForm">
+          <el-form-item>
+            <el-input
+              v-model.trim="searchForm.search"
+              clearable
+              @keyup.enter.native="search"
+              placeholder="学员姓名/编号/手机号"
+            ></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button @click="search" type="primary">搜索</el-button>
+            <el-button @click="onReSet" type="danger">重置</el-button>
+          </el-form-item>
+        </el-form>
+        <div class="tableWrap">
+          <el-table
+            style="width: 100%"
+            :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
+            :data="tableList"
+            @selection-change="handleSelectionChange"
+            @select="onTableSelect"
+            ref="multipleSelection"
+          >
+            <el-table-column type="selection" width="55"> </el-table-column>
+            <el-table-column
+              align="center"
+              prop="id"
+              label="学员编号"
+            ></el-table-column>
+            <el-table-column
+              align="center"
+              prop="username"
+              label="学员姓名"
+            ></el-table-column>
+            <el-table-column align="center" prop="phone" label="手机号">
+            </el-table-column>
+          </el-table>
+          <pagination
+            sync
+            :total.sync="rules.total"
+            :page.sync="rules.page"
+            :limit.sync="rules.limit"
+            :page-sizes="rules.page_size"
+            @pagination="getList"
+          />
+        </div>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submit">确 定</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+<script>
+import { addBlackList, getWaitBlackList } from "../api";
+import { getLiveGoodsMapperList } from "@/views/liveShopManger/api";
+import pagination from "@/components/Pagination/index";
+export default {
+  name: "eidtPostMsg",
+  components: { pagination },
+  data() {
+    return {
+      searchForm: {
+        search: "",
+      },
+      tableList: [],
+      organList: [],
+      rules: {
+        // 分页规则
+        limit: 10, // 限制显示条数
+        page: 1, // 当前页
+        total: 0, // 总条数
+        page_size: [10, 20, 40, 50], // 选择限制显示条数
+      },
+      addMuiscVisible: false,
+      multipleSelection: [],
+      chioseIdList: [],
+      isNewPage: false,
+      lookVisible: false,
+      activeRow: { sendFlag: false },
+    };
+  },
+
+  mounted() {},
+  methods: {
+    async getList() {
+      try {
+        const res = await getWaitBlackList({
+          ...this.searchForm,
+          page: this.rules.page,
+          rows: this.rules.limit,
+          roomUid: this.activeRow.roomUid,
+        });
+        this.tableList = res.data.rows;
+        this.rules.total = res.data.total;
+        let idList = this.chioseIdList.map((group) => {
+          return group.id;
+        });
+        this.isNewPage = true;
+        this.$nextTick(() => {
+          this.tableList.forEach((course) => {
+            if (idList.indexOf(course.id) != -1) {
+              this.$refs.multipleSelection.toggleRowSelection(course, true);
+            }
+          });
+          this.isNewPage = false;
+        });
+      } catch (e) {
+        console.log(e);
+      }
+    },
+    search() {
+      this.rules.page = 1;
+      this.getList();
+    },
+    onReSet() {
+      this.searchForm.search = "";
+      this.clearCom();
+      this.search();
+    },
+    async submit() {
+      if (!this.chioseIdList || this.chioseIdList.length <= 0) {
+        this.$message.error("请至少选择一名学生");
+        return;
+      }
+      try {
+        let idList = this.chioseIdList
+          .map((group) => {
+            return group.id;
+          })
+          .join(",");
+        const res = await addBlackList({
+          userIdList: idList,
+          roomUid: this.activeRow.roomUid,
+        });
+        this.$message.success("添加成功");
+        this.$emit("getList");
+        this.onClose();
+      } catch (e) {
+        console.log(e);
+      }
+
+      // 开始  addGroupMessageList
+      /**
+       *
+
+       */
+      console.log(this.chioseIdList);
+    },
+    handleSelectionChange(val) {
+      if (val.length > 0) {
+        this.chioseIdList = this.chioseIdList.concat(val);
+        this.chioseIdList = this.$helpers.lodash.uniqBy(
+          this.chioseIdList,
+          "id"
+        );
+      } else {
+        if (this.isNewPage) return;
+        let idList = this.chioseIdList.map((group) => {
+          return group.id;
+        });
+        this.$nextTick(() => {
+          let tableIdList = [];
+          this.tableList.forEach((group) => {
+            tableIdList.push(group.id);
+            if (idList.indexOf(group.id) != -1) {
+              this.$refs.multipleSelection.toggleRowSelection(group, false);
+            }
+          });
+          this.chioseIdList = this.$helpers.lodash.remove(
+            this.chioseIdList,
+            function (item) {
+              return tableIdList.indexOf(item.id) == -1;
+            }
+          );
+          if (this.chioseIdList.length <= 0) {
+            this.clearCom();
+          }
+        });
+      }
+    },
+    clearCom() {
+      this.chioseIdList = [];
+      this.$refs.multipleSelection.clearSelection();
+    },
+    onTableSelect(rows, row) {
+      let idList = this.chioseIdList.map((group) => {
+        return group.id;
+      });
+      if (idList.indexOf(row.id) != -1) {
+        this.chioseIdList.splice(idList.indexOf(row.id), 1);
+        if (this.chioseIdList.length <= 0) {
+          this.clearCom();
+        }
+      }
+    },
+    onClose() {
+      this.clearCom();
+      this.searchForm.search = ''
+      this.lookVisible = false;
+    },
+    openDioag(row) {
+      this.activeRow = row;
+      this.lookVisible = true;
+      this.getList();
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.w100 {
+  width: 100%;
+}
+.btnWrap {
+  justify-content: flex-start;
+}
+</style>

src/views/liveClassManager/modals/catGroup.vue

@@ -0,0 +1,310 @@
+<template>
+  <div>
+    <div>
+      <el-form :inline="true" :model="searchForm">
+        <el-form-item>
+          <el-input
+            v-model.trim="searchForm.search"
+            clearable
+            @keyup.enter.native="search"
+            placeholder="群组名称"
+          ></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="search" type="primary">搜索</el-button>
+          <el-button @click="onReSet" type="danger">重置</el-button>
+        </el-form-item>
+      </el-form>
+      <div
+        class="btnWrap"
+        v-if="!activeRow.sendFlag"
+        style="margin-bottom: 20px"
+      >
+        <auth auths="imSendGroupMessage/addGroupList">
+          <el-button type="primary" @click="addMsg" style="margin-bottom: 20px">
+            添加
+          </el-button>
+        </auth>
+        <auth auths="imSendGroupMessage/deleteGroupList">
+          <el-button type="danger" @click="deleteGroups"> 删除 </el-button>
+        </auth>
+      </div>
+
+      <div class="tableWrap">
+        <el-table
+          style="width: 100%"
+          :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
+          :data="tableList"
+          @selection-change="handleSelectionChange"
+          @select="onTableSelect"
+          ref="multipleSelection"
+        >
+          <el-table-column type="selection" width="55"> </el-table-column>
+          <el-table-column
+            align="center"
+            prop="id"
+            label="群组"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="name"
+            label="群组名称"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="memberNum"
+            label="人数"
+          ></el-table-column>
+          <el-table-column align="center" prop="id" label="操作">
+            <template slot-scope="scope">
+              <div>
+                <auth
+                  auths="imSendGroupMessage/deleteGroupList"
+                  v-if="!activeRow.sendFlag"
+                >
+                  <el-button type="text" @click="deleteGroup(scope.row)"
+                    >删除</el-button
+                  >
+                </auth>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination
+          sync
+          :total.sync="rules.total"
+          :page.sync="rules.page"
+          :limit.sync="rules.limit"
+          :page-sizes="rules.page_size"
+          @pagination="getList"
+        />
+      </div>
+      <addGroupmsg ref="addGroupmsg" @clear="clearCom" @getList="getList" />
+    </div>
+  </div>
+</template>
+<script>
+import {
+  getGroupList1,
+  getSysGroupList1,
+  deteleGroupMessageList,
+} from "../api";
+import pagination from "@/components/Pagination/index";
+import addGroupmsg from "./addGroupmsg";
+export default {
+  name: "eidtPostMsg",
+  components: { pagination, addGroupmsg },
+  data() {
+    return {
+      searchForm: {
+        search: "",
+      },
+      tableList: [],
+      organList: [],
+      rules: {
+        // 分页规则
+        limit: 10, // 限制显示条数
+        page: 1, // 当前页
+        total: 0, // 总条数
+        page_size: [10, 20, 40, 50], // 选择限制显示条数
+      },
+      addMuiscVisible: false,
+      multipleSelection: [],
+      chioseIdList: [],
+      isNewPage: false,
+      lookVisible: false,
+      activeRow: { sendFlag: false },
+      type: "",
+    };
+  },
+
+  mounted() {
+     this.getList();
+  },
+  methods: {
+    async getList() {
+      // try {
+      //   if (this.type) {
+      //     const res = await getSysGroupList1({
+      //       ...this.searchForm,
+      //       page: this.rules.page,
+      //       rows: this.rules.limit,
+      //       imSendGroupMessageId: this.activeRow.id,
+      //     });
+      //     this.tableList = res.data.rows;
+      //     this.rules.total = res.data.total;
+      //     let idList = this.chioseIdList.map((group) => {
+      //       return group.id;
+      //     });
+      //     this.isNewPage = true;
+      //     this.$nextTick(() => {
+      //       this.tableList.forEach((course) => {
+      //         if (idList.indexOf(course.id) != -1) {
+      //           this.$refs.multipleSelection.toggleRowSelection(course, true);
+      //         }
+      //       });
+      //       this.isNewPage = false;
+      //     });
+      //   } else {
+      //     const res = await getGroupList1({
+      //       ...this.searchForm,
+      //       page: this.rules.page,
+      //       rows: this.rules.limit,
+      //       imSendGroupMessageId: this.activeRow.id,
+      //     });
+      //     this.tableList = res.data.rows;
+      //     this.rules.total = res.data.total;
+      //     let idList = this.chioseIdList.map((group) => {
+      //       return group.id;
+      //     });
+      //     this.isNewPage = true;
+      //     this.$nextTick(() => {
+      //       this.tableList.forEach((course) => {
+      //         if (idList.indexOf(course.id) != -1) {
+      //           this.$refs.multipleSelection.toggleRowSelection(course, true);
+      //         }
+      //       });
+      //       this.isNewPage = false;
+      //     });
+      //   }
+      // } catch (e) {
+      //   console.log(e);
+      // }
+    },
+    search() {
+      this.rules.page = 1;
+      this.getList();
+    },
+    onReSet() {
+      this.searchForm.search = "";
+      this.clearCom();
+      this.search();
+    },
+    addMsg() {
+      // if (!this.chioseIdList || this.chioseIdList.length <= 0) {
+      //   this.$message.error("请至少选择一个群组");
+      //   return;
+      // }
+      console.log( this.$refs.addGroupmsg)
+      this.$refs.addGroupmsg.openDioag(this.activeRow, this.type);
+    },
+    handleSelectionChange(val) {
+      if (val.length > 0) {
+        this.chioseIdList = this.chioseIdList.concat(val);
+        this.chioseIdList = this.$helpers.lodash.uniqBy(
+          this.chioseIdList,
+          "id"
+        );
+      } else {
+        if (this.isNewPage) return;
+        let idList = this.chioseIdList.map((group) => {
+          return group.id;
+        });
+        this.$nextTick(() => {
+          let tableIdList = [];
+          this.tableList.forEach((group) => {
+            tableIdList.push(group.id);
+            if (idList.indexOf(group.id) != -1) {
+              this.$refs.multipleSelection.toggleRowSelection(group, false);
+            }
+          });
+          this.chioseIdList = this.$helpers.lodash.remove(
+            this.chioseIdList,
+            function (item) {
+              return tableIdList.indexOf(item.id) == -1;
+            }
+          );
+          if (this.chioseIdList.length <= 0) {
+            this.clearCom();
+          }
+        });
+      }
+    },
+    clearCom() {
+      this.chioseIdList = [];
+      this.$refs.multipleSelection.clearSelection();
+    },
+    onTableSelect(rows, row) {
+      let idList = this.chioseIdList.map((group) => {
+        return group.id;
+      });
+      if (idList.indexOf(row.id) != -1) {
+        this.chioseIdList.splice(idList.indexOf(row.id), 1);
+        if (this.chioseIdList.length <= 0) {
+          this.clearCom();
+        }
+      }
+    },
+    onClose() {
+      this.clearCom();
+      this.lookVisible = false;
+    },
+    // openDioag(row, type) {
+    //   this.activeRow = row;
+    //   this.type = type;
+    //   this.lookVisible = true;
+
+    //   this.getList();
+    // },
+    deleteGroup(row) {
+      // deteleGroupMessage
+      this.$confirm("确定删除?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          deteleGroupMessageList({
+            groupIds: row.id,
+            imSendGroupMessageId: this.activeRow.id,
+          }).then((res) => {
+            if (res.code === 200) {
+              this.$message.success("删除成功");
+              this.getList();
+              // this.routeOrderStatus = false;
+            }
+          });
+        })
+        .catch();
+    },
+    deleteGroups() {
+      if (!this.chioseIdList || this.chioseIdList.length <= 0) {
+        this.$message.error("请至少选择一个群组");
+        return;
+      }
+      this.$confirm("确定删除?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          let idList = this.chioseIdList
+            .map((group) => {
+              return group.id;
+            })
+            .join(",");
+          deteleGroupMessageList({
+            groupIds: idList,
+            imSendGroupMessageId: this.activeRow.id,
+          }).then((res) => {
+            if (res.code === 200) {
+              this.$message.success("删除成功");
+              this.getList();
+              // this.routeOrderStatus = false;
+            }
+          });
+        })
+        .catch();
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.w100 {
+  width: 100%;
+}
+.btnWrap {
+  justify-content: flex-start;
+}
+</style>
+

src/views/liveClassManager/newLiveClass.vue

@@ -3,7 +3,7 @@
     <h2>
       <el-page-header @back="onCancel" :content="name"></el-page-header>
     </h2>
-    <div class="m-core" v-show="activeType == 1">
+    <div class="m-core first" v-show="activeType == 1">
       <el-form
         :model="form"
         ref="form"
@@ -357,7 +357,13 @@
           </el-form-item>
         </el-row>
 
-        <el-row> </el-row>
+        <el-row class="row" v-if="form.popularizeType == 'GROUP'">
+          <catGroup />
+        </el-row>
+        <el-row class="row" v-if="form.popularizeType == 'STUDENT'">
+          <addStudentList />
+        </el-row>
+
       </el-form>
       <el-row class="row">
         <el-button
@@ -395,8 +401,9 @@ import {
 import { queryByOrganId } from "@/api/systemManage";
 import { getTeamList } from "@/api/teamServer";
 import addStudentList from "./modals/addStudentList";
+import catGroup from "./modals/catGroup";
 export default {
-  components: { preview, addStudentList },
+  components: { preview, addStudentList, catGroup },
   data() {
     return {
       name: "新建直播课",
@@ -653,7 +660,6 @@ export default {
     },
     async changeSection(val) {
       this.$nextTick(async () => {
-        console.log("changeSection");
         if (this.form.popularizeType == "SCHOOL" && val && val.length > 0) {
           let organId = val.join(",");
           try {
@@ -692,91 +698,93 @@ export default {
     display: inline-block !important;
   }
 }
-/deep/.el-form--inline {
-  .el-form-item__content {
-    display: block;
+.first {
+  /deep/.el-form--inline {
+    .el-form-item__content {
+      display: block;
+    }
   }
-}
-/deep/.el-select {
-  width: 300px !important;
-}
-/deep/.el-date-editor {
-  width: 300px !important;
-}
-/deep/.el-checkbox {
-  margin-left: 15px !important;
-}
-/deep/.el-input {
-  position: relative;
-  font-size: 14px;
-  display: inline-block;
-  width: 300px;
-}
-.row {
-  padding-left: 24px;
-}
-/deep/.el-textarea__inner {
-  width: 600px;
-}
-.chioseWrap {
-  display: flex;
-  flex-direction: row;
-  justify-content: flex-start;
-  .chioseItem {
-    border-radius: 4px;
-    overflow: hidden;
+  /deep/.el-select {
+    width: 300px !important;
+  }
+  /deep/.el-date-editor {
+    width: 300px !important;
+  }
+  /deep/.el-checkbox {
+    margin-left: 15px !important;
+  }
+  /deep/.el-input {
     position: relative;
-    margin-right: 10px;
-    width: 188px;
-    height: 188px;
-    cursor: pointer;
-    .remberBox {
-      .wrap {
-        width: 100px;
-        height: 100px;
-        z-index: 100;
-        position: absolute;
-        // background-color: red;
-      }
-      display: flex;
-      flex-direction: row;
-      justify-content: flex-start;
-      margin-bottom: 30px;
-      padding-top: 10px;
-      align-items: center;
+    font-size: 14px;
+    display: inline-block;
+    width: 300px;
+  }
+  .row {
+    padding-left: 24px;
+  }
+  /deep/.el-textarea__inner {
+    width: 600px;
+  }
+  .chioseWrap {
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-start;
+    .chioseItem {
+      border-radius: 4px;
+      overflow: hidden;
       position: relative;
-      color: #6d7278;
-      font-size: 16px;
-      position: absolute;
-      top: 1px;
-      right: 1px;
-      .chioseBox {
-        /deep/.el-checkbox__inner {
-          width: 20px;
-          height: 20px;
-          border-radius: 50%;
-          &::after {
-            height: 8px;
-            left: 6px;
-            position: absolute;
-            top: 3px;
-            width: 4px;
-          }
+      margin-right: 10px;
+      width: 188px;
+      height: 188px;
+      cursor: pointer;
+      .remberBox {
+        .wrap {
+          width: 100px;
+          height: 100px;
+          z-index: 100;
+          position: absolute;
+          // background-color: red;
         }
-      }
-      .dotWrap {
-        width: 21px;
-        height: 21px;
-        background: url("../../assets/images/icon_checkbox_default.png")
-          no-repeat center;
-        background-size: contain;
-        margin-right: 8px;
+        display: flex;
+        flex-direction: row;
+        justify-content: flex-start;
+        margin-bottom: 30px;
+        padding-top: 10px;
+        align-items: center;
         position: relative;
-        overflow: hidden;
-        &.checked {
-          background: url("../../assets/images/icon_checkbox.png") no-repeat
-            center;
+        color: #6d7278;
+        font-size: 16px;
+        position: absolute;
+        top: 1px;
+        right: 1px;
+        .chioseBox {
+          /deep/.el-checkbox__inner {
+            width: 20px;
+            height: 20px;
+            border-radius: 50%;
+            &::after {
+              height: 8px;
+              left: 6px;
+              position: absolute;
+              top: 3px;
+              width: 4px;
+            }
+          }
+        }
+        .dotWrap {
+          width: 21px;
+          height: 21px;
+          background: url("../../assets/images/icon_checkbox_default.png")
+            no-repeat center;
           background-size: contain;
+          margin-right: 8px;
+          position: relative;
+          overflow: hidden;
+          &.checked {
+            background: url("../../assets/images/icon_checkbox.png") no-repeat
+              center;
+            background-size: contain;
+          }
         }
       }
     }