Yaxin
/
General-AI-Platform-Web
31
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

模型版项目模块分步

Browse Source
develop
chunquansang 2 years ago
parent 14fd60b49e
commit dfc7495975
2 changed files with 177 additions and 91 deletions
Show Stats Download Patch File Download Diff File

262
src/pages/Project/ProjectList/components/MyCreateForm.tsx
Unescape Escape View File

@ -1,9 +1,9 @@
import { postDeviceGroupGetDeviceGroupTree } from '@/services/device/DeviceGroup';
import { postProjectCreateProject } from '@/services/project/Project';
import { postAlgorithmModelGetAlgorithmModelFkSelect } from '@/services/resource/AlgorithmModel';
import { beforeUploadFile } from '@/utils/common';
import { CloseOutlined, SnippetsOutlined } from '@ant-design/icons';
import type { ProFormInstance } from '@ant-design/pro-components';
import {postDeviceGroupGetDeviceGroupTree} from '@/services/device/DeviceGroup';
import {postProjectCreateProject} from '@/services/project/Project';
import {postAlgorithmModelGetAlgorithmModelFkSelect} from '@/services/resource/AlgorithmModel';
import {beforeUploadFile} from '@/utils/common';
import {CloseOutlined, SnippetsOutlined} from '@ant-design/icons';
import type {ProFormInstance} from '@ant-design/pro-components';
import {
ProForm,
ProFormList,
@ -12,22 +12,27 @@ import {
ProFormUploadDragger,
StepsForm,
} from '@ant-design/pro-components';
import { FormattedMessage, useIntl } from '@umijs/max';
import { Modal, Switch, Transfer, Tree, message } from 'antd';
import type { TransferDirection } from 'antd/es/transfer';
import { DataNode } from 'antd/es/tree';
import React, { useEffect, useRef, useState } from 'react';
import {FormattedMessage, useIntl} from '@umijs/max';
import {Modal, Switch, Transfer, Tree, message, UploadFile} from 'antd';
import type {TransferDirection} from 'antd/es/transfer';
import {DataNode} from 'antd/es/tree';
import React, {useEffect, useRef, useState} from 'react';
// @ts-ignore
import cookie from 'react-cookies';
import {FormListActionType} from "@ant-design/pro-form/lib";
import yaml from "js-yaml";
interface RecordType {
key: string;
title: string;
description: string;
chosen: boolean;
}
interface ProjectConfig {
params: Array<object>;
}
export type FormValueType = {
target?: string;
template?: string;
@ -65,51 +70,51 @@ const treeData1: any[] = [
title: '0-0-0',
key: '0-0-0',
children: [
{ title: '0-0-0-0', key: '0-0-0-0' },
{ title: '0-0-0-1', key: '0-0-0-1' },
{ title: '0-0-0-2', key: '0-0-0-2' },
{title: '0-0-0-0', key: '0-0-0-0'},
{title: '0-0-0-1', key: '0-0-0-1'},
{title: '0-0-0-2', key: '0-0-0-2'},
],
},
{
title: '0-0-1',
key: '0-0-1',
children: [
{ title: '0-0-1-0', key: '0-0-1-0' },
{ title: '0-0-1-1', key: '0-0-1-1' },
{ title: '0-0-1-2', key: '0-0-1-2' },
{ title: '0-0-1-0', key: '0-0-1-3' },
{ title: '0-0-1-1', key: '0-0-1-4' },
{ title: '0-0-1-2', key: '0-0-1-5' },
{ title: '0-0-1-0', key: '0-0-1-6' },
{ title: '0-0-1-1', key: '0-0-1-7' },
{ title: '0-0-1-2', key: '0-0-1-8' },
{ title: '0-0-1-0', key: '0-0-1-9' },
{ title: '0-0-1-1', key: '0-0-1-10' },
{ title: '0-0-1-2', key: '0-0-1-11' },
{ title: '0-0-1-0', key: '0-0-1-12' },
{ title: '0-0-1-1', key: '0-0-1-13' },
{ title: '0-0-1-2', key: '0-0-1-14' },
{ title: '0-0-1-0', key: '0-0-1-15' },
{ title: '0-0-1-1', key: '0-0-1-16' },
{ title: '0-0-1-2', key: '0-0-1-17' },
{ title: '0-0-1-0', key: '0-0-1-18' },
{ title: '0-0-1-1', key: '0-0-1-19' },
{ title: '0-0-1-2', key: '0-0-1-20' },
{ title: '0-0-1-0', key: '0-0-1-21' },
{ title: '0-0-1-1', key: '0-0-1-22' },
{ title: '0-0-1-2', key: '0-0-1-23' },
{ title: '0-0-1-0', key: '0-0-1-24' },
{ title: '0-0-1-1', key: '0-0-1-25' },
{ title: '0-0-1-2', key: '0-0-1-26' },
{ title: '0-0-1-0', key: '0-0-1-27' },
{ title: '0-0-1-1', key: '0-0-1-28' },
{ title: '0-0-1-2', key: '0-0-1-29' },
{ title: '0-0-1-0', key: '0-0-1-30' },
{ title: '0-0-1-1', key: '0-0-1-31' },
{ title: '0-0-1-2', key: '0-0-1-32' },
{ title: '0-0-1-0', key: '0-0-1-33' },
{ title: '0-0-1-1', key: '0-0-1-34' },
{ title: '0-0-1-2', key: '0-0-1-35' },
{title: '0-0-1-0', key: '0-0-1-0'},
{title: '0-0-1-1', key: '0-0-1-1'},
{title: '0-0-1-2', key: '0-0-1-2'},
{title: '0-0-1-0', key: '0-0-1-3'},
{title: '0-0-1-1', key: '0-0-1-4'},
{title: '0-0-1-2', key: '0-0-1-5'},
{title: '0-0-1-0', key: '0-0-1-6'},
{title: '0-0-1-1', key: '0-0-1-7'},
{title: '0-0-1-2', key: '0-0-1-8'},
{title: '0-0-1-0', key: '0-0-1-9'},
{title: '0-0-1-1', key: '0-0-1-10'},
{title: '0-0-1-2', key: '0-0-1-11'},
{title: '0-0-1-0', key: '0-0-1-12'},
{title: '0-0-1-1', key: '0-0-1-13'},
{title: '0-0-1-2', key: '0-0-1-14'},
{title: '0-0-1-0', key: '0-0-1-15'},
{title: '0-0-1-1', key: '0-0-1-16'},
{title: '0-0-1-2', key: '0-0-1-17'},
{title: '0-0-1-0', key: '0-0-1-18'},
{title: '0-0-1-1', key: '0-0-1-19'},
{title: '0-0-1-2', key: '0-0-1-20'},
{title: '0-0-1-0', key: '0-0-1-21'},
{title: '0-0-1-1', key: '0-0-1-22'},
{title: '0-0-1-2', key: '0-0-1-23'},
{title: '0-0-1-0', key: '0-0-1-24'},
{title: '0-0-1-1', key: '0-0-1-25'},
{title: '0-0-1-2', key: '0-0-1-26'},
{title: '0-0-1-0', key: '0-0-1-27'},
{title: '0-0-1-1', key: '0-0-1-28'},
{title: '0-0-1-2', key: '0-0-1-29'},
{title: '0-0-1-0', key: '0-0-1-30'},
{title: '0-0-1-1', key: '0-0-1-31'},
{title: '0-0-1-2', key: '0-0-1-32'},
{title: '0-0-1-0', key: '0-0-1-33'},
{title: '0-0-1-1', key: '0-0-1-34'},
{title: '0-0-1-2', key: '0-0-1-35'},
],
},
{
@ -122,9 +127,9 @@ const treeData1: any[] = [
title: '0-1',
key: '0-1',
children: [
{ title: '0-1-0-0', key: '0-1-0-0' },
{ title: '0-1-0-1', key: '0-1-0-1' },
{ title: '0-1-0-2', key: '0-1-0-2' },
{title: '0-1-0-0', key: '0-1-0-0'},
{title: '0-1-0-1', key: '0-1-0-1'},
{title: '0-1-0-2', key: '0-1-0-2'},
],
},
{
@ -139,15 +144,43 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
const [targetKeys, setTargetKeys] = useState<string[]>([]);
const [selectKeys, setSelectKeys] = useState([]);
const [filePath, setFilePath] = useState('');
const [configData, setConfigData] = useState<ProjectConfig>({ params: [] });
const [configData, setConfigData] = useState<ProjectConfig>({params: []});
const intl = useIntl();
const [isAuto, setIsAuto] = useState(true);
const formRef = useRef<ProFormInstance>();
const formRef3 = useRef<ProFormInstance>();
const [current, setCurrent] = useState(0);
const [dataFormList, setDataFormList] = useState<any>([]);
const dataFormListRef = useRef(dataFormList)
const [fileList, setFileList] = useState<UploadFile<any>[]>([]);
const actionFormListRef = useRef<
FormListActionType<{
name: string;
}>
>();
const handleFileChange = ({file}: { file: UploadFile }) => {
let curFile: any;
switch (file.status) {
case 'uploading':
case 'done':
curFile = [file];
break;
case 'removed':
default:
curFile = [];
break;
}
setFileList([...curFile]);
}
const getModelData = () => {
postAlgorithmModelGetAlgorithmModelFkSelect({ keyword: '' }).then((res) => {
console.log(444, res);
postAlgorithmModelGetAlgorithmModelFkSelect({keyword: ''}).then((res) => {
let result = (res.data?.list || []).map((v: any) => {
return {
key: v.id,
@ -172,14 +205,14 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
.then((resp: API.Response) => {
setTreeData(resp.data.tree);
})
.catch(() => {});
.catch(() => {
});
} else {
formRef.current?.resetFields();
}
}, [props.createModalOpen]);
const handleSearch = (dir: TransferDirection, value: string) => {
postAlgorithmModelGetAlgorithmModelFkSelect({ keyword: value }).then((res) => {
console.log(444, res);
postAlgorithmModelGetAlgorithmModelFkSelect({keyword: value}).then((res) => {
let result = (res.data?.list || []).map((v: any) => {
return {
key: v.id,
@ -200,19 +233,20 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
current={current}
onCurrentChange={setCurrent}
onFinish={async () => {
setFileList([])
let formData = formRef.current?.getFieldsValue();
if (formData?.name) {
formData.inferConfig = { models: targetKeys, params: configData?.params || [] };
formData.inferConfig = {models: targetKeys, params: configData?.params || []};
formData.groupIds = selectKeys;
formData.projectFilePath = filePath;
postProjectCreateProject(formData)
.then(() => {
message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '$$$' }));
message.success(intl.formatMessage({id: 'common.success', defaultMessage: '$$$'}));
props.handleModal();
props.reload();
})
.catch(() => {
message.error(intl.formatMessage({ id: 'common.failure', defaultMessage: '$$$' }));
message.error(intl.formatMessage({id: 'common.failure', defaultMessage: '$$$'}));
return false;
});
}
@ -230,6 +264,7 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
width={803}
onCancel={() => {
setCurrent(0);
setFileList([])
formRef.current?.resetFields();
formRef3.current?.resetFields();
props.handleModal();
@ -243,7 +278,7 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
);
}}
>
{/* 创建项目数据 */}
{/* 创建项目数据 */}
<StepsForm.StepForm<{
name: string;
}>
@ -263,7 +298,7 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
<ProFormText
{...stepFormItemStyleProps}
name="name"
label={<FormattedMessage id="project.project.table.list.name" defaultMessage="$$$" />}
label={<FormattedMessage id="project.project.table.list.name" defaultMessage="$$$"/>}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
@ -287,7 +322,7 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
<ProFormText
width={680}
name="code"
label={<FormattedMessage id="project.project.table.list.code" defaultMessage="$$$" />}
label={<FormattedMessage id="project.project.table.list.code" defaultMessage="$$$"/>}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
@ -302,22 +337,22 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
isAuto
? []
: [
{
required: true,
message: (
<FormattedMessage
id="project.project.table.rule.required.code"
defaultMessage="code is required"
/>
),
},
]
{
required: true,
message: (
<FormattedMessage
id="project.project.table.rule.required.code"
defaultMessage="code is required"
/>
),
},
]
}
addonAfter={
<Switch
checked={isAuto}
checkedChildren={<FormattedMessage id="common.auto" defaultMessage="$$$" />}
unCheckedChildren={<FormattedMessage id="common.edit" defaultMessage="$$$" />}
checkedChildren={<FormattedMessage id="common.auto" defaultMessage="$$$"/>}
unCheckedChildren={<FormattedMessage id="common.edit" defaultMessage="$$$"/>}
onChange={setIsAuto}
/>
}
@ -325,7 +360,7 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
<ProFormText
{...stepFormItemStyleProps}
name="info"
label={<FormattedMessage id="project.project.table.list.info" defaultMessage="$$$" />}
label={<FormattedMessage id="project.project.table.list.info" defaultMessage="$$$"/>}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
@ -349,7 +384,7 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
<ProFormText
{...stepFormItemStyleProps}
name="remark"
label={<FormattedMessage id="project.project.table.list.remark" defaultMessage="$$$" />}
label={<FormattedMessage id="project.project.table.list.remark" defaultMessage="$$$"/>}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
@ -365,7 +400,7 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
width="lg"
name="isEnable"
label={
<FormattedMessage id="project.project.table.list.isEnable" defaultMessage="$$$" />
<FormattedMessage id="project.project.table.list.isEnable" defaultMessage="$$$"/>
}
initialValue={true}
/>
@ -389,11 +424,11 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
showSearch
titles={['未选模型', '已选模型']}
locale={{ itemUnit: '项', itemsUnit: '项', searchPlaceholder: '请输入搜索内容' }}
locale={{itemUnit: '项', itemsUnit: '项', searchPlaceholder: '请输入搜索内容'}}
targetKeys={targetKeys}
onChange={handleChange}
onSearch={handleSearch}
style={{ marginBottom: '20px' }}
style={{marginBottom: '20px'}}
listStyle={{width: 289, height: 300}}
operationStyle={{width: 100, alignItems: 'center'}}
render={(item) => item.title}
@ -425,7 +460,7 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
fieldProps={{
name: 'file',
beforeUpload: beforeUploadFile,
data: { path: 'project/files' },
data: {path: 'project/files'},
headers: {
'X-CSRFToken': cookie.load('csrftoken'),
Authorization: `Bearer ${localStorage.getItem('access') || ''}`,
@ -449,8 +484,54 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
>
{/* <Icon type="delete" /> */}
{/* TODO 图标需要替换 */}
<ProFormUploadDragger max={1}
label="配置文件上传"
value={fileList}
name="dragger"
fieldProps={{
onChange: handleFileChange,
onRemove: () => {
let index_ids = actionFormListRef.current?.getList()?.map((v, i) => {
return i
})
actionFormListRef.current?.remove(index_ids || [])
},
beforeUpload: (file, fileList) => {
if (!file.name.endsWith('.yaml') && !file.name.endsWith('.yml') && !file.name.endsWith('.json')) {
message.error('请上传yaml或json文件').then(() => {
})
return false
} else {
let parsedData = {}
file.text().then((text) => {
if (file.name.endsWith('.yaml') || file.name.endsWith('.yml')) {
parsedData = yaml.load(text) as Record<string, unknown>;
}
if (file.name.endsWith('.json')) {
parsedData = JSON.parse(text) as Record<string, unknown>;
}
if (Object.keys(parsedData).length > 0) {
dataFormListRef.current = Object.entries(parsedData).map(([key, value]) => ({
name: key,
default: value
}))
dataFormListRef.current.forEach((v: any, i: number) => {
actionFormListRef.current?.add(v, i)
})
}
return true
}).catch(() => {
return false
})
}
},
}}
/>
<ProFormList
style={{width: stepFormItemStyleProps.width}}
actionRef={actionFormListRef}
copyIconProps={{
Icon: SnippetsOutlined,
}}
@ -459,13 +540,16 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
}}
name="params"
label="模型参数"
initialValue={[]}
>
<ProForm.Group>
<ProFormText key="name" name="name" label="键名" />
<ProFormText key="default" name="default" label="默认值" />
<ProFormText key="remark" name="remark" label="备注" />
</ProForm.Group>
{(f, index, action) => {
return (
<>
<ProFormText key="name" name="name" label="键名"/>
<ProFormText key="default" name="default" label="默认值"/>
<ProFormText key="remark" name="remark" label="备注"/>
</>
);
}}
</ProFormList>
</StepsForm.StepForm>
{/* 关联网点 */}

6
src/pages/Resource/ModelVersionList/components/MyCreateForm.tsx
Unescape Escape View File

@ -46,7 +46,8 @@ const MyCreateForm: React.FC<MyCreateFormProps> = (props) => {
FormListActionType<{
name: string;
}>
>(); const handleChange = ({ file }: { file: UploadFile }) => {
>();
const handleFileChange = ({ file }: { file: UploadFile }) => {
let curFile: any;
switch (file.status) {
@ -161,6 +162,7 @@ const MyCreateForm: React.FC<MyCreateFormProps> = (props) => {
description: '业务参数配置',
}}
onFinish={async (values: any) => {
setFileList([])
let formData = formRef.current?.getFieldsValue();
if (formData?.modelFkId) {
await waitTime(500)
@ -182,7 +184,7 @@ const MyCreateForm: React.FC<MyCreateFormProps> = (props) => {
value={fileList}
name="dragger"
fieldProps={{
onChange: handleChange,
onChange: handleFileChange,
onRemove: ()=>{
let index_ids = actionFormListRef.current?.getList()?.map((v, i)=>{
return i

Write Preview
Loading…
Cancel
Save