fix: 修复创建新版本/删除版本后指标参数差异对比列表未更新

react-ui/src/pages/Dataset/components/ResourceInfo/index.tsx

@@ -13,6 +13,7 @@ import {
 } from '@/pages/Dataset/config';
 import GraphLegend from '@/pages/Model/components/GraphLegend';
 import ModelEvolution from '@/pages/Model/components/ModelEvolution';
+import { VersionChangedMessage } from '@/utils/constant';
 import { openAntdModal } from '@/utils/modal';
 import { to } from '@/utils/promise';
 import { modalConfirm } from '@/utils/ui';
@@ -124,6 +125,7 @@ const ResourceInfo = ({ resourceType }: ResourceInfoProps) => {
       onOk: () => {
         getVersionList(true);
         close();
+        window.postMessage({ type: VersionChangedMessage });
       },
     });
   };
@@ -170,6 +172,7 @@ const ResourceInfo = ({ resourceType }: ResourceInfoProps) => {
     if (res) {
       message.success('删除成功');
       getVersionList(true);
+      window.postMessage({ type: VersionChangedMessage });
     }
   };
 

react-ui/src/pages/Model/components/ModelMetrics/index.tsx

@@ -3,6 +3,7 @@ import TableColTitle from '@/components/TableColTitle';
 import { useCheck } from '@/hooks/useCheck';
 import { getModelPageVersionsReq, getModelVersionsMetricsReq } from '@/services/dataset';
 import { tableSorter } from '@/utils';
+import { VersionChangedMessage } from '@/utils/constant';
 import { to } from '@/utils/promise';
 import tableCellRender from '@/utils/table';
 import { Checkbox, Flex, Table, type TablePaginationConfig, type TableProps } from 'antd';
@@ -27,10 +28,10 @@ type ModelMetricsProps = {
   resourceId: number;
   identifier: string;
   owner: string;
-  version: string;
+  version: string; // 当前版本
 };
 
-function ModelMetrics({ resourceId, identifier, owner, version }: ModelMetricsProps) {
+function ModelMetrics({ resourceId, identifier, owner, version, refreshTag }: ModelMetricsProps) {
   const [pagination, setPagination] = useState<TablePaginationConfig>({
     current: 1,
     pageSize: 10,
@@ -59,6 +60,24 @@ function ModelMetrics({ resourceId, identifier, owner, version }: ModelMetricsPr
     checkSingleMetrics,
   ] = useCheck(allMetricsNames);
 
+  // 新增，删除版本时，重置分页，然后刷新版本列表
+  useEffect(() => {
+    const handleMessage = (e: MessageEvent) => {
+      const { type } = e.data;
+      if (type === VersionChangedMessage) {
+        setPagination({
+          current: 1,
+          pageSize: 10,
+        });
+      }
+    };
+
+    window.addEventListener('message', handleMessage);
+    return () => {
+      window.removeEventListener('message', handleMessage);
+    };
+  }, []);
+
   useEffect(() => {
     // 获取模型版本列表，带有参数和指标数据
     const getModelPageVersions = async () => {
@@ -128,6 +147,7 @@ function ModelMetrics({ resourceId, identifier, owner, version }: ModelMetricsPr
     }
   };
 
+  // 行勾选
   const rowSelection: TableProps<TableData>['rowSelection'] = {
     type: 'checkbox',
     fixed: 'left',
@@ -140,6 +160,7 @@ function ModelMetrics({ resourceId, identifier, owner, version }: ModelMetricsPr
     }),
   };
 
+  // 计算的表格数据
   const showTableData = useMemo(() => {
     const index = tableData.findIndex((item) => item.name === version);
     if (index !== -1) {

react-ui/src/pages/ModelDeployment/CreateService/index.tsx

@@ -8,11 +8,11 @@ import PageTitle from '@/components/PageTitle';
 import SubAreaTitle from '@/components/SubAreaTitle';
 import { CommonTabKeys, serviceTypeOptions } from '@/enums';
 import { createServiceReq, getServiceInfoReq, updateServiceReq } from '@/services/modelDeployment';
+import { ServiceCreatedMessage } from '@/utils/constant';
 import { to } from '@/utils/promise';
 import { useNavigate, useParams } from '@umijs/max';
 import { App, Button, Col, Form, Input, Row, Select } from 'antd';
 import { useEffect } from 'react';
-import { createServiceVersionMessage } from '../types';
 import styles from './index.less';
 
 // 表单数据
@@ -63,7 +63,7 @@ function CreateService() {
       navigate(-1);
       if (!serviceId) {
         setTimeout(() => {
-          window.postMessage({ type: createServiceVersionMessage, payload: res.data.id });
+          window.postMessage({ type: ServiceCreatedMessage, payload: res.data.id });
         }, 500);
       }
     }

react-ui/src/pages/ModelDeployment/List/index.tsx

@@ -31,9 +31,9 @@ import {
   CreateServiceVersionFrom,
   ServiceData,
   ServiceOperationType,
-  createServiceVersionMessage,
 } from '../types';
 import styles from './index.less';
+import { ServiceCreatedMessage } from '@/utils/constant';
 
 const allServiceTypeOptions = [{ label: '全部', value: '' }, ...serviceTypeOptions];
 
@@ -95,7 +95,7 @@ function ModelDeployment() {
   useEffect(() => {
     const handleMessage = (e: MessageEvent) => {
       const { type, payload } = e.data;
-      if (type === createServiceVersionMessage) {
+      if (type === ServiceCreatedMessage) {
         modalConfirm({
           title: '创建服务成功',
           content: '是否创建服务版本?',

react-ui/src/pages/ModelDeployment/types.ts

@@ -63,6 +63,3 @@ export enum CreateServiceVersionFrom {
   CreateService = 'CreateService', // 来自创建服务
   ServiceInfo = 'ServiceInfo', // 来自服务详情
 }
-
-// 去创建服务版本消息
-export const createServiceVersionMessage = 'createServiceVersion';

react-ui/src/utils/constant.ts

@@ -10,4 +10,10 @@ const xllCols = { span: 10 };
 /**
  * 输入控件宽度，xl: 12, xll: 10
  */
-export const formCols = { xl: xlCols, xxl: xllCols };
+export const FormCols = { xl: xlCols, xxl: xllCols };
+
+// 数据集、模型新增和删除版本消息
+export const VersionChangedMessage = 'versionChanged';
+
+// 创建服务成功消息，去创建服务版本
+export const ServiceCreatedMessage = 'serviceCreated';