feat 完善项目部署

develop
chunquansang 1 year ago
parent ce2262593f
commit a2d9e3c3f5

@ -21,6 +21,7 @@ import React, { useEffect, useRef, useState } from 'react';
// @ts-ignore // @ts-ignore
import { FormListActionType } from '@ant-design/pro-form/lib'; import { FormListActionType } from '@ant-design/pro-form/lib';
import yaml from 'js-yaml'; import yaml from 'js-yaml';
// @ts-ignore
import cookie from 'react-cookies'; import cookie from 'react-cookies';
interface RecordType { interface RecordType {
@ -62,82 +63,6 @@ const stepFormItemStyleProps: Record<string, any> = {
width: formContainerWidth, width: formContainerWidth,
}; };
const treeData1: any[] = [
{
title: '0-0',
key: '0-0',
children: [
{
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-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-2',
key: '0-0-2',
},
],
},
{
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-2',
key: '0-2',
},
];
const MyCreateForm: React.FC<CreateFormProps> = (props) => { const MyCreateForm: React.FC<CreateFormProps> = (props) => {
const [treeData, setTreeData] = React.useState<DataNode[]>([]); const [treeData, setTreeData] = React.useState<DataNode[]>([]);
@ -555,9 +480,6 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
<ProCard style={{padding: 0, margin: 0}} bodyStyle={{padding: 0, marginRight: 10}}> <ProCard style={{padding: 0, margin: 0}} bodyStyle={{padding: 0, marginRight: 10}}>
<ProFormText key="default" name="default" label="默认值" /> <ProFormText key="default" name="default" label="默认值" />
</ProCard> </ProCard>
<ProCard style={{padding: 0, margin: 0}} bodyStyle={{padding: 0, marginRight: 10}}>
<ProFormText key="remark" name="remark" label="备注" />
</ProCard>
</ProCard> </ProCard>
); );
}} }}

@ -236,7 +236,6 @@ const MyCreateForm: React.FC<MyCreateFormProps> = (props) => {
<> <>
<ProFormText key="name" name="name" label="键名" /> <ProFormText key="name" name="name" label="键名" />
<ProFormText key="default" name="default" label="默认值" /> <ProFormText key="default" name="default" label="默认值" />
<ProFormText key="remark" name="remark" label="备注" />
</> </>
); );
}} }}

@ -177,6 +177,7 @@ const AlgorithmSetting: React.FC = () => {
{ {
title: ( title: (
<> <>
<div>{JSON.stringify(item.configId)}</div>
<img src="/images/model.png" alt="" style={{ width: '50px' }} /> <img src="/images/model.png" alt="" style={{ width: '50px' }} />
</> </>
), ),

@ -39,7 +39,7 @@ for (let i = 0; i < 5; i += 1) {
: '简短备注文案', : '简短备注文案',
}); });
} }
console.log(tableListDataSource)
const columns1 = [ const columns1 = [
{ {
title: '应用名称', title: '应用名称',
@ -226,7 +226,6 @@ const TableTransferList: React.FC<UpdateFormProps> = (props) => {
const triggerShowSearch = (checked: boolean) => { const triggerShowSearch = (checked: boolean) => {
setShowSearch(checked); setShowSearch(checked);
}; };
return ( return (
<> <>
<TableTransfer <TableTransfer

@ -1,43 +1,29 @@
import { import {
ModalForm, ProCard, ProForm, ProFormDigit, ProFormSelect,
ProForm, ProFormDependency, ProFormDigit, ProFormList, ProFormSelect,
ProFormSwitch, ProFormSwitch,
ProFormText, ProFormText,
ProFormUploadDragger,
StepsForm StepsForm
} from '@ant-design/pro-components'; } from '@ant-design/pro-components';
import {FormattedMessage, useIntl} from '@umijs/max'; import {useIntl} from '@umijs/max';
import React, {useEffect, useRef, useState} from 'react'; import React, {useEffect, useRef, useState} from 'react';
import {Button, Form, message, Modal, Switch, Tree} from 'antd'; import {message, Modal} from 'antd';
import type { ColumnsType } from 'antd/es/table/interface';
import { Table, Transfer } from 'antd';
import type { ColumnsType, TableRowSelection } from 'antd/es/table/interface';
import type { TransferItem, TransferProps } from 'antd/es/transfer'; import type { TransferItem, TransferProps } from 'antd/es/transfer';
import {TransferDirection} from "antd/es/transfer";
import { import {
postAlgorithmModelGetAlgorithmModelFkSelect,
postAlgorithmModelGetAllVersionsById postAlgorithmModelGetAllVersionsById
} from "@/services/resource/AlgorithmModel"; } from "@/services/resource/AlgorithmModel";
import { import {
postDeviceGetAllDeviceByGroup, postDeviceGetAllDeviceByGroup,
postDeviceGetDeviceFkSelect,
postDeviceGetDeviceList
} from "@/services/device/Device"; } from "@/services/device/Device";
import {postDeviceGroupGetDeviceGroupTree} from "@/services/device/DeviceGroup";
import {putRoleUpdateDevicesInGroupModel} from "@/services/device/DeviceModelInGroup";
import {postProjectCreateProject} from "@/services/project/Project";
import {beforeUploadFile} from "@/utils/common";
import yaml from "js-yaml";
import {CloseOutlined, SnippetsOutlined} from "@ant-design/icons";
import {FormListActionType, ProFormDatePicker} from "@ant-design/pro-form/lib"; import {FormListActionType, ProFormDatePicker} from "@ant-design/pro-form/lib";
import { import {
postModelVersionGetModelVersionById, postModelVersionGetModelVersionById,
postModelVersionGetModelVersionFkSelect
} from "@/services/resource/ModelVersion"; } from "@/services/resource/ModelVersion";
import difference from 'lodash/difference';
import TableTransferList from "@/pages/Setting/components/TableTransfer"; import TableTransferList from "@/pages/Setting/components/TableTransfer";
import {postProjectModelConfigGetProjectModelConfigById} from "@/services/project/ProjectModelConfig"; import {
postProjectModelConfigGetProjectModelConfigById,
putProjectModelConfigUpdateProjectModelConfig
} from "@/services/project/ProjectModelConfig";
const formContainerWidth: number = 755; const formContainerWidth: number = 755;
@ -68,53 +54,7 @@ export type UpdateFormProps = {
reload: any; reload: any;
}; };
const genFormFields = (type: number)=>{
return (
<>
<ProFormText
name="name"
label="实验名称"
width="md"
tooltip="最长为 24 位,用于标定的唯一 id"
placeholder="请输入名称"
rules={[{ required: true }]}
/>
<ProFormDatePicker name="date" label="日期" />
</>
)
}
const dataSource = [
{
key: '1',
name: '胡彦斌',
age: 32,
address: '西湖区湖底公园1号',
},
{
key: '2',
name: '胡彦祖',
age: 42,
address: '西湖区湖底公园1号',
},
];
const columns = [
{
title: '姓名',
dataIndex: 'name',
key: 'name',
},
{
title: '年龄',
dataIndex: 'age',
key: 'age',
},
{
title: '住址',
dataIndex: 'address',
key: 'address',
},
];
const UpdateForm: React.FC<UpdateFormProps> = (props) => { const UpdateForm: React.FC<UpdateFormProps> = (props) => {
const intl = useIntl(); const intl = useIntl();
@ -122,62 +62,55 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
const [targetKeys, setTargetKeys] = useState<string[]>([]); const [targetKeys, setTargetKeys] = useState<string[]>([]);
const [current, setCurrent] = useState(0); const [current, setCurrent] = useState(0);
const [configData, setConfigData] = useState([]); const [configData, setConfigData] = useState<any>([]);
const [addrValue, setAddr] = useState('') const [addrValue, setAddr] = useState('')
const [projectModelConfig, setProjectModelConfig] = useState<API.ProjectModelConfig>({}) const [projectModelConfig, setProjectModelConfig] = useState<API.ProjectModelConfig>({})
const [configResult, setConfigResult] = useState<API.ProjectModelConfig>({})
const [deviceData, setDeviceData] = useState<DataType[]>([]) const [deviceData, setDeviceData] = useState<DataType[]>([])
const handleSelectChange = (value)=>{ const [selectValue, setSelectValue] = useState<number>(0)
const [isInit, setIsInit] = useState<boolean>(false)
const handleSelectChange = (value: number)=>{
if (value !== projectModelConfig.modelVersionFkId) {
postModelVersionGetModelVersionById({ id: value }).then((resp) => { postModelVersionGetModelVersionById({ id: value }).then((resp) => {
let data = resp.data.modelVersion.modelConfig?.params || []; let data = resp.data.modelVersion.modelConfig?.params || [];
setConfigData(data); // 更新状态 setConfigData(data);
}); });
} }
setSelectValue(value)
useEffect(() => {
if (addrValue) {
postModelVersionGetModelVersionById({ id: 23 }).then((resp) => {
let data = resp.data.modelVersion.modelConfig?.params || [];
setConfigData(data); // 更新状态
});
} }
}, [addrValue]);
// useEffect(() => {
// if (selectValue > 0) {
// postModelVersionGetModelVersionById({ id: selectValue }).then((resp) => {
// let data = resp.data.modelVersion.modelConfig?.params || [];
// setConfigData(data); // 更新状态
// });
// }
// }, [selectValue]);
const actionFormListRef = useRef< const actionFormListRef = useRef<
FormListActionType<{ FormListActionType<{
name: string; name: string;
}> }>
>(); >();
const getModelData = () => {
// postDeviceGetDeviceFkSelect({keyword: ''}).then((res)=>{
// let result = (res.data?.list || []).map((v: any)=>{
// return {
// key: v.id,
// title: v.name,
// chosen: false,
// }
// })
// setModalData(result);
// })
// setMockData(tempMockData);
// setTargetKeys(tempTargetKeys);
};
useEffect(() => { useEffect(() => {
setTargetKeys([]) setTargetKeys([])
setConfigData([]) setConfigData([])
setIsInit(false)
if (props.updateModalOpen) { if (props.updateModalOpen) {
// getModelData(); // getModelData();
console.log(props.projectModelConfigId)
if (props.projectModelConfigId && props.projectModelConfigId !== 0) { if (props.projectModelConfigId && props.projectModelConfigId !== 0) {
postProjectModelConfigGetProjectModelConfigById({id: props.projectModelConfigId}).then((resp)=>{ postProjectModelConfigGetProjectModelConfigById({id: props.projectModelConfigId}).then((resp)=>{
setProjectModelConfig(resp.data.ProjectModelConfig) setProjectModelConfig(resp.data.ProjectModelConfig)
setTargetKeys((resp.data.ProjectModelConfig?.devices || '').split(',').map((v: string)=>{return parseInt(v)}))
setConfigData(resp.data.ProjectModelConfig?.modelConfig || [])
setSelectValue(resp.data.ProjectModelConfig?.modelVersionFkId || 0)
setIsInit(true)
}) })
} }
// postDeviceGetDeviceList({groupFkId: 2, page: 1, pageSize:10}).then((resp)=>{
// // console.log(111, resp)
// })
} else { } else {
} }
}, [props.updateModalOpen]) }, [props.updateModalOpen])
@ -203,8 +136,8 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
}) })
} }
}} }}
onFinish={async () => { onFinish={async (values) => {
setCurrent(0)
return true; return true;
}} }}
formProps={{ formProps={{
@ -233,72 +166,26 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
<StepsForm.StepForm<{ <StepsForm.StepForm<{
config: string; config: string;
}> }>
name="config" name="config1"
title="模型参数配置" title="项目参数配置"
stepProps={{ stepProps={{
description: '模型参数配置', description: '业务参数配置',
}}
onFocus={()=>{
console.log("进入")
}} }}
onFinish={async (values: any) => { onFinish={async (values: any) => {
let projectConfig:any = []
Object.keys(values).forEach((key)=>{
if (key !== 'modelFkId') {
projectConfig.push({name: key, value: values[key]})
}
})
configResult.projectConfig = projectConfig
return true; return true;
}} }}
> >
<> <>
<ProForm.Group>
{ {
projectModelConfig.modelFkId && projectModelConfig.modelFkId !== 0 && ( isInit && (projectModelConfig?.projectConfig || []).map((item: any, index: number)=>{
<ProFormSelect
name="addr"
width="xs"
label="模型版本"
onChange={handleSelectChange}
initialValue={projectModelConfig.modelVersionFkId}
// dependencies 的内容会注入 request 中
request={async () => {
let resp =await postAlgorithmModelGetAllVersionsById({id: projectModelConfig.modelFkId})
return resp.data.list.map((v: any)=>{
return {
label: v.name,
value: v.id
}
})
}}
/>
)
}
{
configData.length ?
(
configData.map((item:any, index)=> {
if (typeof item.default === 'number') {
return (<ProFormDigit
key={index}
name={item.name}
label={item.name}
initialValue={item.default}
tooltip={item.remark}
/>)
} else if (typeof item.default === 'boolean') {
return (<ProFormSwitch
key={index}
name={item.name}
label={item.name}
initialValue={item.default}
tooltip={item.remark}
/>)
} else {
return (<ProFormText
key={index}
name={item.name}
label={item.name}
initialValue={item.default}
tooltip={item.remark}
/>)
}
}
)
): (projectModelConfig?.modelConfig || []).map((item, index)=>{
let value_type = typeof item.value let value_type = typeof item.value
if (value_type === 'number') { if (value_type === 'number') {
return (<ProFormDigit return (<ProFormDigit
@ -329,92 +216,112 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
} }
}) })
} }
</ProForm.Group>
</> </>
</StepsForm.StepForm> </StepsForm.StepForm>
<StepsForm.StepForm<{ <StepsForm.StepForm<{
config: string; config: string;
}> }>
name="config1" name="config"
title="项目参数配置" title="模型参数配置"
stepProps={{ stepProps={{
description: '业务参数配置', description: '模型参数配置',
}} }}
onFinish={async (values: any) => { onFinish={async (values: any) => {
configResult.modelVersionFkId = values.modelFkId
let modelConfig:any = []
Object.keys(values).forEach((key)=>{
if (key !== 'modelFkId') {
modelConfig.push({name: key, value: values[key]})
}
})
configResult.modelConfig = modelConfig
return true; return true;
}} }}
> >
<> <>
<ProForm.Group> <div>{props.projectModelConfigId}</div>
{ {
(projectModelConfig?.projectConfig || []).map((item, index)=>{ isInit && projectModelConfig.modelFkId && projectModelConfig.modelFkId !== 0 && (
let value_type = typeof item.value <ProFormSelect
if (value_type === 'number') { name="modelFkId"
width="xs"
label="模型版本"
onChange={handleSelectChange}
initialValue={projectModelConfig.modelVersionFkId}
// dependencies 的内容会注入 request 中
request={async () => {
let resp =await postAlgorithmModelGetAllVersionsById({id: projectModelConfig.modelFkId})
return resp.data.list.map((v: any)=>{
return {
label: v.name,
value: v.id
}
})
}}
/>
)
}
<div>{selectValue}={projectModelConfig.modelVersionFkId}</div>
{
isInit && (selectValue !== projectModelConfig.modelVersionFkId ?
(
configData.map((item:any, index: number)=> {
if (typeof item.default === 'number') {
return (<ProFormDigit return (<ProFormDigit
key={index} key={index}
name={item.name} name={item.name}
label={item.name} label={item.name}
initialValue={item.value} initialValue={item.default}
tooltip={item.remark}
/>) />)
} else if (value_type === 'boolean') { } else if (typeof item.default === 'boolean') {
return (<ProFormSwitch return (<ProFormSwitch
key={index} key={index}
name={item.name} name={item.name}
label={item.name} label={item.name}
initialValue={item.value} initialValue={item.default}
tooltip={item.remark}
/>) />)
} else if (value_type === 'string') { } else {
return (<ProFormText return (<ProFormText
key={index} key={index}
name={item.name} name={item.name}
label={item.name} label={item.name}
initialValue={item.value} initialValue={item.default}
tooltip={item.remark}
/>) />)
} else {
return
} }
})
} }
{ )
Object.keys(projectModelConfig?.projectConfig || {}).map((item:any, index)=> { ): (configData.map((item:any, index: number)=> {
let value_type = typeof projectModelConfig.projectConfig[item] if (typeof item.value === 'number') {
console.log(value_type, projectModelConfig.projectConfig[item])
if (value_type === 'number') {
return (<ProFormDigit return (<ProFormDigit
key={index} key={index}
name={item} name={item.name}
label={item} label={item.name}
initialValue={projectModelConfig.projectConfig[item]} initialValue={item.value}
/>) />)
} else if (value_type === 'boolean') { } else if (typeof item.value === 'boolean') {
return (<ProFormSwitch return (<ProFormSwitch
key={index} key={index}
name={item} name={item.name}
label={item} label={item.name}
initialValue={projectModelConfig.projectConfig[item]} initialValue={item.value}
/>) />)
} else if (value_type === 'string') { } else {
return (<ProFormText return (<ProFormText
key={index} key={index}
width='md' name={item.name}
name={item} label={item.name}
label={item} initialValue={item.value}
initialValue={projectModelConfig.projectConfig[item]}
/>) />)
} else {
return
} }
} }
) )))
} }
</ProForm.Group>
</> </>
</StepsForm.StepForm> </StepsForm.StepForm>
{/* 关联算法模型 */} {/* 关联算法模型 */}
<StepsForm.StepForm<{ <StepsForm.StepForm<{
@ -426,8 +333,17 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
description: '设备关联配置', description: '设备关联配置',
}} }}
onFinish={async (values: any) => { onFinish={async (values: any) => {
console.log(targetKeys) configResult.devices = targetKeys.join(',')
return true; configResult.id = props.projectModelConfigId
putProjectModelConfigUpdateProjectModelConfig(configResult).then((resp)=>{
message.success(intl.formatMessage({id: 'common.success', defaultMessage: '$$$'}))
props.handleModal()
props.reload()
return true
}).catch(()=>{
message.error(intl.formatMessage({id: 'common.failure', defaultMessage: '$$$'}))
return false;
})
}} }}
> >
<> <>
@ -437,51 +353,7 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
<TableTransferList setTargetKeys={setTargetKeys} dataSource={deviceData} <TableTransferList setTargetKeys={setTargetKeys} dataSource={deviceData}
targetKeys={targetKeys}></TableTransferList> targetKeys={targetKeys}></TableTransferList>
</> </>
</StepsForm.StepForm> </StepsForm.StepForm>
</StepsForm> </StepsForm>
// <ModalForm<API.DeviceModelInGroup>
// title={intl.formatMessage({
// id: 'common.modal.table.update.title',
// defaultMessage: '$$$',
// })}
// open={props.updateModalOpen}
// form={form}
// autoFocusFirstInput
// modalProps={{
// destroyOnClose: true,
// onCancel: () => props.handleModal(),
// }}
// submitTimeout={2000}
// onFinish={async (values:any) => {
// console.log(4444, props.values)
// putRoleUpdateDevicesInGroupModel({groupId: props.values.groupFkId, modelId: props.values.modelFkId, deviceIds: values?.devices || []}).then(()=>{
// props.handleModal();
// message.success(intl.formatMessage({id: 'common.success', defaultMessage: '$$$'}))
// }).catch(()=>{
// message.error(intl.formatMessage({id: 'common.failure', defaultMessage: '$$$'}))
// })
// return true;
// }}
// >
// <ProForm.Item name='devices'>
// <Transfer
// dataSource={modalData}
// showSearch
// locale={{ itemUnit: '项', itemsUnit: '项', searchPlaceholder: '请输入搜索内容' }}
// targetKeys={targetKeys}
// onChange={handleChange}
// onSearch={handleSearch}
// style={{marginBottom: '20px'}}
// render={(item) => item.title}
// />
//
// </ProForm.Item>
// </ModalForm>
)} )}
export default UpdateForm; export default UpdateForm;

Loading…
Cancel
Save