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>
121 lines
3.1 KiB
JavaScript
121 lines
3.1 KiB
JavaScript
/**
|
|
* Video Learning Sessions Module for AutoGLM Dashboard
|
|
*
|
|
* This module provides functionality for managing video learning sessions,
|
|
* including listing, controlling, and monitoring sessions.
|
|
*/
|
|
|
|
const SessionsModule = {
|
|
// Current session state
|
|
sessions: [],
|
|
isLoading: false,
|
|
|
|
/**
|
|
* Load all sessions
|
|
*/
|
|
async loadSessions() {
|
|
try {
|
|
const response = await axios.get('/api/video-learning/sessions/list');
|
|
this.sessions = response.data;
|
|
return this.sessions;
|
|
} catch (error) {
|
|
console.error('Error loading sessions:', error);
|
|
throw error;
|
|
}
|
|
},
|
|
|
|
/**
|
|
* Get session status
|
|
*/
|
|
async getSessionStatus(sessionId) {
|
|
try {
|
|
const response = await axios.get(`/api/video-learning/sessions/${sessionId}/status`);
|
|
return response.data;
|
|
} catch (error) {
|
|
console.error('Error getting session status:', error);
|
|
throw error;
|
|
}
|
|
},
|
|
|
|
/**
|
|
* Get session videos
|
|
*/
|
|
async getSessionVideos(sessionId) {
|
|
try {
|
|
const response = await axios.get(`/api/video-learning/sessions/${sessionId}/videos`);
|
|
return response.data;
|
|
} catch (error) {
|
|
console.error('Error getting session videos:', error);
|
|
throw error;
|
|
}
|
|
},
|
|
|
|
/**
|
|
* Control session (pause/resume/stop)
|
|
*/
|
|
async controlSession(sessionId, action) {
|
|
try {
|
|
const response = await axios.post(`/api/video-learning/sessions/${sessionId}/control`, {
|
|
action: action
|
|
});
|
|
return response.data;
|
|
} catch (error) {
|
|
console.error('Error controlling session:', error);
|
|
throw error;
|
|
}
|
|
},
|
|
|
|
/**
|
|
* Delete session
|
|
*/
|
|
async deleteSession(sessionId) {
|
|
try {
|
|
const response = await axios.delete(`/api/video-learning/sessions/${sessionId}`);
|
|
return response.data;
|
|
} catch (error) {
|
|
console.error('Error deleting session:', error);
|
|
throw error;
|
|
}
|
|
},
|
|
|
|
/**
|
|
* Format platform name
|
|
*/
|
|
getPlatformName(platform) {
|
|
const names = {
|
|
'douyin': '抖音',
|
|
'kuaishou': '快手',
|
|
'tiktok': 'TikTok'
|
|
};
|
|
return names[platform] || platform;
|
|
},
|
|
|
|
/**
|
|
* Get status text
|
|
*/
|
|
getStatusText(session) {
|
|
if (!session.is_active && !session.is_paused) return '已完成';
|
|
if (session.is_paused) return '已暂停';
|
|
if (session.is_active) return '进行中';
|
|
return '未知';
|
|
},
|
|
|
|
/**
|
|
* Format duration
|
|
*/
|
|
formatDuration(seconds) {
|
|
if (!seconds) return '0s';
|
|
if (seconds < 60) {
|
|
return `${seconds.toFixed(1)}s`;
|
|
}
|
|
const minutes = Math.floor(seconds / 60);
|
|
const remainingSeconds = seconds % 60;
|
|
return `${minutes}m ${remainingSeconds.toFixed(1)}s`;
|
|
}
|
|
};
|
|
|
|
// Export for use in other modules
|
|
if (typeof module !== 'undefined' && module.exports) {
|
|
module.exports = SessionsModule;
|
|
}
|