feat:课程新增编辑添加学期和允许资源下载开关
This commit is contained in:
parent
a4cd04429a
commit
8a2a8add39
@ -24,12 +24,6 @@
|
|||||||
<n-input v-model:value="formData.courseName" placeholder="请输入课程名称" class="form-input" />
|
<n-input v-model:value="formData.courseName" placeholder="请输入课程名称" class="form-input" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 课程开始时间 -->
|
|
||||||
<div class="form-item">
|
|
||||||
<label class="form-label required">课程开始时间:</label>
|
|
||||||
<n-date-picker v-model:value="formData.startTime" type="datetime" placeholder="选择时间" class="form-input" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 主讲老师 -->
|
<!-- 主讲老师 -->
|
||||||
<div class="form-item">
|
<div class="form-item">
|
||||||
<label class="form-label required">授课老师:</label>
|
<label class="form-label required">授课老师:</label>
|
||||||
@ -37,6 +31,12 @@
|
|||||||
class="form-input" />
|
class="form-input" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- 课程开始时间 -->
|
||||||
|
<div class="form-item">
|
||||||
|
<label class="form-label required">课程开始时间:</label>
|
||||||
|
<n-date-picker v-model:value="formData.startTime" type="datetime" placeholder="选择时间" class="form-input" />
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- 参与学员 -->
|
<!-- 参与学员 -->
|
||||||
<div class="form-item">
|
<div class="form-item">
|
||||||
<label class="form-label required">参与学员:</label>
|
<label class="form-label required">参与学员:</label>
|
||||||
@ -71,6 +71,17 @@
|
|||||||
class="form-input" />
|
class="form-input" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- 学期设置 -->
|
||||||
|
<div class="form-item">
|
||||||
|
<label class="form-label required">学期:</label>
|
||||||
|
<div class="semester-container">
|
||||||
|
<n-select v-model:value="formData.semesterYear" :options="yearOptions" placeholder="选择年份"
|
||||||
|
class="semester-year-input" @update:value="updateSemester" />
|
||||||
|
<n-select v-model:value="formData.semesterTerm" :options="termOptions" placeholder="选择学期"
|
||||||
|
class="semester-term-input" @update:value="updateSemester" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- 排序 -->
|
<!-- 排序 -->
|
||||||
<!-- <div class="form-item">
|
<!-- <div class="form-item">
|
||||||
<label class="form-label required">排序:</label>
|
<label class="form-label required">排序:</label>
|
||||||
@ -120,6 +131,14 @@
|
|||||||
|
|
||||||
<!-- 下半部分:设置选项 -->
|
<!-- 下半部分:设置选项 -->
|
||||||
<div class="form-section">
|
<div class="form-section">
|
||||||
|
<!-- 是否允许下载 -->
|
||||||
|
<div class="form-item btn-label">
|
||||||
|
<label class="form-label required">允许下载课件</label>
|
||||||
|
<div class="setting-container">
|
||||||
|
<n-switch v-model:value="formData.allowDownload" class="form-toggle" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- 离开页面停止播放 -->
|
<!-- 离开页面停止播放 -->
|
||||||
<div class="form-item btn-label">
|
<div class="form-item btn-label">
|
||||||
<label class="form-label required">离开页面停止播放</label>
|
<label class="form-label required">离开页面停止播放</label>
|
||||||
@ -261,7 +280,12 @@ const formData = reactive({
|
|||||||
selectedClasses: [] as string[],
|
selectedClasses: [] as string[],
|
||||||
courseCover: null as File | null,
|
courseCover: null as File | null,
|
||||||
courseDescription: '',
|
courseDescription: '',
|
||||||
|
// 学期设置
|
||||||
|
semesterYear: new Date().getFullYear(), // 当前年份
|
||||||
|
semesterTerm: 'spring' as 'spring' | 'autumn', // 春季或秋季
|
||||||
|
semester: '', // 最终的学期字符串,如"2025春"
|
||||||
// 视频设置
|
// 视频设置
|
||||||
|
allowDownload: true,
|
||||||
stopOnLeave: false,
|
stopOnLeave: false,
|
||||||
videoSpeedControl: false,
|
videoSpeedControl: false,
|
||||||
showVideoText: false,
|
showVideoText: false,
|
||||||
@ -363,7 +387,14 @@ const loadCourseData = async () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 学期数据回显
|
||||||
|
if (storeCourseData.semester) {
|
||||||
|
parseSemesterData(storeCourseData.semester);
|
||||||
|
}
|
||||||
|
|
||||||
// 视频设置选项:从后端字段映射到前端字段(数字0/1转布尔值)
|
// 视频设置选项:从后端字段映射到前端字段(数字0/1转布尔值)
|
||||||
|
formData.allowDownload = storeCourseData.allowDownload !== undefined ?
|
||||||
|
Boolean(Number(storeCourseData.allowDownload)) : true;
|
||||||
formData.stopOnLeave = storeCourseData.pauseExit !== undefined ?
|
formData.stopOnLeave = storeCourseData.pauseExit !== undefined ?
|
||||||
Boolean(Number(storeCourseData.pauseExit)) : true;
|
Boolean(Number(storeCourseData.pauseExit)) : true;
|
||||||
formData.videoSpeedControl = storeCourseData.allowSpeed !== undefined ?
|
formData.videoSpeedControl = storeCourseData.allowSpeed !== undefined ?
|
||||||
@ -440,7 +471,14 @@ const loadCourseData = async () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 学期数据回显
|
||||||
|
if (courseData.semester) {
|
||||||
|
parseSemesterData(courseData.semester);
|
||||||
|
}
|
||||||
|
|
||||||
// 视频设置选项:从后端字段映射到前端字段(数字0/1转布尔值)
|
// 视频设置选项:从后端字段映射到前端字段(数字0/1转布尔值)
|
||||||
|
formData.allowDownload = courseData.allowDownload !== undefined ?
|
||||||
|
Boolean(Number(courseData.allowDownload)) : true;
|
||||||
formData.stopOnLeave = courseData.pauseExit !== undefined ?
|
formData.stopOnLeave = courseData.pauseExit !== undefined ?
|
||||||
Boolean(Number(courseData.pauseExit)) : true;
|
Boolean(Number(courseData.pauseExit)) : true;
|
||||||
formData.videoSpeedControl = courseData.allowSpeed !== undefined ?
|
formData.videoSpeedControl = courseData.allowSpeed !== undefined ?
|
||||||
@ -481,6 +519,59 @@ const instructorOptions = ref([] as { label: string; value: string }[])
|
|||||||
// 班级选项
|
// 班级选项
|
||||||
const classOptions = ref([] as { label: string; value: string }[])
|
const classOptions = ref([] as { label: string; value: string }[])
|
||||||
|
|
||||||
|
// 学期年份选项(从当前年份开始,向后5年)
|
||||||
|
const yearOptions = ref<{ label: string; value: number }[]>([])
|
||||||
|
|
||||||
|
// 初始化年份选项
|
||||||
|
const initYearOptions = () => {
|
||||||
|
const currentYear = new Date().getFullYear()
|
||||||
|
const years = []
|
||||||
|
for (let i = 0; i < 6; i++) {
|
||||||
|
const year = currentYear + i
|
||||||
|
years.push({
|
||||||
|
label: `${year}年`,
|
||||||
|
value: year
|
||||||
|
})
|
||||||
|
}
|
||||||
|
yearOptions.value = years
|
||||||
|
}
|
||||||
|
|
||||||
|
// 学期选项
|
||||||
|
const termOptions = ref([
|
||||||
|
{ label: '春季学期', value: 'spring' },
|
||||||
|
{ label: '秋季学期', value: 'autumn' }
|
||||||
|
])
|
||||||
|
|
||||||
|
// 更新学期字符串
|
||||||
|
const updateSemester = () => {
|
||||||
|
const termMap = {
|
||||||
|
spring: '春',
|
||||||
|
autumn: '秋'
|
||||||
|
}
|
||||||
|
formData.semester = `${formData.semesterYear}${termMap[formData.semesterTerm]}`
|
||||||
|
}
|
||||||
|
|
||||||
|
// 解析学期数据(如"2025春")
|
||||||
|
const parseSemesterData = (semesterStr: string) => {
|
||||||
|
if (!semesterStr) return
|
||||||
|
|
||||||
|
// 提取年份(数字部分)
|
||||||
|
const yearMatch = semesterStr.match(/(\d{4})/)
|
||||||
|
if (yearMatch) {
|
||||||
|
formData.semesterYear = parseInt(yearMatch[1])
|
||||||
|
}
|
||||||
|
|
||||||
|
// 提取学期(春/秋)
|
||||||
|
if (semesterStr.includes('春')) {
|
||||||
|
formData.semesterTerm = 'spring'
|
||||||
|
} else if (semesterStr.includes('秋')) {
|
||||||
|
formData.semesterTerm = 'autumn'
|
||||||
|
}
|
||||||
|
|
||||||
|
// 更新学期字符串
|
||||||
|
formData.semester = semesterStr
|
||||||
|
}
|
||||||
|
|
||||||
// 文件上传相关方法
|
// 文件上传相关方法
|
||||||
const triggerFileUpload = () => {
|
const triggerFileUpload = () => {
|
||||||
fileInput.value?.click()
|
fileInput.value?.click()
|
||||||
@ -694,9 +785,11 @@ const handleSubmit = async () => {
|
|||||||
classId: formData.studentType === 'all' ? '' : formData.selectedClasses.join(','), // classId
|
classId: formData.studentType === 'all' ? '' : formData.selectedClasses.join(','), // classId
|
||||||
startTime: formData.startTime ? formatDateTime(formData.startTime) : null,
|
startTime: formData.startTime ? formatDateTime(formData.startTime) : null,
|
||||||
endTime: formData.endTime ? formatDateTime(formData.endTime) : null,
|
endTime: formData.endTime ? formatDateTime(formData.endTime) : null,
|
||||||
|
semester: formData.semester, // 学期
|
||||||
pauseExit: formData.stopOnLeave ? '1' : '0', // 离开页面停止播放
|
pauseExit: formData.stopOnLeave ? '1' : '0', // 离开页面停止播放
|
||||||
allowSpeed: formData.videoSpeedControl ? '1' : '0', // 视频倍数播放
|
allowSpeed: formData.videoSpeedControl ? '1' : '0', // 视频倍数播放
|
||||||
showSubtitle: formData.showVideoText ? '1' : '0', // 显示视频文本
|
showSubtitle: formData.showVideoText ? '1' : '0', // 显示视频文本
|
||||||
|
allowDownload: formData.allowDownload ? '1' : '0', // 允许下载课件
|
||||||
// 其他可选字段
|
// 其他可选字段
|
||||||
school: null,
|
school: null,
|
||||||
video: null,
|
video: null,
|
||||||
@ -828,6 +921,10 @@ const getClassList = async () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
|
// 初始化年份选项和默认学期字符串
|
||||||
|
initYearOptions();
|
||||||
|
updateSemester();
|
||||||
|
|
||||||
// 先加载基础数据(课程分类、老师、班级)
|
// 先加载基础数据(课程分类、老师、班级)
|
||||||
await Promise.all([
|
await Promise.all([
|
||||||
getCourseList(),
|
getCourseList(),
|
||||||
@ -1093,6 +1190,35 @@ onMounted(async () => {
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 学期选择器样式 */
|
||||||
|
.semester-container {
|
||||||
|
display: flex;
|
||||||
|
gap: 12px;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.semester-year-input {
|
||||||
|
flex: 1;
|
||||||
|
height: 42px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.semester-term-input {
|
||||||
|
flex: 1;
|
||||||
|
height: 42px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.semester-year-input :deep(.n-base-selection),
|
||||||
|
.semester-term-input :deep(.n-base-selection) {
|
||||||
|
--n-height: 42px !important;
|
||||||
|
height: 42px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.semester-year-input :deep(.n-base-selection-label),
|
||||||
|
.semester-term-input :deep(.n-base-selection-label) {
|
||||||
|
height: 42px !important;
|
||||||
|
line-height: 42px !important;
|
||||||
|
}
|
||||||
|
|
||||||
/* 课程封面上传区域 */
|
/* 课程封面上传区域 */
|
||||||
.cover-upload-container {
|
.cover-upload-container {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
Loading…
x
Reference in New Issue
Block a user