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

refactor: 财务模块卡片头部重构为单行功能区 + 表格增加状态列

Browse Source 
- 卡片头部简化为单行: 视图标签 | 筛选:状态/月份/季度下拉 + 新增按钮
- 状态筛选从标签按钮改为统一风格下拉框（自定义SVG箭头）
- 下拉框字体/高度与视图标签 btn-sm 完全对齐
- 表格增加状态列（已签约/流程中/待签约，分色显示）
- 季度视图 p-4 padding 修复
This commit is contained in:
mac
2026-07-03 19:06:54 +08:00
parent 493150cb27
commit ff7eb19d5d
6 changed files with 313 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
static/modules/home.js
View File

@@ -8,28 +8,55 @@ function renderHome() {
["年度累计", moneyInt(m.signed_annual || m.signed_amount)],
["季度累计", moneyInt(m.signed_q2 || 0)],
["本月新增", moneyInt(m.signed_month || 0)],
["上季度累计", moneyInt(m.signed_prev_q || 0)],
["上月累计", moneyInt(m.signed_prev_month || 0)],
];
const rows2 = [
["年度累计", moneyInt(m.revenue_annual)],
["季度累计", moneyInt(m.revenue_q2)],
["本月新增", moneyInt(m.monthly_revenue)],
["上季度累计", moneyInt(m.revenue_prev_q || 0)],
["上月累计", moneyInt(m.revenue_prev_month || 0)],
];
const rows3 = [
["年度累计", moneyInt(m.gross_annual)],
["季度累计", moneyInt(m.gross_q2)],
["本月新增", moneyInt(m.monthly_net_profit)],
["上季度累计", moneyInt(m.gross_prev_q || 0)],
["上月累计", moneyInt(m.gross_prev_month || 0)],
];
const rows4 = [
["年度累计", moneyInt(m.payment_annual || 0)],
["季度累计", moneyInt(m.payment_q2 || 0)],
["本月新增", moneyInt(m.payment_month || 0)],
["上季度累计", moneyInt(m.payment_prev_q || 0)],
["上月累计", moneyInt(m.payment_prev_month || 0)],
];
const rows5 = [
["年度累计", moneyInt(m.cost_annual || 0)],
["季度累计", moneyInt(m.cost_q2 || 0)],
["本月新增", moneyInt(m.cost_month || 0)],
["上季度累计", moneyInt(m.cost_prev_q || 0)],
["上月累计", moneyInt(m.cost_prev_month || 0)],
];
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");
let _cardId = 0;
const tblCard = (title, rows) => {
const id = 'finCard' + (++_cardId);
const visible = rows.slice(0, 3);
const extra = rows.slice(3);
const rowHtml = (r) => r.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("");
return card(`<h3 class="text-sm font-bold text-slate-700 mb-3">${title}</h3><table class="w-full text-sm"><tbody>${rowHtml(visible)}</tbody></table><table class="w-full text-sm hidden" id="${id}"><tbody>${rowHtml(extra)}</tbody></table><button class="w-full text-center py-1 text-xs text-slate-400 hover:text-slate-600" onclick="toggleFinCard('${id}')" id="${id}_btn"><i data-lucide="chevron-down" style="width:14px;height:14px;display:inline"></i></button>`, "p-4");
};
window.toggleFinCard = (id) => {
const t = document.getElementById(id);
if (!t) return;
t.classList.toggle("hidden");
const btn = document.getElementById(id + "_btn");
btn.innerHTML = t.classList.contains("hidden")
? '<i data-lucide="chevron-down" style="width:14px;height:14px;display:inline"></i>'
: '<i data-lucide="chevron-up" style="width:14px;height:14px;display:inline"></i>';
if (window.lucide) window.lucide.createIcons();
};
document.querySelector("#home").innerHTML = `
<div class="grid gap-5">
${state.tenant === "总工作台" ? "" : `<div class="grid grid-cols-4 gap-3">