|
|
@@ -34,6 +34,10 @@
|
|
|
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
|
|
|
v-hasPermi="['course:userCourseVideo:remove']">删除</el-button>
|
|
|
</el-col>
|
|
|
+ <el-col :span="1.5">
|
|
|
+ <el-button type="warning" plain icon="el-icon-edit" size="mini" @click="handleCourseSort"
|
|
|
+ v-hasPermi="['course:userCourseVideo:sort']">修改课节排序</el-button>
|
|
|
+ </el-col>
|
|
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
|
|
</el-row>
|
|
|
<el-table border v-loading="loading" :data="userCourseVideoList" @selection-change="handleSelectionChange">
|
|
|
@@ -316,6 +320,19 @@
|
|
|
</course-watch-comment>
|
|
|
</el-dialog>
|
|
|
|
|
|
+
|
|
|
+ <el-dialog title="修改课节排序" :visible.sync="openVideoSort" style="width: 1600px;" append-to-body>
|
|
|
+ <draggable v-model="userCourseVideoSortList" @end="onDragEndDay" style="padding: 10px">
|
|
|
+ <el-button style="margin: 8px 4px;" v-for="(item, index) in userCourseVideoSortList" :class="item.newCourseSort != item.courseSort ? 'red':''">第{{
|
|
|
+ item.newCourseSort
|
|
|
+ }}序(原排序第{{ item.courseSort }})
|
|
|
+ </el-button>
|
|
|
+ </draggable>
|
|
|
+ <div style="float: right;margin-top: -20px">
|
|
|
+ <el-button type="primary" @click="saveSorts">保存</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -329,8 +346,8 @@ import {
|
|
|
updates,
|
|
|
batchSaveVideo,
|
|
|
batchUpdateRed,
|
|
|
- updateUserCourseVideo
|
|
|
-} from "@/api/course/userCourseVideo";
|
|
|
+ updateUserCourseVideo, getVideoListByCourseIdAll, sortCourseVideo
|
|
|
+} from '@/api/course/userCourseVideo'
|
|
|
import QuestionBank from "@/views/course/courseQuestionBank/QuestionBank.vue";
|
|
|
import CourseProduct from "@/views/course/fsCourseProduct/CourseProduct.vue";
|
|
|
import VideoUpload from "@/components/VideoUpload/index.vue";
|
|
|
@@ -338,10 +355,11 @@ import { listVideoResource } from '@/api/course/videoResource';
|
|
|
import { getByIds } from '@/api/course/courseQuestionBank'
|
|
|
import CourseWatchComment from "./courseWatchComment.vue";
|
|
|
import { getCateListByPid, getCatePidList } from '@/api/course/userCourseCategory'
|
|
|
+import draggable from 'vuedraggable'
|
|
|
|
|
|
export default {
|
|
|
name: "userCourseCatalog",
|
|
|
- components: { VideoUpload, QuestionBank, CourseWatchComment, CourseProduct,},
|
|
|
+ components: { VideoUpload, QuestionBank, CourseWatchComment, CourseProduct,draggable},
|
|
|
data() {
|
|
|
return {
|
|
|
duration: null,
|
|
|
@@ -387,6 +405,7 @@ export default {
|
|
|
fileId: '',
|
|
|
courseName: null,
|
|
|
userCourseVideoList: [],
|
|
|
+ userCourseVideoSortList: [],
|
|
|
total: 0,
|
|
|
redData: {
|
|
|
queryParams: {
|
|
|
@@ -434,6 +453,8 @@ export default {
|
|
|
single: true,
|
|
|
// 非多个禁用
|
|
|
multiple: true,
|
|
|
+ loading3:false,
|
|
|
+ openVideoSort:false,
|
|
|
// 表单参数
|
|
|
form: {
|
|
|
courseProducts:[]
|
|
|
@@ -502,6 +523,7 @@ export default {
|
|
|
this.courseProduct.title = '拍商品选择';
|
|
|
},
|
|
|
|
|
|
+
|
|
|
//选择疗法
|
|
|
selectPackage(row) {
|
|
|
const drug = {};
|
|
|
@@ -857,6 +879,47 @@ export default {
|
|
|
this.msgSuccess("删除成功");
|
|
|
}).catch(() => { });
|
|
|
},
|
|
|
+
|
|
|
+ handleCourseSort(){
|
|
|
+
|
|
|
+ getVideoListByCourseIdAll(this.queryParams.courseId).then(response => {
|
|
|
+
|
|
|
+ response.rows.forEach((item) => item.newCourseSort = item.courseSort);
|
|
|
+ this.userCourseVideoSortList = response.rows.sort((a, b) => a.courseSort - b.courseSort);
|
|
|
+ if (this.userCourseVideoSortList==null || this.userCourseVideoSortList.length==0){
|
|
|
+ this.$message.error("暂无课节天数")
|
|
|
+ }else {
|
|
|
+ this.openVideoSort = true;
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ onDragEndDay() {
|
|
|
+ this.userCourseVideoSortList.forEach((item, index) => {
|
|
|
+ item.newCourseSort = index + 1;
|
|
|
+ })
|
|
|
+ this.$forceUpdate()
|
|
|
+ },
|
|
|
+
|
|
|
+ saveSorts() {
|
|
|
+
|
|
|
+ console.log("this.userCourseVideoSortList",this.userCourseVideoSortList)
|
|
|
+ let list = this.userCourseVideoSortList.filter(e => e.courseSort != e.newCourseSort).map(e => {
|
|
|
+ return {courseSort: e.newCourseSort, videoId: e.videoId}
|
|
|
+ })
|
|
|
+ console.log("this.userCourseVideoSortList",this.userCourseVideoSortList)
|
|
|
+ this.loading3 = true;
|
|
|
+ console.log("list",list)
|
|
|
+ sortCourseVideo(list).then(e => {
|
|
|
+ this.getList();
|
|
|
+ }).finally(() => {
|
|
|
+ this.userCourseVideoSortList=[];
|
|
|
+ this.openVideoSort=false;
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
openAdds() {
|
|
|
this.addBatchData.open = true;
|
|
|
this.getRootTypeList();
|
|
|
@@ -948,4 +1011,15 @@ export default {
|
|
|
line-height: 150px;
|
|
|
text-align: center;
|
|
|
}
|
|
|
+
|
|
|
+
|
|
|
+.red:hover {
|
|
|
+ color: #dbdbdb !important;
|
|
|
+}
|
|
|
+
|
|
|
+.red {
|
|
|
+ background-color: #F56C6C !important;
|
|
|
+ color: #fff !important;
|
|
|
+}
|
|
|
+
|
|
|
</style>
|