feat(ckbox): 重构联系人列表获取逻辑并优化登录流程

- 将联系人列表从模拟数据改为从API获取
- 优化登录处理流程，分离存客宝和触客宝的token获取
- 添加messageApi统一处理消息提示
- 修复路径引用问题并移除未使用的导入

Cunkebao/src/api/request2.ts

@@ -28,7 +28,6 @@ const instance: AxiosInstance = axios.create({
 instance.interceptors.request.use((config: any) => {
   // 在每次请求时动态获取最新的 token2
   const { token2 } = useUserStore.getState();
-
   if (token2) {
     config.headers = config.headers || {};
     config.headers["Authorization"] = `bearer ${token2}`;

Cunkebao/src/pages/login/Login.tsx

@@ -69,32 +69,6 @@ const Login: React.FC = () => {
     }
   };
 
-  // 登录处理
-  const handleLogin = async (values: any) => {
-    if (!agreeToTerms) {
-      Toast.show({ content: "请同意用户协议和隐私政策", position: "top" });
-      return;
-    }
-    getToken(values).then(() => {
-      getChuKeBaoUserInfo().then(res => {
-        setUserInfo(res);
-        getToken2().then(Token => {
-          // // 使用WebSocket store连接
-          // const { connect } = useWebSocketStore.getState();
-          // connect({
-          //   accessToken: Token,
-          //   accountId: getAccountId()?.toString() || "",
-          //   client: "kefu-client",
-          //   autoReconnect: true,
-          //   reconnectInterval: 3000,
-          //   maxReconnectAttempts: 5,
-          // });
-        });
-      });
-      setLoading(false);
-    });
-  };
-
   const getToken = (values: any) => {
     return new Promise((resolve, reject) => {
       // 添加typeId参数
@@ -130,13 +104,34 @@ const Login: React.FC = () => {
         password: "kr123456",
         username: "kr_xf3",
       };
-      const response = loginWithToken(params);
+      loginWithToken(params)
-      response.then(res => {
+        .then(res => {
-        login2(res.access_token);
+          login2(res.access_token);
-        resolve(res.access_token);
+          resolve(res.access_token);
+        })
+        .catch(err => {
+          reject(err);
+        });
+    });
+  };
+
+  // 登录处理
+  const handleLogin = async (values: any) => {
+    if (!agreeToTerms) {
+      Toast.show({ content: "请同意用户协议和隐私政策", position: "top" });
+      return;
+    }
+    //获取存客宝
+    getToken(values)
+      .then(() => {})
+      .finally(() => {
+        setLoading(false);
       });
-      response.catch(err => {
+
-        reject(err);
+    //获取触客宝
+    getToken2().then(() => {
+      getChuKeBaoUserInfo().then(res => {
+        setUserInfo(res);
       });
     });
   };

Cunkebao/src/pages/pc/ckbox/api.ts

@@ -1,11 +1,9 @@
-import request from "@/api/request";
+import request from "@/api/request2";
 import {
   ContactData,
-  ContactListResponse,
   ChatSession,
   MessageData,
   ChatHistoryResponse,
-  SendMessageRequest,
   MessageType,
   GroupData,
   OnlineStatus,
@@ -17,8 +15,8 @@ import {
 } from "./data";
 
 // 获取联系人列表
-export const getContactList = (): Promise<ContactData[]> => {
+export const getContactList = (params: { prevId: number; count: number }) => {
-  return request("/v1/contacts", {}, "GET");
+  return request("/api/wechatFriend/list", params, "GET");
 };
 
 // 搜索联系人

Cunkebao/src/pages/pc/ckbox/components/ChatWindow/index.tsx

@@ -60,6 +60,7 @@ const ChatWindow: React.FC<ChatWindowProps> = ({
   showProfile = true,
   onToggleProfile,
 }) => {
+  const [messageApi, contextHolder] = message.useMessage();
   const [messages, setMessages] = useState<MessageData[]>([]);
   const [inputValue, setInputValue] = useState("");
   const [loading, setLoading] = useState(false);
@@ -109,7 +110,7 @@ const ChatWindow: React.FC<ChatWindowProps> = ({
       ];
       setMessages(mockMessages);
     } catch (error) {
-      message.error("获取聊天记录失败");
+      messageApi.error("获取聊天记录失败");
     } finally {
       setLoading(false);
     }
@@ -137,7 +138,7 @@ const ChatWindow: React.FC<ChatWindowProps> = ({
       onSendMessage(inputValue);
       setInputValue("");
     } catch (error) {
-      message.error("发送失败");
+      messageApi.error("发送失败");
     }
   };
 
@@ -259,6 +260,7 @@ const ChatWindow: React.FC<ChatWindowProps> = ({
 
   return (
     <Layout className={styles.chatWindow}>
+      {contextHolder}
       {/* 聊天主体区域 */}
       <Layout className={styles.chatMain}>
         {/* 聊天头部 */}

Cunkebao/src/pages/pc/ckbox/components/MessageList/api.ts

@@ -0,0 +1,6 @@
+import request from "@/api/request";
+
+// 获取联系人列表
+export const getContactList = (params: { prevId: string; count: number }) => {
+  return request("/api/wechatFriend/list", params, "GET");
+};

Cunkebao/src/pages/pc/ckbox/components/MessageList/index.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import { List, Avatar, Badge } from "antd";
 import { UserOutlined, TeamOutlined } from "@ant-design/icons";
 import dayjs from "dayjs";
-import { ChatSession } from "../data";
+import { ChatSession } from "@/pages/pc/ckbox/data";
 import styles from "./MessageList.module.scss";
 
 interface MessageListProps {

Cunkebao/src/pages/pc/ckbox/index.tsx

@@ -1,33 +1,10 @@
 import React, { useState, useEffect, useRef } from "react";
-import {
+import { Layout, Input, Button, Tabs, Space, message, Tooltip } from "antd";
-  Layout,
-  Input,
-  Button,
-  Avatar,
-  List,
-  Badge,
-  Tabs,
-  Space,
-  Dropdown,
-  Menu,
-  message,
-  Popover,
-  Tooltip,
-  Divider,
-} from "antd";
 import {
   SearchOutlined,
-  PlusOutlined,
-  MoreOutlined,
-  SendOutlined,
-  SmileOutlined,
-  PaperClipOutlined,
-  PhoneOutlined,
-  VideoCameraOutlined,
   UserOutlined,
   TeamOutlined,
   MessageOutlined,
-  SettingOutlined,
   InfoCircleOutlined,
 } from "@ant-design/icons";
 import dayjs from "dayjs";
@@ -36,11 +13,12 @@ import ChatWindow from "./components/ChatWindow/index";
 import ContactList from "./components/ContactList/index";
 import MessageList from "./components/MessageList/index";
 import styles from "./index.module.scss";
-
+import { getContactList } from "./api";
 const { Sider, Content } = Layout;
 const { TabPane } = Tabs;
 
 const CkboxPage: React.FC = () => {
+  const [messageApi, contextHolder] = message.useMessage();
   const [contacts, setContacts] = useState<ContactData[]>([]);
   const [chatSessions, setChatSessions] = useState<ChatSession[]>([]);
   const [currentChat, setCurrentChat] = useState<ChatSession | null>(null);
@@ -57,52 +35,27 @@ const CkboxPage: React.FC = () => {
   const fetchContacts = async () => {
     try {
       setLoading(true);
-      // 模拟联系人数据
+      // 使用API获取联系人数据
-      const mockContacts: ContactData[] = [
+      const response = await getContactList({ prevId: 0, count: 500 });
-        {
+      console.log(response);
-          id: "1",
+
-          name: "张三",
+      if (response && response.data) {
-          phone: "13800138001",
+        // 转换API返回的数据结构为组件所需的ContactData结构
-          avatar: "",
+        const contactList: ContactData[] = response.data.map((item: any) => ({
-          online: true,
+          id: item.id.toString(),
-          status: "在线",
+          name: item.nickname || item.conRemark || item.alias || "",
-          department: "技术部",
+          phone: item.phone || "",
-          position: "前端工程师",
+          avatar: item.avatar || "",
-        },
+          online: true, // 假设所有联系人都在线，实际应根据API返回数据调整
-        {
+          status: "在线", // 假设状态，实际应根据API返回数据调整
-          id: "2",
+          department: "", // API中没有对应字段，可以根据需要添加
-          name: "李四",
+          position: "", // API中没有对应字段，可以根据需要添加
-          phone: "13800138002",
+        }));
-          avatar: "",
+        setContacts(contactList);
-          online: false,
+      }
-          status: "忙碌中",
-          department: "产品部",
-          position: "产品经理",
-        },
-        {
-          id: "3",
-          name: "王五",
-          phone: "13800138003",
-          avatar: "",
-          online: true,
-          status: "在线",
-          department: "设计部",
-          position: "UI设计师",
-        },
-        {
-          id: "4",
-          name: "赵六",
-          phone: "13800138004",
-          avatar: "",
-          online: false,
-          status: "离线",
-          department: "运营部",
-          position: "运营专员",
-        },
-      ];
-      setContacts(mockContacts);
     } catch (error) {
-      message.error("获取联系人失败");
+      messageApi.error("获取联系人失败");
+      console.error("获取联系人失败:", error);
     } finally {
       setLoading(false);
     }
@@ -145,7 +98,7 @@ const CkboxPage: React.FC = () => {
       ];
       setChatSessions(sessions);
     } catch (error) {
-      message.error("获取聊天记录失败");
+      messageApi.error("获取聊天记录失败");
     }
   };
 
@@ -195,9 +148,9 @@ const CkboxPage: React.FC = () => {
       );
       setCurrentChat(updatedSession);
 
-      message.success("消息发送成功");
+      messageApi.success("消息发送成功");
     } catch (error) {
-      message.error("消息发送失败");
+      messageApi.error("消息发送失败");
     }
   };
 
@@ -223,6 +176,7 @@ const CkboxPage: React.FC = () => {
 
   return (
     <Layout className={styles.ckboxLayout}>
+      {contextHolder}
       {/* 左侧边栏 */}
       <Sider width={300} className={styles.sidebar}>
         {/* 搜索栏 */}

Cunkebao/src/store/module/user.ts

@@ -80,6 +80,8 @@ export const useUserStore = createPersistStore<UserState>(
     },
     login2: token2 => {
       localStorage.setItem("token2", token2);
+      console.log(token2);
+
       set({ token2, isLoggedIn: true });
     },
     logout: () => {