Files
gpustack-ui/src/pages/cluster-management/components/cloud-provider-form.tsx
T
2025-09-16 11:26:17 +08:00

91 lines
2.1 KiB
TypeScript

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, i) => ({
label: item,
value: i
})
)}
></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;