Compare commits
3 Commits
042f6ee99e
...
643c16fdf7
| Author | SHA1 | Date | |
|---|---|---|---|
| 643c16fdf7 | |||
| 5082436289 | |||
| 7193b9a000 |
@@ -1,41 +1,53 @@
|
||||
function show_books(courses_data, user_selected_courses){
|
||||
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
|
||||
function show_course_details(course_id) {
|
||||
window.location.href = '/course/' + course_id
|
||||
}
|
||||
|
||||
function on_click_select_course(event){
|
||||
function on_click_select_course(event) {
|
||||
event.stopPropagation(); // 阻止事件冒泡
|
||||
const courseId = event.currentTarget.getAttribute('data-course-id');
|
||||
if (event.currentTarget.classList.contains("selected-button")) {alert('课程已选择'); return;}
|
||||
const button = event.currentTarget;
|
||||
const courseId = button.getAttribute('data-course-id');
|
||||
if (!courseId) { alert('缺少课程ID'); return; }
|
||||
if (button.classList.contains("selected-button")) { alert('课程已选择'); return; }
|
||||
if (button.disabled) { return; }
|
||||
button.disabled = true;
|
||||
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 = '已选择';
|
||||
.then(async (response) => {
|
||||
let data = null;
|
||||
try {
|
||||
data = await response.json();
|
||||
} catch (_) {
|
||||
}
|
||||
if (!response.ok) {
|
||||
throw new Error(data?.message || `请求失败(${response.status})`);
|
||||
}
|
||||
return data;
|
||||
})
|
||||
.then((data) => {
|
||||
if (!data?.success) {
|
||||
throw new Error(data?.message || '选择课程失败');
|
||||
}
|
||||
button.classList.remove('select-button');
|
||||
button.classList.add('selected-button');
|
||||
button.textContent = '已选课';
|
||||
alert('选择课程成功');
|
||||
} else {
|
||||
alert('选择课程失败');
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
alert('选择课程失败');
|
||||
});
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
alert(error?.message || '选择课程失败');
|
||||
button.disabled = false;
|
||||
});
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,8 +1,9 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>课程选择主页</title>
|
||||
<meta charset="UTF-8">
|
||||
<title>课程选择主页</title>
|
||||
<script src="/static/cdnback/jquery.min.js"></script>
|
||||
|
||||
<link href="/static/cdnback/bootstrap.min.css" rel="stylesheet">
|
||||
@@ -12,6 +13,7 @@
|
||||
<script src="/static/cdnback/js/bootstrap.bundle.min.js"></script>
|
||||
<link rel="stylesheet" href="/static/css/index.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
{% include 'navbar.html' %}
|
||||
|
||||
@@ -38,7 +40,7 @@
|
||||
<h2>课程列表</h2>
|
||||
<div class="course-cards" id="course-cards">
|
||||
{% for course in courses_data %}
|
||||
<!-- <div class="course-card" onclick="show_course_details('{{ course._id }}')">
|
||||
<!-- <div class="course-card" onclick="show_course_details('{{ course._id }}')">
|
||||
<img src="{{ course.image_url }}" alt="{{ course.course_name }}">
|
||||
<h3>{{ course.name }}</h3>
|
||||
<p>{{ course.description }}</p>
|
||||
@@ -49,10 +51,9 @@
|
||||
{% endif %}
|
||||
</div> -->
|
||||
|
||||
<div class="col-md-6 col-lg-4">
|
||||
<div class="col-md-6 col-lg-4">
|
||||
<div class="course-card card h-100" onclick="openCourseProgress('{{course._id}}')">
|
||||
<img src="{{course.image_url}}"
|
||||
class="course-img" alt="课程封面">
|
||||
<img src="{{course.image_url}}" class="course-img" alt="课程封面">
|
||||
<div class="card-body d-flex flex-column">
|
||||
<span class="course-category">算法设计</span>
|
||||
<h5 class="course-title">{{course.name}}</h5>
|
||||
@@ -62,11 +63,15 @@
|
||||
<span class="course-rating"><i class="fas fa-star"></i> 4.7</span>
|
||||
</div>
|
||||
<div class="mt-auto d-grid gap-2 d-md-flex">
|
||||
<button class="btn btn-view flex-fill" onclick="btn_view(event,'{{course._id}}')"><i class="far fa-eye me-1"></i> 课程</button>
|
||||
<button class="btn btn-view flex-fill" onclick="btn_view(event,'{{course._id}}')"><i
|
||||
class="far fa-eye me-1"></i> 课程</button>
|
||||
{% if course._id in selected_courses %}
|
||||
<button class="btn btn-process flex-fill selected-button" data-course-id="{{course._id}}">已选课</button>
|
||||
<button class="btn btn-process flex-fill selected-button"
|
||||
data-course-id="{{course._id}}">已选课</button>
|
||||
{% else %}
|
||||
<button class="btn btn-process flex-fill select-button" onclick="on_click_select_course(event)" data-course-id="{{course._id}}">选择课程</button>
|
||||
<button class="btn btn-process flex-fill select-button"
|
||||
onclick="on_click_select_course(event)"
|
||||
data-course-id="{{course._id}}">选择课程</button>
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
@@ -74,13 +79,13 @@
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
|
||||
{% include 'footer-brief.html' %}
|
||||
{% include 'footer-brief.html' %}
|
||||
</body>
|
||||
<script>
|
||||
window.appData = {
|
||||
@@ -88,5 +93,6 @@
|
||||
}
|
||||
</script>
|
||||
<script src="/static/js/index.js"></script>
|
||||
</html>
|
||||
<script src="/static/js/dashboard.js"></script>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user