diff --git a/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/ChatRecordSearch/index.module.scss b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/ChatRecordSearch/index.module.scss new file mode 100644 index 00000000..09eaa69c --- /dev/null +++ b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/ChatRecordSearch/index.module.scss @@ -0,0 +1,27 @@ +.chatRecordSearch { + flex: 1; + display: flex; + justify-content: space-between; + .searchContentContainer { + display: flex; + align-items: center; + gap: 10px; + font-size: 12px; + .timeRange { + display: flex; + align-items: center; + gap: 10px; + .timeRangeTitle { + width: 80px; + } + } + .searchContent { + display: flex; + align-items: center; + gap: 10px; + .searchContentTitle { + width: 100px; + } + } + } +} diff --git a/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/ChatRecordSearch/index.tsx b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/ChatRecordSearch/index.tsx new file mode 100644 index 00000000..9bb04d51 --- /dev/null +++ b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/ChatRecordSearch/index.tsx @@ -0,0 +1,86 @@ +import React, { useState } from "react"; +import { Button, Input, DatePicker, message } from "antd"; +import dayjs from "dayjs"; +import { CloseOutlined } from "@ant-design/icons"; +import { useWeChatStore } from "@/store/module/weChat/weChat"; +import styles from "./index.module.scss"; +const { RangePicker } = DatePicker; + +const ChatRecordSearch: React.FC = () => { + const [searchContent, setSearchContent] = useState(""); + const [dateRange, setDateRange] = useState<[dayjs.Dayjs, dayjs.Dayjs] | null>( + null, + ); + const [loading, setLoading] = useState(false); + const SearchMessage = useWeChatStore(state => state.SearchMessage); + const updateShowChatRecordModel = useWeChatStore( + state => state.updateShowChatRecordModel, + ); + // 执行查找 + const handleSearch = async () => { + if (!dateRange) { + message.warning("请选择时间范围"); + return; + } + + try { + setLoading(true); + const [From, To] = dateRange; + const searchData = { + From: From.unix() * 1000, + To: To.unix() * 1000, + keyword: searchContent.trim(), + }; + await SearchMessage(searchData); + message.success("查找完成"); + } catch (error) { + console.error("查找失败:", error); + message.error("查找失败,请重试"); + } finally { + setLoading(false); + } + }; + + const handleCancel = () => { + setSearchContent(""); + setDateRange(null); + setLoading(false); + handleSearch(); + updateShowChatRecordModel(false); + }; + + return ( +
+
+ {/* 时间范围选择 */} +
+
时间范围
+ +
+ + {/* 查找内容输入 */} +
+
查找内容
+ setSearchContent(e.target.value)} + disabled={loading} + /> + +
+
+ +
+ ); +}; + +export default ChatRecordSearch; diff --git a/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/components/chatRecord/index.tsx b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/components/chatRecord/index.tsx deleted file mode 100644 index 3068e42d..00000000 --- a/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/components/chatRecord/index.tsx +++ /dev/null @@ -1,150 +0,0 @@ -import React, { useState } from "react"; -import { Button, Modal, Input, DatePicker, message } from "antd"; -import { MessageOutlined } from "@ant-design/icons"; -import dayjs from "dayjs"; -import { useWeChatStore } from "@/store/module/weChat/weChat"; - -const { RangePicker } = DatePicker; - -interface ChatRecordProps { - className?: string; - disabled?: boolean; -} - -const ChatRecord: React.FC = ({ - className, - disabled = false, -}) => { - const [visible, setVisible] = useState(false); - const [searchContent, setSearchContent] = useState(""); - const [dateRange, setDateRange] = useState<[dayjs.Dayjs, dayjs.Dayjs] | null>( - null, - ); - const [loading, setLoading] = useState(false); - const SearchMessage = useWeChatStore(state => state.SearchMessage); - - // 打开弹窗 - const openModal = () => { - setVisible(true); - }; - - // 关闭弹窗并重置状态 - const closeModal = () => { - setVisible(false); - setSearchContent(""); - setDateRange(null); - setLoading(false); - }; - - // 执行查找 - const handleSearch = async () => { - if (!dateRange) { - message.warning("请选择时间范围"); - return; - } - - try { - setLoading(true); - const [From, To] = dateRange; - const searchData = { - From: From.unix() * 1000, - To: To.unix() * 1000, - keyword: searchContent.trim(), - }; - await SearchMessage(searchData); - - message.success("查找完成"); - closeModal(); - } catch (error) { - console.error("查找失败:", error); - message.error("查找失败,请重试"); - } finally { - setLoading(false); - } - }; - - return ( - <> -
- - 聊天记录 -
- - - - - , - ]} - > -
- {/* 时间范围选择 */} -
-
- 时间范围 -
- -
- - {/* 查找内容输入 */} -
-
- 查找内容 -
- setSearchContent(e.target.value)} - size="large" - maxLength={100} - showCount - disabled={loading} - /> -
-
-
- - ); -}; - -export default ChatRecord; diff --git a/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/index.tsx b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/index.tsx index cd6c9d29..16f6c179 100644 --- a/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/index.tsx +++ b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/index.tsx @@ -6,6 +6,7 @@ import { PictureOutlined, ExportOutlined, CloseOutlined, + MessageOutlined, } from "@ant-design/icons"; import { ContractData, weChatGroup } from "@/pages/pc/ckbox/data"; import { useWebSocketStore } from "@/store/module/websocket/websocket"; @@ -14,7 +15,6 @@ import { EmojiInfo } from "@/components/EmojiSeclection/wechatEmoji"; import SimpleFileUpload from "@/components/Upload/SimpleFileUpload"; import AudioRecorder from "@/components/Upload/AudioRecorder"; import ToContract from "./components/toContract"; -import ChatRecord from "./components/chatRecord"; import styles from "./MessageEnter.module.scss"; import { useWeChatStore } from "@/store/module/weChat/weChat"; const { Footer } = Layout; @@ -35,6 +35,12 @@ const MessageEnter: React.FC = ({ contract }) => { const updateTransmitModal = useWeChatStore( state => state.updateTransmitModal, ); + const showChatRecordModel = useWeChatStore( + state => state.showChatRecordModel, + ); + const updateShowChatRecordModel = useWeChatStore( + state => state.updateShowChatRecordModel, + ); const quoteMessageContent = useWeChatStore( state => state.quoteMessageContent, @@ -154,6 +160,9 @@ const MessageEnter: React.FC = ({ contract }) => { const handTurnRignt = () => { updateTransmitModal(true); }; + const openChatRecordModel = () => { + updateShowChatRecordModel(!showChatRecordModel); + }; return ( <> @@ -202,7 +211,17 @@ const MessageEnter: React.FC = ({ contract }) => {
- +
+ +  聊天记录 +
diff --git a/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/index.tsx b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/index.tsx index 9cf35e2d..9be82d10 100644 --- a/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/index.tsx +++ b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/index.tsx @@ -16,6 +16,7 @@ import MessageEnter from "./components/MessageEnter"; import MessageRecord from "./components/MessageRecord"; import FollowupReminderModal from "./components/FollowupReminderModal"; import TodoListModal from "./components/TodoListModal"; +import ChatRecordSearch from "./components/ChatRecordSearch"; import { setFriendInjectConfig } from "@/pages/pc/ckbox/weChat/api"; import { useWeChatStore } from "@/store/module/weChat/weChat"; const { Header, Content } = Layout; @@ -37,6 +38,9 @@ const ChatWindow: React.FC = ({ contract }) => { const aiQuoteMessageContent = useWeChatStore( state => state.aiQuoteMessageContent, ); + const showChatRecordModel = useWeChatStore( + state => state.showChatRecordModel, + ); const [showProfile, setShowProfile] = useState(true); const [followupModalVisible, setFollowupModalVisible] = useState(false); const [todoModalVisible, setTodoModalVisible] = useState(false); @@ -136,12 +140,18 @@ const ChatWindow: React.FC = ({ contract }) => {
- - + {showChatRecordModel ? ( + + ) : ( + <> + + + + )}
{/* 聊天内容 */} diff --git a/Touchkebao/src/store/module/weChat/weChat.data.ts b/Touchkebao/src/store/module/weChat/weChat.data.ts index 7a012775..29a1f2d6 100644 --- a/Touchkebao/src/store/module/weChat/weChat.data.ts +++ b/Touchkebao/src/store/module/weChat/weChat.data.ts @@ -10,6 +10,8 @@ import { * 包含聊天消息、联系人管理、朋友圈等功能的状态和方法 */ export interface WeChatState { + showChatRecordModel: boolean; + updateShowChatRecordModel: (show: boolean) => void; aiQuoteMessageContent: number; updateAiQuoteMessageContent: (message: number) => void; quoteMessageContent: string; diff --git a/Touchkebao/src/store/module/weChat/weChat.ts b/Touchkebao/src/store/module/weChat/weChat.ts index dadfd728..5290b5eb 100644 --- a/Touchkebao/src/store/module/weChat/weChat.ts +++ b/Touchkebao/src/store/module/weChat/weChat.ts @@ -33,6 +33,10 @@ import { export const useWeChatStore = create()( persist( (set, get) => ({ + showChatRecordModel: false, + updateShowChatRecordModel: (show: boolean) => { + set({ showChatRecordModel: show }); + }, //当前用户的ai接管状态 aiQuoteMessageContent: 0, updateAiQuoteMessageContent: (message: number) => { @@ -159,7 +163,8 @@ export const useWeChatStore = create()( } else { params.wechatChatroomId = contract.id; } - + //重置动作 + set({ showChatRecordModel: false }); clearUnreadCount1(params); clearUnreadCount2([contract.id]); getFriendInjectConfig({