|
|
@@ -9,7 +9,7 @@
|
|
|
:value="item.value">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
- </el-form-item>
|
|
|
+ </el-form-item>
|
|
|
<el-form-item label="课程名称">
|
|
|
<el-input v-model="keyword" placeholder="请输入" clearable @change="searchList"
|
|
|
size="small"></el-input>
|
|
|
@@ -63,15 +63,9 @@
|
|
|
|
|
|
<!--工具条-->
|
|
|
<el-col :span="24" class="toolbar">
|
|
|
- <el-pagination
|
|
|
- @size-change="handleSizeChange"
|
|
|
- @current-change="handleCurrentChange"
|
|
|
- :page-sizes="[10, 20, 50, 100]"
|
|
|
- :page-size="size"
|
|
|
- layout="total, sizes, prev, pager, next, jumper"
|
|
|
- :total="total"
|
|
|
- style="float:right;"
|
|
|
- ></el-pagination>
|
|
|
+ <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
|
|
+ :page-sizes="[10, 20, 50, 100]" :page-size="size" layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ :total="total" style="float:right;"></el-pagination>
|
|
|
</el-col>
|
|
|
|
|
|
<!-- 分类管理 -->
|
|
|
@@ -86,14 +80,15 @@
|
|
|
</el-table-column>
|
|
|
<el-table-column label="是否上架" width="80">
|
|
|
<template slot-scope="scope">
|
|
|
- <span style="color: #5cb87a;" v-if="scope.row.status == 1">上架</span>
|
|
|
- <span style="color: #909399;" v-else>下架</span>
|
|
|
+ <span style="color: #5cb87a;" v-if="scope.row.status == 1">上架</span>
|
|
|
+ <span style="color: #909399;" v-else>下架</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="操作" width="180">
|
|
|
<template slot-scope="scope">
|
|
|
<el-button size="mini" type="primary" @click="addEditCategory(scope.row)">编辑</el-button>
|
|
|
- <el-button size="mini" type="danger" @click="deleteCategory(scope.$index, scope.row)">删除</el-button>
|
|
|
+ <el-button size="mini" type="danger"
|
|
|
+ @click="deleteCategory(scope.$index, scope.row)">删除</el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
@@ -107,21 +102,22 @@
|
|
|
<div class="newCategoryDialog">
|
|
|
<div class="newCategoryDialog-item">
|
|
|
<div class="newCategoryDialog-item-label">分类名称:</div>
|
|
|
- <el-input v-model.trim="newCategoryDialogForm.label" placeholder="请输入内容" clearable size="small" style="flex: 1"></el-input>
|
|
|
+ <el-input v-model.trim="newCategoryDialogForm.label" placeholder="请输入内容" clearable size="small"
|
|
|
+ style="flex: 1"></el-input>
|
|
|
</div>
|
|
|
<div class="newCategoryDialog-item">
|
|
|
<div class="newCategoryDialog-item-label">分类封面:</div>
|
|
|
- <el-upload
|
|
|
- class="cover-uploader"
|
|
|
- :show-file-list="false"
|
|
|
- auto-upload
|
|
|
- accept="image/*"
|
|
|
+ <el-upload class="cover-uploader" :show-file-list="false" auto-upload accept="image/*"
|
|
|
:http-request="categoryCoverUpload">
|
|
|
- <img v-if="newCategoryDialogForm.coverImage" :src="newCategoryDialogForm.coverImage" class="cover-preview">
|
|
|
+ <img v-if="newCategoryDialogForm.coverImage" :src="newCategoryDialogForm.coverImage"
|
|
|
+ class="cover-preview">
|
|
|
<i v-else class="el-icon-plus cover-uploader-icon"></i>
|
|
|
<div v-if="newCategoryDialogForm.coverImage" class="cover-mask">
|
|
|
- <el-link icon="el-icon-view" type="success" @click.stop="previewImage(newCategoryDialogForm.coverImage)" :underline="false">查看</el-link>
|
|
|
- <el-link icon="el-icon-edit" type="success" :underline="false" style="margin-left: 10px;">修改</el-link>
|
|
|
+ <el-link icon="el-icon-view" type="success"
|
|
|
+ @click.stop="previewImage(newCategoryDialogForm.coverImage)"
|
|
|
+ :underline="false">查看</el-link>
|
|
|
+ <el-link icon="el-icon-edit" type="success" :underline="false"
|
|
|
+ style="margin-left: 10px;">修改</el-link>
|
|
|
</div>
|
|
|
</el-upload>
|
|
|
</div>
|
|
|
@@ -135,7 +131,8 @@
|
|
|
</div>
|
|
|
<span slot="footer" class="classificationOperation">
|
|
|
<el-button @click="newCategoryDialogVisible = false">关 闭</el-button>
|
|
|
- <el-button type="primary" :disabled="!newCategoryDialogForm.label" :loading="newCategoryDialogLoading" @click="saveCategory()">保存</el-button>
|
|
|
+ <el-button type="primary" :disabled="!newCategoryDialogForm.label" :loading="newCategoryDialogLoading"
|
|
|
+ @click="saveCategory()">保存</el-button>
|
|
|
</span>
|
|
|
</el-dialog>
|
|
|
|
|
|
@@ -144,8 +141,8 @@
|
|
|
<el-form :model="courseForm" :rules="courseRules" ref="courseForm" label-width="120px">
|
|
|
<el-form-item label="课程分类" prop="courseTypeId">
|
|
|
<el-select v-model="courseForm.courseTypeId" placeholder="请选择" style="width:100%">
|
|
|
- <el-option v-for="item in categoryOptions" :key="item.value"
|
|
|
- :label="item.label" :value="item.value">
|
|
|
+ <el-option v-for="item in categoryOptionsTwo" :key="item.value" :label="item.label"
|
|
|
+ :value="item.value">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
@@ -153,22 +150,20 @@
|
|
|
<el-input v-model="courseForm.courseName" placeholder="请输入课程名称"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="课程介绍" style="height: 200px;">
|
|
|
- <quill-editor style="height: 150px" ref="text" v-model="courseForm.courseDesc" class="myQuillEditor" :options="editorOption"/>
|
|
|
+ <quill-editor style="height: 150px" ref="text" v-model="courseForm.courseDesc" class="myQuillEditor"
|
|
|
+ :options="editorOption" />
|
|
|
</el-form-item>
|
|
|
<el-form-item label="课程价格">
|
|
|
- <el-input-number v-model="courseForm.coursePrice" :min="0" :precision="2" step-strictly :step="1" @blur="coursePriceBlur"></el-input-number>
|
|
|
+ <el-input-number v-model="courseForm.coursePrice" :min="0" :precision="2" step-strictly :step="1"
|
|
|
+ @blur="coursePriceBlur"></el-input-number>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="课程时间(分钟)">
|
|
|
- <el-input-number v-model="courseForm.courseDuration" :min="1" step-strictly :step="1" @blur="courseDurationBlur"></el-input-number>
|
|
|
+ <el-input-number v-model="courseForm.courseDuration" :min="1" step-strictly :step="1"
|
|
|
+ @blur="courseDurationBlur"></el-input-number>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="课程封面">
|
|
|
- <el-upload
|
|
|
- class="cover-uploader"
|
|
|
- action="#"
|
|
|
- :show-file-list="false"
|
|
|
- :on-change="handleCourseCoverChange"
|
|
|
- :auto-upload="false"
|
|
|
- :before-upload="beforeCoverUpload">
|
|
|
+ <el-upload class="cover-uploader" action="#" :show-file-list="false"
|
|
|
+ :on-change="handleCourseCoverChange" :auto-upload="false" :before-upload="beforeCoverUpload">
|
|
|
<img v-if="courseForm.coverImageUrl" :src="courseForm.coverImageUrl" class="cover-image" />
|
|
|
<i v-else class="el-icon-plus cover-uploader-icon"></i>
|
|
|
</el-upload>
|
|
|
@@ -187,14 +182,8 @@
|
|
|
<div class="title-dios">
|
|
|
<div>添加视频</div>
|
|
|
<div style="margin-right: 30px;">
|
|
|
- <el-upload
|
|
|
- ref="uploadVideoRef"
|
|
|
- action="#"
|
|
|
- :disabled="addVideoLoading"
|
|
|
- :show-file-list="false"
|
|
|
- :limit="5"
|
|
|
- multiple
|
|
|
- :http-request="uploadVideo"
|
|
|
+ <el-upload ref="uploadVideoRef" action="#" :disabled="addVideoLoading" :show-file-list="false"
|
|
|
+ :limit="5" multiple :http-request="uploadVideo"
|
|
|
accept="video/mp4,video/avi,video/x-msvideo">
|
|
|
<el-button size="small" type="primary" :loading="addVideoLoading">上传视频</el-button>
|
|
|
</el-upload>
|
|
|
@@ -205,7 +194,9 @@
|
|
|
<addVideoCom ref="addVideoComRef" v-model="displayVideoList"></addVideoCom>
|
|
|
</div>
|
|
|
<span slot="footer" class="dialog-footer">
|
|
|
- <el-button type="primary" @click="saveVideo()" :disabled="!displayVideoList.length || displayVideoList.some(video => video.videoError) || displayVideoList.some(video => video.videoLoading)" size="small" :loading="saveVideoLoading">保存视频</el-button>
|
|
|
+ <el-button type="primary" @click="saveVideo()"
|
|
|
+ :disabled="!displayVideoList.length || displayVideoList.some(video => video.videoError) || displayVideoList.some(video => video.videoLoading)"
|
|
|
+ size="small" :loading="saveVideoLoading">保存视频</el-button>
|
|
|
</span>
|
|
|
</el-dialog>
|
|
|
|
|
|
@@ -252,6 +243,8 @@ export default {
|
|
|
// 课程分类选择
|
|
|
categoryValue: '',
|
|
|
categoryOptions: [],
|
|
|
+ categoryOptionsTwo: [],
|
|
|
+
|
|
|
// 搜索条件
|
|
|
keyword: null, // 课程名称
|
|
|
instructor: null, // 讲师
|
|
|
@@ -282,29 +275,29 @@ export default {
|
|
|
currentCategoryIndex: -1,
|
|
|
coverImageUrl: '',
|
|
|
coverImageFile: null,
|
|
|
-
|
|
|
+
|
|
|
// 用户信息
|
|
|
user: sessionStorage.user ? JSON.parse(sessionStorage.user) : {},
|
|
|
editorOption: { // 富文本框里面的默认值
|
|
|
placeholder: '请输入内容...',
|
|
|
modules: {
|
|
|
- toolbar:[
|
|
|
+ toolbar: [
|
|
|
['bold', 'italic', 'underline', 'strike'], //加粗，斜体，下划线，删除线
|
|
|
// ['blockquote', 'code-block'], //引用，代码块
|
|
|
-
|
|
|
+
|
|
|
[{ 'header': 1 }, { 'header': 2 }], // 标题，键值对的形式；1、2表示字体大小
|
|
|
// [{ 'list': 'ordered'}, { 'list': 'bullet' }], //列表
|
|
|
// [{ 'script': 'sub'}, { 'script': 'super' }], // 上下标
|
|
|
// [{ 'indent': '-1'}, { 'indent': '+1' }], // 缩进
|
|
|
// [{ 'direction': 'rtl' }], // 文本方向
|
|
|
-
|
|
|
+
|
|
|
[{ 'size': ['small', false, 'large', 'huge'] }], // 字体大小
|
|
|
[{ 'header': [1, 2, 3, 4, 5, 6, false] }], //几级标题
|
|
|
-
|
|
|
+
|
|
|
[{ 'color': [] }, { 'background': [] }], // 字体颜色，字体背景颜色
|
|
|
// [{ 'font': [] }], //字体
|
|
|
[{ 'align': [] }], //对齐方式
|
|
|
-
|
|
|
+
|
|
|
['clean'], //清除字体样式
|
|
|
// ['image','video'] //上传图片、上传视频
|
|
|
[] //上传图片、上传视频
|
|
|
@@ -330,6 +323,18 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
+ getUpList() {
|
|
|
+ post('/course-type/uplist', {}).then(res => {
|
|
|
+ if (res.code == 'ok') {
|
|
|
+ this.categoryOptionsTwo = (res.data || []).map(item => ({
|
|
|
+ label: item.typeName,
|
|
|
+ value: item.id,
|
|
|
+ }))
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.msg);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
saveCategory() {
|
|
|
this.newCategoryDialogLoading = true
|
|
|
const { label, value, coverImage, status } = this.newCategoryDialogForm;
|
|
|
@@ -339,7 +344,7 @@ export default {
|
|
|
coverImageUrl: coverImage,
|
|
|
status: status
|
|
|
}).then(res => {
|
|
|
- if(res.code == 'ok') {
|
|
|
+ if (res.code == 'ok') {
|
|
|
this.newCategoryDialogVisible = false
|
|
|
this.$message.success('保存成功!');
|
|
|
this.batchManage()
|
|
|
@@ -360,26 +365,26 @@ export default {
|
|
|
|
|
|
const formData = new FormData();
|
|
|
formData.append('multipartFile', file.file);
|
|
|
-
|
|
|
+
|
|
|
this.http.uploadFile('/common/uploadFile', formData, res => {
|
|
|
if (res.code === "ok") {
|
|
|
- this.newCategoryDialogForm.coverImage = checkAndAddUpload(res.data);
|
|
|
- this.$message.success('图片上传成功');
|
|
|
+ this.newCategoryDialogForm.coverImage = checkAndAddUpload(res.data);
|
|
|
+ this.$message.success('图片上传成功');
|
|
|
} else {
|
|
|
- this.$message.error(res.msg || '上传失败');
|
|
|
+ this.$message.error(res.msg || '上传失败');
|
|
|
}
|
|
|
});
|
|
|
- },
|
|
|
+ },
|
|
|
previewImage(url) {
|
|
|
this.previewImages = [url];
|
|
|
this.$nextTick(() => {
|
|
|
if (this.$refs.imageWrapper && this.$refs.imageWrapper.$viewer) {
|
|
|
- this.$refs.imageWrapper.$viewer.show();
|
|
|
+ this.$refs.imageWrapper.$viewer.show();
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
addEditCategory(row = false) {
|
|
|
- if(!row) {
|
|
|
+ if (!row) {
|
|
|
this.newCategoryDialogForm = {
|
|
|
label: '',
|
|
|
value: '',
|
|
|
@@ -396,12 +401,12 @@ export default {
|
|
|
this.newCategoryDialogVisible = true
|
|
|
},
|
|
|
coursePriceBlur(val) {
|
|
|
- if(!this.courseForm.coursePrice) {
|
|
|
+ if (!this.courseForm.coursePrice) {
|
|
|
this.courseForm.coursePrice = 0
|
|
|
}
|
|
|
},
|
|
|
courseDurationBlur(val) {
|
|
|
- if(!this.courseForm.courseDuration) {
|
|
|
+ if (!this.courseForm.courseDuration) {
|
|
|
this.courseForm.courseDuration = 1
|
|
|
}
|
|
|
},
|
|
|
@@ -418,10 +423,10 @@ export default {
|
|
|
seconds: videoPreviewTime * 60,
|
|
|
seq: index + 1
|
|
|
}
|
|
|
- if(coursePreviousUrl) {
|
|
|
+ if (coursePreviousUrl) {
|
|
|
obj.coursePreviousUrl = this.checkAndAddUpload(coursePreviousUrl)
|
|
|
}
|
|
|
- if(id) {
|
|
|
+ if (id) {
|
|
|
obj.id = id
|
|
|
}
|
|
|
return obj
|
|
|
@@ -444,11 +449,11 @@ export default {
|
|
|
});
|
|
|
this.addVideoVisable = false
|
|
|
})
|
|
|
-
|
|
|
+
|
|
|
},
|
|
|
uploadVideo(file) {
|
|
|
this.videoList.unshift(file.file)
|
|
|
- if(this.videiListTime) {
|
|
|
+ if (this.videiListTime) {
|
|
|
clearTimeout(this.videiListTime)
|
|
|
}
|
|
|
this.videiListTime = setTimeout(() => {
|
|
|
@@ -457,7 +462,7 @@ export default {
|
|
|
// this.$refs.addVideoComRef.addNewRow()
|
|
|
},
|
|
|
batchUploadVideo() {
|
|
|
- for(let i = 0; i < this.videoList.length; i++) {
|
|
|
+ for (let i = 0; i < this.videoList.length; i++) {
|
|
|
const formData = new FormData()
|
|
|
formData.append('multipartFile', this.videoList[i])
|
|
|
this.displayVideoList.unshift({
|
|
|
@@ -483,7 +488,7 @@ export default {
|
|
|
}, 1500)
|
|
|
},
|
|
|
// 去除视频名称后缀
|
|
|
- removeVideoSuffix(str) {
|
|
|
+ removeVideoSuffix(str) {
|
|
|
if (str.indexOf('.') > -1) {
|
|
|
return str.substring(0, str.lastIndexOf('.'))
|
|
|
} else {
|
|
|
@@ -524,7 +529,7 @@ export default {
|
|
|
coverImage: item.coverImage || '',
|
|
|
status: item.status
|
|
|
}));
|
|
|
-
|
|
|
+
|
|
|
// 同步更新下拉选项
|
|
|
this.categoryOptions = [...this.categoryList];
|
|
|
} else {
|
|
|
@@ -661,7 +666,7 @@ export default {
|
|
|
this.$message.warning('请先上传封面图片!');
|
|
|
return;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 关闭对话框
|
|
|
this.coverDialogVisible = false;
|
|
|
this.$message({
|
|
|
@@ -675,35 +680,35 @@ export default {
|
|
|
this.coverImageFile = file.raw;
|
|
|
if (this.coverImageFile) {
|
|
|
this.coverImageUrl = URL.createObjectURL(this.coverImageFile);
|
|
|
-
|
|
|
+
|
|
|
// 获取当前分类的ID
|
|
|
if (this.currentCategoryIndex >= 0) {
|
|
|
const categoryId = this.categoryList[this.currentCategoryIndex].value;
|
|
|
-
|
|
|
+
|
|
|
// 立即上传封面图片
|
|
|
this.listLoading = true;
|
|
|
-
|
|
|
+
|
|
|
// 创建FormData对象用于上传文件
|
|
|
const formData = new FormData();
|
|
|
formData.append('id', categoryId);
|
|
|
formData.append('coverImage', this.coverImageFile);
|
|
|
-
|
|
|
+
|
|
|
// 调用上传图片的API
|
|
|
this.http.uploadFile('/course-type/uploadCover', formData, res => {
|
|
|
this.listLoading = false;
|
|
|
if (res.code == "ok") {
|
|
|
// 上传成功后，获取返回的图片URL
|
|
|
const imageUrl = res.data && res.data.url ? res.data.url : this.coverImageUrl;
|
|
|
-
|
|
|
+
|
|
|
// 更新本地数据
|
|
|
this.categoryList[this.currentCategoryIndex].coverImage = imageUrl;
|
|
|
-
|
|
|
+
|
|
|
// 同步更新到分类选项中
|
|
|
const optionIndex = this.categoryOptions.findIndex(item => item.value === categoryId);
|
|
|
if (optionIndex !== -1) {
|
|
|
this.categoryOptions[optionIndex].coverImage = imageUrl;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
this.$message({
|
|
|
type: 'success',
|
|
|
message: '封面图片上传成功!'
|
|
|
@@ -725,8 +730,8 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
|
|
|
- // 设置分类封面
|
|
|
- setCategoryCover(index, row) {
|
|
|
+ // 设置分类封面
|
|
|
+ setCategoryCover(index, row) {
|
|
|
this.currentCategoryIndex = index;
|
|
|
this.coverImageUrl = row.coverImage || '';
|
|
|
this.coverDialogVisible = true;
|
|
|
@@ -736,21 +741,21 @@ export default {
|
|
|
beforeCoverUpload(file) {
|
|
|
const isImage = file.type.indexOf('image/') === 0;
|
|
|
const isLt2M = file.size / 1024 / 1024 < 2;
|
|
|
-
|
|
|
+
|
|
|
if (!isImage) {
|
|
|
this.$message.error('上传封面图片只能是图片格式!');
|
|
|
}
|
|
|
if (!isLt2M) {
|
|
|
this.$message.error('上传封面图片大小不能超过 2MB!');
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
return isImage && isLt2M;
|
|
|
},
|
|
|
|
|
|
// 添加课程
|
|
|
addCourse(row) {
|
|
|
this.addDialogVisible = true;
|
|
|
- if(!row) {
|
|
|
+ if (!row) {
|
|
|
this.courseForm = {
|
|
|
courseTypeId: '',
|
|
|
courseName: '',
|
|
|
@@ -783,9 +788,9 @@ export default {
|
|
|
if (!valid) {
|
|
|
return false;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
const formData = new FormData();
|
|
|
- if(this.courseForm.id) {
|
|
|
+ if (this.courseForm.id) {
|
|
|
formData.append('id', this.courseForm.id);
|
|
|
}
|
|
|
formData.append('courseTypeId', this.courseForm.courseTypeId);
|
|
|
@@ -818,19 +823,19 @@ export default {
|
|
|
const formData = new FormData();
|
|
|
formData.append('multipartFile', row);
|
|
|
this.http.uploadFile('/common/uploadFile', formData, res => {
|
|
|
- if (res.code == "ok") {
|
|
|
- this.courseForm.coverImageUrl = this.checkAndAddUpload(res.data)
|
|
|
- } else {
|
|
|
- this.$message({
|
|
|
- message: res.msg || '图片上传失败',
|
|
|
- type: 'error'
|
|
|
- });
|
|
|
- }
|
|
|
+ if (res.code == "ok") {
|
|
|
+ this.courseForm.coverImageUrl = this.checkAndAddUpload(res.data)
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ message: res.msg || '图片上传失败',
|
|
|
+ type: 'error'
|
|
|
+ });
|
|
|
+ }
|
|
|
})
|
|
|
},
|
|
|
|
|
|
checkAndAddUpload(str) {
|
|
|
- if(!str) {
|
|
|
+ if (!str) {
|
|
|
return '';
|
|
|
}
|
|
|
if (str.includes('/upload/')) {
|
|
|
@@ -849,7 +854,7 @@ export default {
|
|
|
});
|
|
|
return;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 调用后端API保存课程分类
|
|
|
this.http.post('/course-type/saveOrUpdate', {
|
|
|
typeName: this.newCategory.label
|
|
|
@@ -858,15 +863,15 @@ export default {
|
|
|
// 生成唯一ID作为value，实际项目中应该使用后端返回的ID
|
|
|
const categoryId = res.data && res.data.id ? res.data.id : 'category_' + Date.now();
|
|
|
this.newCategory.value = categoryId;
|
|
|
-
|
|
|
+
|
|
|
// 添加到分类列表
|
|
|
- this.categoryList.push({...this.newCategory});
|
|
|
- this.categoryOptions.push({...this.newCategory});
|
|
|
-
|
|
|
+ this.categoryList.push({ ...this.newCategory });
|
|
|
+ this.categoryOptions.push({ ...this.newCategory });
|
|
|
+
|
|
|
// 清空输入
|
|
|
this.newCategory.label = '';
|
|
|
this.newCategory.value = '';
|
|
|
-
|
|
|
+
|
|
|
this.$message({
|
|
|
type: 'success',
|
|
|
message: '添加分类成功!'
|
|
|
@@ -884,7 +889,7 @@ export default {
|
|
|
});
|
|
|
});
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
// 删除分类
|
|
|
deleteCategory(index, row) {
|
|
|
this.$confirm('确认删除该分类?', '提示', {
|
|
|
@@ -899,13 +904,13 @@ export default {
|
|
|
if (res.code == "ok") {
|
|
|
// 从分类列表中删除
|
|
|
this.categoryList.splice(index, 1);
|
|
|
-
|
|
|
+
|
|
|
// 从下拉选项中删除
|
|
|
const optionIndex = this.categoryOptions.findIndex(item => item.value === row.value);
|
|
|
if (optionIndex !== -1) {
|
|
|
this.categoryOptions.splice(optionIndex, 1);
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
this.$message({
|
|
|
type: 'success',
|
|
|
message: '删除分类成功!'
|
|
|
@@ -966,6 +971,7 @@ export default {
|
|
|
|
|
|
// 获取课程列表
|
|
|
this.getList();
|
|
|
+ this.getUpList()
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
@@ -979,10 +985,12 @@ export default {
|
|
|
width: 100%;
|
|
|
justify-content: space-between;
|
|
|
}
|
|
|
+
|
|
|
.addVideoClass {
|
|
|
height: 65vh;
|
|
|
overflow-y: auto;
|
|
|
}
|
|
|
+
|
|
|
.rg_span {
|
|
|
display: inline-block;
|
|
|
}
|
|
|
@@ -1229,72 +1237,76 @@ export default {
|
|
|
position: relative;
|
|
|
top: -8px;
|
|
|
}
|
|
|
+
|
|
|
.classificationOperation {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: space-between;
|
|
|
}
|
|
|
+
|
|
|
.newCategoryDialog {
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
}
|
|
|
+
|
|
|
.newCategoryDialog-item {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
flex-direction: row;
|
|
|
margin-bottom: 20px;
|
|
|
}
|
|
|
+
|
|
|
.newCategoryDialog-item-label {
|
|
|
width: 120px;
|
|
|
text-align: right;
|
|
|
margin-right: 20px;
|
|
|
}
|
|
|
+
|
|
|
.cover-uploader {
|
|
|
- border: 1px dashed #d9d9d9;
|
|
|
- border-radius: 6px;
|
|
|
- cursor: pointer;
|
|
|
- position: relative;
|
|
|
- overflow: hidden;
|
|
|
- width: 200px;
|
|
|
- height: 150px;
|
|
|
+ border: 1px dashed #d9d9d9;
|
|
|
+ border-radius: 6px;
|
|
|
+ cursor: pointer;
|
|
|
+ position: relative;
|
|
|
+ overflow: hidden;
|
|
|
+ width: 200px;
|
|
|
+ height: 150px;
|
|
|
}
|
|
|
|
|
|
.cover-uploader:hover {
|
|
|
- border-color: #409EFF;
|
|
|
+ border-color: #409EFF;
|
|
|
}
|
|
|
|
|
|
.cover-uploader:hover .cover-mask {
|
|
|
- opacity: 1;
|
|
|
+ opacity: 1;
|
|
|
}
|
|
|
|
|
|
.cover-mask {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- background: rgba(0, 0, 0, 0.5);
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- position: absolute;
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- opacity: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: rgba(0, 0, 0, 0.5);
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ opacity: 0;
|
|
|
}
|
|
|
|
|
|
.cover-uploader-icon {
|
|
|
- font-size: 28px;
|
|
|
- color: #8c939d;
|
|
|
- width: 200px;
|
|
|
- height: 150px;
|
|
|
- line-height: 150px;
|
|
|
- text-align: center;
|
|
|
+ font-size: 28px;
|
|
|
+ color: #8c939d;
|
|
|
+ width: 200px;
|
|
|
+ height: 150px;
|
|
|
+ line-height: 150px;
|
|
|
+ text-align: center;
|
|
|
}
|
|
|
|
|
|
.cover-preview {
|
|
|
- width: 200px;
|
|
|
- height: 150px;
|
|
|
- object-fit: cover;
|
|
|
- border-radius: 4px;
|
|
|
- cursor: pointer;
|
|
|
+ width: 200px;
|
|
|
+ height: 150px;
|
|
|
+ object-fit: cover;
|
|
|
+ border-radius: 4px;
|
|
|
+ cursor: pointer;
|
|
|
}
|
|
|
-
|
|
|
</style>
|
