OPC/Demo/policy.html

<!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="policy">
<header class="topnav" id="topnav"></header>

<div class="container">
  <div class="page-title">政策服务</div>
  <div class="page-sub">政策库 · 自动匹配 · 申报闭环 · 资源券核销</div>

  <!-- REQ-072/077 AI 自动匹配 -->
  <div class="card" style="background:#eef2ff;border-color:#c7d2fe">
    <h3>主体画像自动匹配 <span class="req">REQ-072/077</span></h3>
    <p class="muted" id="pol-profile"></p>
    <table id="match-tbl"></table>
    <p class="muted" style="margin-top:8px">confidence &lt; 0.6 的匹配结果提示人工核对，不编造政策条款（REQ-077）。</p>
  </div>

  <!-- 金融/园区方资源产品（finance/operator 角色） -->
  <div class="section" id="fin-section" style="display:none">
    <h2>我的资源产品 <span class="req">REQ-076 · 资源供给方视图</span></h2>
    <div class="grid grid-3" id="fin-grid"></div>
  </div>

  <!-- REQ-071/075 政策库 -->
  <div class="section">
    <h2>政策库 <span class="req">REQ-071/075</span></h2>
    <div class="card">
      <table id="lib-tbl"></table>
      <p class="muted" style="margin-top:8px">失效政策标注并保留历史版本，已申报记录保留政策快照（REQ-080）。</p>
    </div>
  </div>

  <!-- REQ-074/076 申报流程 + 资源券闭环 -->
  <div class="section">
    <div class="two-col">
      <div class="card">
        <h3>我的申报 <span class="req">REQ-074</span></h3>
        <ul class="list" id="apply-list"></ul>
      </div>
      <div class="card">
        <h3>资源券台账 <span class="req">REQ-076 · 发放—使用—核销—绩效</span></h3>
        <ul class="list" id="coupon-list"></ul>
        <button class="btn sm" style="margin-top:8px" onclick="useCoupon()">券核销支付（演示 ¥500）</button>
      </div>
    </div>
  </div>

  <!-- REQ-079 防套利 -->
  <div class="section">
    <div class="notice">REQ-079：重复申报、虚假申报自动预警——申报结果计入主体信用与绩效台账，与实名、合同、验收、收款、发票交叉核验。</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 P = DB.policy;
  const role = currentRole();
  const isFinance = ['finance', 'operator'].includes(role);
  document.getElementById('pol-profile').textContent = isFinance
    ? '供给方视图：' + P.finance.org + ' · 资源产品核销与主体匹配情况'
    : '画像：' + P.profile;

  // 金融/园区资源产品区
  const finSec = document.getElementById('fin-section');
  finSec.style.display = isFinance ? '' : 'none';
  if (isFinance) {
    document.getElementById('fin-grid').innerHTML = P.finance.products.map((p, i) => `
      <div class="card"><h3>${p.name}</h3><div class="sub">${p.code}</div>
      <p class="muted">额度 ${p.quota} · ${p.used}</p>${B(p.status)}
      <div style="margin-top:10px"><button class="btn sm ghost" onclick="finDetail(${i})">核销明细</button>
      <button class="btn sm ghost" onclick="finPublish()">发布资源</button></div></div>`).join('');
  }

  const acts = {
    apply:  p => `<button class="btn sm" onclick="apply(this,'${p.name}')">一键申报</button>`,
    coupon: p => `<button class="btn sm" onclick="coupon(this)">申领</button>`,
    agent:  p => `<button class="btn sm ghost" onclick="agent(this)">咨询代办</button>`,
  };
  document.getElementById('match-tbl').innerHTML =
    `<tr><th>命中政策</th><th>命中依据</th><th>缺失条件</th><th>置信度</th><th>操作</th></tr>` +
    P.matched.map(p => `<tr><td>${p.name}</td><td>${p.basis}</td><td>${p.missing}</td><td>${B(p.conf)}</td><td>${acts[p.action](p)}</td></tr>`).join('');

  document.getElementById('lib-tbl').innerHTML =
    `<tr><th>政策</th><th>发文机关</th><th>适用对象</th><th>补贴额度</th><th>截止</th><th>状态</th></tr>` +
    P.library.map((p, i) => `<tr><td>${p.name}</td><td>${p.org}</td><td>${p.target}</td><td>${p.quota}</td><td>${p.ddl}</td><td>${B(p.status)} ${
      p.snapshot
        ? `<button class="btn sm ghost" onclick="toast('已加载政策快照 V2025：该版本为历史申报记录存档（REQ-080）')">快照</button>`
        : `<button class="btn sm ghost" onclick="policyDetail(${i})">详情</button>`
    }</td></tr>`).join('');

  renderApplications();
  renderCoupon();
}

function finDetail(i) {
  const p = DB.policy.finance.products[i];
  openModal({
    title: '核销明细 · ' + p.code,
    body: `<table>
      <tr><th>产品</th><td>${p.name}</td></tr>
      <tr><th>总额度</th><td>${p.quota}</td></tr>
      <tr><th>使用进度</th><td>${p.used}</td></tr>
      <tr><th>近 30 天核销</th><td>VCH_ 关联有效订单 96 单 · 按产出核销</td></tr>
      <tr><th>异常预警</th><td><span class="badge ok">无重复申报/套利预警（REQ-079）</span></td></tr>
    </table>`,
  });
}
function finPublish() {
  openModal({
    title: '发布资源产品（金融/园区方）',
    body: `<div class="field"><label>资源名称</label><input placeholder="如：模型券池 / 共享工位"></div>
      <div class="field-row">
        <div class="field"><label>额度/数量</label><input placeholder="¥ 或 工位数"></div>
        <div class="field"><label>适用对象</label><select><option>L2 以上认证 OPC</option><option>全部 OPC</option><option>入驻企业</option></select></div>
      </div>`,
    actions: [
      { label: '取消', cls: 'ghost' },
      { label: '提交发布', onClick: m => { m.remove(); toast('资源产品已提交，运营商审核后进入政策库与券台账'); } },
    ],
  });
}
function renderApplications() {
  document.getElementById('apply-list').innerHTML = DB.policy.applications.map(a =>
    `<li><span>${a.name}</span><span>${
      a.action === 'upload' ? `<button class="btn sm" onclick="uploadMat(this)">上传发票</button>` : B(a.badge)
    }</span></li>`).join('');
}

function renderCoupon() {
  const c = DB.policy.coupon;
  document.getElementById('coupon-list').innerHTML =
    LI('算力券余额', `<span id="coupon-bal">¥${c.balance.toLocaleString()} / ¥${c.total.toLocaleString()}</span>`) +
    LI('已核销产出', `<span class="muted">${c.linked}</span>`) +
    LI('绩效口径', B(['按使用量+实际产出', 'pri']));
}

function apply(btn, name) {
  const p = DB.policy.matched.find(x => x.name === name);
  openModal({
    title: '一键申报 · ' + name,
    body: `<p class="muted">申报清单（REQ-074），材料模板可在线填写：</p>
      <div class="checks">${p.materials.map(x => `<label><input type="checkbox" class="mat" checked> ${x}（已预填，可补充）</label>`).join('')}</div>
      <div class="field"><label>补充材料</label><input type="file"></div>`,
    actions: [
      { label: '取消', cls: 'ghost' },
      { label: '提交申报', onClick: m => {
        m.remove();
        btn.outerHTML = '<span class="badge warn">审核中（人社）</span>';
        DB.policy.applications.unshift({ code: 'APLY_2026091201', name, badge: ['审核中（人社）', 'warn'] });
        renderApplications();
        toast('申报已提交，进度与结果将归档（REQ-074）');
      } },
    ],
  });
}
function coupon(btn) {
  confirmDlg('申领算力券', '按细则可申领 ≤¥10,000/年。申领后进入「发放—使用—核销—绩效」闭环，按实际产出核销（REQ-076）。', '确认申领', () => {
    btn.outerHTML = '<span class="badge warn">发放审核中</span>';
    DB.policy.applications.unshift({ code: 'APLY_2026091202', name: '算力券申领（第 5 批）', badge: ['发放审核中', 'warn'] });
    renderApplications();
    toast('申领已提交，经信局审核后发放至券台账');
  });
}
function agent(btn) {
  openModal({
    title: '政策落实代办（REQ-078）',
    body: `<p>该政策置信度 0.55 需人工核对。可由运营商或合作机构协助申报，代办过程留痕。</p>
      <div class="field"><label>代办事项</label><textarea>小微企业创业担保贷款 · 担保材料整理与申报</textarea></div>`,
    actions: [
      { label: '取消', cls: 'ghost' },
      { label: '申请代办', onClick: m => { m.remove(); btn.outerHTML = '<span class="badge info">代办中</span>'; toast('代办工单已创建，专员将在 1 个工作日内联系'); } },
    ],
  });
}
function policyDetail(i) {
  const p = DB.policy.library[i];
  openModal({
    title: p.name,
    body: `<table>
      <tr><th>发文机关</th><td>${p.org}</td></tr>
      <tr><th>申报条件</th><td>${p.conds.map(c => '· ' + c).join('<br>')}</td></tr>
      <tr><th>材料清单</th><td>${p.mats.map(c => '· ' + c).join('<br>')}</td></tr>
      <tr><th>政策快照</th><td>V2026-09 · 条款随申报记录存档（REQ-080）</td></tr>
    </table>`,
    actions: [
      { label: '关闭', cls: 'ghost' },
      { label: '检测匹配', onClick: m => { m.remove(); toast('主体画像匹配重算完成：命中条件已更新（REQ-073）'); } },
    ],
  });
}
function uploadMat(btn) {
  openModal({
    title: '上传补充材料 · 算力券申领',
    body: `<p class="muted">缺失材料：近 3 个月算力消费发票</p><div class="field"><label>发票文件</label><input type="file"></div>`,
    actions: [
      { label: '取消', cls: 'ghost' },
      { label: '提交', onClick: m => {
        m.remove();
        const a = DB.policy.applications.find(x => x.action === 'upload');
        if (a) { delete a.action; a.badge = ['材料已齐 · 审核中', 'warn']; }
        renderApplications();
        toast('材料 4/4 已齐，进入审核');
      } },
    ],
  });
}
function useCoupon() {
  confirmDlg('算力券核销', '本次算力消费 ¥500 使用算力券支付？核销将关联订单产出计入绩效。', '确认核销', () => {
    DB.policy.coupon.balance -= 500;
    renderCoupon();
    toast('核销成功：已关联 ORDER_2026091001 交付产出');
  });
}
</script>
</body>
</html>