// campaign-report.jsx — rapoartele de campanie, pentru brand si pentru uz intern. // // De ce nu generam un fisier PDF cu o biblioteca: bibliotecile de PDF din browser // (jsPDF, html2canvas) transforma pagina in imagine — textul nu se mai poate selecta, // diacriticele se strica, iar fisierul iese de cateva MB. Browserul stie deja sa faca // PDF-uri bune din pagini: Printeaza -> "Salveaza ca PDF". Asa iese text adevarat, // se cauta in el, e mic, si arata la fel pe orice calculator. // // Raportul se deseneaza intr-un portal lipit direct de , ca sa putem ascunde // restul paginii la printare cu o singura regula CSS. // // Expune: // window.CampaignReport({ campaign, brand, creators, influencers, staffList, onlyCreatorId, onClose }) const { useState: useStateCR, useEffect: useEffectCR } = React; function _n(v) { return (v == null || v === '') ? 0 : (Number(v) || 0); } function _fmt(v) { if (v == null || v === '' || Number.isNaN(Number(v))) return '—'; return Number(v).toLocaleString('ro-RO'); } function _date(d) { if (!d) return '—'; const x = new Date(d.length === 10 ? d + 'T00:00:00' : d); return isNaN(x.getTime()) ? '—' : x.toLocaleDateString('ro-RO'); } // Suma unui camp peste o lista, dar null cand nimeni nu a completat nimic. // "0 views" si "nu stim cate views" sunt lucruri diferite intr-un raport catre brand. function _sum(rows, field) { const withValue = rows.filter(r => r[field] != null && r[field] !== ''); if (withValue.length === 0) return null; return withValue.reduce((acc, r) => acc + _n(r[field]), 0); } function CampaignReport({ campaign, brand, creators, influencers, staffList, onlyCreatorId, onClose }) { const [videos, setVideos] = useStateCR([]); const [lives, setLives] = useStateCR([]); const [loading, setLoading] = useStateCR(true); const shown = onlyCreatorId ? creators.filter(c => c.id === onlyCreatorId) : creators; const shownIds = shown.map(c => c.id); useEffectCR(() => { (async () => { if (shownIds.length === 0) { setLoading(false); return; } const [{ data: v }, { data: l }] = await Promise.all([ window.sb.from('campaign_creator_videos').select('*').in('campaign_creator_id', shownIds).order('position'), window.sb.from('campaign_creator_lives').select('*').in('campaign_creator_id', shownIds).order('position'), ]); setVideos(v || []); setLives(l || []); setLoading(false); })(); }, [campaign.id, onlyCreatorId]); const videosOf = (ccId) => videos.filter(v => v.campaign_creator_id === ccId); const livesOf = (ccId) => lives.filter(l => l.campaign_creator_id === ccId); const infOf = (ccId) => { const cc = creators.find(c => c.id === ccId); return cc ? influencers.find(i => i.id === cc.influencer_id) : null; }; const isSingle = !!onlyCreatorId; const title = isSingle ? 'Raport creator' : 'Raport campanie'; // Totalurile se aduna din randuri, niciodata scrise de mana — altfel raportul // catre brand ar putea spune altceva decat datele din panou. const totals = { creatori: shown.length, videoclipuri: videos.length, publicate: videos.filter(v => v.status === 'Publicat').length, views: _sum(videos, 'views'), likeVideo: _sum(videos, 'likes'), comVideo: _sum(videos, 'comments'), liveuri: lives.length, spectatori: _sum(lives, 'viewers_peak'), laMentiune: _sum(lives, 'viewers_at_mention'), minuteLive: _sum(lives, 'duration_minutes'), likeLive: _sum(lives, 'likes'), comLive: _sum(lives, 'comments'), }; const manager = staffList.find(s => s.id === campaign.assigned_to); const contact = staffList.find(s => s.id === campaign.brand_contact); const brandName = brand ? (brand.brand || brand.company) : '—'; const handlePrint = () => window.print(); const statCards = [ { label: 'Creatori', value: totals.creatori }, { label: 'Videoclipuri publicate', value: totals.publicate + ' din ' + totals.videoclipuri }, { label: 'Vizualizări totale', value: _fmt(totals.views) }, { label: 'Live-uri', value: totals.liveuri }, { label: 'Spectatori în live', value: _fmt(totals.spectatori) }, { label: 'Spectatori la mențiune', value: _fmt(totals.laMentiune) }, ]; return ReactDOM.createPortal(
{/* Bara de comenzi — nu se printeaza */}
{loading ? 'Se încarcă datele...' : 'Gata de printat. Alege „Salvează ca PDF" în fereastra de printare.'}
{/* Foaia de raport */}
{/* Antet */}
4U Agency
Agenție de influencer marketing
{title}
Generat la {new Date().toLocaleDateString('ro-RO')}

{campaign.name}

Brand: {brandName} {(campaign.start_date || campaign.end_date) && · Perioadă: {_date(campaign.start_date)} – {_date(campaign.end_date)}} {manager && · Campaign manager: {manager.full_name}} {contact && · Contact: {contact.full_name}}
{loading ? (
Se încarcă rezultatele...
) : ( {/* Rezumat cifre */} Rezumat
{statCards.map(c => (
{c.label}
{c.value}
))}
Interacțiuni: {_fmt(totals.likeVideo == null && totals.likeLive == null ? null : _n(totals.likeVideo) + _n(totals.likeLive))} like-uri {' · '}{_fmt(totals.comVideo == null && totals.comLive == null ? null : _n(totals.comVideo) + _n(totals.comLive))} comentarii {totals.minuteLive != null && · {_fmt(totals.minuteLive)} minute de live}
{/* Ce am promis si ce a iesit */} {!isSingle && (campaign.kpi_agreed || campaign.results_summary || campaign.results_business || campaign.results_brand_feedback) && ( Obiective și concluzii
)} {/* Creatorii */} {isSingle ? 'Rezultate' : 'Rezultate pe creator'} {shown.length === 0 ? (
Niciun creator alocat pe campanie.
) : shown.map(cc => { const inf = infOf(cc.id); const vs = videosOf(cc.id); const ls = livesOf(cc.id); const subViews = _sum(vs, 'views'); return (
{inf ? inf.full_name : 'Creator șters'} {inf && inf.tiktok_handle && @{inf.tiktok_handle}}
{inf && inf.tiktok_followers != null && (
{_fmt(inf.tiktok_followers)} followers TikTok
)}
{cc.deliverables &&
Livrabile: {cc.deliverables}
} {vs.length > 0 && ( [ String(i + 1), v.status, _fmt(v.views), _fmt(v.likes), _fmt(v.comments), v.published_url ? postare : '—', ])} /> )} {ls.length > 0 && ( [ String(i + 1), _date(l.live_date), l.duration_minutes != null ? l.duration_minutes + ' min' : '—', _fmt(l.viewers_peak), _fmt(l.viewers_at_mention), _fmt(l.likes), _fmt(l.comments), ])} /> )} {vs.length === 0 && ls.length === 0 && (
Niciun livrabil trecut încă.
)} {(vs.length > 0 || ls.length > 0) && (
Total: {_fmt(subViews)} views {ls.length > 0 && · {ls.length} {ls.length === 1 ? 'live' : 'live-uri'}}
)}
); })}
Raport generat automat din panoul intern 4U Agency. Cifrele reflectă datele înregistrate la data generării.
)}
, document.body ); } function ReportSectionTitle({ children }) { return (

{children}

); } function ReportField({ label, value }) { if (!value) return null; return (
{label}
{value}
); } function ReportTable({ head, rows }) { return ( {head.map(h => ( ))} {rows.map((r, i) => ( {r.map((cell, j) => ( ))} ))}
{h}
{cell}
); } window.CampaignReport = CampaignReport;