feat: cluster ux

2025-09-16 11:26:17 +08:00
parent 4711c848f8
commit ed49e03802
11 changed files with 570 additions and 224 deletions
@@ -0,0 +1,90 @@
+import SealSelect from '@/components/seal-form/seal-select';
+import { useIntl } from '@umijs/max';
+import { Form } from 'antd';
+import React from 'react';
+import { ClusterFormData as FormData } from '../config/types';
+
+interface CloudProviderProps {
+  provider: string; // 'kubernetes' | 'digitalocean';
+}
+
+const CloudProvider: React.FC<CloudProviderProps> = () => {
+  const intl = useIntl();
+  return (
+    <>
+      <Form.Item<FormData>
+        name="credential_id"
+        rules={[
+          {
+            required: true,
+            message: intl.formatMessage(
+              { id: 'common.form.rule.input' },
+              {
+                name: 'credential'
+              }
+            )
+          }
+        ]}
+      >
+        <SealSelect
+          label="Credential"
+          required
+          options={['credential1', 'credential2', 'credential3'].map(
+            (item) => ({
+              label: item,
+              value: item
+            })
+          )}
+        ></SealSelect>
+      </Form.Item>
+      <Form.Item<FormData>
+        name="region"
+        rules={[
+          {
+            required: true,
+            message: intl.formatMessage(
+              { id: 'common.form.rule.input' },
+              {
+                name: 'Region'
+              }
+            )
+          }
+        ]}
+      >
+        <SealSelect
+          label="Region"
+          required
+          options={['Hangzhou', 'Guangzhou', 'Shenzhen'].map((item) => ({
+            label: item,
+            value: item
+          }))}
+        ></SealSelect>
+      </Form.Item>
+      <Form.Item<FormData>
+        name="zone"
+        rules={[
+          {
+            required: true,
+            message: intl.formatMessage(
+              { id: 'common.form.rule.input' },
+              {
+                name: 'Zone'
+              }
+            )
+          }
+        ]}
+      >
+        <SealSelect
+          label="Zone"
+          required
+          options={['A100', 'V100', 'T4'].map((item) => ({
+            label: item,
+            value: item
+          }))}
+        ></SealSelect>
+      </Form.Item>
+    </>
+  );
+};
+
+export default CloudProvider;