Files
OPC/Demo/government.html
T
freedakandDevin f307e877c9 feat: OPC 社区运营公共服务平台 Demo v1.3
一人公司/超级个体产业社区公共服务基础设施 Demo,包含:
- 18 个角色页面(运营商/OPC/企业/个人/学员/培训机构/服务机构/政府/审计/金融)
- 暖橙活力主题 UI(渐变毛玻璃 + 暖色侧栏)
- 五步运营闭环(选方向→育人才→建平台→立SOP→聚产业)
- 华强北硬件供应链接入
- 蜂群式交付 + 产业集聚效应展示
- 需求文档(REQ-001~118 全覆盖)

Generated with [Devin](https://devin.ai)

Co-Authored-By: Devin <158243242+devin-ai-integration[bot]@users.noreply.github.com>
2026-09-13 09:07:23 +08:00

177 lines
8.6 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>政府驾驶舱 · OPC 公共服务平台 Demo</title>
<link rel="stylesheet" href="assets/style.css">
</head>
<body data-page="government" class="gov">
<header class="topnav" id="topnav"></header>
<div class="container">
<div class="gov-banner">
<span class="badge">ADMIN</span>
<span id="gov-banner-text">政府主管部门视图 · 仅展示经授权、脱敏、汇总后的监管数据(REQ-087)</span>
</div>
<div class="page-title">绩效驾驶舱
<span style="float:right" class="no-print" id="gov-actions">
<button class="btn sm ghost" onclick="publishPolicy()">发布政策</button>
<button class="btn sm" onclick="window.print()">导出季度报告</button>
</span>
</div>
<div class="page-sub" id="gov-sub">月度监测 · 季度评价 · 年度审计(REQ-091)· 数据截至 2026-09-11 · 点击指标卡可下钻(REQ-053)</div>
<!-- REQ-088 核心指标 + §8.2 年度目标对比 -->
<div class="grid grid-4" id="gov-core"></div>
<!-- 就业 / 示范 / 培训 -->
<div class="section grid grid-4" id="gov-secondary"></div>
<!-- REQ-090 财政资金 + REQ-076 资源券绩效 -->
<div class="section">
<div class="two-col">
<div class="card">
<h3>财政资金专账 <span class="req">REQ-090 · 里程碑拨付</span></h3>
<table id="fund-tbl"></table>
</div>
<div class="card">
<h3>资源券绩效 <span class="req">REQ-076</span></h3>
<ul class="list" id="coupon-list"></ul>
<p class="muted" style="margin-top:8px">质量与交付数据由订单质检脱敏汇总同步(REQ-058);审计机构经授权可查台账(<a href="audit.html">审计视图</a>,REQ-093)。</p>
</div>
</div>
</div>
<!-- REQ-109 财政补贴培训绩效 -->
<div class="section">
<div class="card">
<h3>财政补贴培训项目绩效 <span class="req">REQ-109/110</span></h3>
<table id="subsidy-tbl"></table>
<p class="muted" style="margin-top:8px">收费与补贴并存项目已区分资金来源,无重复申报预警(REQ-110)。</p>
</div>
</div>
<!-- REQ-092 预警 + REQ-094 操作日志 -->
<div class="section">
<div class="two-col">
<div class="card">
<h3>风险与整改 <span class="req">REQ-092</span></h3>
<ul class="list" id="risk-list"></ul>
</div>
<div class="card">
<h3>政府侧操作日志 <span class="req">REQ-094</span></h3>
<ul class="list" id="log-list"></ul>
<button class="btn sm ghost" style="margin-top:8px" onclick="toast('完整操作日志导出中…(演示)')">导出日志</button>
</div>
</div>
</div>
</div>
<div class="footer">OPC 公共服务平台 Demo · 政府驾驶舱 · 数据脱敏汇总</div>
<script src="assets/app.js"></script>
<script src="assets/store.js"></script>
<script>
function renderPage(DB) {
const G = DB.gov;
const role = currentRole();
const isAuditor = role === 'auditor';
const isOperator = role === 'operator';
// auditor 和 operator 都是只读:隐藏发布政策按钮,保留导出
if (isAuditor || isOperator) {
document.getElementById('gov-actions').innerHTML = '<button class="btn sm" onclick="window.print()">导出季度报告</button>';
}
if (isAuditor) {
document.getElementById('gov-banner-text').textContent = '审计机构授权只读视图 · 仅可查看经授权、脱敏、汇总后的监管数据(REQ-093)';
document.getElementById('gov-sub').textContent = '授权范围内核查绩效与资金台账 · 数据截至 2026-09-11 · 点击指标卡可下钻(REQ-053)';
} else if (isOperator) {
document.getElementById('gov-banner-text').textContent = '运营商管理视图 · 全量监管数据汇总(REQ-087)· 政策发布与拨付由政府主管部门执行';
document.getElementById('gov-sub').textContent = '运营商视角 · 月度监测 · 季度评价 · 年度审计(REQ-091)· 数据截至 2026-09-11 · 点击指标卡可下钻(REQ-053)';
}
document.getElementById('gov-core').innerHTML = G.core.map(c => `
<div class="card"${c.drill ? ` style="cursor:pointer" onclick="drill('${c.label}','${c.drill}')"` : ''}>
<h3>${c.label}</h3><div class="num">${c.num}</div>
${c.pct ? BAR(c.pct) : `<p class="muted">${c.sub || ''} ${c.subBadge ? B(c.subBadge) : ''}</p>`}
</div>`).join('');
document.getElementById('gov-secondary').innerHTML = G.secondary.map(c =>
`<div class="card"><h3>${c.label}</h3><div class="num">${c.num}</div>${c.sub ? `<p class="muted">${c.sub}</p>` : ''}</div>`).join('');
renderFunding();
document.getElementById('coupon-list').innerHTML = G.coupon.map(c =>
LI(c[0], Array.isArray(c[1]) ? B(c[1]) : c[1])).join('');
document.getElementById('subsidy-tbl').innerHTML =
`<tr><th>项目</th><th>承接机构</th><th>参训人数</th><th>取证率</th><th>训后接单转化率</th><th>补贴核算</th></tr>` +
G.trainingSubsidy.map(s => `<tr><td>${s.project}</td><td>${s.org}</td><td>${s.people}</td><td>${s.certRate}</td><td>${s.conv}</td><td>${B(s.settle)}</td></tr>`).join('');
document.getElementById('risk-list').innerHTML = G.risks.map(r => `<li><span>${r.item}</span><span>${
r.action === 'rectify' ? `<button class="btn sm" onclick="rectify()">整改跟踪</button>`
: r.action === 'detail' ? `${r.text} <button class="btn sm ghost" onclick="toast('未办结 1 件:交付争议仲裁中(REQ-060)','warn')">详情</button>`
: B(r.badge)
}</span></li>`).join('');
document.getElementById('log-list').innerHTML = G.logs.map(l =>
`<li><span>${l[0]}</span><span class="muted">${l[1]}</span></li>`).join('');
}
function renderFunding() {
const canPay = currentRole() === 'gov';
document.getElementById('fund-tbl').innerHTML =
`<tr><th>拨付节点</th><th>比例</th><th>金额</th><th>状态</th></tr>` +
DB.gov.funding.map((f, i) => `<tr><td>${f.node}</td><td>${f.pct}</td><td>${f.amount}</td><td>${B(f.status)}${
f.action === 'pay' && canPay ? ` <button class="btn sm" onclick="pay(${i})">拨付确认</button>` : ''
}</td></tr>`).join('');
}
function drill(title, detail) {
openModal({ title: '指标下钻 · ' + title, body: `<p>${detail}</p><p class="muted" style="margin-top:8px">统一指标口径见 §8.1,计算逻辑可审计(REQ-089);支持按业务模式/项目/OPC 三维度下钻(REQ-053)。</p>` });
}
function pay(i) {
const f = DB.gov.funding[i];
confirmDlg('里程碑拨付确认', `确认「${f.node}」里程碑达成,拨付 ${f.pct}(${f.amount})?拨付后进入财政专账台账并留痕。`, '确认拨付', () => {
f.status = ['已拨付', 'ok']; f.action = null;
renderFunding();
toast(`拨付完成:${f.amount}已记入财政资金专账(REQ-090)`);
});
}
function rectify() {
openModal({
title: '整改跟踪 · 跨境电商视觉按时率',
body: `<table>
<tr><th>触发</th><td>按时交付率连续 2 月低于 95%(REQ-052/092)</td></tr>
<tr><th>整改措施</th><td>① 新增替补产能 12 人 ② SOP 交付清单修订 ③ 相关人员复训</td></tr>
<tr><th>状态</th><td><span class="badge warn">整改中 · 9 月底复核</span></td></tr>
<tr><th>闭环</th><td>复核达标后自动解除预警并归档整改报告</td></tr>
</table>`,
actions: [
{ label: '关闭', cls: 'ghost' },
{ label: '催办整改', onClick: m => { m.remove(); toast('已向运营商发送整改催办通知'); } },
],
});
}
function publishPolicy() {
openModal({
title: '发布政策(REQ-071/094)',
body: `
<div class="field"><label>政策名称</label><input placeholder="如:软件工具券发放细则"></div>
<div class="field-row">
<div class="field"><label>发文机关</label><select><option>区经信局</option><option>区人社局</option><option>市科技局</option></select></div>
<div class="field"><label>截止日期</label><input type="date"></div>
</div>
<div class="field"><label>适用对象与申报条件(结构化建模)</label><textarea placeholder="按发文机关、适用对象、申报条件、材料清单、补贴额度建模"></textarea></div>
<p class="muted">入库后触发主体画像匹配重算并向适配主体推送(REQ-073);操作全程留痕(REQ-094)。</p>`,
actions: [
{ label: '取消', cls: 'ghost' },
{ label: '发布并触发匹配', onClick: m => { m.remove(); toast('政策已入库,匹配重算完成:新增命中主体 214 个'); } },
],
});
}
</script>
</body>
</html>