- {active === "home" &&
}
- {active === "assistants" &&
}
+ {active === "home" &&
}
+
+ {active === "assistant-prompt" &&
}
+ {active === "assistant-workflow" &&
}
+
{active === "components" &&
}
{active === "history" &&
}
{active === "test" &&
}
diff --git a/src/components/layout/Sidebar.tsx b/src/components/layout/Sidebar.tsx
index 14412d6..d119746 100644
--- a/src/components/layout/Sidebar.tsx
+++ b/src/components/layout/Sidebar.tsx
@@ -5,6 +5,7 @@ import {
Boxes,
ChevronLeft,
Clock3,
+ FileText,
Home,
PlayCircle,
User,
@@ -13,20 +14,6 @@ import {
} from "lucide-react";
import type { NavKey } from "./AppShell";
-const navItems: Array<{
- key: NavKey;
- label: string;
- icon: React.ComponentType<{ size?: number }>;
-}> = [
- { key: "home", label: "控制台", icon: Home },
- { key: "assistants", label: "创建助手", icon: Bot },
- { key: "components", label: "组件库", icon: Boxes },
- { key: "history", label: "历史记录", icon: Clock3 },
- { key: "test", label: "测试助手", icon: PlayCircle },
- { key: "workflow", label: "工作流", icon: Workflow },
- { key: "profile", label: "个人中心", icon: User },
-];
-
type SidebarProps = {
active: NavKey;
collapsed: boolean;
@@ -34,12 +21,37 @@ type SidebarProps = {
onToggle: () => void;
};
+const mainItems: Array<{
+ key: NavKey;
+ label: string;
+ icon: React.ComponentType<{ size?: number }>;
+}> = [
+ { key: "home", label: "控制台", icon: Home },
+ { key: "components", label: "组件库", icon: Boxes },
+ { key: "history", label: "历史记录", icon: Clock3 },
+ { key: "test", label: "测试助手", icon: PlayCircle },
+ { key: "workflow", label: "工作流", icon: Workflow },
+ { key: "profile", label: "个人中心", icon: User },
+];
+
+const assistantSubItems: Array<{
+ key: NavKey;
+ label: string;
+ icon: React.ComponentType<{ size?: number }>;
+}> = [
+ { key: "assistant-prompt", label: "提示词模式", icon: FileText },
+ { key: "assistant-workflow", label: "工作流模式", icon: Workflow },
+];
+
export function Sidebar({
active,
collapsed,
onNavigate,
onToggle,
}: SidebarProps) {
+ const assistantActive =
+ active === "assistant-prompt" || active === "assistant-workflow";
+
return (
);
+}
+
+function NavButton({
+ active,
+ collapsed,
+ icon: Icon,
+ label,
+ onClick,
+}: {
+ active: boolean;
+ collapsed: boolean;
+ icon: React.ComponentType<{ size?: number }>;
+ label: string;
+ onClick: () => void;
+}) {
+ return (
+
+ );
+}
+
+function SubNavButton({
+ active,
+ collapsed,
+ icon: Icon,
+ label,
+ onClick,
+}: {
+ active: boolean;
+ collapsed: boolean;
+ icon: React.ComponentType<{ size?: number }>;
+ label: string;
+ onClick: () => void;
+}) {
+ return (
+
+ );
}
\ No newline at end of file
diff --git a/src/components/pages/AssistantPage.tsx b/src/components/pages/AssistantPage.tsx
index ab09ff8..38082ae 100644
--- a/src/components/pages/AssistantPage.tsx
+++ b/src/components/pages/AssistantPage.tsx
@@ -1,3 +1,397 @@
+"use client";
+
+import { useState } from "react";
+import {
+ Bot,
+ Brain,
+ Database,
+ Mic,
+ Rocket,
+ Save,
+ Sparkles,
+ Volume2,
+} from "lucide-react";
+
+type AssistantForm = {
+ name: string;
+ scene: string;
+ greeting: string;
+ model: string;
+ asr: string;
+ voice: string;
+ knowledgeBase: string;
+ enableInterrupt: boolean;
+ enablePublish: boolean;
+};
+
+
export function AssistantPage() {
- return
小助手管理
;
- }
\ No newline at end of file
+ const [form, setForm] = useState
({
+ name: "政务视频咨询助手",
+ scene: "政务服务",
+ greeting: "您好，我是 AI 视频助手，请问有什么可以帮您？",
+ model: "DeepSeek-V3",
+ asr: "SenseVoice",
+ voice: "晓宁",
+ knowledgeBase: "政务政策知识库",
+ enableInterrupt: true,
+ enablePublish: false,
+ });
+
+ function updateForm(
+ key: K,
+ value: AssistantForm[K],
+ ) {
+ setForm((prev) => ({
+ ...prev,
+ [key]: value,
+ }));
+ }
+
+ return (
+
+
+
+
+
+
创建助手
+
+
+ 通过提示词、模型、语音和知识库快速创建 AI 视频助手
+
+
+
+
+
+
+
+
+
+
+
+
+
}
+ title="基础信息"
+ description="定义助手名称、业务场景和开场白"
+ >
+
+ updateForm("name", value)}
+ placeholder="请输入助手名称"
+ />
+
+ updateForm("scene", value)}
+ options={["政务服务", "客户服务", "教育咨询", "医疗导诊", "企业培训"]}
+ />
+
+
+
updateForm("greeting", value)}
+ placeholder="请输入助手开场白"
+ />
+
+
+ }
+ title="模型配置"
+ description="选择大语言模型和知识库能力"
+ >
+
+ updateForm("model", value)}
+ options={["DeepSeek-V3", "Qwen-Max", "Kimi-K2", "Doubao-Pro", "GPT-4o"]}
+ />
+
+ updateForm("knowledgeBase", value)}
+ options={["政务政策知识库", "售后知识库", "教育课程知识库", "医疗问答知识库"]}
+ />
+
+
+
+ }
+ title="语音配置"
+ description="配置语音识别模型和播报声音"
+ >
+
+ updateForm("asr", value)}
+ options={["SenseVoice", "Paraformer", "Whisper", "FunASR"]}
+ />
+
+ updateForm("voice", value)}
+ options={["晓宁", "晓美", "晓宇", "晓晨"]}
+ />
+
+
+
+ }
+ title="交互策略"
+ description="设置实时视频对话时的交互体验"
+ >
+ updateForm("enableInterrupt", checked)}
+ />
+
+ updateForm("enablePublish", checked)}
+ />
+
+
+
+
+
+
+
+ {icon}
+
+
+
+
{title}
+
{description}
+
+
{children}
+
+ );
+}
+
+function TextField({
+ label,
+ value,
+ placeholder,
+ onChange,
+}: {
+ label: string;
+ value: string;
+ placeholder?: string;
+ onChange: (value: string) => void;
+}) {
+ return (
+
+ );
+}
+
+function TextAreaField({
+ label,
+ value,
+ placeholder,
+ onChange,
+}: {
+ label: string;
+ value: string;
+ placeholder?: string;
+ onChange: (value: string) => void;
+}) {
+ return (
+