🔨 添加执行超时.

orion-ops-ui/src/views/exec/exec-command/components/log-panel-view.vue

@@ -6,7 +6,35 @@
          class="log-view">
       <!-- 面板头部 -->
       <div class="log-header">
-        header
+        <!-- 左侧信息 -->
+        <div class="log-header-left">
+          <a-space :size="12">
+            <!-- 状态 -->
+            <a-tag :color="getDictValue(execHostStatusKey, host.status, 'color')">
+              {{ getDictValue(execHostStatusKey, host.status) }}
+            </a-tag>
+            <!-- exitStatus -->
+            <a-tag v-if="host.exitStatus || host.exitStatus === 0"
+                   :color="host.exitStatus === 0 ? 'arcoblue' : 'orangered'"
+                   title="exit status">
+              <template #icon>
+                <icon-check v-if="host.exitStatus === 0" />
+                <icon-exclamation v-else />
+              </template>
+              <span class="tag-value">{{ host.exitStatus }}</span>
+            </a-tag>
+            <!-- 持续时间 -->
+            <a-tag color="arcoblue" title="持续时间">
+              <template #icon>
+                <icon-loading v-if="host.status === execHostStatus.WAITING || host.status === execHostStatus.RUNNING" />
+                <icon-clock-circle v-else />
+              </template>
+              <span class="tag-value">{{ formatDuration(host.startTime, host.finishTime) || '0s' }}</span>
+            </a-tag>
+          </a-space>
+        </div>
+        <!-- 右侧操作 -->
+        <div class="log-header-right">TODO</div>
       </div>
       <!-- 日志面板 -->
       <div class="log-wrapper">
@@ -25,10 +53,13 @@
 
 <script lang="ts" setup>
   import type { VNodeRef } from 'vue';
-  import type { ExecCommandResponse, ExecCommandHostResponse } from '@/api/exec/exec';
-  import type { LogDomRef, ILogAppender } from '@/components/view/log-appender/appender.const';
+  import type { ExecCommandResponse } from '@/api/exec/exec';
+  import type { LogDomRef, ILogAppender } from '@/components/xtrem/log-appender/appender.const';
   import { nextTick, ref } from 'vue';
-  import LogAppender from '@/components/view/log-appender/log-appender';
+  import { formatDuration } from '@/utils';
+  import { execHostStatus, execHostStatusKey } from '@/views/exec/exec-log/types/const';
+  import { useDictStore } from '@/store';
+  import LogAppender from '@/components/xtrem/log-appender/log-appender';
   import 'xterm/css/xterm.css';
 
   const props = defineProps<{
@@ -36,6 +67,8 @@
     command: ExecCommandResponse;
   }>();
 
+  const { getDictValue } = useDictStore();
+
   const logRefs = ref<Array<LogDomRef>>([]);
   const appender = ref<ILogAppender>();
 
@@ -80,7 +113,25 @@
   .log-header {
     width: 100%;
     height: @header-height;
-    background: green;
+    padding: 8px;
+    border-radius: 4px 4px 0 0;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    background: var(--color-bg-1);
+    color: var(--color-text-1);
+
+    :deep(.arco-tag-icon) {
+      font-size: 14px;
+    }
+
+    .tag-value {
+      font-weight: 600;
+    }
+
+    &-right {
+
+    }
   }
 
   .log-wrapper {

orion-ops-ui/src/views/exec/exec-command/components/log-panel.vue

@@ -27,6 +27,7 @@
   import { execStatus } from '@/views/exec/exec-log/types/const';
   import LogPanelHost from './log-panel-host.vue';
   import LogPanelView from './log-panel-view.vue';
+  import { useDictStore } from '@/store';
 
   const emits = defineEmits(['back']);
 
@@ -65,7 +66,7 @@
       if (hostStatus) {
         host.status = hostStatus.status;
         host.startTime = hostStatus.startTime;
-        host.finishTime = hostStatus.finishTime;
+        host.finishTime = hostStatus.finishTime || Date.now();
         host.exitStatus = hostStatus.exitStatus;
         host.errorMessage = hostStatus.errorMessage;
       }
@@ -116,7 +117,6 @@
 
   .host-container, .log-container {
     height: 100%;
-    padding: 16px;
     border-radius: 4px;
     position: relative;
     background: var(--color-bg-2);
@@ -124,6 +124,7 @@
 
   .host-container {
     width: @host-width;
+    padding: 16px;
     margin-right: 16px;
   }
 

orion-ops-ui/src/views/exec/exec-command/index.vue

@@ -76,7 +76,7 @@
           hostId: 4,
           hostName: 'main-44',
           hostAddress: '192.412.53.2',
-          status: 'FAILED'
+          status: 'TIMEOUT'
         },]
     } as ExecCommandResponse);
   });

orion-ops-ui/src/views/exec/exec-log/components/exec-log-table.vue

@@ -221,7 +221,7 @@
 
   const emits = defineEmits(['viewCommand', 'viewParams', 'viewLog', 'openClear']);
 
-  // TODO 日志 清理 ctrl日志 ctrl重新执行
+  // TODO 日志 ctrl日志 ctrl重新执行
 
   const pagination = usePagination();
   const rowSelection = useRowSelection();

orion-ops-ui/src/views/exec/exec-log/types/const.ts

@@ -24,6 +24,8 @@ export const execHostStatus = {
   COMPLETED: 'COMPLETED',
   // 执行失败
   FAILED: 'FAILED',
+  // 执行超时
+  TIMEOUT: 'TIMEOUT',
   // 已中断
   INTERRUPTED: 'INTERRUPTED',
 };

orion-ops-ui/src/views/user/operator-log/components/operator-log-simple-table.vue

@@ -68,7 +68,7 @@
 
 <script lang="ts" setup>
   import type { OperatorLogQueryRequest, OperatorLogQueryResponse } from '@/api/user/operator-log';
-  import { ref, onMounted, onBeforeMount } from 'vue';
+  import { ref, onMounted } from 'vue';
   import { operatorLogModuleKey, operatorLogTypeKey, operatorRiskLevelKey, operatorLogResultKey, dictKeys } from '../types/const';
   import columns from '../types/table.columns';
   import { getLogDetail } from '../types/const';
@@ -146,14 +146,12 @@
     fetchTableData
   });
 
-  // 加载字典值
-  onBeforeMount(async () => {
+  // 初始化
+  onMounted(async () => {
+    // 加载字典值
     const dictStore = useDictStore();
     await dictStore.loadKeys(dictKeys);
-  });
-
-  // 初始化
-  onMounted(() => {
+    // 设置表格列
     let cols = columns.map(s => {
       return { ...s };
     }).filter(s => s.dataIndex !== 'username');
@@ -168,6 +166,7 @@
       cols = cols.filter(s => s.dataIndex !== 'handle');
     }
     tableColumns.value = cols;
+    // 加载数据
     fetchTableData();
   });