feat：课程新增编辑添加学期和允许资源下载开关
This commit is contained in:
yuk255
parent
a4cd04429a
commit
8a2a8add39
@ -24,12 +24,6 @@
|
||||
<n-input v-model:value="formData.courseName" placeholder="请输入课程名称" class="form-input" />
|
||||
</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">
|
||||
<label class="form-label required">授课老师:</label>
|
||||
@ -37,6 +31,12 @@
|
||||
class="form-input" />
|
||||
</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">
|
||||
<label class="form-label required">参与学员:</label>
|
||||
@ -71,6 +71,17 @@
|
||||
class="form-input" />
|
||||
</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">
|
||||
<label class="form-label required">排序:</label>
|
||||
@ -120,6 +131,14 @@
|
||||
|
||||
<!-- 下半部分：设置选项 -->
|
||||
<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">
|
||||
<label class="form-label required">离开页面停止播放</label>
|
||||
@ -261,7 +280,12 @@ const formData = reactive({
|
||||
selectedClasses: [] as string[],
|
||||
courseCover: null as File | null,
|
||||
courseDescription: '',
|
||||
// 学期设置
|
||||
semesterYear: new Date().getFullYear(), // 当前年份
|
||||
semesterTerm: 'spring' as 'spring' | 'autumn', // 春季或秋季
|
||||
semester: '', // 最终的学期字符串，如"2025春"
|
||||
// 视频设置
|
||||
allowDownload: true,
|
||||
stopOnLeave: false,
|
||||
videoSpeedControl: false,
|
||||
showVideoText: false,
|
||||
@ -363,7 +387,14 @@ const loadCourseData = async () => {
|
||||
}
|
||||
}
|
||||
|
||||
// 学期数据回显
|
||||
if (storeCourseData.semester) {
|
||||
parseSemesterData(storeCourseData.semester);
|
||||
}
|
||||
|
||||
// 视频设置选项：从后端字段映射到前端字段（数字0/1转布尔值）
|
||||
formData.allowDownload = storeCourseData.allowDownload !== undefined ?
|
||||
Boolean(Number(storeCourseData.allowDownload)) : true;
|
||||
formData.stopOnLeave = storeCourseData.pauseExit !== undefined ?
|
||||
Boolean(Number(storeCourseData.pauseExit)) : true;
|
||||
formData.videoSpeedControl = storeCourseData.allowSpeed !== undefined ?
|
||||
@ -440,7 +471,14 @@ const loadCourseData = async () => {
|
||||
}
|
||||
}
|
||||
|
||||
// 学期数据回显
|
||||
if (courseData.semester) {
|
||||
parseSemesterData(courseData.semester);
|
||||
}
|
||||
|
||||
// 视频设置选项：从后端字段映射到前端字段（数字0/1转布尔值）
|
||||
formData.allowDownload = courseData.allowDownload !== undefined ?
|
||||
Boolean(Number(courseData.allowDownload)) : true;
|
||||
formData.stopOnLeave = courseData.pauseExit !== undefined ?
|
||||
Boolean(Number(courseData.pauseExit)) : true;
|
||||
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 }[])
|
||||
|
||||
// 学期年份选项（从当前年份开始，向后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 = () => {
|
||||
fileInput.value?.click()
|
||||
@ -694,9 +785,11 @@ const handleSubmit = async () => {
|
||||
classId: formData.studentType === 'all' ? '' : formData.selectedClasses.join(','), // classId
|
||||
startTime: formData.startTime ? formatDateTime(formData.startTime) : null,
|
||||
endTime: formData.endTime ? formatDateTime(formData.endTime) : null,
|
||||
semester: formData.semester, // 学期
|
||||
pauseExit: formData.stopOnLeave ? '1' : '0', // 离开页面停止播放
|
||||
allowSpeed: formData.videoSpeedControl ? '1' : '0', // 视频倍数播放
|
||||
showSubtitle: formData.showVideoText ? '1' : '0', // 显示视频文本
|
||||
allowDownload: formData.allowDownload ? '1' : '0', // 允许下载课件
|
||||
// 其他可选字段
|
||||
school: null,
|
||||
video: null,
|
||||
@ -828,6 +921,10 @@ const getClassList = async () => {
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
// 初始化年份选项和默认学期字符串
|
||||
initYearOptions();
|
||||
updateSemester();
|
||||
|
||||
// 先加载基础数据（课程分类、老师、班级）
|
||||
await Promise.all([
|
||||
getCourseList(),
|
||||
@ -1093,6 +1190,35 @@ onMounted(async () => {
|
||||
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 {
|
||||
flex: 1;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user