Files
gpustack-ui/src/pages/backends/forms/basic.tsx
T

101 lines
3.2 KiB
TypeScript

import ListInput from '@/components/list-input';
import SealInput from '@/components/seal-form/seal-input';
import SealTextArea from '@/components/seal-form/seal-textarea';
import { PageAction } from '@/config';
import { PageActionType } from '@/config/types';
import useAppUtils from '@/hooks/use-app-utils';
import { useIntl } from '@umijs/max';
import { Form } from 'antd';
import React from 'react';
import { FormData, ListItem } from '../config/types';
type AddModalProps = {
action: PageActionType;
currentData?: ListItem;
};
const BasicForm: React.FC<AddModalProps> = ({ action, currentData }) => {
const form = Form.useFormInstance();
const intl = useIntl();
const { getRuleMessage } = useAppUtils();
return (
<>
<Form.Item<FormData>
name="backend_name"
rules={[
{
required: true,
message: getRuleMessage('input', 'common.table.name')
}
]}
>
<SealInput.Input
trim
addAfter={currentData?.is_built_in ? null : '-custom'}
disabled={action === PageAction.EDIT}
label={intl.formatMessage({ id: 'common.table.name' })}
required
></SealInput.Input>
</Form.Item>
{!currentData?.is_built_in && (
<>
<Form.Item<FormData>
name="health_check_path"
rules={[{ required: false }]}
>
<SealInput.Input
trim
placeholder={intl.formatMessage(
{ id: 'common.help.default' },
{ content: '/v1/models' }
)}
label={intl.formatMessage({ id: 'backend.form.healthCheckPath' })}
></SealInput.Input>
</Form.Item>
<Form.Item name="default_run_command">
<SealTextArea
scaleSize={true}
alwaysFocus={true}
description={intl.formatMessage({
id: 'backend.form.defaultExecuteCommand.tips'
})}
placeholder={intl.formatMessage(
{ id: 'common.help.eg' },
{ content: 'vllm serve {{model_path}} --port {{port}}' }
)}
autoSize={{ minRows: 2, maxRows: 4 }}
label={intl.formatMessage({
id: 'backend.form.defaultExecuteCommand'
})}
></SealTextArea>
</Form.Item>
</>
)}
<Form.Item<FormData>
name="default_backend_param"
rules={[{ required: false }]}
>
<ListInput
dataList={form.getFieldValue('default_backend_param') || []}
onChange={(data: string[]) => {
form.setFieldValue('default_backend_param', data);
}}
btnText={intl.formatMessage({ id: 'backend.form.addParameter' })}
label={intl.formatMessage({
id: 'backend.form.defaultBackendParameters'
})}
></ListInput>
</Form.Item>
<Form.Item<FormData> name="description" rules={[{ required: false }]}>
<SealInput.TextArea
scaleSize={true}
label={intl.formatMessage({ id: 'common.table.description' })}
></SealInput.TextArea>
</Form.Item>
</>
);
};
export default BasicForm;