HouYunFei
7ce3044781
- 在 CanvasConfigNodePanel 组件中为 Segmented 控件添加事件阻止传播 - 为输入框和按钮组件添加 onMouseDown 事件阻止传播 - 为 ModelPicker 和 CanvasSizePicker 的下拉菜单添加事件阻止传播 - 更新 API 基础 URL 默认端口从 8080 改为 3000 - 更新开发服务器端口配置为 3001 - 在 CHANGELOG 中更新修复说明
42 lines
1.5 KiB
TypeScript
42 lines
1.5 KiB
TypeScript
"use client";
|
|
|
|
import { Select } from "antd";
|
|
|
|
import type { AiConfig } from "@/lib/ai-config";
|
|
|
|
type ModelPickerProps = {
|
|
config: AiConfig;
|
|
value?: string;
|
|
onChange: (model: string) => void;
|
|
className?: string;
|
|
fullWidth?: boolean;
|
|
placeholder?: string;
|
|
onMissingConfig?: () => void;
|
|
};
|
|
|
|
export function ModelPicker({ config, value, onChange, className, fullWidth = false, placeholder = "选择模型", onMissingConfig }: ModelPickerProps) {
|
|
const options = Array.from(new Set([value, ...config.models].filter(Boolean))).map((model) => ({ value: model, label: model }));
|
|
const width = fullWidth ? "100%" : `min(${Math.max(156, (value || placeholder).length * 8 + 64)}px, 100%)`;
|
|
|
|
return (
|
|
<Select
|
|
showSearch
|
|
className={`canvas-control-select ${className || ""}`}
|
|
popupMatchSelectWidth={false}
|
|
popupRender={(menu) => <div onMouseDown={(event) => event.stopPropagation()} onPointerDown={(event) => event.stopPropagation()}>{menu}</div>}
|
|
style={{ width, maxWidth: "100%", minWidth: 0, flexShrink: 1 }}
|
|
value={value || undefined}
|
|
placeholder={placeholder}
|
|
options={options}
|
|
notFoundContent="请先到配置里拉取模型列表"
|
|
onChange={onChange}
|
|
onMouseDown={(event) => event.stopPropagation()}
|
|
onPointerDown={(event) => event.stopPropagation()}
|
|
onClick={() => {
|
|
if (!options.length) onMissingConfig?.();
|
|
}}
|
|
filterOption={(input, option) => String(option?.label || "").toLowerCase().includes(input.toLowerCase())}
|
|
/>
|
|
);
|
|
}
|