feat: 模型管理初步联调完成
parent
cff535675c
commit
c427830ef6
@ -0,0 +1,11 @@
|
|||||||
|
/*
|
||||||
|
* @Author: donghao donghao@supervision.ltd
|
||||||
|
* @Date: 2024-06-04 15:13:34
|
||||||
|
* @LastEditors: donghao donghao@supervision.ltd
|
||||||
|
* @LastEditTime: 2024-06-04 15:25:13
|
||||||
|
* @FilePath: \general-ai-platform-web\src\components\UploadFile\index.ts
|
||||||
|
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||||
|
*/
|
||||||
|
import proFormUploadDraggerToken from './src/formUploadDraggerToken';
|
||||||
|
|
||||||
|
export const FormUploadDraggerToken = proFormUploadDraggerToken;
|
||||||
@ -0,0 +1,15 @@
|
|||||||
|
/*
|
||||||
|
* @Author: donghao donghao@supervision.ltd
|
||||||
|
* @Date: 2024-04-26 11:09:49
|
||||||
|
* @LastEditors: donghao donghao@supervision.ltd
|
||||||
|
* @LastEditTime: 2024-06-05 14:50:40
|
||||||
|
* @FilePath: \general-ai-platform-web\src\components\UploadFile\typing.ts
|
||||||
|
* @Description: 上传的类型文件
|
||||||
|
*/
|
||||||
|
|
||||||
|
export interface FormUploadDraggerTokenProps extends ProFormUploadDraggerProps {
|
||||||
|
afterUploadFile?: (data: any) => void; // 上传完成后
|
||||||
|
afterRemoveFile?: (file: UploadFile<R<string>>) => void; // 删除开始
|
||||||
|
requestDelFile?: (status: boolean) => void;
|
||||||
|
nextText?: string | React.ReactNode;
|
||||||
|
}
|
||||||
@ -0,0 +1,241 @@
|
|||||||
|
import { CommButton } from '@/components/Button';
|
||||||
|
import { apiModelHubEdit, apiModelHubSync } from '@/services/business/model';
|
||||||
|
import {
|
||||||
|
ModalForm,
|
||||||
|
ProForm,
|
||||||
|
ProFormSelect,
|
||||||
|
ProFormText,
|
||||||
|
ProFormTextArea,
|
||||||
|
} from '@ant-design/pro-components';
|
||||||
|
import { FormattedMessage, useIntl } from '@umijs/max';
|
||||||
|
import { Form, message } from 'antd';
|
||||||
|
import React, { useEffect, useState } from 'react';
|
||||||
|
|
||||||
|
import { isSuccessApi } from '@/utils/forApi';
|
||||||
|
import {
|
||||||
|
proFormSmallItemStyleProps,
|
||||||
|
proFormSmallModelWidth,
|
||||||
|
} from '../../../../../config/defaultForm';
|
||||||
|
|
||||||
|
export type UpdateFormProps = {
|
||||||
|
updateModalOpen: boolean;
|
||||||
|
values: Record<string, any>;
|
||||||
|
handleModal: () => void;
|
||||||
|
reload: any;
|
||||||
|
};
|
||||||
|
const UpdateForm: React.FC<UpdateFormProps> = (props) => {
|
||||||
|
const intl = useIntl();
|
||||||
|
const [openFiles, setOpenFiles] = useState<boolean>(false);
|
||||||
|
const [form] = Form.useForm<API.ModelCategory>();
|
||||||
|
function resetForm() {
|
||||||
|
form.resetFields();
|
||||||
|
}
|
||||||
|
useEffect(() => {
|
||||||
|
if (props.updateModalOpen && props.values?.id) {
|
||||||
|
form.setFieldsValue({ ...props.values });
|
||||||
|
console.log(props.values, 'useEffect_values');
|
||||||
|
} else {
|
||||||
|
resetForm();
|
||||||
|
}
|
||||||
|
}, [props.updateModalOpen, props.values]);
|
||||||
|
return (
|
||||||
|
<ModalForm<API.ModelCategory>
|
||||||
|
className="gn_form gn_modal_form"
|
||||||
|
width={proFormSmallModelWidth}
|
||||||
|
title={intl.formatMessage({
|
||||||
|
id: 'model_runtimeLib.list.table.form.action.edit',
|
||||||
|
defaultMessage: '编辑',
|
||||||
|
})}
|
||||||
|
open={props.updateModalOpen}
|
||||||
|
form={form}
|
||||||
|
autoFocusFirstInput
|
||||||
|
modalProps={{
|
||||||
|
destroyOnClose: true,
|
||||||
|
onCancel: () => props.handleModal(),
|
||||||
|
}}
|
||||||
|
submitTimeout={2000}
|
||||||
|
onFinish={async (values) => {
|
||||||
|
console.log(values, 'add_finish_values');
|
||||||
|
let resp = await apiModelHubEdit({ ...values, id: props.values.id });
|
||||||
|
if (isSuccessApi(resp)) {
|
||||||
|
message.success(
|
||||||
|
intl.formatMessage({ id: 'common.action.success', defaultMessage: '$$$' }),
|
||||||
|
);
|
||||||
|
props.reload();
|
||||||
|
props.handleModal();
|
||||||
|
} else {
|
||||||
|
message.error(
|
||||||
|
resp?.meta?.message ||
|
||||||
|
intl.formatMessage({ id: 'common.action.failure', defaultMessage: '$$$' }),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
return true;
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<ProForm.Group>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="name"
|
||||||
|
label={
|
||||||
|
<FormattedMessage id="model_runtimeLib.list.table.form.name" defaultMessage="名称" />
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '$$$',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'model_runtimeLib.list.table.form.name',
|
||||||
|
defaultMessage: '$$$',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="model_runtimeLib.list.table.form.rule.required.name"
|
||||||
|
defaultMessage="name is required"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProForm.Group>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.column2Width - 30}
|
||||||
|
name="host"
|
||||||
|
initialValue={'192.168.10.94'}
|
||||||
|
label={
|
||||||
|
<FormattedMessage id="model_runtimeLib.list.table.form.IP" defaultMessage="IP地址" />
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '$$$',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'model_runtimeLib.list.table.form.IP',
|
||||||
|
defaultMessage: '$$$',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="model_runtimeLib.list.table.form.rule.required.IP"
|
||||||
|
defaultMessage="name is required"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.column2Width - 30}
|
||||||
|
name="port"
|
||||||
|
initialValue={'5000'}
|
||||||
|
label={
|
||||||
|
<FormattedMessage id="model_runtimeLib.list.table.form.port" defaultMessage="端口" />
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '$$$',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'model_runtimeLib.list.table.form.port',
|
||||||
|
defaultMessage: '$$$',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="model_runtimeLib.list.table.form.rule.required.port"
|
||||||
|
defaultMessage="name is required"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<CommButton
|
||||||
|
style={{
|
||||||
|
width: '52px',
|
||||||
|
height: '32px',
|
||||||
|
marginTop: '30px',
|
||||||
|
marginLeft: '-4px',
|
||||||
|
borderRadius: '4px',
|
||||||
|
borderColor: '#154ddd',
|
||||||
|
color: '#154ddd',
|
||||||
|
}}
|
||||||
|
onClick={() => {
|
||||||
|
const { host, port } = form.getFieldsValue();
|
||||||
|
if (host && port) {
|
||||||
|
setOpenFiles(true);
|
||||||
|
} else {
|
||||||
|
message.error('请填写IP和端口');
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log(form.getFieldsValue(), 'searchIP');
|
||||||
|
}}
|
||||||
|
buttonLabel={<FormattedMessage id="pages.searchTable.search" defaultMessage="查询" />}
|
||||||
|
></CommButton>
|
||||||
|
</ProForm.Group>
|
||||||
|
{openFiles ? (
|
||||||
|
<ProFormSelect
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="path"
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_select',
|
||||||
|
defaultMessage: '$$$',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'model_runtimeLib.list.table.form.fileName',
|
||||||
|
defaultMessage: '$$$',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
showSearch
|
||||||
|
debounceTime={500}
|
||||||
|
request={async () => {
|
||||||
|
const { host, port } = form.getFieldsValue();
|
||||||
|
const { data } = await apiModelHubSync({
|
||||||
|
host,
|
||||||
|
port,
|
||||||
|
});
|
||||||
|
return data?.data?.map((v: Record<string, any>) => {
|
||||||
|
return { ...v, label: v, value: v };
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="model_runtimeLib.list.table.form.rule.required.fileName"
|
||||||
|
defaultMessage="name is required"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
) : (
|
||||||
|
<></>
|
||||||
|
)}
|
||||||
|
|
||||||
|
<ProFormTextArea
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="comment"
|
||||||
|
label={
|
||||||
|
<FormattedMessage id="model_runtimeLib.list.table.form.remark" defaultMessage="简介" />
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '$$$',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'model_runtimeLib.list.table.form.rule.required.remark',
|
||||||
|
defaultMessage: '$$$',
|
||||||
|
})}`}
|
||||||
|
required={false}
|
||||||
|
disabled={false}
|
||||||
|
/>
|
||||||
|
</ProForm.Group>
|
||||||
|
</ModalForm>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
export default UpdateForm;
|
||||||
@ -0,0 +1,22 @@
|
|||||||
|
/*
|
||||||
|
* @Author: donghao donghao@supervision.ltd
|
||||||
|
* @Date: 2024-06-05 13:32:31
|
||||||
|
* @LastEditors: donghao donghao@supervision.ltd
|
||||||
|
* @LastEditTime: 2024-06-06 13:13:25
|
||||||
|
* @FilePath: \general-ai-platform-web\src\utils\is.ts
|
||||||
|
* @Description: 校验方法库
|
||||||
|
*/
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @是否是JSONString
|
||||||
|
* @param jsonString 目标字符串
|
||||||
|
* @returns boolean
|
||||||
|
*/
|
||||||
|
export function isValidJson(jsonString) {
|
||||||
|
try {
|
||||||
|
JSON.parse(jsonString);
|
||||||
|
return true;
|
||||||
|
} catch (e) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue