From c4ba459b20c92409ad0ea67f4cbd34f604dff91e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B6=85=E7=BA=A7=E8=80=81=E7=99=BD=E5=85=94?=
 <fsmecx@gmail.com>
Date: Fri, 5 Sep 2025 17:04:34 +0800
Subject: [PATCH] =?UTF-8?q?refactor(ckbox):=20=E7=A7=BB=E9=99=A4=E5=85=A8?=
 =?UTF-8?q?=E5=B1=80profile=E7=8A=B6=E6=80=81=E5=B9=B6=E7=A7=BB=E8=87=B3Ch?=
 =?UTF-8?q?atWindow=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

将profile显示状态从父组件移至ChatWindow组件内部管理，简化组件间通信
---
 .../pc/ckbox/components/ChatWindow/index.tsx  | 24 ++++++++++++-------
 Cunkebao/src/pages/pc/ckbox/index.tsx         | 11 +++------
 2 files changed, 19 insertions(+), 16 deletions(-)

diff --git a/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/index.tsx b/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/index.tsx
index 11f817f4..9019a963 100644
--- a/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/index.tsx
+++ b/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/index.tsx
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useState } from "react";
 import { Layout, Button, Avatar, Space, Dropdown, Menu, Tooltip } from "antd";
 import {
   PhoneOutlined,
@@ -6,6 +6,7 @@ import {
   MoreOutlined,
   UserOutlined,
   TeamOutlined,
+  InfoCircleOutlined,
 } from "@ant-design/icons";
 import { ContractData, weChatGroup } from "@/pages/pc/ckbox/data";
 import styles from "./ChatWindow.module.scss";
@@ -18,15 +19,13 @@ const { Header, Content } = Layout;
 
 interface ChatWindowProps {
   contract: ContractData | weChatGroup;
-  showProfile?: boolean;
-  onToggleProfile?: () => void;
 }
 
-const ChatWindow: React.FC<ChatWindowProps> = ({
-  contract,
-  showProfile = true,
-  onToggleProfile,
-}) => {
+const ChatWindow: React.FC<ChatWindowProps> = ({ contract }) => {
+  const [showProfile, setShowProfile] = useState(true);
+  const onToggleProfile = () => {
+    setShowProfile(!showProfile);
+  };
   const chatMenu = (
     <Menu>
       <Menu.Item key="profile" icon={<UserOutlined />}>
@@ -76,6 +75,7 @@ const ChatWindow: React.FC<ChatWindowProps> = ({
                 className={styles.headerButton}
               />
             </Tooltip>
+
             <Tooltip title="视频通话">
               <Button
                 type="text"
@@ -83,6 +83,14 @@ const ChatWindow: React.FC<ChatWindowProps> = ({
                 className={styles.headerButton}
               />
             </Tooltip>
+            <Tooltip title="个人资料">
+              <Button
+                onClick={onToggleProfile}
+                type="text"
+                icon={<InfoCircleOutlined />}
+                className={styles.headerButton}
+              />
+            </Tooltip>
             <Dropdown overlay={chatMenu} trigger={["click"]}>
               <Button
                 type="text"
diff --git a/Cunkebao/src/pages/pc/ckbox/index.tsx b/Cunkebao/src/pages/pc/ckbox/index.tsx
index 5ed67f15..2129769c 100644
--- a/Cunkebao/src/pages/pc/ckbox/index.tsx
+++ b/Cunkebao/src/pages/pc/ckbox/index.tsx
@@ -18,7 +18,6 @@ import { KfUserListData } from "@/pages/pc/ckbox/data";
 const CkboxPage: React.FC = () => {
   // 不要在组件初始化时获取sendCommand，而是在需要时动态获取
   const [loading, setLoading] = useState(false);
-  const [showProfile, setShowProfile] = useState(true);
   const currentContract = useWeChatStore(state => state.currentContract);
   useEffect(() => {
     // 方法一：使用 Promise 链式调用处理异步函数
@@ -72,7 +71,7 @@ const CkboxPage: React.FC = () => {
           <Content className={styles.mainContent}>
             {currentContract ? (
               <div className={styles.chatContainer}>
-                <div className={styles.chatToolbar}>
+                {/* <div className={styles.chatToolbar}>
                   <Space>
                     <Tooltip title={showProfile ? "隐藏资料" : "显示资料"}>
                       <Button
@@ -85,12 +84,8 @@ const CkboxPage: React.FC = () => {
                       </Button>
                     </Tooltip>
                   </Space>
-                </div>
-                <ChatWindow
-                  contract={currentContract}
-                  showProfile={showProfile}
-                  onToggleProfile={() => setShowProfile(!showProfile)}
-                />
+                </div> */}
+                <ChatWindow contract={currentContract} />
               </div>
             ) : (
               <div className={styles.welcomeScreen}>