79 lines
3.2 KiB
JavaScript
79 lines
3.2 KiB
JavaScript
|
/**
|
||
|
|
* 项目级页面渲染模块。
|
||
|
|
* 展示单个项目的上线状态、指标启用数量、准确数量和预警指标，并列出项目下所有治理指标。
|
||
|
|
*/
|
||
|
|
function renderProjectView() {
|
||
|
|
const enterprise = getEnterprise(state.enterpriseName);
|
||
|
|
const project = getProjectById(state.projectId);
|
||
|
|
const rows = buildIndicatorRows(project);
|
||
|
|
const enabledCount = rows.filter((row) => row.enabled).length;
|
||
|
|
const accurateCount = rows.filter((row) => row.enabled && !row.isWarning).length;
|
||
|
|
const warningIndicatorCount = rows.filter((row) => row.isWarning).length;
|
||
|
|
|
||
|
|
app.innerHTML = `
|
||
|
|
<section class="metric-cards">
|
||
|
|
${miniMetric("项目上线状态", project.systemStatus, "", project.created ? "已创建项目档案并进入系统" : "未创建项目档案，需先完成上线")}
|
||
|
|
${miniMetric("指标使用数量", `${enabledCount}/${rows.length}`, "", "项目内治理指标动没动")}
|
||
|
|
${miniMetric("数据准确数量", `${accurateCount}/${rows.length}`, "", "数据准不准")}
|
||
|
|
${miniMetric("预警指标", warningIndicatorCount, "项", "")}
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<section class="project-layout">
|
||
|
|
<article class="panel">
|
||
|
|
<div class="panel-header">
|
||
|
|
<div>
|
||
|
|
<h2 class="panel-title">项目信息</h2>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="field-list">
|
||
|
|
${fieldRow("所属企业", enterprise.name)}
|
||
|
|
${fieldRow("项目名称", project.name)}
|
||
|
|
${fieldRow("系统状态", project.systemStatus)}
|
||
|
|
${fieldRow("开工日期", project.startDate)}
|
||
|
|
${fieldRow("最近更新", project.lastUpdate)}
|
||
|
|
</div>
|
||
|
|
</article>
|
||
|
|
|
||
|
|
<article class="panel">
|
||
|
|
<div class="panel-header">
|
||
|
|
<div>
|
||
|
|
<h2 class="panel-title">指标分析</h2>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
${renderIndicatorTable(rows)}
|
||
|
|
</article>
|
||
|
|
</section>
|
||
|
|
`;
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* 统一弹窗渲染入口。
|
||
|
|
* state.drillView 决定展示集团上线统计、企业项目清单、指标项目穿透或指标趋势；
|
||
|
|
* 关闭弹窗时清空 body，避免旧内容残留到下一次打开。
|
||
|
|
*/
|
||
|
|
function renderDrillModal() {
|
||
|
|
if (!state.drillOpen) {
|
||
|
|
drillModal.hidden = true;
|
||
|
|
drillModalBody.innerHTML = "";
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
const indicator = getSelectedIndicator();
|
||
|
|
drillModal.hidden = false;
|
||
|
|
if (state.drillView === "groupOnlineStats") {
|
||
|
|
drillModalTitle.textContent = "集团项目上线统计";
|
||
|
|
drillModalBody.innerHTML = renderGroupOnlineStatsModal();
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
if (state.drillView === "enterpriseProjectList") {
|
||
|
|
drillModalTitle.textContent = `${state.enterpriseName} · 项目清单`;
|
||
|
|
drillModalBody.innerHTML = renderEnterpriseProjectListModal(state.drillListType);
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
drillModalTitle.textContent = `${indicator.name} · 指标穿透分析`;
|
||
|
|
if (state.drillView === "project") {
|
||
|
|
drillModalBody.innerHTML = renderIndicatorProjectView();
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
drillModalBody.innerHTML = renderIndicatorTrendView();
|
||
|
|
}
|