|
@@ -26,6 +26,40 @@
|
|
|
/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
+ <el-form-item v-if="!is_template" label="选择学生">
|
|
|
+ <div class="tag-list">
|
|
|
+ <el-popover trigger="click" placement="bottom-start">
|
|
|
+ <div class="student-list create-task">
|
|
|
+ <ul>
|
|
|
+ <li
|
|
|
+ v-for="({ student_id, student_name, student_image_url }, i) in student_list"
|
|
|
+ :key="student_id"
|
|
|
+ :class="{ selected: custom_student_list.some(item => item.student_id === student_id) }"
|
|
|
+ @click="selectStudent(i)"
|
|
|
+ >
|
|
|
+ <el-avatar icon="el-icon-user" :src="student_image_url" class="student_image" />
|
|
|
+ <span class="student_name nowrap-ellipsis">{{ student_name }}</span>
|
|
|
+ <svg-icon icon-class="check-mark-currentColor" class="svg-normal" />
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <span slot="reference" class="add-button">
|
|
|
+ <svg-icon icon-class="plus" />
|
|
|
+ </span>
|
|
|
+ </el-popover>
|
|
|
+
|
|
|
+ <span
|
|
|
+ v-for="{ student_id, student_name, student_image_url } in custom_student_list"
|
|
|
+ :key="`tag-${student_id}`"
|
|
|
+ class="student-tag"
|
|
|
+ >
|
|
|
+ <el-avatar :src="student_image_url" :size="32" />
|
|
|
+ <span class="tag-name">{{ student_name }}</span>
|
|
|
+ <svg-icon icon-class="closed" @click="deleteStudentItem(student_id)" />
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
|
|
|
<el-form-item label="时间">
|
|
|
<el-date-picker v-model="form.begin_date" type="date" value-format="yyyy-MM-dd" />
|
|
@@ -211,7 +245,7 @@
|
|
|
|
|
|
<script>
|
|
|
import SelectCourse from '@/components/select/SelectCourse.vue';
|
|
|
-import { GetTaskTeachingTypeList, GetTaskModeList, GetTeacherListByCourseID } from '@/api/select';
|
|
|
+import { GetTaskTeachingTypeList, GetTaskModeList, GetTeacherListByCourseID, GetCourseStudentList } from '@/api/select';
|
|
|
import { AddTaskToCSItem, GetTreeNodeInfo_BookChapterStruct, GetTaskInfo, UpdateTask, GetCSItem } from '@/api/course';
|
|
|
import { fileUpload } from '@/api/app';
|
|
|
|
|
@@ -239,6 +273,8 @@ export default {
|
|
|
type_list: [],
|
|
|
teacher_list: [],
|
|
|
mode_list: [],
|
|
|
+ student_list: [],
|
|
|
+ custom_student_list: [],
|
|
|
form: {
|
|
|
name: '',
|
|
|
teacher_id: '',
|
|
@@ -305,6 +341,11 @@ export default {
|
|
|
this.cs_item_begin_time = begin_time;
|
|
|
this.cs_item_end_time = end_time;
|
|
|
});
|
|
|
+ if (!this.is_template) {
|
|
|
+ GetCourseStudentList({ course_id: this.id, audit_status_list: [1], pay_status: 1 }).then(({ student_list }) => {
|
|
|
+ this.student_list = student_list;
|
|
|
+ });
|
|
|
+ }
|
|
|
},
|
|
|
|
|
|
addTaskToCSItem() {
|
|
@@ -312,7 +353,6 @@ export default {
|
|
|
if (!valid) {
|
|
|
return false;
|
|
|
}
|
|
|
-
|
|
|
let teaching_type = this.form.teaching_type;
|
|
|
let data = {
|
|
|
cs_item_id: this.cs_item_id,
|
|
@@ -328,40 +368,25 @@ export default {
|
|
|
? `${this.form.end_date} ${this.form.end_date_hour}:${this.form.end_date_minute}`
|
|
|
: this.cs_item_end_time,
|
|
|
teacher_id: this.form.teacher_id,
|
|
|
- content: this.form.content
|
|
|
+ content: this.form.content,
|
|
|
+ custom_student_id_list: this.custom_student_list.map(({ student_id }) => student_id)
|
|
|
};
|
|
|
|
|
|
if (teaching_type === 10) {
|
|
|
- let courseware_id_list = [];
|
|
|
- this.liveForm.coursewareInfo.forEach(item => {
|
|
|
- courseware_id_list.push(item.courseware_id);
|
|
|
- });
|
|
|
- data['courseware_id_list'] = courseware_id_list;
|
|
|
- let file_info_list = [];
|
|
|
- this.liveForm.file_info_list.forEach(item => {
|
|
|
- file_info_list.push(item.file_id);
|
|
|
- });
|
|
|
- data['file_id_list'] = file_info_list;
|
|
|
+ data['courseware_id_list'] = this.liveForm.coursewareInfo.map(({ courseware_id }) => courseware_id);
|
|
|
+ data['file_id_list'] = this.liveForm.file_info_list.map(({ file_id }) => file_id);
|
|
|
data['courseware_visible_mode'] = this.liveForm.courseware_visible_mode;
|
|
|
data['zhibo_record_mode'] = this.liveForm.zhibo_record_mode;
|
|
|
}
|
|
|
|
|
|
if (teaching_type === 11) {
|
|
|
- let courseware_id_list = [];
|
|
|
- this.courseForm.coursewareInfo.forEach(item => {
|
|
|
- courseware_id_list.push(item.courseware_id);
|
|
|
- });
|
|
|
- data['courseware_id_list'] = courseware_id_list;
|
|
|
+ data['courseware_id_list'] = this.courseForm.coursewareInfo.map(({ courseware_id }) => courseware_id);
|
|
|
data['task_mode'] = this.courseForm.task_mode;
|
|
|
data['is_enable_message'] = this.courseForm.is_enable_message;
|
|
|
}
|
|
|
|
|
|
if (teaching_type === 12) {
|
|
|
- let file_info_list = [];
|
|
|
- this.basicForm.file_info_list.forEach(item => {
|
|
|
- file_info_list.push(item.file_id);
|
|
|
- });
|
|
|
- data['file_id_list'] = file_info_list;
|
|
|
+ data['file_id_list'] = this.basicForm.file_info_list.map(({ file_id }) => file_id);
|
|
|
data['is_enable_homework'] = this.basicForm.is_enable_homework;
|
|
|
data['is_enable_message'] = this.basicForm.is_enable_message;
|
|
|
}
|
|
@@ -379,6 +404,20 @@ export default {
|
|
|
});
|
|
|
},
|
|
|
|
|
|
+ selectStudent(i) {
|
|
|
+ const id = this.student_list[i].student_id;
|
|
|
+ let list = this.custom_student_list;
|
|
|
+ let index = list.findIndex(({ student_id }) => student_id === id);
|
|
|
+ index === -1 ? list.push(this.student_list[i]) : list.splice(index, 1);
|
|
|
+ },
|
|
|
+
|
|
|
+ deleteStudentItem(id) {
|
|
|
+ this.custom_student_list.splice(
|
|
|
+ this.custom_student_list.findIndex(({ student_id }) => student_id === id),
|
|
|
+ 1
|
|
|
+ );
|
|
|
+ },
|
|
|
+
|
|
|
goBack() {
|
|
|
this.$router.push({
|
|
|
path: `/create_course_step_table/create_task/${this.id}?is_template=${this.is_template}`
|
|
@@ -458,7 +497,9 @@ export default {
|
|
|
courseware_visible_mode,
|
|
|
zhibo_record_mode,
|
|
|
cs_item_begin_time,
|
|
|
- cs_item_end_time
|
|
|
+ cs_item_end_time,
|
|
|
+ is_custom_student,
|
|
|
+ custom_student_list
|
|
|
}) => {
|
|
|
if (begin_time.length > 0) {
|
|
|
let begin = begin_time.split(' ');
|
|
@@ -499,6 +540,8 @@ export default {
|
|
|
this.basicForm.is_enable_homework = is_enable_homework === 'true';
|
|
|
this.basicForm.is_enable_message = is_enable_message === 'true';
|
|
|
}
|
|
|
+
|
|
|
+ if (is_custom_student === 'true') this.custom_student_list = custom_student_list;
|
|
|
}
|
|
|
);
|
|
|
}
|
|
@@ -555,6 +598,48 @@ export default {
|
|
|
width: 140px;
|
|
|
}
|
|
|
|
|
|
+ .tag-list {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+
|
|
|
+ .add-button {
|
|
|
+ display: inline-block;
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
+ text-align: center;
|
|
|
+ cursor: pointer;
|
|
|
+ background-color: $basic-color;
|
|
|
+ border-radius: 50%;
|
|
|
+
|
|
|
+ .svg-icon {
|
|
|
+ position: relative;
|
|
|
+ top: -1px;
|
|
|
+ width: 24px;
|
|
|
+ height: 24px;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .student-tag {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ height: 40px;
|
|
|
+ padding: 4px 12px 4px 4px;
|
|
|
+ margin-left: 16px;
|
|
|
+ border: 1px solid $border-color;
|
|
|
+ border-radius: 20px;
|
|
|
+
|
|
|
+ .tag-name {
|
|
|
+ margin: 0 16px 0 8px;
|
|
|
+
|
|
|
+ + .svg-icon {
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 任务模板
|
|
|
.task-template {
|
|
|
padding: 24px 32px;
|
|
|
background-color: #fbfbfb;
|
|
@@ -564,22 +649,67 @@ export default {
|
|
|
.el-form-item:not(:first-child, :last-child) {
|
|
|
margin: 20px 0;
|
|
|
}
|
|
|
+
|
|
|
+ .el-tag {
|
|
|
+ margin-right: 16px;
|
|
|
+
|
|
|
+ > span {
|
|
|
+ display: inline-block;
|
|
|
+ max-width: 200px;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ vertical-align: bottom;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
.el-button.done {
|
|
|
width: 120px;
|
|
|
}
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
|
|
|
|
|
- .el-tag {
|
|
|
- margin-right: 16px;
|
|
|
+<style lang="scss">
|
|
|
+.el-popover {
|
|
|
+ padding: 8px 0;
|
|
|
+
|
|
|
+ .student-list.create-task {
|
|
|
+ width: 330px;
|
|
|
+ height: 25vh;
|
|
|
+ min-height: 240px;
|
|
|
+ overflow: auto;
|
|
|
+
|
|
|
+ ul {
|
|
|
+ li {
|
|
|
+ padding: 8px 24px;
|
|
|
+ cursor: pointer;
|
|
|
+
|
|
|
+ .student_image {
|
|
|
+ margin-right: 16px;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
|
|
|
- > span {
|
|
|
+ .student_name {
|
|
|
display: inline-block;
|
|
|
- max-width: 200px;
|
|
|
- overflow: hidden;
|
|
|
- text-overflow: ellipsis;
|
|
|
- white-space: nowrap;
|
|
|
- vertical-align: bottom;
|
|
|
+ width: 70%;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+
|
|
|
+ .svg-icon {
|
|
|
+ vertical-align: middle;
|
|
|
+ visibility: hidden;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.selected {
|
|
|
+ background-color: #dbdbdb;
|
|
|
+
|
|
|
+ .svg-icon {
|
|
|
+ color: #333;
|
|
|
+ visibility: visible;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|