/* ============================================================ Region Plan-Fakt 2026 — oylik reja/fakt dashboard Oy tanlanadi (Dekabr…Iyun), tanlovga qarab raqamlar o'zgaradi. sdShort / sdFull / sdPct / sdStatus — sheetdash.jsx'dan (global). ============================================================ */ const PF_REFRESH_MS = 5 * 60 * 1000; // Tashqi bozorlar dollarda — "$46,995" ko'rinishida const pfUsd = (v) => '$' + Math.round(Number(v) || 0).toLocaleString('en-US'); function PlanFaktDashboard() { // Sahifa keshi — bo'limga qayta kirilganda oldingi ma'lumot darrov ko'rsatiladi. const pfCached = window.PageCache ? window.PageCache.get('planfakt') : null; const [data, setData] = useState(pfCached || null); const [loading, setLoading] = useState(!pfCached); const [err, setErr] = useState(null); const [refreshing, setRefreshing] = useState(false); // Tanlangan oy indeksi — keshdan kelganda ham darrov oxirgi oy ko'rsatiladi. const [mi, setMi] = useState(pfCached && (pfCached.months || []).length ? pfCached.months.length - 1 : null); async function load(force) { if (force) setRefreshing(true); else setLoading(true); setErr(null); try { const res = await API.planFakt(force); setData(res); if (window.PageCache) window.PageCache.set('planfakt', res); setMi((prev) => { const n = (res.months || []).length; if (n === 0) return null; if (prev == null || prev >= n) return n - 1; // oxirgi oy return prev; }); } catch (ex) { setErr(ex.message || 'Maʼlumotni yuklab boʼlmadi'); } finally { setLoading(false); setRefreshing(false); } } useEffect(() => { load(false); const t = setInterval(() => load(false), PF_REFRESH_MS); return () => clearInterval(t); }, []); // eslint-disable-line if (loading && !data) { return (
Maʼlumot yuklanmoqda…
); } if (err && !data) { return (
Dashboard yuklanmadi
{err}
); } const months = (data && data.months) || []; const m = mi != null && months[mi] ? months[mi] : null; const updated = data && data.updatedAt ? new Date(data.updatedAt) : null; const updatedStr = updated ? updated.toLocaleString('ru-RU', { day: '2-digit', month: '2-digit', hour: '2-digit', minute: '2-digit' }) : '—'; const t = (m && m.totals) || { reja: 0, fakt: 0, pct: null }; const st = sdStatus(t.pct || 0); const regions = (m && m.regions) || []; // Reja vs fakt grafikida eng katta o'lcham const chartMax = Math.max(1, ...regions.slice(0, 12).map((r) => Math.max(r.reja, r.fakt))); return (
{/* Sarlavha + yangilash */}

SELL IN — Region Plan-Fakt 2026

Oylik reja va fakt taqqoslamasi · Oxirgi yangilanish: {updatedStr}

{/* Oy tanlash */}
{months.map((mo, i) => { const active = i === mi; return ( ); })}
{!m ? (
Maʼlumot yoʼq.
) : ( <> {/* KPI kartalar */}
{/* Progress bar (reja bo'lsa) */} {m.hasPlan && (
{m.name} rejaning bajarilishi
{sdShort(t.fakt)} / {sdShort(t.reja)} soʼm
)} {/* Reja vs Fakt — region kesimi (top 12) */}
Reja vs Fakt (eng yirik 12 region)
Reja Fakt
{regions.slice(0, 12).map((r, i) => (
{r.name}
{r.reja > 0 && (
)}
{sdShort(r.fakt)}
))}
{/* To'liq jadval */}
{m.name} — barcha regionlar ({regions.length}) {!m.hasPlan && · bu oy uchun reja hali kiritilmagan}
{regions.map((r, i) => { const rs = sdStatus(r.pct || 0); return ( ); })}
Region Reja Fakt Bajarilish
{r.name} {r.reja > 0 ? sdShort(r.reja) : '—'} {sdShort(r.fakt)} {r.pct == null ? ( — ) : ( {sdPct(r.pct)} )}
{/* Tashqi bozorlar — DOLLARDA (so'm yig'indisiga aralashmaydi) */} {m.external && m.external.length > 0 && (
🌍 Tashqi bozorlar ({m.external.length}) · dollarda (USD)
Jami fakt: {pfUsd(m.externalTotals ? m.externalTotals.fakt : 0)}
{m.external.map((r, i) => { const rs = sdStatus(r.pct || 0); return ( ); })}
Bozor Reja ($) Fakt ($) Bajarilish
{r.name} {r.reja > 0 ? pfUsd(r.reja) : '—'} {pfUsd(r.fakt)} {r.pct == null ? — : ( {sdPct(r.pct)} )}
)} {err && data &&
Yangilashda xatolik: {err}
} )}
); } window.PlanFaktDashboard = PlanFaktDashboard; /* ============================================================ PlanFaktView — SELL IN wrapper (SELL OUT'dagi RegionView bilan bir xil g'oya): • "Oldingi oylar" → PlanFaktDashboard (Region Plan-Fakt 2026, o'zgarishsiz) • "Iyul" → SheetDashboard section="sellin" ("Pervichka - IYUL" jadvali, HUDUD → Brend → SKU → karobka/summa batafsil ko'rinishi) ============================================================ */ function PlanFaktView() { // Iyul+ (2026-07 dan) — batafsil oylik ko'rinish; sukut bo'yicha JORIY oy ochiladi. const mo = new Date().getMonth(); // 0-based; 6=Iyul, 7=Avgust const defaultMode = mo >= 7 ? 'avgust' : mo === 6 ? 'iyul' : 'old'; const [mode, setMode] = useState(defaultMode); const tabs = [ { key: 'old', label: 'Oldingi oylar' }, { key: 'iyul', label: 'Iyul' }, { key: 'avgust', label: 'Avgust' }, ]; return (
{/* Bo'lim tab paneli */}
{tabs.map((t) => { const active = t.key === mode; return ( ); })}
{/* Kontent */}
{mode === 'iyul' ? : mode === 'avgust' ? : }
); } window.PlanFaktView = PlanFaktView;