From 901bc13526c90a9d2f20dbccdedfaaaac3ef78d8 Mon Sep 17 00:00:00 2001 From: zhaoweijie Date: Mon, 25 Aug 2025 20:43:27 +0800 Subject: [PATCH] =?UTF-8?q?refactor(layout):=20=E9=87=8D=E6=9E=84=E5=B8=83?= =?UTF-8?q?=E5=B1=80=E7=BB=84=E4=BB=B6=E5=B9=B6=E6=B7=BB=E5=8A=A0=E8=A7=86?= =?UTF-8?q?=E9=A2=91=E6=92=AD=E6=94=BE=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit -重写 Header 组件，使用新的 OptionLayoutContext 替代 HistoryContext - 新增 VideoPlayer 组件，用于播放视频 - 更新 Playground 组件，集成新的侧边栏和视频播放功能 - 重构 Layout 组件，支持新的选项布局 - 更新相关路由和导出导入逻辑，以支持上述更改 --- .../Common/Playground/IodRelevant.tsx | 23 +++++++++++++++---- .../Option/Playground/PlaygroundIod.tsx | 3 ++- src/components/Option/Sidebar.tsx | 4 ++++ src/components/Option/VideoPlayer/index.tsx | 6 ++--- 4 files changed, 27 insertions(+), 9 deletions(-) diff --git a/src/components/Common/Playground/IodRelevant.tsx b/src/components/Common/Playground/IodRelevant.tsx index 476f302..67f78e8 100644 --- a/src/components/Common/Playground/IodRelevant.tsx +++ b/src/components/Common/Playground/IodRelevant.tsx @@ -1,4 +1,4 @@ -import React, { useMemo } from "react" +import React, { useEffect, useMemo, useState } from "react" import { Avatar, Card } from "antd" import { AnimatePresence, motion } from "framer-motion" // 使用 CSS-in-JS 方式 import styled, { keyframes } from "styled-components" @@ -11,6 +11,7 @@ import { TechCompanyIcon } from "@/components/Icons/TechCompany.tsx" import { ResearchInstitutesIcon } from "@/components/Icons/ResearchInstitutes.tsx" import { NSDCIcon } from "@/components/Icons/NSDC.tsx" import { useIodPlaygroundContext } from "@/components/Option/Playground/PlaygroundIod.tsx" +import { totalSearchResults } from "@/services/search.ts" const rotate = keyframes` 0% { @@ -230,6 +231,18 @@ export const PlaygroundIodRelevant: React.FC = ({ className }) => { return currentIodMessage && !iodLoading }, [currentIodMessage, iodLoading]) + const [count, setCount] = useState(0) + + useEffect(() => { + totalSearchResults().then((res) => { + setCount(res) + }) + }, []) + + const getMinNum = (n1: number) => { + return Math.min(n1, count) + } + const data = useMemo(() => { const loading = iodSearch && iodLoading const text = loading ? "正" : "已" @@ -275,7 +288,7 @@ export const PlaygroundIodRelevant: React.FC = ({ className }) => { /> 个{" "} - 数据集，引用 3个 数据集作为参考 + 数据集，引用 {getMinNum(currentIodMessage?.data.total ?? 0)}个 数据集作为参考

) : ( "" @@ -314,7 +327,7 @@ export const PlaygroundIodRelevant: React.FC = ({ className }) => { /> 个{" "} - 场景，引用 3个 场景作为参考 + 场景，引用 {getMinNum(currentIodMessage?.scenario.total ?? 0)}个 场景作为参考

) : ( "" @@ -358,14 +371,14 @@ export const PlaygroundIodRelevant: React.FC = ({ className }) => { /> 个{" "} - 组织，引用 3个 组织作为参考 + 组织，引用 {getMinNum(currentIodMessage?.organization.total ?? 0)}个 组织作为参考

) : ( "" ) } ] - }, [showSearchData, iodLoading]) + }, [showSearchData, iodLoading, count]) return ( = ({ if (iodLoading || !messages.length) { return undefined } - + console.log(messages) + console.log(currentMessageId) // 如果不存在currentMessageId默认返回最后一个message if (!currentMessageId) { const lastMessage = messages.at(-1) diff --git a/src/components/Option/Sidebar.tsx b/src/components/Option/Sidebar.tsx index cd3f283..d2cb7a6 100644 --- a/src/components/Option/Sidebar.tsx +++ b/src/components/Option/Sidebar.tsx @@ -24,6 +24,7 @@ import { getLastUsedChatSystemPrompt, lastUsedChatModelEnabled } from "@/services/model-settings" +import { useMessageOption } from "@/hooks/useMessageOption.tsx" type Props = { onClose: () => void @@ -57,6 +58,8 @@ export const Sidebar = ({ const client = useQueryClient() const navigate = useNavigate() + const { setCurrentMessageId } = useMessageOption() + const { data: chatHistories, status } = useQuery({ queryKey: ["fetchChatHistory"], queryFn: async () => { @@ -146,6 +149,7 @@ export const Sidebar = ({ const db = new PageAssitDatabase() const history = await db.getChatHistory(chat.id) setHistoryId(chat.id) + setCurrentMessageId() setHistory(formatToChatHistory(history)) setMessages(formatToMessage(history)) stopStreamingRequest() diff --git a/src/components/Option/VideoPlayer/index.tsx b/src/components/Option/VideoPlayer/index.tsx index 1c38714..4fa6a93 100644 --- a/src/components/Option/VideoPlayer/index.tsx +++ b/src/components/Option/VideoPlayer/index.tsx @@ -120,7 +120,7 @@ const VideoPlayer = () => { const containerHeight = container.offsetHeight const mouseY = e.clientY - container.getBoundingClientRect().top - + console.log(mouseY > containerHeight - 150) // 如果鼠标在底部150px区域内 if (mouseY > containerHeight - 150) { // 清除之前的隐藏定时器 @@ -321,7 +321,7 @@ const VideoPlayer = () => { onMouseLeave={handleMouseLeave}>