import { useState, useEffect } from 'react'; import Head from 'next/head'; import Layout from '../components/Layout'; import { scanAPI } from '../services/api'; export default function ScansPage() { const [scans, setScans] = useState([]); const [total, setTotal] = useState(0); const [page, setPage] = useState(1); const [filters, setFilters] = useState({ marketplace: '', keyword: '', startDate: '', endDate: '' }); const [loading, setLoading] = useState(true); useEffect(() => { loadScans(); }, [page, filters]); const loadScans = async () => { setLoading(true); try { const params: any = { page: String(page), limit: '15' }; if (filters.marketplace) params.marketplace = filters.marketplace; if (filters.keyword) params.keyword = filters.keyword; if (filters.startDate) params.startDate = filters.startDate; if (filters.endDate) params.endDate = filters.endDate; const { data } = await scanAPI.getHistory(params); setScans(data.data.scans || []); setTotal(data.data.total || 0); } catch (err) { console.error(err); } setLoading(false); }; const formatIDR = (n: number) => new Intl.NumberFormat('id-ID', { style: 'currency', currency: 'IDR', maximumFractionDigits: 0 }).format(n); const totalPages = Math.ceil(total / 15); const downloadCSV = (scan: any) => { // Redirect to scan detail API to get items and export window.open(`/api/v1/scans/${scan.id}`, '_blank'); }; return ( <> Scan History – MarketScope

Scan History

Lihat riwayat semua scan yang pernah dilakukan

{/* Filters */}
setFilters({ ...filters, keyword: e.target.value })} className="input-field text-sm" placeholder="Search keyword..." />
{ setFilters({ ...filters, startDate: e.target.value }); setPage(1); }} className="input-field text-sm" />
{ setFilters({ ...filters, endDate: e.target.value }); setPage(1); }} className="input-field text-sm" />
{/* Table */}
{scans.map((scan) => ( ))} {scans.length === 0 && !loading && ( )}
Marketplace Keyword Products Min Max Avg Status Date Action
{scan.marketplace} {scan.keyword || scan.category || '-'} {scan.totalProducts} {scan.minPrice ? formatIDR(scan.minPrice) : '-'} {scan.maxPrice ? formatIDR(scan.maxPrice) : '-'} {scan.avgPrice ? formatIDR(scan.avgPrice) : '-'} {scan.status} {new Date(scan.createdAt).toLocaleDateString('id-ID')}
Tidak ada data scan
{/* Pagination */} {totalPages > 1 && (

Showing {(page - 1) * 15 + 1}-{Math.min(page * 15, total)} of {total}

)}
); }