From 3de6cfd48db8a016320eb7a4315ef622ec20549a Mon Sep 17 00:00:00 2001
From: zulifeng <lifeng.zu@d-robotics.cc>
Date: Thu, 29 Jan 2026 17:56:08 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=B8=BA=E8=B7=9F=E8=BF=9B=E8=AE=B0?=
 =?UTF-8?q?=E5=BD=95=E5=92=8C=E8=AF=95=E7=94=A8=E6=9C=9F=E5=AE=B9=E5=99=A8?=
 =?UTF-8?q?=E6=96=B0=E5=A2=9E=E5=8A=A8=E7=94=BB=E6=95=88=E6=9E=9C=E3=80=81?=
 =?UTF-8?q?=E5=88=B7=E6=96=B0=E6=8C=89=E9=92=AE=E5=92=8C=E5=88=86=E9=A1=B5?=
 =?UTF-8?q?=E5=8A=9F=E8=83=BD=EF=BC=8C=E5=B9=B6=E8=B0=83=E6=95=B4=E4=BA=86?=
 =?UTF-8?q?=E8=B7=9F=E8=BF=9B=E8=AE=B0=E5=BD=95=E8=A1=A8=E6=A0=BC=E7=BB=93?=
 =?UTF-8?q?=E6=9E=84=E5=8F=8A=E5=AE=A2=E6=88=B7=E8=BF=9B=E5=BA=A6=E6=A8=A1?=
 =?UTF-8?q?=E6=80=81=E6=A1=86=E7=9A=84=E5=AD=97=E6=AE=B5=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/css/style.css |   4 +
 frontend/index.html    | 361 ++++++++++++++++++++++++++++++++++-------
 2 files changed, 310 insertions(+), 55 deletions(-)

diff --git a/frontend/css/style.css b/frontend/css/style.css
index 5af80e9..6585bbb 100644
--- a/frontend/css/style.css
+++ b/frontend/css/style.css
@@ -2362,6 +2362,10 @@ tr:hover .action-cell {
   }
 }
 
+.animate-up {
+  animation: fadeIn 0.4s ease-out;
+}
+
 /* ==================== Weekly Summary Styles ==================== */
 .weekly-summary-header {
   display: flex;
diff --git a/frontend/index.html b/frontend/index.html
index 68c59aa..b7428c3 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -322,7 +322,7 @@
                         </div>
                     </div>
 
-                    <div class="card trial-periods-container">
+                    <div class="card trial-periods-container animate-up">
                         <!-- 客户列表标头 -->
                         <div class="card-header">
                             <h3 class="card-title">
@@ -512,6 +512,10 @@
                             <i class="fas fa-plus"></i>
                             添加跟进
                         </button>
+                        <button id="refreshFollowupsBtn" class="btn-secondary">
+                            <i class="fas fa-sync-alt"></i>
+                            刷新
+                        </button>
                     </div>
 
                     <!-- Follow-up Form -->
@@ -564,7 +568,7 @@
                                     <button type="submit" class="btn-primary">
                                         <i class="fas fa-save"></i> 保存跟进记录
                                     </button>
-                                    <button type="button" id="cancelFollowUpBtn" class="btn-secondary">
+                                    <button type="button" id="cancelFollowupBtn" class="btn-secondary">
                                         取消
                                     </button>
                                 </div>
@@ -572,7 +576,7 @@
                         </div>
                     </div>
 
-                    <div class="card table-card">
+                    <div class="card table-card animate-up">
                         <div class="card-header">
                             <h3><i class="fas fa-history"></i> 跟进记录</h3>
                         </div>
@@ -582,17 +586,39 @@
                                     <thead>
                                         <tr>
                                             <th>客户名称</th>
-                                            <th>跟进时间</th>
-                                            <th>跟进内容</th>
-                                            <th>客户级别</th>
                                             <th>成交状态</th>
-                                            <th>下次跟进</th>
+                                            <th>客户级别</th>
+                                            <th>行业</th>
+                                            <th>跟进时间</th>
+                                            <th>通知状态</th>
                                             <th>操作</th>
                                         </tr>
                                     </thead>
                                     <tbody id="followupTableBody"></tbody>
                                 </table>
                             </div>
+
+                            <!-- Pagination for follow-ups -->
+                            <div class="pagination">
+                                <div class="pagination-info">
+                                    <span id="followupPaginationInfo">显示 0-0 共 0 条</span>
+                                </div>
+                                <div class="pagination-controls">
+                                    <button id="followupFirstPage" class="pagination-btn" disabled>
+                                        <i class="fas fa-angle-double-left"></i>
+                                    </button>
+                                    <button id="followupPrevPage" class="pagination-btn" disabled>
+                                        <i class="fas fa-angle-left"></i>
+                                    </button>
+                                    <div id="followupPageNumbers" class="page-numbers"></div>
+                                    <button id="followupNextPage" class="pagination-btn" disabled>
+                                        <i class="fas fa-angle-right"></i>
+                                    </button>
+                                    <button id="followupLastPage" class="pagination-btn" disabled>
+                                        <i class="fas fa-angle-double-right"></i>
+                                    </button>
+                                </div>
+                            </div>
                         </div>
                     </div>
                 </section>
@@ -600,58 +626,62 @@
         </div>
     </div>
 
-    <!-- Modal for adding customer -->
-    <div id="customerModal" class="modal">
+    <!-- Modal for adding customer progress -->
+    <div id="createModal" class="modal">
         <div class="modal-content">
             <div class="modal-header">
                 <h3><i class="fas fa-user-plus"></i> 添加客户进度</h3>
                 <span class="close">&times;</span>
             </div>
             <div class="modal-body">
-                <form id="customerForm">
-                    <input type="hidden" id="customerId" />
+                <form id="createCustomerForm">
+                    <input type="hidden" id="createCustomerId" />
                     <div class="form-row">
                         <div class="form-group">
-                            <label for="customerName">客户名称 <span style="color: red">*</span></label>
-                            <input type="text" id="customerName" name="customerName" placeholder="请输入客户名称" required />
+                            <label for="createCustomerName">客户名称 <span style="color: red">*</span></label>
+                            <select id="createCustomerName" name="customerName" required>
+                                <option value="">请选择客户</option>
+                            </select>
                         </div>
                         <div class="form-group">
-                            <label for="consultationTime">咨询时间 <span style="color: red">*</span></label>
-                            <input type="date" id="consultationTime" name="consultationTime" required />
+                            <label for="createIntendedProduct">咨询时间 <span style="color: red">*</span></label>
+                            <input type="date" id="createIntendedProduct" name="intendedProduct" required />
                         </div>
                     </div>
                     <div class="form-row">
                         <div class="form-group">
-                            <label for="version">版本</label>
-                            <input type="text" id="version" name="version" placeholder="如：v1.0" />
+                            <label for="createVersion">版本</label>
+                            <input type="text" id="createVersion" name="version" placeholder="如：v1.0" />
                         </div>
                         <div class="form-group">
-                            <label for="type">类型 <span style="color: red">*</span></label>
-                            <select id="type" name="type" required>
+                            <label for="createType">类型 <span style="color: red">*</span></label>
+                            <select id="createType" name="type" required>
                                 <option value="">请选择类型</option>
                                 <option value="私有化">私有化</option>
                                 <option value="公有云">公有云</option>
                                 <option value="其他">其他</option>
                             </select>
-                            <input type="text" id="typeOther" name="typeOther" placeholder="请输入其他类型"
-                                style="display: none; margin-top: 8px" />
                         </div>
                     </div>
                     <div class="form-row">
                         <div class="form-group">
-                            <label for="module">模块</label>
-                            <select id="module" name="module">
+                            <label for="createModule">模块</label>
+                            <select id="createModule" name="module">
                                 <option value="">请选择模块</option>
-                                <option value="数据闭环">数据闭环</option>
-                                <option value="robogo">robogo</option>
+                                <option value="数据生成">数据生成</option>
+                                <option value="数据集">数据集</option>
+                                <option value="数据空间">数据空间</option>
+                                <option value="模型工坊">模型工坊</option>
+                                <option value="模型广场">模型广场</option>
+                                <option value="镜像管理">镜像管理</option>
                                 <option value="其他">其他</option>
                             </select>
-                            <input type="text" id="moduleOther" name="moduleOther" placeholder="请填写模块名称"
+                            <input type="text" id="createModuleOther" name="moduleOther" placeholder="请填写模块名称"
                                 style="display: none; margin-top: 8px" />
                         </div>
                         <div class="form-group">
-                            <label for="statusProgress">状态与进度 <span style="color: red">*</span></label>
-                            <select id="statusProgress" name="statusProgress" required>
+                            <label for="createStatusProgress">状态与进度 <span style="color: red">*</span></label>
+                            <select id="createStatusProgress" name="statusProgress" required>
                                 <option value="">请选择状态</option>
                                 <option value="已完成">已完成</option>
                                 <option value="进行中">进行中</option>
@@ -662,19 +692,19 @@
                         </div>
                     </div>
                     <div class="form-group">
-                        <label for="description">描述</label>
-                        <textarea id="description" name="description" rows="3" placeholder="请输入问题描述..."></textarea>
+                        <label for="createDescription">描述</label>
+                        <textarea id="createDescription" name="description" rows="3" placeholder="请输入问题描述..."></textarea>
                     </div>
                     <div class="form-group">
-                        <label for="solution">解决方案</label>
-                        <textarea id="solution" name="solution" rows="3" placeholder="请输入拟采取的解决方案..."></textarea>
+                        <label for="createSolution">解决方案</label>
+                        <textarea id="createSolution" name="solution" rows="3" placeholder="请输入拟采取的解决方案..."></textarea>
                     </div>
                     <div class="form-actions">
                         <button type="submit" class="btn-primary">
                             <i class="fas fa-save"></i>
                             保存
                         </button>
-                        <button type="button" class="btn-secondary cancel">
+                        <button type="button" class="btn-secondary cancel-create">
                             <i class="fas fa-times"></i>
                             取消
                         </button>
@@ -684,6 +714,225 @@
         </div>
     </div>
 
+    <!-- Modal for editing customer progress -->
+    <div id="editModal" class="modal">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h3><i class="fas fa-edit"></i> 编辑客户进度</h3>
+                <span class="close">&times;</span>
+            </div>
+            <div class="modal-body">
+                <form id="editCustomerForm">
+                    <input type="hidden" id="editCustomerId" />
+                    <div class="form-row">
+                        <div class="form-group">
+                            <label for="editCustomerName">客户名称 <span style="color: red">*</span></label>
+                            <input type="text" id="editCustomerName" name="customerName" readonly />
+                        </div>
+                        <div class="form-group">
+                            <label for="editIntendedProduct">咨询时间 <span style="color: red">*</span></label>
+                            <input type="date" id="editIntendedProduct" name="intendedProduct" required />
+                        </div>
+                    </div>
+                    <div class="form-row">
+                        <div class="form-group">
+                            <label for="editVersion">版本</label>
+                            <input type="text" id="editVersion" name="version" />
+                        </div>
+                        <div class="form-group">
+                            <label for="editType">类型 <span style="color: red">*</span></label>
+                            <select id="editType" name="type" required>
+                                <option value="">请选择类型</option>
+                                <option value="私有化">私有化</option>
+                                <option value="公有云">公有云</option>
+                                <option value="其他">其他</option>
+                            </select>
+                        </div>
+                    </div>
+                    <div class="form-row">
+                        <div class="form-group">
+                            <label for="editModule">模块</label>
+                            <select id="editModule" name="module">
+                                <option value="">请选择模块</option>
+                                <option value="数据生成">数据生成</option>
+                                <option value="数据集">数据集</option>
+                                <option value="数据空间">数据空间</option>
+                                <option value="模型工坊">模型工坊</option>
+                                <option value="模型广场">模型广场</option>
+                                <option value="镜像管理">镜像管理</option>
+                                <option value="其他">其他</option>
+                            </select>
+                            <input type="text" id="editModuleOther" name="moduleOther" placeholder="请填写模块名称"
+                                style="display: none; margin-top: 8px" />
+                        </div>
+                        <div class="form-group">
+                            <label for="editStatusProgress">状态与进度 <span style="color: red">*</span></label>
+                            <select id="editStatusProgress" name="statusProgress" required>
+                                <option value="">请选择状态</option>
+                                <option value="已完成">已完成</option>
+                                <option value="进行中">进行中</option>
+                                <option value="待排期">待排期</option>
+                                <option value="已驳回">已驳回</option>
+                                <option value="已上线">已上线</option>
+                            </select>
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label for="editDescription">描述</label>
+                        <textarea id="editDescription" name="description" rows="3"></textarea>
+                    </div>
+                    <div class="form-group">
+                        <label for="editSolution">解决方案</label>
+                        <textarea id="editSolution" name="solution" rows="3"></textarea>
+                    </div>
+
+                    <!-- Trial period details (Read-only reference) -->
+                    <div class="trial-details-section" style="margin-top: 15px; padding-top: 15px; border-top: 1px dashed #eee;">
+                        <h4><i class="fas fa-clock"></i> 试用时间参考</h4>
+                        <div class="form-row">
+                            <div class="form-group">
+                                <label for="editTrialStart">开始时间</label>
+                                <input type="datetime-local" id="editTrialStart" readonly />
+                            </div>
+                            <div class="form-group">
+                                <label for="editTrialEnd">结束时间</label>
+                                <input type="datetime-local" id="editTrialEnd" readonly />
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="form-actions">
+                        <button type="submit" class="btn-primary">
+                            <i class="fas fa-save"></i>
+                            更新
+                        </button>
+                        <button type="button" class="btn-secondary cancel-edit">
+                            <i class="fas fa-times"></i>
+                            取消
+                        </button>
+                    </div>
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <!-- Modal for adding follow-up -->
+    <div id="addFollowupModal" class="modal">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h3><i class="fas fa-plus-circle"></i> 新增跟进记录</h3>
+                <span class="close">&times;</span>
+            </div>
+            <div class="modal-body">
+                <form id="addFollowupModalForm">
+                    <div class="form-row">
+                        <div class="form-group">
+                            <label for="addFollowupCustomerName">客户名称 <span style="color: red">*</span></label>
+                            <select id="addFollowupCustomerName" name="customerName" required>
+                                <option value="">请选择客户</option>
+                            </select>
+                        </div>
+                        <div class="form-group">
+                            <label for="addFollowupDealStatus">成交状态 <span style="color: red">*</span></label>
+                            <select id="addFollowupDealStatus" name="dealStatus" required>
+                                <option value="">请选择</option>
+                                <option value="已成交">已成交</option>
+                                <option value="未成交">未成交</option>
+                            </select>
+                        </div>
+                    </div>
+                    <div class="form-row">
+                        <div class="form-group">
+                            <label for="addFollowupCustomerLevel">客户级别 <span style="color: red">*</span></label>
+                            <select id="addFollowupCustomerLevel" name="customerLevel" required>
+                                <option value="">请选择</option>
+                                <option value="A">A级 (重点客户)</option>
+                                <option value="B">B级 (潜在客户)</option>
+                                <option value="C">C级 (一般客户)</option>
+                            </select>
+                        </div>
+                        <div class="form-group">
+                            <label for="addFollowupIndustry">行业</label>
+                            <input type="text" id="addFollowupIndustry" name="industry" placeholder="请输入行业" />
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label for="addFollowupTime">跟进时间 <span style="color: red">*</span></label>
+                        <input type="datetime-local" id="addFollowupTime" name="followUpTime" required />
+                    </div>
+                    <div class="form-actions">
+                        <button type="submit" class="btn-primary">
+                            <i class="fas fa-save"></i>
+                            保存
+                        </button>
+                        <button type="button" class="btn-secondary cancel-add-followup">
+                            取消
+                        </button>
+                    </div>
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <!-- Modal for editing follow-up -->
+    <div id="editFollowupModal" class="modal">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h3><i class="fas fa-edit"></i> 编辑跟进记录</h3>
+                <span class="close">&times;</span>
+            </div>
+            <div class="modal-body">
+                <form id="editFollowupForm">
+                    <input type="hidden" id="editFollowupId" />
+                    <div class="form-row">
+                        <div class="form-group">
+                            <label for="editFollowupCustomerName">客户名称 <span style="color: red">*</span></label>
+                            <select id="editFollowupCustomerName" name="customerName" required>
+                                <option value="">请选择客户</option>
+                            </select>
+                        </div>
+                        <div class="form-group">
+                            <label for="editFollowupDealStatus">成交状态 <span style="color: red">*</span></label>
+                            <select id="editFollowupDealStatus" name="dealStatus" required>
+                                <option value="">请选择</option>
+                                <option value="已成交">已成交</option>
+                                <option value="未成交">未成交</option>
+                            </select>
+                        </div>
+                    </div>
+                    <div class="form-row">
+                        <div class="form-group">
+                            <label for="editFollowupCustomerLevel">客户级别 <span style="color: red">*</span></label>
+                            <select id="editFollowupCustomerLevel" name="customerLevel" required>
+                                <option value="">请选择</option>
+                                <option value="A">A级 (重点客户)</option>
+                                <option value="B">B级 (潜在客户)</option>
+                                <option value="C">C级 (一般客户)</option>
+                            </select>
+                        </div>
+                        <div class="form-group">
+                            <label for="editFollowupIndustry">行业</label>
+                            <input type="text" id="editFollowupIndustry" name="industry" />
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label for="editFollowupTime">跟进时间 <span style="color: red">*</span></label>
+                        <input type="datetime-local" id="editFollowupTime" name="followUpTime" required />
+                    </div>
+                    <div class="form-actions">
+                        <button type="submit" class="btn-primary">
+                            <i class="fas fa-save"></i>
+                            更新
+                        </button>
+                        <button type="button" class="btn-secondary cancel-edit-followup">
+                            取消
+                        </button>
+                    </div>
+                </form>
+            </div>
+        </div>
+    </div>
+
     <!-- Modal for CSV Import -->
     <div id="importModal" class="modal">
         <div class="modal-content">
@@ -692,28 +941,30 @@
                 <span class="close">&times;</span>
             </div>
             <div class="modal-body">
-                <div class="import-instructions">
-                    <p>请选择包含以下列的CSV文件：</p>
-                    <ul>
-                        <li>客户, 咨询时间, 版本, 描述, 解决方案, 类型, 模块, 状态与进度</li>
-                    </ul>
-                    <p><small>* 第一行为表头，数据将从第二行开始导入。</small></p>
-                </div>
-                <div class="file-upload">
-                    <i class="fas fa-cloud-upload-alt"></i>
-                    <p>点击或拖拽文件到此处</p>
-                    <input type="file" id="csvFileInput" accept=".csv" />
-                </div>
-                <div id="importStatus" style="margin-top: 15px"></div>
-                <div class="form-actions">
-                    <button id="confirmImportBtn" class="btn-primary" disabled>
-                        <i class="fas fa-check"></i>
-                        开始导入
-                    </button>
-                    <button type="button" class="btn-secondary cancel-import">
-                        取消
-                    </button>
-                </div>
+                <form id="importFileForm">
+                    <div class="import-instructions">
+                        <p>请选择包含以下列的CSV文件：</p>
+                        <ul>
+                            <li>客户, 咨询时间, 版本, 描述, 解决方案, 类型, 模块, 状态与进度</li>
+                        </ul>
+                        <p><small>* 第一行为表头，数据将从第二行开始导入。</small></p>
+                    </div>
+                    <div class="file-upload">
+                        <i class="fas fa-cloud-upload-alt"></i>
+                        <p id="fileName">选择文件...</p>
+                        <input type="file" id="importFile" accept=".csv" />
+                    </div>
+                    <div id="importStatus" style="margin-top: 15px"></div>
+                    <div class="form-actions">
+                        <button type="submit" id="confirmImportBtn" class="btn-primary">
+                            <i class="fas fa-check"></i>
+                            开始导入
+                        </button>
+                        <button type="button" class="btn-secondary cancel-import">
+                            取消
+                        </button>
+                    </div>
+                </form>
             </div>
         </div>
     </div>