Commit 12e28b73 by Liu

fix:工具按钮使用数据渲染

parent 55979b51
......@@ -13,7 +13,7 @@ export function fetchQuestionList(data: any) {
* @params
*/
export function fetchToolList() {
return http.post('/config-center/api/tool/mobile/v1/get_tool_list')
return http.post('/config-center/api/tool/mobile/v1/get_tool_list', { toolType: '03' })
}
/**
......
......@@ -8,9 +8,6 @@ import SendIcon from '@/assets/svg/send.svg?react'
import { type WithAuthProps, withAuth } from '@/auth/withAuth'
import { useAppSelector } from '@/store/hook'
import { fetchToolList } from '@/api/home'
import dataIcon from '@/assets/data-icon.png'
import efficiencyIcon from '@/assets/efficiency-icon.png'
import generalIcon from '@/assets/general-icon.png'
interface ChatEditorProps {
onChange?: (value: string) => void
......@@ -39,7 +36,11 @@ const ChatEditorBase: React.FC<ChatEditorProps & WithAuthProps> = ({ checkAuth,
try {
const res = await fetchToolList()
if (res?.data) {
setToolList(res.data)
// 根据 toolId 去重,防止重复渲染
const uniqueList = res.data.filter((tool: any, index: number, self: any[]) =>
index === self.findIndex((t: any) => t.toolId === tool.toolId),
)
setToolList(uniqueList)
}
}
catch (error) {
......@@ -117,28 +118,6 @@ const ChatEditorBase: React.FC<ChatEditorProps & WithAuthProps> = ({ checkAuth,
document.execCommand('insertText', false, text)
}
// 处理提质增效按钮点击
const handleEfficiencyClick = () => {
// 查找"提质增效"工具
const efficiencyTool = toolList.find((tool: any) => tool.toolName === '提质增效')
let currentToolId = null
if (efficiencyTool) {
setSelectedToolId(efficiencyTool.toolId)
currentToolId = efficiencyTool.toolId
}
else {
// 如果没有找到"提质增效"工具,使用第一个工具
if (toolList.length > 0) {
setSelectedToolId(toolList[0].toolId)
currentToolId = toolList[0].toolId
}
}
// 切换到工具模式(false 表示工具模式,会切换左侧展示)
setIsToolBtnActive(false)
// 调用父组件的回调函数,传递工具模式状态和工具ID,以及是否需要改变样式
onToolClick?.(false, currentToolId, true)
}
// 处理通用模式按钮点击
const handleGeneralClick = () => {
// 切换到通用模式(true 表示通用模式,恢复默认不切换左侧)
......@@ -149,6 +128,13 @@ const ChatEditorBase: React.FC<ChatEditorProps & WithAuthProps> = ({ checkAuth,
onToolClick?.(true, undefined, false)
}
// 处理工具按钮点击
const handleToolClick = (tool: any) => {
setSelectedToolId(tool.toolId)
setIsToolBtnActive(false)
onToolClick?.(false, tool.toolId, true)
}
useEffect(() => {
startAnimation()
document.addEventListener('visibilitychange', handleVisibilityChange)
......@@ -253,40 +239,32 @@ const ChatEditorBase: React.FC<ChatEditorProps & WithAuthProps> = ({ checkAuth,
</div>
{toolList && toolList.length > 0 && (
<div className="absolute left-4 bottom-2 flex items-center gap-3 pointer-events-auto pl-[16px]">
<Button
className="w-[96px] h-[32px] px-3 rounded-full bg-white border border-[#E6E8EB] shadow-none text-[#111827] text-[12px]"
radius="full"
variant="bordered"
startContent={<img src={dataIcon} alt="数据助手" className="w-5 h-5" />}
>
数据助手
</Button>
<Button
className={`w-[96px] h-[32px] px-3 rounded-full shadow-none text-[12px] transition-all duration-200 ${
!isToolBtnActive
? 'bg-[#F3F7FF] border-[#F3F7FF] text-[#165DFF]'
: 'bg-white border border-[#E6E8EB] text-[#111827]'
}`}
radius="full"
variant="bordered"
startContent={<img src={efficiencyIcon} alt="提质增效" className="w-5 h-5" />}
onPress={handleEfficiencyClick}
>
提质增效
</Button>
<Button
className={`w-[96px] h-[32px] px-3 rounded-full shadow-none text-[12px] transition-all duration-200 ${
isToolBtnActive
? 'bg-[#F3F7FF] border-[#F3F7FF] text-[#165DFF]'
: 'bg-white border border-[#E6E8EB] text-[#111827]'
}`}
radius="full"
variant="bordered"
startContent={<img src={generalIcon} alt="通用模式" className="w-5 h-5" />}
onPress={handleGeneralClick}
>
通用模式
</Button>
{toolList.map((tool: any, index: number) => {
// index === 2 的按钮(通用模式)在默认状态下高亮
const isSelected = (selectedToolId === tool.toolId && !isToolBtnActive) || (index === 2 && isToolBtnActive)
return (
<Button
key={tool.toolId || `tool-${index}`}
className={`w-auto h-[32px] px-3 rounded-full shadow-none text-[12px] flex items-center gap-2 transition-all duration-200 ${
isSelected
? 'bg-[#F3F7FF] border-[#F3F7FF] text-[#165DFF]'
: 'bg-white border border-[#E6E8EB] text-[#111827]'
}`}
radius="full"
variant="bordered"
onPress={() => index === 2 ? handleGeneralClick() : handleToolClick(tool)}
>
{tool.toolIcon && (
<img
src={tool.toolIcon}
alt={tool.toolName}
className="w-4 h-4 flex-shrink-0"
/>
)}
{tool.toolName}
</Button>
)
})}
</div>
)}
<LoginModal onClose={handleCloseLoginModal} isOpen={isOpenLoginModal} />
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment