54 lines
2.5 KiB
JavaScript
54 lines
2.5 KiB
JavaScript
/* ObsiGate — XLSX dashboard renderer (#154-A5).
|
|
*
|
|
* Pure string builders for the workbook dashboard inspector (named ranges, KPI
|
|
* cards). Extracted from frontend/js/viewer.js; the viewer handles the fetch,
|
|
* the inspector host and the range → grid link.
|
|
*/
|
|
import { t } from '../i18n.js';
|
|
import { escapeHtml } from '../utils.js';
|
|
|
|
export function renderDashboardLoading() {
|
|
return `<div class="xlsx-dashboard-loading">…</div>`;
|
|
}
|
|
|
|
/**
|
|
* @param {object} dash - payload of GET …/xlsx/dashboard
|
|
* @returns {string} the inspector body markup
|
|
*/
|
|
export function renderDashboardHtml(dash) {
|
|
const namedRanges = dash.named_ranges || [];
|
|
const sheets = dash.sheets || [];
|
|
const rangeRows = namedRanges.map((r) =>
|
|
`<tr class="xlsx-range-row" data-ref="${escapeHtml(r.ref || "")}"><td><code>${escapeHtml(r.name)}</code></td><td>${escapeHtml(r.scope || "—")}</td><td><code>${escapeHtml(r.ref)}</code></td></tr>`,
|
|
).join("");
|
|
const kpiCards = sheets.map((s) => {
|
|
const cards = (s.kpi || []).map((k) =>
|
|
`<span class="xlsx-kpi"><span class="xlsx-kpi-label">${escapeHtml(k.label)}</span><span class="xlsx-kpi-value">${escapeHtml(String(k.value))}</span></span>`,
|
|
).join("");
|
|
return `<div class="xlsx-kpi-sheet">
|
|
<h4>${escapeHtml(s.name)}</h4>
|
|
<p class="xlsx-kpi-meta">${escapeHtml(t("xlsx.dashboard_stats", {
|
|
cells: s.cells, rows: s.rows, cols: s.cols, formulas: s.formulas, numeric: s.numeric,
|
|
}))}</p>
|
|
<div class="xlsx-kpi-cards">${cards || "<span class=\"xlsx-kpi-empty\">—</span>"}</div>
|
|
</div>`;
|
|
}).join("");
|
|
return `
|
|
<div class="xlsx-dashboard-head">
|
|
<h3><i data-lucide="layout-dashboard" style="width:14px;height:14px"></i> ${escapeHtml(t("xlsx.dashboard_title"))}</h3>
|
|
<span class="xlsx-dashboard-objects">
|
|
${escapeHtml(t("xlsx.dashboard_charts", { n: dash.objects?.charts ?? 0 }))}
|
|
· ${escapeHtml(t("xlsx.dashboard_pivots", { n: dash.objects?.pivots ?? 0 }))}
|
|
</span>
|
|
</div>
|
|
${namedRanges.length || sheets.length ? "" : `<p class="xlsx-kpi-empty">${escapeHtml(t("xlsx.dashboard_empty"))}</p>`}
|
|
${namedRanges.length ? `
|
|
<table class="csv-table xlsx-ranges-table"><thead><tr>
|
|
<th>${escapeHtml(t("xlsx.dashboard_nr_name"))}</th>
|
|
<th>${escapeHtml(t("xlsx.dashboard_nr_scope"))}</th>
|
|
<th>${escapeHtml(t("xlsx.dashboard_nr_ref"))}</th>
|
|
</tr></thead><tbody>${rangeRows}</tbody></table>` : ""}
|
|
<div class="xlsx-kpi-grid">${kpiCards}</div>
|
|
<p class="xlsx-dashboard-hint">${escapeHtml(t("xlsx.dashboard_hint"))}</p>`;
|
|
}
|