qiukai/opc-manager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

v1.7.8 — 首页改为3表格卡片(合同/确收/毛利) + 合同时间维指标

Browse Source
This commit is contained in:
mac
2026-06-16 14:21:57 +08:00
parent 6adc00a8a7
commit be6a7f5c38
2 changed files with 35 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
static/app.js
View File

@@ -93,7 +93,25 @@ function render() {
function renderHome() {
const { summary, financeMonthly } = state.data;
const m = summary.metrics;
const rows1 = [
["年度累计签约", money(m.signed_annual || m.signed_amount)],
["Q2 累计签约", money(m.signed_q2 || 0)],
["本月新增签约", money(m.signed_month || 0)],
["合同流程中", money(m.pipeline_amount)],
];
const rows2 = [
["年度累计确收", money(m.revenue_annual)],
["Q2 累计确收", money(m.revenue_q2)],
["本月新增确收", money(m.monthly_revenue)],
["已签约未执行", money(m.signed_not_executed)],
];
const rows3 = [
["年度累计毛利", money(m.gross_annual)],
["Q2 累计毛利", money(m.gross_q2)],
["本月新增毛利", money(m.monthly_net_profit)],
["合同毛利率", m.revenue_annual ? Math.round(m.gross_annual / m.revenue_annual * 100) + "%" : "—"],
];
const tblCard = (title, rows) => card(`<h3 class="text-sm font-bold text-slate-700 mb-3">${title}</h3><table class="w-full text-sm"><tbody>${rows.map(([label, value]) => `<tr class="border-b border-slate-100 last:border-0"><td class="py-2 pr-4 text-slate-500">${label}</td><td class="py-2 text-right font-semibold text-slate-800">${value}</td></tr>`).join("")}</tbody></table>`, "p-4");
document.querySelector("#home").innerHTML = `
<div class="grid gap-5">
<div class="grid grid-cols-4 gap-3">
@@ -108,16 +126,7 @@ function renderHome() {
["已签约未执行", money(m.signed_not_executed), "finance"],
].map(([label, value, tab]) => `<button class="metric-card" onclick="switchTab('${tab}')"><span class="flex items-center gap-2 text-xs text-slate-500"><i data-lucide="gauge"></i>${label}</span><strong class="mt-2 block text-2xl">${value}</strong></button>`).join("")}
</div>
<div class="grid grid-cols-4 gap-3">
${[
["已签约合同总额", money(m.signed_amount), "projects"],
["合同流程中", money(m.pipeline_amount), "projects"],
["年度累计确收", money(m.revenue_annual), "finance"],
["Q2 累计确收", money(m.revenue_q2), "finance"],
["年度累计毛利", money(m.gross_annual), "finance"],
["Q2 累计毛利", money(m.gross_q2), "finance"],
].map(([label, value, tab]) => `<button class="metric-card" onclick="switchTab('${tab}')"><span class="flex items-center gap-2 text-xs text-slate-500"><i data-lucide="trending-up"></i>${label}</span><strong class="mt-2 block text-2xl">${value}</strong></button>`).join("")}
</div>
<div class="grid grid-cols-3 gap-5">${tblCard("合同金额", rows1)}${tblCard("确收金额", rows2)}${tblCard("确收毛利", rows3)}</div>
<div class="grid grid-cols-2 gap-5">
${card(`<div class="mb-3 flex items-center justify-between"><h2 class="text-sm font-bold text-slate-600">财务趋势</h2>${badge("YYYY-MM")}</div><div style="position:relative;height:140px"><canvas id="financeChart"></canvas></div>`, "p-4")}
${card(`<h2 class="text-lg font-bold">风险提醒</h2><div class="mt-3 grid gap-2">${(summary.risks.length ? summary.risks : [{ title: "暂无高风险", content: "当前无明确阻塞，按周更新即可。" }]).map((r) => `<div class="rounded-md border border-amber-200 bg-amber-50 p-3"><p class="font-bold text-amber-900">${r.title}</p><p class="mt-1 text-sm text-amber-800 break-words">${r.content}</p></div>`).join("")}</div>`, "p-5")}