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 VIDEO_PROVIDER_TYPES = new Set(["volcano-video", "doubao-video", "qianwen-video", "fal-video"]);
|
||||||
const visualModels =
|
const visualModels =
|
||||||
modelsData?.models?.filter(
|
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模式(自动路由)模型选项
|
// Agent模式(自动路由)模型选项
|
||||||
|
|||||||
@ -8,7 +8,7 @@ import {
|
|||||||
DropdownMenuItem,
|
DropdownMenuItem,
|
||||||
DropdownMenuTrigger,
|
DropdownMenuTrigger,
|
||||||
} from "@/components/ui/dropdown-menu";
|
} 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 { cn } from "@/lib/utils";
|
||||||
import { Input } from "@/components/ui/input";
|
import { Input } from "@/components/ui/input";
|
||||||
import { Switch } from "@/components/ui/switch";
|
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"
|
className="h-8 px-2 focus-visible:ring-0 focus-visible:ring-offset-0 focus:outline-none focus:ring-0"
|
||||||
title={`分辨率:${params.imageSize}`}
|
title={`分辨率:${params.imageSize}`}
|
||||||
>
|
>
|
||||||
<Maximize2 size={14} />
|
<Monitor size={14} />
|
||||||
<span className="sr-only">{`分辨率:${params.imageSize}`}</span>
|
<span className="sr-only">{`分辨率:${params.imageSize}`}</span>
|
||||||
</Button>
|
</Button>
|
||||||
</DropdownMenuTrigger>
|
</DropdownMenuTrigger>
|
||||||
|
|||||||
@ -1193,7 +1193,13 @@ function PureModelSelectorCompact({
|
|||||||
showAutoModel: boolean;
|
showAutoModel: boolean;
|
||||||
}>("/api/site-settings", fetcher);
|
}>("/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(() => {
|
const { mainModels, subModelsMap } = useMemo(() => {
|
||||||
|
|||||||
@ -30,6 +30,7 @@ import {
|
|||||||
Clock,
|
Clock,
|
||||||
Settings2,
|
Settings2,
|
||||||
Maximize2,
|
Maximize2,
|
||||||
|
Monitor,
|
||||||
Ratio,
|
Ratio,
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
import { cn } from "@/lib/utils";
|
import { cn } from "@/lib/utils";
|
||||||
@ -271,12 +272,15 @@ const getImageUploadConfig = () => {
|
|||||||
{/* 模式选择 */}
|
{/* 模式选择 */}
|
||||||
<DropdownMenu>
|
<DropdownMenu>
|
||||||
<DropdownMenuTrigger asChild>
|
<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} />
|
<Maximize2 size={14} />
|
||||||
<span className="font-medium text-xs">
|
<span className="sr-only">
|
||||||
{modeOptions.find((option) => option.value === params.mode)?.label || MODE_LABELS[params.mode]}
|
{`模式:${modeOptions.find((option) => option.value === params.mode)?.label || MODE_LABELS[params.mode]}`}
|
||||||
</span>
|
</span>
|
||||||
<ChevronDown size={14} />
|
|
||||||
</Button>
|
</Button>
|
||||||
</DropdownMenuTrigger>
|
</DropdownMenuTrigger>
|
||||||
<DropdownMenuContent align="start" className="w-36">
|
<DropdownMenuContent align="start" className="w-36">
|
||||||
@ -300,9 +304,13 @@ const getImageUploadConfig = () => {
|
|||||||
{/* 宽高比 */}
|
{/* 宽高比 */}
|
||||||
<DropdownMenu>
|
<DropdownMenu>
|
||||||
<DropdownMenuTrigger asChild>
|
<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} />
|
<Ratio size={14} />
|
||||||
<span className="font-medium text-xs">{params.ratio}</span>
|
<span className="sr-only">{`比例:${params.ratio}`}</span>
|
||||||
</Button>
|
</Button>
|
||||||
</DropdownMenuTrigger>
|
</DropdownMenuTrigger>
|
||||||
<DropdownMenuContent align="center" className="w-48">
|
<DropdownMenuContent align="center" className="w-48">
|
||||||
@ -325,8 +333,13 @@ const getImageUploadConfig = () => {
|
|||||||
{!isFalVideo && (
|
{!isFalVideo && (
|
||||||
<DropdownMenu>
|
<DropdownMenu>
|
||||||
<DropdownMenuTrigger asChild>
|
<DropdownMenuTrigger asChild>
|
||||||
<Button variant="ghost" className="h-8 px-2 focus-visible:ring-0 focus-visible:ring-offset-0">
|
<Button
|
||||||
<span className="font-medium text-xs">{params.resolution}</span>
|
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>
|
</Button>
|
||||||
</DropdownMenuTrigger>
|
</DropdownMenuTrigger>
|
||||||
<DropdownMenuContent align="center" className="min-w-[100px]">
|
<DropdownMenuContent align="center" className="min-w-[100px]">
|
||||||
@ -343,9 +356,13 @@ const getImageUploadConfig = () => {
|
|||||||
{/* 时长 */}
|
{/* 时长 */}
|
||||||
<DropdownMenu>
|
<DropdownMenu>
|
||||||
<DropdownMenuTrigger asChild>
|
<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} />
|
<Clock size={14} />
|
||||||
<span className="font-medium text-xs">{params.duration}s</span>
|
<span className="sr-only">{`时长:${params.duration}s`}</span>
|
||||||
</Button>
|
</Button>
|
||||||
</DropdownMenuTrigger>
|
</DropdownMenuTrigger>
|
||||||
<DropdownMenuContent align="center" className="min-w-[80px]">
|
<DropdownMenuContent align="center" className="min-w-[80px]">
|
||||||
@ -361,18 +378,24 @@ const getImageUploadConfig = () => {
|
|||||||
{isFalVideo ? (
|
{isFalVideo ? (
|
||||||
<Button
|
<Button
|
||||||
variant="ghost"
|
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))}
|
onClick={() => updateParam("generateAudio", !(params.generateAudio ?? true))}
|
||||||
|
title={`音频:${params.generateAudio === false ? "静音" : "带音频"}`}
|
||||||
>
|
>
|
||||||
<Sparkles size={14} />
|
<Sparkles size={14} />
|
||||||
<span className="font-medium text-xs">{params.generateAudio === false ? "静音" : "带音频"}</span>
|
<span className="sr-only">{`音频:${params.generateAudio === false ? "静音" : "带音频"}`}</span>
|
||||||
</Button>
|
</Button>
|
||||||
) : (
|
) : (
|
||||||
<>
|
<>
|
||||||
<DropdownMenu>
|
<DropdownMenu>
|
||||||
<DropdownMenuTrigger asChild>
|
<DropdownMenuTrigger asChild>
|
||||||
<Button variant="ghost" className="h-8 px-2 focus-visible:ring-0 focus-visible:ring-offset-0">
|
<Button
|
||||||
<span className="font-medium text-xs">{params.fps || 24}fps</span>
|
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>
|
</Button>
|
||||||
</DropdownMenuTrigger>
|
</DropdownMenuTrigger>
|
||||||
<DropdownMenuContent align="center" className="min-w-[90px]">
|
<DropdownMenuContent align="center" className="min-w-[90px]">
|
||||||
@ -387,9 +410,13 @@ const getImageUploadConfig = () => {
|
|||||||
|
|
||||||
<DropdownMenu>
|
<DropdownMenu>
|
||||||
<DropdownMenuTrigger asChild>
|
<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} />
|
<Camera size={14} />
|
||||||
<span className="font-medium text-xs">{getCurrentCameraLabel()}</span>
|
<span className="sr-only">{`运镜:${getCurrentCameraLabel()}`}</span>
|
||||||
</Button>
|
</Button>
|
||||||
</DropdownMenuTrigger>
|
</DropdownMenuTrigger>
|
||||||
<DropdownMenuContent align="center" className="min-w-[100px]">
|
<DropdownMenuContent align="center" className="min-w-[100px]">
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user