feat: 绩效模块重构 + UI 统一样式 + 标题联动

- 新增绩效模块(季度考核表,目标/完成/权重/评分,localStorage)
- 产品模块增加版本迭代/产品运营双Tab
- 方案模块Tab改为下划线样式
- 顶部标题随模块切换联动更新
- OPC来信弹窗恢复并采用信件样式排版
- 费用模块移入业务顶部Tab(平台费用)
- 侧边栏:项目→业务,台账→Focus,新增绩效
- 顶部品牌区增加版本号显示v1.0.0.2

templates/index.html

@@ -49,17 +49,13 @@
             <i data-lucide="home" style="width:20px;height:20px"></i>
             <span class="text-[10px] mt-1">首页</span>
           </div>
-          <div class="sidebar-tab" data-tab="finance" onclick="switchTab('finance')" title="项目管理">
+          <div class="sidebar-tab" data-tab="finance" onclick="switchTab('finance')" title="业务">
             <i data-lucide="folder-open-dot" style="width:20px;height:20px"></i>
-            <span class="text-[10px] mt-1">项目</span>
+            <span class="text-[10px] mt-1">业务</span>
           </div>
-          <div class="sidebar-tab" data-tab="expense" onclick="switchTab('expense')" title="费用管理">
-            <i data-lucide="receipt" style="width:20px;height:20px"></i>
-            <span class="text-[10px] mt-1">费用</span>
-          </div>
-          <div class="sidebar-tab" data-tab="projects" onclick="switchTab('projects')" title="重点工作与台账">
+          <div class="sidebar-tab" data-tab="projects" onclick="switchTab('projects')" title="Focus">
             <i data-lucide="file-text" style="width:20px;height:20px"></i>
-            <span class="text-[10px] mt-1">台账</span>
+            <span class="text-[10px] mt-1">Focus</span>
           </div>
           <div class="sidebar-tab" data-tab="proposals" onclick="switchTab('proposals')" title="业务方案">
             <i data-lucide="package" style="width:20px;height:20px"></i>
@@ -69,18 +65,18 @@
             <i data-lucide="wallet-cards" style="width:20px;height:20px"></i>
             <span class="text-[10px] mt-1">产品</span>
           </div>
-          <div class="sidebar-tab" data-tab="operations" onclick="switchTab('operations')" title="运营">
-            <i data-lucide="trending-up" style="width:20px;height:20px"></i>
-            <span class="text-[10px] mt-1">运营</span>
+          <div class="sidebar-tab" data-tab="performance" onclick="switchTab('performance')" title="绩效">
+            <i data-lucide="target" style="width:20px;height:20px"></i>
+            <span class="text-[10px] mt-1">绩效</span>
           </div>
         </div>
       </aside>
       <!-- 主内容区 -->
       <div class="flex-1 min-w-0">
     <header class="topbar border-b border-slate-200 bg-white px-8 py-5">
-      <div class="flex items-center justify-between gap-3">
-        <div>
-          <p class="eyebrow text-xs font-semibold uppercase tracking-[0.18em] text-blue-700">OPC Manager</p>
+      <div class="flex items-center gap-3 w-full">
+        <div class="flex-1">
+          <p class="eyebrow text-xs font-semibold uppercase tracking-[0.18em] text-blue-700">OPC Manager <span class="ml-2 text-xs font-normal text-slate-400 tracking-normal">v1.0.0.2</span></p>
           <div class="flex items-center gap-4 mt-1">
             <h1 class="text-2xl font-semibold" id="workspaceTitle">科普 OPC 工作台</h1>
             <div class="hidden sm:flex items-center gap-1.5 bg-gradient-to-r from-blue-50 to-indigo-50 border border-blue-100 rounded-full px-4 py-1.5">
@@ -89,6 +85,9 @@
             </div>
           </div>
         </div>
+        <button onclick="document.getElementById('opcLetterModal').classList.remove('hidden')" class="ml-auto flex-shrink-0 flex items-center justify-center w-10 h-10 rounded-full bg-blue-50 border border-blue-200 hover:bg-blue-100 transition-colors" title="OPC 来信">
+          <i data-lucide="mail" class="text-blue-500" style="width:18px;height:18px"></i>
+        </button>
       </div>
     </header>
 
@@ -97,9 +96,9 @@
       <section id="projects" class="panel"></section>
       <section id="proposals" class="panel"></section>
       <section id="products" class="panel"></section>
-      <section id="operations" class="panel"></section>
+      <section id="performance" class="panel"></section>
+      <section id="performance" class="panel"></section>
       <section id="finance" class="panel"></section>
-      <section id="expense" class="panel"></section>
     </main>
       </div><!-- 关闭主内容区 -->
     </div><!-- 关闭 flex 容器 -->
@@ -127,11 +126,47 @@
     <script src="{{ url_for('static', filename='modules/projects.js') }}"></script>
     <script src="{{ url_for('static', filename='modules/proposals.js') }}"></script>
     <script src="{{ url_for('static', filename='modules/products.js') }}"></script>
-    <script src="{{ url_for('static', filename='modules/operations.js') }}"></script>
+    <script src="{{ url_for('static', filename='modules/performance.js') }}"></script>
     <script src="{{ url_for('static', filename='modules/finance.js') }}"></script>
     <script src="{{ url_for('static', filename='modules/expense.js') }}"></script>
     <script src="{{ url_for('static', filename='modules/drawer.js') }}"></script>
     <script src="{{ url_for('static', filename='modules/admin.js') }}"></script>
     <script src="{{ url_for('static', filename='app.js') }}"></script>
+
+    <!-- OPC 来信弹窗 -->
+    <div id="opcLetterModal" class="hidden fixed inset-0 z-50 flex items-center justify-center bg-black/40" onclick="this.classList.add('hidden')">
+      <div class="bg-white rounded-2xl shadow-2xl w-full max-w-2xl mx-4 max-h-[85vh] overflow-y-auto" onclick="event.stopPropagation()">
+        <div class="sticky top-0 bg-white/95 backdrop-blur border-b border-slate-100 px-8 py-5 flex items-center justify-between">
+          <h2 class="text-xl font-bold text-slate-800">致所有 OPC 的一封信</h2>
+          <button class="btn btn-ghost btn-sm rounded-full w-8 h-8 p-0" onclick="document.getElementById('opcLetterModal').classList.add('hidden')"><i data-lucide="x"></i></button>
+        </div>
+        <div class="p-8 text-slate-700 leading-relaxed" style="background:#fdfcf8;font-family:Georgia,'Times New Roman',serif">
+          <p class="text-slate-500 text-sm mb-6">亲爱的 OPC：</p>
+          <p class="mb-6">对于每一位业务 Owner（OPC），公司和我个人都发自内心地充满了期待：</p>
+          <ul class="list-disc list-inside mb-6 space-y-1.5 text-slate-600">
+            <li>期待每一个人的业务都能够突破</li>
+            <li>期待每一个人都成为自己赛道最璀璨的明星</li>
+            <li>期待每一个人都实现事业上的成功与财务上的自由</li>
+          </ul>
+          <p class="mb-8">所以竭尽所能，把自己对业务管理的每一份理解，都融入这个系统，希望能够助力每一位 OPC 都快速地成长。</p>
+          <hr class="my-6 border-slate-200">
+          <ol class="list-decimal list-inside space-y-4 mb-6 text-sm" style="padding-left:0">
+            <li><strong>财务：</strong>以终为始，用清晰的财务指标，让每个人都清晰地知道自己当下的成绩</li>
+            <li><strong>业务：</strong>将目标转换成不同的项目，每一个项目就是一场战役</li>
+            <li><strong>Focus：</strong>理清工作重点，并把每个重点工作的落地转换成工作清单</li>
+            <li><strong>方案：</strong>如何清晰地和客户描述清楚我们的价值、产品、运营与报价</li>
+            <li><strong>产品：</strong>
+              <ul class="list-disc list-inside ml-4 mt-1 space-y-1 text-slate-500">
+                <li>版本迭代：构建一个数字系统，对业务加杠杆，让业务变得有规模、有流程、有壁垒</li>
+                <li>产品运营：产品在真实场景是否真实地落地，真正地成为可以交付的价值</li>
+              </ul>
+            </li>
+            <li><strong>绩效：</strong>实时评分，了解当前阶段，我们和目标还有什么差距</li>
+          </ol>
+          <hr class="my-6 border-slate-200">
+          <p class="text-right text-sm text-slate-500">—— 与你同行的团队</p>
+        </div>
+      </div>
+    </div>
   </body>
 </html>