wx44wx/AI-VideoAssistant
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use pop window to add tool

Browse Source
This commit is contained in:
Xin Wang
2026-02-11 12:07:55 +08:00
parent 02d12ea996
commit e7605f661b
1 changed files with 63 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

126
web/pages/Assistants.tsx
View File

@@ -754,7 +754,7 @@ export const AssistantsPage: React.FC = () => {
</h3>
<button
type="button"
onClick={() => setToolPickerOpen((v) => !v)}
onClick={() => setToolPickerOpen(true)}
className="h-7 w-7 rounded-full border border-white/15 bg-white/5 text-muted-foreground hover:text-white hover:border-primary/50 hover:bg-primary/10 flex items-center justify-center transition-colors"
title="添加工具"
>
@@ -836,68 +836,6 @@ export const AssistantsPage: React.FC = () => {
</div>
</div>
{toolPickerOpen && (
<div className="space-y-6 p-4 rounded-xl border border-white/10 bg-black/20">
<div className="flex items-center justify-between">
<h4 className="text-[10px] font-black uppercase tracking-[0.2em] text-muted-foreground">添加工具</h4>
<button
type="button"
onClick={() => setToolPickerOpen(false)}
className="h-6 w-6 rounded-full border border-white/10 bg-white/5 text-muted-foreground hover:text-white hover:border-white/30 flex items-center justify-center"
>
<X className="w-3 h-3" />
</button>
</div>
<div className="space-y-3">
<h5 className="text-[10px] font-black flex items-center text-primary uppercase tracking-[0.2em]">
<Wrench className="w-3.5 h-3.5 mr-2" /> 系统指令可选
</h5>
<div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
{availableSystemTools.map((tool) => (
<button
key={tool.id}
type="button"
onClick={() => toggleTool(tool.id)}
className="text-left p-3 rounded-lg border border-white/10 bg-white/5 hover:bg-primary/10 hover:border-primary/40 transition-colors"
>
<div className="flex items-center gap-2">
<div className="p-1.5 rounded-md bg-white/10 text-primary">{renderToolIcon(tool.icon)}</div>
<div className="text-sm font-bold text-white">{tool.name}</div>
</div>
<p className="text-[10px] text-muted-foreground mt-1 line-clamp-1">{tool.description}</p>
</button>
))}
{availableSystemTools.length === 0 && (
<div className="col-span-full text-xs text-muted-foreground">没有可添加的系统指令工具</div>
)}
</div>
</div>
<div className="space-y-3">
<h5 className="text-[10px] font-black flex items-center text-blue-400 uppercase tracking-[0.2em]">
<TrendingUp className="w-3.5 h-3.5 mr-2" /> 信息查询可选
</h5>
<div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
{availableQueryTools.map((tool) => (
<button
key={tool.id}
type="button"
onClick={() => toggleTool(tool.id)}
className="text-left p-3 rounded-lg border border-white/10 bg-white/5 hover:bg-blue-500/10 hover:border-blue-500/40 transition-colors"
>
<div className="flex items-center gap-2">
<div className="p-1.5 rounded-md bg-white/10 text-blue-300">{renderToolIcon(tool.icon)}</div>
<div className="text-sm font-bold text-white">{tool.name}</div>
</div>
<p className="text-[10px] text-muted-foreground mt-1 line-clamp-1">{tool.description}</p>
</button>
))}
{availableQueryTools.length === 0 && (
<div className="col-span-full text-xs text-muted-foreground">没有可添加的信息查询工具</div>
)}
</div>
</div>
</div>
)}
<div className="p-4 bg-white/5 border border-white/5 rounded-xl text-[10px] text-muted-foreground flex items-center gap-3">
<Rocket className="w-4 h-4 text-primary shrink-0" />
<span>提示：此处仅导入工具库中的已有工具。移除仅对当前小助手生效，不会删除工具库。</span>
@@ -1009,6 +947,68 @@ export const AssistantsPage: React.FC = () => {
</div>
</Dialog>
{/* Tool Picker Modal */}
<Dialog
isOpen={toolPickerOpen}
onClose={() => setToolPickerOpen(false)}
title="添加工具"
>
<div className="space-y-6">
<div className="space-y-3">
<h5 className="text-[10px] font-black flex items-center text-primary uppercase tracking-[0.2em]">
<Wrench className="w-3.5 h-3.5 mr-2" /> 系统指令可选
</h5>
<div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
{availableSystemTools.map((tool) => (
<button
key={tool.id}
type="button"
onClick={() => toggleTool(tool.id)}
className="text-left p-3 rounded-lg border border-white/10 bg-white/5 hover:bg-primary/10 hover:border-primary/40 transition-colors"
>
<div className="flex items-center gap-2">
<div className="p-1.5 rounded-md bg-white/10 text-primary">{renderToolIcon(tool.icon)}</div>
<div className="text-sm font-bold text-white">{tool.name}</div>
</div>
<p className="text-[10px] text-muted-foreground mt-1 line-clamp-1">{tool.description}</p>
</button>
))}
{availableSystemTools.length === 0 && (
<div className="col-span-full p-3 rounded-lg border border-dashed border-white/10 text-xs text-muted-foreground">
没有可添加的系统指令工具
</div>
)}
</div>
</div>
<div className="space-y-3">
<h5 className="text-[10px] font-black flex items-center text-blue-400 uppercase tracking-[0.2em]">
<TrendingUp className="w-3.5 h-3.5 mr-2" /> 信息查询可选
</h5>
<div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
{availableQueryTools.map((tool) => (
<button
key={tool.id}
type="button"
onClick={() => toggleTool(tool.id)}
className="text-left p-3 rounded-lg border border-white/10 bg-white/5 hover:bg-blue-500/10 hover:border-blue-500/40 transition-colors"
>
<div className="flex items-center gap-2">
<div className="p-1.5 rounded-md bg-white/10 text-blue-300">{renderToolIcon(tool.icon)}</div>
<div className="text-sm font-bold text-white">{tool.name}</div>
</div>
<p className="text-[10px] text-muted-foreground mt-1 line-clamp-1">{tool.description}</p>
</button>
))}
{availableQueryTools.length === 0 && (
<div className="col-span-full p-3 rounded-lg border border-dashed border-white/10 text-xs text-muted-foreground">
没有可添加的信息查询工具
</div>
)}
</div>
</div>
</div>
</Dialog>
{selectedAssistant && (
<DebugDrawer
isOpen={debugOpen}