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:
120
dashboard/static/js/sessions.js
Normal file
120
dashboard/static/js/sessions.js
Normal file
@@ -0,0 +1,120 @@
|
||||
/**
|
||||
* 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;
|
||||
}
|
||||
Reference in New Issue
Block a user