1

frontend/src/pages/Deploy/Deployment/List/components/DeploymentConfigModal.tsx

@@ -31,7 +31,7 @@ import {
 import {PlusCircle, X, Maximize2} from 'lucide-react';
 import {useForm, useFieldArray} from "react-hook-form";
 import {getApplicationList} from '../../../Application/List/service';
-import {getExternalSystemList, getJenkinsViewList, getJenkinsJobList, createDeploymentConfig} from '../service';
+import {getExternalSystemList, getJenkinsViewList, getJenkinsJobList, createDeploymentConfig, updateDeploymentConfig} from '../service';
 import {getPublishedDefinitions} from '@/pages/Workflow/Definition/service';
 import type {ExternalSystem} from '@/pages/Deploy/External/types';
 import { Editor } from "@/components/Editor";
@@ -95,9 +95,31 @@ interface DeploymentConfigModalProps {
     onSuccess?: () => void;
     environmentId: number;
     buildType: string;
+    initialValues?: {
+        id?: number;
+        buildVariables?: {
+            externalSystemId?: number;
+            viewId?: number;
+            jobId?: number;
+            envs?: Record<string, string>;
+            script?: string;
+        };
+        workflowDefinitionId?: number;
+        application?: {
+            id: number;
+            language: string;
+        };
+    };
 }
 
-const DeploymentConfigModal: React.FC<DeploymentConfigModalProps> = ({open, onCancel, onSuccess, environmentId, buildType}) => {
+const DeploymentConfigModal: React.FC<DeploymentConfigModalProps> = ({
+    open,
+    onCancel,
+    onSuccess,
+    environmentId,
+    buildType,
+    initialValues
+}) => {
     const [applications, setApplications] = useState<Application[]>([]);
     const [externalSystems, setExternalSystems] = useState<ExternalSystem[]>([]);
     const [jenkinsViews, setJenkinsViews] = useState<JenkinsView[]>([]);
@@ -127,16 +149,63 @@ const DeploymentConfigModal: React.FC<DeploymentConfigModalProps> = ({open, onCa
 
     useEffect(() => {
         if (open) {
-            // 获取应用列表
+            // 如果是编辑模式，设置初始值
+            if (initialValues) {
+                // 设置当前应用
+                if (initialValues.application) {
+                    setCurrentApp({
+                        id: initialValues.application.id,
+                        appName: '',  // 这个会在应用列表加载后更新
+                        language: initialValues.application.language
+                    });
+                }
+
+                // 将环境变量对象转换为数组形式
+                const envArray = initialValues.buildVariables?.envs
+                    ? Object.entries(initialValues.buildVariables.envs).map(([key, value]) => ({
+                        key,
+                        value
+                    }))
+                    : [{ key: '', value: '' }];
+
+                // 重置表单值
+                form.reset({
+                    applicationId: initialValues.application?.id,
+                    workflowId: initialValues.workflowDefinitionId,
+                    externalSystemId: initialValues.buildVariables?.externalSystemId,
+                    jenkinsViewId: initialValues.buildVariables?.viewId,
+                    jenkinsJobId: initialValues.buildVariables?.jobId,
+                    script: initialValues.buildVariables?.script || '',
+                    envs: envArray
+                });
+
+                // 加载Jenkins相关数据
+                if (initialValues.buildVariables?.externalSystemId) {
+                    handleExternalSystemChange(initialValues.buildVariables.externalSystemId);
+                }
+            } else {
+                // 新建模式，重置为默认值
+                form.reset({
+                    applicationId: undefined,
+                    externalSystemId: undefined,
+                    jenkinsViewId: undefined,
+                    jenkinsJobId: undefined,
+                    workflowId: undefined,
+                    script: '',
+                    envs: [{ key: '', value: '' }]
+                });
+            }
+
+            // 加载基础数据
             getApplicationList().then(data => {
                 setApplications(data);
             });
-            // 获取外部系统列表
             getExternalSystemList('JENKINS').then(data => {
                 setExternalSystems(data);
             });
+            fetchWorkflows();
         }
-    }, [open]);
+    }, [open, initialValues]);
 
     // 获取工作流列表
     const fetchWorkflows = async () => {
@@ -148,36 +217,30 @@ const DeploymentConfigModal: React.FC<DeploymentConfigModalProps> = ({open, onCa
         }
     };
 
-    useEffect(() => {
-        fetchWorkflows();
-    }, []);
-
     // 当选择外部系统时获取 View 列表
     const handleExternalSystemChange = async (externalSystemId: number) => {
         form.setValue('externalSystemId', externalSystemId);
-        form.setValue('jenkinsViewId', undefined);
+        try {
-        form.setValue('jenkinsJobId', undefined);
+            const data = await getJenkinsViewList(externalSystemId);
-        setJenkinsJobs([]);
+            setJenkinsViews(data);
-        
+            // 如果是编辑模式且有视图ID，加载任务列表
-        if (externalSystemId) {
+            const currentViewId = form.getValues('jenkinsViewId');
-            const views = await getJenkinsViewList(externalSystemId);
+            if (currentViewId) {
-            setJenkinsViews(views);
+                handleJenkinsViewChange(currentViewId);
-        } else {
+            }
-            setJenkinsViews([]);
+        } catch (error) {
+            console.error('Failed to get Jenkins views:', error);
         }
     };
 
-    // 当选择 View 时获取 Job 列表
+    // 当选择视图时获取 Job 列表
-    const handleViewChange = async (viewId: number) => {
+    const handleJenkinsViewChange = async (viewId: number) => {
         form.setValue('jenkinsViewId', viewId);
-        form.setValue('jenkinsJobId', undefined);
+        try {
-        
+            const data = await getJenkinsJobList(form.getValues('externalSystemId'), viewId);
-        const externalSystemId = form.getValues('externalSystemId');
+            setJenkinsJobs(data);
-        if (externalSystemId && viewId) {
+        } catch (error) {
-            const jobs = await getJenkinsJobList(externalSystemId, viewId);
+            console.error('Failed to get Jenkins jobs:', error);
-            setJenkinsJobs(jobs);
-        } else {
-            setJenkinsJobs([]);
         }
     };
 
@@ -204,6 +267,7 @@ const DeploymentConfigModal: React.FC<DeploymentConfigModalProps> = ({open, onCa
             }, {} as Record<string, string>);
 
             const params = {
+                id: initialValues?.id,
                 environmentId,
                 applicationId: values.applicationId,
                 languageType: currentApp?.language,
@@ -218,12 +282,19 @@ const DeploymentConfigModal: React.FC<DeploymentConfigModalProps> = ({open, onCa
                 }
             };
 
-            await createDeploymentConfig(params);
+            if (initialValues?.id) {
-            message.success('保存成功');
+                // 编辑模式
+                await updateDeploymentConfig(params);
+                message.success('更新成功');
+            } else {
+                // 新增模式
+                await createDeploymentConfig(params);
+                message.success('创建成功');
+            }
             onSuccess?.();
         } catch (error) {
-            console.error('Failed to create deployment config:', error);
+            console.error('Failed to save deployment config:', error);
-            message.error('保存失败');
+            message.error(initialValues?.id ? '更新失败' : '创建失败');
         }
     };
 
@@ -337,7 +408,7 @@ const DeploymentConfigModal: React.FC<DeploymentConfigModalProps> = ({open, onCa
                                                     <Select
                                                         onValueChange={(value) => {
                                                             const numValue = Number(value);
-                                                            handleViewChange(numValue);
+                                                            handleJenkinsViewChange(numValue);
                                                         }}
                                                         value={field.value?.toString()}
                                                     >

frontend/src/pages/Deploy/Deployment/List/index.tsx

@@ -410,9 +410,9 @@ const DeploymentConfigList: React.FC = () => {
                     open={modalVisible}
                     onCancel={handleModalClose}
                     onSuccess={handleSuccess}
-                    initialValues={currentConfig}
                     environmentId={selectedEnvId!}
                     buildType={environments.find(env => env.id === selectedEnvId)?.buildType || ''}
+                    initialValues={currentConfig}
                 />
             )}