Add task list page for Video Learning sessions

This commit adds a dedicated task list page to view and manage all video
learning sessions, solving the issue where users couldn't find their
background tasks after navigating away.

Features:
- New sessions.html page with card-based layout for all sessions
- Real-time polling for session status updates (every 3 seconds)
- Session control buttons (pause/resume/stop/delete)
- localStorage integration for session persistence across page refreshes
- Navigation links added to main page and video learning page
- Empty state UI when no sessions exist

New files:
- dashboard/static/sessions.html - Task list page
- dashboard/static/js/sessions.js - Sessions module with API calls
- dashboard/static/css/sessions.css - Styling for sessions page

Modified files:
- dashboard/api/video_learning.py - Added /sessions/list endpoint
- dashboard/static/index.html - Added "任务列表" button
- dashboard/static/video-learning.html - Added "任务列表" button and localStorage

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
let5sne.win10
2026-01-10 02:22:42 +08:00
parent a223d63088
commit a356c481ca
6 changed files with 744 additions and 0 deletions

View File

@@ -42,6 +42,15 @@
</div>
</div>
<div class="header-actions">
<a href="/static/sessions.html" class="btn btn-secondary">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<rect x="3" y="3" width="7" height="7"></rect>
<rect x="14" y="3" width="7" height="7"></rect>
<rect x="14" y="14" width="7" height="7"></rect>
<rect x="3" y="14" width="7" height="7"></rect>
</svg>
任务列表
</a>
<button @click="goBack" class="btn btn-secondary">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<line x1="19" y1="12" x2="5" y2="12"></line>
@@ -285,6 +294,23 @@
mounted() {
this.loadDevices();
this.setupVideoLearningEvents();
// 检查 URL 是否有 session 参数
const urlParams = new URLSearchParams(window.location.search);
const sessionParam = urlParams.get('session');
if (sessionParam) {
this.currentSessionId = sessionParam;
this.updateSessionStatus();
}
// 检查 localStorage 中是否有保存的 session_id
if (!this.currentSessionId) {
const savedSessionId = localStorage.getItem('current_session_id');
if (savedSessionId) {
this.currentSessionId = savedSessionId;
this.updateSessionStatus();
}
}
},
methods: {
@@ -318,6 +344,10 @@
);
this.currentSessionId = createResult.session_id;
// 保存到 localStorage
localStorage.setItem('current_session_id', this.currentSessionId);
this.showToast('Session created! Starting...', 'success');
// Start session