'use client';
import { useEffect, useState } from 'react';
import { api } from '@/lib/api';
export default function AdminAffiliatePage() { const [data,setData]=useState<any>(null); useEffect(()=>{void api.get('/affiliate/admin/overview').then(r=>setData(r.data));},[]); if(!data)return <div className="py-24 text-center text-gray-400">Đang tải quản lý Affiliate...</div>; return <div className="space-y-5"><p className="text-xs font-bold uppercase tracking-[.2em] text-red-400">SHOPMMO ADMIN</p><h1 className="text-3xl font-black text-white">Quản lý Affiliate</h1><div className="grid gap-4 md:grid-cols-3"><Stat name="Affiliate" value={data.profiles}/><Stat name="Lượt click" value={data.visits}/><Stat name="Cảnh báo gian lận" value={data.fraudLogs?.length||0}/></div><section className="rounded-2xl border border-white/10 bg-[#121315] p-5"><h2 className="font-black text-white">Cảnh báo cần kiểm tra</h2><div className="mt-4 space-y-2">{data.fraudLogs?.length?data.fraudLogs.map((x:any)=><div key={x.id} className="rounded-lg bg-red-500/10 p-3 text-sm text-red-100">{x.type} · điểm {x.score}</div>):<p className="text-sm text-gray-500">Chưa có cảnh báo.</p>}</div></section></div>; }
function Stat({name,value}:{name:string;value:any}){return <div className="rounded-2xl border border-white/10 bg-[#121315] p-5"><p className="text-xs font-bold uppercase text-gray-500">{name}</p><p className="mt-2 text-3xl font-black text-white">{value}</p></div>}