-
- 启动时间：{momnet(message.create_time).format('YYYY-MM-DD HH:mm:ss')}
-
+
启动时间：{formatDate(message.create_time)}
执行时长：
{message.finish_time
diff --git a/react-ui/src/pages/Experiment/experimentText/props.jsx b/react-ui/src/pages/Experiment/experimentText/props.jsx
index 7683c833..98ef4984 100644
--- a/react-ui/src/pages/Experiment/experimentText/props.jsx
+++ b/react-ui/src/pages/Experiment/experimentText/props.jsx
@@ -1,5 +1,5 @@
import { getNodeResult, getQueryByExperimentLog } from '@/services/experiment/index.js';
-import { elapsedTime } from '@/utils/date';
+import { elapsedTime, formatDate } from '@/utils/date';
import { downLoadZip } from '@/utils/downloadfile';
import { DatabaseOutlined, ProfileOutlined } from '@ant-design/icons';
import { Drawer, Form, Input, Tabs, message } from 'antd';
@@ -419,7 +419,7 @@ const Props = forwardRef(({ onParentChange }, ref) => {
- 启动时间：{moment(stagingItem.experimentStartTime).format('YYYY-MM-DD HH:mm:ss')}
+ 启动时间：{formatDate(stagingItem.experimentStartTime)}
耗时：
diff --git a/react-ui/src/pages/Experiment/index.jsx b/react-ui/src/pages/Experiment/index.jsx
index 1c93f834..43db02f9 100644
--- a/react-ui/src/pages/Experiment/index.jsx
+++ b/react-ui/src/pages/Experiment/index.jsx
@@ -14,12 +14,11 @@ import {
} from '@/services/experiment/index.js';
import { getWorkflow } from '@/services/pipeline/index.js';
import themes from '@/styles/theme.less';
-import { elapsedTime } from '@/utils/date';
+import { elapsedTime, formatDate } from '@/utils/date';
import { to } from '@/utils/promise';
import { modalConfirm } from '@/utils/ui';
import { Button, ConfigProvider, Space, Table, message } from 'antd';
import classNames from 'classnames';
-import momnet from 'moment';
import { useEffect, useRef, useState } from 'react';
import { useNavigate } from 'react-router-dom';
import AddExperimentModal from './components/AddExperimentModal';
@@ -442,9 +441,7 @@ function Experiment() {
? elapsedTime(new Date(item.create_time), new Date(item.finish_time))
: elapsedTime(new Date(item.create_time), new Date())}
-
- {momnet(item.create_time).format('YYYY-MM-DD HH:mm:ss')}
-
+
{formatDate(item.create_time)}
![]()
{
title: '更新时间',
dataIndex: 'update_time',
key: 'update_time',
- render: (text) =>
{moment(text).format('YYYY-MM-DD HH:mm:ss')},
+ render: (text) =>
{formatDate(text)},
},
{
title: '操作',
diff --git a/react-ui/src/pages/ModelDeployment/info.tsx b/react-ui/src/pages/ModelDeployment/info.tsx
index 3bc67279..3e4e8a81 100644
--- a/react-ui/src/pages/ModelDeployment/info.tsx
+++ b/react-ui/src/pages/ModelDeployment/info.tsx
@@ -7,10 +7,10 @@ import KFIcon from '@/components/KFIcon';
import PageTitle from '@/components/PageTitle';
import SubAreaTitle from '@/components/SubAreaTitle';
import { getMirrorInfoReq } from '@/services/mirror';
+import { formatDate } from '@/utils/date';
import { to } from '@/utils/promise';
import { useNavigate, useParams } from '@umijs/max';
import { Col, Row, Tabs, type TabsProps } from 'antd';
-import dayjs from 'dayjs';
import { useEffect, useState } from 'react';
import styles from './info.less';
@@ -65,8 +65,7 @@ function ModelDeploymentInfo() {
const [res] = await to(getMirrorInfoReq(id));
if (res && res.data) {
const { name = '', description = '', version_count = '', create_time: time } = res.data;
- let create_time =
- time && dayjs(time).isValid() ? dayjs(time).format('YYYY-MM-DD HH:mm:ss') : '--';
+ const create_time = formatDate(time);
setMirrorInfo({
name,
description,
diff --git a/react-ui/src/pages/Pipeline/index.jsx b/react-ui/src/pages/Pipeline/index.jsx
index fcbdc03e..ee2ac6ae 100644
--- a/react-ui/src/pages/Pipeline/index.jsx
+++ b/react-ui/src/pages/Pipeline/index.jsx
@@ -1,3 +1,4 @@
+import DateTableCell from '@/components/DateTableCell';
import KFIcon from '@/components/KFIcon';
import KFModal from '@/components/KFModal';
import {
@@ -12,7 +13,6 @@ import themes from '@/styles/theme.less';
import { modalConfirm } from '@/utils/ui';
import { Button, ConfigProvider, Form, Input, Space, Table, message } from 'antd';
import classNames from 'classnames';
-import momnet from 'moment';
import { useEffect, useRef, useState } from 'react';
import { useNavigate } from 'react-router-dom';
import Styles from './index.less';
@@ -138,13 +138,13 @@ const Pipeline = () => {
title: '创建时间',
dataIndex: 'create_time',
key: 'create_time',
- render: (text) =>
{momnet(text).format('YYYY-MM-DD HH:mm:ss')},
+ render: DateTableCell,
},
{
title: '修改时间',
dataIndex: 'update_time',
key: 'update_time',
- render: (text) =>
{momnet(text).format('YYYY-MM-DD HH:mm:ss')},
+ render: DateTableCell,
},
{
title: '操作',
diff --git a/react-ui/src/utils/date.ts b/react-ui/src/utils/date.ts
index eaab9f3f..be015cc6 100644
--- a/react-ui/src/utils/date.ts
+++ b/react-ui/src/utils/date.ts
@@ -1,4 +1,12 @@
import dayjs from 'dayjs';
+
+/**
+ * Calculates the elapsed time between two dates and returns a formatted string representing the duration.
+ *
+ * @param {Date} beginDate - The starting date.
+ * @param {Date} endDate - The ending date.
+ * @return {string} The formatted elapsed time string.
+ */
export const elapsedTime = (beginDate: Date, endDate: Date): string => {
if (!isValidDate(beginDate) || !isValidDate(endDate)) {
return '--';
@@ -29,7 +37,12 @@ export const elapsedTime = (beginDate: Date, endDate: Date): string => {
return `${minutes}分${seconds}秒`;
};
-// 是否是有效的日期
+/**
+ * 是否是有效的日期
+ *
+ * @param {Date} date - The date to check.
+ * @return {boolean} True if the date is valid, false otherwise.
+ */
export const isValidDate = (date: Date): boolean => {
if (date instanceof Date) {
return !Number.isNaN(date.getTime()); // valueOf() 也可以
@@ -37,14 +50,38 @@ export const isValidDate = (date: Date): boolean => {
return false;
};
-// 格式化日期
-export const formatDate = (text: Date | string, format = 'YYYY-MM-DD HH:mm:ss'): string => {
- if (text === undefined || text === null || text === '') {
+/**
+ * 能否使用 dayjs 转换成 Date
+ *
+ * @param {Date | string | number | null | undefined} date - The date to be checked.
+ * @return {boolean} Returns true if the date can be converted to a valid Date object, otherwise returns false.
+ */
+export const canBeConvertToDate = (date?: Date | string | number | null): boolean => {
+ if (date === undefined || date === null || date === '') {
+ return false;
+ }
+ const convertedDate = dayjs(date);
+ return convertedDate.isValid();
+};
+
+/**
+ * 转换日期
+ *
+ * @param {Date | string | number | null | undefined} date - The date to format.
+ * @param {string} [format='YYYY-MM-DD HH:mm:ss'] - The format string to use.
+ * @return {string} The formatted date string.
+ */
+export const formatDate = (
+ date?: Date | string | number | null,
+ format: string = 'YYYY-MM-DD HH:mm:ss',
+): string => {
+ if (date === undefined || date === null || date === '') {
return '--';
}
- if (!dayjs(text).isValid()) {
+ const convertedDate = dayjs(date);
+ if (!convertedDate.isValid()) {
return '--';
}
- return dayjs(text).format(format);
+ return convertedDate.format(format);
};