feat: implement analytics dashboard layout (task 10)
- Add analytics types (AnalyticsSummary, DateRange) - Create analyticsService for API calls and CSV export - Implement DateRangeSelector component with presets - Create StatCard component for summary statistics - Build responsive AnalyticsPage with: - Summary statistics cards (reports, events, users, litter collected) - Date range filtering with presets - CSV export functionality - Loading and error states - Responsive grid layout Requirements: 5.1, 5.5
This commit is contained in:
51
src/services/analyticsService.ts
Normal file
51
src/services/analyticsService.ts
Normal file
@@ -0,0 +1,51 @@
|
||||
// Analytics service for API interactions
|
||||
import { apiClient } from './api';
|
||||
import type { AnalyticsSummary } from '@/types';
|
||||
|
||||
class AnalyticsService {
|
||||
/**
|
||||
* Get summary statistics for the analytics dashboard
|
||||
*/
|
||||
async getSummary(dateRange?: { start: string; end: string }): Promise<AnalyticsSummary> {
|
||||
const params = new URLSearchParams();
|
||||
|
||||
if (dateRange) {
|
||||
params.append('startDate', dateRange.start);
|
||||
params.append('endDate', dateRange.end);
|
||||
}
|
||||
|
||||
const queryString = params.toString();
|
||||
return apiClient.get<AnalyticsSummary>(`/analytics/summary${queryString ? `?${queryString}` : ''}`);
|
||||
}
|
||||
|
||||
/**
|
||||
* Export analytics data to CSV
|
||||
*/
|
||||
async exportToCSV(dateRange?: { start: string; end: string }): Promise<Blob> {
|
||||
const params = new URLSearchParams();
|
||||
|
||||
if (dateRange) {
|
||||
params.append('startDate', dateRange.start);
|
||||
params.append('endDate', dateRange.end);
|
||||
}
|
||||
|
||||
const queryString = params.toString();
|
||||
const response = await fetch(
|
||||
`${import.meta.env.VITE_API_BASE_URL || 'http://localhost:3000/api'}/analytics/export${queryString ? `?${queryString}` : ''}`,
|
||||
{
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Accept': 'text/csv',
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error('Failed to export data');
|
||||
}
|
||||
|
||||
return response.blob();
|
||||
}
|
||||
}
|
||||
|
||||
export const analyticsService = new AnalyticsService();
|
||||
Reference in New Issue
Block a user