139 lines
3.9 KiB
TypeScript
139 lines
3.9 KiB
TypeScript
import AutoTooltip from '@/components/auto-tooltip';
|
|
import SealSelect from '@/components/seal-form/seal-select';
|
|
import { PageAction } from '@/config';
|
|
import useAppUtils from '@/hooks/use-app-utils';
|
|
import { useIntl } from '@umijs/max';
|
|
import { Form, Select } from 'antd';
|
|
import _ from 'lodash';
|
|
import React, { useEffect } from 'react';
|
|
import { ProfileValueMap } from '../config';
|
|
import { useFormContext } from '../config/form-context';
|
|
import { FormData } from '../config/types';
|
|
import useQueryDataset from '../services/use-query-dataset';
|
|
import useQueryProfiles from '../services/use-query-profiles';
|
|
import RandomSettingsForm from './random-settings';
|
|
|
|
const DatasetForm: React.FC = () => {
|
|
const intl = useIntl();
|
|
const form = Form.useFormInstance();
|
|
const { getRuleMessage } = useAppUtils();
|
|
const { action, open } = useFormContext();
|
|
const {
|
|
datasetList,
|
|
loading: datasetLoading,
|
|
fetchDatasetData,
|
|
cancelRequest: cancelDatasetRequest
|
|
} = useQueryDataset();
|
|
const {
|
|
profilesOptions,
|
|
fetchProfilesData,
|
|
cancelRequest: cancelProfilesRequest
|
|
} = useQueryProfiles();
|
|
|
|
const handleProfileChange = (value: string, option: any) => {
|
|
if (value !== ProfileValueMap.Custom) {
|
|
const dataset_id = datasetList.find(
|
|
(item) => item.label === option.config?.dataset_name
|
|
)?.value;
|
|
|
|
form.setFieldsValue({
|
|
dataset_id: dataset_id,
|
|
..._.omit(option?.config, ['description', 'dataset_source'])
|
|
});
|
|
}
|
|
};
|
|
|
|
// Initialize profile when open form
|
|
const initProfile = (
|
|
value: string,
|
|
option: any,
|
|
datasetList: Global.BaseOption<number | string>[]
|
|
) => {
|
|
if (value !== ProfileValueMap.Custom) {
|
|
const dataset_id = datasetList.find(
|
|
(item) => item.label === option.config?.dataset_name
|
|
)?.value;
|
|
|
|
form.setFieldsValue({
|
|
profile: value,
|
|
dataset_id: dataset_id,
|
|
..._.omit(option?.config, ['description', 'dataset_source'])
|
|
});
|
|
}
|
|
};
|
|
|
|
useEffect(() => {
|
|
if (!open) {
|
|
cancelDatasetRequest();
|
|
cancelProfilesRequest();
|
|
}
|
|
|
|
if (open) {
|
|
const init = async () => {
|
|
const profiles = await fetchProfilesData();
|
|
const datasets = await fetchDatasetData();
|
|
// set default profile
|
|
if (profiles?.length > 0) {
|
|
const throughputProfile = profiles.find(
|
|
(item) => item.value === ProfileValueMap.ThroughputMedium
|
|
);
|
|
if (throughputProfile) {
|
|
initProfile(throughputProfile.value, throughputProfile, datasets);
|
|
}
|
|
}
|
|
};
|
|
init();
|
|
}
|
|
}, [open]);
|
|
|
|
return (
|
|
<>
|
|
<Form.Item<FormData>
|
|
data-field="profile"
|
|
name="profile"
|
|
rules={[
|
|
{
|
|
required: true,
|
|
message: getRuleMessage('select', 'benchmark.form.profile')
|
|
}
|
|
]}
|
|
>
|
|
<SealSelect
|
|
disabled={action === PageAction.EDIT}
|
|
onChange={handleProfileChange}
|
|
label={intl.formatMessage({ id: 'benchmark.form.profile' })}
|
|
required
|
|
>
|
|
{profilesOptions?.map((item: any) => (
|
|
<Select.Option
|
|
key={item.value}
|
|
value={item.value}
|
|
label={item.label}
|
|
config={item.config}
|
|
>
|
|
<AutoTooltip
|
|
ghost
|
|
showTitle={!!item.tips}
|
|
title={
|
|
item?.tips
|
|
? intl.formatMessage({ id: item?.tips || '' })
|
|
: false
|
|
}
|
|
>
|
|
{intl.formatMessage({ id: item?.label || '' })}
|
|
</AutoTooltip>
|
|
</Select.Option>
|
|
))}
|
|
</SealSelect>
|
|
</Form.Item>
|
|
|
|
<RandomSettingsForm
|
|
datasetList={datasetList}
|
|
datasetLoading={datasetLoading}
|
|
></RandomSettingsForm>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default DatasetForm;
|