From 3a9c3f96e841534a9208672491356da30dc11106 Mon Sep 17 00:00:00 2001
From: Trae AI <trae@example.com>
Date: Wed, 24 Dec 2025 12:04:04 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E6=88=90=E6=89=80=E6=9C=89=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD=E5=AE=9E=E7=8E=B0=EF=BC=9A=E7=94=A8=E6=88=B7=E4=B8=AD?=
 =?UTF-8?q?=E5=BF=83=E3=80=81=E9=80=80=E5=87=BA=E7=99=BB=E5=BD=95=E8=B7=B3?=
 =?UTF-8?q?=E8=BD=AC=E3=80=81=E9=80=9A=E7=9F=A5=E5=BC=B9=E7=AA=97=E4=BC=98?=
 =?UTF-8?q?=E5=8C=96=E7=AD=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../example/web/task/CustomerStatusTask.java  |    2 +-
 src/main/resources/application.yaml           |    2 +-
 src/main/resources/static/loginmm.html        |    2 +-
 src/main/resources/static/sells.html          | 1161 +++++++++++++----
 src/main/resources/static/supply.html         |  929 +++++++++++--
 5 files changed, 1745 insertions(+), 351 deletions(-)

diff --git a/src/main/java/com/example/web/task/CustomerStatusTask.java b/src/main/java/com/example/web/task/CustomerStatusTask.java
index 0683721..ca335bb 100644
--- a/src/main/java/com/example/web/task/CustomerStatusTask.java
+++ b/src/main/java/com/example/web/task/CustomerStatusTask.java
@@ -27,7 +27,7 @@ public class CustomerStatusTask {
     /**
      * 每分钟执行一次客户状态流转处理
      */
-    @Scheduled(cron = "0 * */5 * * ?")
+    @Scheduled(cron = "0 * * */5 * ?")
     public void processCustomerStatus() {
         System.out.println("DEBUG: 开始执行客户状态流转定时任务，当前时间: " + LocalDateTime.now());
         
diff --git a/src/main/resources/application.yaml b/src/main/resources/application.yaml
index 00eda00..4f96ade 100644
--- a/src/main/resources/application.yaml
+++ b/src/main/resources/application.yaml
@@ -63,7 +63,7 @@ management:
       enabled: true
 
 server:
-  port: 8081
+  port: 8080
   servlet:
     context-path: /DL
     encoding:
diff --git a/src/main/resources/static/loginmm.html b/src/main/resources/static/loginmm.html
index f496a49..136fccf 100644
--- a/src/main/resources/static/loginmm.html
+++ b/src/main/resources/static/loginmm.html
@@ -520,7 +520,7 @@
     errorElement.classList.remove('show');
   }
 
-  const API_BASE_URL = 'http://localhost:8081/DL'; // 服务器API地址
+  const API_BASE_URL = 'http://8.137.125.67:8080/DL'; // 服务器API地址
   async function sendLoginRequest(projectName, userName, password) {
     try {
       // 使用URL编码的表单数据
diff --git a/src/main/resources/static/sells.html b/src/main/resources/static/sells.html
index 4532eef..67c3898 100644
--- a/src/main/resources/static/sells.html
+++ b/src/main/resources/static/sells.html
@@ -11,6 +11,60 @@
   <!-- STOMP客户端库 -->
   <script src="https://cdn.jsdelivr.net/npm/stompjs@2.3.3/lib/stomp.min.js"></script>
   <style>
+    /* 页面加载动画样式 */
+    .loader-container {
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: linear-gradient(135deg, #ebc4d2 0%, #c094ed 100%);
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+      z-index: 9999;
+      transition: opacity 0.5s ease, visibility 0.5s ease;
+    }
+
+    /* 旋转加载指示器 */
+    .loader {
+      width: 60px;
+      height: 60px;
+      border: 5px solid rgba(255, 255, 255, 0.3);
+      border-top: 5px solid #e86a92;
+      border-radius: 50%;
+      animation: spin 1s linear infinite;
+      margin-bottom: 20px;
+    }
+
+    /* 旋转动画 */
+    @keyframes spin {
+      0% { transform: rotate(0deg); }
+      100% { transform: rotate(360deg); }
+    }
+
+    /* 加载文本 */
+    .loader-text {
+      color: white;
+      font-size: 18px;
+      font-weight: 600;
+      letter-spacing: 1px;
+      animation: pulse 1.5s ease-in-out infinite;
+    }
+
+    /* 文本脉冲动画 */
+    @keyframes pulse {
+      0%, 100% { opacity: 1; }
+      50% { opacity: 0.6; }
+    }
+
+    /* 加载完成后隐藏 */
+    .loader-container.hidden {
+      opacity: 0;
+      visibility: hidden;
+    }
+
     /* 基础容器样式 */
     .needs-select-container {
       position: relative;
@@ -761,125 +815,311 @@
         color: #e86a92;
     }
 
+    /* 个人中心下拉菜单样式 */
+    .profile-dropdown {
+        position: absolute;
+        top: 100%;
+        right: 0;
+        margin-top: 10px;
+        padding: 20px;
+        background: white;
+        border-radius: 16px;
+        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
+        z-index: 10000;
+        min-width: 300px;
+        opacity: 0;
+        visibility: hidden;
+        transform: translateY(-10px);
+        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+        border: 1px solid rgba(255, 255, 255, 0.18);
+    }
+
+    .profile-dropdown.active {
+        opacity: 1;
+        visibility: visible;
+        transform: translateY(0);
+    }
+
+    /* 下拉菜单标题 */
+    .dropdown-title {
+        font-size: 14px;
+        font-weight: 600;
+        color: #999;
+        margin-bottom: 15px;
+        text-transform: uppercase;
+        letter-spacing: 0.5px;
+    }
+
+    /* 下拉菜单分组 */
+    .dropdown-section {
+        margin-bottom: 15px;
+    }
+
+    .dropdown-section:last-child {
+        margin-bottom: 0;
+    }
+
+    /* 下拉菜单项 */
+    .dropdown-item {
+        display: flex;
+        align-items: center;
+        padding: 10px 0;
+        font-size: 14px;
+        color: #333;
+    }
+
+    /* 下拉菜单项图标 */
+    .dropdown-item i {
+        width: 20px;
+        color: #e86a92;
+        margin-right: 12px;
+        text-align: center;
+    }
+
+    /* 下拉菜单项标签 */
+    .dropdown-label {
+        font-weight: 600;
+        color: #666;
+        margin-right: 8px;
+        min-width: 60px;
+    }
+
+    /* 分隔线样式 */
+    .dropdown-divider {
+        height: 1px;
+        background: #f0f0f0;
+        margin: 15px 0;
+    }
+
+    /* 退出登录按钮样式 */
+    .logout-btn {
+        width: 100%;
+        padding: 12px;
+        background: linear-gradient(45deg, #e86a92, #8e44ad);
+        color: white;
+        border: none;
+        border-radius: 12px;
+        font-size: 14px;
+        font-weight: 600;
+        cursor: pointer;
+        transition: all 0.3s ease;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        gap: 8px;
+    }
+
+    .logout-btn:hover {
+        transform: translateY(-2px);
+        box-shadow: 0 6px 20px rgba(232, 106, 146, 0.3);
+    }
+
     /* 通知弹窗样式 */
-    .notification-modal {
+    /* 通知弹窗背景遮罩 */
+    .notification-modal-overlay {
       display: none;
       position: fixed;
-      top: 80px;
-      right: 20px;
-      width: 350px;
-      background: white;
-      border-radius: 12px;
-      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
-      z-index: 10000;
-      max-height: 500px;
-      overflow-y: auto;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: rgba(0, 0, 0, 0.5);
+      z-index: 9999;
+      backdrop-filter: blur(2px);
     }
 
-    .notification-modal.active {
+    .notification-modal-overlay.active {
       display: block;
       animation: fadeIn 0.3s ease;
     }
 
-    .notification-header {
-      padding: 15px 20px;
-      border-bottom: 1px solid #eee;
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      background: linear-gradient(45deg, #e86a92, #8e44ad);
-      color: white;
-      border-radius: 12px 12px 0 0;
-    }
-
-    .notification-header h3 {
-      margin: 0;
-      font-size: 16px;
+    /* 通知弹窗容器 */
+    .notification-modal {
+      display: none;
+      position: fixed;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      width: 600px;
+      background: white;
+      border-radius: 20px;
+      box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
+      z-index: 10000;
+      max-height: 70vh;
+      overflow-y: auto;
+      box-sizing: border-box;
     }
 
-    .close-notification {
-      background: none;
-      border: none;
-      color: white;
-      font-size: 20px;
-      cursor: pointer;
-      padding: 0;
-      width: 24px;
-      height: 24px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
+    .notification-modal.active {
+      display: block;
+      animation: slideUp 0.4s cubic-bezier(0.4, 0, 0.2, 1);
     }
 
-    .notification-list {
-      padding: 10px 0;
+    /* 滑入动画 */
+    @keyframes slideUp {
+      from {
+        opacity: 0;
+        transform: translate(-50%, -60%) scale(0.95);
+      }
+      to {
+        opacity: 1;
+        transform: translate(-50%, -50%) scale(1);
+      }
     }
 
+    /* 通知项样式 */
     .notification-item {
-      padding: 15px 20px;
-      border-bottom: 1px solid #f0f0f0;
-      transition: background-color 0.2s ease;
+      padding: 20px;
+      border-bottom: 1px solid #f5f5f5;
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+      cursor: pointer;
+      position: relative;
+      background: white;
     }
 
+    /* 通知项悬停效果 */
     .notification-item:hover {
-      background-color: #f9f9f9;
+      background-color: rgba(232, 106, 146, 0.08);
+      transform: translateX(8px);
+      box-shadow: 0 4px 12px rgba(232, 106, 146, 0.1);
+      border-radius: 12px;
+      margin: 0 10px;
     }
 
     .notification-item:last-child {
       border-bottom: none;
     }
 
+    /* 新客户通知特殊样式 */
     .notification-item.new-customer {
       background-color: rgba(232, 106, 146, 0.05);
+      border-left: 4px solid #e86a92;
     }
 
+    /* 通知内容样式 */
     .notification-content {
-      margin-bottom: 10px;
+      font-size: 16px;
+      margin-bottom: 8px;
+      line-height: 1.5;
+    }
+
+    /* 客户名称样式 */
+    .customer-name {
+      font-weight: 700;
+      color: #e86a92;
+      margin-right: 10px;
+    }
+
+    /* 客户电话样式 */
+    .customer-phone {
+      color: #666;
+      font-weight: 500;
+      font-family: monospace;
     }
 
+    /* 通知时间样式 */
     .notification-time {
-      font-size: 12px;
+      font-size: 13px;
       color: #999;
-      margin-bottom: 10px;
+      margin-bottom: 15px;
+      display: block;
     }
 
+    /* 通知操作按钮容器 */
     .notification-actions {
       display: flex;
-      gap: 10px;
+      gap: 12px;
     }
 
+    /* 按钮样式统一优化 */
     .view-details-btn, .dismiss-btn {
-      padding: 6px 12px;
-      border-radius: 6px;
+      padding: 10px 20px;
+      border-radius: 12px;
       border: none;
-      font-size: 12px;
+      font-size: 14px;
+      font-weight: 600;
       cursor: pointer;
-      transition: all 0.2s ease;
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
     }
 
+    /* 查看详情按钮 */
     .view-details-btn {
       background: linear-gradient(45deg, #e86a92, #8e44ad);
       color: white;
+      flex: 1;
     }
 
     .view-details-btn:hover {
-      transform: scale(1.05);
+      transform: translateY(-2px);
+      box-shadow: 0 6px 20px rgba(232, 106, 146, 0.3);
     }
 
+    /* 忽略按钮 */
     .dismiss-btn {
-      background: #f0f0f0;
+      background: #f8f9fa;
       color: #666;
+      border: 1px solid #e9ecef;
     }
 
     .dismiss-btn:hover {
-      background: #e0e0e0;
+      background: #e9ecef;
+      transform: translateY(-2px);
+      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
     }
 
+    /* 暂无通知样式优化 */
     .no-notifications {
-      padding: 30px 20px;
+      padding: 60px 20px;
       text-align: center;
       color: #999;
-      font-size: 14px;
+      font-size: 16px;
+    }
+
+    /* 通知列表容器 */
+    .notification-list {
+      padding: 20px;
+    }
+
+    /* 通知标题样式优化 */
+    .notification-header {
+      padding: 20px 25px;
+      border-bottom: 1px solid #f5f5f5;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      background: linear-gradient(45deg, #e86a92, #8e44ad);
+      color: white;
+      border-radius: 20px 20px 0 0;
+    }
+
+    /* 通知标题文字 */
+    .notification-header h3 {
+      margin: 0;
+      font-size: 20px;
+      font-weight: 700;
+    }
+
+    /* 关闭按钮样式优化 */
+    .close-notification {
+      background: rgba(255, 255, 255, 0.2);
+      border: none;
+      color: white;
+      font-size: 22px;
+      cursor: pointer;
+      padding: 8px 12px;
+      border-radius: 50%;
+      transition: all 0.3s ease;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 40px;
+      height: 40px;
+    }
+
+    .close-notification:hover {
+      background: rgba(255, 255, 255, 0.3);
+      transform: rotate(90deg);
     }
 
     .sidebar {
@@ -953,45 +1193,171 @@
       margin-bottom: 15px;
     }
 
-    .time-filter {
-      display: flex;
-      gap: 15px;
-      margin-bottom: 20px;
-      align-items: center;
-      padding: 15px;
-      background: rgba(255, 255, 255, 0.1);
-      border-radius: 12px;
-      border: 1px solid rgba(255, 255, 255, 0.18);
-      backdrop-filter: blur(10px);
-      -webkit-backdrop-filter: blur(10px);
+    .time-filter {
+      display: flex;
+      gap: 15px;
+      margin-bottom: 20px;
+      align-items: center;
+      padding: 20px;
+      background: linear-gradient(135deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.08));
+      border-radius: 16px;
+      border: 1px solid rgba(255, 255, 255, 0.2);
+      backdrop-filter: blur(12px);
+      -webkit-backdrop-filter: blur(12px);
+      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    }
+
+    .time-filter:hover {
+      transform: translateY(-2px);
+      box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
+    }
+
+    .time-filter select, .time-filter input {
+      padding: 12px 20px;
+      border: 1px solid rgba(255, 255, 255, 0.25);
+      border-radius: 12px;
+      background: rgba(255, 255, 255, 0.25);
+      color: white;
+      font-size: 14px;
+      font-weight: 500;
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+      cursor: pointer;
+      outline: none;
+      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+      min-width: 150px;
+      /* 自定义下拉箭头 */
+      appearance: none;
+      -webkit-appearance: none;
+      -moz-appearance: none;
+      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='rgba(255, 255, 255, 0.8)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+      background-repeat: no-repeat;
+      background-position: right 15px center;
+      background-size: 16px;
+      padding-right: 40px;
+    }
+
+    .time-filter select:hover, .time-filter input:hover {
+      background: rgba(255, 255, 255, 0.35);
+      transform: translateY(-1px) scale(1.02);
+      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+      border-color: rgba(232, 106, 146, 0.4);
+    }
+
+    .time-filter select:focus, .time-filter input:focus {
+      border-color: rgba(232, 106, 146, 0.6);
+      background: rgba(255, 255, 255, 0.4);
+      box-shadow: 0 0 0 3px rgba(232, 106, 146, 0.2);
+      transform: translateY(-1px);
+    }
+
+    /* 下拉菜单容器样式 */
+    .time-filter select {
+      position: relative;
+    }
+
+    /* 下拉选项样式 */
+    .time-filter select option {
+      background: rgba(255, 255, 255, 0.95);
+      color: #333;
+      padding: 12px 15px;
+      font-size: 14px;
+      border-radius: 8px;
+      margin: 2px 0;
+      transition: all 0.2s ease;
+    }
+
+    /* 选项悬停样式 */
+    .time-filter select option:hover {
+      background: linear-gradient(135deg, #e86a92, #8e44ad);
+      color: white;
+      transform: translateX(5px);
+    }
+
+    /* 选中选项样式 */
+    .time-filter select option:checked {
+      background: linear-gradient(135deg, #e86a92, #8e44ad);
+      color: white;
+      font-weight: 600;
+    }
+
+    /* 自定义日期选择器样式美化 */
+    #custom-date-picker {
+      margin-top: 15px;
+      padding: 20px;
+      background: linear-gradient(135deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.08));
+      border-radius: 16px;
+      border: 1px solid rgba(255, 255, 255, 0.2);
+      backdrop-filter: blur(12px);
+      -webkit-backdrop-filter: blur(12px);
+      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    }
+
+    #custom-date-picker.active {
+      animation: slideDown 0.3s ease-out;
+    }
+
+    @keyframes slideDown {
+      from {
+        opacity: 0;
+        transform: translateY(-10px) scale(0.95);
+      }
+      to {
+        opacity: 1;
+        transform: translateY(0) scale(1);
+      }
     }
 
-    .time-filter select, .time-filter input {
-      padding: 10px 15px;
-      border: 1px solid rgba(255, 255, 255, 0.2);
+    #custom-date-picker input[type="date"] {
+      padding: 12px 15px;
+      border: 1px solid rgba(255, 255, 255, 0.25);
       border-radius: 10px;
-      background: rgba(255, 255, 255, 0.2);
+      background: rgba(255, 255, 255, 0.25);
       color: white;
       font-size: 14px;
       transition: all 0.3s ease;
       cursor: pointer;
     }
 
-    .time-filter select:hover, .time-filter input:hover {
-      background: rgba(255, 255, 255, 0.3);
-      transform: scale(1.02);
+    #custom-date-picker input[type="date"]:hover {
+      background: rgba(255, 255, 255, 0.35);
+      border-color: rgba(232, 106, 146, 0.4);
     }
 
-    .time-filter select:focus, .time-filter input:focus {
+    #custom-date-picker input[type="date"]:focus {
       outline: none;
-      border-color: rgba(232, 106, 146, 0.5);
-      box-shadow: 0 0 0 2px rgba(232, 106, 146, 0.1);
+      border-color: rgba(232, 106, 146, 0.6);
+      box-shadow: 0 0 0 3px rgba(232, 106, 146, 0.2);
     }
 
-    .time-filter select option {
-      background: #2c3e50;
+    #custom-date-picker span {
+      color: white;
+      font-weight: 500;
+      margin: 0 10px;
+    }
+
+    #apply-date-filter {
+      padding: 12px 25px;
+      border: none;
+      border-radius: 12px;
+      background: linear-gradient(45deg, #e86a92, #8e44ad);
       color: white;
-      padding: 10px;
+      font-size: 14px;
+      font-weight: 600;
+      cursor: pointer;
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+      box-shadow: 0 4px 12px rgba(232, 106, 146, 0.3);
+    }
+
+    #apply-date-filter:hover {
+      transform: translateY(-2px);
+      box-shadow: 0 6px 20px rgba(232, 106, 146, 0.4);
+    }
+
+    #apply-date-filter:active {
+      transform: translateY(0);
+      box-shadow: 0 2px 8px rgba(232, 106, 146, 0.3);
     }
 
     #custom-date-picker {
@@ -2131,10 +2497,61 @@
       background-color: #f5f5f5;
       cursor: not-allowed;
     }
+
+    /* 收藏夹卡片样式 */
+    .favorites-cards-container {
+      display: grid;
+      grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
+      gap: 15px;
+      margin-bottom: 15px;
+    }
+
+    .favorite-card {
+      background: rgba(255, 255, 255, 0.3);
+      border-radius: 12px;
+      padding: 15px;
+      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
+      border: 1px solid rgba(255, 255, 255, 0.18);
+      transition: all 0.3s ease;
+    }
+
+    .favorite-card:hover {
+      transform: translateY(-5px);
+      box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
+    }
+
+    .favorite-card h4 {
+      margin: 0 0 10px 0;
+      color: #e86a92;
+      font-size: 16px;
+      font-weight: 600;
+    }
+
+    .favorite-card .card-detail {
+      display: flex;
+      justify-content: space-between;
+      margin-bottom: 8px;
+      font-size: 14px;
+    }
+
+    .favorite-card .card-label {
+      font-weight: 500;
+      color: #666;
+    }
+
+    .favorite-card .card-value {
+      color: #333;
+    }
   </style>
 </head>
 
 <body>
+  <!-- 页面加载动画 -->
+  <div id="loader" class="loader-container">
+    <div class="loader"></div>
+    <div class="loader-text">加载中...</div>
+  </div>
+
   <canvas id="particleCanvas"></canvas>
 
   <div class="container">
@@ -2157,7 +2574,7 @@
       </div>
       <!-- 个人中心展示 -->
       <div class="user-profile" id="userProfile">
-        <div class="profile-header">
+        <div class="profile-header" onclick="toggleUserMenu()">
           <div class="profile-info">
             <div class="profile-name" id="profileName">加载中...</div>
             <div class="profile-role" id="profileRole">加载中...</div>
@@ -2165,6 +2582,35 @@
           <div class="profile-avatar">
             <i class="fas fa-user-circle"></i>
           </div>
+          <i class="fas fa-chevron-down profile-arrow"></i>
+        </div>
+        <!-- 个人中心下拉菜单 -->
+        <div class="profile-dropdown" id="profileDropdown">
+          <div class="dropdown-section user-info-section">
+            <div class="dropdown-title">账户信息</div>
+            <div class="dropdown-item">
+              <i class="fas fa-user"></i>
+              <span class="dropdown-label">用户名：</span>
+              <span id="dropdownUsername">加载中...</span>
+            </div>
+            <div class="dropdown-item">
+              <i class="fas fa-briefcase"></i>
+              <span class="dropdown-label">角色：</span>
+              <span id="dropdownRole">加载中...</span>
+            </div>
+            <div class="dropdown-item">
+              <i class="fas fa-building"></i>
+              <span class="dropdown-label">部门：</span>
+              <span id="dropdownDepartment">加载中...</span>
+            </div>
+          </div>
+          <div class="dropdown-divider"></div>
+          <div class="dropdown-section action-section">
+            <button class="dropdown-btn logout-btn" onclick="logout()">
+              <i class="fas fa-sign-out-alt"></i>
+              退出登录
+            </button>
+          </div>
         </div>
       </div>
     </div>
@@ -2283,6 +2729,7 @@
               <option value="custom">自定义筛选</option>
             </select>
             <select id="time-filter-content">
+              <option value="today" selected>今日</option>
               <option value="yesterday">昨天</option>
               <option value="day_before_yesterday">前天</option>
               <option value="three_days_ago">大前天</option>
@@ -2529,29 +2976,8 @@
 
       <!-- 弹窗内容 -->
       <div class="modal-body">
-        <div class="customer-details">
-          <!-- 公海需求部分，只对公海池客户显示 -->
-          <div class="detail-section public-sea-demand-section" id="publicSeaDemandSection" style="display: none;">
-            <h3 class="detail-section-title">公海需求</h3>
-            <div class="detail-item">
-              <span class="detail-label">品种：</span>
-              <span class="detail-value" id="detail-variety">-</span>
-            </div>
-            <div class="detail-item">
-              <span class="detail-label">规格：</span>
-              <span class="detail-value" id="detail-specification">-</span>
-            </div>
-            <div class="detail-item">
-              <span class="detail-label">件数：</span>
-              <span class="detail-value" id="detail-quantity">-</span>
-            </div>
-            <div class="detail-item">
-              <span class="detail-label">毛重：</span>
-              <span class="detail-value" id="detail-weight">-</span>
-            </div>
-          </div>
-
-          <!-- 基本联系人信息单独一行 -->
+        <!-- 基本联系人  公司信息 -->
+        <div class="info-section-container">
           <div>
             <div class="detail-section">
               <h3 class="detail-section-title">
@@ -2598,7 +3024,6 @@
             </div>
           </div>
 
-          <!-- 公司信息单独一行 -->
           <div>
             <div class="detail-section">
               <h3 class="detail-section-title">公司信息</h3>
@@ -2634,7 +3059,7 @@
           </div>
         </div>
 
-        <!-- 使用新的容器将负责人信息和附加联系人信息放在同一行，实现视觉平衡 -->
+        <!-- 负责人信息    收藏夹 -->
         <div class="info-section-container">
           <div>
             <div class="detail-section">
@@ -2667,17 +3092,62 @@
           </div>
 
           <div>
-            <!-- 自定义详情区域 - 调整为与基本信息一致的排版 -->
-            <div class="detail-section custom-details-section" id="customDetailsSection">
-              <h3 class="detail-section-title">附加联系人信息</h3>
-              <div id="customDetailsContainer">
-                <!-- 动态添加的详情将显示在这里 -->
-                <div class="detail-item"><span class="detail-value">暂无附加联系人信息</span></div>
+            <div class="detail-section">
+              <h3 class="detail-section-title">收藏夹</h3>
+              <div id="favorites-container">
+                <!-- 默认显示第一个收藏项 -->
+                <div id="favorite-first-item" style="display: none;">
+                  <div class="detail-item">
+                    <span class="detail-label">收藏产品：</span>
+                    <span class="detail-value" id="favorite-product-name">-</span>
+                  </div>
+                  <div class="detail-item">
+                    <span class="detail-label">价格：</span>
+                    <span class="detail-value" id="favorite-price">-</span>
+                  </div>
+                  <div class="detail-item">
+                    <span class="detail-label">数量：</span>
+                    <span class="detail-value" id="favorite-quantity">-</span>
+                  </div>
+                  <div class="detail-item">
+                    <span class="detail-label">毛重：</span>
+                    <span class="detail-value" id="favorite-gross-weight">-</span>
+                  </div>
+                  <div class="detail-item">
+                    <span class="detail-label">蛋黄：</span>
+                    <span class="detail-value" id="favorite-yolk">-</span>
+                  </div>
+                  <button class="action-btn" id="view-all-favorites" style="margin-top: 10px;">
+                    查看完整收藏
+                  </button>
+                </div>
+                
+                <!-- 完整收藏列表（卡片形式） -->
+                <div id="all-favorites" style="display: none;">
+                  <div id="favorites-cards-container"></div>
+                  <button class="action-btn" id="hide-all-favorites" style="margin-top: 10px;">
+                    收起
+                  </button>
+                </div>
+                
+                <!-- 无收藏提示 -->
+                <div id="no-favorites" class="detail-item">
+                  <span class="detail-value">暂无收藏</span>
+                </div>
               </div>
             </div>
           </div>
         </div>
 
+        <!-- 附加联系人信息 -->
+        <div class="detail-section custom-details-section" id="customDetailsSection">
+          <h3 class="detail-section-title">附加联系人信息</h3>
+          <div id="customDetailsContainer">
+            <!-- 动态添加的详情将显示在这里 -->
+            <div class="detail-item"><span class="detail-value">暂无附加联系人信息</span></div>
+          </div>
+        </div>
+
 
       </div>
     </div>
@@ -3621,7 +4091,7 @@
     let showAll = false;
     // 时间筛选相关变量
     let currentTimeFilterType = 'dynamic';
-    let currentTimeFilterContent = 'yesterday';
+    let currentTimeFilterContent = 'today';
     let customStartDate = '';
     let customEndDate = '';
 
@@ -3833,6 +4303,11 @@
 
       if (currentTimeFilterType === 'dynamic') {
         switch (currentTimeFilterContent) {
+          case 'today':
+            startDate = new Date(now);
+            startDate.setHours(0, 0, 0, 0);
+            endDate = now;
+            break;
           case 'yesterday':
             startDate = new Date(now);
             startDate.setDate(startDate.getDate() - 1);
@@ -4252,7 +4727,7 @@
       return currentPageRecords;
     }
 
-    const API_BASE_URL = 'http://localhost:8081/DL'; // 后端API基础地址
+    const API_BASE_URL = 'http://8.137.125.67:8080/DL'; // 后端API基础地址
 
     // 获取登录用户信息函数
     function getLoginUserInfo() {
@@ -4703,15 +5178,12 @@
       
       // 生成通知列表HTML
       const notificationsHTML = notifications.map(notification => `
-        <div class="notification-item new-customer" data-notification-id="${notification.id}">
+        <div class="notification-item new-customer" data-notification-id="${notification.id}" onclick="viewNotificationCustomerDetails('${notification.id}')">
           <div class="notification-content">
-            <strong>${notification.customer.company}</strong> 有新客户：${notification.customer.contact}
-          </div>
-          <div class="notification-time">${notification.time}</div>
-          <div class="notification-actions">
-            <button class="view-details-btn" onclick="viewNotificationCustomerDetails('${notification.id}')">查看详情</button>
-            <button class="dismiss-btn" onclick="dismissNotification('${notification.id}')">忽略</button>
+            <span class="customer-name">${notification.customer.nickName || notification.customer.contact}</span>
+            <span class="customer-phone">${notification.customer.phoneNumber || notification.customer.phone}</span>
           </div>
+          <span class="notification-time">${notification.time}</span>
         </div>
       `).join('');
       
@@ -4721,7 +5193,10 @@
     // 切换通知模态框显示
     function toggleNotificationModal() {
       const notificationModal = document.getElementById('notificationModal');
+      const notificationOverlay = document.getElementById('notificationModalOverlay');
+      
       notificationModal.classList.toggle('active');
+      notificationOverlay.classList.toggle('active');
       
       // 如果打开模态框，标记所有通知为已读
       if (notificationModal.classList.contains('active')) {
@@ -4735,7 +5210,11 @@
 
     // 关闭通知模态框
     function closeNotificationModal() {
-      document.getElementById('notificationModal').classList.remove('active');
+      const notificationModal = document.getElementById('notificationModal');
+      const notificationOverlay = document.getElementById('notificationModalOverlay');
+      
+      notificationModal.classList.remove('active');
+      notificationOverlay.classList.remove('active');
     }
 
     // 从通知弹窗查看客户详情
@@ -4957,6 +5436,26 @@
 
       targetTbody.appendChild(row);
 
+      // 对当前等级的所有行按时间排序（优先使用修改时间，不存在则使用创建时间）
+      const rows = Array.from(targetTbody.querySelectorAll('tr'));
+      rows.sort((a, b) => {
+        // 获取修改时间，不存在则使用创建时间
+        const timeA = a.dataset.updatedAt || a.dataset.createdAt;
+        const timeB = b.dataset.updatedAt || b.dataset.createdAt;
+        
+        // 如果都没有时间，保持原有顺序
+        if (!timeA && !timeB) return 0;
+        // 没有时间的行排在后面
+        if (!timeA) return 1;
+        if (!timeB) return -1;
+        
+        // 按时间倒序排列（最新的在前面）
+        return new Date(timeB) - new Date(timeA);
+      });
+      
+      // 重新添加排序后的行
+      rows.forEach(row => targetTbody.appendChild(row));
+
       // 如果当前选中的等级是新增客户的等级，刷新分页
       if (currentLevel === level) {
         updatePagination();
@@ -5065,18 +5564,47 @@
         console.log('认领客户结果:', data);
         if (data.success) {
           alert('客户认领成功！');
+          
+          // 更新前端数据：从相应的公海池数据源中移除被认领的客户
+          if (customer.level === 'department-sea-pools') {
+            // 从部门公海池数据源中移除
+            departmentSeaPoolData = departmentSeaPoolData.filter(item => item.id !== customerId);
+          } else if (customer.level === 'organization-sea-pools') {
+            // 从组织公海池数据源中移除
+            organizationSeaPoolData = organizationSeaPoolData.filter(item => item.id !== customerId);
+          }
+          
+          // 更新customerData中的客户等级
+          customer.level = 'unclassified'; // 认领后变为未分级客户
+          
           // 刷新公海池列表
-          // 检查哪个公海池表格当前可见
+          // 根据当前选中的等级或表格显示状态来判断应该刷新哪个公海池
           const departmentTable = document.getElementById('department-sea-pools-customers');
           const organizationTable = document.getElementById('organization-sea-pools-customers');
           
-          if (departmentTable && departmentTable.style.display === 'table-row-group') {
+          // 优先使用currentLevel变量判断当前显示的等级
+          if (currentLevel === 'department-sea-pools') {
+            // 如果当前选中的是部门公海池，直接更新部门公海池表格
+            updateDepartmentSeaPoolTable();
+          } else if (currentLevel === 'organization-sea-pools') {
+            // 如果当前选中的是组织公海池，直接更新组织公海池表格
+            updateOrganizationSeaPoolTable();
+          } else if (departmentTable && departmentTable.style.display === 'table-row-group') {
             // 如果部门公海池表格可见，直接更新表格
             updateDepartmentSeaPoolTable();
           } else if (organizationTable && organizationTable.style.display === 'table-row-group') {
             // 如果组织公海池表格可见，直接更新表格
             updateOrganizationSeaPoolTable();
+          } else {
+            // 如果当前不在公海池视图，但可能在全部视图，两个表格都更新
+            updateDepartmentSeaPoolTable();
+            updateOrganizationSeaPoolTable();
           }
+          
+          // 同时更新全局客户列表和相关表格
+          updateRecentCustomers();
+          updateStatsCards();
+          updateCustomerTable(customer);
         } else {
           alert('客户认领失败: ' + (data.message || '未知错误'));
         }
@@ -5179,38 +5707,114 @@
       // 显示自定义详情
       renderCustomDetails();
 
-      // 处理公海需求部分显示
-      const publicSeaDemandSection = document.getElementById('publicSeaDemandSection');
-      console.log('公海需求区域元素:', publicSeaDemandSection);
+      // 处理公海池客户的特殊按钮设置
+      editSaveBtn = document.getElementById('editSaveBtn');
       if (customer.level === 'department-sea-pools' || customer.level === 'organization-sea-pools') {
-        console.log('显示公海需求区域');
-        publicSeaDemandSection.style.display = 'block';
-        // 填充公海需求数据，如果没有则显示默认值
-        document.getElementById('detail-variety').textContent = customer.variety || '-';
-        document.getElementById('detail-specification').textContent = customer.specification || '-';
-        document.getElementById('detail-quantity').textContent = customer.quantity || '-';
-        document.getElementById('detail-weight').textContent = customer.weight || '-';
-        
         // 公海池客户将编辑按钮改为认领按钮
-        const editSaveBtn = document.getElementById('editSaveBtn');
-        editSaveBtn.textContent = '认领';
-        editSaveBtn.onclick = function() {
-          claimCustomer(customer.id);
+        if (editSaveBtn) {
+          editSaveBtn.textContent = '认领';
+          // 移除之前的所有事件监听器，只保留当前需要的
+          editSaveBtn.onclick = function() {
+            claimCustomer(customer.id);
+          };
         };
       } else {
-        console.log('隐藏公海需求区域');
-        publicSeaDemandSection.style.display = 'none';
-        
         // 普通客户恢复编辑按钮功能
-        const editSaveBtn = document.getElementById('editSaveBtn');
-        editSaveBtn.textContent = '编辑';
-        editSaveBtn.onclick = toggleEditMode;
+        if (editSaveBtn) {
+          editSaveBtn.textContent = '编辑';
+          // 统一使用onclick属性绑定事件，避免事件累积
+          editSaveBtn.onclick = toggleEditMode;
+        };
+      }
+
+      // 处理收藏夹显示
+      const favorites = customer.favorites || [];
+      const favoritesContainer = document.getElementById('favorites-container');
+      const favoriteFirstItem = document.getElementById('favorite-first-item');
+      const allFavorites = document.getElementById('all-favorites');
+      const noFavorites = document.getElementById('no-favorites');
+      const favoritesCardsContainer = document.getElementById('favorites-cards-container');
+
+      if (favorites && favorites.length > 0) {
+        // 有收藏数据
+        noFavorites.style.display = 'none';
+        favoriteFirstItem.style.display = 'block';
+        allFavorites.style.display = 'none';
+
+        // 显示第一个收藏项
+        const firstFavorite = favorites[0];
+        document.getElementById('favorite-product-name').textContent = firstFavorite.productName || '-';
+        document.getElementById('favorite-price').textContent = firstFavorite.price || '-';
+        document.getElementById('favorite-quantity').textContent = firstFavorite.quantity || '-';
+        document.getElementById('favorite-gross-weight').textContent = firstFavorite.grossWeight || '-';
+        document.getElementById('favorite-yolk').textContent = firstFavorite.yolk || '-';
+
+        // 绑定查看完整收藏事件
+        document.getElementById('view-all-favorites').onclick = function() {
+          favoriteFirstItem.style.display = 'none';
+          allFavorites.style.display = 'block';
+          
+          // 生成收藏卡片
+          favoritesCardsContainer.innerHTML = '';
+          favorites.forEach((favorite, index) => {
+            const card = document.createElement('div');
+            card.className = 'favorite-card';
+            card.innerHTML = `
+              <h4>${favorite.productName || '未命名产品'}</h4>
+              <div class="card-detail">
+                <span class="card-label">价格：</span>
+                <span class="card-value">${favorite.price || '-'}</span>
+              </div>
+              <div class="card-detail">
+                <span class="card-label">数量：</span>
+                <span class="card-value">${favorite.quantity || '-'}</span>
+              </div>
+              <div class="card-detail">
+                <span class="card-label">毛重：</span>
+                <span class="card-value">${favorite.grossWeight || '-'}</span>
+              </div>
+              <div class="card-detail">
+                <span class="card-label">蛋黄：</span>
+                <span class="card-value">${favorite.yolk || '-'}</span>
+              </div>
+              ${favorite.assistant ? `<div class="card-detail">
+                <span class="card-label">助手：</span>
+                <span class="card-value">${favorite.assistant}</span>
+              </div>` : ''}
+              ${favorite.company ? `<div class="card-detail">
+                <span class="card-label">公司：</span>
+                <span class="card-value">${favorite.company}</span>
+              </div>` : ''}
+            `;
+            favoritesCardsContainer.appendChild(card);
+          });
+        };
+
+        // 绑定收起事件
+        document.getElementById('hide-all-favorites').onclick = function() {
+          allFavorites.style.display = 'none';
+          favoriteFirstItem.style.display = 'block';
+        };
+      } else {
+        // 无收藏数据
+        favoriteFirstItem.style.display = 'none';
+        allFavorites.style.display = 'none';
+        noFavorites.style.display = 'block';
       }
 
       document.getElementById('customerModal').classList.add('active');
       document.body.style.overflow = 'hidden';
     }
     
+    /**
+     * 客户详情编辑功能模块
+     * 实现客户详情的编辑、保存和取消功能
+     */
+    // 客户详情编辑功能相关变量
+    let isEditing = false; // 是否处于编辑状态
+    let originalCustomerData = null; // 原始客户数据，用于编辑时恢复或比较
+    let editSaveBtn = null;
+    
     // 切换编辑状态
     function toggleEditMode() {
       if (isEditing) {
@@ -5224,6 +5828,11 @@
       }
     }
     
+    // 页面加载完成后初始化编辑按钮事件 - 只初始化一次
+    document.addEventListener('DOMContentLoaded', function() {
+      // 只在页面加载时初始化editSaveBtn，后续在viewCustomerDetails中会重新获取和绑定事件
+    });
+    
     // 保存客户详情
     function saveCustomerDetails() {
       // 客户等级映射，与viewCustomerDetails函数中保持一致
@@ -5624,18 +6233,10 @@
       }
     }
 
-    /**
-     * 客户详情编辑功能模块
-     * 实现客户详情的编辑、保存和取消功能
-     */
-    // 客户详情编辑功能相关变量
-    let isEditing = false; // 是否处于编辑状态
-    let originalCustomerData = null; // 原始客户数据，用于编辑时恢复或比较
-    
+    // 客户详情弹窗相关元素
     const viewButtons = document.querySelectorAll('.view-details');
     const modal = document.getElementById('customerModal');
     const closeModal = document.getElementById('closeModal');
-    const editSaveBtn = document.getElementById('editSaveBtn');
     const addDetailBtn = document.getElementById('addDetailBtn');
     const addDetailModal = document.getElementById('addDetailModal');
     const cancelAddDetail = document.getElementById('cancelAddDetail');
@@ -5697,91 +6298,117 @@
       }
     });
 
-    // 编辑/确定按钮点击事件
-    editSaveBtn.addEventListener('click', function () {
-      toggleEditMode();
-    });
+
     
-    closeModal.addEventListener('click', function () {
-      modal.classList.remove('active');
-      document.body.style.overflow = 'auto';
-      // 关闭弹窗时重置编辑状态
-      if (isEditing) {
-        isEditing = false;
-        editSaveBtn.textContent = '编辑';
-        disableEditing();
-      }
-    });
+    // 关闭弹窗按钮事件 - 添加空值检查
+    if (closeModal) {
+      closeModal.addEventListener('click', function () {
+        if (modal) {
+          modal.classList.remove('active');
+          document.body.style.overflow = 'auto';
+          // 关闭弹窗时重置编辑状态
+          if (isEditing && editSaveBtn) {
+            isEditing = false;
+            editSaveBtn.textContent = '编辑';
+            disableEditing();
+          }
+        }
+      });
+    }
 
-    modal.addEventListener('click', function (e) {
-      if (e.target === modal) {
-        modal.classList.remove('active');
-        document.body.style.overflow = 'auto';
-        // 关闭弹窗时重置编辑状态
-        if (isEditing) {
-          isEditing = false;
-          editSaveBtn.textContent = '编辑';
-          disableEditing();
+    // 点击弹窗外部关闭事件 - 添加空值检查
+    if (modal) {
+      modal.addEventListener('click', function (e) {
+        if (e.target === modal) {
+          modal.classList.remove('active');
+          document.body.style.overflow = 'auto';
+          // 关闭弹窗时重置编辑状态
+          if (isEditing && editSaveBtn) {
+            isEditing = false;
+            editSaveBtn.textContent = '编辑';
+            disableEditing();
+          }
         }
-      }
-    });
+      });
+    }
 
-    // 关闭跟进详情弹窗
-    closeFollowUpDetail.addEventListener('click', function () {
-      followUpDetailModal.classList.remove('active');
-      document.body.style.overflow = 'auto';
-    });
+    // 关闭跟进详情弹窗 - 添加空值检查
+    if (closeFollowUpDetail) {
+      closeFollowUpDetail.addEventListener('click', function () {
+        if (followUpDetailModal) {
+          followUpDetailModal.classList.remove('active');
+          document.body.style.overflow = 'auto';
+        }
+      });
+    }
 
-    followUpDetailModal.addEventListener('click', function (e) {
-      if (e.target === followUpDetailModal) {
-        followUpDetailModal.classList.remove('active');
-        document.body.style.overflow = 'auto';
-      }
-    });
+    // 点击跟进弹窗外部关闭事件 - 添加空值检查
+    if (followUpDetailModal) {
+      followUpDetailModal.addEventListener('click', function (e) {
+        if (e.target === followUpDetailModal) {
+          followUpDetailModal.classList.remove('active');
+          document.body.style.overflow = 'auto';
+        }
+      });
+    }
 
-    // 新增详情按钮事件
-    addDetailBtn.addEventListener('click', function () {
-      // 清空输入框
-      document.getElementById('newContactName').value = '';
-      document.getElementById('newContactPhone').value = '';
-      document.getElementById('newContactAccount').value = '';
-      document.getElementById('newContactAccountNumber').value = '';
-      document.getElementById('newContactBank').value = '';
-      document.getElementById('newContactAddress').value = '';
-
-      // 显示新增详情弹窗
-      addDetailModal.classList.add('active');
-    });
+    // 新增详情按钮事件 - 添加空值检查
+    if (addDetailBtn) {
+      addDetailBtn.addEventListener('click', function () {
+        // 清空输入框
+        document.getElementById('newContactName').value = '';
+        document.getElementById('newContactPhone').value = '';
+        document.getElementById('newContactAccount').value = '';
+        document.getElementById('newContactAccountNumber').value = '';
+        document.getElementById('newContactBank').value = '';
+        document.getElementById('newContactAddress').value = '';
+
+        // 显示新增详情弹窗
+        if (addDetailModal) {
+          addDetailModal.classList.add('active');
+        }
+      });
+    }
 
-    // 取消添加详情
-    cancelAddDetail.addEventListener('click', function () {
-      addDetailModal.classList.remove('active');
-    });
+    // 取消添加详情 - 添加空值检查
+    if (cancelAddDetail) {
+      cancelAddDetail.addEventListener('click', function () {
+        if (addDetailModal) {
+          addDetailModal.classList.remove('active');
+        }
+      });
+    }
 
-    // 确认添加详情
-    confirmAddDetail.addEventListener('click', function () {
-      const name = document.getElementById('newContactName').value.trim();
-      const phone = document.getElementById('newContactPhone').value.trim();
-      const account = document.getElementById('newContactAccount').value.trim();
-      const accountNumber = document.getElementById('newContactAccountNumber').value.trim();
-      const bank = document.getElementById('newContactBank').value.trim();
-      const address = document.getElementById('newContactAddress').value.trim();
-
-      if (!name) {
-        alert('请输入联系人姓名');
-        return;
-      }
+    // 确认添加详情 - 添加空值检查
+    if (confirmAddDetail) {
+      confirmAddDetail.addEventListener('click', function () {
+        const name = document.getElementById('newContactName').value.trim();
+        const phone = document.getElementById('newContactPhone').value.trim();
+        const account = document.getElementById('newContactAccount').value.trim();
+        const accountNumber = document.getElementById('newContactAccountNumber').value.trim();
+        const bank = document.getElementById('newContactBank').value.trim();
+        const address = document.getElementById('newContactAddress').value.trim();
 
-      addCustomDetail(name, phone, account, accountNumber, bank, address);
-      addDetailModal.classList.remove('active');
-    });
+        if (!name) {
+          alert('请输入联系人姓名');
+          return;
+        }
 
-    // 点击弹窗外部关闭新增详情弹窗
-    addDetailModal.addEventListener('click', function (e) {
-      if (e.target === addDetailModal) {
-        addDetailModal.classList.remove('active');
-      }
-    });
+        addCustomDetail(name, phone, account, accountNumber, bank, address);
+        if (addDetailModal) {
+          addDetailModal.classList.remove('active');
+        }
+      });
+    }
+
+    // 点击弹窗外部关闭新增详情弹窗 - 添加空值检查
+    if (addDetailModal) {
+      addDetailModal.addEventListener('click', function (e) {
+        if (e.target === addDetailModal) {
+          addDetailModal.classList.remove('active');
+        }
+      });
+    }
 
     // 3D粒子特效
     const scene = new THREE.Scene();
@@ -6363,6 +6990,10 @@
         });
       }
 
+      // 将公海池更新函数暴露到全局作用域，以便在外部调用
+      window.updateDepartmentSeaPoolTable = updateDepartmentSeaPoolTable;
+      window.updateOrganizationSeaPoolTable = updateOrganizationSeaPoolTable;
+
       // 页面加载完成后初始化WebSocket
       window.addEventListener('DOMContentLoaded', function () {
         // 初始化WebSocket连接
@@ -6522,6 +7153,58 @@
     // 页面加载完成后初始化通知指示器
     window.addEventListener('load', initNotificationIndicators);
     
+    // 更新个人中心初始化函数，显示完整的登录者信息
+    function initUserProfile() {
+      // 从URL参数获取实际登录信息
+      const loginInfo = getLoginUserInfo();
+      
+      // 更新页面上的个人信息
+      document.getElementById('profileName').textContent = loginInfo.userName || '请登录';
+      document.getElementById('profileRole').textContent = loginInfo.projectName || '未设置角色';
+      
+      // 更新下拉菜单中的个人信息
+      document.getElementById('dropdownUsername').textContent = loginInfo.userName || '未设置用户名';
+      document.getElementById('dropdownRole').textContent = loginInfo.projectName || '未设置角色';
+      document.getElementById('dropdownDepartment').textContent = loginInfo.managerdepartment || '未设置部门';
+    }
+    
+    // 切换用户菜单显示/隐藏
+    function toggleUserMenu() {
+      const profileHeader = document.querySelector('.profile-header');
+      const profileDropdown = document.getElementById('profileDropdown');
+      
+      profileHeader.classList.toggle('active');
+      profileDropdown.classList.toggle('active');
+    }
+    
+    // 退出登录功能
+    function logout() {
+      // 确认退出登录
+      if (confirm('确定要退出登录吗？')) {
+        // 这里可以添加实际的退出登录逻辑，比如清除本地存储、跳转到登录页等
+        alert('已退出登录');
+        // 关闭下拉菜单
+        toggleUserMenu();
+        // 跳转到登录页面
+        window.location.href = 'loginmm.html';
+      }
+    }
+    
+    // 点击页面其他位置关闭用户菜单
+    document.addEventListener('click', function(event) {
+      const userProfile = document.getElementById('userProfile');
+      if (!userProfile.contains(event.target)) {
+        const profileHeader = document.querySelector('.profile-header');
+        const profileDropdown = document.getElementById('profileDropdown');
+        
+        profileHeader.classList.remove('active');
+        profileDropdown.classList.remove('active');
+      }
+    });
+    
+    // 初始化个人中心
+    initUserProfile();
+    
     animate();
   </script>
   
@@ -6548,7 +7231,10 @@
         </div>
     </div>
   </div>
-<!-- 通知弹窗 -->
+<!-- 通知弹窗背景遮罩 -->
+  <div class="notification-modal-overlay" id="notificationModalOverlay"></div>
+
+  <!-- 通知弹窗 -->
   <div class="notification-modal" id="notificationModal">
     <div class="notification-header">
       <h3>新客户通知</h3>
@@ -6560,5 +7246,20 @@
       <div class="no-notifications">暂无新客户通知</div>
     </div>
   </div>
+
+  <!-- 页面加载完成后隐藏加载动画 -->
+  <script>
+    // 监听页面加载完成事件
+    window.addEventListener('load', function() {
+      // 延迟500毫秒隐藏加载动画，让用户看到加载效果
+      setTimeout(function() {
+        const loader = document.getElementById('loader');
+        if (loader) {
+          loader.classList.add('hidden');
+        }
+      }, 500);
+    });
+  </script>
+
   </body>
 </html>
\ No newline at end of file
diff --git a/src/main/resources/static/supply.html b/src/main/resources/static/supply.html
index 3cdca3a..dc95682 100644
--- a/src/main/resources/static/supply.html
+++ b/src/main/resources/static/supply.html
@@ -11,6 +11,60 @@
   <!-- STOMP客户端库 -->
   <script src="https://cdn.jsdelivr.net/npm/stompjs@2.3.3/lib/stomp.min.js"></script>
   <style>
+    /* 页面加载动画样式 */
+    .loader-container {
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: linear-gradient(135deg, #ebc4d2 0%, #c094ed 100%);
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+      z-index: 9999;
+      transition: opacity 0.5s ease, visibility 0.5s ease;
+    }
+
+    /* 旋转加载指示器 */
+    .loader {
+      width: 60px;
+      height: 60px;
+      border: 5px solid rgba(255, 255, 255, 0.3);
+      border-top: 5px solid #e86a92;
+      border-radius: 50%;
+      animation: spin 1s linear infinite;
+      margin-bottom: 20px;
+    }
+
+    /* 旋转动画 */
+    @keyframes spin {
+      0% { transform: rotate(0deg); }
+      100% { transform: rotate(360deg); }
+    }
+
+    /* 加载文本 */
+    .loader-text {
+      color: white;
+      font-size: 18px;
+      font-weight: 600;
+      letter-spacing: 1px;
+      animation: pulse 1.5s ease-in-out infinite;
+    }
+
+    /* 文本脉冲动画 */
+    @keyframes pulse {
+      0%, 100% { opacity: 1; }
+      50% { opacity: 0.6; }
+    }
+
+    /* 加载完成后隐藏 */
+    .loader-container.hidden {
+      opacity: 0;
+      visibility: hidden;
+    }
+
     /* 基础容器样式 */
     .needs-select-container {
       position: relative;
@@ -761,24 +815,172 @@
         color: #e86a92;
     }
 
+    /* 个人中心下拉菜单样式 */
+    .profile-arrow {
+        font-size: 12px;
+        margin-left: 10px;
+        transition: transform 0.3s ease;
+        color: #666;
+    }
+
+    .profile-header.active .profile-arrow {
+        transform: rotate(180deg);
+    }
+
+    /* 下拉菜单容器 */
+    .profile-dropdown {
+        position: absolute;
+        top: 100%;
+        right: 0;
+        margin-top: 10px;
+        padding: 20px;
+        background: white;
+        border-radius: 16px;
+        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
+        z-index: 10000;
+        min-width: 300px;
+        opacity: 0;
+        visibility: hidden;
+        transform: translateY(-10px);
+        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+        border: 1px solid rgba(255, 255, 255, 0.18);
+    }
+
+    .profile-dropdown.active {
+        opacity: 1;
+        visibility: visible;
+        transform: translateY(0);
+    }
+
+    /* 下拉菜单标题 */
+    .dropdown-title {
+        font-size: 14px;
+        font-weight: 600;
+        color: #999;
+        margin-bottom: 15px;
+        text-transform: uppercase;
+        letter-spacing: 0.5px;
+    }
+
+    /* 下拉菜单项 */
+    .dropdown-item {
+        display: flex;
+        align-items: center;
+        padding: 10px 0;
+        font-size: 14px;
+        color: #333;
+    }
+
+    /* 下拉菜单项图标 */
+    .dropdown-item i {
+        width: 20px;
+        color: #e86a92;
+        margin-right: 12px;
+        text-align: center;
+    }
+
+    /* 下拉菜单项标签 */
+    .dropdown-label {
+        font-weight: 600;
+        color: #666;
+        margin-right: 8px;
+        min-width: 60px;
+    }
+
+    /* 分隔线样式 */
+    .dropdown-divider {
+        height: 1px;
+        background: #f0f0f0;
+        margin: 15px 0;
+    }
+
+    /* 按钮容器 */
+    .action-section {
+        margin-top: 10px;
+    }
+
+    /* 下拉菜单按钮 */
+    .dropdown-btn {
+        width: 100%;
+        padding: 12px;
+        border: none;
+        border-radius: 12px;
+        background: linear-gradient(45deg, #e86a92, #8e44ad);
+        color: white;
+        font-size: 14px;
+        font-weight: 600;
+        cursor: pointer;
+        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        gap: 8px;
+        box-shadow: 0 4px 12px rgba(232, 106, 146, 0.3);
+    }
+
+    /* 退出登录按钮悬停效果 */
+    .dropdown-btn:hover {
+        transform: translateY(-2px);
+        box-shadow: 0 6px 20px rgba(232, 106, 146, 0.4);
+    }
+
+    /* 退出登录按钮:active效果 */
+    .dropdown-btn:active {
+        transform: translateY(0);
+        box-shadow: 0 4px 12px rgba(232, 106, 146, 0.3);
+    }
+
     /* 通知弹窗样式 */
+    /* 通知弹窗背景遮罩 */
+    .notification-modal-overlay {
+      display: none;
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: rgba(0, 0, 0, 0.5);
+      z-index: 9999;
+      backdrop-filter: blur(2px);
+    }
+
+    .notification-modal-overlay.active {
+      display: block;
+      animation: fadeIn 0.3s ease;
+    }
+
+    /* 通知弹窗容器 */
     .notification-modal {
       display: none;
       position: fixed;
-      top: 80px;
-      right: 20px;
-      width: 350px;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      width: 600px;
       background: white;
-      border-radius: 12px;
-      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
+      border-radius: 20px;
+      box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
       z-index: 10000;
-      max-height: 500px;
+      max-height: 70vh;
       overflow-y: auto;
+      box-sizing: border-box;
     }
 
     .notification-modal.active {
       display: block;
-      animation: fadeIn 0.3s ease;
+      animation: slideUp 0.4s cubic-bezier(0.4, 0, 0.2, 1);
+    }
+
+    /* 滑入动画 */
+    @keyframes slideUp {
+      from {
+        opacity: 0;
+        transform: translate(-50%, -60%) scale(0.95);
+      }
+      to {
+        opacity: 1;
+        transform: translate(-50%, -50%) scale(1);
+      }
     }
 
     .notification-header {
@@ -815,71 +1017,159 @@
       padding: 10px 0;
     }
 
+    /* 通知项样式 */
     .notification-item {
-      padding: 15px 20px;
-      border-bottom: 1px solid #f0f0f0;
-      transition: background-color 0.2s ease;
+      padding: 20px;
+      border-bottom: 1px solid #f5f5f5;
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+      cursor: pointer;
+      position: relative;
+      background: white;
     }
 
+    /* 通知项悬停效果 */
     .notification-item:hover {
-      background-color: #f9f9f9;
+      background-color: rgba(232, 106, 146, 0.08);
+      transform: translateX(8px);
+      box-shadow: 0 4px 12px rgba(232, 106, 146, 0.1);
+      border-radius: 12px;
+      margin: 0 10px;
     }
 
     .notification-item:last-child {
       border-bottom: none;
     }
 
+    /* 新客户通知特殊样式 */
     .notification-item.new-customer {
       background-color: rgba(232, 106, 146, 0.05);
+      border-left: 4px solid #e86a92;
     }
 
+    /* 通知内容样式 */
     .notification-content {
-      margin-bottom: 10px;
+      font-size: 16px;
+      margin-bottom: 8px;
+      line-height: 1.5;
     }
 
+    /* 客户名称样式 */
+    .customer-name {
+      font-weight: 700;
+      color: #e86a92;
+      margin-right: 10px;
+    }
+
+    /* 客户电话样式 */
+    .customer-phone {
+      color: #666;
+      font-weight: 500;
+      font-family: monospace;
+    }
+
+    /* 通知时间样式 */
     .notification-time {
-      font-size: 12px;
+      font-size: 13px;
       color: #999;
-      margin-bottom: 10px;
+      margin-bottom: 15px;
+      display: block;
     }
 
+    /* 通知操作按钮容器 */
     .notification-actions {
       display: flex;
-      gap: 10px;
+      gap: 12px;
     }
 
+    /* 按钮样式统一优化 */
     .view-details-btn, .dismiss-btn {
-      padding: 6px 12px;
-      border-radius: 6px;
+      padding: 10px 20px;
+      border-radius: 12px;
       border: none;
-      font-size: 12px;
+      font-size: 14px;
+      font-weight: 600;
       cursor: pointer;
-      transition: all 0.2s ease;
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
     }
 
+    /* 查看详情按钮 */
     .view-details-btn {
       background: linear-gradient(45deg, #e86a92, #8e44ad);
       color: white;
+      flex: 1;
     }
 
     .view-details-btn:hover {
-      transform: scale(1.05);
+      transform: translateY(-2px);
+      box-shadow: 0 6px 20px rgba(232, 106, 146, 0.3);
     }
 
+    /* 忽略按钮 */
     .dismiss-btn {
-      background: #f0f0f0;
+      background: #f8f9fa;
       color: #666;
+      border: 1px solid #e9ecef;
     }
 
     .dismiss-btn:hover {
-      background: #e0e0e0;
+      background: #e9ecef;
+      transform: translateY(-2px);
+      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
     }
 
+    /* 暂无通知样式优化 */
     .no-notifications {
-      padding: 30px 20px;
+      padding: 60px 20px;
       text-align: center;
       color: #999;
-      font-size: 14px;
+      font-size: 16px;
+    }
+
+    /* 通知列表容器 */
+    .notification-list {
+      padding: 20px;
+    }
+
+    /* 通知标题样式优化 */
+    .notification-header {
+      padding: 20px 25px;
+      border-bottom: 1px solid #f5f5f5;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      background: linear-gradient(45deg, #e86a92, #8e44ad);
+      color: white;
+      border-radius: 20px 20px 0 0;
+    }
+
+    /* 通知标题文字 */
+    .notification-header h3 {
+      margin: 0;
+      font-size: 20px;
+      font-weight: 700;
+    }
+
+    /* 关闭按钮样式优化 */
+    .close-notification {
+      background: rgba(255, 255, 255, 0.2);
+      border: none;
+      color: white;
+      font-size: 22px;
+      cursor: pointer;
+      padding: 8px 12px;
+      border-radius: 50%;
+      transition: all 0.3s ease;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 40px;
+      height: 40px;
+    }
+
+    .close-notification:hover {
+      background: rgba(255, 255, 255, 0.3);
+      transform: rotate(90deg);
     }
 
     .sidebar {
@@ -958,40 +1248,166 @@
       gap: 15px;
       margin-bottom: 20px;
       align-items: center;
-      padding: 15px;
-      background: rgba(255, 255, 255, 0.1);
-      border-radius: 12px;
-      border: 1px solid rgba(255, 255, 255, 0.18);
-      backdrop-filter: blur(10px);
-      -webkit-backdrop-filter: blur(10px);
+      padding: 20px;
+      background: linear-gradient(135deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.08));
+      border-radius: 16px;
+      border: 1px solid rgba(255, 255, 255, 0.2);
+      backdrop-filter: blur(12px);
+      -webkit-backdrop-filter: blur(12px);
+      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    }
+
+    .time-filter:hover {
+      transform: translateY(-2px);
+      box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
     }
 
     .time-filter select, .time-filter input {
-      padding: 10px 15px;
+      padding: 12px 20px;
+      border: 1px solid rgba(255, 255, 255, 0.25);
+      border-radius: 12px;
+      background: rgba(255, 255, 255, 0.25);
+      color: white;
+      font-size: 14px;
+      font-weight: 500;
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+      cursor: pointer;
+      outline: none;
+      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+      min-width: 150px;
+      /* 自定义下拉箭头 */
+      appearance: none;
+      -webkit-appearance: none;
+      -moz-appearance: none;
+      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='rgba(255, 255, 255, 0.8)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+      background-repeat: no-repeat;
+      background-position: right 15px center;
+      background-size: 16px;
+      padding-right: 40px;
+    }
+
+    .time-filter select:hover, .time-filter input:hover {
+      background: rgba(255, 255, 255, 0.35);
+      transform: translateY(-1px) scale(1.02);
+      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+      border-color: rgba(232, 106, 146, 0.4);
+    }
+
+    .time-filter select:focus, .time-filter input:focus {
+      border-color: rgba(232, 106, 146, 0.6);
+      background: rgba(255, 255, 255, 0.4);
+      box-shadow: 0 0 0 3px rgba(232, 106, 146, 0.2);
+      transform: translateY(-1px);
+    }
+
+    /* 下拉菜单容器样式 */
+    .time-filter select {
+      position: relative;
+    }
+
+    /* 下拉选项样式 */
+    .time-filter select option {
+      background: rgba(255, 255, 255, 0.95);
+      color: #333;
+      padding: 12px 15px;
+      font-size: 14px;
+      border-radius: 8px;
+      margin: 2px 0;
+      transition: all 0.2s ease;
+    }
+
+    /* 选项悬停样式 */
+    .time-filter select option:hover {
+      background: linear-gradient(135deg, #e86a92, #8e44ad);
+      color: white;
+      transform: translateX(5px);
+    }
+
+    /* 选中选项样式 */
+    .time-filter select option:checked {
+      background: linear-gradient(135deg, #e86a92, #8e44ad);
+      color: white;
+      font-weight: 600;
+    }
+
+    /* 自定义日期选择器样式美化 */
+    #custom-date-picker {
+      margin-top: 15px;
+      padding: 20px;
+      background: linear-gradient(135deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.08));
+      border-radius: 16px;
       border: 1px solid rgba(255, 255, 255, 0.2);
+      backdrop-filter: blur(12px);
+      -webkit-backdrop-filter: blur(12px);
+      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    }
+
+    #custom-date-picker.active {
+      animation: slideDown 0.3s ease-out;
+    }
+
+    @keyframes slideDown {
+      from {
+        opacity: 0;
+        transform: translateY(-10px) scale(0.95);
+      }
+      to {
+        opacity: 1;
+        transform: translateY(0) scale(1);
+      }
+    }
+
+    #custom-date-picker input[type="date"] {
+      padding: 12px 15px;
+      border: 1px solid rgba(255, 255, 255, 0.25);
       border-radius: 10px;
-      background: rgba(255, 255, 255, 0.2);
+      background: rgba(255, 255, 255, 0.25);
       color: white;
       font-size: 14px;
       transition: all 0.3s ease;
       cursor: pointer;
     }
 
-    .time-filter select:hover, .time-filter input:hover {
-      background: rgba(255, 255, 255, 0.3);
-      transform: scale(1.02);
+    #custom-date-picker input[type="date"]:hover {
+      background: rgba(255, 255, 255, 0.35);
+      border-color: rgba(232, 106, 146, 0.4);
     }
 
-    .time-filter select:focus, .time-filter input:focus {
+    #custom-date-picker input[type="date"]:focus {
       outline: none;
-      border-color: rgba(232, 106, 146, 0.5);
-      box-shadow: 0 0 0 2px rgba(232, 106, 146, 0.1);
+      border-color: rgba(232, 106, 146, 0.6);
+      box-shadow: 0 0 0 3px rgba(232, 106, 146, 0.2);
     }
 
-    .time-filter select option {
-      background: #2c3e50;
+    #custom-date-picker span {
       color: white;
-      padding: 10px;
+      font-weight: 500;
+      margin: 0 10px;
+    }
+
+    #apply-date-filter {
+      padding: 12px 25px;
+      border: none;
+      border-radius: 12px;
+      background: linear-gradient(45deg, #e86a92, #8e44ad);
+      color: white;
+      font-size: 14px;
+      font-weight: 600;
+      cursor: pointer;
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+      box-shadow: 0 4px 12px rgba(232, 106, 146, 0.3);
+    }
+
+    #apply-date-filter:hover {
+      transform: translateY(-2px);
+      box-shadow: 0 6px 20px rgba(232, 106, 146, 0.4);
+    }
+
+    #apply-date-filter:active {
+      transform: translateY(0);
+      box-shadow: 0 2px 8px rgba(232, 106, 146, 0.3);
     }
 
     #custom-date-picker {
@@ -2157,10 +2573,61 @@
       background-color: #f5f5f5;
       cursor: not-allowed;
     }
+
+    /* 收藏夹卡片样式 */
+    .favorites-cards-container {
+      display: grid;
+      grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
+      gap: 15px;
+      margin-bottom: 15px;
+    }
+
+    .favorite-card {
+      background: rgba(255, 255, 255, 0.3);
+      border-radius: 12px;
+      padding: 15px;
+      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
+      border: 1px solid rgba(255, 255, 255, 0.18);
+      transition: all 0.3s ease;
+    }
+
+    .favorite-card:hover {
+      transform: translateY(-5px);
+      box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
+    }
+
+    .favorite-card h4 {
+      margin: 0 0 10px 0;
+      color: #e86a92;
+      font-size: 16px;
+      font-weight: 600;
+    }
+
+    .favorite-card .card-detail {
+      display: flex;
+      justify-content: space-between;
+      margin-bottom: 8px;
+      font-size: 14px;
+    }
+
+    .favorite-card .card-label {
+      font-weight: 500;
+      color: #666;
+    }
+
+    .favorite-card .card-value {
+      color: #333;
+    }
   </style>
 </head>
 
 <body>
+  <!-- 页面加载动画 -->
+  <div id="loader" class="loader-container">
+    <div class="loader"></div>
+    <div class="loader-text">加载中...</div>
+  </div>
+
   <canvas id="particleCanvas"></canvas>
 
   <div class="container">
@@ -2183,7 +2650,7 @@
       </div>
       <!-- 个人中心展示 -->
       <div class="user-profile" id="userProfile">
-        <div class="profile-header">
+        <div class="profile-header" onclick="toggleUserMenu()">
           <div class="profile-info">
             <div class="profile-name" id="profileName">加载中...</div>
             <div class="profile-role" id="profileRole">加载中...</div>
@@ -2191,6 +2658,35 @@
           <div class="profile-avatar">
             <i class="fas fa-user-circle"></i>
           </div>
+          <i class="fas fa-chevron-down profile-arrow"></i>
+        </div>
+        <!-- 个人中心下拉菜单 -->
+        <div class="profile-dropdown" id="profileDropdown">
+          <div class="dropdown-section user-info-section">
+            <div class="dropdown-title">账户信息</div>
+            <div class="dropdown-item">
+              <i class="fas fa-user"></i>
+              <span class="dropdown-label">用户名：</span>
+              <span id="dropdownUsername">加载中...</span>
+            </div>
+            <div class="dropdown-item">
+              <i class="fas fa-briefcase"></i>
+              <span class="dropdown-label">角色：</span>
+              <span id="dropdownRole">加载中...</span>
+            </div>
+            <div class="dropdown-item">
+              <i class="fas fa-building"></i>
+              <span class="dropdown-label">部门：</span>
+              <span id="dropdownDepartment">加载中...</span>
+            </div>
+          </div>
+          <div class="dropdown-divider"></div>
+          <div class="dropdown-section action-section">
+            <button class="dropdown-btn logout-btn" onclick="logout()">
+              <i class="fas fa-sign-out-alt"></i>
+              退出登录
+            </button>
+          </div>
         </div>
       </div>
     </div>
@@ -2309,6 +2805,7 @@
               <option value="custom">自定义筛选</option>
             </select>
             <select id="time-filter-content">
+              <option value="today" selected>今日</option>
               <option value="yesterday">昨天</option>
               <option value="day_before_yesterday">前天</option>
               <option value="three_days_ago">大前天</option>
@@ -2555,29 +3052,8 @@
 
       <!-- 弹窗内容 -->
       <div class="modal-body">
-        <div class="customer-details">
-          <!-- 公海需求部分，只对公海池客户显示 -->
-          <div class="detail-section public-sea-demand-section" id="publicSeaDemandSection" style="display: none;">
-            <h3 class="detail-section-title">公海需求</h3>
-            <div class="detail-item">
-              <span class="detail-label">品种：</span>
-              <span class="detail-value" id="detail-variety">-</span>
-            </div>
-            <div class="detail-item">
-              <span class="detail-label">规格：</span>
-              <span class="detail-value" id="detail-specification">-</span>
-            </div>
-            <div class="detail-item">
-              <span class="detail-label">件数：</span>
-              <span class="detail-value" id="detail-quantity">-</span>
-            </div>
-            <div class="detail-item">
-              <span class="detail-label">毛重：</span>
-              <span class="detail-value" id="detail-weight">-</span>
-            </div>
-          </div>
-
-          <!-- 基本联系人信息单独一行 -->
+        <!-- 基本联系人  公司信息 -->
+        <div class="info-section-container">
           <div>
             <div class="detail-section">
               <h3 class="detail-section-title">
@@ -2624,7 +3100,6 @@
             </div>
           </div>
 
-          <!-- 公司信息单独一行 -->
           <div>
             <div class="detail-section">
               <h3 class="detail-section-title">公司信息</h3>
@@ -2660,7 +3135,7 @@
           </div>
         </div>
 
-        <!-- 使用新的容器将负责人信息和附加联系人信息放在同一行，实现视觉平衡 -->
+        <!-- 负责人信息    收藏夹 -->
         <div class="info-section-container">
           <div>
             <div class="detail-section">
@@ -2693,17 +3168,62 @@
           </div>
 
           <div>
-            <!-- 自定义详情区域 - 调整为与基本信息一致的排版 -->
-            <div class="detail-section custom-details-section" id="customDetailsSection">
-              <h3 class="detail-section-title">附加联系人信息</h3>
-              <div id="customDetailsContainer">
-                <!-- 动态添加的详情将显示在这里 -->
-                <div class="detail-item"><span class="detail-value">暂无附加联系人信息</span></div>
+            <div class="detail-section">
+              <h3 class="detail-section-title">收藏夹</h3>
+              <div id="favorites-container">
+                <!-- 默认显示第一个收藏项 -->
+                <div id="favorite-first-item" style="display: none;">
+                  <div class="detail-item">
+                    <span class="detail-label">收藏产品：</span>
+                    <span class="detail-value" id="favorite-product-name">-</span>
+                  </div>
+                  <div class="detail-item">
+                    <span class="detail-label">价格：</span>
+                    <span class="detail-value" id="favorite-price">-</span>
+                  </div>
+                  <div class="detail-item">
+                    <span class="detail-label">数量：</span>
+                    <span class="detail-value" id="favorite-quantity">-</span>
+                  </div>
+                  <div class="detail-item">
+                    <span class="detail-label">毛重：</span>
+                    <span class="detail-value" id="favorite-gross-weight">-</span>
+                  </div>
+                  <div class="detail-item">
+                    <span class="detail-label">蛋黄：</span>
+                    <span class="detail-value" id="favorite-yolk">-</span>
+                  </div>
+                  <button class="action-btn" id="view-all-favorites" style="margin-top: 10px;">
+                    查看完整收藏
+                  </button>
+                </div>
+                
+                <!-- 完整收藏列表（卡片形式） -->
+                <div id="all-favorites" style="display: none;">
+                  <div id="favorites-cards-container"></div>
+                  <button class="action-btn" id="hide-all-favorites" style="margin-top: 10px;">
+                    收起
+                  </button>
+                </div>
+                
+                <!-- 无收藏提示 -->
+                <div id="no-favorites" class="detail-item">
+                  <span class="detail-value">暂无收藏</span>
+                </div>
               </div>
             </div>
           </div>
         </div>
 
+        <!-- 附加联系人信息 -->
+        <div class="detail-section custom-details-section" id="customDetailsSection">
+          <h3 class="detail-section-title">附加联系人信息</h3>
+          <div id="customDetailsContainer">
+            <!-- 动态添加的详情将显示在这里 -->
+            <div class="detail-item"><span class="detail-value">暂无附加联系人信息</span></div>
+          </div>
+        </div>
+
 
       </div>
     </div>
@@ -3589,22 +4109,6 @@
     setInterval(updateBeijingTime, 1000);
 
     // 初始化个人中心显示
-    function initUserProfile() {
-      const loginInfo = getLoginInfo();
-      const profileName = document.getElementById('profileName');
-      const profileRole = document.getElementById('profileRole');
-      
-      if (loginInfo.userName) {
-        profileName.textContent = loginInfo.userName;
-        profileRole.textContent = loginInfo.projectName || '未设置角色';
-      } else {
-        profileName.textContent = '请登录';
-        profileRole.textContent = '访客';
-      }
-    }
-    
-    // 初始化个人中心
-    initUserProfile();
 
     // 页面切换功能
     const navItems = document.querySelectorAll('.nav-item');
@@ -3644,7 +4148,7 @@
     let showAll = false;
     // 时间筛选相关变量
     let currentTimeFilterType = 'dynamic';
-    let currentTimeFilterContent = 'yesterday';
+    let currentTimeFilterContent = 'today';
     let customStartDate = '';
     let customEndDate = '';
 
@@ -3856,6 +4360,11 @@
 
       if (currentTimeFilterType === 'dynamic') {
         switch (currentTimeFilterContent) {
+          case 'today':
+            startDate = new Date(now);
+            startDate.setHours(0, 0, 0, 0);
+            endDate = now;
+            break;
           case 'yesterday':
             startDate = new Date(now);
             startDate.setDate(startDate.getDate() - 1);
@@ -4274,7 +4783,7 @@
       return currentPageRecords;
     }
 
-    const API_BASE_URL = 'http://localhost:8081/DL'; // 后端API基础地址
+    const API_BASE_URL = 'http://8.137.125.67:8080/DL'; // 后端API基础地址
 
     // 获取登录用户信息函数
     function getLoginInfo() {
@@ -4706,15 +5215,12 @@
       
       // 生成通知列表HTML
       const notificationsHTML = notifications.map(notification => `
-        <div class="notification-item new-customer" data-notification-id="${notification.id}">
+        <div class="notification-item new-customer" data-notification-id="${notification.id}" onclick="viewNotificationCustomerDetails('${notification.id}')">
           <div class="notification-content">
-            <strong>${notification.customer.company}</strong> 有新客户：${notification.customer.contact}
-          </div>
-          <div class="notification-time">${notification.time}</div>
-          <div class="notification-actions">
-            <button class="view-details-btn" onclick="viewNotificationCustomerDetails('${notification.id}')">查看详情</button>
-            <button class="dismiss-btn" onclick="dismissNotification('${notification.id}')">忽略</button>
+            <span class="customer-name">${notification.customer.nickName || notification.customer.contact}</span>
+            <span class="customer-phone">${notification.customer.phoneNumber || notification.customer.phone}</span>
           </div>
+          <span class="notification-time">${notification.time}</span>
         </div>
       `).join('');
       
@@ -4724,7 +5230,10 @@
     // 切换通知模态框显示
     function toggleNotificationModal() {
       const notificationModal = document.getElementById('notificationModal');
+      const notificationOverlay = document.getElementById('notificationModalOverlay');
+      
       notificationModal.classList.toggle('active');
+      notificationOverlay.classList.toggle('active');
       
       // 如果打开模态框，标记所有通知为已读
       if (notificationModal.classList.contains('active')) {
@@ -4738,7 +5247,11 @@
 
     // 关闭通知模态框
     function closeNotificationModal() {
-      document.getElementById('notificationModal').classList.remove('active');
+      const notificationModal = document.getElementById('notificationModal');
+      const notificationOverlay = document.getElementById('notificationModalOverlay');
+      
+      notificationModal.classList.remove('active');
+      notificationOverlay.classList.remove('active');
     }
 
     // 从通知弹窗查看客户详情
@@ -4960,6 +5473,27 @@
 
       targetTbody.appendChild(row);
 
+      // 对当前等级的所有行按时间排序（优先使用修改时间，不存在则使用创建时间）
+      const rows = Array.from(targetTbody.querySelectorAll('tr'));
+      rows.sort((a, b) => {
+        // 获取修改时间，不存在则使用创建时间
+        const timeA = a.dataset.updatedAt || a.dataset.createdAt;
+        const timeB = b.dataset.updatedAt || b.dataset.createdAt;
+        
+        // 如果都没有时间，保持原有顺序
+        if (!timeA && !timeB) return 0;
+        // 没有时间的行排在后面
+        if (!timeA) return 1;
+        if (!timeB) return -1;
+        
+        // 按时间倒序排列（最新的在前面）
+        return new Date(timeB) - new Date(timeA);
+      });
+      
+      // 清空表格并重新添加排序后的行，确保顺序正确
+      targetTbody.innerHTML = '';
+      rows.forEach(row => targetTbody.appendChild(row));
+
       // 如果当前选中的等级是新增客户的等级，刷新分页
       if (currentLevel === level) {
         updatePagination();
@@ -5068,18 +5602,46 @@
         console.log('认领客户结果:', data);
         if (data.success) {
           alert('客户认领成功！');
-          // 刷新公海池列表
-          // 检查哪个公海池表格当前可见
+          
+          // 更新前端数据：从相应的公海池数据源中移除被认领的客户
+          if (customer.level === 'department-sea-pools') {
+            departmentSeaPoolData = departmentSeaPoolData.filter(item => item.id !== customerId);
+          } else if (customer.level === 'organization-sea-pools') {
+            organizationSeaPoolData = organizationSeaPoolData.filter(item => item.id !== customerId);
+          }
+          
+          // 更新customerData中的客户等级
+          customer.level = 'unclassified'; // 认领后变为未分级客户
+          
+          // 刷新公海池列表（结合currentLevel和表格显示状态）
           const departmentTable = document.getElementById('department-sea-pools-customers');
           const organizationTable = document.getElementById('organization-sea-pools-customers');
           
-          if (departmentTable && departmentTable.style.display === 'table-row-group') {
-            // 如果部门公海池表格可见，直接重新渲染
+          // 检查当前选中的等级标签
+          if (currentLevel === 'department-sea-pools') {
+            renderDepartmentSeaPool(departmentSeaPoolData);
+          } else if (currentLevel === 'organization-sea-pools') {
+            renderOrganizationSeaPool(organizationSeaPoolData);
+          } else if (departmentTable && departmentTable.style.display === 'table-row-group') {
             renderDepartmentSeaPool(departmentSeaPoolData);
           } else if (organizationTable && organizationTable.style.display === 'table-row-group') {
-            // 如果组织公海池表格可见，直接重新渲染
+            renderOrganizationSeaPool(organizationSeaPoolData);
+          } else {
+            // 如果当前不是公海池视图，仍需确保数据源更新后表格也能正确显示
+            renderDepartmentSeaPool(departmentSeaPoolData);
             renderOrganizationSeaPool(organizationSeaPoolData);
           }
+          
+          // 同时更新全局客户列表和相关表格
+          if (typeof updateRecentCustomers === 'function') {
+            updateRecentCustomers();
+          }
+          if (typeof updateStatsCards === 'function') {
+            updateStatsCards();
+          }
+          if (typeof updateCustomerTable === 'function') {
+            updateCustomerTable(customer);
+          }
         } else {
           alert('客户认领失败: ' + (data.message || '未知错误'));
         }
@@ -5182,20 +5744,81 @@
       // 显示自定义详情
       renderCustomDetails();
 
-      // 处理公海需求部分显示
-      const publicSeaDemandSection = document.getElementById('publicSeaDemandSection');
-      console.log('公海需求区域元素:', publicSeaDemandSection);
-      if (customer.level === 'department-sea-pools' || customer.level === 'organization-sea-pools') {
-        console.log('显示公海需求区域');
-        publicSeaDemandSection.style.display = 'block';
-        // 填充公海需求数据，如果没有则显示默认值
-        document.getElementById('detail-variety').textContent = customer.variety || '-';
-        document.getElementById('detail-specification').textContent = customer.specification || '-';
-        document.getElementById('detail-quantity').textContent = customer.quantity || '-';
-        document.getElementById('detail-weight').textContent = customer.weight || '-';
+
+
+      // 处理收藏夹显示
+      const favorites = customer.favorites || [];
+      const favoritesContainer = document.getElementById('favorites-container');
+      const favoriteFirstItem = document.getElementById('favorite-first-item');
+      const allFavorites = document.getElementById('all-favorites');
+      const noFavorites = document.getElementById('no-favorites');
+      const favoritesCardsContainer = document.getElementById('favorites-cards-container');
+
+      if (favorites && favorites.length > 0) {
+        // 有收藏数据
+        noFavorites.style.display = 'none';
+        favoriteFirstItem.style.display = 'block';
+        allFavorites.style.display = 'none';
+
+        // 显示第一个收藏项
+        const firstFavorite = favorites[0];
+        document.getElementById('favorite-product-name').textContent = firstFavorite.productName || '-';
+        document.getElementById('favorite-price').textContent = firstFavorite.price || '-';
+        document.getElementById('favorite-quantity').textContent = firstFavorite.quantity || '-';
+        document.getElementById('favorite-gross-weight').textContent = firstFavorite.grossWeight || '-';
+        document.getElementById('favorite-yolk').textContent = firstFavorite.yolk || '-';
+
+        // 绑定查看完整收藏事件
+        document.getElementById('view-all-favorites').onclick = function() {
+          favoriteFirstItem.style.display = 'none';
+          allFavorites.style.display = 'block';
+          
+          // 生成收藏卡片
+          favoritesCardsContainer.innerHTML = '';
+          favorites.forEach((favorite, index) => {
+            const card = document.createElement('div');
+            card.className = 'favorite-card';
+            card.innerHTML = `
+              <h4>${favorite.productName || '未命名产品'}</h4>
+              <div class="card-detail">
+                <span class="card-label">价格：</span>
+                <span class="card-value">${favorite.price || '-'}</span>
+              </div>
+              <div class="card-detail">
+                <span class="card-label">数量：</span>
+                <span class="card-value">${favorite.quantity || '-'}</span>
+              </div>
+              <div class="card-detail">
+                <span class="card-label">毛重：</span>
+                <span class="card-value">${favorite.grossWeight || '-'}</span>
+              </div>
+              <div class="card-detail">
+                <span class="card-label">蛋黄：</span>
+                <span class="card-value">${favorite.yolk || '-'}</span>
+              </div>
+              ${favorite.assistant ? `<div class="card-detail">
+                <span class="card-label">助手：</span>
+                <span class="card-value">${favorite.assistant}</span>
+              </div>` : ''}
+              ${favorite.company ? `<div class="card-detail">
+                <span class="card-label">公司：</span>
+                <span class="card-value">${favorite.company}</span>
+              </div>` : ''}
+            `;
+            favoritesCardsContainer.appendChild(card);
+          });
+        };
+
+        // 绑定收起事件
+        document.getElementById('hide-all-favorites').onclick = function() {
+          allFavorites.style.display = 'none';
+          favoriteFirstItem.style.display = 'block';
+        };
       } else {
-        console.log('隐藏公海需求区域');
-        publicSeaDemandSection.style.display = 'none';
+        // 无收藏数据
+        favoriteFirstItem.style.display = 'none';
+        allFavorites.style.display = 'none';
+        noFavorites.style.display = 'block';
       }
 
       document.getElementById('customerModal').classList.add('active');
@@ -6548,7 +7171,10 @@
         </div>
     </div>
   </div>
-<!-- 通知弹窗 -->
+<!-- 通知弹窗背景遮罩 -->
+  <div class="notification-modal-overlay" id="notificationModalOverlay"></div>
+
+  <!-- 通知弹窗 -->
   <div class="notification-modal" id="notificationModal">
     <div class="notification-header">
       <h3>新客户通知</h3>
@@ -6560,5 +7186,72 @@
       <div class="no-notifications">暂无新客户通知</div>
     </div>
   </div>
+
+  <!-- 页面加载完成后隐藏加载动画 -->
+  <script>
+    // 监听页面加载完成事件
+    window.addEventListener('load', function() {
+      // 延迟500毫秒隐藏加载动画，让用户看到加载效果
+      setTimeout(function() {
+        const loader = document.getElementById('loader');
+        if (loader) {
+          loader.classList.add('hidden');
+        }
+      }, 500);
+      
+      // 初始化个人中心信息
+      initUserProfile();
+    });
+    
+    // 初始化个人中心信息
+    function initUserProfile() {
+      // 从URL参数或localStorage获取实际登录信息
+      const loginInfo = getLoginInfo();
+      
+      // 更新页面上的个人信息
+      document.getElementById('profileName').textContent = loginInfo.userName || '请登录';
+      document.getElementById('profileRole').textContent = loginInfo.projectName || '未设置角色';
+      
+      // 更新下拉菜单中的个人信息
+      document.getElementById('dropdownUsername').textContent = loginInfo.userName || '未设置用户名';
+      document.getElementById('dropdownRole').textContent = loginInfo.projectName || '未设置角色';
+      document.getElementById('dropdownDepartment').textContent = loginInfo.managerdepartment || '未设置部门';
+    }
+    
+    // 切换用户菜单显示/隐藏
+    function toggleUserMenu() {
+      const profileHeader = document.querySelector('.profile-header');
+      const profileDropdown = document.getElementById('profileDropdown');
+      
+      profileHeader.classList.toggle('active');
+      profileDropdown.classList.toggle('active');
+    }
+    
+    // 退出登录功能
+    function logout() {
+      // 确认退出登录
+      if (confirm('确定要退出登录吗？')) {
+        // 这里可以添加实际的退出登录逻辑，比如清除本地存储、跳转到登录页等
+        alert('已退出登录');
+        // 关闭下拉菜单
+        toggleUserMenu();
+        // 跳转到登录页面
+        window.location.href = 'loginmm.html';
+      }
+    }
+    
+    // 点击页面其他位置关闭用户菜单
+    document.addEventListener('click', function(event) {
+      const userProfile = document.getElementById('userProfile');
+      if (!userProfile.contains(event.target)) {
+        const profileHeader = document.querySelector('.profile-header');
+        const profileDropdown = document.getElementById('profileDropdown');
+        
+        profileHeader.classList.remove('active');
+        profileDropdown.classList.remove('active');
+      }
+    });
+  </script>
+
   </body>
 </html>
\ No newline at end of file