This commit is contained in:
dengqichen 2025-12-17 19:34:51 +08:00
parent c3c9f9fabb
commit d16b1d59ed
5 changed files with 75 additions and 74 deletions

View File

@ -17,20 +17,20 @@ import { getK8sNamespaceList, getK8sDeploymentByNamespace } from '@/pages/Resour
interface K8sRuntimeConfigProps { interface K8sRuntimeConfigProps {
k8sSystemId: number | null; k8sSystemId: number | null;
k8sNamespaceId: number | null; k8sNamespaceName: string;
k8sDeploymentId: number | null; k8sDeploymentName: string;
onK8sSystemChange: (systemId: number | null) => void; onK8sSystemChange: (systemId: number | null) => void;
onK8sNamespaceChange: (namespaceId: number | null) => void; onK8sNamespaceNameChange: (namespaceName: string) => void;
onK8sDeploymentIdChange: (deploymentId: number | null) => void; onK8sDeploymentNameChange: (deploymentName: string) => void;
} }
export const K8sRuntimeConfig: React.FC<K8sRuntimeConfigProps> = ({ export const K8sRuntimeConfig: React.FC<K8sRuntimeConfigProps> = ({
k8sSystemId, k8sSystemId,
k8sNamespaceId, k8sNamespaceName,
k8sDeploymentId, k8sDeploymentName,
onK8sSystemChange, onK8sSystemChange,
onK8sNamespaceChange, onK8sNamespaceNameChange,
onK8sDeploymentIdChange, onK8sDeploymentNameChange,
}) => { }) => {
const [k8sSystems, setK8sSystems] = useState<any[]>([]); const [k8sSystems, setK8sSystems] = useState<any[]>([]);
const [namespaces, setNamespaces] = useState<any[]>([]); const [namespaces, setNamespaces] = useState<any[]>([]);
@ -81,14 +81,21 @@ export const K8sRuntimeConfig: React.FC<K8sRuntimeConfigProps> = ({
// 加载Deployment列表 // 加载Deployment列表
useEffect(() => { useEffect(() => {
const loadDeployments = async () => { const loadDeployments = async () => {
if (!k8sSystemId || !k8sNamespaceId) { if (!k8sSystemId || !k8sNamespaceName) {
setDeployments([]);
return;
}
// 通过namespaceName查找对应的namespace ID
const namespace = namespaces.find(ns => ns.namespaceName === k8sNamespaceName);
if (!namespace) {
setDeployments([]); setDeployments([]);
return; return;
} }
setLoadingDeployments(true); setLoadingDeployments(true);
try { try {
const data = await getK8sDeploymentByNamespace(k8sSystemId, k8sNamespaceId); const data = await getK8sDeploymentByNamespace(k8sSystemId, namespace.id);
setDeployments(data || []); setDeployments(data || []);
} catch (error) { } catch (error) {
console.error('加载Deployment失败:', error); console.error('加载Deployment失败:', error);
@ -98,7 +105,7 @@ export const K8sRuntimeConfig: React.FC<K8sRuntimeConfigProps> = ({
} }
}; };
loadDeployments(); loadDeployments();
}, [k8sSystemId, k8sNamespaceId]); }, [k8sSystemId, k8sNamespaceName, namespaces]);
return ( return (
<div className="space-y-4 p-4 border rounded-lg bg-muted/30"> <div className="space-y-4 p-4 border rounded-lg bg-muted/30">
@ -147,14 +154,11 @@ export const K8sRuntimeConfig: React.FC<K8sRuntimeConfigProps> = ({
disabled={loadingNamespaces || namespaces.length === 0} disabled={loadingNamespaces || namespaces.length === 0}
className={cn( className={cn(
'w-full justify-between', 'w-full justify-between',
!k8sNamespaceId && 'text-muted-foreground' !k8sNamespaceName && 'text-muted-foreground'
)} )}
> >
{k8sNamespaceId {k8sNamespaceName
? (() => { ? k8sNamespaceName
const selectedNs = namespaces.find((ns) => ns.id === k8sNamespaceId);
return selectedNs ? selectedNs.namespaceName : '选择Namespace';
})()
: loadingNamespaces : loadingNamespaces
? '加载中...' ? '加载中...'
: namespaces.length === 0 : namespaces.length === 0
@ -184,16 +188,16 @@ export const K8sRuntimeConfig: React.FC<K8sRuntimeConfigProps> = ({
key={ns.id} key={ns.id}
className={cn( className={cn(
'relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none hover:bg-accent hover:text-accent-foreground', 'relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none hover:bg-accent hover:text-accent-foreground',
ns.id === k8sNamespaceId && 'bg-accent text-accent-foreground' ns.namespaceName === k8sNamespaceName && 'bg-accent text-accent-foreground'
)} )}
onClick={() => { onClick={() => {
onK8sNamespaceChange(ns.id); onK8sNamespaceNameChange(ns.namespaceName);
setNamespaceSearchValue(''); setNamespaceSearchValue('');
setNamespacePopoverOpen(false); setNamespacePopoverOpen(false);
}} }}
> >
<span className="flex-1 truncate">{ns.namespaceName}</span> <span className="flex-1 truncate">{ns.namespaceName}</span>
{ns.id === k8sNamespaceId && <Check className="ml-2 h-4 w-4" />} {ns.namespaceName === k8sNamespaceName && <Check className="ml-2 h-4 w-4" />}
</div> </div>
))} ))}
</div> </div>
@ -211,7 +215,7 @@ export const K8sRuntimeConfig: React.FC<K8sRuntimeConfigProps> = ({
{/* Deployment选择 */} {/* Deployment选择 */}
<div className="space-y-2"> <div className="space-y-2">
<Label>Deployment</Label> <Label>Deployment</Label>
{k8sNamespaceId ? ( {k8sNamespaceName ? (
<Popover open={deploymentPopoverOpen} onOpenChange={setDeploymentPopoverOpen}> <Popover open={deploymentPopoverOpen} onOpenChange={setDeploymentPopoverOpen}>
<PopoverTrigger asChild> <PopoverTrigger asChild>
<Button <Button
@ -220,14 +224,11 @@ export const K8sRuntimeConfig: React.FC<K8sRuntimeConfigProps> = ({
disabled={loadingDeployments || deployments.length === 0} disabled={loadingDeployments || deployments.length === 0}
className={cn( className={cn(
'w-full justify-between', 'w-full justify-between',
!k8sDeploymentId && 'text-muted-foreground' !k8sDeploymentName && 'text-muted-foreground'
)} )}
> >
{k8sDeploymentId {k8sDeploymentName
? (() => { ? k8sDeploymentName
const selectedDeployment = deployments.find((d) => d.id === k8sDeploymentId);
return selectedDeployment ? selectedDeployment.deploymentName : '选择Deployment';
})()
: loadingDeployments : loadingDeployments
? '加载中...' ? '加载中...'
: deployments.length === 0 : deployments.length === 0
@ -257,16 +258,16 @@ export const K8sRuntimeConfig: React.FC<K8sRuntimeConfigProps> = ({
key={deployment.id} key={deployment.id}
className={cn( className={cn(
'relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none hover:bg-accent hover:text-accent-foreground', 'relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none hover:bg-accent hover:text-accent-foreground',
deployment.id === k8sDeploymentId && 'bg-accent text-accent-foreground' deployment.deploymentName === k8sDeploymentName && 'bg-accent text-accent-foreground'
)} )}
onClick={() => { onClick={() => {
onK8sDeploymentIdChange(deployment.id); onK8sDeploymentNameChange(deployment.deploymentName);
setDeploymentSearchValue(''); setDeploymentSearchValue('');
setDeploymentPopoverOpen(false); setDeploymentPopoverOpen(false);
}} }}
> >
<span className="flex-1 truncate">{deployment.deploymentName}</span> <span className="flex-1 truncate">{deployment.deploymentName}</span>
{deployment.id === k8sDeploymentId && <Check className="ml-2 h-4 w-4" />} {deployment.deploymentName === k8sDeploymentName && <Check className="ml-2 h-4 w-4" />}
</div> </div>
))} ))}
</div> </div>

View File

@ -18,11 +18,11 @@ interface RuntimeConfigSectionProps {
onRuntimeTypeChange: (type: RuntimeType | null) => void; onRuntimeTypeChange: (type: RuntimeType | null) => void;
// K8S配置 // K8S配置
k8sSystemId: number | null; k8sSystemId: number | null;
k8sNamespaceId: number | null; k8sNamespaceName: string;
k8sDeploymentId: number | null; k8sDeploymentName: string;
onK8sSystemChange: (systemId: number | null) => void; onK8sSystemChange: (systemId: number | null) => void;
onK8sNamespaceChange: (namespaceId: number | null) => void; onK8sNamespaceNameChange: (namespaceName: string) => void;
onK8sDeploymentIdChange: (deploymentId: number | null) => void; onK8sDeploymentNameChange: (deploymentName: string) => void;
// Docker配置预留 // Docker配置预留
dockerServerId?: number | null; dockerServerId?: number | null;
dockerContainerName?: string; dockerContainerName?: string;
@ -39,11 +39,11 @@ export const RuntimeConfigSection: React.FC<RuntimeConfigSectionProps> = ({
runtimeType, runtimeType,
onRuntimeTypeChange, onRuntimeTypeChange,
k8sSystemId, k8sSystemId,
k8sNamespaceId, k8sNamespaceName,
k8sDeploymentId, k8sDeploymentName,
onK8sSystemChange, onK8sSystemChange,
onK8sNamespaceChange, onK8sNamespaceNameChange,
onK8sDeploymentIdChange, onK8sDeploymentNameChange,
dockerServerId, dockerServerId,
dockerContainerName, dockerContainerName,
onDockerServerChange, onDockerServerChange,
@ -84,11 +84,11 @@ export const RuntimeConfigSection: React.FC<RuntimeConfigSectionProps> = ({
{runtimeType === 'K8S' && ( {runtimeType === 'K8S' && (
<K8sRuntimeConfig <K8sRuntimeConfig
k8sSystemId={k8sSystemId} k8sSystemId={k8sSystemId}
k8sNamespaceId={k8sNamespaceId} k8sNamespaceName={k8sNamespaceName}
k8sDeploymentId={k8sDeploymentId} k8sDeploymentName={k8sDeploymentName}
onK8sSystemChange={onK8sSystemChange} onK8sSystemChange={onK8sSystemChange}
onK8sNamespaceChange={onK8sNamespaceChange} onK8sNamespaceNameChange={onK8sNamespaceNameChange}
onK8sDeploymentIdChange={onK8sDeploymentIdChange} onK8sDeploymentNameChange={onK8sDeploymentNameChange}
/> />
)} )}

View File

@ -65,8 +65,8 @@ interface TeamApplicationDialogProps {
// 运行时配置 // 运行时配置
runtimeType: RuntimeType | null; runtimeType: RuntimeType | null;
k8sSystemId: number | null; k8sSystemId: number | null;
k8sNamespaceId: number | null; k8sNamespaceName: string;
k8sDeploymentId: number | null; k8sDeploymentName: string;
dockerServerId: number | null; dockerServerId: number | null;
dockerContainerName: string; dockerContainerName: string;
serverId: number | null; serverId: number | null;
@ -111,8 +111,8 @@ const TeamApplicationDialog: React.FC<TeamApplicationDialogProps> = ({
// 运行时配置 // 运行时配置
runtimeType: null as RuntimeType | null, // 运行时类型 runtimeType: null as RuntimeType | null, // 运行时类型
k8sSystemId: null as number | null, // K8S系统ID k8sSystemId: null as number | null, // K8S系统ID
k8sNamespaceId: null as number | null, // K8S命名空间ID k8sNamespaceName: '', // K8S命名空间名称
k8sDeploymentId: null as number | null, // K8S Deployment ID k8sDeploymentName: '', // K8S Deployment名称
dockerServerId: null as number | null, // Docker服务器ID dockerServerId: null as number | null, // Docker服务器ID
dockerContainerName: '', // Docker容器名称 dockerContainerName: '', // Docker容器名称
serverId: null as number | null, // 服务器ID serverId: null as number | null, // 服务器ID
@ -160,8 +160,8 @@ const TeamApplicationDialog: React.FC<TeamApplicationDialogProps> = ({
// 运行时配置 // 运行时配置
runtimeType: application.runtimeType || null, runtimeType: application.runtimeType || null,
k8sSystemId: application.k8sSystemId || null, k8sSystemId: application.k8sSystemId || null,
k8sNamespaceId: application.k8sNamespaceId || null, k8sNamespaceName: application.k8sNamespaceName || '',
k8sDeploymentId: application.k8sDeploymentId || null, k8sDeploymentName: application.k8sDeploymentName || '',
dockerServerId: application.dockerServerId || null, dockerServerId: application.dockerServerId || null,
dockerContainerName: application.dockerContainerName || '', dockerContainerName: application.dockerContainerName || '',
serverId: application.serverId || null, serverId: application.serverId || null,
@ -216,8 +216,8 @@ const TeamApplicationDialog: React.FC<TeamApplicationDialogProps> = ({
// 运行时配置 // 运行时配置
runtimeType: null, runtimeType: null,
k8sSystemId: null, k8sSystemId: null,
k8sNamespaceId: null, k8sNamespaceName: '',
k8sDeploymentId: null, k8sDeploymentName: '',
dockerServerId: null, dockerServerId: null,
dockerContainerName: '', dockerContainerName: '',
serverId: null, serverId: null,
@ -320,8 +320,8 @@ const TeamApplicationDialog: React.FC<TeamApplicationDialogProps> = ({
// 保留运行时配置 // 保留运行时配置
runtimeType: formData.runtimeType, runtimeType: formData.runtimeType,
k8sSystemId: formData.k8sSystemId, k8sSystemId: formData.k8sSystemId,
k8sNamespaceId: formData.k8sNamespaceId, k8sNamespaceName: formData.k8sNamespaceName,
k8sDeploymentId: formData.k8sDeploymentId, k8sDeploymentName: formData.k8sDeploymentName,
dockerServerId: formData.dockerServerId, dockerServerId: formData.dockerServerId,
dockerContainerName: formData.dockerContainerName, dockerContainerName: formData.dockerContainerName,
serverId: formData.serverId, serverId: formData.serverId,
@ -492,7 +492,7 @@ const TeamApplicationDialog: React.FC<TeamApplicationDialogProps> = ({
}); });
return; return;
} }
if (!formData.k8sNamespaceId) { if (!formData.k8sNamespaceName) {
toast({ toast({
variant: 'destructive', variant: 'destructive',
title: '请选择Namespace', title: '请选择Namespace',
@ -500,7 +500,7 @@ const TeamApplicationDialog: React.FC<TeamApplicationDialogProps> = ({
}); });
return; return;
} }
if (!formData.k8sDeploymentId) { if (!formData.k8sDeploymentName) {
toast({ toast({
variant: 'destructive', variant: 'destructive',
title: '请选择Deployment', title: '请选择Deployment',
@ -528,8 +528,8 @@ const TeamApplicationDialog: React.FC<TeamApplicationDialogProps> = ({
// 运行时配置 // 运行时配置
runtimeType: formData.runtimeType, runtimeType: formData.runtimeType,
k8sSystemId: formData.k8sSystemId, k8sSystemId: formData.k8sSystemId,
k8sNamespaceId: formData.k8sNamespaceId, k8sNamespaceName: formData.k8sNamespaceName,
k8sDeploymentId: formData.k8sDeploymentId, k8sDeploymentName: formData.k8sDeploymentName,
dockerServerId: formData.dockerServerId, dockerServerId: formData.dockerServerId,
dockerContainerName: formData.dockerContainerName, dockerContainerName: formData.dockerContainerName,
serverId: formData.serverId, serverId: formData.serverId,
@ -877,8 +877,8 @@ const TeamApplicationDialog: React.FC<TeamApplicationDialogProps> = ({
runtimeType: type, runtimeType: type,
// 切换类型时清空所有运行时配置 // 切换类型时清空所有运行时配置
k8sSystemId: null, k8sSystemId: null,
k8sNamespaceId: null, k8sNamespaceName: '',
k8sDeploymentId: null, k8sDeploymentName: '',
dockerServerId: null, dockerServerId: null,
dockerContainerName: '', dockerContainerName: '',
serverId: null, serverId: null,
@ -886,20 +886,20 @@ const TeamApplicationDialog: React.FC<TeamApplicationDialogProps> = ({
}); });
}} }}
k8sSystemId={formData.k8sSystemId} k8sSystemId={formData.k8sSystemId}
k8sNamespaceId={formData.k8sNamespaceId} k8sNamespaceName={formData.k8sNamespaceName}
k8sDeploymentId={formData.k8sDeploymentId} k8sDeploymentName={formData.k8sDeploymentName}
onK8sSystemChange={(systemId) => setFormData(prev => ({ onK8sSystemChange={(systemId) => setFormData(prev => ({
...prev, ...prev,
k8sSystemId: systemId, k8sSystemId: systemId,
k8sNamespaceId: null, k8sNamespaceName: '',
k8sDeploymentId: null k8sDeploymentName: ''
}))} }))}
onK8sNamespaceChange={(namespaceId) => setFormData(prev => ({ onK8sNamespaceNameChange={(namespaceName) => setFormData(prev => ({
...prev, ...prev,
k8sNamespaceId: namespaceId, k8sNamespaceName: namespaceName,
k8sDeploymentId: null k8sDeploymentName: ''
}))} }))}
onK8sDeploymentIdChange={(deploymentId) => setFormData(prev => ({ ...prev, k8sDeploymentId: deploymentId }))} onK8sDeploymentNameChange={(deploymentName) => setFormData(prev => ({ ...prev, k8sDeploymentName: deploymentName }))}
dockerServerId={formData.dockerServerId} dockerServerId={formData.dockerServerId}
dockerContainerName={formData.dockerContainerName} dockerContainerName={formData.dockerContainerName}
onDockerServerChange={(serverId) => setFormData(prev => ({ ...prev, dockerServerId: serverId }))} onDockerServerChange={(serverId) => setFormData(prev => ({ ...prev, dockerServerId: serverId }))}

View File

@ -135,8 +135,8 @@ export const TeamApplicationManageDialog: React.FC<
// 运行时配置 // 运行时配置
runtimeType: 'K8S' | 'DOCKER' | 'SERVER' | null; runtimeType: 'K8S' | 'DOCKER' | 'SERVER' | null;
k8sSystemId: number | null; k8sSystemId: number | null;
k8sNamespaceId: number | null; k8sNamespaceName: string;
k8sDeploymentId: number | null; k8sDeploymentName: string;
dockerServerId: number | null; dockerServerId: number | null;
dockerContainerName: string; dockerContainerName: string;
serverId: number | null; serverId: number | null;
@ -163,8 +163,8 @@ export const TeamApplicationManageDialog: React.FC<
// 运行时配置字段 // 运行时配置字段
runtimeType: data.runtimeType || undefined, runtimeType: data.runtimeType || undefined,
k8sSystemId: data.k8sSystemId || undefined, k8sSystemId: data.k8sSystemId || undefined,
k8sNamespaceId: data.k8sNamespaceId || undefined, k8sNamespaceName: data.k8sNamespaceName || undefined,
k8sDeploymentId: data.k8sDeploymentId || undefined, k8sDeploymentName: data.k8sDeploymentName || undefined,
dockerServerId: data.dockerServerId || undefined, dockerServerId: data.dockerServerId || undefined,
dockerContainerName: data.dockerContainerName || undefined, dockerContainerName: data.dockerContainerName || undefined,
serverId: data.serverId || undefined, serverId: data.serverId || undefined,

View File

@ -206,8 +206,8 @@ export interface TeamApplication extends BaseResponse {
// 运行时配置字段 // 运行时配置字段
runtimeType?: RuntimeType; // 运行时类型 runtimeType?: RuntimeType; // 运行时类型
k8sSystemId?: number; // K8S系统ID k8sSystemId?: number; // K8S系统ID
k8sNamespaceId?: number; // K8S命名空间ID k8sNamespaceName?: string; // K8S命名空间名称
k8sDeploymentId?: number; // K8S Deployment ID k8sDeploymentName?: string; // K8S Deployment名称
dockerServerId?: number; // Docker服务器ID dockerServerId?: number; // Docker服务器ID
dockerContainerName?: string; // Docker容器名称 dockerContainerName?: string; // Docker容器名称
serverId?: number; // 服务器ID serverId?: number; // 服务器ID
@ -251,8 +251,8 @@ export interface TeamApplicationRequest {
// 运行时配置字段 // 运行时配置字段
runtimeType?: RuntimeType; // 运行时类型 runtimeType?: RuntimeType; // 运行时类型
k8sSystemId?: number; // K8S系统ID k8sSystemId?: number; // K8S系统ID
k8sNamespaceId?: number; // K8S命名空间ID k8sNamespaceName?: string; // K8S命名空间名称
k8sDeploymentId?: number; // K8S Deployment ID k8sDeploymentName?: string; // K8S Deployment名称
dockerServerId?: number; // Docker服务器ID dockerServerId?: number; // Docker服务器ID
dockerContainerName?: string; // Docker容器名称 dockerContainerName?: string; // Docker容器名称
serverId?: number; // 服务器ID serverId?: number; // 服务器ID