Version 0.1.1 rise to flask app factory

Html/apps/static/js/chatbox.js

@@ -0,0 +1,258 @@
+
+var socket;
+let system_message_idx=0
+document.addEventListener('DOMContentLoaded', function() {
+    data = window.appData;
+    console.log(data);
+    socket = io('ws://localhost:5551/agent',{
+        query:{
+            username:data.username,
+            folder:data.folder
+        }
+    });
+    socket.on('connect', function() {
+        console.log('Connected to server');
+        socket.emit('login',JSON.stringify(data));
+    });
+    // 监听来自服务器的消息
+    socket.on('message', function(data) {
+        // 显示服务器的回复消息
+        const serverMessage = document.createElement('div');
+        serverMessage.innerHTML = `<div class="chat-message server-message"><b>华实君:</b> ${marked.parse(data)}</div>`;
+        document.getElementById('chatbox').appendChild(serverMessage);
+
+        // 滚动到最新消息
+        document.getElementById('chatbox').scrollTop = document.getElementById('chatbox').scrollHeight;
+    });
+    socket.on('request_function', function(data){
+        try {
+            console.log("request_function", data);
+            if (typeof data === 'string') {
+                data = JSON.parse(data);
+            }
+            for (let i = 0; i < data.length; i++) {
+                const element = data[i]
+                const requestMessage = document.createElement('div');
+                requestMessage.className = 'chat-message server-message';
+                const approveButton = document.createElement('button');
+                approveButton.innerText = '批准';
+                approveButton.data = element;
+                approveButton.style.width = '100%';
+                approveButton.style.borderRadius = '4px';
+                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>`;
+                requestMessage.appendChild(approveButton);
+                document.getElementById('chatbox').appendChild(requestMessage);
+                document.getElementById('chatbox').scrollTop = document.getElementById('chatbox').scrollHeight;
+            }
+        } catch (error) {
+            console.log(error)
+        }
+    });
+    socket.on('next_chapter', function(data){
+        next_chapter(data);
+    });
+    socket.on('chapter_score',function(data){
+        if (typeof data === 'string'){
+            data = JSON.parse(data);
+        }
+        console.log(data)
+        const scoreMessage = document.createElement('div');
+        scoreMessage.className = 'chat-message server-message';
+        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;
+    })
+    socket.on('system_message',function(data){
+        console.log(data)
+        let systemMessage = document.createElement('div');
+        systemMessage.className = 'chat-message server-message';
+        let closeButton = document.createElement('button');
+        closeButton.className = 'close-button'; // 可以根据需要添加样式类
+        closeButton.innerHTML = '×'; // 关闭按钮的文本内容
+        closeButton.style.marginRight = '10px'; // 可选：设置关闭按钮的右边距
+        
+        systemMessage.appendChild(closeButton);
+        systemMessage.innerHTML += `<b>系统提示: </b> ${data}`;
+        systemMessage.id = 'system_message_'+system_message_idx;
+        system_message_idx+=1
+        document.getElementById('chatbox').appendChild(systemMessage);
+        document.getElementById('chatbox').scrollTop = document.getElementById('chatbox').scrollHeight;
+        $('.close-button').on('click', function(event) {
+            $(this).css({
+                'background-color': 'gray',
+                'color': 'white', // 可选：设置文字颜色为白色，以便更清晰地显示
+                'border': 'none'  // 可选：去掉边框
+            });
+            $(this).parent().remove();
+        });
+        setTimeout(function() {
+            $(systemMessage.id).remove();
+        }, 5000); // 5000 毫秒 = 5 秒
+    })
+});
+
+
+// 控制文字大小的滑块
+const fontSizeSlider = document.getElementById('fontSizeSlider');
+const chatbox = document.getElementById('chatbox');
+
+fontSizeSlider.addEventListener('input', function() {
+    console.log(fontSizeSlider.value);
+    chatbox.style.fontSize = fontSizeSlider.value + 'px';
+});
+
+// 语言切换按钮
+const englishRadio = document.getElementById('english');
+const chineseRadio = document.getElementById('chinese');
+
+const englishLabel = document.getElementById('label_for_en');
+const chineseLabel = document.getElementById('label_for_zh');
+let language = 'zh';  // 默认语言
+
+// 切换语言事件
+englishRadio.addEventListener('change', function() {
+    if (englishRadio.checked) {
+        language = 'en';
+        englishLabel.classList.add('active');
+        chineseLabel.classList.remove('active');
+    }
+    socket.emit('language',language);
+});
+
+chineseRadio.addEventListener('change', function() {
+    if (chineseRadio.checked) {
+        language = 'zh';
+        chineseLabel.classList.add('active');
+        englishLabel.classList.remove('active');
+    }
+    socket.emit('language',language);
+});
+
+
+function sendInitiativeFunctionCall(function_name){
+    socket.emit('initiative', {'name': function_name});
+}
+// 发送消息
+function sendMessage() {
+    const input = document.getElementById('messageInput').value;
+    if (input.trim() === '') return;
+
+    // 使用 marked.js 解析 markdown
+    const markdownHtml = marked.parse(input);
+
+    // 显示用户发送的消息
+    const userMessage = document.createElement('div');
+    userMessage.innerHTML = `<div class="chat-message user-message"><b>你:</b> ${markdownHtml}</div>`;
+    document.getElementById('chatbox').appendChild(userMessage);
+
+    // 发送消息到服务器
+    socket.emit('message', JSON.stringify({data: input, type:'text'}));
+
+    // 清空输入框
+    document.getElementById('messageInput').value = '';
+
+    // 滚动到最新消息
+    document.getElementById('chatbox').scrollTop = document.getElementById('chatbox').scrollHeight;
+}
+
+let currentChapterIndex = -1;
+function next_chapter(data) {
+    // 获取所有的 h3 元素
+    var iframe = document.getElementById('markdown-content-iframe');
+
+    // 访问 iframe 的文档对象
+    var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
+    var titles = []
+    var h3Elements = iframeDocument.querySelectorAll('h3');
+    console.log("h3Elements next")
+    if (currentChapterIndex >= h3Elements.length) {
+        return; // 如果已经到了最后一个章节，则不进行任何操作
+    }
+
+    // 隐藏当前章节及其后的内容
+    for (let i = 0; i < h3Elements.length; i++) {
+        h3Elements[i].style.display = 'none';
+        titles.push(h3Elements[i].innerText)
+        let nextSibling = h3Elements[i].nextElementSibling;
+        while (nextSibling && nextSibling.tagName !== 'H3') {
+            nextSibling.style.display = 'none';
+            nextSibling = nextSibling.nextElementSibling;
+        }
+    }
+
+    // 显示下一个章节及其后的内容，直到再下一个h3元素或结束
+    if (currentChapterIndex + 1 < h3Elements.length) {
+        h3Elements[currentChapterIndex + 1].style.display = 'block';
+        let nextSibling = h3Elements[currentChapterIndex + 1].nextElementSibling;
+        while (nextSibling && nextSibling.tagName !== 'H3') {
+            nextSibling.style.display = 'block';
+            nextSibling = nextSibling.nextElementSibling;
+        }
+    }
+    currentChapterIndex++;
+
+    generateProgressBar(h3Elements.length, currentChapterIndex, titles);
+}
+
+function generateProgressBar(N, idx, titles) {
+    const container = document.getElementById('markdown-content-process');
+    container.innerHTML = ''; // 清空内容
+    
+    // 创建进度条的外框
+    const progressBox = document.createElement('div');
+    progressBox.className = 'progress-box';
+    
+    // 获取详细信息容器
+    const detailBox = document.getElementById('progress-detail');
+    
+    // 根据N值动态调整每个进度节点的宽度
+    const nodeWidth = 100 / N;  // 每个节点的宽度为 100% / N
+    
+    // 根据N值生成子框并设置颜色
+    for (let i = 0; i < N; i++) {
+        const titleBox = document.createElement('div');
+        titleBox.className = 'progress-title';
+        
+        // 设置进度条的颜色
+        if (i < idx) {
+            titleBox.classList.add('green'); // 已完成部分
+        } else {
+            titleBox.classList.add('white'); // 未完成部分
+        }
+
+        // 设置每个子框的标题
+        titleBox.innerHTML = titles[i] || `Step ${i + 1}`;
+
+        // 设置每个进度节点的宽度
+        titleBox.style.width = `${nodeWidth}%`;
+
+        // 监听鼠标移入事件来显示详情
+        titleBox.addEventListener('mouseenter', function() {
+            detailBox.innerHTML = `Step ${i + 1}: ${titles[i] || "No title"}`;// - Additional details here...`;
+            detailBox.style.display = 'block';
+            // 根据进度条位置显示详情
+            const rect = titleBox.getBoundingClientRect();
+            detailBox.style.top = `${rect.top + window.scrollY - 100}px`;  // 微调位置
+            detailBox.style.left = `${rect.left + window.scrollX + rect.width / 2 - detailBox.offsetWidth / 2}px`;
+        });
+
+        // 监听鼠标移出事件来隐藏详情
+        titleBox.addEventListener('mouseleave', function() {
+            detailBox.style.display = 'none';
+        });
+
+        progressBox.appendChild(titleBox);
+    }
+
+    // 将生成的进度条添加到容器中
+    container.appendChild(progressBox);
+}

Html/apps/static/js/dashboard.js

@@ -0,0 +1,125 @@
+// 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');
+}

Html/apps/static/js/index.js

@@ -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('选择课程失败');
+            });
+        });
+    });
+});

Html/apps/static/js/login.js

@@ -0,0 +1,87 @@
+document.addEventListener('DOMContentLoaded', function() {
+    const switchRoleButton = document.getElementById('switch-role');
+    const loginForm = document.getElementById('login-form');
+    const usernameLabel = document.getElementById('username-label');
+    const usernameInput = document.getElementById('username');
+    const passwordInput = document.getElementById('password');
+    const registerLinkHref = document.getElementById('register-link-href');
+
+    let isTeacherLogin = false;
+
+    // 切换角色按钮点击事件
+    switchRoleButton.addEventListener('click', function() {
+        isTeacherLogin = !isTeacherLogin;  // 切换状态
+        toggleButtonColor(isTeacherLogin);
+        toggleLoginFields(isTeacherLogin);
+    });
+    // 根据角色切换按钮背景色
+    function toggleButtonColor(isTeacher) {
+        if (isTeacher) {
+            loginForm.classList.add('teacher-login');
+        } else {
+            loginForm.classList.remove('teacher-login');
+        }
+    }
+    // 切换显示不同的表单字段
+    function toggleLoginFields(isTeacher) {
+        if (isTeacher) {
+            // 显示教师登录字段
+            usernameLabel.textContent = '教师用户名';
+            switchRoleButton.textContent = '切换到学生登录'; // 更新按钮文本
+            registerLinkHref.href = '/register_teacher';
+            registerLinkHref.textContent = '注册新教师账号';
+        } else {
+            // 显示学生登录字段
+            usernameLabel.textContent = '学生用户名';
+            switchRoleButton.textContent = '切换到教师登录'; // 更新按钮文本
+            registerLinkHref.href = '/register';
+            registerLinkHref.textContent = '注册新学生账号';
+        }
+    }
+
+    // 处理登录提交
+    loginForm.addEventListener('submit', function(event) {
+        event.preventDefault();  // 防止默认提交
+
+        const username = usernameInput.value.trim();
+        const password = passwordInput.value.trim();
+
+        if (!username || !password) {
+            alert('请填写所有必需的字段');
+            return;
+        }
+
+        // 登录请求的 URL 依据角色不同而不同
+        const loginUrl = isTeacherLogin ? '/login_teacher_post' : '/login_post';
+
+        const data = isTeacherLogin ? { username, password } : { username, password };
+
+        // 发送登录请求
+        fetch(loginUrl, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify(data)  // 将数据发送到后端
+        })
+        .then(response => response.json())
+        .then(data => {
+            if (data.success) {
+                // 登录成功，跳转到主页
+                if (isTeacherLogin) {
+                    window.location.href = '/teacherboard';
+                } else {
+                    window.location.href = '/dashboard';
+                }
+            } else {
+                // 登录失败，提示错误信息
+                alert('登录失败: ' + data.message);
+            }
+        })
+        .catch(error => {
+            console.error('Error:', error);
+            alert('登录请求失败，请稍后重试');
+        });
+    });
+
+});

Html/apps/static/js/register.js

@@ -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('注册失败');
+        });
+    });
+});

Html/apps/static/js/register_teacher.js

@@ -0,0 +1,41 @@
+document.addEventListener('DOMContentLoaded', function() {
+    const registerTeacherForm = document.getElementById('register-teacher-form');
+
+    registerTeacherForm.addEventListener('submit', function(event) {
+        event.preventDefault(); // 阻止表单默认提交行为
+
+        const username = document.getElementById('teacher-username').value;
+        const email = document.getElementById('teacher-email').value;
+        const password = document.getElementById('teacher-password').value;
+        const confirmPassword = document.getElementById('teacher-confirm-password').value;
+
+        // 检查密码和确认密码是否一致
+        if (password !== confirmPassword) {
+            alert('密码和确认密码不一致');
+            return;
+        }
+
+        // 使用 Fetch API 发送注册请求
+        fetch('/register_teacher_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('注册失败');
+        });
+    });
+});

Html/apps/static/js/teacherboard.js

@@ -0,0 +1,189 @@
+function lessonTemplate(lesson) {
+    return `
+        <li class="lesson-item">
+            <span class="lesson-text" onclick="editLesson('${lesson}')">${lesson}
+                <button class="icon-btn edit-btn" onclick="editLesson('${lesson}')">
+                    <i class="fas fa-pencil-alt"></i>
+                </button>
+            </span>
+            <button class="icon-btn delete-btn" onclick="deleteLesson('${lesson}')">
+                <i class="fas fa-trash-alt"></i>
+            </button>
+        </li>
+    `;
+}
+
+function show_teacher_data(user_data, user_course_data) {
+    // 这里可以根据user_course_data生成课程卡片
+    const courseCardsContainer = document.getElementById('course-cards');
+    user_course_data.forEach(course => {
+        const courseCard = document.createElement('div');
+        courseCard.classList.add('course-card');
+        courseCard.onclick = function() { openCourseDetails(course.id); };
+        courseCard.innerHTML = `
+            <img src="${course.cover_image}" alt="课程封面" class="course-image">
+            <div class="course-info">
+                <h3 class="course-name">${course.name}</h3>
+                <p class="course-description">${course.description}</p>
+            </div>
+        `;
+        courseCardsContainer.appendChild(courseCard);
+    });
+}
+let isAddingChapter = false;
+
+function showInputForNewChapter() {
+    if (isAddingChapter) return; // 防止重复点击
+
+    isAddingChapter = true;  // 标记正在添加章节
+
+    // 找到新增章节按钮并隐藏
+    const addButton = document.querySelector('.add-chapter-btn');
+    addButton.style.display = 'none';
+
+    // 创建一个输入框
+    const input = document.createElement('input');
+    input.type = 'text';
+    input.placeholder = '请输入章节名称...';
+    input.className = 'new-chapter-input';
+    input.onblur = () => checkAndAddChapter(input);
+    
+    // 将输入框插入到页面
+    const chapterList = document.getElementById('chapter-list');
+    chapterList.appendChild(input);
+    input.focus(); // 聚焦到输入框
+}
+
+function checkAndAddChapter(input) {
+    const chapterName = input.value.trim();
+
+    // 如果章节名称为空，显示提示并不添加
+    if (!chapterName) {
+        input.remove();  // 删除输入框
+        document.querySelector('.add-chapter-btn').style.display = 'block'; // 重新显示新增章节按钮
+        isAddingChapter = false;
+        return;
+    }
+
+    // 如果章节名称合法，添加到章节列表
+    const chapterList = document.getElementById('chapter-list');
+    const chapterItem = document.createElement('li');
+    chapterItem.innerHTML = `
+        <li class="lesson-item">
+        <strong>${chapterName}</strong> <button class="icon-btn delete-btn" onclick="deleteChapter(this)">
+            <i class="fas fa-trash-alt"></i>
+        </button>
+        </li>
+        <ul>
+        </ul>
+        <button class="add-lesson-btn" onclick="showInputForNewLesson('${chapterName}', this)">新增课时</button>
+       
+    `;
+    chapterList.appendChild(chapterItem);
+    // 恢复新增按钮的显示
+    document.querySelector('.add-chapter-btn').style.display = 'block';
+    input.remove();
+    isAddingChapter = false;
+}
+function openCourseDetails(courseId) {
+    // 打开课程目录
+    const courseDetails = document.getElementById('courseDetails');
+    const courseTitle = document.getElementById('course-title');
+    courseTitle.textContent = "课程名称: " + courseId; // 假设这里显示课程ID，实际情况应该是课程名称
+    
+    courseDetails.classList.add('open');
+
+    // 获取章节数据并渲染
+    renderChapters(courseId);
+}
+function deleteChapter(deleteButton) {
+    // 删除章节
+    const chapterItem = deleteButton.closest('li');
+    chapterItem.remove();
+}
+function renderChapters(courseId) {
+    const chapterList = document.getElementById('chapter-list');
+    chapterList.innerHTML = ""; // 清空章节列表
+
+    // 假设从服务器获取课程章节数据
+    const chapters = [
+        { title: "第一章：算法基础", lessons: ["算法简介", "算法设计方法"] },
+        { title: "第二章：数据结构", lessons: ["数组", "链表"] }
+    ];
+
+    chapters.forEach(chapter => {
+        const chapterItem = document.createElement('li');
+        
+        // 渲染章节标题
+        let lessonsHtml = chapter.lessons.map(lesson => lessonTemplate(lesson)).join('');
+        
+        chapterItem.innerHTML = `
+            <strong>${chapter.title}</strong>
+            <ul>
+                ${lessonsHtml}
+            </ul>
+            <button class="add-lesson-btn" onclick="showInputForNewLesson('${chapter.title}', this)">新增课时</button>
+        `;
+
+
+        chapterList.appendChild(chapterItem);
+    });
+}
+
+function showInputForNewLesson(chapterTitle, button) {
+    // 防止重复点击
+    const addButton = button;
+    addButton.style.display = 'none'; // 隐藏按钮
+
+    // 创建一个输入框
+    const input = document.createElement('input');
+    input.type = 'text';
+    input.placeholder = '请输入课时名称...';
+    input.className = 'new-lesson-input';
+    input.onblur = () => checkAndAddLesson(input, chapterTitle, addButton);  // 失去焦点时检查输入
+
+    // 将输入框插入到章节列表中
+    const chapterItem = addButton.closest('li');  // 获取到点击按钮的父元素
+    chapterItem.appendChild(input);
+    input.focus(); // 聚焦到输入框
+}
+function checkAndAddLesson(input, chapterTitle, addButton) {
+    const lessonName = input.value.trim();
+
+    // 如果课时名称为空，显示提示并不添加
+    if (!lessonName) {
+        input.remove();  // 删除输入框
+        addButton.style.display = 'block'; // 重新显示新增课时按钮
+        return;
+    }
+
+    // 如果课时名称合法，添加到课时列表
+    const chapterList = document.getElementById('chapter-list');
+    const chapterItem = Array.from(chapterList.children).find(item => item.querySelector('strong').textContent === chapterTitle);
+    const lessonsList = chapterItem.querySelector('ul');
+
+    const lessonItem = document.createElement('span');
+    lessonItem.innerHTML = lessonTemplate(lessonName);
+
+    lessonsList.appendChild(lessonItem);  // 将新课时添加到章节下
+    input.remove();  // 删除输入框
+    addButton.style.display = 'block';  // 重新显示新增课时按钮
+}
+function deleteLesson(lesson) {
+    const lessonItems = document.querySelectorAll('.lesson-item');
+    lessonItems.forEach(item => {
+        if (item.querySelector('.lesson-text').textContent === lesson) {
+            item.remove();  // 删除对应的课时项
+        }
+    });
+}
+
+
+function editLesson(lesson) {
+    // 编辑课时的逻辑
+    alert("编辑课时: " + lesson);
+}
+
+function closeCourseDetails() {
+    document.getElementById('courseDetails').classList.remove('open');
+}