diff --git a/frontend-web/src/components/workspace/input-box.tsx b/frontend-web/src/components/workspace/input-box.tsx index cd61334e..73a18a89 100644 --- a/frontend-web/src/components/workspace/input-box.tsx +++ b/frontend-web/src/components/workspace/input-box.tsx @@ -2,14 +2,18 @@ import type { ChatStatus } from "ai"; import { + BarChart3Icon, BrainCircuitIcon, BookMarkedIcon, CheckIcon, + ClipboardCheckIcon, FileTextIcon, GraduationCapIcon, LightbulbIcon, + MessageCircleQuestionIcon, PaperclipIcon, PlusIcon, + RefreshCwIcon, ShrinkIcon, SparklesIcon, RocketIcon, @@ -105,6 +109,56 @@ import { ModeHoverGuide } from "./mode-hover-guide"; import { Tooltip } from "./tooltip"; type InputMode = "flash" | "thinking" | "pro" | "ultra"; +const COMPACT_QUICK_STARTS = [ + { + id: "report", + title: "撰写报告", + content: "请帮我撰写一份结构清晰的专业报告,先向我确认主题、受众和篇幅要求。", + icon: FileTextIcon, + }, + { + id: "knowledge", + title: "知识问答", + content: "请基于已有资料回答我的问题,并明确区分已知事实、推断和需要补充的信息。", + icon: MessageCircleQuestionIcon, + }, + { + id: "planning", + title: "任务规划", + content: "请把我的目标拆解为可执行的任务计划,列出优先级、里程碑和风险。", + icon: ClipboardCheckIcon, + }, + { + id: "analysis", + title: "数据分析", + content: "请帮我分析数据中的关键趋势、异常和可能原因,并给出下一步验证建议。", + icon: BarChart3Icon, + }, + { + id: "solution", + title: "方案策划", + content: "请围绕我的目标设计一套完整方案,包含背景、目标、实施步骤、资源需求和风险预案。", + icon: LightbulbIcon, + }, + { + id: "summary", + title: "内容总结", + content: "请提炼我提供内容的核心观点、关键结论和待办事项,并按重要程度整理。", + icon: BookMarkedIcon, + }, + { + id: "research", + title: "调研提纲", + content: "请根据我的调研主题生成一份结构完整的调研提纲,覆盖对象、问题、方法和输出形式。", + icon: GraduationCapIcon, + }, + { + id: "polish", + title: "文案润色", + content: "请在不改变原意的前提下润色我提供的内容,使表达更清晰、专业、简洁。", + icon: SparklesIcon, + }, +] as const; function getResolvedMode( @@ -227,6 +281,7 @@ export function InputBox({ const wasStreamingRef = useRef(false); const [confirmOpen, setConfirmOpen] = useState(false); + const [compactPromptOrder, setCompactPromptOrder] = useState(0); const [pendingSuggestion, setPendingSuggestion] = useState( null, ); @@ -237,6 +292,29 @@ export function InputBox({ !hideAdminRecommendedQuestions && !userPreferences.hide_admin_prompt_prefix && recommendedQuestions.length > 0; + const compactQuickStarts = useMemo(() => { + if (showAdminRecommendedQuestions) { + return recommendedQuestions.map((configured, index) => { + const fallback = + COMPACT_QUICK_STARTS[index % COMPACT_QUICK_STARTS.length]!; + return { + ...fallback, + id: configured.id, + title: desensitize(configured.title) || `提示词 ${index + 1}`, + content: configured.content || fallback.content, + }; + }); + } + return [...COMPACT_QUICK_STARTS]; + }, [recommendedQuestions, showAdminRecommendedQuestions]); + const orderedCompactQuickStarts = useMemo(() => { + if (compactQuickStarts.length < 2) return compactQuickStarts; + const offset = compactPromptOrder % compactQuickStarts.length; + return [ + ...compactQuickStarts.slice(offset), + ...compactQuickStarts.slice(0, offset), + ]; + }, [compactPromptOrder, compactQuickStarts]); useEffect(() => { // Multi-round RAG is a frontend execution profile, not a model option. @@ -593,14 +671,53 @@ export function InputBox({ }, [context.model_name, disabled, isMock, selectedSingleRoundRag, status, thread.messages, threadId]); return ( -
+
{extraHeader && (
{extraHeader}
)} - {isNewThread && searchParams.get("mode") !== "skill" && showAdminRecommendedQuestions && ( + {isNewThread && searchParams.get("mode") !== "skill" && compact && ( +
+
+ + +
+
+ {orderedCompactQuickStarts.map((item) => ( + + ))} +
+
+ )} + + {isNewThread && searchParams.get("mode") !== "skill" && !compact && showAdminRecommendedQuestions && (
{recommendedQuestions.map((q) => (