This commit is contained in:
CakeCN
2025-01-01 01:43:28 +08:00
parent 1280a978f5
commit eb67bcfb70
115 changed files with 989 additions and 535 deletions

View File

@@ -9,7 +9,6 @@
body {
font-family: 'Arial', sans-serif;
background-color: #f5f5f5;
padding: 20px;
}
/* 页眉导航栏 */
@@ -18,7 +17,6 @@ body {
justify-content: space-between;
align-items: center;
background-color: #2575fc;
padding: 10px 30px;
color: white;
border-radius: 10px;
margin-bottom: 30px;
@@ -74,14 +72,27 @@ body {
.course-card {
width: 300px;
height: 500px;
display: flex;
flex-direction: column;
background-color: white;
border-radius: 15px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
overflow: hidden;
position: relative;
transition: transform 0.3s;
}
.select-button {
display: block;
width: 100%;
padding: 10px;
background-color: #2575fc;
color: white;
border: none;
cursor: pointer;
font-size: 16px;
margin-top: auto; /* 将按钮推到父元素的底部 */
}
.course-card:hover {
transform: translateY(-10px); /* 提升效果 */
}

View File

@@ -1,38 +1,4 @@
/* 页眉导航栏 */
.navbar {
display: flex;
justify-content: space-between;
align-items: center;
background-color: #2575fc;
padding: 10px 30px;
color: white;
border-radius: 10px;
margin-bottom: 30px;
}
.navbar .logo h1 {
font-size: 24px;
font-weight: bold;
}
.navbar-links a {
color: white;
text-decoration: none;
margin: 0 15px;
font-size: 16px;
transition: color 0.3s;
}
.navbar-links a:hover {
color: #f1c40f;
}
.navbar .avatar img {
width: 40px;
height: 40px;
border-radius: 50%;
border: 2px solid white;
}
/* General reset */
* {
margin: 0;
@@ -42,12 +8,23 @@
/* Body & Page Background */
body {
display: flex;
font-family: 'Arial', sans-serif;
background-color: #f5f5f5;
padding: 20px;
flex-direction: column;
min-height: 100vh;
margin: 0;
}
main {
flex: 1;
}
footer {
background-color: #f8f9fa;
text-align: center;
padding: 10px 0;
}
/* Header styles */
header {
background-color: #2575fc;
@@ -105,14 +82,31 @@ main {
.course-card {
background-color: white;
display: flex;
flex-direction: column;
border-radius: 8px;
width: 300px;
height: 400px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
overflow: hidden;
transition: transform 0.3s ease;
margin: 0px;
}
.select-button {
display: block;
width: 100%;
padding: 10px;
background-color: #2575fc;
color: white;
border: none;
cursor: pointer;
font-size: 16px;
margin-top: auto; /* 将按钮推到父元素的底部 */
}
.course-card:hover {
transform: translateY(-10px); /* 提升效果 */
}
.course-card img {
width: 100%;
height: 261px;
@@ -131,19 +125,22 @@ main {
color: #555;
}
.select-button {
.select-button:hover {
background-color: #113c86;
}
.selected-button {
display: block;
width: 100%;
padding: 10px;
background-color: #2575fc;
background-color: #8a8b8c;
color: white;
border: none;
cursor: pointer;
font-size: 16px;
}
.select-button:hover {
background-color: #113c86;
cursor: not-allowed;
margin-top: auto; /* 将按钮推到父元素的底部 */
}
/* Footer styles */

View File

@@ -31,10 +31,15 @@ document.addEventListener('DOMContentLoaded', function() {
const approveButton = document.createElement('button');
approveButton.innerText = '批准';
approveButton.data = element;
approveButton.style.width = '100%';
approveButton.style.maxHeight = '30px';
approveButton.onclick = function(event) {
console.log(element)
socket.emit('message', JSON.stringify({type:'function', data:element}));
event.currentTarget.disabled = true;
event.currentTarget.style.backgroundColor = 'gray';
event.currentTarget.style.color = 'white'; // 可选:设置文字颜色为白色,以便更清晰地显示
event.currentTarget.style.border = 'none'; // 可选:去掉边框
};
// 将按钮添加到消息气泡中
requestMessage.innerHTML = `<b>Function:</b> ${element.name}(${JSON.stringify(element.arguments)})<br>`;
@@ -56,7 +61,7 @@ document.addEventListener('DOMContentLoaded', function() {
console.log(data)
const scoreMessage = document.createElement('div');
scoreMessage.className = 'chat-message server-message';
scoreMessage.innerHTML = `<b>Chapter ${data.chapter_id} Score:</b> ${data.data}`;
scoreMessage.innerHTML = `<b>Chapter ${data.chapter_id} Score:</b> ${JSON.stringify(data.data.content.speak)}`;
document.getElementById('chatbox').appendChild(scoreMessage);
document.getElementById('chatbox').scrollTop = document.getElementById('chatbox').scrollHeight;
})

View File

@@ -1,70 +1,54 @@
// 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) {
const courseData = {
'algorithm': {
title: '算法分析与设计',
progress: '50%',
chapters: [
{
title: '第一章: 算法基础',
subChapters: [
{ title: '子章节1: 算法介绍', path: 'introduction' },
{ title: '子章节2: 时间复杂度分析', path: 'time-complexity' }
]
},
{
title: '第二章: 排序与查找',
subChapters: [
{ title: '子章节1: 排序算法', path: 'sorting-algorithms' },
{ title: '子章节2: 查找算法', path: 'searching-algorithms' }
]
},
{
title: '第三章: 图算法',
subChapters: [
{ title: '子章节1: 图的表示', path: 'graph-representation' },
{ title: '子章节2: DFS 与 BFS', path: 'dfs-bfs' }
]
}
]
},
'data-structures': {
title: '数据结构与算法',
progress: '30%',
chapters: [
{
title: '第一章: 数组与链表',
subChapters: [
{ title: '子章节1: 数组基础', path: 'array-basics' },
{ title: '子章节2: 链表实现', path: 'linked-list' }
]
},
{
title: '第二章: 栈与队列',
subChapters: [
{ title: '子章节1: 栈的实现', path: 'stack-implementation' },
{ title: '子章节2: 队列的应用', path: 'queue-application' }
]
},
{
title: '第三章: 二叉树',
subChapters: [
{ title: '子章节1: 二叉树的遍历', path: 'binary-tree-traversal' },
{ title: '子章节2: 二叉查找树', path: 'binary-search-tree' }
]
}
]
}
// 可以继续添加其他课程的数据
};
// 获取对应课程的数据
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;
// 更新章节列表
@@ -77,25 +61,43 @@ function openCourseProgress(courseId) {
const chapterTitle = document.createElement('div');
chapterTitle.classList.add('chapter-title');
chapterTitle.textContent = 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.title;
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 userId = 'userid'; // 这里可以动态传入当前用户ID
const courseName = encodeURIComponent(course.title); // 对课程名称进行编码
const subChapterPath = subChapter.path; // 子章节路径
const url = `/desktop/${userId}/${courseName}/${subChapterPath}`;
const courseId = encodeURIComponent(course.course_id); // 对课程名称进行编码
const url = `/desktop_nouser/${courseId}/${chapter.lesson_id}`;
window.location.href = url; // 跳转到该学习页面
});

42
Html/static/js/index.js Normal file
View File

@@ -0,0 +1,42 @@
function show_books(courses_data, user_selected_courses){
console.log(courses_data)
console.log(user_selected_courses)
}
function show_course_details(course_id){
window.location.href = '/course/' + course_id
}
document.addEventListener('DOMContentLoaded', function() {
const selectButtons = document.querySelectorAll('.select-button');
selectButtons.forEach(button => {
button.addEventListener('click', function(event) {
event.stopPropagation(); // 阻止事件冒泡
const courseId = this.getAttribute('data-course-id');
fetch(`/select_course`, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'X-CSRFToken': '{{ csrf_token() }}' // 如果使用 CSRF 保护
},
body: JSON.stringify({ course_id: courseId })
})
.then(response => response.json())
.then(data => {
if (data.success) {
// 更新按钮样式或显示消息
this.classList.remove('select-button');
this.classList.add('selected-button');
this.textContent = '已选择';
alert('选择课程成功');
} else {
alert('选择课程失败');
}
})
.catch(error => {
console.error('Error:', error);
alert('选择课程失败');
});
});
});
});

View File

@@ -0,0 +1,39 @@
document.addEventListener('DOMContentLoaded', function() {
const registerForm = document.getElementById('register-form');
registerForm.addEventListener('submit', function(event) {
event.preventDefault(); // 阻止表单默认提交行为
const username = document.getElementById('username').value;
const email = document.getElementById('email').value;
const password = document.getElementById('password').value;
const confirmPassword = document.getElementById('confirm-password').value;
if (password !== confirmPassword) {
alert('密码和确认密码不一致');
return;
}
fetch('/register_post', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'X-CSRFToken': '{{ csrf_token() }}' // 如果使用 CSRF 保护
},
body: JSON.stringify({ username, email, password })
})
.then(response => response.json())
.then(data => {
if (data.success) {
alert('注册成功');
window.location.href = '/login'; // 注册成功后跳转到登录页面
} else {
alert('注册失败: ' + data.message);
}
})
.catch(error => {
console.error('Error:', error);
alert('注册失败');
});
});
});