優化導航組件：調整按鈕顯示內容，新增用戶信息顯示，並在樣式中增加間距設置，提升用戶界面友好性。

Touchkebao/src/pages/pc/ckbox/components/NavCommon/index.module.scss

@@ -79,6 +79,7 @@
       display: flex;
       align-items: center;
       padding: 8px 0;
+      gap: 26px;
       .suanli {
         display: flex;
         align-items: center;
@@ -131,10 +132,20 @@
 
     .userSection {
       display: flex;
-      align-items: center;
       gap: 12px;
       cursor: pointer;
-      padding: 8px 16px;
+      .userInfo2 {
+        line-height: 1;
+        padding-top: 5px;
+        font-size: 14px;
+        .userNickname {
+          margin-bottom: 4px;
+        }
+        .userAccount {
+          font-size: 12px;
+          color: #888;
+        }
+      }
     }
 
     .userNickname {

Touchkebao/src/pages/pc/ckbox/components/NavCommon/index.tsx

@@ -1,7 +1,7 @@
 import React, { useState } from "react";
 import { Layout, Drawer, Avatar, Space, Button, Badge, Dropdown } from "antd";
 import {
-  MenuOutlined,
+  BarChartOutlined,
   UserOutlined,
   BellOutlined,
   LogoutOutlined,
@@ -90,24 +90,20 @@ const NavCommon: React.FC<NavCommonProps> = ({ title = "触客宝" }) => {
     <>
       <Header className={styles.header}>
         <div className={styles.headerLeft}>
-          {!isWeChat() ? (
-            <Button
-              type="text"
-              size="large"
-              icon={<WechatOutlined />}
-              onClick={handleMenuClick}
-              className={styles.menuButton}
-            />
-          ) : (
-            <Button
-              type="text"
-              size="large"
-              icon={<MenuOutlined />}
-              onClick={handleMenuClick}
-              className={styles.menuButton}
-            />
-          )}
-
+          <Button
+            icon={<BarChartOutlined />}
+            type={!isWeChat() ? "primary" : "default"}
+            onClick={handleMenuClick}
+          >
+            功能中心
+          </Button>
+          <Button
+            icon={<WechatOutlined />}
+            type={isWeChat() ? "primary" : "default"}
+            onClick={handleMenuClick}
+          >
+            Ai智能客服
+          </Button>
           <span className={styles.title}>{title}</span>
         </div>
 
@@ -124,14 +120,14 @@ const NavCommon: React.FC<NavCommonProps> = ({ title = "触客宝" }) => {
                 <BellOutlined style={{ fontSize: 20 }} />
               </Badge>
             </div>
-            <div
-              className={styles.messageButton}
+            <Button
               onClick={() => {
                 navigate("/pc/commonConfig");
               }}
+              icon={<SettingOutlined />}
             >
-              <SettingOutlined style={{ fontSize: 20 }} />
-            </div>
+              全局配置
+            </Button>
             <Dropdown
               menu={{ items: userMenuItems }}
               placement="bottomRight"
@@ -144,6 +140,11 @@ const NavCommon: React.FC<NavCommonProps> = ({ title = "触客宝" }) => {
                   src={user?.avatar}
                   className={styles.avatar}
                 />
+
+                <div className={styles.userInfo2}>
+                  <div className={styles.userNickname}>{user.username}</div>
+                  <div className={styles.userAccount}>高级客服专员</div>
+                </div>
               </div>
             </Dropdown>
           </Space>

Touchkebao/src/pages/pc/ckbox/weChat/main.ts

@@ -6,11 +6,12 @@ import {
   asyncCountLables,
   useCkChatStore,
   updateIsLoadWeChat,
+  getIsLoadWeChat,
 } from "@/store/module/ckchat/ckchat";
 import { useWebSocketStore } from "@/store/module/websocket/websocket";
 import { useUserStore } from "@/store/module/user";
 import { weChatGroupService, contractService } from "@/utils/db";
-const isLoadWeChat = useCkChatStore.getState().isLoadWeChat;
+
 import {
   loginWithToken,
   getControlTerminalList,
@@ -32,7 +33,8 @@ export const chatInitAPIdata = async () => {
   try {
     let contractList = [];
     let groupList = [];
-    if (isLoadWeChat) {
+
+    if (getIsLoadWeChat()) {
       //获取联系人列表
       contractList = await contractService.findAll();
       //获取群列表

Touchkebao/src/store/module/ckchat/ckchat.data.ts

@@ -35,6 +35,7 @@ export interface CkChatState {
   isLoggedIn: boolean;
   searchKeyword: string;
   isLoadWeChat: boolean;
+  getIsLoadWeChat: () => boolean;
   updateIsLoadWeChat: (isLoadWeChat: boolean) => void;
   contractList: ContractData[];
   chatSessions: any[];

Touchkebao/src/store/module/ckchat/ckchat.ts

@@ -25,7 +25,11 @@ export const useCkChatStore = createPersistStore<CkChatState>(
     kfSelected: 0, //选中的客服
     searchKeyword: "", //搜索关键词
     isLoadWeChat: false, //是否加载微信
+    getIsLoadWeChat: () => {
+      return useCkChatStore.getState().isLoadWeChat;
+    },
     updateIsLoadWeChat: (isLoadWeChat: boolean) => {
+      console.log("updateIsLoadWeChat", isLoadWeChat);
       set({ isLoadWeChat });
     },
     //客服列表
@@ -549,3 +553,5 @@ export const pinChatSessionToTop = (sessionId: number) =>
 useCkChatStore.getState().getKfSelectedUser();
 export const updateIsLoadWeChat = (isLoadWeChat: boolean) =>
   useCkChatStore.getState().updateIsLoadWeChat(isLoadWeChat);
+export const getIsLoadWeChat = () =>
+  useCkChatStore.getState().getIsLoadWeChat();