-
-
内容设置
-
-
- 添加章节
- 编辑顺序
-
-
- 批量移动
- 取消
- 保存
-
-
-
-
-
-
-
-
{{ chapter.name }}
-
-
- 修改章节名称
- 添加小节
- 删除
-
-
-
-
-
+
+ -
+
+
+
{{ i + 1 }}.
+
+
+
+
+
+
+
+
{{ section.name }}
-
-
-
-
-
-
-
-
-
-
-
-
- {{ transferType(scope.row.fileType) }}
-
-
-
-
-
- 下载
- 查看
- 删除
- 修改小节名称
- 更换文件
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+ 下载
+ 预览
+ 修改资源名称
+ 更换
+ 移除
+
+
+
+
+
-
-
-
-
-
- 视频请上传MP4格式，大小不超过150M；office文件大小不要超过10M
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-
-
-
-
+
+
+
+
+
+ 视频请上传MP4格式，大小不超过150M；office文件大小不要超过10M
+
+
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
+
+
+
+
-
-
-
-
-
![]()
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-
+
+
+
+
+
![]()
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -281,6 +230,8 @@ export default {
sectionForm: {
sectionName: ''
},
+ keyword: '',
+ searchTimer: null,
fileId: "",
fileName: "",
fileUrl: "",
@@ -321,8 +272,8 @@ export default {
id: '',
sort: 'bottom'
},
- moved: false, // 是否移动过
- sourceVisible: false
+ sourceVisible: false,
+ sections: []
};
},
components: { Pdf, Upload, Source },
@@ -340,45 +291,23 @@ export default {
},
methods: {
getData () {
- this.$get(`${this.api.queryChaptersAndSubsections}/${this.id}`)
- .then(res => {
- this.chapters = res.chapterList;
- })
- .catch(err => {
-
- });
+ this.$get(`${this.api.queryChaptersAndSubsections}/${this.id}`).then(res => {
+ const list = res.chapterList
+ if (list.length) {
+ if (this.chapterId) {
+ const cur = list.find(e => e.id === this.chapterId)
+ this.sections = cur ? cur.subsectionList : []
+ } else {
+ this.chapterClick(list[0])
+ }
+ }
+ this.chapters = list
+ }).catch(err => { })
},
// 处理多选
handleSelectionChange (val) {
this.multipleSelection = val
},
- back () {
- // 如果是预览则关闭预览
- if (this.previewing) {
- this.closeIframe();
- } else {
- // 排序中
- if (this.sorting) {
- // 已经移动了顺序
- if (this.moved) {
- this.$confirm(`编辑的内容未保存，是否保存？`, '提示', {
- type: 'warning',
- closeOnClickModal: false
- }).then(() => {
- this.saveSort()
- this.moved = false
- }).catch(() => {
- this.sorting = false
- this.chapters = JSON.parse(JSON.stringify(this.originChapters))
- })
- } else {
- this.sorting = false
- }
- } else {
- this.$router.push(this.$store.state.referrer || '/curriculum')
- }
- }
- },
iframeOnload () {
document.querySelector("#fileIframe").onload = e => {
if (this.isPPT) {
@@ -521,7 +450,7 @@ export default {
]
},
// 资源移动校验
- moveConfirm () {
+ async moveConfirm () {
let { id, sort } = this.moveForm
if (!id) return this.$message.warning('请选择目标章节')
if (sort === '') return this.$message.warning('请选择目标排序')
@@ -542,27 +471,26 @@ export default {
delete e.children
if (e.id === id) e.subsectionList.splice(sort, 0, ...list)
})
- this.moved = true
- },
- cancelSort () {
- this.chapters = JSON.parse(JSON.stringify(this.originChapters))
- this.sorting = false;
- },
- saveSort () {
- this.chapters.forEach((n, k) => {
- n.sort = k + 1;
+
+ chapters.forEach((n, k) => {
+ n.sort = k + 1
n.subsectionList.forEach((j, i) => {
j.sort = i + 1
j.chapterId = n.id
- });
- });
- let data = {
+ })
+ })
+ await this.$post(this.api.reorder, {
chapterVOList: this.chapters
- };
- this.$post(this.api.reorder, data).then(res => {
- this.sorting = false;
- }).catch(res => { })
+ })
+ this.getData()
+ },
+ // 选中章节
+ chapterClick (row) {
+ row.subsectionList.map(e => this.$set(e, 'check', false))
+ this.sections = row.subsectionList
+ this.chapterId = row.id
},
+ // 编辑章节名称
editChapter (item) {
this.chapterId = item.id;
this.chapterName = item.name;
@@ -571,13 +499,12 @@ export default {
delChapter (id) {
this.$confirm("此删除操作不可逆，是否确认删除选中项？", "提示", {
type: "warning"
- })
- .then(() => {
- this.$del(`${this.api.deleteChapter}/${id}`).then(res => {
- this.$message.success("删除成功");
- this.getData();
- }).catch(res => { });
- }).catch(() => { });
+ }).then(() => {
+ this.$del(`${this.api.deleteChapter}/${id}`).then(res => {
+ this.$message.success("删除成功")
+ this.getData()
+ }).catch(res => { })
+ }).catch(() => { })
},
closeSection () {
this.isAddSection = false;
@@ -589,13 +516,12 @@ export default {
this.sourceVisible = true
},
addSection (id) {
- this.chapterId = id;
- this.sectionForm.sectionName = "";
- this.fileUrl = "";
- this.uploadList = [];
- this.sectionId = "";
- this.isAddSection = true;
- this.sectionVisible = true;
+ this.sectionForm.sectionName = ''
+ this.fileUrl = ''
+ this.uploadList = []
+ this.sectionId = ''
+ this.isAddSection = true
+ this.sectionVisible = true
},
chapterSubmit () {
if (!this.chapterName) return this.$message.warning("请填写章节名称");
@@ -735,23 +661,21 @@ export default {
});
}
},
- editSectionName (row, chapterId) {
- this.chapterId = chapterId;
+ editSectionName (row) {
this.sectionId = row.id;
this.sectionForm.sectionName = row.name;
this.sectionNameVisible = true;
},
- switchFile (row, chapterId, sectionId) {
- this.uploadList = [];
+ switchFile (row) {
+ this.uploadList = []
this.curFile = {
fileId: row.fileId,
fileName: row.fileName,
fileType: row.fileType,
fileUrl: row.fileUrl
- };
- this.chapterId = chapterId;
- this.sectionId = row.id;
- this.sectionForm.sectionName = row.sectionName;
+ }
+ this.sectionId = row.id
+ this.sectionForm.sectionName = row.sectionName
this.switchVisible = true;
},
@@ -771,9 +695,7 @@ export default {
this.$message.success("更换成功");
this.switchVisible = false;
this.getData();
- })
- .catch(err => {
- });
+ }).catch(err => { })
},
switchSubmit () {
if (this.uploading) return this.$message.warning("资源正在上传中，请稍候");
@@ -791,9 +713,7 @@ export default {
this.getData();
}).catch(res => {
});
- })
- .catch(() => {
- });
+ }).catch(() => { })
},
sortChapter (row, type, disabled, index) {
if (!disabled) {
@@ -806,20 +726,6 @@ export default {
}
}
},
- sortSection (chapterIndex, type, disabled, index) {
- if (!disabled) {
- this.moved = true
- let list = this.chapters[chapterIndex].subsectionList;
- if (type == "up") {
- let tempItem = list.splice(index - 1, 1)[0];
- list.splice(index, 0, tempItem);
- } else {
- let tempItem = list.splice(index + 1, 1)[0];
- list.splice(index, 0, tempItem);
- }
- this.chapters[chapterIndex].subsectionList = list;
- }
- },
sectionNameSubmit () {
if (!this.sectionForm.sectionName) return this.$message.warning("请填写小节名称");
let data = {
@@ -829,12 +735,10 @@ export default {
name: this.sectionForm.sectionName
};
this.$put(this.api.editSubsection, data).then(res => {
- this.$message.success("修改成功");
- this.sectionNameVisible = false;
+ this.$message.success("修改成功")
+ this.sectionNameVisible = false
this.getData();
- })
- .catch(err => {
- });
+ }).catch(err => { })
},
closePlayer () {
this.playAuth = "";
@@ -847,7 +751,15 @@ export default {
this.showMask1 = false;
this.showMask2 = false;
this.previewing = false;
- }
+ },
+ back () {
+ // 如果是预览则关闭预览
+ if (this.previewing) {
+ this.closeIframe();
+ } else {
+ this.$router.push(this.$store.state.referrer || '/curriculum')
+ }
+ },
}
};
@@ -987,9 +899,12 @@ export default {
.left {
width: 400px;
- padding: 15px;
+ height: calc(100vh - 247px);
+ padding: 0 15px 15px 0;
margin-right: 20px;
- border: 1px dashed #eee;
+ border-right: 1px solid #eee;
+ box-sizing: border-box;
+ overflow: auto;
.title {
font-size: 16px;
@@ -1001,11 +916,15 @@ export default {
li {
display: flex;
- padding: 5px 0;
+ padding: 5px 10px;
+
+ &.active {
+ background-color: #d5e7fb;
+ }
}
.name {
- width: 71%;
+ width: 68%;
margin-right: 20px;
font-size: 14px;
color: #333;
@@ -1023,6 +942,37 @@ export default {
.right {
flex: 1;
+
+ .sections {
+ margin-top: 20px;
+
+ li {
+ display: flex;
+ justify-content: space-between;
+ padding: 5px 10px;
+ margin-bottom: 10px;
+ background-color: #f9f9f9;
+ }
+
+ .section-left,
+ .section-right {
+ display: inline-flex;
+ align-items: center;
+ }
+
+ .serial {
+ margin: 0 8px;
+ font-size: 14px;
+ color: #858585;
+ }
+
+ .name {
+ margin-left: 10px;
+ font-size: 12px;
+ color: #333;
+
+ }
+ }
}
}
\ No newline at end of file
diff --git a/src/views/course/content/source.vue b/src/views/course/content/source.vue
index 346a2b0..d638bc2 100644
--- a/src/views/course/content/source.vue
+++ b/src/views/course/content/source.vue
@@ -12,18 +12,42 @@