CakeCN/hsa
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Version 0.1.1 rise to flask app factory

Browse Source
This commit is contained in:
CakeCN
2025-08-27 19:39:38 +08:00
parent 8dba8688a7
commit 5c0187bc4b
55 changed files with 1708 additions and 613 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
Html/apps/templates/course.html Normal file
View File

@@ -0,0 +1,54 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>课程详情</title>
<link rel="stylesheet" href="/static/css/course.css">
</head>
<body>
{% include 'navbar.html' %} <!-- 引入navbar.html -->
<!-- 课程详情主体部分 -->
<div class="course-details">
<!-- 上半部分：课程封面和详情 -->
<div class="course-overview">
<div class="course-cover">
<img src="{{course_data.course_img_path}}" alt="课程封面" class="cover-image">
</div>
<div class="course-info">
<h2 class="course-title">{{course_data.course_name}}</h2>
<p class="course-author">作者：{{course_data.course_auther}}</p>
<p class="course-description">
{{course_data.description}}
</p>
</div>
</div>
<hr/>
<br/>
<!-- 下半部分：课程教案列表 -->
<div class="lesson-plans">
<!-- <h3>课程教案</h3> -->
<div class="lesson-cards">
<!-- 每个教案的卡片 -->
{% for lesson in course_data.lessons %}
<div class="lesson-card">
<img src="{{lesson.lesson_img_path}}" alt="教案封面" class="lesson-image">
<div class="lesson-info">
<h4 class="lesson-title">{{lesson.lesson_name}}</h4>
<p class="lesson-description">{{lesson.markdown}}</p>
</div>
</div>
{% endfor %}
</div>
</div>
</div>
</body>
<script>
var course_id = "{{course_id}}";
</script>
</html>

64
Html/apps/templates/dashboard.html Normal file
View File

@@ -0,0 +1,64 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>学生个人主页</title>
<link rel="stylesheet" href="/static/css/dashboard.css">
</head>
<body>
{% include 'navbar.html' %} <!-- 引入navbar.html -->
<!-- 主页主体部分 -->
<div class="dashboard">
<h2 class="dashboard-title">—— 我的选课 ——</h2>
<div class="course-cards" id="course-cards">
<!-- 每个课程的卡片 -->
<div class="course-card"onclick="openCourseProgress('algorithm')">
<img src="/static/image/algorithm/book_cover.png" alt="课程封面" class="course-image">
<div class="course-info">
<h3 class="course-name">算法分析与设计</h3>
<p class="course-description">学习基本的算法知识概念，与算法实现。</p>
</div>
</div>
<!-- 继续添加其他课程卡片 -->
<div class="course-card"onclick="openCourseProgress('data-structures')">
<img src="/static/image/algorithm/book_cover.png" alt="课程封面" class="course-image">
<div class="course-info">
<h3 class="course-name">数据结构与算法</h3>
<p class="course-description">深入学习数据结构和算法设计。</p>
</div>
</div>
<!-- 可以继续添加课程卡片 -->
</div>
</div>
<!-- 右侧滑出的学习进度卡片 -->
<div id="courseProgress" class="course-progress">
<div class="progress-header">
<span id="course-title"></span>
<button class="close-btn" onclick="closeCourseProgress()">×</button>
</div>
<div class="progress-content">
<p>当前学习进度: <span id="progress"></span></p>
<hr/>
<h3>章节列表：</h3>
<ul id="chapter-list">
<!-- 章节列表会在点击课程时动态生成 -->
</ul>
</div>
</div>
<script src="/static/js/dashboard.js"></script>
<script>
window.appData = {
user_data: JSON.parse(`{{user_data}}`.replace(/&#34;/g, "\"")),
user_course_data: JSON.parse(`{{user_course_data}}`.replace(/&#34;/g, "\""))
}
console.log(window.appData.user_data)
console.log(window.appData.user_course_data)
show_user_data(window.appData.user_data, window.appData.user_course_data)
</script>
</body>
</html>

217
Html/apps/templates/desktop.html Normal file
View File

@@ -0,0 +1,217 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Code Development Platform</title>
<style>
</style>
<link rel="stylesheet" href="/static/css/desktop.css">
<script>
document.cookie = "vscode-tkn=44edc269-6f88-46ab-9790-dc253f66ac36; path=/; SameSite=None; Secure";
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/1.1.1/marked.min.js"></script>
<script src="https://cdn.socket.io/4.0.0/socket.io.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.7/css/bootstrap.min.css" rel="stylesheet">
<script src="https://unpkg.com/split.js/dist/split.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
</head>
<body>
<div class="maxcontainer" id="maxcontainer">
<!-- 左侧内容 -->
<div class="sidebar" id="leftSidebar" style="width: 100%;height: 100%;">
<div id="markdown-content"style="width: 100%;height: 95%;">
<!-- 动态加载的 HTML 会显示在这里 -->
</div>
<div id="markdown-content-process"style="width: 100%;height: 5%;">
</div>
<div id="progress-detail" style="position: absolute; top: 0; left: 0; display: none; padding: 10px; background-color: rgba(0, 0, 0, 0.7); color: white; border-radius: 5px;">
<!-- 这里将显示鼠标悬停的详情 -->
</div>
</div>
<div id="dragbar"></div>
<!-- 中间嵌入的 Vscode-web 窗口，带有 tkn 参数 -->
<div class="vscode-web"id="vscodeWeb">
</div>
<div id="dragbar2"></div>
<!-- 右侧内容 -->
<div class="sidebar" id="rightSidebar"style="width: 100%;height: 100%;">
<div class="chatbox-header">
<div class="slider-container">
<label for="fontSizeSlider">Aa</label>
<input type="range" id="fontSizeSlider" min="12" max="24" value="16" />
</div>
<div class="language-toggle btn-group btn-group-toggle" data-toggle="buttons">
<label class="btn btn-outline-secondary " id="label_for_en">
<input type="radio" name="language" id="english" autocomplete="off" > En
</label>
<label class="btn btn-outline-secondary active" id="label_for_zh">
<input type="radio" name="language" id="chinese" autocomplete="off" checked> Zn
</label>
</div>
</div>
<div class="chatbox" id="chatbox" style="width: 100%;height: 80%;">
<!-- 消息会在这里显示 -->
</div>
<div class="input-area">
<textarea id="messageInput" rows="2" class="form-control" placeholder="输入你的消息 (支持 Markdown 语法)"></textarea>
<button class="btn btn-primary" onclick="sendMessage()">发送</button>
</div>
<script type="text/javascript">
window.appData = {
username:"{{user_id}}",
course_id:"{{course_id}}",
chapter_id:"{{chapter_id}}",
folder:"{{workspace_path}}"
}
</script>
</div>
</div>
<!-- 侧边工具栏 -->
<div class="sidebar-tools" id="sidebarTools">
<div class="tool-button" onclick="sendInitiativeFunctionCall('sample_judge')">
<div class="icon">+</div>
<div class="description">代码试运行</div>
</div>
<div class="tool-button" onclick="sendInitiativeFunctionCall('judge')">
<div class="icon">√</div>
<div class="description">代码提交</div>
</div>
<!-- <div class="tool-button">
<div class="icon">-</div>
<div class="description">工具2</div>
</div>
<div class="tool-button">
<div class="icon">?</div>
<div class="description">工具3</div>
</div> -->
</div>
<!-- 切换按钮 -->
<div class="toggle-button" id="toggleButton">
<div class="icon" id="toggleButton_icon">❮</div>
</div>
<script src="/static/js/chatbox.js"></script>
<script>
// 实现左右边栏可拖动
const dragbar = document.getElementById('dragbar');
const dragbar2 = document.getElementById('dragbar2');
const container = document.getElementById('maxcontainer');
let leftWidth = 300; // 设置左侧栏的初始宽度
let rightWidth = 300; // 设置右侧栏的初始宽度
let isDraggingLeft = false;
let isDraggingRight = false;
dragbar.addEventListener('mousedown', function() {
isDraggingLeft = true;
});
dragbar2.addEventListener('mousedown', function() {
isDraggingRight = true;
});
document.addEventListener('mousemove', function(e) {
if (isDraggingLeft) {
leftWidth = e.clientX; // 更新左侧栏宽度
container.style.gridTemplateColumns = `${leftWidth}px 5px 1fr 5px ${rightWidth}px`;
} else if (isDraggingRight) {
rightWidth = window.innerWidth - e.clientX; // 更新右侧栏宽度
container.style.gridTemplateColumns = `${leftWidth}px 5px 1fr 5px ${rightWidth}px`;
}
});
document.addEventListener('mouseup', function() {
isDraggingLeft = false;
isDraggingRight = false;
});
// 使用 fetch 发送请求到 Flask 服务器，获取 session 信息
fetch('/get_session', {
method: 'GET',
credentials: 'include' // 包含 Cookie，确保 Flask 可以识别 session
})
.then(response => {
if (response.ok) return response.json();
throw new Error('Failed to fetch session');
})
.then(data => {
console.log('Session data:', data);
// 在成功获取 session 后创建并插入 iframe
const iframe = document.createElement('iframe');
const sessionInfo = data
iframe.src = '{{vscode_web_url}}/?workspace={{workspace_path}}&folder={{workspace_path}}';
iframe.style.width = '100%';
iframe.style.height = '100%';
// 将 iframe 插入到指定的 div 中
document.getElementById('vscodeWeb').appendChild(iframe);
})
.catch(error => {
console.error('Error fetching session:', error);
});
// 动态加载 Markdown 文件
function loadMarkdown(course_id, filename) {
fetch(`/${course_id}-${filename}-markdown`)
.then(response => response.json())
.then(data => {
if (data.html_url) {
document.getElementById('markdown-content').innerHTML = `<iframe id="markdown-content-iframe" src="${data.html_url}"style="width: 100%;height: 100%;"></iframe>`;
document.getElementById('markdown-content-iframe').addEventListener('load', function() {
// 在这里执行你想要的操作
console.log('Iframe has finished loading');
next_chapter();
});
} else {
console.error('Markdown file not found');
}
})
.catch(error => {
console.error('Error loading markdown:', error);
});
}
document.addEventListener('DOMContentLoaded', function() {
loadMarkdown('{{course_id}}','{{chapter_id}}');
});
// 侧边工具栏切换
const sidebarTools = document.getElementById('sidebarTools');
const toggleButton = document.getElementById('toggleButton');
toggleButton.addEventListener('click', function() {
sidebarTools.classList.toggle('open');
toggleButton.classList.toggle('open');
if (document.getElementById('toggleButton_icon').innerText === '❮'){
document.getElementById('toggleButton_icon').innerText = '❯';
}else{
document.getElementById('toggleButton_icon').innerText = '❮';
}
});
</script>
</body>
</html>

44
Html/apps/templates/index.html Normal file
View File

@@ -0,0 +1,44 @@
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>课程选择主页</title>
<link rel="stylesheet" href="/static/css/index.css">
</head>
<body onload="init_index()" >
{% include 'navbar.html' %} <!-- 引入navbar.html -->
<main>
<div class="course-selection">
<h2>课程列表</h2>
<div class="course-list">
{% for course_id, course in courses_data.items() %}
<div class="course-card" onclick="show_course_details('{{ course_id }}')">
<img src="{{ course.course_img_path }}" alt="{{ course.course_name }}">
<h3>{{ course.course_name }}</h3>
<p>{{ course.course_description }}</p>
{% if course_id in selected_courses %}
<button class="selected-button">已选择</button>
{% else %}
<button class="select-button" data-course-id="{{course_id}}">选择课程</button>
{% endif %}
</div>
{% endfor %}
</div>
</div>
</main>
<footer>
<p>版权所有 &copy; 2024 “华实伴学君”——教学练评一体的虚拟编码助教</p>
</footer>
</body>
<script>
window.appData = {
user_selected_courses: JSON.parse(`{{selected_courses}}`.replace(/&#34;/g, "\""))
}
</script>
<script src="/static/js/index.js"></script>
</html>

47
Html/apps/templates/login.html Normal file
View File

@@ -0,0 +1,47 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>登录</title>
<link rel="stylesheet" href="/static/css/login.css">
<script src="/static/js/login.js"></script>
</head>
<body>
<div class="login-container">
<div class="login-card">
<h2 class="login-title">欢迎回来！</h2>
<form class="login-form" id="login-form">
<!-- 用户名字段 -->
<div class="input-group">
<label for="username" id="username-label">用户名</label>
<input type="text" id="username" name="username" placeholder="请输入用户名" required>
</div>
<!-- 密码字段 -->
<div class="input-group">
<label for="password" id="password-label">密码</label>
<input type="password" id="password" name="password" placeholder="请输入密码" required>
</div>
<button type="submit" class="login-btn">登录</button>
<!-- 切换角色按钮 -->
<div class="role-switch">
<button type="button" id="switch-role" class="role-btn">切换到教师登录</button>
</div>
<div class="register-link">
<a href="/register" id="register-link-href">注册新账号</a>
</div>
<div class="forgot-password">
<a href="#">忘记密码？</a>
</div>
</form>
</div>
</div>
</body>
</html>

99
Html/apps/templates/navbar.html Normal file
View File

@@ -0,0 +1,99 @@
<!-- 页眉导航栏 -->
<header class="navbar">
<style>
/* 页眉导航栏 */
.navbar {
display: flex;
justify-content: space-between;
align-items: center;
background-color: #2575fc;
padding: 10px 30px;
color: white;
border-radius: 10px;
margin: 20px;
margin-bottom: 30px;
}
.navbar .logo h1 {
font-size: 24px;
font-weight: bold;
}
.navbar-links a {
color: white;
text-decoration: none;
margin: 0 20px;
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;
cursor: pointer;
}
.avatar {
margin-left: 200px;
}
/* 控制浮框 */
.dropdown {
position: relative;
display: inline-block;
}
.dropdown-content {
display: none;
position: absolute;
right: 0;
background-color: white;
color: black;
min-width: 200px;
box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
border-radius: 10px;
z-index: 1;
padding: 10px;
font-size: 14px;
}
.dropdown-content a {
color: black;
text-decoration: none;
padding: 10px;
display: block;
transition: background-color 0.3s;
}
.dropdown-content a:hover {
background-color: #f1c40f;
}
/* 显示浮框 */
.dropdown:hover .dropdown-content {
display: block;
}
</style>
<div class="logo">
<h1>华实君：教学练评一体的虚拟助教</h1>
</div>
<nav class="navbar-links">
<a href="/">首页</a>
<a href="/dashboard">课程</a>
<a href="/">成绩</a>
</nav>
<div class="avatar dropdown">
<img src="/static/image/algorithm/book_cover.png" alt="个人头像" class="avatar-img">
<div class="dropdown-content">
<a href="/switch-role" id="switch-role">切换到学生/教师</a>
<a href="/logout" id="logout">注销</a>
</div>
</div>
</header>

36
Html/apps/templates/register.html Normal file
View File

@@ -0,0 +1,36 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>学生注册</title>
<link rel="stylesheet" href="/static/css/login.css">
<script src="/static/js/register.js"></script>
</head>
<body>
<div class="login-container">
<div class="login-card">
<h2 class="login-title">欢迎注册！</h2>
<form class="login-form" id="register-form">
<div class="input-group">
<label for="username">用户名</label>
<input type="text" id="username" name="username" placeholder="请输入用户名" required>
</div>
<div class="input-group">
<label for="email">邮箱</label>
<input type="email" id="email" name="email" placeholder="请输入邮箱" required>
</div>
<div class="input-group">
<label for="password">密码</label>
<input type="password" id="password" name="password" placeholder="请输入密码" required>
</div>
<div class="input-group">
<label for="confirm-password">确认密码</label>
<input type="password" id="confirm-password" name="confirm-password" placeholder="请确认密码" required>
</div>
<button type="submit" class="login-btn">注册</button>
</form>
</div>
</div>
</body>
</html>

36
Html/apps/templates/register_teacher.html Normal file
View File

@@ -0,0 +1,36 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>教师注册</title>
<link rel="stylesheet" href="/static/css/login.css">
<script src="/static/js/register_teacher.js"></script>
</head>
<body>
<div class="login-container">
<div class="login-card">
<h2 class="login-title">欢迎注册教师账号！</h2>
<form class="login-form" id="register-teacher-form">
<div class="input-group">
<label for="teacher-username">用户名</label>
<input type="text" id="teacher-username" name="teacher-username" placeholder="请输入用户名" required>
</div>
<div class="input-group">
<label for="teacher-email">邮箱</label>
<input type="email" id="teacher-email" name="teacher-email" placeholder="请输入邮箱" required>
</div>
<div class="input-group">
<label for="teacher-password">密码</label>
<input type="password" id="teacher-password" name="teacher-password" placeholder="请输入密码" required>
</div>
<div class="input-group">
<label for="teacher-confirm-password">确认密码</label>
<input type="password" id="teacher-confirm-password" name="teacher-confirm-password" placeholder="请确认密码" required>
</div>
<button type="submit" class="login-btn">注册</button>
</form>
</div>
</div>
</body>
</html>

137
Html/apps/templates/saveindex.html Normal file
View File

@@ -0,0 +1,137 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Code Development Platform</title>
<style>
</style>
<link rel="stylesheet" href="static/css/index.css">
<script>
document.cookie = "vscode-tkn=44edc269-6f88-46ab-9790-dc253f66ac36; path=/; SameSite=None; Secure";
</script>
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.5.1/socket.io.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.7/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="maxcontainer">
<!-- 左侧内容 -->
<div class="sidebar" id="leftSidebar" style="width: 20%;">
<h2>教材或题目</h2>
<p>这里是提供给学生的教材或题目，后台提供给Agent针对不同教材题目的Prompt。</p>
<div id="markdown-content">
<!-- 动态加载的 HTML 会显示在这里 -->
</div>
</div>
<!-- 拖动条 -->
<div class="resizer" id="dragbar"></div>
<!-- 中间嵌入的Vscode-web窗口，带有tkn参数 -->
<iframe src="http://127.0.0.1:9888/?workspace=/mnt/c/CAKE/vscode/example_folder&folder=/mnt/c/CAKE/vscode/example_folder" class="vscode-web" id="vscodeWeb" style="flex-grow: 1;"></iframe>
<!-- 拖动条 -->
<div class="resizer" id="dragbar2"></div>
<!-- 右侧内容 -->
<div class="sidebar" id="rightSidebar" >
<!-- 工具栏 -->
<div class="chatbox-header">
<!-- 字体大小调节滑块 -->
<div class="slider-container">
<label for="fontSizeSlider">Aa</label>
<input type="range" id="fontSizeSlider" min="12" max="24" value="16" />
</div>
<!-- 语言切换按钮 -->
<div class="language-toggle btn-group btn-group-toggle" data-toggle="buttons">
<label class="btn btn-outline-secondary active">
<input type="radio" name="language" id="english" autocomplete="off" checked> En
</label>
<label class="btn btn-outline-secondary">
<input type="radio" name="language" id="chinese" autocomplete="off"> Zn
</label>
</div>
</div>
<div class="chatbox" id="chatbox">
<!-- 消息会在这里显示 -->
</div>
<div class="input-area">
<textarea id="messageInput" rows="2" class="form-control" placeholder="输入你的消息 (支持 Markdown 语法)"></textarea>
<button class="btn btn-primary" onclick="sendMessage()">发送</button>
</div>
<!-- 聊天室js获取 -->
<script src="static/js/chatbox.js"></script>
</div>
</div>
<script>
// 实现左右边栏可拖动
const leftSidebar = document.getElementById('leftSidebar');
const rightSidebar = document.getElementById('rightSidebar');
const dragbar = document.getElementById('dragbar');
const dragbar2 = document.getElementById('dragbar2');
const vscodeWeb = document.getElementById('vscodeWeb');
let isDragging = false;
dragbar.addEventListener('mousedown', function(e) {
isDragging = true;
document.addEventListener('mousemove', resizeLeftSidebar);
});
dragbar2.addEventListener('mousedown', function(e) {
isDragging = true;
document.addEventListener('mousemove', resizeRightSidebar);
});
document.addEventListener('mouseup', function() {
isDragging = false;
document.removeEventListener('mousemove', resizeLeftSidebar);
document.removeEventListener('mousemove', resizeRightSidebar);
});
function resizeLeftSidebar(e) {
if (isDragging) {
let newWidth = e.clientX / window.innerWidth * 100;
leftSidebar.style.width = `${newWidth}%`;
vscodeWeb.style.flexGrow = 1;
}
}
function resizeRightSidebar(e) {
if (isDragging) {
let newWidth = (window.innerWidth - e.clientX) / window.innerWidth * 100;
rightSidebar.style.width = `${newWidth}%`;
vscodeWeb.style.flexGrow = 1;
}
}
// 动态加载 Markdown 文件
function loadMarkdown(filename) {
fetch(`/${filename}-markdown`)
.then(response => response.json())
.then(data => {
if (data.html_url) {
document.getElementById('markdown-content').innerHTML = `<iframe src="${data.html_url}" width="100%" height="600px"></iframe>`;
} else {
console.error('Markdown file not found');
}
})
.catch(error => {
console.error('Error loading markdown:', error);
});
}
window.onload = function() {
loadMarkdown('example');
};
</script>
</body>
</html>

81
Html/apps/templates/teacherboard.html Normal file
View File

@@ -0,0 +1,81 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>教师个人主页</title>
<link rel="stylesheet" href="/static/css/teacherboard.css">
<link rel="stylesheet" href="/static/css/dashboard.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
</head>
<body>
{% include 'navbar.html' %} <!-- 引入navbar.html -->
<!-- 主页主体部分 -->
<div class="teacherboard">
<h2 class="teacherboard-title">—— 我的课程 ——</h2>
<div class="course-cards" id="course-cards">
<!-- 每个课程的卡片 -->
<div class="course-card" onclick="openCourseDetails('algorithm')">
<img src="/static/image/algorithm/book_cover.png" alt="课程封面" class="course-image">
<div class="course-info">
<h3 class="course-name">算法分析与设计</h3>
<p class="course-description">学习基本的算法知识概念，与算法实现。</p>
</div>
</div>
<!-- 继续添加其他课程卡片 -->
<div class="course-card" onclick="openCourseDetails('data-structures')">
<img src="/static/image/algorithm/book_cover.png" alt="课程封面" class="course-image">
<div class="course-info">
<h3 class="course-name">数据结构与算法</h3>
<p class="course-description">深入学习数据结构和算法设计。</p>
</div>
</div>
<!-- 可以继续添加课程卡片 -->
</div>
</div>
<!-- 右侧滑出的课程目录 -->
<div id="courseDetails" class="course-details">
<div class="details-header">
<span id="course-title"></span>
<button class="close-btn" onclick="closeCourseDetails()">×</button>
</div>
<div class="details-content">
<h3>课程章节列表：</h3>
<ul id="chapter-list">
<!-- 章节列表会在点击课程时动态生成 -->
</ul>
<button class="add-chapter-btn" onclick="showInputForNewChapter()">新增章节</button>
</div>
</div>
<!-- 编辑章节或课时弹窗 -->
<div id="editModal" class="edit-modal">
<div class="edit-modal-content">
<h3>编辑章节/课时</h3>
<form id="edit-form">
<label for="edit-title">标题：</label>
<input type="text" id="edit-title" name="title" required><br>
<label for="edit-description">描述：</label>
<textarea id="edit-description" name="description"></textarea><br>
<button type="submit">保存</button>
<button type="button" onclick="closeEditModal()">取消</button>
</form>
</div>
</div>
<script src="/static/js/teacherboard.js"></script>
<script>
window.appData = {
user_data: JSON.parse(`{{user_data}}`.replace(/&#34;/g, "\"")),
user_course_data: JSON.parse(`{{user_course_data}}`.replace(/&#34;/g, "\""))
}
console.log(window.appData.user_data);
console.log(window.appData.user_course_data);
show_teacher_data(window.appData.user_data, window.appData.user_course_data);
</script>
</body>
</html>