diff --git a/dinky-web/src/pages/DevOps/JobDetail/JobOverview/JobOverview.tsx b/dinky-web/src/pages/DevOps/JobDetail/JobOverview/JobOverview.tsx
index f69cf5a70c..ca52f966d8 100644
--- a/dinky-web/src/pages/DevOps/JobDetail/JobOverview/JobOverview.tsx
+++ b/dinky-web/src/pages/DevOps/JobDetail/JobOverview/JobOverview.tsx
@@ -25,7 +25,7 @@ import { l } from '@/utils/intl';
 import { ProCard } from '@ant-design/pro-components';
 import { Button, Empty, Result } from 'antd';
 import { useState } from 'react';
-import { isStatusDone } from '../../function';
+import { isNotFinallyStatus } from '../../function';
 
 const JobConfigTab = (props: JobProps) => {
   const { jobDetail } = props;
@@ -34,7 +34,7 @@ const JobConfigTab = (props: JobProps) => {
 
   return (
     <>
-      {isStatusDone(jobDetail?.instance?.status as string) && !showHistory ? (
+      {isNotFinallyStatus(jobDetail?.instance?.status as string) && !showHistory ? (
         <Result
           status='warning'
           title={l('devops.jobinfo.unable.obtain.status')}
@@ -51,7 +51,7 @@ const JobConfigTab = (props: JobProps) => {
           }
         />
       ) : undefined}
-      {showHistory || !isStatusDone(jobDetail?.instance?.status as string) ? (
+      {showHistory || !isNotFinallyStatus(jobDetail?.instance?.status as string) ? (
         <>
           <JobDesc jobDetail={jobDetail} />
           <ProCard
diff --git a/dinky-web/src/pages/DevOps/JobList/components/JobHistoryList/JobHistoryList.tsx b/dinky-web/src/pages/DevOps/JobList/components/JobHistoryList/JobHistoryList.tsx
index 16e57b8606..9a5162dc25 100644
--- a/dinky-web/src/pages/DevOps/JobList/components/JobHistoryList/JobHistoryList.tsx
+++ b/dinky-web/src/pages/DevOps/JobList/components/JobHistoryList/JobHistoryList.tsx
@@ -18,10 +18,10 @@
  */
 
 import StatusTag from '@/components/JobTags/StatusTag';
+import { getJobDuration } from '@/pages/DevOps/function';
 import { queryList } from '@/services/api';
 import { API_CONSTANTS } from '@/services/endpoints';
 import { Jobs } from '@/types/DevOps/data';
-import { parseSecondStr } from '@/utils/function';
 import { l } from '@/utils/intl';
 import type { ActionType, ProColumns } from '@ant-design/pro-components';
 import { ProTable } from '@ant-design/pro-components';
@@ -62,7 +62,7 @@ const JobHistoryList = (props: HistoryProps) => {
     },
     {
       title: l('global.table.useTime'),
-      render: (_: any, row: { duration: number }) => parseSecondStr(row.duration)
+      render: (_: any, row: Jobs.JobInstance) => getJobDuration(row)
     },
     {
       title: l('global.table.operate'),
diff --git a/dinky-web/src/pages/DevOps/JobList/index.tsx b/dinky-web/src/pages/DevOps/JobList/index.tsx
index 7eaf7f68e9..b200512799 100644
--- a/dinky-web/src/pages/DevOps/JobList/index.tsx
+++ b/dinky-web/src/pages/DevOps/JobList/index.tsx
@@ -21,12 +21,12 @@ import JobLifeCycleTag from '@/components/JobTags/JobLifeCycleTag';
 import StatusTag from '@/components/JobTags/StatusTag';
 import { DevopContext } from '@/pages/DevOps';
 import { JOB_LIFE_CYCLE } from '@/pages/DevOps/constants';
+import { getJobDuration } from '@/pages/DevOps/function';
 import JobHistoryList from '@/pages/DevOps/JobList/components/JobHistoryList/JobHistoryList';
 import { queryList } from '@/services/api';
 import { PROTABLE_OPTIONS_PUBLIC } from '@/services/constants';
 import { API_CONSTANTS } from '@/services/endpoints';
 import { Jobs } from '@/types/DevOps/data';
-import { parseMilliSecondStr } from '@/utils/function';
 import { l } from '@/utils/intl';
 import { ClockCircleTwoTone, EyeTwoTone, RedoOutlined } from '@ant-design/icons';
 import type { ActionType, ProColumns } from '@ant-design/pro-components';
@@ -77,7 +77,7 @@ const JobList = () => {
     {
       title: l('global.table.useTime'),
       hideInSearch: true,
-      render: (_: any, row: Jobs.JobInstance) => parseMilliSecondStr(row.duration)
+      render: (_: any, row: Jobs.JobInstance) => getJobDuration(row)
     },
     {
       title: l('global.table.status'),
diff --git a/dinky-web/src/pages/DevOps/function.tsx b/dinky-web/src/pages/DevOps/function.tsx
index 26594729c9..f45b07d154 100644
--- a/dinky-web/src/pages/DevOps/function.tsx
+++ b/dinky-web/src/pages/DevOps/function.tsx
@@ -18,6 +18,8 @@
  */
 
 import { JOB_STATUS } from '@/pages/DevOps/constants';
+import { Jobs } from '@/types/DevOps/data';
+import { parseMilliSecondStr } from '@/utils/function';
 
 /**
  * Checks if a job status indicates that the job is done.
@@ -39,3 +41,25 @@ export function isStatusDone(type: string) {
       return false;
   }
 }
+export function isNotFinallyStatus(type: string) {
+  if (!type) {
+    return true;
+  }
+  switch (type) {
+    case JOB_STATUS.RECONNECTING:
+    case JOB_STATUS.UNKNOWN:
+      return true;
+    default:
+      return false;
+  }
+}
+
+export function getJobDuration(jobInstance: Jobs.JobInstance) {
+  if (isStatusDone(jobInstance.status)) {
+    return parseMilliSecondStr(jobInstance.duration);
+  } else {
+    const currentTimestamp = Date.now();
+    const duration = currentTimestamp - new Date(jobInstance.createTime).getTime();
+    return parseMilliSecondStr(duration);
+  }
+}