From 335e86c5be923860a5ac173a5eb1f977d149e026 Mon Sep 17 00:00:00 2001
From: dengqichen <dengqichen@iscmtech.com>
Date: Fri, 17 Jan 2025 17:39:48 +0800
Subject: [PATCH] 1

---
 .../List/components/DeploymentConfigModal.tsx | 181 +++++++++---------
 1 file changed, 95 insertions(+), 86 deletions(-)

diff --git a/frontend/src/pages/Deploy/Deployment/List/components/DeploymentConfigModal.tsx b/frontend/src/pages/Deploy/Deployment/List/components/DeploymentConfigModal.tsx
index ad47601a..d43fc6d9 100644
--- a/frontend/src/pages/Deploy/Deployment/List/components/DeploymentConfigModal.tsx
+++ b/frontend/src/pages/Deploy/Deployment/List/components/DeploymentConfigModal.tsx
@@ -92,78 +92,97 @@ const DeploymentConfigModal: React.FC<DeploymentConfigModalProps> = ({
     const schema: ISchema = {
         type: 'object',
         properties: {
-            layout: {
-                type: 'void',
-                'x-component': 'FormGrid',
-                'x-component-props': {
-                    maxColumns: 2,
-                    minColumns: 2,
-                    columnGap: 24
-                },
-                properties: {
-                    externalSystemId: {
-                        type: 'string',
-                        title: '三方系统',
-                        'x-decorator': 'FormItem',
-                        'x-component': 'Select',
-                        'x-component-props': {
-                            style: {
-                                width: '100%'
-                            },
-                            placeholder: '请选择三方系统',
-                            allowClear: true
-                        },
-                        'x-reactions': ["{{useAsyncDataSource('/api/v1/external-system/list', { params: { type: 'JENKINS' }, mapping: { label: 'name', value: 'id' } })}}"],
-                    },
-                    viewId: {
-                        type: 'string',
-                        title: 'Jenkins视图',
-                        'x-decorator': 'FormItem',
-                        'x-component': 'Select',
-                        'x-component-props': {
-                            style: {
-                                width: '100%'
-                            },
-                            placeholder: '请选择Jenkins视图',
-                            disabled: '{{!$form.values.externalSystemId}}',
-                            allowClear: true
-                        },
-                        'x-reactions': {
-                            dependencies: ['externalSystemId'],
-                            fulfill: {
-                                state: {
-                                    value: undefined
-                                },
-                                run: '{{function runEffect(){if($deps[0]){useAsyncDataSource("/api/v1/jenkins-view/list", { params: { externalSystemId: $deps[0] }, mapping: { label: "viewName", value: "id" } })($self)}else{$self.dataSource=[];}};runEffect()}}'
-                            }
-                        },
-                        "description": "{{$self.dataSource && $self.value ? ($self.dataSource.find(item => item.value === $self.value)?.extra?.description) : undefined}}"
-                    },
-                    jobId: {
-                        type: 'string',
-                        title: 'Jenkins作业',
-                        'x-decorator': 'FormItem',
-                        'x-component': 'Select',
-                        'x-component-props': {
-                            style: {
-                                width: '100%'
-                            },
-                            placeholder: '请选择Jenkins作业',
-                            disabled: '{{!$form.values.viewId}}',
-                            allowClear: true
-                        },
-                        'x-reactions': {
-                            dependencies: ['externalSystemId', 'viewId'],
-                            fulfill: {
-                                state: {
-                                    value: undefined
-                                },
-                                run: '{{function runEffect(){if($deps[0] && $deps[1]){useAsyncDataSource("/api/v1/jenkins-job/list", { params: { externalSystemId: $deps[0], viewId: $deps[1] }, mapping: { label: "jobName", value: "id" } })($self)}else{$self.dataSource=[];}};runEffect()}}'
-                            }
-                        },
-                        "description": "{{$self.dataSource && $self.value ? ($self.dataSource.find(item => item.value === $self.value)?.extra?.description) : undefined}}"
+            externalSystemId: {
+                type: 'string',
+                title: '三方系统',
+                'x-decorator': 'FormItem',
+                'x-decorator-props': {
+                    labelCol: 24,
+                    wrapperCol: 24,
+                    layout: 'vertical',
+                    colon: false,
+                    labelAlign: 'left',
+                    style: {
+                        marginBottom: 24
                     }
-                }
+                },
+                'x-component': 'Select',
+                'x-component-props': {
+                    style: {
+                        width: '100%'
+                    },
+                    placeholder: '请选择三方系统',
+                    allowClear: true
+                },
+                'x-reactions': ["{{useAsyncDataSource('/api/v1/external-system/list', { params: { type: 'JENKINS' }, mapping: { label: 'name', value: 'id' } })}}"],
+            },
+            viewId: {
+                type: 'string',
+                title: 'Jenkins视图',
+                'x-decorator': 'FormItem',
+                'x-decorator-props': {
+                    labelCol: 24,
+                    wrapperCol: 24,
+                    layout: 'vertical',
+                    colon: false,
+                    labelAlign: 'left',
+                    style: {
+                        marginBottom: 24
+                    }
+                },
+                'x-component': 'Select',
+                'x-component-props': {
+                    style: {
+                        width: '100%'
+                    },
+                    placeholder: '请选择Jenkins视图',
+                    disabled: '{{!$form.values.externalSystemId}}',
+                    allowClear: true
+                },
+                'x-reactions': {
+                    dependencies: ['externalSystemId'],
+                    fulfill: {
+                        state: {
+                            value: undefined
+                        },
+                        run: '{{function runEffect(){if($deps[0]){useAsyncDataSource("/api/v1/jenkins-view/list", { params: { externalSystemId: $deps[0] }, mapping: { label: "viewName", value: "id" } })($self)}else{$self.dataSource=[];}};runEffect()}}'
+                    }
+                },
+                "description": "{{$self.dataSource && $self.value ? ($self.dataSource.find(item => item.value === $self.value)?.extra?.description) : undefined}}"
+            },
+            jobId: {
+                type: 'string',
+                title: 'Jenkins作业',
+                'x-decorator': 'FormItem',
+                'x-decorator-props': {
+                    labelCol: 24,
+                    wrapperCol: 24,
+                    layout: 'vertical',
+                    colon: false,
+                    labelAlign: 'left',
+                    style: {
+                        marginBottom: 24
+                    }
+                },
+                'x-component': 'Select',
+                'x-component-props': {
+                    style: {
+                        width: '100%'
+                    },
+                    placeholder: '请选择Jenkins作业',
+                    disabled: '{{!$form.values.viewId}}',
+                    allowClear: true
+                },
+                'x-reactions': {
+                    dependencies: ['externalSystemId', 'viewId'],
+                    fulfill: {
+                        state: {
+                            value: undefined
+                        },
+                        run: '{{function runEffect(){if($deps[0] && $deps[1]){useAsyncDataSource("/api/v1/jenkins-job/list", { params: { externalSystemId: $deps[0], viewId: $deps[1] }, mapping: { label: "jobName", value: "id" } })($self)}else{$self.dataSource=[];}};runEffect()}}'
+                    }
+                },
+                "description": "{{$self.dataSource && $self.value ? ($self.dataSource.find(item => item.value === $self.value)?.extra?.description) : undefined}}"
             }
         }
     };
@@ -171,24 +190,14 @@ const DeploymentConfigModal: React.FC<DeploymentConfigModalProps> = ({
     return (
         <>
             <Modal
-                title={`部署配置`}
+                title="部署配置"
                 open={open}
-                width={800}
-                className="deployment-config-modal"
-                maskClosable={false}
-                destroyOnClose
-                style={{top: 50}}
-                styles={{
-                    body: {
-                        height: 'calc(100vh - 250px)',
-                        overflowY: 'auto',
-                        padding: '24px'
-                    }
-                }}
+                onCancel={onCancel}
+                onOk={() => form.submit(onSuccess)}
+                width={600}
             >
                 <FormProvider form={form}>
-                    <SchemaField schema={schema} scope={{useAsyncDataSource}}/>
-                    
+                    <SchemaField schema={schema}/>
                 </FormProvider>
             </Modal>
         </>