feat: 统一使用tableActionCard做为列表操作栏统一控件
parent
60228f360b
commit
7ec6df5540
@ -0,0 +1,56 @@
|
||||
/*
|
||||
* @Author: zhoux zhouxia@supervision.ltd
|
||||
* @Date: 2023-11-14 15:49:36
|
||||
* @LastEditors: zhoux zhouxia@supervision.ltd
|
||||
* @LastEditTime: 2023-11-14 16:07:11
|
||||
* @FilePath: \general-ai-platform-web\src\components\TableActionCard\index.tsx
|
||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||
*/
|
||||
|
||||
import { DownOutlined } from '@ant-design/icons';
|
||||
import { Dropdown } from 'antd';
|
||||
import React from 'react';
|
||||
|
||||
//TODO 表单的操作按钮集合
|
||||
type TableActionItemProps = {
|
||||
renderActions: any[];
|
||||
};
|
||||
|
||||
const TableActionCard: React.FC<TableActionItemProps> = (props) => {
|
||||
const { renderActions } = props;
|
||||
const maxActionCount = 3;
|
||||
if (renderActions.length <= maxActionCount) {
|
||||
return renderActions.map((item) => {
|
||||
return <>{item}</>;
|
||||
});
|
||||
}
|
||||
const prevActions: any[] = [];
|
||||
const moreActions: { key: string; label: any }[] = [];
|
||||
// eslint-disable-next-line array-callback-return
|
||||
renderActions.map((item, index) => {
|
||||
if (index < maxActionCount - 1) {
|
||||
prevActions.push(item);
|
||||
} else {
|
||||
moreActions.push({
|
||||
key: index + '',
|
||||
label: item,
|
||||
});
|
||||
}
|
||||
// eslint-disable-next-line react/jsx-key
|
||||
});
|
||||
return (
|
||||
<>
|
||||
{prevActions.map((item, index) => {
|
||||
return <div key={index}>{item}</div>;
|
||||
})}
|
||||
<Dropdown menu={{ items: moreActions }}>
|
||||
<a>
|
||||
更多
|
||||
<DownOutlined />
|
||||
</a>
|
||||
</Dropdown>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default TableActionCard
|
||||
@ -1,95 +1,209 @@
|
||||
import {ModalForm,ProForm} from '@ant-design/pro-components';import {ProFormText} from '@ant-design/pro-components';import {ProFormSelect} from '@ant-design/pro-components';
|
||||
import {FormattedMessage, useIntl} from '@umijs/max';
|
||||
import {postProjectGetProjectFkSelect} from "@/services/project/Project";
|
||||
import {postBusinessImageCreateBusinessImage} from "@/services/resource/BusinessImage";
|
||||
import React, {useState} from 'react';
|
||||
import {Button, Form, message} from 'antd';
|
||||
import { postProjectGetProjectFkSelect } from '@/services/project/Project';
|
||||
import { postBusinessImageCreateBusinessImage } from '@/services/resource/BusinessImage';
|
||||
import { ModalForm, ProForm, ProFormSelect, ProFormText } from '@ant-design/pro-components';
|
||||
import { FormattedMessage, useIntl } from '@umijs/max';
|
||||
import { Form, message } from 'antd';
|
||||
import { proFormItemStyleProps, proFormModelWidth } from '../../../../../config/defaultForm';
|
||||
import React from 'react';
|
||||
export type FormValueType = {
|
||||
target?: string;
|
||||
template?: string;
|
||||
type?: string;
|
||||
time?: string;
|
||||
frequency?: string;
|
||||
} & Partial<API.BusinessImage>;
|
||||
target?: string;
|
||||
template?: string;
|
||||
type?: string;
|
||||
time?: string;
|
||||
frequency?: string;
|
||||
} & Partial<API.BusinessImage>;
|
||||
|
||||
export type CreateFormProps = {
|
||||
createModalOpen: boolean;
|
||||
handleModal: ()=>void;
|
||||
values: Partial<API.BusinessImage>;
|
||||
reload: any;
|
||||
};
|
||||
export type CreateFormProps = {
|
||||
createModalOpen: boolean;
|
||||
handleModal: () => void;
|
||||
values: Partial<API.BusinessImage>;
|
||||
reload: any;
|
||||
};
|
||||
const CreateForm: React.FC<CreateFormProps> = (props) => {
|
||||
const intl = useIntl();
|
||||
const [form] = Form.useForm<API.BusinessImage>();
|
||||
|
||||
const intl = useIntl();
|
||||
const [form] = Form.useForm<API.BusinessImage>();
|
||||
|
||||
return (
|
||||
<ModalForm<API.BusinessImage>
|
||||
title={intl.formatMessage({
|
||||
id: 'common.modal.table.create.title',
|
||||
defaultMessage: '$$$',
|
||||
})}
|
||||
open={props.createModalOpen}
|
||||
form={form}
|
||||
autoFocusFirstInput
|
||||
modalProps={{
|
||||
destroyOnClose: true,
|
||||
onCancel: () => props.handleModal(),
|
||||
}}
|
||||
submitTimeout={2000}
|
||||
onFinish={async (values) => {
|
||||
postBusinessImageCreateBusinessImage(values).then(()=>{
|
||||
message.success(intl.formatMessage({id: 'common.success', defaultMessage: '$$$'}))
|
||||
props.reload()
|
||||
}).catch(()=>{
|
||||
message.error(intl.formatMessage({id: 'common.failure', defaultMessage: '$$$'}))
|
||||
})
|
||||
return (
|
||||
<ModalForm<API.BusinessImage>
|
||||
width={proFormModelWidth}
|
||||
title={intl.formatMessage({
|
||||
id: 'resource.business_image.table.list.add',
|
||||
defaultMessage: '$$$',
|
||||
})}
|
||||
open={props.createModalOpen}
|
||||
form={form}
|
||||
autoFocusFirstInput
|
||||
modalProps={{
|
||||
destroyOnClose: true,
|
||||
onCancel: () => props.handleModal(),
|
||||
}}
|
||||
submitTimeout={2000}
|
||||
onFinish={async (values) => {
|
||||
postBusinessImageCreateBusinessImage(values)
|
||||
.then(() => {
|
||||
message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '$$$' }));
|
||||
props.reload();
|
||||
})
|
||||
.catch(() => {
|
||||
message.error(intl.formatMessage({ id: 'common.failure', defaultMessage: '$$$' }));
|
||||
});
|
||||
props.handleModal();
|
||||
return true;
|
||||
}}
|
||||
>
|
||||
|
||||
<ProForm.Group>
|
||||
<ProFormText width="md" name="name" label={<FormattedMessage id="resource.business_image.table.list.name" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.business_image.table.list.name', defaultMessage: '$$$'})}`} required={true}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: (
|
||||
<FormattedMessage
|
||||
id="resource.business_image.table.rule.required.name"
|
||||
defaultMessage="name is required"
|
||||
/>
|
||||
),
|
||||
},
|
||||
]}
|
||||
/>
|
||||
<ProFormText width="md" name="version" label={<FormattedMessage id="resource.business_image.table.list.version" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.business_image.table.list.version', defaultMessage: '$$$'})}`} required={true}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: (
|
||||
<FormattedMessage
|
||||
id="resource.business_image.table.rule.required.version"
|
||||
defaultMessage="version is required"
|
||||
/>
|
||||
),
|
||||
},
|
||||
]}
|
||||
/>
|
||||
<ProFormSelect width="md" name="projectFkId" label={<FormattedMessage id="resource.business_image.table.list.projectFkId" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.business_image.table.list.projectFkId', defaultMessage: '$$$'})}`} required={true} showSearch debounceTime={1000} request={async (keyWord)=>{
|
||||
const resp = await postProjectGetProjectFkSelect({keyword: keyWord?.keyWords || ''})
|
||||
return resp.data.list.map((v: any)=>{
|
||||
return {
|
||||
label: v.name,
|
||||
value: v.id
|
||||
}
|
||||
})
|
||||
}
|
||||
}/>
|
||||
<ProFormText width="md" name="path" label={<FormattedMessage id="resource.business_image.table.list.path" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.business_image.table.list.path', defaultMessage: '$$$'})}`} required={false}/>
|
||||
<ProFormText width="md" name="startCode" label={<FormattedMessage id="resource.business_image.table.list.startCode" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.business_image.table.list.startCode', defaultMessage: '$$$'})}`} required={false}/>
|
||||
<ProFormText width="md" name="configHash" label={<FormattedMessage id="resource.business_image.table.list.configHash" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.business_image.table.list.configHash', defaultMessage: '$$$'})}`} required={false}/>
|
||||
<ProFormText width="md" name="remark" label={<FormattedMessage id="resource.business_image.table.list.remark" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.business_image.table.list.remark', defaultMessage: '$$$'})}`} required={false}/>
|
||||
</ProForm.Group>
|
||||
</ModalForm>)}
|
||||
>
|
||||
<ProForm.Group>
|
||||
<ProFormText
|
||||
width={proFormItemStyleProps.column2Width}
|
||||
name="name"
|
||||
label={
|
||||
<FormattedMessage id="resource.business_image.table.list.name" defaultMessage="$$$" />
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.business_image.table.list.name',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={true}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: (
|
||||
<FormattedMessage
|
||||
id="resource.business_image.table.rule.required.name"
|
||||
defaultMessage="name is required"
|
||||
/>
|
||||
),
|
||||
},
|
||||
]}
|
||||
/>
|
||||
<ProFormText
|
||||
width={proFormItemStyleProps.column2Width}
|
||||
name="version"
|
||||
label={
|
||||
<FormattedMessage
|
||||
id="resource.business_image.table.list.version"
|
||||
defaultMessage="$$$"
|
||||
/>
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.business_image.table.list.version',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={true}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: (
|
||||
<FormattedMessage
|
||||
id="resource.business_image.table.rule.required.version"
|
||||
defaultMessage="version is required"
|
||||
/>
|
||||
),
|
||||
},
|
||||
]}
|
||||
/>
|
||||
<ProFormSelect
|
||||
width={proFormItemStyleProps.column2Width}
|
||||
name="projectFkId"
|
||||
label={
|
||||
<FormattedMessage
|
||||
id="resource.business_image.table.list.projectFkId"
|
||||
defaultMessage="$$$"
|
||||
/>
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.business_image.table.list.projectFkId',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={true}
|
||||
showSearch
|
||||
debounceTime={1000}
|
||||
request={async (keyWord) => {
|
||||
const resp = await postProjectGetProjectFkSelect({ keyword: keyWord?.keyWords || '' });
|
||||
return resp.data.list.map((v: any) => {
|
||||
return {
|
||||
label: v.name,
|
||||
value: v.id,
|
||||
};
|
||||
});
|
||||
}}
|
||||
/>
|
||||
<ProFormText
|
||||
width={proFormItemStyleProps.column2Width}
|
||||
name="path"
|
||||
label={
|
||||
<FormattedMessage id="resource.business_image.table.list.path" defaultMessage="$$$" />
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.business_image.table.list.path',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={false}
|
||||
/>
|
||||
<ProFormText
|
||||
width={proFormItemStyleProps.column2Width}
|
||||
name="startCode"
|
||||
label={
|
||||
<FormattedMessage
|
||||
id="resource.business_image.table.list.startCode"
|
||||
defaultMessage="$$$"
|
||||
/>
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.business_image.table.list.startCode',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={false}
|
||||
/>
|
||||
<ProFormText
|
||||
width={proFormItemStyleProps.column2Width}
|
||||
name="configHash"
|
||||
label={
|
||||
<FormattedMessage
|
||||
id="resource.business_image.table.list.configHash"
|
||||
defaultMessage="$$$"
|
||||
/>
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.business_image.table.list.configHash',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={false}
|
||||
/>
|
||||
<ProFormText
|
||||
width={proFormItemStyleProps.column2Width}
|
||||
name="remark"
|
||||
label={
|
||||
<FormattedMessage id="resource.business_image.table.list.remark" defaultMessage="$$$" />
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.business_image.table.list.remark',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={false}
|
||||
/>
|
||||
</ProForm.Group>
|
||||
</ModalForm>
|
||||
);
|
||||
};
|
||||
export default CreateForm;
|
||||
|
||||
@ -1,81 +1,159 @@
|
||||
import {ModalForm,ProForm} from '@ant-design/pro-components';import {ProFormText} from '@ant-design/pro-components';import {ProFormSelect} from '@ant-design/pro-components';
|
||||
import {FormattedMessage, useIntl} from '@umijs/max';
|
||||
import {postModelVersionGetModelVersionFkSelect} from "@/services/resource/ModelVersion";
|
||||
import {postModelImageCreateModelImage} from "@/services/resource/ModelImage";
|
||||
import React, {useState} from 'react';
|
||||
import {Button, Form, message} from 'antd';
|
||||
import { postModelImageCreateModelImage } from '@/services/resource/ModelImage';
|
||||
import { postModelVersionGetModelVersionFkSelect } from '@/services/resource/ModelVersion';
|
||||
import { ModalForm, ProForm, ProFormSelect, ProFormText } from '@ant-design/pro-components';
|
||||
import { FormattedMessage, useIntl } from '@umijs/max';
|
||||
import { Form, message } from 'antd';
|
||||
import React from 'react';
|
||||
export type FormValueType = {
|
||||
target?: string;
|
||||
template?: string;
|
||||
type?: string;
|
||||
time?: string;
|
||||
frequency?: string;
|
||||
} & Partial<API.ModelImage>;
|
||||
target?: string;
|
||||
template?: string;
|
||||
type?: string;
|
||||
time?: string;
|
||||
frequency?: string;
|
||||
} & Partial<API.ModelImage>;
|
||||
|
||||
export type CreateFormProps = {
|
||||
createModalOpen: boolean;
|
||||
handleModal: ()=>void;
|
||||
values: Partial<API.ModelImage>;
|
||||
reload: any;
|
||||
};
|
||||
export type CreateFormProps = {
|
||||
createModalOpen: boolean;
|
||||
handleModal: () => void;
|
||||
values: Partial<API.ModelImage>;
|
||||
reload: any;
|
||||
};
|
||||
const CreateForm: React.FC<CreateFormProps> = (props) => {
|
||||
const intl = useIntl();
|
||||
const [form] = Form.useForm<API.ModelImage>();
|
||||
|
||||
const intl = useIntl();
|
||||
const [form] = Form.useForm<API.ModelImage>();
|
||||
|
||||
return (
|
||||
<ModalForm<API.ModelImage>
|
||||
title={intl.formatMessage({
|
||||
id: 'common.modal.table.create.title',
|
||||
defaultMessage: '$$$',
|
||||
})}
|
||||
open={props.createModalOpen}
|
||||
form={form}
|
||||
autoFocusFirstInput
|
||||
modalProps={{
|
||||
destroyOnClose: true,
|
||||
onCancel: () => props.handleModal(),
|
||||
}}
|
||||
submitTimeout={2000}
|
||||
onFinish={async (values) => {
|
||||
postModelImageCreateModelImage(values).then(()=>{
|
||||
message.success(intl.formatMessage({id: 'common.success', defaultMessage: '$$$'}))
|
||||
props.reload()
|
||||
}).catch(()=>{
|
||||
message.error(intl.formatMessage({id: 'common.failure', defaultMessage: '$$$'}))
|
||||
})
|
||||
return (
|
||||
<ModalForm<API.ModelImage>
|
||||
title={intl.formatMessage({
|
||||
id: 'common.modal.table.create.title',
|
||||
defaultMessage: '$$$',
|
||||
})}
|
||||
open={props.createModalOpen}
|
||||
form={form}
|
||||
autoFocusFirstInput
|
||||
modalProps={{
|
||||
destroyOnClose: true,
|
||||
onCancel: () => props.handleModal(),
|
||||
}}
|
||||
submitTimeout={2000}
|
||||
onFinish={async (values) => {
|
||||
postModelImageCreateModelImage(values)
|
||||
.then(() => {
|
||||
message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '$$$' }));
|
||||
props.reload();
|
||||
})
|
||||
.catch(() => {
|
||||
message.error(intl.formatMessage({ id: 'common.failure', defaultMessage: '$$$' }));
|
||||
});
|
||||
props.handleModal();
|
||||
return true;
|
||||
}}
|
||||
>
|
||||
|
||||
<ProForm.Group>
|
||||
<ProFormText width="md" name="name" label={<FormattedMessage id="resource.model_image.table.list.name" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.model_image.table.list.name', defaultMessage: '$$$'})}`} required={true}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: (
|
||||
<FormattedMessage
|
||||
id="resource.model_image.table.rule.required.name"
|
||||
defaultMessage="name is required"
|
||||
/>
|
||||
),
|
||||
},
|
||||
]}
|
||||
/>
|
||||
<ProFormSelect width="md" name="modelVersionFkId" label={<FormattedMessage id="resource.model_image.table.list.modelVersionFkId" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.model_image.table.list.modelVersionFkId', defaultMessage: '$$$'})}`} required={true} showSearch debounceTime={1000} request={async (keyWord)=>{
|
||||
const resp = await postModelVersionGetModelVersionFkSelect({keyword: keyWord?.keyWords || ''})
|
||||
return resp.data.list.map((v: any)=>{
|
||||
return {
|
||||
label: v.name,
|
||||
value: v.id
|
||||
}
|
||||
})
|
||||
}
|
||||
}/>
|
||||
<ProFormText width="md" name="path" label={<FormattedMessage id="resource.model_image.table.list.path" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.model_image.table.list.path', defaultMessage: '$$$'})}`} required={false}/>
|
||||
<ProFormText width="md" name="startCode" label={<FormattedMessage id="resource.model_image.table.list.startCode" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.model_image.table.list.startCode', defaultMessage: '$$$'})}`} required={false}/>
|
||||
<ProFormText width="md" name="remark" label={<FormattedMessage id="resource.model_image.table.list.remark" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.model_image.table.list.remark', defaultMessage: '$$$'})}`} required={false}/>
|
||||
</ProForm.Group>
|
||||
</ModalForm>)}
|
||||
>
|
||||
<ProForm.Group>
|
||||
<ProFormText
|
||||
width="md"
|
||||
name="name"
|
||||
label={
|
||||
<FormattedMessage id="resource.model_image.table.list.name" defaultMessage="$$$" />
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.model_image.table.list.name',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={true}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: (
|
||||
<FormattedMessage
|
||||
id="resource.model_image.table.rule.required.name"
|
||||
defaultMessage="name is required"
|
||||
/>
|
||||
),
|
||||
},
|
||||
]}
|
||||
/>
|
||||
<ProFormSelect
|
||||
width="md"
|
||||
name="modelVersionFkId"
|
||||
label={
|
||||
<FormattedMessage
|
||||
id="resource.model_image.table.list.modelVersionFkId"
|
||||
defaultMessage="$$$"
|
||||
/>
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.model_image.table.list.modelVersionFkId',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={true}
|
||||
showSearch
|
||||
debounceTime={1000}
|
||||
request={async (keyWord) => {
|
||||
const resp = await postModelVersionGetModelVersionFkSelect({
|
||||
keyword: keyWord?.keyWords || '',
|
||||
});
|
||||
return resp.data.list.map((v: any) => {
|
||||
return {
|
||||
label: v.name,
|
||||
value: v.id,
|
||||
};
|
||||
});
|
||||
}}
|
||||
/>
|
||||
<ProFormText
|
||||
width="md"
|
||||
name="path"
|
||||
label={
|
||||
<FormattedMessage id="resource.model_image.table.list.path" defaultMessage="$$$" />
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.model_image.table.list.path',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={false}
|
||||
/>
|
||||
<ProFormText
|
||||
width="md"
|
||||
name="startCode"
|
||||
label={
|
||||
<FormattedMessage id="resource.model_image.table.list.startCode" defaultMessage="$$$" />
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.model_image.table.list.startCode',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={false}
|
||||
/>
|
||||
<ProFormText
|
||||
width="md"
|
||||
name="remark"
|
||||
label={
|
||||
<FormattedMessage id="resource.model_image.table.list.remark" defaultMessage="$$$" />
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.model_image.table.list.remark',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={false}
|
||||
/>
|
||||
</ProForm.Group>
|
||||
</ModalForm>
|
||||
);
|
||||
};
|
||||
export default CreateForm;
|
||||
|
||||
@ -1,82 +1,187 @@
|
||||
import {ModalForm,ProForm} from '@ant-design/pro-components';import {ProFormSelect} from '@ant-design/pro-components';import {ProFormText} from '@ant-design/pro-components';import {ProFormSwitch} from '@ant-design/pro-components';
|
||||
import {FormattedMessage, useIntl} from '@umijs/max';
|
||||
import {postAlgorithmModelGetAlgorithmModelFkSelect} from "@/services/resource/AlgorithmModel";
|
||||
import {postModelVersionCreateModelVersion} from "@/services/resource/ModelVersion";
|
||||
import React, {useState} from 'react';
|
||||
import {Button, Form, message} from 'antd';
|
||||
/*
|
||||
* @Author: zhoux zhouxia@supervision.ltd
|
||||
* @Date: 2023-11-01 13:56:33
|
||||
* @LastEditors: zhoux zhouxia@supervision.ltd
|
||||
* @LastEditTime: 2023-11-14 15:29:30
|
||||
* @FilePath: \general-ai-platform-web\src\pages\Resource\ModelVersionList\components\CreateForm.tsx
|
||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||
*/
|
||||
import { postAlgorithmModelGetAlgorithmModelFkSelect } from '@/services/resource/AlgorithmModel';
|
||||
import { postModelVersionCreateModelVersion } from '@/services/resource/ModelVersion';
|
||||
import {
|
||||
ModalForm,
|
||||
ProForm,
|
||||
ProFormSelect,
|
||||
ProFormSwitch,
|
||||
ProFormText,
|
||||
} from '@ant-design/pro-components';
|
||||
import { FormattedMessage, useIntl } from '@umijs/max';
|
||||
import { Form, message } from 'antd';
|
||||
import React from 'react';
|
||||
export type FormValueType = {
|
||||
target?: string;
|
||||
template?: string;
|
||||
type?: string;
|
||||
time?: string;
|
||||
frequency?: string;
|
||||
} & Partial<API.ModelVersion>;
|
||||
target?: string;
|
||||
template?: string;
|
||||
type?: string;
|
||||
time?: string;
|
||||
frequency?: string;
|
||||
} & Partial<API.ModelVersion>;
|
||||
|
||||
export type CreateFormProps = {
|
||||
createModalOpen: boolean;
|
||||
handleModal: ()=>void;
|
||||
values: Partial<API.ModelVersion>;
|
||||
reload: any;
|
||||
};
|
||||
export type CreateFormProps = {
|
||||
createModalOpen: boolean;
|
||||
handleModal: () => void;
|
||||
values: Partial<API.ModelVersion>;
|
||||
reload: any;
|
||||
};
|
||||
const CreateForm: React.FC<CreateFormProps> = (props) => {
|
||||
const intl = useIntl();
|
||||
const [form] = Form.useForm<API.ModelVersion>();
|
||||
|
||||
const intl = useIntl();
|
||||
const [form] = Form.useForm<API.ModelVersion>();
|
||||
|
||||
return (
|
||||
<ModalForm<API.ModelVersion>
|
||||
title={intl.formatMessage({
|
||||
id: 'common.modal.table.create.title',
|
||||
defaultMessage: '$$$',
|
||||
})}
|
||||
open={props.createModalOpen}
|
||||
form={form}
|
||||
autoFocusFirstInput
|
||||
modalProps={{
|
||||
destroyOnClose: true,
|
||||
onCancel: () => props.handleModal(),
|
||||
}}
|
||||
submitTimeout={2000}
|
||||
onFinish={async (values) => {
|
||||
postModelVersionCreateModelVersion(values).then(()=>{
|
||||
message.success(intl.formatMessage({id: 'common.success', defaultMessage: '$$$'}))
|
||||
props.reload()
|
||||
}).catch(()=>{
|
||||
message.error(intl.formatMessage({id: 'common.failure', defaultMessage: '$$$'}))
|
||||
})
|
||||
return (
|
||||
<ModalForm<API.ModelVersion>
|
||||
title={intl.formatMessage({
|
||||
id: 'resource.model_version.table.list.add',
|
||||
defaultMessage: '$$$',
|
||||
})}
|
||||
open={props.createModalOpen}
|
||||
form={form}
|
||||
autoFocusFirstInput
|
||||
modalProps={{
|
||||
destroyOnClose: true,
|
||||
onCancel: () => props.handleModal(),
|
||||
}}
|
||||
submitTimeout={2000}
|
||||
onFinish={async (values) => {
|
||||
postModelVersionCreateModelVersion(values)
|
||||
.then(() => {
|
||||
message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '$$$' }));
|
||||
props.reload();
|
||||
})
|
||||
.catch(() => {
|
||||
message.error(intl.formatMessage({ id: 'common.failure', defaultMessage: '$$$' }));
|
||||
});
|
||||
props.handleModal();
|
||||
return true;
|
||||
}}
|
||||
>
|
||||
|
||||
<ProForm.Group>
|
||||
<ProFormSelect width="md" name="modelFkId" label={<FormattedMessage id="resource.model_version.table.list.modelFkId" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.model_version.table.list.modelFkId', defaultMessage: '$$$'})}`} required={true} showSearch debounceTime={1000} request={async (keyWord)=>{
|
||||
const resp = await postAlgorithmModelGetAlgorithmModelFkSelect({keyword: keyWord?.keyWords || ''})
|
||||
return resp.data.list.map((v: any)=>{
|
||||
return {
|
||||
label: v.name,
|
||||
value: v.id
|
||||
}
|
||||
})
|
||||
}
|
||||
}/>
|
||||
<ProFormText width="md" name="version" label={<FormattedMessage id="resource.model_version.table.list.version" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.model_version.table.list.version', defaultMessage: '$$$'})}`} required={false}/>
|
||||
<ProFormText width="md" name="path" label={<FormattedMessage id="resource.model_version.table.list.path" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.model_version.table.list.path', defaultMessage: '$$$'})}`} required={true}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: (
|
||||
<FormattedMessage
|
||||
id="resource.model_version.table.rule.required.path"
|
||||
defaultMessage="path is required"
|
||||
/>
|
||||
),
|
||||
},
|
||||
]}
|
||||
/>
|
||||
<ProFormText width="md" name="startCode" label={<FormattedMessage id="resource.model_version.table.list.startCode" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.model_version.table.list.startCode', defaultMessage: '$$$'})}`} required={false}/>
|
||||
<ProFormSwitch width="md" name="isEnable" label={<FormattedMessage id="resource.model_version.table.list.isEnable" defaultMessage="$$$"/>} initialValue={true}/>
|
||||
<ProFormText width="md" name="remark" label={<FormattedMessage id="resource.model_version.table.list.remark" defaultMessage="$$$"/>} placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'resource.model_version.table.list.remark', defaultMessage: '$$$'})}`} required={false}/>
|
||||
</ProForm.Group>
|
||||
</ModalForm>)}
|
||||
>
|
||||
<ProForm.Group>
|
||||
<ProFormSelect
|
||||
width="md"
|
||||
name="modelFkId"
|
||||
label={
|
||||
<FormattedMessage
|
||||
id="resource.model_version.table.list.modelFkId"
|
||||
defaultMessage="$$$"
|
||||
/>
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.model_version.table.list.modelFkId',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={true}
|
||||
showSearch
|
||||
debounceTime={1000}
|
||||
request={async (keyWord) => {
|
||||
const resp = await postAlgorithmModelGetAlgorithmModelFkSelect({
|
||||
keyword: keyWord?.keyWords || '',
|
||||
});
|
||||
return resp.data.list.map((v: any) => {
|
||||
return {
|
||||
label: v.name,
|
||||
value: v.id,
|
||||
};
|
||||
});
|
||||
}}
|
||||
/>
|
||||
<ProFormText
|
||||
width="md"
|
||||
name="version"
|
||||
label={
|
||||
<FormattedMessage id="resource.model_version.table.list.version" defaultMessage="$$$" />
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.model_version.table.list.version',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={false}
|
||||
/>
|
||||
<ProFormText
|
||||
width="md"
|
||||
name="path"
|
||||
label={
|
||||
<FormattedMessage id="resource.model_version.table.list.path" defaultMessage="$$$" />
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.model_version.table.list.path',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={true}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: (
|
||||
<FormattedMessage
|
||||
id="resource.model_version.table.rule.required.path"
|
||||
defaultMessage="path is required"
|
||||
/>
|
||||
),
|
||||
},
|
||||
]}
|
||||
/>
|
||||
<ProFormText
|
||||
width="md"
|
||||
name="startCode"
|
||||
label={
|
||||
<FormattedMessage
|
||||
id="resource.model_version.table.list.startCode"
|
||||
defaultMessage="$$$"
|
||||
/>
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.model_version.table.list.startCode',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={false}
|
||||
/>
|
||||
<ProFormSwitch
|
||||
width="md"
|
||||
name="isEnable"
|
||||
label={
|
||||
<FormattedMessage
|
||||
id="resource.model_version.table.list.isEnable"
|
||||
defaultMessage="$$$"
|
||||
/>
|
||||
}
|
||||
initialValue={true}
|
||||
/>
|
||||
<ProFormText
|
||||
width="md"
|
||||
name="remark"
|
||||
label={
|
||||
<FormattedMessage id="resource.model_version.table.list.remark" defaultMessage="$$$" />
|
||||
}
|
||||
placeholder={`${intl.formatMessage({
|
||||
id: 'common.please_input',
|
||||
defaultMessage: '$$$',
|
||||
})}${intl.formatMessage({
|
||||
id: 'resource.model_version.table.list.remark',
|
||||
defaultMessage: '$$$',
|
||||
})}`}
|
||||
required={false}
|
||||
/>
|
||||
</ProForm.Group>
|
||||
</ModalForm>
|
||||
);
|
||||
};
|
||||
export default CreateForm;
|
||||
|
||||
Loading…
Reference in New Issue