feat: add intances list

2026-05-11 19:49:21 +08:00
parent 75d7eff63b
commit 3ae49dc826
18 changed files with 692 additions and 6 deletions
@@ -0,0 +1,68 @@
+import {
+  Input as CInput,
+  InputNumber as CInputNumber
+} from '@gpustack/core-ui';
+import { Form } from 'antd';
+import { FormData } from '../config/types';
+
+const Basic = () => {
+  return (
+    <>
+      <Form.Item<FormData>
+        name="name"
+        rules={[
+          {
+            required: true,
+            message: '请输入实例名称'
+          }
+        ]}
+      >
+        <CInput.Input label="实例名称" required />
+      </Form.Item>
+      <Form.Item<FormData>
+        name="image"
+        rules={[
+          {
+            required: true,
+            message: '请输入镜像'
+          }
+        ]}
+      >
+        <CInput.Input label="镜像" required />
+      </Form.Item>
+      <div style={{ display: 'flex', gap: 16 }}>
+        <div style={{ flex: 1 }}>
+          <Form.Item<FormData>
+            name="gpu_count"
+            rules={[
+              {
+                required: true,
+                message: '请输入 GPU 数量'
+              }
+            ]}
+          >
+            <CInputNumber min={0} precision={0} label="GPU 数量" required />
+          </Form.Item>
+        </div>
+        <div style={{ flex: 1 }}>
+          <Form.Item<FormData>
+            name="replicas"
+            rules={[
+              {
+                required: true,
+                message: '请输入副本数'
+              }
+            ]}
+          >
+            <CInputNumber min={1} precision={0} label="副本数" required />
+          </Form.Item>
+        </div>
+      </div>
+      <Form.Item<FormData> name="description">
+        <CInput.TextArea label="描述" scaleSize />
+      </Form.Item>
+    </>
+  );
+};
+
+export default Basic;
@@ -0,0 +1,66 @@
+import { PageAction } from '@/config';
+import { PageActionType } from '@/config/types';
+import { Form } from 'antd';
+import { forwardRef, useEffect, useImperativeHandle } from 'react';
+import { FormData, ListItem } from '../config/types';
+import Basic from './basic';
+
+interface InstanceFormProps {
+  ref?: any;
+  open: boolean;
+  action: PageActionType;
+  currentData?: ListItem | null;
+  onFinish: (values: FormData) => Promise<void>;
+}
+
+const GPUServiceInstanceForm: React.FC<InstanceFormProps> = forwardRef(
+  (props, ref) => {
+    const { action, currentData, open, onFinish } = props;
+    const [form] = Form.useForm<FormData>();
+
+    useEffect(() => {
+      if (!open) {
+        form.resetFields();
+        return;
+      }
+
+      if (action === PageAction.EDIT && currentData) {
+        form.setFieldsValue({
+          name: currentData.name,
+          description: currentData.description,
+          image: currentData.image,
+          gpu_count: currentData.gpu_count,
+          replicas: currentData.replicas
+        });
+        return;
+      }
+
+      form.setFieldsValue({
+        gpu_count: 1,
+        replicas: 1
+      });
+    }, [action, currentData, form, open]);
+
+    useImperativeHandle(ref, () => ({
+      submit: () => {
+        form.submit();
+      },
+      resetFields: () => {
+        form.resetFields();
+      }
+    }));
+
+    return (
+      <Form
+        name="gpuServiceInstanceForm"
+        form={form}
+        onFinish={onFinish}
+        preserve={false}
+      >
+        <Basic />
+      </Form>
+    );
+  }
+);
+
+export default GPUServiceInstanceForm;