แสดง
{[10, 20, 50].map(n => (
))}
รายการ · {(safePage - 1) * perPage + 1}–{Math.min(safePage * perPage, filtered.length)} จาก {filtered.length}
{(() => {
const pages = [];
const delta = 1;
for (let p = 1; p <= totalPages; p++) {
if (p === 1 || p === totalPages || (p >= safePage - delta && p <= safePage + delta)) {
pages.push(p);
} else if (pages[pages.length - 1] !== '…') {
pages.push('…');
}
}
return pages.map((p, i) => p === '…' ? (
…
) : (
));
})()}
)}
);
})()}
)}{/* end viewScope !== false */}
);
};
const SummaryStat = ({ label, value, sublabel, accent }) => (
{orders.length === 0 && (
)}
{orders.map(o => {
const _prods = window.PRODUCTS || PRODUCTS;
const products = o.items.map(it => _prods.find(p => p.id === it.productId)).filter(Boolean);
const totalSeats = o.items.reduce((s, it) => s + it.qty, 0);
return (
onOpen(o.id)} style={{
background: 'var(--panel)', border: '1px solid var(--line)', borderRadius: 4,
padding: 16, cursor: 'pointer', transition: 'all 160ms', position: 'relative',
}} onMouseEnter={e => {
e.currentTarget.style.transform = 'translateY(-1px)';
e.currentTarget.style.borderColor = 'var(--ink)';
e.currentTarget.style.boxShadow = 'var(--shadow-lift)';
}} onMouseLeave={e => {
e.currentTarget.style.transform = 'none';
e.currentTarget.style.borderColor = 'var(--line)';
e.currentTarget.style.boxShadow = 'none';
}}>
{o.company.name}
{o.company.sector} · {o.company.province}
{o.items.map((it, j) => {
const prod = _prods.find(p => p.id === it.productId);
if (!prod) return null;
const pkg = (prod.packages || []).find(p => p.id === it.packageId);
return (
{prod.name}
{pkg?.name || '—'} · {it.qty} {prod.unit}{it.qty > 1 ? 's' : ''}
);
})}
MONTHLY · MRR
{fmtBaht(o.monthly)}
{totalSeats} units · {relTime(o.createdAt)}
);
})}