添加课程模块和章节;
parent
44eb6e111a
commit
34bc6f1af0
@ -0,0 +1,15 @@
|
|||||||
|
import service from '@/utils/request'
|
||||||
|
const headers = {
|
||||||
|
"Content-Type": "multipart/form-data;binary",
|
||||||
|
};
|
||||||
|
const api = {
|
||||||
|
upload:data=>{//文件上传
|
||||||
|
return service({
|
||||||
|
data,
|
||||||
|
url: '/public/uploadFile',
|
||||||
|
method: 'POST',
|
||||||
|
headers
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
export default api
|
@ -0,0 +1,15 @@
|
|||||||
|
import Cookies from 'js-cookie'
|
||||||
|
|
||||||
|
const TokenKey = 'Admin-Token'
|
||||||
|
|
||||||
|
export function getToken() {
|
||||||
|
return Cookies.get(TokenKey)
|
||||||
|
}
|
||||||
|
|
||||||
|
export function setToken(token) {
|
||||||
|
return Cookies.set(TokenKey, token)
|
||||||
|
}
|
||||||
|
|
||||||
|
export function removeToken() {
|
||||||
|
return Cookies.remove(TokenKey)
|
||||||
|
}
|
@ -0,0 +1,315 @@
|
|||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'chapterCom',
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<script setup>
|
||||||
|
// 引入依赖
|
||||||
|
import api from '@/api/course'
|
||||||
|
// import com_api from '@/api/common'
|
||||||
|
// import custom from '@/utils/custom'
|
||||||
|
// import WarningBar from '@/components/warningBar/warningBar.vue'
|
||||||
|
import {ref,onMounted,watch } from 'vue'
|
||||||
|
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||||
|
import { useRouter, useRoute } from 'vue-router'
|
||||||
|
const router = useRouter()
|
||||||
|
const route = useRoute()
|
||||||
|
import { useUserStore } from '@/pinia/modules/user'
|
||||||
|
const userStore = useUserStore()
|
||||||
|
import exercisesCom from '../components/mediaPool.vue'
|
||||||
|
const props = defineProps(['course_id','chapter_info'])
|
||||||
|
const emit = defineEmits(['reload'])
|
||||||
|
import UploadCommon from '@/components/upload/common.vue'
|
||||||
|
// 变量
|
||||||
|
const dialogChapterVisible = ref(false)
|
||||||
|
// const dialogChapterTitle = ref('')
|
||||||
|
const chapterForm = ref({pid:0})
|
||||||
|
const chapterRules = ref({
|
||||||
|
name: [{ required: true, message: '请输入章节名称', trigger: 'blur' }]
|
||||||
|
})
|
||||||
|
const chapter_data = ref([])
|
||||||
|
const dialogChapterChildVisible = ref(false)
|
||||||
|
const chapterChildForm = ref({})
|
||||||
|
const chapterChildRules = ref({
|
||||||
|
name: [{ required: true, message: '请输入章节名称', trigger: 'blur' }]
|
||||||
|
})
|
||||||
|
const dialogChapterTitle = ref('')
|
||||||
|
const dialogChapterChildTitle = ref('')
|
||||||
|
// const path = ref(import.meta.env.VITE_BASE_API)
|
||||||
|
const imageCommon = ref('')
|
||||||
|
// const current_chapter = ref({}) // 当前操作的大章节
|
||||||
|
// const current_chapter_child = ref({}) // 当前操作的子章节
|
||||||
|
// const chapter_index = ref(0)
|
||||||
|
// 生命周期
|
||||||
|
onMounted(() => {
|
||||||
|
chapter_data.value = props.chapter_info
|
||||||
|
})
|
||||||
|
watch(props,(old, newProps) => {
|
||||||
|
chapter_data.value = props.chapter_info
|
||||||
|
})
|
||||||
|
// 方法
|
||||||
|
function addChapterFunc() { // 添加大章节
|
||||||
|
chapterForm.value = {pid:0}
|
||||||
|
dialogChapterVisible.value = true
|
||||||
|
dialogChapterTitle.value = '添加大章节'
|
||||||
|
}
|
||||||
|
async function deleteChapterFunc(item) { //删除大章节
|
||||||
|
delFunc(item.id)
|
||||||
|
}
|
||||||
|
function delFunc(id) {
|
||||||
|
ElMessageBox.confirm('此操作将永久删除该数据, 是否继续?', '提示', {
|
||||||
|
confirmButtonText: '确定',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning'
|
||||||
|
})
|
||||||
|
.then(async() => {
|
||||||
|
const res = await api.delChapter({
|
||||||
|
ids:[id]
|
||||||
|
})
|
||||||
|
if (res.code === 0) {
|
||||||
|
ElMessage({
|
||||||
|
type: 'success',
|
||||||
|
message: '删除成功!'
|
||||||
|
})
|
||||||
|
emit('reload')
|
||||||
|
}
|
||||||
|
},() => {
|
||||||
|
})
|
||||||
|
}
|
||||||
|
function editChapterFunc(item) { //编辑大章节
|
||||||
|
chapterForm.value = item
|
||||||
|
dialogChapterVisible.value = true
|
||||||
|
dialogChapterTitle.value = '编辑大章节'
|
||||||
|
}
|
||||||
|
function closeChapterDialog() {
|
||||||
|
dialogChapterVisible.value = false
|
||||||
|
}
|
||||||
|
function closeChapterChildDialog() {
|
||||||
|
dialogChapterChildVisible.value = false
|
||||||
|
}
|
||||||
|
async function enterChapterDialog() { // 提交大章节
|
||||||
|
// console.log(chapterForm.value)
|
||||||
|
// return
|
||||||
|
chapterForm.value.sort = parseInt(chapterForm.value.sort)
|
||||||
|
const params = {
|
||||||
|
...chapterForm.value
|
||||||
|
}
|
||||||
|
let func_name = ''
|
||||||
|
if(chapterForm.value.id) { // 编辑
|
||||||
|
func_name = 'editChapter'
|
||||||
|
}
|
||||||
|
else{ // 新增
|
||||||
|
func_name = 'addChapter'
|
||||||
|
params.course_id = props.course_id
|
||||||
|
}
|
||||||
|
const res = await api[func_name](params)
|
||||||
|
if(res.code === 0) {
|
||||||
|
ElMessage({
|
||||||
|
type: 'success',
|
||||||
|
message: '操作成功!'
|
||||||
|
})
|
||||||
|
closeChapterDialog()
|
||||||
|
emit('reload')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function addChapterchildFunc(item) { // 打开新增子章节窗口
|
||||||
|
dialogChapterChildTitle.value = '新增子章节'
|
||||||
|
// current_chapter.value = item
|
||||||
|
chapterChildForm.value = {pid:item.id}
|
||||||
|
dialogChapterChildVisible.value = true
|
||||||
|
}
|
||||||
|
function editChapterChildFunc(item,main_index) { // 打开编辑子章节窗口
|
||||||
|
dialogChapterChildTitle.value = '编辑子章节'
|
||||||
|
// current_chapter.value = chapter_data.value[main_index]
|
||||||
|
chapterChildForm.value = item
|
||||||
|
dialogChapterChildVisible.value = true
|
||||||
|
}
|
||||||
|
function deleteChapterChildFunc(item) { // 删除子章节
|
||||||
|
delFunc(item.id)
|
||||||
|
}
|
||||||
|
async function enterChapterChildDialog() { // 提交小章节
|
||||||
|
chapterChildForm.value.sort = parseInt(chapterChildForm.value.sort)
|
||||||
|
const params = {
|
||||||
|
...chapterChildForm.value
|
||||||
|
}
|
||||||
|
let func_name = ''
|
||||||
|
// console.log(params)
|
||||||
|
// return
|
||||||
|
if(chapterChildForm.value.id){ // 编辑
|
||||||
|
func_name = 'editChapter'
|
||||||
|
}
|
||||||
|
else{ // 新增
|
||||||
|
func_name = 'addChapter'
|
||||||
|
params.course_id = props.course_id
|
||||||
|
}
|
||||||
|
const res = await api[func_name](params)
|
||||||
|
if(res.code === 0) {
|
||||||
|
ElMessage({
|
||||||
|
type: 'success',
|
||||||
|
message: '操作成功!'
|
||||||
|
})
|
||||||
|
closeChapterChildDialog()
|
||||||
|
emit('reload')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function getFilePath(file) { // 获取上传文件之后的地址
|
||||||
|
|
||||||
|
}
|
||||||
|
function chooseChapterChildExercises() { // 打开选择习题窗口
|
||||||
|
|
||||||
|
}
|
||||||
|
function openExercisesWinFunc() { // 打开媒体库
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="btn-box" style="text-align: right;margin: 10px 0 20px;">
|
||||||
|
<el-button type="primary" icon="plus" @click="addChapterFunc">添加章节</el-button>
|
||||||
|
</div>
|
||||||
|
<div class="list-box">
|
||||||
|
<div class="lb-card" v-for="(item,i) in chapter_data">
|
||||||
|
<!--大章节标题-->
|
||||||
|
<div class="lb-title-part">
|
||||||
|
<div class="lbt-title">{{item.name}}</div>
|
||||||
|
<div class="lbt-btn-box">
|
||||||
|
<el-button
|
||||||
|
icon="edit"
|
||||||
|
size="small"
|
||||||
|
type="primary"
|
||||||
|
link
|
||||||
|
@click="editChapterFunc(item)"
|
||||||
|
/>
|
||||||
|
<el-button
|
||||||
|
icon="plus"
|
||||||
|
size="small"
|
||||||
|
type="primary"
|
||||||
|
link
|
||||||
|
@click="addChapterchildFunc(item)"
|
||||||
|
/>
|
||||||
|
<el-button
|
||||||
|
icon="delete"
|
||||||
|
size="small"
|
||||||
|
type="primary"
|
||||||
|
link
|
||||||
|
@click="deleteChapterFunc(item)"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!--表格数据-->
|
||||||
|
<div class="lb-table-part" style="margin-bottom: 20px">
|
||||||
|
<el-table :data="item.children" >
|
||||||
|
<el-table-column align="left" label="id" width="60" prop="id" />
|
||||||
|
<el-table-column align="left" label="子章节名称" min-width="60" prop="name" />
|
||||||
|
<el-table-column align="left" label="课件名称" min-width="60" prop="url_name" />
|
||||||
|
<el-table-column align="left" label="章节习题" min-width="60" prop="is_contain_exercise">
|
||||||
|
<template #default="scope">
|
||||||
|
{{scope.row.is_contain_exercise === 0?'未添加习题':scope.row.is_contain_exercise}}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column align="left" label="是否免费" min-width="60">
|
||||||
|
<template #default="scope">
|
||||||
|
{{scope.row.is_free === 1? '是':'否'}}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column align="left" label="是否展示" min-width="60">
|
||||||
|
<template #default="scope">
|
||||||
|
{{scope.row.is_show === 1? '是':'否'}}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column align="left" label="操作" min-width="60">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-button
|
||||||
|
icon="edit"
|
||||||
|
size="small"
|
||||||
|
type="primary"
|
||||||
|
link
|
||||||
|
@click="editChapterChildFunc(scope.row)"
|
||||||
|
>编辑</el-button>
|
||||||
|
<el-button
|
||||||
|
icon="delete"
|
||||||
|
size="small"
|
||||||
|
type="primary"
|
||||||
|
link
|
||||||
|
@click="deleteChapterChildFunc(scope.row)"
|
||||||
|
>删除</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 添加/编辑 大章节窗口-->
|
||||||
|
<el-dialog v-model="dialogChapterVisible" :before-close="closeChapterDialog" :title="dialogChapterTitle">
|
||||||
|
<el-form ref="apiForm" :model="chapterForm" :rules="chapterRules" label-width="80px">
|
||||||
|
<el-form-item label="章节名称" prop="name">
|
||||||
|
<el-input v-model="chapterForm.name" autocomplete="off" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="章节排序" prop="sort">
|
||||||
|
<el-input v-model="chapterForm.sort" placeholder="输入整数,排序越小越靠前展示" autocomplete="off" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="是否免费" prop="is_free">
|
||||||
|
<el-switch v-model="chapterForm.is_free" active-text="是" inactive-text="否" :active-value="1" :inactive-value="-1" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="是否展示" prop="is_show">
|
||||||
|
<el-switch v-model="chapterForm.is_show" active-text="是" inactive-text="否" :active-value="1" :inactive-value="-1" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<template #footer>
|
||||||
|
<div class="dialog-footer">
|
||||||
|
<el-button size="small" @click="closeChapterDialog">取 消</el-button>
|
||||||
|
<el-button size="small" type="primary" @click="enterChapterDialog">确 定</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
<!-- 添加小章节窗口-->
|
||||||
|
<el-dialog v-model="dialogChapterChildVisible" :before-close="closeChapterChildDialog" :title="dialogChapterChildTitle">
|
||||||
|
<el-form ref="apiForm" :model="chapterChildForm" :rules="chapterChildRules" label-width="80px">
|
||||||
|
<el-form-item label="章节名称" prop="name">
|
||||||
|
<el-input v-model="chapterChildForm.name" autocomplete="off" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="上传课件">
|
||||||
|
<!-- <upload-common-->
|
||||||
|
<!-- v-model:imageCommon="imageCommon"-->
|
||||||
|
<!-- class="upload-btn"-->
|
||||||
|
<!-- @on-success="getFilePath"-->
|
||||||
|
<!-- />-->
|
||||||
|
<exercises-com @on-success="getFilePath" />
|
||||||
|
<!-- <el-button size="small" type="primary" @click="openExercisesWinFunc">点击上传</el-button>-->
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="习题管理">
|
||||||
|
<el-button size="small" @click="chooseChapterChildExercises">添加习题</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="章节排序" prop="sort">
|
||||||
|
<el-input v-model="chapterChildForm.sort" placeholder="输入整数,排序越小越靠前展示" autocomplete="off" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="是否免费" prop="is_free">
|
||||||
|
<el-switch v-model="chapterChildForm.is_free" active-text="是" inactive-text="否" :active-value="1" :inactive-value="-1" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="是否展示" prop="is_show">
|
||||||
|
<el-switch v-model="chapterChildForm.is_show" active-text="是" inactive-text="否" :active-value="1" :inactive-value="-1" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<template #footer>
|
||||||
|
<div class="dialog-footer">
|
||||||
|
<el-button size="small" @click="closeChapterChildDialog">取 消</el-button>
|
||||||
|
<el-button size="small" type="primary" @click="enterChapterChildDialog">确 定</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<style scoped>
|
||||||
|
.lbt-title{
|
||||||
|
margin-right: 20px;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
.lb-title-part{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
</style>
|
Loading…
Reference in New Issue