diff --git a/react-ui/src/pages/ActiveLearn/Instance/index.tsx b/react-ui/src/pages/ActiveLearn/Instance/index.tsx index d16d5428..5655e60d 100644 --- a/react-ui/src/pages/ActiveLearn/Instance/index.tsx +++ b/react-ui/src/pages/ActiveLearn/Instance/index.tsx @@ -153,6 +153,7 @@ function ActiveLearnInstance() { className={styles['active-learn-instance__basic']} info={experimentInfo} runStatus={workflowStatus} + instanceStatus={instanceInfo?.status} isInstance /> ), diff --git a/react-ui/src/pages/ActiveLearn/components/ActiveLearnBasic/index.tsx b/react-ui/src/pages/ActiveLearn/components/ActiveLearnBasic/index.tsx index 5c0d4e3e..3c75eb61 100644 --- a/react-ui/src/pages/ActiveLearn/components/ActiveLearnBasic/index.tsx +++ b/react-ui/src/pages/ActiveLearn/components/ActiveLearnBasic/index.tsx @@ -1,6 +1,5 @@ import ConfigInfo, { type BasicInfoData } from '@/components/ConfigInfo'; -import RunDuration from '@/components/RunDuration'; -import { AutoMLTaskType, autoMLTaskTypeOptions } from '@/enums'; +import { AutoMLTaskType, autoMLTaskTypeOptions, ExperimentStatus } from '@/enums'; import { useComputingResource } from '@/hooks/useComputingResource'; import { classifierAlgorithms, @@ -10,7 +9,7 @@ import { regressorAlgorithms, } from '@/pages/ActiveLearn/components/CreateForm/utils'; import { ActiveLearnData } from '@/pages/ActiveLearn/types'; -import { experimentStatusInfo } from '@/pages/Experiment/status'; +import ExperimentRunBasic from '@/pages/AutoML/components/ExperimentRunBasic'; import { type NodeStatus } from '@/types'; import { formatBoolean, @@ -21,7 +20,6 @@ import { formatMirror, formatModel, } from '@/utils/format'; -import { Flex } from 'antd'; import classNames from 'classnames'; import { useMemo } from 'react'; import styles from './index.less'; @@ -31,9 +29,16 @@ type BasicInfoProps = { className?: string; isInstance?: boolean; runStatus?: NodeStatus; + instanceStatus?: ExperimentStatus; }; -function BasicInfo({ info, className, runStatus, isInstance = false }: BasicInfoProps) { +function BasicInfo({ + info, + className, + runStatus, + instanceStatus, + isInstance = false, +}: BasicInfoProps) { const getResourceDescription = useComputingResource()[1]; const basicDatas: BasicInfoData[] = useMemo(() => { if (!info) { @@ -205,53 +210,13 @@ function BasicInfo({ info, className, runStatus, isInstance = false }: BasicInfo ]; }, [info, getResourceDescription]); - const instanceDatas = useMemo(() => { - if (!info || !runStatus) { - return []; - } - - return [ - { - label: '启动时间', - value: formatDate(info.create_time), - }, - { - label: '执行时长', - value: , - }, - { - label: '状态', - value: ( - - -
- {experimentStatusInfo[runStatus?.phase]?.label} -
-
- ), - }, - ]; - }, [runStatus, info]); - return (
{isInstance && runStatus && ( - )} {!isInstance && ( diff --git a/react-ui/src/pages/AutoML/Instance/index.tsx b/react-ui/src/pages/AutoML/Instance/index.tsx index 5f1b5e34..e0fb5e4d 100644 --- a/react-ui/src/pages/AutoML/Instance/index.tsx +++ b/react-ui/src/pages/AutoML/Instance/index.tsx @@ -156,6 +156,7 @@ function AutoMLInstance() { className={styles['auto-ml-instance__basic']} info={autoMLInfo} runStatus={workflowStatus} + instanceStatus={instanceInfo?.status} isInstance /> ), diff --git a/react-ui/src/pages/AutoML/components/AutoMLBasic/index.tsx b/react-ui/src/pages/AutoML/components/AutoMLBasic/index.tsx index c421c59e..08c95ed9 100644 --- a/react-ui/src/pages/AutoML/components/AutoMLBasic/index.tsx +++ b/react-ui/src/pages/AutoML/components/AutoMLBasic/index.tsx @@ -1,20 +1,19 @@ import ConfigInfo, { type BasicInfoData } from '@/components/ConfigInfo'; -import RunDuration from '@/components/RunDuration'; import { AutoMLTaskType, AutoMLType, + ExperimentStatus, autoMLEnsembleClassOptions, autoMLTaskTypeOptions, } from '@/enums'; import { useComputingResource } from '@/hooks/useComputingResource'; import { AutoMLData } from '@/pages/AutoML/types'; -import { experimentStatusInfo } from '@/pages/Experiment/status'; import { type NodeStatus } from '@/types'; import { parseJsonText } from '@/utils'; import { formatBoolean, formatDataset, formatDate, formatEnum } from '@/utils/format'; -import { Flex } from 'antd'; import classNames from 'classnames'; import { useMemo } from 'react'; +import ExperimentRunBasic from '../ExperimentRunBasic'; import styles from './index.less'; // 格式化优化方向 @@ -40,9 +39,16 @@ type AutoMLBasicProps = { className?: string; isInstance?: boolean; runStatus?: NodeStatus; + instanceStatus?: ExperimentStatus; }; -function AutoMLBasic({ info, className, runStatus, isInstance = false }: AutoMLBasicProps) { +function AutoMLBasic({ + info, + className, + runStatus, + instanceStatus, + isInstance = false, +}: AutoMLBasicProps) { const getResourceDescription = useComputingResource()[1]; const basicDatas: BasicInfoData[] = useMemo(() => { if (!info) { @@ -284,53 +290,13 @@ function AutoMLBasic({ info, className, runStatus, isInstance = false }: AutoMLB ]; }, [info]); - const instanceDatas = useMemo(() => { - if (!info || !runStatus) { - return []; - } - - return [ - { - label: '启动时间', - value: formatDate(info.create_time), - }, - { - label: '执行时长', - value: , - }, - { - label: '状态', - value: ( - - -
- {experimentStatusInfo[runStatus?.phase]?.label} -
-
- ), - }, - ]; - }, [runStatus, info]); - return (
{isInstance && runStatus && ( - )} {!isInstance && ( diff --git a/react-ui/src/pages/AutoML/components/ExperimentList/index.tsx b/react-ui/src/pages/AutoML/components/ExperimentList/index.tsx index 442f38f5..b71952b2 100644 --- a/react-ui/src/pages/AutoML/components/ExperimentList/index.tsx +++ b/react-ui/src/pages/AutoML/components/ExperimentList/index.tsx @@ -8,6 +8,7 @@ import KFIcon from '@/components/KFIcon'; import PageTitle from '@/components/PageTitle'; import { ExperimentStatus, autoMLTypeOptions } from '@/enums'; import { useCacheState } from '@/hooks/useCacheState'; +import { useServerTime } from '@/hooks/useServerTime'; import { AutoMLData } from '@/pages/AutoML/types'; import { experimentStatusInfo } from '@/pages/Experiment/status'; import themes from '@/styles/theme.less'; @@ -51,6 +52,7 @@ function ExperimentList({ type }: ExperimentListProps) { const [experimentInsList, setExperimentInsList] = useState([]); const [expandedRowKeys, setExpandedRowKeys] = useState([]); const [experimentInsTotal, setExperimentInsTotal] = useState(0); + const [now] = useServerTime(); const [pagination, setPagination] = useState( cacheState?.pagination ?? { current: 1, @@ -275,6 +277,7 @@ function ExperimentList({ type }: ExperimentListProps) { return { ...item, status: ExperimentStatus.Terminated, + finish_time: now().toISOString(), }; } return item; diff --git a/react-ui/src/pages/AutoML/components/ExperimentRunBasic/index.tsx b/react-ui/src/pages/AutoML/components/ExperimentRunBasic/index.tsx new file mode 100644 index 00000000..e088c7e8 --- /dev/null +++ b/react-ui/src/pages/AutoML/components/ExperimentRunBasic/index.tsx @@ -0,0 +1,70 @@ +import ConfigInfo from '@/components/ConfigInfo'; +import RunDuration from '@/components/RunDuration'; +import { ExperimentStatus } from '@/enums'; +import { experimentStatusInfo } from '@/pages/Experiment/status'; +import { type NodeStatus } from '@/types'; +import { formatDate } from '@/utils/format'; +import { Flex } from 'antd'; +import { useMemo } from 'react'; + +type ExperimentRunBasicProps = { + create_time?: string; + runStatus?: NodeStatus; + instanceStatus?: ExperimentStatus; +}; + +function ExperimentRunBasic({ create_time, runStatus, instanceStatus }: ExperimentRunBasicProps) { + const instanceDatas = useMemo(() => { + if (!runStatus) { + return []; + } + + const status = + instanceStatus === ExperimentStatus.Terminated ? instanceStatus : runStatus.phase; + const statusInfo = experimentStatusInfo[status]; + + return [ + { + label: '启动时间', + value: formatDate(create_time), + }, + { + label: '执行时长', + value: , + }, + { + label: '状态', + value: ( + + +
+ {statusInfo?.label} +
+
+ ), + }, + ]; + }, [runStatus, create_time, instanceStatus]); + + return ( + + ); +} + +export default ExperimentRunBasic; diff --git a/react-ui/src/pages/Dataset/components/ResourceItem/index.less b/react-ui/src/pages/Dataset/components/ResourceItem/index.less index 01be647c..58b5be62 100644 --- a/react-ui/src/pages/Dataset/components/ResourceItem/index.less +++ b/react-ui/src/pages/Dataset/components/ResourceItem/index.less @@ -55,9 +55,7 @@ } &__time { display: flex; - flex: 0 1 content; align-items: center; - width: 100%; color: #808080; font-size: 13px; } diff --git a/react-ui/src/pages/Experiment/index.jsx b/react-ui/src/pages/Experiment/index.jsx index e94c625c..1ecc7df1 100644 --- a/react-ui/src/pages/Experiment/index.jsx +++ b/react-ui/src/pages/Experiment/index.jsx @@ -28,6 +28,7 @@ import AddExperimentModal from './components/AddExperimentModal'; import ExperimentInstanceList from './components/ExperimentInstanceList'; import styles from './index.less'; import { experimentStatusInfo } from './status'; +import { useServerTime } from '@/hooks/useServerTime'; // 定时器 const timerIds = new Map(); @@ -47,6 +48,7 @@ function Experiment() { const [cacheState, setCacheState] = useCacheState(); const [searchText, setSearchText] = useState(cacheState?.searchText); const [inputText, setInputText] = useState(cacheState?.searchText); + const [now] = useServerTime(); const [pagination, setPagination] = useState( cacheState?.pagination ?? { current: 1, @@ -384,6 +386,7 @@ function Experiment() { return { ...item, status: ExperimentStatus.Terminated, + finish_time: now().toISOString(), }; } return item; diff --git a/react-ui/src/pages/HyperParameter/Instance/index.tsx b/react-ui/src/pages/HyperParameter/Instance/index.tsx index a0ebae5b..79905c36 100644 --- a/react-ui/src/pages/HyperParameter/Instance/index.tsx +++ b/react-ui/src/pages/HyperParameter/Instance/index.tsx @@ -168,6 +168,7 @@ function HyperParameterInstance() { className={styles['hyper-parameter-instance__basic']} info={experimentInfo} runStatus={workflowStatus} + instanceStatus={instanceInfo?.status} isInstance /> ), diff --git a/react-ui/src/pages/HyperParameter/components/HyperParameterBasic/index.tsx b/react-ui/src/pages/HyperParameter/components/HyperParameterBasic/index.tsx index 3e526848..f4b9852b 100644 --- a/react-ui/src/pages/HyperParameter/components/HyperParameterBasic/index.tsx +++ b/react-ui/src/pages/HyperParameter/components/HyperParameterBasic/index.tsx @@ -1,7 +1,8 @@ import ConfigInfo, { type BasicInfoData } from '@/components/ConfigInfo'; import RunDuration from '@/components/RunDuration'; -import { hyperParameterOptimizedMode } from '@/enums'; +import { ExperimentStatus, hyperParameterOptimizedMode } from '@/enums'; import { useComputingResource } from '@/hooks/useComputingResource'; +import ExperimentRunBasic from '@/pages/AutoML/components/ExperimentRunBasic'; import { experimentStatusInfo } from '@/pages/Experiment/status'; import { schedulerAlgorithms, @@ -33,12 +34,14 @@ type HyperParameterBasicProps = { className?: string; isInstance?: boolean; runStatus?: NodeStatus; + instanceStatus?: ExperimentStatus; }; function HyperParameterBasic({ info, className, runStatus, + instanceStatus, isInstance = false, }: HyperParameterBasicProps) { const getResourceDescription = useComputingResource()[1]; @@ -187,11 +190,10 @@ function HyperParameterBasic({ return (
{isInstance && runStatus && ( - )} {!isInstance && (