feat:[FL-94][ATP模型管理页面添加Dropdown组件支持]
- 添加 Dropdown、MenuProps 和 MoreOutlined 导入 - 更新操作列宽度从 200px 到 240px - 引入 rowBusy 状态管理 - 添加空的 moreMenuItems 菜单项数组(预留扩展) - 操作列和卡片视图同步添加条件渲染的 Dropdown 按钮 - 对齐用户管理页面的交互模式 Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Co-authored-by: multica-agent <github@multica.ai>
This commit is contained in:
@@ -8,6 +8,7 @@ import {
|
||||
Button,
|
||||
Card,
|
||||
Col,
|
||||
Dropdown,
|
||||
Empty,
|
||||
Form,
|
||||
Input,
|
||||
@@ -21,7 +22,9 @@ import {
|
||||
Tag,
|
||||
Typography,
|
||||
type CardProps,
|
||||
type MenuProps,
|
||||
} from "antd";
|
||||
import { MoreOutlined } from "@ant-design/icons";
|
||||
import type { ColumnsType } from "antd/es/table";
|
||||
import { useCallback, useEffect, useMemo, useRef, useState, type CSSProperties, type ComponentType } from "react";
|
||||
|
||||
@@ -376,9 +379,18 @@ export default function AtpModelsPage() {
|
||||
{
|
||||
title: "操作",
|
||||
key: "actions",
|
||||
width: 200,
|
||||
width: 240,
|
||||
render: (_, item) => {
|
||||
const deleteLoading = deleteMutation.isPending;
|
||||
const rowBusy = deleteLoading;
|
||||
|
||||
const moreMenuItems: MenuProps["items"] = [
|
||||
// 未来可在此添加更多操作,如:
|
||||
// - 查看版本历史
|
||||
// - 导出模型配置
|
||||
// - 复制模型
|
||||
// - 归档/取消归档
|
||||
];
|
||||
|
||||
return (
|
||||
<Space wrap>
|
||||
@@ -389,7 +401,7 @@ export default function AtpModelsPage() {
|
||||
</Link>
|
||||
<Button
|
||||
size="small"
|
||||
disabled={!canManage}
|
||||
disabled={!canManage || rowBusy}
|
||||
onClick={() => {
|
||||
setEditingAsset(item);
|
||||
form.setFieldsValue(toFormValues(item));
|
||||
@@ -405,12 +417,17 @@ export default function AtpModelsPage() {
|
||||
cancelText="取消"
|
||||
okButtonProps={{ danger: true, loading: deleteLoading }}
|
||||
onConfirm={() => deleteMutation.mutate(item.id)}
|
||||
disabled={!canManage}
|
||||
disabled={!canManage || rowBusy}
|
||||
>
|
||||
<Button danger size="small" loading={deleteLoading} disabled={!canManage}>
|
||||
<Button danger size="small" loading={deleteLoading} disabled={!canManage || rowBusy}>
|
||||
删除
|
||||
</Button>
|
||||
</Popconfirm>
|
||||
{moreMenuItems && moreMenuItems.length > 0 && (
|
||||
<Dropdown menu={{ items: moreMenuItems }} trigger={["click"]}>
|
||||
<Button size="small" disabled={rowBusy} icon={<MoreOutlined />} />
|
||||
</Dropdown>
|
||||
)}
|
||||
</Space>
|
||||
);
|
||||
},
|
||||
@@ -421,6 +438,15 @@ export default function AtpModelsPage() {
|
||||
|
||||
const renderAtpModelCard = (item: AtpAssetSummary) => {
|
||||
const deleteLoading = deleteMutation.isPending;
|
||||
const rowBusy = deleteLoading;
|
||||
|
||||
const moreMenuItems: MenuProps["items"] = [
|
||||
// 未来可在此添加更多操作,如:
|
||||
// - 查看版本历史
|
||||
// - 导出模型配置
|
||||
// - 复制模型
|
||||
// - 归档/取消归档
|
||||
];
|
||||
|
||||
return (
|
||||
<AntCard
|
||||
@@ -474,7 +500,7 @@ export default function AtpModelsPage() {
|
||||
</Link>
|
||||
<Button
|
||||
size="small"
|
||||
disabled={!canManage}
|
||||
disabled={!canManage || rowBusy}
|
||||
onClick={() => {
|
||||
setEditingAsset(item);
|
||||
form.setFieldsValue(toFormValues(item));
|
||||
@@ -490,12 +516,17 @@ export default function AtpModelsPage() {
|
||||
cancelText="取消"
|
||||
okButtonProps={{ danger: true, loading: deleteLoading }}
|
||||
onConfirm={() => deleteMutation.mutate(item.id)}
|
||||
disabled={!canManage}
|
||||
disabled={!canManage || rowBusy}
|
||||
>
|
||||
<Button danger size="small" loading={deleteLoading} disabled={!canManage}>
|
||||
<Button danger size="small" loading={deleteLoading} disabled={!canManage || rowBusy}>
|
||||
删除
|
||||
</Button>
|
||||
</Popconfirm>
|
||||
{moreMenuItems && moreMenuItems.length > 0 && (
|
||||
<Dropdown menu={{ items: moreMenuItems }} trigger={["click"]}>
|
||||
<Button size="small" disabled={rowBusy} icon={<MoreOutlined />} />
|
||||
</Dropdown>
|
||||
)}
|
||||
</Space>
|
||||
</div>
|
||||
</Space>
|
||||
|
||||
Reference in New Issue
Block a user