55 lines
2.4 KiB
JavaScript
55 lines
2.4 KiB
JavaScript
/**
|
|
* 项目级页面渲染模块。
|
|
* 展示单个项目的达标状态、指标使用数量、准确数量和预警指标，并列出项目下所有治理指标。
|
|
*/
|
|
function renderProjectView() {
|
|
if (projectMonitoringState.loading) {
|
|
app.innerHTML = '<div class="empty-state">正在获取项目监控数据...</div>';
|
|
return;
|
|
}
|
|
if (projectMonitoringState.error || !projectMonitoringState.data) {
|
|
app.innerHTML = `<div class="empty-state">项目监控数据加载失败：${projectMonitoringState.error || "暂无数据"}</div>`;
|
|
return;
|
|
}
|
|
const data = projectMonitoringState.data;
|
|
const project = data.MetricProjectInfo || {};
|
|
const rows = Array.isArray(data.MetricDataAnalysises) ? data.MetricDataAnalysises : [];
|
|
|
|
app.innerHTML = `
|
|
<section class="metric-cards project-metric-cards">
|
|
${miniMetric("达标状态", data.UsageState || "-", "", "")}
|
|
${miniMetric("指标使用数量", data.MetricUsageInfo || "-", "", "")}
|
|
${miniMetric("准确数量", data.MetricAccuracyInfo || "-", "", "")}
|
|
${miniMetric("预警指标", toSafeNumber(data.AbnormalNum), "项", "")}
|
|
</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("所属企业", project.UnitName || state.enterpriseName)}
|
|
${fieldRow("项目名称", project.ProjectName || project.ProjectShortName || "-")}
|
|
${fieldRow("项目编号", project.ProjectCode || "-")}
|
|
${fieldRow("项目地址", project.ProjectAddress || "-")}
|
|
${fieldRow("项目状态", project.ProjectState || data.OnlineState || "-")}
|
|
${fieldRow("开工日期", formatApiDate(project.StartDate) || "-")}
|
|
${fieldRow("数据日期", formatApiDate(data.DataDate) || "-")}
|
|
</div>
|
|
</article>
|
|
|
|
<article class="panel">
|
|
<div class="panel-header">
|
|
<div>
|
|
<h2 class="panel-title">指标分析</h2>
|
|
</div>
|
|
</div>
|
|
${renderIndicatorTable(rows)}
|
|
</article>
|
|
</section>
|
|
`;
|
|
}
|