126 lines
5.6 KiB
JavaScript
126 lines
5.6 KiB
JavaScript
// dashboard.js
|
||
let courseData;
|
||
function show_user_data(user_data, course_brief_data_list){
|
||
courseData = user_data.course_process_dict
|
||
for (let i=0;i<course_brief_data_list.length;i++){
|
||
course_brief_data = course_brief_data_list[i]
|
||
console.log(course_brief_data)
|
||
courseData[course_brief_data.course_id].course_id = course_brief_data.course_id;
|
||
courseData[course_brief_data.course_id].title = course_brief_data.course_name;
|
||
courseData[course_brief_data.course_id].lessons = course_brief_data.lessons;
|
||
courseData[course_brief_data.course_id].course_img_path = course_brief_data.course_img_path;
|
||
courseData[course_brief_data.course_id].course_description = course_brief_data.course_description;
|
||
courseData[course_brief_data.course_id].course_create_date = course_brief_data.course_create_date;
|
||
courseData[course_brief_data.course_id].course_update_data = course_brief_data.course_update_data;
|
||
}
|
||
for (var course in courseData){
|
||
courseData[course].chapters = courseData[course].lessons
|
||
console.log(courseData[course])
|
||
}
|
||
|
||
let courseCardsContainer = document.getElementById('course-cards');
|
||
courseCardsContainer.innerHTML = "";
|
||
for (var course in courseData){
|
||
course_id = course;
|
||
course = courseData[course];
|
||
let courseCard = document.createElement('div');
|
||
|
||
courseCard.className = 'course-card';
|
||
courseCard.innerHTML = `
|
||
<img src="${course.course_img_path}" alt="课程封面", class="course-image">
|
||
<div class="course-info">
|
||
<h3>${course.title}</h3>
|
||
<p>${course.course_description}</p>
|
||
</div>
|
||
<button class="select-button" >查看目录</button>
|
||
`;
|
||
courseCardsContainer.appendChild(courseCard);
|
||
courseCard.data = course_id
|
||
courseCard.addEventListener('click',() => {
|
||
openCourseProgress(courseCard.data);
|
||
});
|
||
}
|
||
}
|
||
function openCourseProgress(courseId) {
|
||
console.log(courseId)
|
||
const course = courseData[courseId];
|
||
if (!course) return;
|
||
|
||
// 更新右侧滑出卡片的内容
|
||
document.getElementById('course-title').textContent = course.title;
|
||
///////////////////////// course.progress;还没有计算
|
||
document.getElementById('progress').textContent = course.progress;
|
||
|
||
// 更新章节列表
|
||
const chapterList = document.getElementById('chapter-list');
|
||
chapterList.innerHTML = ''; // 清空之前的章节
|
||
|
||
course.chapters.forEach(chapter => {
|
||
const chapterItem = document.createElement('li');
|
||
chapterItem.classList.add('chapter-item');
|
||
|
||
const chapterTitle = document.createElement('div');
|
||
chapterTitle.classList.add('chapter-title');
|
||
chapterTitle.textContent = chapter.lesson_id;
|
||
chapterItem.appendChild(chapterTitle);
|
||
|
||
// 创建子章节
|
||
if (chapter.subChapters && chapter.subChapters.length > 0) {
|
||
const subChapterList = document.createElement('ul');
|
||
subChapterList.classList.add('sub-chapter-list');
|
||
|
||
chapter.subChapters.forEach(subChapter => {
|
||
const subChapterItem = document.createElement('li');
|
||
subChapterItem.classList.add('sub-chapter-item');
|
||
subChapterItem.textContent = subChapter;
|
||
console.log('-------------------')
|
||
console.log(course)
|
||
// 查找学生进度
|
||
for(let i = 0; i < course.lesson_processs.length; i++) {
|
||
if (course.lesson_processs[i][1] == chapter.lesson_id) {//确定lesson_id对应正确
|
||
console.log('-------------------')
|
||
console.log(course.lesson_processs[i][0])
|
||
lesson_chapters_progress = course.lesson_processs[i][0];//寻找对应的每一个章节的进度
|
||
for (let j=0; j<lesson_chapters_progress.length;j++){
|
||
chapter_progress = lesson_chapters_progress[j]
|
||
if(chapter_progress.title == subChapter){
|
||
subChapterItem.textContent += ("（已"+(chapter_progress.is_rebuttal?"申辩" : "完成")+" 得分"+ (chapter_progress.is_rebuttal?chapter_progress.rebuttal_score : chapter_progress.score) +"）");
|
||
}
|
||
}
|
||
if (course.lessons[i].progress === 1) {
|
||
subChapterItem.classList.add('completed');
|
||
}
|
||
break;
|
||
}
|
||
}
|
||
|
||
// 添加点击事件跳转到学习页面
|
||
subChapterItem.addEventListener('click', () => {
|
||
const courseId = encodeURIComponent(course.course_id); // 对课程名称进行编码
|
||
const url = `/desktop_nouser/${courseId}/${chapter.lesson_id}`;
|
||
window.location.href = url; // 跳转到该学习页面
|
||
});
|
||
|
||
subChapterList.appendChild(subChapterItem);
|
||
});
|
||
|
||
chapterItem.appendChild(subChapterList);
|
||
|
||
// 添加点击事件切换子章节显示
|
||
chapterItem.addEventListener('click', () => {
|
||
chapterItem.classList.toggle('open');
|
||
});
|
||
}
|
||
|
||
chapterList.appendChild(chapterItem);
|
||
});
|
||
|
||
// 打开滑出卡片
|
||
document.getElementById('courseProgress').classList.add('open');
|
||
}
|
||
|
||
function closeCourseProgress() {
|
||
// 关闭滑出卡片
|
||
document.getElementById('courseProgress').classList.remove('open');
|
||
}
|