|
|
@@ -7,7 +7,7 @@
|
|
|
<div v-for="(chapter, chapterIndex) in chapters" :key="chapterIndex" class="chapter">
|
|
|
<!-- 章节标题 -->
|
|
|
<div class="chapter-title">
|
|
|
- <span>{{ chapter.title }}</span>
|
|
|
+ <span>{{ chapter.name }}</span>
|
|
|
<a-icon type="edit" @click="editChapter(chapterIndex)" />
|
|
|
</div>
|
|
|
|
|
|
@@ -16,7 +16,7 @@
|
|
|
<PlusOutlined /> 添加课时</a-button
|
|
|
>
|
|
|
<!-- 课时列表 -->
|
|
|
- <div v-for="(lesson, lessonIndex) in chapter.lessons" :key="lessonIndex" class="lesson">
|
|
|
+ <div v-for="(lesson, lessonIndex) in chapter.classHours" :key="lessonIndex" class="lesson">
|
|
|
<a-row :gutter="48">
|
|
|
<a-col :span="4">
|
|
|
<!-- 视频封面 -->
|
|
|
@@ -25,11 +25,11 @@
|
|
|
<a-col :span="16">
|
|
|
<!-- 课时信息 -->
|
|
|
<div class="lesson-info">
|
|
|
- <div class="lesson-title">{{ lesson.title }}</div>
|
|
|
+ <div class="lesson-title">{{ lesson.name }}</div>
|
|
|
<div class="lesson-details">
|
|
|
<span>视频大小:{{ lesson.size }}MB</span>
|
|
|
- <span>发布时间:{{ lesson.publishTime }}</span>
|
|
|
- <span>发布人:{{ lesson.publisher }}</span>
|
|
|
+ <span>发布时间:{{ lesson.createTime }}</span>
|
|
|
+ <span>发布人:{{ lesson.createUserName }}</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</a-col>
|
|
|
@@ -57,8 +57,9 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
- import { ref } from 'vue'
|
|
|
+ import { ref, reactive, onMounted } from 'vue'
|
|
|
import addClassHours from './addClassHours.vue'
|
|
|
+ import courseProductionApi from '@/api/courseCenter/courseProduction.js'
|
|
|
const addLessonModalVisible = ref(false)
|
|
|
// 章节数据
|
|
|
const chapters = ref([
|
|
|
@@ -107,9 +108,15 @@
|
|
|
const modalVisible = ref(false)
|
|
|
const currentChapterIndex = ref(null)
|
|
|
// 表单状态
|
|
|
- const formState = ref({
|
|
|
+ const formState = reactive({
|
|
|
chapterName: ''
|
|
|
})
|
|
|
+ const pagination = reactive({
|
|
|
+ pageSize: 10,
|
|
|
+ pageNum: 1,
|
|
|
+ total: 50,
|
|
|
+ showTotal: (total) => `共${total}条`,
|
|
|
+ })
|
|
|
// 显示模态框
|
|
|
const showModal = () => {
|
|
|
modalVisible.value = true
|
|
|
@@ -117,19 +124,28 @@
|
|
|
|
|
|
// 确认按钮点击事件
|
|
|
const handleOk = () => {
|
|
|
- if (formState.value.chapterName) {
|
|
|
- chapters.value.push({
|
|
|
- title: formState.value.chapterName,
|
|
|
- lessons: []
|
|
|
- })
|
|
|
- formState.value.chapterName = '' // 清空表单
|
|
|
+ let courseInfoId = localStorage.getItem('courseInfoId')
|
|
|
+ if (formState.chapterName) {
|
|
|
+ courseProductionApi
|
|
|
+ .add({
|
|
|
+ courseId: courseInfoId,
|
|
|
+ name: formState.chapterName
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ console.log(res, '章节添加')
|
|
|
+ getList()
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.log(err)
|
|
|
+ })
|
|
|
+ formState.chapterName = '' // 清空表单
|
|
|
modalVisible.value = false // 关闭模态框
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// 取消按钮点击事件
|
|
|
const handleCancel = () => {
|
|
|
- formState.value.chapterName = '' // 清空表单
|
|
|
+ formState.chapterName = '' // 清空表单
|
|
|
modalVisible.value = false // 关闭模态框
|
|
|
}
|
|
|
// 编辑章节
|
|
|
@@ -141,6 +157,22 @@
|
|
|
const editLesson = (chapterIndex, lessonIndex) => {
|
|
|
// 实现编辑逻辑
|
|
|
}
|
|
|
+ // 获取章节列表
|
|
|
+ const getList = () => {
|
|
|
+ let params = {
|
|
|
+ current: pagination.pageNum,
|
|
|
+ size: pagination.pageSize
|
|
|
+ }
|
|
|
+ courseProductionApi
|
|
|
+ .page(params)
|
|
|
+ .then((res) => {
|
|
|
+ console.log(res, '章节列表')
|
|
|
+ chapters.value = res.data.records
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.log(err)
|
|
|
+ })
|
|
|
+ }
|
|
|
|
|
|
// 删除课时
|
|
|
const deleteLesson = (chapterIndex, lessonIndex) => {
|
|
|
@@ -156,6 +188,9 @@
|
|
|
console.log(data, 'onAddClassHoursOk')
|
|
|
// addLessonModalVisible.value = true
|
|
|
}
|
|
|
+ onMounted(() => {
|
|
|
+ getList()
|
|
|
+ })
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|