// reports.jsx — khung báo cáo dùng chung cho mọi module (Hợp đồng · Sản phẩm · Báo giá · Hỗ trợ…):
// • preset kỳ (Tháng này / Quý trước / Q1–4 / Năm nay…) + chọn khoảng ngày tuỳ ý
// • biểu đồ nhẹ (cột theo tháng, đường xu hướng, donut, thanh xếp hạng)
// • xuất: .xlsx thật (SheetJS) + in-ra-PDF (mở trang A4 sạch)
// Không backend — mọi số liệu tính từ state (p.*). Chỉ đọc, không ghi.
/* ============ kỳ báo cáo ============ */
function rpPad(n){ return String(n).padStart(2, '0'); }
function rpMk(y, m, d){ return y + '-' + rpPad(m) + '-' + rpPad(d); }
function rpLastDay(y, m){ return new Date(y, m, 0).getDate(); } // m tính từ 1
function rpMonthRange(y, m){ return { from:rpMk(y, m, 1), to:rpMk(y, m, rpLastDay(y, m)) }; }
function rpQuarterRange(y, q){ return { from:rpMk(y, (q - 1) * 3 + 1, 1), to:rpMk(y, q * 3, rpLastDay(y, q * 3)) }; }
function reportPresets(lang) {
const parts = (typeof TODAY !== 'undefined' ? TODAY : '2026-06-07').split('-').map(Number);
const Y = parts[0], M = parts[1];
const curQ = Math.floor((M - 1) / 3) + 1;
const lqY = curQ === 1 ? Y - 1 : Y;
const lq = curQ === 1 ? 4 : curQ - 1;
const L = (vi, en) => lang === 'vi' ? vi : en;
const lastM = M === 1 ? rpMonthRange(Y - 1, 12) : rpMonthRange(Y, M - 1);
return [
Object.assign({ id:'thismonth', label:L('Tháng này', 'This month') }, rpMonthRange(Y, M)),
Object.assign({ id:'lastmonth', label:L('Tháng trước', 'Last month') }, lastM),
Object.assign({ id:'lastquarter', label:L('Quý trước', 'Last quarter') }, rpQuarterRange(lqY, lq)),
Object.assign({ id:'q1', label:'Q1 ' + Y }, rpQuarterRange(Y, 1)),
Object.assign({ id:'q2', label:'Q2 ' + Y }, rpQuarterRange(Y, 2)),
Object.assign({ id:'q3', label:'Q3 ' + Y }, rpQuarterRange(Y, 3)),
Object.assign({ id:'q4', label:'Q4 ' + Y }, rpQuarterRange(Y, 4)),
{ id:'thisyear', label:L('Năm nay', 'This year'), from:rpMk(Y, 1, 1), to:rpMk(Y, 12, 31) },
{ id:'lastyear', label:L('Năm trước', 'Last year'), from:rpMk(Y - 1, 1, 1), to:rpMk(Y - 1, 12, 31) },
];
}
function useReportPeriod(defaultId) {
const { lang } = useLang();
const presets = reportPresets(lang);
const def = presets.find(p => p.id === (defaultId || 'thismonth')) || presets[0];
const [st, setSt] = React.useState({ from:def.from, to:def.to, presetId:def.id });
return {
from:st.from, to:st.to, presetId:st.presetId, presets,
setPreset:(id) => { const p = presets.find(x => x.id === id); if (p) setSt({ from:p.from, to:p.to, presetId:id }); },
setFrom:(v) => setSt(s => ({ ...s, from:v, presetId:null })),
setTo:(v) => setSt(s => ({ ...s, to:v, presetId:null })),
};
}
function inPeriod(dateStr, period) {
if (!dateStr) return false;
const d = String(dateStr).slice(0, 10);
return d >= period.from && d <= period.to;
}
function rpMonthKey(dateStr){ return String(dateStr).slice(0, 7); }
function monthsInPeriod(period) {
const f = period.from.split('-').map(Number), t = period.to.split('-').map(Number);
let y = f[0], m = f[1]; const out = [];
while ((y < t[0] || (y === t[0] && m <= t[1])) && out.length < 60) {
out.push({ key:y + '-' + rpPad(m), label:rpPad(m) + '/' + String(y).slice(2) });
m++; if (m > 12) { m = 1; y++; }
}
return out;
}
function tallyByMonth(items, dateOf, valOf) {
const map = {};
items.forEach(it => { const k = rpMonthKey(dateOf(it)); if (!k || k.length < 7) return; map[k] = (map[k] || 0) + (valOf ? valOf(it) : 1); });
return map;
}
function fmtVNDate(s){ if (!s) return ''; const p = String(s).slice(0, 10).split('-'); return p[2] + '/' + p[1] + '/' + p[0]; }
const REPORT_COLORS = ['var(--primary)', 'var(--accent)', '#7A5AF8', '#F59E0B', '#1F9D57', '#D14343', '#0FB0AB', '#C77700', '#0B4FBF', '#98A2B3'];
/* ============ biểu đồ ============ */
function ReportBars({ months, series, color, money, height }) {
color = color || 'var(--primary)'; height = height || 150;
const vals = months.map(m => series[m.key] || 0);
const max = Math.max.apply(null, vals.concat([1]));
return (
{months.map((m, i) => { const v = vals[i]; const h = v > 0 ? Math.max(2, Math.round(v / max * 100)) : 0;
return (
{v ? (money ? vndShort(v) : v) : ''}
);
})}
{months.map(m => {m.label})}
);
}
function ReportTrend({ months, series, color, money, height }) {
color = color || 'var(--accent)'; height = height || 150;
const vals = months.map(m => series[m.key] || 0);
const max = Math.max.apply(null, vals.concat([1]));
const n = months.length;
const pts = vals.map((v, i) => [n <= 1 ? 50 : (i / (n - 1)) * 100, 100 - (v / max * 92) - 4]);
const line = pts.map((p, i) => (i ? 'L' : 'M') + p[0].toFixed(2) + ' ' + p[1].toFixed(2)).join(' ');
const area = 'M0 100 ' + pts.map(p => 'L' + p[0].toFixed(2) + ' ' + p[1].toFixed(2)).join(' ') + ' L100 100 Z';
return (
{months.map(m => {m.label})}
);
}
function ReportDonut({ slices, money, size }) {
size = size || 148;
const sum = slices.reduce((s, x) => s + x.value, 0);
const R = 15.9, C = 2 * Math.PI * R; let off = 0;
return (
{slices.map((s, i) => (
{s.label}{money ? vndShort(s.value) : s.value}
))}
);
}
function ReportRank({ rows, money, max }) {
const m = max || Math.max.apply(null, rows.map(r => r.value).concat([1]));
if (!rows.length) return ;
return (
{rows.map((r, i) => (
{r.label}{money ? vndShort(r.value) : r.value}
))}
);
}
/* ============ xuất Excel ============ */
function exportReportXLSX(sheets, filename, toast, lang) {
if (typeof XLSX === 'undefined') { toast && toast(lang === 'vi' ? 'Thư viện Excel chưa sẵn sàng, thử lại sau giây lát' : 'Excel library not ready yet', 'error'); return; }
const wb = XLSX.utils.book_new();
sheets.forEach((sh, i) => {
const ws = XLSX.utils.aoa_to_sheet([sh.header].concat(sh.rows));
if (sh.widths) ws['!cols'] = sh.widths.map(w => ({ wch:w }));
XLSX.utils.book_append_sheet(wb, ws, (sh.name || ('Sheet' + (i + 1))).slice(0, 31));
});
XLSX.writeFile(wb, filename + '.xlsx');
toast && toast(lang === 'vi' ? 'Đã xuất Excel' : 'Excel exported', 'success');
}
function rpEsc(s){ return String(s == null ? '' : s).replace(/[&<>"]/g, c => ({ '&':'&', '<':'<', '>':'>', '"':'"' }[c])); }
/* ============ khung (tiêu đề + hành động + thanh điều khiển + vùng in) ============ */
function ReportShell({ title, subtitle, period, onExcel, filename, children }) {
const p = usePortal();
const { lang } = useLang();
const toast = useToast();
const docRef = React.useRef(null);
const brandName = (p.branding && p.branding.name) || 'S.W.O';
const periodText = (lang === 'vi' ? 'Kỳ báo cáo: ' : 'Period: ') + fmtVNDate(period.from) + ' – ' + fmtVNDate(period.to);
const doPrint = () => {
const node = docRef.current; if (!node) return;
const abs = f => { try { return new URL(f, location.href).href; } catch (e) { return f; } };
const head = '