feat: OPC 工作台 — 科普（慰心斋）单项目管理系统

Flask + Tailwind CSS + Trix + Chart.js + Lucide Icons + SQLite - 首页概览：关键指标卡片、财务趋势图、风险提醒、近期动态 - 销售管理：客户表格 + 抽屉详情（自动保存 + 评论） - 业务方案：版本表格 + 抽屉（文件上传/预览/删除 + 评论） - 运营管理：项目表格（业务机会/执行项目分类）+ 抽屉 - 产品研发：版本表格 + 抽屉 - 财务管理：月度收入/毛利/成本/净利曲线图 + 明细表 - 所有抽屉：Plane 风格紧凑布局、字段失焦自动保存、Trix 富文本评论框、点击遮罩关闭
2026-05-30 00:08:28 +08:00
commit 8dc69f8bd6
12 changed files with 2059 additions and 0 deletions
--- a/templates/index.html
+++ b/templates/index.html
@@ -0,0 +1,59 @@
+<!doctype html>
+<html lang="zh-CN">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>科普（慰心斋）OPC 工作台</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <script>
+      tailwind.config = {
+        theme: {
+          extend: {
+            colors: {
+              brand: {
+                50: '#eff6ff',
+                600: '#2563eb',
+                700: '#1d4ed8'
+              }
+            }
+          }
+        }
+      }
+    </script>
+    <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}">
+    <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.8/dist/chart.umd.min.js"></script>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/trix@2/dist/trix.css">
+    <script src="https://unpkg.com/lucide@latest"></script>
+    <script src="https://cdn.jsdelivr.net/npm/trix@2/dist/trix.umd.min.js" defer></script>
+  </head>
+  <body class="min-h-screen bg-slate-50 text-slate-950">
+    <header class="topbar border-b border-slate-200 bg-white px-8 py-5">
+      <div>
+        <p class="eyebrow text-xs font-semibold uppercase tracking-[0.18em] text-blue-700">OPC Manager · 单用户 · 单项目</p>
+        <h1 class="mt-1 text-2xl font-semibold">科普（慰心斋）OPC 工作台</h1>
+      </div>
+      <button id="refreshBtn" class="rounded-md border border-slate-200 bg-white px-3 py-2 text-sm font-medium hover:bg-slate-50" type="button"><i data-lucide="refresh-cw"></i>刷新</button>
+    </header>
+
+    <nav class="tabs border-b border-slate-200 bg-white px-8" id="tabs">
+      <button class="active" data-tab="home"><i data-lucide="home"></i>首页</button>
+      <button data-tab="sales"><i data-lucide="briefcase-business"></i>销售管理</button>
+      <button data-tab="proposals"><i data-lucide="file-text"></i>业务方案</button>
+      <button data-tab="operations"><i data-lucide="activity"></i>运营管理</button>
+      <button data-tab="products"><i data-lucide="package"></i>产品研发</button>
+      <button data-tab="finance"><i data-lucide="wallet-cards"></i>财务管理</button>
+    </nav>
+
+    <main class="px-8 py-6">
+      <section id="home" class="panel active"></section>
+      <section id="sales" class="panel"></section>
+      <section id="proposals" class="panel"></section>
+      <section id="operations" class="panel"></section>
+      <section id="products" class="panel"></section>
+      <section id="finance" class="panel"></section>
+    </main>
+
+    <aside id="drawer" class="drawer" aria-hidden="true"></aside>
+    <script src="{{ url_for('static', filename='app.js') }}"></script>
+  </body>
+</html>