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>

Demo/index.html

@@ -0,0 +1,164 @@
+<!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="index">
+<header class="topnav" id="topnav"></header>
+
+<div class="container">
+  <!-- REQ-001/002 统一门户与三类行动入口 -->
+  <div class="hero">
+    <h1>一人公司 · 超级个体产业社区</h1>
+    <p>以真实订单为牵引，连接政策服务、能力认证、企业需求、任务协同、质量交付、结算评价和绩效监管的产业公共服务基础设施。</p>
+    <div style="margin-top:18px" id="hero-login">
+      <a class="btn" href="login.html">登录 / 选择角色进入系统</a>
+      <a class="btn ghost" href="showcase.html" target="_blank">查看社区大屏</a>
+      <a class="btn ghost" href="req-doc.html" target="_blank">帮助 / 需求文档</a>
+    </div>
+  </div>
+
+  <div class="entry-cards">
+    <div class="entry-card">
+      <h3>我要接订单</h3>
+      <p>OPC 注册建档、能力认证、进入订单池承接任务</p>
+      <a class="btn" href="login.html">登录进入 OPC 工作台</a>
+    </div>
+    <div class="entry-card">
+      <h3>我要找服务</h3>
+      <p>企业/个人发布需求、浏览服务产品、咨询询价</p>
+      <a class="btn" href="login.html">登录发布需求</a>
+    </div>
+    <div class="entry-card">
+      <h3>我要看成效</h3>
+      <p>政府主管部门查看订单、就业、收入与资金绩效</p>
+      <a class="btn" href="login.html">登录进入政府驾驶舱</a>
+    </div>
+  </div>
+
+  <!-- REQ-009 服务目录（按服务结果组织） -->
+  <div class="section">
+    <h2>服务目录 <span class="req">REQ-009 · 按"服务结果"组织</span>
+      <span style="margin-left:auto"><a class="btn sm ghost" href="market.html">OPC橙果商城 →</a></span>
+    </h2>
+    <div class="grid grid-4" id="products"></div>
+  </div>
+
+  <!-- REQ-003/006 优秀案例与能力名片 -->
+  <div class="section">
+    <h2>优秀 OPC 与交付案例 <span class="req">REQ-003~007 · 经授权脱敏、运营商审核发布，AI 生成内容须标注</span></h2>
+    <div class="grid grid-3" id="cases"></div>
+  </div>
+
+  <!-- REQ-005 示范场景专区 -->
+  <div class="section">
+    <h2>示范场景专区 <span class="req">REQ-005</span></h2>
+    <div class="card"><table id="scenes"></table></div>
+  </div>
+
+  <!-- REQ-008/095 活动日历 + REQ-010 投诉建议 -->
+  <div class="section">
+    <div class="two-col">
+      <div class="card">
+        <h3>活动日历 <span class="req">REQ-008/095</span></h3>
+        <ul class="list" id="acts"></ul>
+        <p class="muted" style="margin-top:8px">每场活动关联后续线索与订单转化（REQ-096/097）。</p>
+      </div>
+      <div class="card">
+        <h3>帮助与投诉 <span class="req">REQ-010</span></h3>
+        <ul class="list">
+          <li><span>帮助中心 / 常见问题</span><a class="btn sm ghost" href="req-doc.html" target="_blank">查看</a></li>
+          <li><span>投诉建议通道（工单可追溯）</span><button class="btn sm" onclick="complaint()">提交</button></li>
+          <li><span>政策公告</span><a class="btn sm ghost" href="policy.html">查看</a></li>
+        </ul>
+      </div>
+    </div>
+  </div>
+</div>
+
+<div class="footer">OPC 公共服务平台 Demo · 静态原型 · 数据 assets/mock.json</div>
+<script src="assets/app.js"></script>
+<script src="assets/store.js"></script>
+<script>
+function renderPage(DB) {
+  const P = DB.portal;
+  // 已登录用户：hero 区登录按钮改为"进入工作台"
+  const role = currentRole();
+  if (role) {
+    document.getElementById('hero-login').innerHTML =
+      `<a class="btn" href="${ROLES[role].home}">进入 ${ROLES[role].name} 工作台</a>
+       <a class="btn ghost" href="showcase.html" target="_blank">查看社区大屏</a>
+       <a class="btn ghost" href="req-doc.html" target="_blank">帮助 / 需求文档</a>`;
+  }
+  document.getElementById('products').innerHTML = P.products.map(p => `
+    <div class="card"><h3>${p.name}</h3><div class="sub">${p.cat}</div><p class="muted">${p.brief}</p>
+    <button class="btn sm" onclick="productDetail('${p.name}')">查看详情</button>
+    <button class="btn sm ghost" onclick="toast('已提交咨询，运营商将在 4 小时内联系您')">咨询询价</button></div>
+  `).join('');
+
+  document.getElementById('cases').innerHTML = P.cases.map(c => `
+    <div class="card"><h3>${c.name} <span class="badge pri">${c.level}</span></h3>
+    <p class="muted">${c.tags}</p><p class="muted">${c.stats}</p>${B(c.status)}</div>
+  `).join('');
+
+  document.getElementById('scenes').innerHTML =
+    `<tr><th>示范场景</th><th>委托方</th><th>交付成果</th><th>验收结论</th><th>复制推广</th></tr>` +
+    P.demoScenes.map(s => `<tr><td>${s.scene}</td><td>${s.client}</td><td>${s.result}</td><td>${B(s.accept)}</td><td>${s.spread}</td></tr>`).join('');
+
+  document.getElementById('acts').innerHTML = P.activities.map(a => `<li><span>${a.name}</span><span>${
+    a.action === 'signup'
+      ? `<button class="btn sm" onclick="signup(this,'${a.name}')">报名</button>`
+      : `<button class="btn sm ghost" onclick="toast('活动尚未开放报名，已为您设置提醒')">提醒</button>`
+  }</span></li>`).join('');
+}
+
+function productDetail(name) {
+  const p = DB.portal.products.find(x => x.name === name);
+  openModal({
+    title: name,
+    body: `<table>
+      <tr><th>产品编码</th><td>${p.code}</td></tr>
+      <tr><th>适用场景</th><td>${p.scene}</td></tr>
+      <tr><th>交付物</th><td>${p.items}</td></tr>
+      <tr><th>交付周期</th><td>${p.cycle}</td></tr>
+      <tr><th>价格区间</th><td>${p.price}</td></tr>
+      <tr><th>验收规则</th><td>${p.accept}</td></tr>
+      <tr><th>修改次数</th><td>${p.revise}</td></tr>
+      <tr><th>版权说明</th><td>交付即转移使用权，素材来源记录归档备查</td></tr>
+    </table>`,
+    actions: [
+      { label: '关闭', cls: 'ghost' },
+      { label: '发起采购', onClick: m => { m.remove(); toast('已转入采购流程：请登录企业工作台完善需求'); location.href = 'enterprise.html'; } },
+    ],
+  });
+}
+function signup(btn, name) {
+  confirmDlg('活动报名', `确认报名「${name}」？报名成功后将短信通知签到码。`, '确认报名', () => {
+    btn.outerHTML = '<span class="badge ok">已报名</span>';
+    toast('报名成功，签到码已发送');
+  });
+}
+function complaint() {
+  openModal({
+    title: '投诉建议',
+    body: `
+      <div class="field"><label>类型</label><select id="cp-type"><option>服务质量投诉</option><option>交付争议</option><option>机构/课程投诉</option><option>功能建议</option></select></div>
+      <div class="field"><label>关联单号（选填）</label><input id="cp-order" placeholder="ORDER_/SVC_/CERT_ 编号"></div>
+      <div class="field"><label>问题描述</label><textarea id="cp-desc" placeholder="请描述问题经过与诉求"></textarea></div>`,
+    actions: [
+      { label: '取消', cls: 'ghost' },
+      { label: '提交工单', onClick: m => {
+        const d = document.getElementById('cp-desc').value.trim();
+        if (!d) { toast('请填写问题描述', 'warn'); return; }
+        m.remove();
+        toast('工单 CP_2026091201 已提交，处理进度可在工单中心跟踪');
+      } },
+    ],
+  });
+}
+</script>
+</body>
+</html>