Spaces:
Running
Running
| <html lang="zh-Hant"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width,initial-scale=1"> | |
| <title>Telearn 內容管理後台</title> | |
| <link rel="stylesheet" href="/classroom-assets/classroom.css?v=2026fall-9"> | |
| <link rel="stylesheet" href="/classroom-assets/admin.css?v=2026fall-7"> | |
| </head> | |
| <body class="admin-body"> | |
| <header class="app-header"> | |
| <div class="brand"><div class="brand-mark">Py</div><div class="brand-copy"><strong>內容管理後台</strong><span id="adminStatus">尚未登入</span></div></div> | |
| <div class="header-actions"><a class="btn secondary compact" href="/classroom/teacher">即時教室</a><a class="btn secondary compact" href="/">查看 Demo</a><button class="btn compact" id="loginButton">重新登入</button></div> | |
| </header> | |
| <nav class="admin-tabs" aria-label="管理內容"><button class="admin-tab active" data-view="courseView">教室課程</button><button class="admin-tab" data-view="classroomView">管理教室</button><button class="admin-tab" data-view="demoView">Demo 專題</button><span>儲存後會重新建置 Space，通常需等待約 1–2 分鐘。</span></nav> | |
| <main class="admin-main"> | |
| <section class="admin-view active" id="courseView"> | |
| <aside class="admin-sidebar"><div class="admin-sidebar-head"><div><strong>Lesson 路線</strong><small>選擇 Lesson 修改主題與套版</small></div></div><div class="admin-list" id="weekAdminList"></div></aside> | |
| <form class="admin-editor" id="weekForm"> | |
| <header class="admin-editor-head"><div><h1 id="weekHeading">選擇 Lesson</h1><p>課堂顯示內容與學生可匯入的 Lesson 套版。</p></div><button class="btn" id="saveWeekButton" type="submit">儲存此 Lesson</button></header> | |
| <div class="admin-fields three"><label>課程標題<input class="text-field" id="weekTitle" required></label><label>專題名稱<input class="text-field" id="weekProject" required></label><label>Lesson 產出<input class="text-field" id="weekOutput" required></label></div> | |
| <div class="file-workspace"><aside><div class="file-workspace-head"><strong>套版檔案</strong><button class="copy-button" id="newWeekFile" type="button">＋新增</button></div><div class="admin-file-list" id="weekFiles"></div></aside><label class="code-field"><span id="weekFileLabel">尚未選擇檔案</span><textarea id="weekFileContent" spellcheck="false" disabled></textarea></label></div> | |
| </form> | |
| </section> | |
| <section class="admin-view" id="classroomView"> | |
| <aside class="admin-sidebar classroom-sidebar"><div class="admin-sidebar-head"><div><strong>我的班級</strong><small id="classroomTotal">尚未建立班級</small></div><button class="copy-button" id="newClassroomButton">＋新增</button></div><div class="admin-list" id="classroomList"></div></aside> | |
| <section class="classroom-manager"> | |
| <header class="admin-editor-head"><div><h1 id="classroomHeading">選擇班級</h1><p>管理班級、學生名單與已提交的正式版本。</p></div><div class="admin-actions"><button class="copy-button danger-action" id="deleteClassroomButton" disabled>刪除班級</button><button class="btn" id="saveClassroomButton" disabled>儲存班級</button></div></header> | |
| <div class="classroom-fields"><label>班級代碼<input class="text-field" id="classroomCode" disabled><small>建立後固定，避免作品與進度失去關聯。</small></label><label>班級名稱<input class="text-field" id="classroomName" disabled></label><div class="backup-controls"><label>備份 Lesson<select class="text-field" id="backupWeek" disabled></select></label><button class="copy-button" id="backupSubmissionsButton" disabled>備份 Lesson 提交</button></div></div> | |
| <div class="classroom-workspace"> | |
| <aside class="student-manager"><form class="manager-add" id="adminStudentForm"><label for="adminStudentNames">新增學生（多人可用逗號分開）</label><div><input class="text-field" id="adminStudentNames" disabled><button class="btn compact" id="adminAddStudentsButton" disabled>加入</button></div></form><div class="manager-title"><strong>學生名單</strong><span id="adminStudentTotal">0 人</span></div><div class="manager-list" id="adminStudentList"></div></aside> | |
| <section class="submission-manager"><div class="manager-title"><div><strong id="submissionHeading">已提交內容</strong><small id="submissionTotal">0 份</small></div></div><div class="submission-workspace"><div class="submission-list" id="submissionList"></div><div class="submission-detail"><header><div><strong id="submissionProject">尚未選擇提交</strong><small id="submissionMeta"></small></div><button class="copy-button danger-action" id="deleteSubmissionButton" disabled>刪除提交</button></header><nav class="submission-files" id="submissionFiles"></nav><pre id="submissionCode">選擇一份提交查看內容。</pre></div></div></section> | |
| </div> | |
| </section> | |
| </section> | |
| <section class="admin-view" id="demoView"> | |
| <aside class="admin-sidebar demo-picker-sidebar"><div class="admin-sidebar-head"><div><strong>公開 Demo</strong><small id="demoTotal">依課程、學生、專題逐層選擇</small></div><button class="copy-button" id="newDemoButton">＋新增</button></div><div class="demo-picker"><label><span>1 課程</span><select class="text-field" id="demoClassSelect"><option value="">請選擇課程</option></select></label><label><span>2 學生</span><select class="text-field" id="demoStudentSelect" disabled><option value="">請先選課程</option></select></label><label><span>3 專題</span><select class="text-field" id="demoProjectSelect" disabled><option value="">請先選學生</option></select></label></div><div class="picker-summary" id="demoPickerSummary"><strong>尚未選擇專題</strong><p>選好三個層級後，右側會載入可編輯的程式檔案。</p></div></aside> | |
| <form class="admin-editor" id="demoForm"> | |
| <header class="admin-editor-head"><div><h1 id="demoHeading">選擇一個 Demo 專題</h1><p>文字程式可直接編輯；圖片、音效等資產會原樣保留。</p></div><div class="admin-actions"><button class="copy-button danger-action" id="deleteDemoButton" type="button" disabled>刪除</button><button class="btn" id="saveDemoButton" type="submit" disabled>儲存專題</button></div></header> | |
| <div class="admin-fields three"><label>班級<input class="text-field" id="demoClass" required disabled></label><label>學生<input class="text-field" id="demoStudent" required disabled></label><label>專題名稱<input class="text-field" id="demoProject" required disabled></label></div> | |
| <div class="file-workspace"><aside><div class="file-workspace-head"><strong>程式檔案</strong><button class="copy-button" id="newDemoFile" type="button" disabled>＋新增</button></div><div class="admin-file-list" id="demoFiles"></div><div class="asset-note" id="demoAssets"></div></aside><label class="code-field"><span id="demoFileLabel">尚未選擇檔案</span><textarea id="demoFileContent" spellcheck="false" disabled></textarea></label></div> | |
| </form> | |
| </section> | |
| </main> | |
| <dialog id="adminLoginDialog"><form class="dialog-content form-stack" id="adminLoginForm"><div><h1>登入內容管理後台</h1><p>使用與教師控制台相同的密碼。</p></div><label><span class="field-label">教師密碼</span><input class="text-field" id="adminPassword" type="password" required autofocus></label><p class="form-error" id="adminLoginError"></p><button class="btn" type="submit">登入</button></form></dialog> | |
| <div class="toast" id="toast"></div> | |
| <script src="/classroom-assets/admin.js?v=2026fall-8"></script> | |
| </body> | |
| </html> | |