分享 发送至课程

src/api/exercise.js

@@ -115,3 +115,10 @@ export function GetMyCourseList_Teacher(data) {
     data,
   );
 }
+
+/**
+ * 得到课程学员列表
+ */
+export function GetCourseStudentList(data) {
+  return http.post(`${process.env.VUE_APP_LearnWebSI}?MethodName=teaching-course_manager-GetCourseStudentList`, data);
+}

src/views/home/personal_question/components/ShareDialog.vue

@@ -65,7 +65,28 @@
 
     <div v-show="send_type === sendModes[0].type" class="select-course">
       <div class="title">选择课程</div>
-      <div></div>
+      <template v-for="{ id, name } in courseList">
+        <div :key="id" class="course">
+          <i
+            :class="curCourseId === id ? 'el-icon-caret-bottom' : 'el-icon-caret-right'"
+            @click="selectedCourse(id)"
+          ></i>
+          <div class="course-name" @click="selectedCourse(id)">
+            {{ name }}
+          </div>
+          <span class="link" @click="selectAllStudent(id)">全选</span>
+        </div>
+        <div v-if="curCourseId === id" :key="`student-${id}`" class="student-list">
+          <div v-for="li in studentList" :key="li.student_id" class="student-list-item">
+            <el-checkbox v-model="li.checked" :label="li.student_id">
+              <div class="student-info">
+                <el-avatar :size="24" :src="li.student_image_url" />
+                <span>{{ li.student_name }}</span>
+              </div>
+            </el-checkbox>
+          </div>
+        </div>
+      </template>
     </div>
 
     <div v-show="send_type === sendModes[1].type" class="generate-condition">
@@ -84,7 +105,7 @@
 
     <div slot="footer" class="footer">
       <template v-if="send_type === sendModes[0].type">
-        <el-button type="primary" @click="send">发送</el-button>
+        <el-button type="primary" @click="generateLink">发送</el-button>
       </template>
       <template v-if="send_type === sendModes[1].type">
         <el-button type="primary" @click="generateLink">生成链接和二维码</el-button>
@@ -94,7 +115,7 @@
 </template>
 
 <script>
-import { CreateShareRecord } from '@/api/exercise';
+import { CreateShareRecord, GetMyCourseList_Teacher, GetCourseStudentList } from '@/api/exercise';
 
 export default {
   name: 'ShareDialog',
@@ -147,15 +168,24 @@ export default {
       effective_days: 50,
       answer_time_limit_minute: 30,
       memo: '',
+      courseList: [],
+      curCourseId: '',
+      studentList: [],
     };
   },
+  created() {
+    GetMyCourseList_Teacher({ finish_status: 51, release_status: 1 }).then(({ course_list }) => {
+      this.courseList = course_list;
+    });
+  },
   methods: {
     getNowDate() {
       const date = new Date();
       return `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
     },
+    // 生成链接
     generateLink() {
-      CreateShareRecord({
+      let option = {
         exercise_id: this.exerciseId,
         begin_date: this.begin_date,
         effective_days: this.effective_days,
@@ -166,11 +196,52 @@ export default {
         correct_answer_show_mode: this.correct_answer_show_mode,
         max_person_count: this.max_person_count || -1,
         memo: this.memo,
-      }).then(({ status, ...data }) => {
-        this.$emit('generateLink', { ...data });
+      };
+      if (this.send_type === this.sendModes[0].type) {
+        if (this.curCourseId === '') return this.$message.error('请选择课程');
+        option.course_id = this.curCourseId;
+        let student_id_list = this.studentList.filter((item) => item.checked).map((item) => item.student_id);
+        if (student_id_list.length === 0) return this.$message.error('请选择学生');
+        option.student_id_list = student_id_list;
+      }
+      CreateShareRecord(option).then(({ status, ...data }) => {
+        if (this.send_type === this.sendModes[0].type) {
+          this.$emit('update:dialogVisible', false);
+          this.$message.success('发送成功');
+        }
+        if (this.send_type === this.sendModes[1].type) {
+          this.$emit('generateLink', { ...data });
+        }
       });
     },
-    send() {},
+    /**
+     * 选择课程
+     * @param {String} id 课程id
+     */
+    selectedCourse(id) {
+      this.curCourseId = this.curCourseId === id ? '' : id;
+      this.studentList = [];
+      if (!this.curCourseId) return;
+      GetCourseStudentList({ course_id: this.curCourseId, audit_status_list: [1], pay_status: -1 }).then(
+        ({ student_list }) => {
+          this.studentList = student_list.map((item) => ({
+            ...item,
+            checked: false,
+          }));
+        },
+      );
+    },
+    /**
+     * 全选学生
+     * @param {String} id 课程id
+     */
+    selectAllStudent(id) {
+      if (!this.curCourseId || id !== this.curCourseId) return;
+      this.studentList = this.studentList.map((item) => ({
+        ...item,
+        checked: true,
+      }));
+    },
     dialogClose() {
       this.$emit('update:dialogVisible');
     },
@@ -183,6 +254,8 @@ export default {
       this.effective_days = 50;
       this.answer_time_limit_minute = 30;
       this.memo = '';
+      this.curCourseId = '';
+      this.studentList = [];
     },
   },
 };
@@ -237,7 +310,51 @@ export default {
     }
 
     .select-course {
-      margin-top: 16px;
+      display: flex;
+      flex-direction: column;
+      row-gap: 8px;
+      max-height: 300px;
+      margin-top: 8px;
+      overflow-y: auto;
+
+      .course {
+        display: flex;
+        column-gap: 12px;
+        align-items: center;
+        justify-content: space-between;
+        margin-left: 4px;
+
+        i {
+          font-size: 16px;
+          cursor: pointer;
+        }
+
+        &-name {
+          flex: 1;
+          cursor: pointer;
+        }
+      }
+
+      .student-list {
+        display: flex;
+        flex-direction: column;
+        row-gap: 8px;
+        margin-left: 8px;
+
+        &-item {
+          .el-checkbox {
+            display: flex;
+            column-gap: 8px;
+            align-items: center;
+
+            .student-info {
+              display: flex;
+              column-gap: 8px;
+              align-items: center;
+            }
+          }
+        }
+      }
     }
 
     .generate-condition {