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

fix: 模型版本列表按钮统一使用button,项目管理新增数据表单默认同行展示

Browse Source
develop
zhoux 1 year ago
parent dfc7495975
commit 6b542454a3
5 changed files with 210 additions and 183 deletions
Show Stats Download Patch File Download Diff File

13
README.md
Unescape Escape View File

@ -2,7 +2,7 @@
* @Author: zhoux zhouxia@supervision.ltd
* @Date: 2023-11-01 13:56:33
* @LastEditors: zhoux zhouxia@supervision.ltd
* @LastEditTime: 2023-11-03 11:09:56
* @LastEditTime: 2023-11-06 09:43:02
* @FilePath: \general-ai-platform-web\README.md
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
@ -22,6 +22,7 @@
* 展示抽屉内容时需要有关闭按钮，排版需和谐
* 使用stepForm的时候，最后的提交写在最后一步的onfinish里面而不是总的stepForm里
* table操作栏按钮统一使用button，合理间距
@ -56,3 +57,13 @@
## ProForm 表单
### git提交修饰
feat: 新功能
fix: bug修复
docs: 仅文档更改
style: 不影响代码含义的更改（空白、格式设置、缺失 分号等）
refactor: 既不修复bug也不添加特性的代码更改
perf: 改进性能的代码更改
test: 添加缺少的测试或更正现有测试
chore: 对构建过程或辅助工具和库（如文档）的更改（无法确认内容可使用）

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

@ -5,6 +5,7 @@ import {beforeUploadFile} from '@/utils/common';
import { CloseOutlined, SnippetsOutlined } from '@ant-design/icons';
import type { ProFormInstance } from '@ant-design/pro-components';
import {
ProCard,
ProForm,
ProFormList,
ProFormSwitch,
@ -13,14 +14,14 @@ import {
StepsForm,
} from '@ant-design/pro-components';
import { FormattedMessage, useIntl } from '@umijs/max';
import {Modal, Switch, Transfer, Tree, message, UploadFile} from 'antd';
import { Modal, Switch, Transfer, Tree, UploadFile, message } 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 { FormListActionType } from '@ant-design/pro-form/lib';
import yaml from 'js-yaml';
import cookie from 'react-cookies';
import {FormListActionType} from "@ant-design/pro-form/lib";
import yaml from "js-yaml";
interface RecordType {
key: string;
@ -56,7 +57,7 @@ const waitTime = (time: number = 100) => {
};
/**styles 配置 */
const formContainerWidth: number = 755
const formContainerWidth: number = 755;
const stepFormItemStyleProps: Record<string, any> = {
width: formContainerWidth,
};
@ -152,7 +153,7 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
const [current, setCurrent] = useState(0);
const [dataFormList, setDataFormList] = useState<any>([]);
const dataFormListRef = useRef(dataFormList)
const dataFormListRef = useRef(dataFormList);
const [fileList, setFileList] = useState<UploadFile<any>[]>([]);
const actionFormListRef = useRef<
@ -176,8 +177,7 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
}
setFileList([...curFile]);
}
};
const getModelData = () => {
postAlgorithmModelGetAlgorithmModelFkSelect({ keyword: '' }).then((res) => {
@ -205,8 +205,7 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
.then((resp: API.Response) => {
setTreeData(resp.data.tree);
})
.catch(() => {
});
.catch(() => {});
} else {
formRef.current?.resetFields();
}
@ -233,7 +232,7 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
current={current}
onCurrentChange={setCurrent}
onFinish={async () => {
setFileList([])
setFileList([]);
let formData = formRef.current?.getFieldsValue();
if (formData?.name) {
formData.inferConfig = { models: targetKeys, params: configData?.params || [] };
@ -264,7 +263,7 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
width={803}
onCancel={() => {
setCurrent(0);
setFileList([])
setFileList([]);
formRef.current?.resetFields();
formRef3.current?.resetFields();
props.handleModal();
@ -423,7 +422,6 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
dataSource={modalData}
showSearch
titles={['未选模型', '已选模型']}
locale={{ itemUnit: '项', itemsUnit: '项', searchPlaceholder: '请输入搜索内容' }}
targetKeys={targetKeys}
onChange={handleChange}
@ -485,7 +483,8 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
{/* <Icon type="delete" /> */}
{/* TODO 图标需要替换 */}
<ProFormUploadDragger max={1}
<ProFormUploadDragger
max={1}
label="配置文件上传"
value={fileList}
name="dragger"
@ -493,18 +492,23 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
onChange: handleFileChange,
onRemove: () => {
let index_ids = actionFormListRef.current?.getList()?.map((v, i) => {
return i
})
actionFormListRef.current?.remove(index_ids || [])
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
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) => {
let parsedData = {};
file
.text()
.then((text) => {
if (file.name.endsWith('.yaml') || file.name.endsWith('.yml')) {
parsedData = yaml.load(text) as Record<string, unknown>;
}
@ -514,17 +518,18 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
if (Object.keys(parsedData).length > 0) {
dataFormListRef.current = Object.entries(parsedData).map(([key, value]) => ({
name: key,
default: value
}))
default: value,
}));
dataFormListRef.current.forEach((v: any, i: number) => {
actionFormListRef.current?.add(v, i)
})
actionFormListRef.current?.add(v, i);
});
}
return true
}).catch(() => {
return false
return true;
})
.catch(() => {
return false;
});
}
},
}}
@ -543,11 +548,17 @@ const MyCreateForm: React.FC<CreateFormProps> = (props) => {
>
{(f, index, action) => {
return (
<>
<ProCard style={{padding: 0, margin: 0}} bodyStyle={{padding: 0, margin: 0 }}>
<ProCard style={{padding: 0, margin: 0}} bodyStyle={{padding: 0, marginRight: 10}}>
<ProFormText key="name" name="name" label="键名" />
</ProCard>
<ProCard style={{padding: 0, margin: 0}} bodyStyle={{padding: 0, marginRight: 10}}>
<ProFormText key="default" name="default" label="默认值" />
</ProCard>
<ProCard style={{padding: 0, margin: 0}} bodyStyle={{padding: 0, marginRight: 10}}>
<ProFormText key="remark" name="remark" label="备注" />
</>
</ProCard>
</ProCard>
);
}}
</ProFormList>

3
src/pages/Resource/AlgorithmModelList/components/ModelVersionListDrawer.tsx
Unescape Escape View File

@ -254,8 +254,7 @@ const ModelVersionListDrawer: React.FC<ColumnDrawProps> = (props) => {
dataSource={props.currentRow}
title="模型详细信息"
tooltip="包含了模型详细信息"
columns={props.columns}
columns={props.columns.filter((item: Record<string,any>) => !['option'].includes(item.dataIndex))}
>
</ProDescriptions>
</ProCard>

56
src/pages/Resource/AlgorithmModelList/index.tsx
Unescape Escape View File

@ -271,45 +271,43 @@ const AlgorithmModelList: React.FC = () => {
accessible={access.canUpdate(history.location.pathname)}
key={`${history.location.pathname}-add`}
>
<a
<Button
key="detail"
type="link"
size="small"
onClick={() => {
setCurrentRow(record);
setShowDetail(true);
}}
>
详情
</a>
<a
</Button>
<Button
key="update"
type="link"
size="small"
onClick={() => {
setUpdateModalOpen(true);
setCurrentRow(record);
}}
>
<FormattedMessage id="pages.searchTable.update" defaultMessage="Update" />
</a>
</Button>
{/* update1101 */}
<Popconfirm
placement="topLeft"
title={(
intl.formatMessage({ id: 'common.tip.title', defaultMessage: '$$$' })
)}
description={(
intl.formatMessage({ id: 'common.modal.table.delete.content', defaultMessage: '$$$' })
)}
okText={(
intl.formatMessage({ id: 'common.yes', defaultMessage: '$$$' })
)}
cancelText={(
intl.formatMessage({ id: 'common.no', defaultMessage: '$$$' })
)}
title={intl.formatMessage({ id: 'common.tip.title', defaultMessage: '$$$' })}
description={intl.formatMessage({
id: 'common.modal.table.delete.content',
defaultMessage: '$$$',
})}
okText={intl.formatMessage({ id: 'common.yes', defaultMessage: '$$$' })}
cancelText={intl.formatMessage({ id: 'common.no', defaultMessage: '$$$' })}
onConfirm={() => {
handleDestroy(record).then(() => {});
}}
>
<Button key="destroy" type="text" danger>
<Button key="destroy" type="link" size="small" danger>
<FormattedMessage id="pages.searchTable.destroy" defaultMessage="Destroy" />
</Button>
</Popconfirm>
@ -355,18 +353,16 @@ const AlgorithmModelList: React.FC = () => {
onClick={async () => {
Modal.confirm({
icon: <ExclamationCircleOutlined />,
title: (
intl.formatMessage({ id: 'common.modal.table.delete.title', defaultMessage: '$$$' })
),
content:(
intl.formatMessage({ id: 'common.modal.table.delete.content', defaultMessage: '$$$' })
),
okText: (
intl.formatMessage({ id: 'common.yes', defaultMessage: '$$$' })
),
cancelText: (
intl.formatMessage({ id: 'common.no', defaultMessage: '$$$' })
),
title: intl.formatMessage({
id: 'common.modal.table.delete.title',
defaultMessage: '$$$',
}),
content: intl.formatMessage({
id: 'common.modal.table.delete.content',
defaultMessage: '$$$',
}),
okText: intl.formatMessage({ id: 'common.yes', defaultMessage: '$$$' }),
cancelText: intl.formatMessage({ id: 'common.no', defaultMessage: '$$$' }),
onOk() {
// TODO 未对接批量删除接口
deleteAlgorithmModelDeleteAlgorithmModelByIds({

40
src/pages/Resource/ModelVersionList/index.tsx
Unescape Escape View File

@ -15,7 +15,7 @@ import { DownOutlined, PlusOutlined } from '@ant-design/icons';
import type { ActionType, ProColumns } from '@ant-design/pro-components';
import { FooterToolbar, PageContainer, ProFormSelect, ProTable } from '@ant-design/pro-components';
import { Access, FormattedMessage, history, useAccess, useIntl } from '@umijs/max';
import { Button, Popconfirm, message , Dropdown} from 'antd';
import { Button, Dropdown, Popconfirm, message } from 'antd';
// import { MenuProps } from 'rc-menu';
import React, { useRef, useState } from 'react';
import { ColumnDrawer } from './components/ColumnDrawer';
@ -134,14 +134,14 @@ const ModelVersionList: React.FC = () => {
});
}
const prevActions: any[] = [];
const moreActions: { key: string; label: any; }[] = [];
const moreActions: { key: string; label: any }[] = [];
renderActions.map((item, index) => {
if (index < maxActionCount - 1) {
prevActions.push(item);
} else {
moreActions.push({
key: index+"",
label: item
key: index + '',
label: item,
});
}
// eslint-disable-next-line react/jsx-key
@ -152,7 +152,10 @@ const ModelVersionList: React.FC = () => {
return <div key={index}>{item}</div>;
})}
<Dropdown menu={{ items: moreActions }}>
<a>更多<DownOutlined/></a>
<a>
更多
<DownOutlined />
</a>
</Dropdown>
</>
);
@ -320,23 +323,28 @@ const ModelVersionList: React.FC = () => {
>
<TableActionCard
renderActions={[
<a
<Button
key="update"
type="link"
size="small"
onClick={() => {
setUpdateModalOpen(true);
setCurrentRow(record);
}}
>
<FormattedMessage id="pages.searchTable.update" defaultMessage="Update" />
</a>,
<a
</Button>,
<Button
key="destroy"
type="link"
size="small"
danger
onClick={() => {
handleDestroy(record).then(() => {});
}}
>
<FormattedMessage id="pages.searchTable.destroy" defaultMessage="Destroy" />
</a>,
</Button>,
// eslint-disable-next-line react/jsx-key
<Popconfirm
title="发布模型"
@ -346,15 +354,17 @@ const ModelVersionList: React.FC = () => {
okText="Yes"
cancelText="No"
>
<a
<Button
key="confirm_publish"
type="link"
size="small"
onClick={() => {
setPublishModalOpen(true);
setCurrentRow(record);
}}
>
<FormattedMessage id="common.confirm_publish" defaultMessage="confirm_publish" />
</a>
</Button>
</Popconfirm>,
// eslint-disable-next-line react/jsx-key
<Popconfirm
@ -377,12 +387,12 @@ const ModelVersionList: React.FC = () => {
});
}}
onCancel={() => {}}
okText="Yes"
cancelText="No"
okText={intl.formatMessage({ id: 'common.yes', defaultMessage: '$$$' })}
cancelText={intl.formatMessage({ id: 'common.no', defaultMessage: '$$$' })}
>
<a key="set_default" onClick={() => {}}>
<Button key="set_default" type="link" size="small">
<FormattedMessage id="common.set_default" defaultMessage="$$$" />
</a>
</Button>
</Popconfirm>,
]}
></TableActionCard>

Write Preview
Loading…
Cancel
Save