fix：通过工具控制左侧问题展示

src/components/ChatEditor/index.tsx

@@ -14,12 +14,13 @@ interface ChatEditorProps {
   onChange?: (value: string) => void
   onFocus?: () => void
   onSubmit?: (value: string, toolId?: string) => void
+  onToolClick?: (isToolBtn: boolean) => void
   placeholders: string[]
   showContentTips?: boolean
   initialValue?: string
 }
 
-const ChatEditorBase: React.FC<ChatEditorProps & WithAuthProps> = ({ checkAuth, onChange, onFocus, onSubmit, placeholders, showContentTips = false, initialValue = '' }) => {
+const ChatEditorBase: React.FC<ChatEditorProps & WithAuthProps> = ({ checkAuth, onChange, onFocus, onSubmit, onToolClick, placeholders, showContentTips = false, initialValue = '' }) => {
   // const dispatch = useAppDispatch()
   const [content, setContent] = useState(initialValue)
   const editorRef = useRef<HTMLDivElement>(null)
@@ -29,6 +30,7 @@ const ChatEditorBase: React.FC<ChatEditorProps & WithAuthProps> = ({ checkAuth,
   const isAsking = useAppSelector((state: RootState) => state.chat.isAsking)
   const [toolList, setToolList] = useState<any[]>([])
   const [selectedToolId, setSelectedToolId] = useState<string | null>(null)
+  const [isToolBtnActive, setIsToolBtnActive] = useState<boolean>(false)
 
   // 获取工具列表
   const getToolList = async () => {
@@ -122,6 +124,14 @@ const ChatEditorBase: React.FC<ChatEditorProps & WithAuthProps> = ({ checkAuth,
         setSelectedToolId(toolList[0].toolId)
       }
     }
+    // 切换工具按钮状态
+    const newToolBtnState = !isToolBtnActive
+    setIsToolBtnActive(newToolBtnState)
+    // 打印传递的参数 isToolBtn
+    // eslint-disable-next-line no-console
+    console.log('ChatEditor 组件接收到 isToolBtn 参数:', newToolBtnState)
+    // 调用父组件的回调函数，传递切换后的状态
+    onToolClick?.(newToolBtnState)
   }
 
   useEffect(() => {

src/pages/Chat/Chat.tsx

@@ -331,8 +331,16 @@ export const Chat: React.FC = () => {
               </Button>
             </motion.div>
           </div>
-
-          <ChatEditor onSubmit={(question, toolId) => handleSubmitQuestion(question, undefined, toolId)} placeholders={[]} />
+          <ChatEditor
+            onSubmit={(question, toolId) => handleSubmitQuestion(question, undefined, toolId)}
+            onToolClick={(isToolBtn) => {
+            // 发送自定义事件到父组件
+            window.dispatchEvent(new CustomEvent('toolButtonClick', {
+              detail: { isToolBtn },
+            }))
+          }}
+            placeholders={[]}
+          />
           <div className="hidden sm:block w-full text-center mt-[12px] text-[#3333334d] text-[12px]">
             内容由AI模型生成，其准确性和完整性无法保证，仅供参考
           </div>

src/pages/Home/HomeNew.tsx

@@ -5,6 +5,7 @@ import { Outlet, useLocation } from 'react-router-dom'
 import { useLocalStorageState } from 'ahooks'
 import styles from './Home.module.less'
 import { QuestionList } from './components/QuestionList'
+import HomeIcon1 from '@/assets/homeIcon1.png'
 import HomeIcon2 from '@/assets/homeIcon2.png'
 import SmartIce from '@/assets/smart-ice.png'
 import { createConversation, fetchConversations } from '@/store/conversationSlice'
@@ -46,8 +47,9 @@ export const Home: React.FC = () => {
   const location = useLocation()
   const hasFetched = useRef(false)
   // 使用 useState
-  const [_productQuestions, setProductQuestions] = useState<any>({ content: [] })
+  const [productQuestions, setProductQuestions] = useState<any>({ content: [] })
   const [otherQuestions, setOtherQuestions] = useState<any>({ content: [] })
+  const [isToolBtnActive, setIsToolBtnActive] = useState<boolean>(false)
 
   const [token, setToken] = useLocalStorageState<string | undefined>('__TOKEN__', {
     defaultValue: '',
@@ -103,6 +105,37 @@ export const Home: React.FC = () => {
     }
   }
 
+  // 处理工具按钮点击
+  const _handleToolClick = useCallback((isToolBtn: boolean) => {
+    // eslint-disable-next-line no-console
+    console.log('HomeNew.tsx 接收到 isToolBtn 参数:', isToolBtn)
+  }, [])
+
+  // 监听工具按钮点击事件
+  useEffect(() => {
+    const handleToolClickEvent = (event: CustomEvent) => {
+      const { isToolBtn } = event.detail
+      // eslint-disable-next-line no-console
+      console.log('HomeNew.tsx 接收到 isToolBtn 参数:', isToolBtn)
+      setIsToolBtnActive(isToolBtn)
+    }
+
+    window.addEventListener('toolButtonClick', handleToolClickEvent as EventListener)
+
+    return () => {
+      window.removeEventListener('toolButtonClick', handleToolClickEvent as EventListener)
+    }
+  }, [])
+
+  // 处理创建对话
+  const _handleCreateConversation = useCallback((question: string) => {
+    dispatch(createConversation({
+      conversationData: {},
+      shouldNavigate: true,
+      shouldSendQuestion: question,
+    }))
+  }, [dispatch])
+
   const login = useCallback(async () => {
     // 防止重复调用
     if (hasFetched.current) {
@@ -190,15 +223,18 @@ export const Home: React.FC = () => {
                     className="flex flex-col gap-[20px] items-center overflow-y-auto scrollbar-hide"
                     style={{ height: 'calc(100vh - 64px)', background: 'linear-gradient(180deg, #F0F8FF 0%, #FFFFFF 50%, #FFFFFF 100%)', borderRadius: '24px' }}
                   >
-                  {/* <motion.div className="w-full sm:w-auto" {...getAnimationProps(2)}>
+                {!isToolBtnActive && (
+                  <motion.div className="w-full sm:w-auto" {...getAnimationProps(2)}>
                     <QuestionList
                       questions={productQuestions.content}
                       dotColor="#D4CCFF"
                       background="linear-gradient(180deg, #EBE6FF 0%, #FFFFFF 50%, #FFFFFF 100%)"
                       title={productQuestions.configName}
                       iconImg={HomeIcon1}
+                      isToolBtn={isToolBtnActive}
                     />
-                  </motion.div> */}
+                  </motion.div>
+                )}
                   <motion.div className="w-full sm:w-auto" {...getAnimationProps(3)}>
                     <QuestionList
                       questions={otherQuestions.content}
@@ -207,11 +243,14 @@ export const Home: React.FC = () => {
                       height="388px"
                       title={otherQuestions.configName}
                       iconImg={HomeIcon2}
+                      isToolBtn={isToolBtnActive}
                     />
                   </motion.div>
-                  <div>
-                    <img src={SmartIce} alt="Smart Ice" className="w-[260px] h-[330px] object-contain" />
-                  </div>
+                  {isToolBtnActive && (
+                    <div>
+                      <img src={SmartIce} alt="Smart Ice" className="w-[260px] h-[330px] object-contain" />
+                    </div>
+                  )}
                   </div>
                 {/* 右侧区域 */}
                 <div className="hidden sm:flex flex-1 h-full">
@@ -231,6 +270,7 @@ export const Home: React.FC = () => {
                               <ChatEditor
                                 showContentTips
                                 onSubmit={handleCreateConversation}
+                                onToolClick={handleToolClick}
                                 placeholders={RECOMMEND_QUESTIONS_OTHER}
                               />
                               <div className="hidden sm:block w-full text-center mt-[12px] text-[#3333334d] text-[12px]">

src/pages/Home/components/QuestionList/QuestionList.tsx

@@ -17,6 +17,7 @@ interface QuestionListProps {
   displayCount?: number
   background: string
   height?: string
+  isToolBtn?: boolean
 }
 const containerVariants = {
   hidden: {},
@@ -61,17 +62,21 @@ const QuestionListBase: React.FC<QuestionListProps & WithAuthProps> = ({
   title,
   iconImg,
   showRefresh = true,
-  displayCount = 8,
+  displayCount: _displayCount = 8,
+  isToolBtn = false,
 }) => {
   const [isRotating, setIsRotating] = useState(false)
   const [displayedItems, setDisplayedItems] = useState<string[]>([])
   const [isClicking, setIsClicking] = useState(false)
   const dispatch = useAppDispatch()
 
+  // 根据 isToolBtn 动态设置 displayCount
+  const actualDisplayCount = isToolBtn ? 8 : 4
+
   const updateDisplayedItems = useCallback(() => {
-    const indices = getRandomIndices(questions.length, Math.min(displayCount, questions.length))
+    const indices = getRandomIndices(questions.length, Math.min(actualDisplayCount, questions.length))
     setDisplayedItems(indices.map(index => questions[index]))
-  }, [questions, displayCount])
+  }, [questions, actualDisplayCount])
 
   const handleRefresh = () => {
     setIsRotating(true)