diff --git a/react-ui/src/hooks/useSSE.ts b/react-ui/src/hooks/useSSE.ts index 9f364f68..4ed9d7f2 100644 --- a/react-ui/src/hooks/useSSE.ts +++ b/react-ui/src/hooks/useSSE.ts @@ -5,8 +5,9 @@ import { NodeStatus } from '@/types'; export type MessageHandler = (experimentInsId: number, status: string, finishedAt: string, nodes: Record) => void export const useSSE = (experimentInsId: number, status: ExperimentStatus, name: string, namespace: string, onMessage: MessageHandler) => { + const isRunning = status === ExperimentStatus.Pending || status === ExperimentStatus.Running useEffect(() => { - if (status === ExperimentStatus.Pending || status === ExperimentStatus.Running) { + if (isRunning) { const { origin } = location; const params = encodeURIComponent(`metadata.namespace=${namespace},metadata.name=${name}`); const evtSource = new EventSource( @@ -35,5 +36,5 @@ export const useSSE = (experimentInsId: number, status: ExperimentStatus, name: } } - }, [experimentInsId, status, name, namespace, onMessage]); + }, [experimentInsId, isRunning, name, namespace, onMessage]); }; diff --git a/react-ui/src/hooks/useServerTime.ts b/react-ui/src/hooks/useServerTime.ts index 89b39775..a5c6f229 100644 --- a/react-ui/src/hooks/useServerTime.ts +++ b/react-ui/src/hooks/useServerTime.ts @@ -11,44 +11,43 @@ import { useCallback, useEffect, useState } from 'react'; let globalTimeOffset: number | undefined = undefined; export const globalGetSeverTime = async () => { - const requestStartTime = Date.now() + const requestStartTime = Date.now(); const [res] = await to(getSeverTimeReq()); - const requestEndTime = Date.now() + const requestEndTime = Date.now(); const requestDuration = (requestEndTime - requestStartTime) / 2; if (res && res.data) { const serverDate = new Date(res.data); - const timeOffset = serverDate.getTime() + requestDuration - requestEndTime ; + const timeOffset = serverDate.getTime() + requestDuration - requestEndTime; globalTimeOffset = timeOffset; - return timeOffset + return timeOffset; } }; export const now = () => { - return new Date(Date.now() + (globalTimeOffset ?? 0)) -} + return new Date(Date.now() + (globalTimeOffset ?? 0)); +}; /** 获取服务器时间 */ export function useServerTime() { const [timeOffset, setTimeOffset] = useState(globalTimeOffset ?? 0); useEffect(() => { - // 获取服务器时间 const getSeverTime = async () => { const [res] = await to(globalGetSeverTime()); if (res) { - setTimeOffset(res) + setTimeOffset(res); } }; + // 获取服务器时间,防止第一次加载时,请求失败 if (!globalTimeOffset) { getSeverTime(); } }, []); const now = useCallback(() => { - return new Date(Date.now() + timeOffset) - }, [timeOffset]) - + return new Date(Date.now() + timeOffset); + }, [timeOffset]); - return [now, timeOffset] as const; + return [now] as const; } diff --git a/react-ui/src/pages/AutoML/components/ExperimentInstanceList/index.less b/react-ui/src/pages/AutoML/components/ExperimentInstanceList/index.less index 833ced06..94258c7f 100644 --- a/react-ui/src/pages/AutoML/components/ExperimentInstanceList/index.less +++ b/react-ui/src/pages/AutoML/components/ExperimentInstanceList/index.less @@ -1,3 +1,5 @@ +@cellWidth: calc(100% + 32px + 33px - 48px - 200px - 344px); + .tableExpandBox { display: flex; align-items: center; @@ -11,22 +13,22 @@ } .check { - width: calc((100% + 32px + 33px) / 5 / 2); + width: calc(@cellWidth * 3 / 20); // 15% } .index { - width: calc((100% + 32px + 33px) / 5 / 2); + width: calc(@cellWidth * 3 / 20); // 15% } .description { display: flex; - flex: 1; align-items: center; + width: calc(@cellWidth / 2); // 50% } .startTime { .singleLine(); - width: 200px; + width: calc(@cellWidth / 5); // 20% } .status { diff --git a/react-ui/src/pages/AutoML/components/ExperimentList/index.tsx b/react-ui/src/pages/AutoML/components/ExperimentList/index.tsx index b71952b2..15846f9c 100644 --- a/react-ui/src/pages/AutoML/components/ExperimentList/index.tsx +++ b/react-ui/src/pages/AutoML/components/ExperimentList/index.tsx @@ -302,7 +302,7 @@ function ExperimentList({ type }: ExperimentListProps) { title: '类型', dataIndex: 'type', key: 'type', - width: '10%', + width: '15%', render: tableCellRender(false, TableCellValueType.Enum, { options: autoMLTypeOptions, }), @@ -316,7 +316,7 @@ function ExperimentList({ type }: ExperimentListProps) { title: '实验名称', dataIndex: config.nameProperty, key: 'name', - width: '20%', + width: '30%', render: tableCellRender(false, TableCellValueType.Link, { onClick: gotoDetail, }), @@ -326,13 +326,14 @@ function ExperimentList({ type }: ExperimentListProps) { dataIndex: config.descProperty, key: 'description', render: tableCellRender(true), + width: type === ExperimentListType.AutoML ? '35%' : '50%', }, ...diffColumns, { title: '创建时间', dataIndex: 'update_time', key: 'update_time', - width: 200, + width: '20%', render: tableCellRender(false, TableCellValueType.Date), }, { diff --git a/react-ui/src/pages/Dataset/components/ResourceItem/index.less b/react-ui/src/pages/Dataset/components/ResourceItem/index.less index 58b5be62..618423e1 100644 --- a/react-ui/src/pages/Dataset/components/ResourceItem/index.less +++ b/react-ui/src/pages/Dataset/components/ResourceItem/index.less @@ -58,5 +58,6 @@ align-items: center; color: #808080; font-size: 13px; + min-width: 0; } } diff --git a/react-ui/src/pages/Dataset/components/ResourceItem/index.tsx b/react-ui/src/pages/Dataset/components/ResourceItem/index.tsx index a8cabfe9..22078902 100644 --- a/react-ui/src/pages/Dataset/components/ResourceItem/index.tsx +++ b/react-ui/src/pages/Dataset/components/ResourceItem/index.tsx @@ -14,6 +14,10 @@ type ResourceItemProps = { }; function ResourceItem({ item, isPublic, onClick, onRemove }: ResourceItemProps) { + const timeAgo = + '最近更新: ' + + (item.update_time ? formatDate(item.update_time, 'YYYY-MM-DD') : item.time_ago ?? ''); + const create_by = item.create_by ?? ''; return (
onClick(item)}> @@ -37,7 +41,7 @@ function ResourceItem({ item, isPublic, onClick, onRemove }: ResourceItemProps) )}
{item.description}
- +
- {item.create_by ?? ''} + {create_by}
- - {'最近更新: '} - {item.update_time ? formatDate(item.update_time, 'YYYY-MM-DD') : item.time_ago ?? ''} - + {timeAgo}
diff --git a/react-ui/src/pages/Experiment/Info/index.jsx b/react-ui/src/pages/Experiment/Info/index.jsx index 60424e52..29c21151 100644 --- a/react-ui/src/pages/Experiment/Info/index.jsx +++ b/react-ui/src/pages/Experiment/Info/index.jsx @@ -1,3 +1,4 @@ +import RunDuration from '@/components/RunDuration'; import { ExperimentStatus } from '@/enums'; import { useStateRef } from '@/hooks/useStateRef'; import { useVisible } from '@/hooks/useVisible'; @@ -5,7 +6,7 @@ import { getExperimentIns } from '@/services/experiment/index.js'; import { getWorkflowById } from '@/services/pipeline/index.js'; import themes from '@/styles/theme.less'; import { fittingString, parseJsonText } from '@/utils'; -import { elapsedTime, formatDate } from '@/utils/date'; +import { formatDate } from '@/utils/date'; import { to } from '@/utils/promise'; import G6, { Util } from '@antv/g6'; import { Button } from 'antd'; @@ -15,8 +16,6 @@ import ExperimentDrawer from '../components/ExperimentDrawer'; import ParamsModal from '../components/ViewParamsModal'; import { experimentStatusInfo } from '../status'; import styles from './index.less'; -import { useServerTime } from '@/hooks/useServerTime'; -import RunDuration from '@/components/RunDuration'; let graph = null; @@ -476,7 +475,10 @@ function ExperimentText() {
执行时长: - +
状态: diff --git a/react-ui/src/pages/ModelDeployment/CreateVersion/index.less b/react-ui/src/pages/ModelDeployment/CreateVersion/index.less index bf7f7f9d..9186a023 100644 --- a/react-ui/src/pages/ModelDeployment/CreateVersion/index.less +++ b/react-ui/src/pages/ModelDeployment/CreateVersion/index.less @@ -36,6 +36,13 @@ .ant-btn-variant-text { color: #565658; } + + .anticon-question-circle { + margin-top: -12px; + margin-left: 1px !important; + color: @text-color-tertiary !important; + font-size: 12px !important; + } } } } diff --git a/react-ui/src/pages/ModelDeployment/CreateVersion/index.tsx b/react-ui/src/pages/ModelDeployment/CreateVersion/index.tsx index 6a6ecc0b..324b77a8 100644 --- a/react-ui/src/pages/ModelDeployment/CreateVersion/index.tsx +++ b/react-ui/src/pages/ModelDeployment/CreateVersion/index.tsx @@ -337,7 +337,11 @@ function CreateServiceVersion() { - +