import { useState, useEffect } from 'react' import type { NextPage } from 'next' import Head from 'next/head' import AdminLayout from '../../components/AdminLayout' import { DocumentArrowDownIcon, TableCellsIcon, ChartBarIcon, CalendarIcon, FunnelIcon, Cog6ToothIcon, ClockIcon, CheckCircleIcon, ExclamationTriangleIcon } from '@heroicons/react/24/outline' interface ExportJob { id: string name: string type: 'sources' | 'reports' | 'analytics' | 'users' | 'audit_logs' format: 'csv' | 'xlsx' | 'json' | 'pdf' status: 'pending' | 'processing' | 'completed' | 'failed' created_at: string completed_at?: string download_url?: string file_size?: string records_count?: number } const ExportPage: NextPage = () => { const [exportJobs, setExportJobs] = useState([]) const [loading, setLoading] = useState(false) const [selectedType, setSelectedType] = useState('sources') const [selectedFormat, setSelectedFormat] = useState('csv') const [dateRange, setDateRange] = useState({ from: '', to: '' }) const [filters, setFilters] = useState({ status: '', riskLevel: '', category: '' }) useEffect(() => { fetchExportJobs() }, []) const fetchExportJobs = async () => { try { const response = await fetch('/api/admin/export/jobs') if (response.ok) { const jobs = await response.json() setExportJobs(jobs) } } catch (error) { console.error('Failed to fetch export jobs:', error) } } const createExport = async () => { setLoading(true) try { const response = await fetch('/api/admin/export', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ type: selectedType, format: selectedFormat, dateRange, filters }) }) if (response.ok) { const newJob = await response.json() setExportJobs(prev => [newJob, ...prev]) } } catch (error) { console.error('Failed to create export:', error) } finally { setLoading(false) } } const getStatusIcon = (status: string) => { switch (status) { case 'completed': return case 'failed': return case 'processing': return
default: return } } const getStatusColor = (status: string) => { switch (status) { case 'completed': return 'bg-green-100 text-green-800' case 'failed': return 'bg-red-100 text-red-800' case 'processing': return 'bg-blue-100 text-blue-800' default: return 'bg-yellow-100 text-yellow-800' } } return ( Export dát - Hliadka.sk Admin
{/* Export Configuration */}

Nový export

{/* Export Type Selection */}

Typ dát

{[ { value: 'sources', label: 'Zdroje', description: 'Všetky monitorované zdroje s metadátami', icon: TableCellsIcon }, { value: 'reports', label: 'Hlásenia', description: 'Používateľské hlásenia a ich stav', icon: DocumentArrowDownIcon }, { value: 'analytics', label: 'Analytika', description: 'Štatistické údaje a metriky', icon: ChartBarIcon }, { value: 'users', label: 'Používatelia', description: 'Administrátori a moderátori', icon: TableCellsIcon }, { value: 'audit_logs', label: 'Audit log', description: 'Záznamy o aktivitách v systéme', icon: ClockIcon } ].map((type) => ( ))}
{/* Export Configuration */}
{/* Format Selection */}
{/* Date Range */}
setDateRange(prev => ({ ...prev, from: e.target.value }))} className="input" />
setDateRange(prev => ({ ...prev, to: e.target.value }))} className="input" />
{/* Filters */} {selectedType === 'sources' && (

Filtre

)} {/* Export Button */}
{/* Export History */}

História exportov

{exportJobs.map((job) => ( ))} {exportJobs.length === 0 && ( )}
Názov Typ Formát Status Vytvorený Veľkosť Akcie
{job.name} {job.type} {job.format}
{getStatusIcon(job.status)} {job.status}
{new Date(job.created_at).toLocaleString('sk-SK')} {job.file_size || '-'} {job.records_count && (
{job.records_count} záznamov
)} 		{job.status === 'completed' && job.download_url && ( Stiahnuť )} {job.status === 'failed' && ( )}

Žiadne exporty

Vytvorte svoj prvý export dát
{/* Quick Export Templates */}

Rýchle exporty

 ) } export default ExportPage