style(ui): simplify media toolbars and hide volcano video master model
This commit is contained in:
parent
32b56d0919
commit
b5f6fd3842
@ -1356,7 +1356,9 @@ export function CanvasChatPanel({ chatId, initialMessages = [], onClose, onOpenF
|
||||
const VIDEO_PROVIDER_TYPES = new Set(["volcano-video", "doubao-video", "qianwen-video", "fal-video"]);
|
||||
const visualModels =
|
||||
modelsData?.models?.filter(
|
||||
(model) => model.supportsImageGen || VIDEO_PROVIDER_TYPES.has(model.providerType)
|
||||
(model) =>
|
||||
model.modelId !== "volcano-video-master" &&
|
||||
(model.supportsImageGen || VIDEO_PROVIDER_TYPES.has(model.providerType))
|
||||
) || [];
|
||||
|
||||
// Agent模式(自动路由)模型选项
|
||||
|
||||
@ -8,7 +8,7 @@ import {
|
||||
DropdownMenuItem,
|
||||
DropdownMenuTrigger,
|
||||
} from "@/components/ui/dropdown-menu";
|
||||
import { Check, Image, Ratio, Maximize2, Images, SlidersHorizontal, Ban } from "lucide-react";
|
||||
import { Check, Image, Ratio, Monitor, Images, SlidersHorizontal, Ban } from "lucide-react";
|
||||
import { cn } from "@/lib/utils";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import { Switch } from "@/components/ui/switch";
|
||||
@ -215,7 +215,7 @@ export function ImageParamsBar({
|
||||
className="h-8 px-2 focus-visible:ring-0 focus-visible:ring-offset-0 focus:outline-none focus:ring-0"
|
||||
title={`分辨率:${params.imageSize}`}
|
||||
>
|
||||
<Maximize2 size={14} />
|
||||
<Monitor size={14} />
|
||||
<span className="sr-only">{`分辨率:${params.imageSize}`}</span>
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
|
||||
@ -1193,7 +1193,13 @@ function PureModelSelectorCompact({
|
||||
showAutoModel: boolean;
|
||||
}>("/api/site-settings", fetcher);
|
||||
|
||||
const allModels = dynamicModelsData?.models ?? [];
|
||||
const allModels = useMemo(
|
||||
() =>
|
||||
(dynamicModelsData?.models ?? []).filter(
|
||||
(model) => model.modelId !== "volcano-video-master"
|
||||
),
|
||||
[dynamicModelsData?.models]
|
||||
);
|
||||
|
||||
// 🆕 将模型分为主模型和子模型,构建层级结构
|
||||
const { mainModels, subModelsMap } = useMemo(() => {
|
||||
|
||||
@ -30,6 +30,7 @@ import {
|
||||
Clock,
|
||||
Settings2,
|
||||
Maximize2,
|
||||
Monitor,
|
||||
Ratio,
|
||||
} from "lucide-react";
|
||||
import { cn } from "@/lib/utils";
|
||||
@ -271,12 +272,15 @@ const getImageUploadConfig = () => {
|
||||
{/* 模式选择 */}
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button variant="ghost" className="h-8 px-2 gap-1 focus-visible:ring-0 focus-visible:ring-offset-0">
|
||||
<Button
|
||||
variant="ghost"
|
||||
className="h-8 px-2 focus-visible:ring-0 focus-visible:ring-offset-0"
|
||||
title={`模式:${modeOptions.find((option) => option.value === params.mode)?.label || MODE_LABELS[params.mode]}`}
|
||||
>
|
||||
<Maximize2 size={14} />
|
||||
<span className="font-medium text-xs">
|
||||
{modeOptions.find((option) => option.value === params.mode)?.label || MODE_LABELS[params.mode]}
|
||||
<span className="sr-only">
|
||||
{`模式:${modeOptions.find((option) => option.value === params.mode)?.label || MODE_LABELS[params.mode]}`}
|
||||
</span>
|
||||
<ChevronDown size={14} />
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent align="start" className="w-36">
|
||||
@ -300,9 +304,13 @@ const getImageUploadConfig = () => {
|
||||
{/* 宽高比 */}
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button variant="ghost" className="h-8 px-2 gap-1 focus-visible:ring-0 focus-visible:ring-offset-0">
|
||||
<Button
|
||||
variant="ghost"
|
||||
className="h-8 px-2 focus-visible:ring-0 focus-visible:ring-offset-0"
|
||||
title={`比例:${params.ratio}`}
|
||||
>
|
||||
<Ratio size={14} />
|
||||
<span className="font-medium text-xs">{params.ratio}</span>
|
||||
<span className="sr-only">{`比例:${params.ratio}`}</span>
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent align="center" className="w-48">
|
||||
@ -325,8 +333,13 @@ const getImageUploadConfig = () => {
|
||||
{!isFalVideo && (
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button variant="ghost" className="h-8 px-2 focus-visible:ring-0 focus-visible:ring-offset-0">
|
||||
<span className="font-medium text-xs">{params.resolution}</span>
|
||||
<Button
|
||||
variant="ghost"
|
||||
className="h-8 px-2 focus-visible:ring-0 focus-visible:ring-offset-0"
|
||||
title={`分辨率:${params.resolution}`}
|
||||
>
|
||||
<Monitor size={14} />
|
||||
<span className="sr-only">{`分辨率:${params.resolution}`}</span>
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent align="center" className="min-w-[100px]">
|
||||
@ -343,9 +356,13 @@ const getImageUploadConfig = () => {
|
||||
{/* 时长 */}
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button variant="ghost" className="h-8 px-2 gap-1 focus-visible:ring-0 focus-visible:ring-offset-0">
|
||||
<Button
|
||||
variant="ghost"
|
||||
className="h-8 px-2 focus-visible:ring-0 focus-visible:ring-offset-0"
|
||||
title={`时长:${params.duration}s`}
|
||||
>
|
||||
<Clock size={14} />
|
||||
<span className="font-medium text-xs">{params.duration}s</span>
|
||||
<span className="sr-only">{`时长:${params.duration}s`}</span>
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent align="center" className="min-w-[80px]">
|
||||
@ -361,18 +378,24 @@ const getImageUploadConfig = () => {
|
||||
{isFalVideo ? (
|
||||
<Button
|
||||
variant="ghost"
|
||||
className="h-8 px-2 gap-1 focus-visible:ring-0 focus-visible:ring-offset-0"
|
||||
className="h-8 px-2 focus-visible:ring-0 focus-visible:ring-offset-0"
|
||||
onClick={() => updateParam("generateAudio", !(params.generateAudio ?? true))}
|
||||
title={`音频:${params.generateAudio === false ? "静音" : "带音频"}`}
|
||||
>
|
||||
<Sparkles size={14} />
|
||||
<span className="font-medium text-xs">{params.generateAudio === false ? "静音" : "带音频"}</span>
|
||||
<span className="sr-only">{`音频:${params.generateAudio === false ? "静音" : "带音频"}`}</span>
|
||||
</Button>
|
||||
) : (
|
||||
<>
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button variant="ghost" className="h-8 px-2 focus-visible:ring-0 focus-visible:ring-offset-0">
|
||||
<span className="font-medium text-xs">{params.fps || 24}fps</span>
|
||||
<Button
|
||||
variant="ghost"
|
||||
className="h-8 px-2 focus-visible:ring-0 focus-visible:ring-offset-0"
|
||||
title={`帧率:${params.fps || 24}fps`}
|
||||
>
|
||||
<Video size={14} />
|
||||
<span className="sr-only">{`帧率:${params.fps || 24}fps`}</span>
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent align="center" className="min-w-[90px]">
|
||||
@ -387,9 +410,13 @@ const getImageUploadConfig = () => {
|
||||
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button variant="ghost" className="h-8 px-2 gap-1 focus-visible:ring-0 focus-visible:ring-offset-0">
|
||||
<Button
|
||||
variant="ghost"
|
||||
className="h-8 px-2 focus-visible:ring-0 focus-visible:ring-offset-0"
|
||||
title={`运镜:${getCurrentCameraLabel()}`}
|
||||
>
|
||||
<Camera size={14} />
|
||||
<span className="font-medium text-xs">{getCurrentCameraLabel()}</span>
|
||||
<span className="sr-only">{`运镜:${getCurrentCameraLabel()}`}</span>
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent align="center" className="min-w-[100px]">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user