From 908c4a33457a114a243d9f3ddf7865fa73c9cbf5 Mon Sep 17 00:00:00 2001
From: lijiahang <ljh1553488six@139.com>
Date: Tue, 7 May 2024 11:27:42 +0800
Subject: [PATCH] =?UTF-8?q?:sparkles:=20=E5=9C=A8=E7=BA=BF=E4=BC=9A?=
 =?UTF-8?q?=E8=AF=9D.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../controller/HostConnectLogController.java  |   4 +-
 .../src/api/asset/host-connect-log.ts         |   7 +
 .../src/router/routes/modules/asset-audit.ts  |   5 +
 .../components/connect-log-table.vue          |   2 +-
 .../components/connect-session-table.vue      | 180 ++++++++++++++++++
 .../asset-audit/connect-session/index.vue     |  39 ++++
 .../connect-session/types/const.ts            |   5 +
 .../connect-session/types/table.columns.ts    |  56 ++++++
 .../components/transfer/transfer-drawer.vue   |   4 +-
 9 files changed, 297 insertions(+), 5 deletions(-)
 create mode 100644 orion-ops-ui/src/views/asset-audit/connect-session/components/connect-session-table.vue
 create mode 100644 orion-ops-ui/src/views/asset-audit/connect-session/index.vue
 create mode 100644 orion-ops-ui/src/views/asset-audit/connect-session/types/const.ts
 create mode 100644 orion-ops-ui/src/views/asset-audit/connect-session/types/table.columns.ts

diff --git a/orion-ops-module-asset/orion-ops-module-asset-service/src/main/java/com/orion/ops/module/asset/controller/HostConnectLogController.java b/orion-ops-module-asset/orion-ops-module-asset-service/src/main/java/com/orion/ops/module/asset/controller/HostConnectLogController.java
index 1b42485b..c852a936 100644
--- a/orion-ops-module-asset/orion-ops-module-asset-service/src/main/java/com/orion/ops/module/asset/controller/HostConnectLogController.java
+++ b/orion-ops-module-asset/orion-ops-module-asset-service/src/main/java/com/orion/ops/module/asset/controller/HostConnectLogController.java
@@ -51,7 +51,7 @@ public class HostConnectLogController {
 
     @IgnoreLog(IgnoreLogMode.RET)
     @PostMapping("/session")
-    @Operation(summary = "分页查询主机连接会话")
+    @Operation(summary = "查询全部主机连接会话")
     @PreAuthorize("@ss.hasPermission('asset:host-connect-session:management:query')")
     public List<HostConnectLogVO> getHostConnectSessions(@Validated @RequestBody HostConnectLogQueryRequest request) {
         return hostConnectLogService.getHostConnectSessions(request);
@@ -91,7 +91,7 @@ public class HostConnectLogController {
     @OperatorLog(HostConnectLogOperatorType.FORCE_OFFLINE)
     @PutMapping("/force-offline")
     @Operation(summary = "强制断开主机连接")
-    @PreAuthorize("@ss.hasPermission('asset:host-connect-log:management:force-offline', 'asset:host-connect-session:management:force-offline')")
+    @PreAuthorize("@ss.hasAnyPermission('asset:host-connect-log:management:force-offline', 'asset:host-connect-session:management:force-offline')")
     public Integer forceOffline(@Validated(Id.class) @RequestBody HostConnectLogQueryRequest request) {
         return hostConnectLogService.forceOffline(request);
     }
diff --git a/orion-ops-ui/src/api/asset/host-connect-log.ts b/orion-ops-ui/src/api/asset/host-connect-log.ts
index c539b4b6..38f2d4d9 100644
--- a/orion-ops-ui/src/api/asset/host-connect-log.ts
+++ b/orion-ops-ui/src/api/asset/host-connect-log.ts
@@ -55,6 +55,13 @@ export function getHostConnectLogPage(request: HostConnectLogQueryRequest) {
   return axios.post<DataGrid<HostConnectLogQueryResponse>>('/asset/host-connect-log/query', request);
 }
 
+/**
+ * 查询全部主机连接会话
+ */
+export function getHostConnectSessions(request: HostConnectLogQueryRequest) {
+  return axios.post<Array<HostConnectLogQueryResponse>>('/asset/host-connect-log/session', request);
+}
+
 /**
  * 查询用户最近连接的主机
  */
diff --git a/orion-ops-ui/src/router/routes/modules/asset-audit.ts b/orion-ops-ui/src/router/routes/modules/asset-audit.ts
index f0445aea..28851a10 100644
--- a/orion-ops-ui/src/router/routes/modules/asset-audit.ts
+++ b/orion-ops-ui/src/router/routes/modules/asset-audit.ts
@@ -11,6 +11,11 @@ const ASSET_AUDIT: AppRouteRecordRaw = {
       path: '/connect-log',
       component: () => import('@/views/asset-audit/connect-log/index.vue'),
     },
+    {
+      name: 'connectSession',
+      path: '/connect-session',
+      component: () => import('@/views/asset-audit/connect-session/index.vue'),
+    },
     {
       name: 'sftpLog',
       path: '/sftp-log',
diff --git a/orion-ops-ui/src/views/asset-audit/connect-log/components/connect-log-table.vue b/orion-ops-ui/src/views/asset-audit/connect-log/components/connect-log-table.vue
index 651aa121..030c4665 100644
--- a/orion-ops-ui/src/views/asset-audit/connect-log/components/connect-log-table.vue
+++ b/orion-ops-ui/src/views/asset-audit/connect-log/components/connect-log-table.vue
@@ -154,7 +154,7 @@
                         position="left"
                         type="warning"
                         @ok="forceOffline(record)">
-            <a-button v-permission="['asset:host-connect-log:management:force-offline']"
+            <a-button v-permission="['asset:host-connect-log:management:force-offline', 'asset:host-connect-session:management:force-offline']"
                       type="text"
                       size="mini"
                       status="danger">
diff --git a/orion-ops-ui/src/views/asset-audit/connect-session/components/connect-session-table.vue b/orion-ops-ui/src/views/asset-audit/connect-session/components/connect-session-table.vue
new file mode 100644
index 00000000..d4f78d94
--- /dev/null
+++ b/orion-ops-ui/src/views/asset-audit/connect-session/components/connect-session-table.vue
@@ -0,0 +1,180 @@
+<template>
+  <!-- 搜索 -->
+  <a-card class="general-card table-search-card">
+    <query-header :model="formModel"
+                  label-align="left"
+                  :itemOptions="{ 4: { span: 2 } }"
+                  @submit="fetchTableData"
+                  @reset="fetchTableData"
+                  @keyup.enter="() => fetchTableData()">
+      <!-- 连接用户 -->
+      <a-form-item field="userId" label="连接用户">
+        <user-selector v-model="formModel.userId"
+                       placeholder="请选择用户"
+                       allow-clear />
+      </a-form-item>
+      <!-- 连接主机 -->
+      <a-form-item field="hostId" label="连接主机">
+        <host-selector v-model="formModel.hostId"
+                       placeholder="请选择主机"
+                       allow-clear />
+      </a-form-item>
+      <!-- 主机地址 -->
+      <a-form-item field="hostAddress" label="主机地址">
+        <a-input v-model="formModel.hostAddress" placeholder="请输入主机地址" allow-clear />
+      </a-form-item>
+      <!-- 类型 -->
+      <a-form-item field="type" label="类型">
+        <a-select v-model="formModel.type"
+                  placeholder="请选择类型"
+                  :options="toOptions(connectTypeKey)"
+                  allow-clear />
+      </a-form-item>
+      <!-- 开始时间 -->
+      <a-form-item field="startTimeRange" label="开始时间">
+        <a-range-picker v-model="formModel.startTimeRange"
+                        :time-picker-props="{ defaultValue: ['00:00:00', '23:59:59'] }"
+                        show-time
+                        format="YYYY-MM-DD HH:mm:ss" />
+      </a-form-item>
+    </query-header>
+  </a-card>
+  <!-- 表格 -->
+  <a-card class="general-card table-card">
+    <template #title>
+      <!-- 左侧操作 -->
+      <div class="table-left-bar-handle">
+        <!-- 标题 -->
+        <div class="table-title">
+          主机在线会话
+        </div>
+      </div>
+    </template>
+    <!-- table -->
+    <a-table row-key="id"
+             ref="tableRef"
+             :loading="loading"
+             :columns="columns"
+             :data="tableRenderData"
+             :pagination="false"
+             :bordered="false">
+      <!-- 连接用户 -->
+      <template #username="{ record }">
+        {{ record.username }}
+      </template>
+      <!-- 连接主机 -->
+      <template #hostName="{ record }">
+        <span class="table-cell-value" :title="record.hostName">
+          {{ record.hostName }}
+        </span>
+        <br>
+        <span class="table-cell-sub-value text-copy"
+              :title="record.hostAddress"
+              @click="copy(record.hostAddress)">
+          {{ record.hostAddress }}
+        </span>
+      </template>
+      <!-- 类型 -->
+      <template #type="{ record }">
+        <a-tag :color="getDictValue(connectTypeKey, record.type, 'color')">
+          {{ getDictValue(connectTypeKey, record.type) }}
+        </a-tag>
+      </template>
+      <!-- 留痕地址 -->
+      <template #address="{ record }">
+        <span class="table-cell-value" :title="record.extra?.location">
+          {{ record.extra?.location }}
+        </span>
+        <br>
+        <span class="table-cell-sub-value text-copy"
+              :title="record.extra?.address"
+              @click="copy(record.extra?.address)">
+          {{ record.extra?.address }}
+        </span>
+      </template>
+      <!-- 操作 -->
+      <template #handle="{ record }">
+        <div class="table-handle-wrapper">
+          <!-- 下线 -->
+          <a-popconfirm content="确认要强制下线吗?"
+                        position="left"
+                        type="warning"
+                        @ok="forceOffline(record)">
+            <a-button v-permission="['asset:host-connect-log:management:force-offline', 'asset:host-connect-session:management:force-offline']"
+                      type="text"
+                      size="mini"
+                      status="danger">
+              下线
+            </a-button>
+          </a-popconfirm>
+        </div>
+      </template>
+    </a-table>
+  </a-card>
+</template>
+
+<script lang="ts">
+  export default {
+    name: 'connectSessionTable'
+  };
+</script>
+
+<script lang="ts" setup>
+  import type { HostConnectLogQueryRequest, HostConnectLogQueryResponse } from '@/api/asset/host-connect-log';
+  import { reactive, ref, onMounted } from 'vue';
+  import { getHostConnectSessions, hostForceOffline } from '@/api/asset/host-connect-log';
+  import { connectTypeKey } from '../types/const';
+  import { useDictStore } from '@/store';
+  import { Message } from '@arco-design/web-vue';
+  import columns from '../types/table.columns';
+  import useLoading from '@/hooks/loading';
+  import { copy } from '@/hooks/copy';
+  import UserSelector from '@/components/user/user/selector/index.vue';
+  import HostSelector from '@/components/asset/host/selector/index.vue';
+
+  const tableRenderData = ref<HostConnectLogQueryResponse[]>([]);
+
+  const { loading, setLoading } = useLoading();
+  const { toOptions, getDictValue } = useDictStore();
+
+  const formModel = reactive<HostConnectLogQueryRequest>({
+    userId: undefined,
+    hostId: undefined,
+    hostAddress: undefined,
+    type: undefined,
+    startTimeRange: undefined,
+  });
+
+  // 加载数据
+  const fetchTableData = async () => {
+    try {
+      setLoading(true);
+      const { data } = await getHostConnectSessions(formModel);
+      tableRenderData.value = data;
+    } catch (e) {
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  // 强制下线
+  const forceOffline = async (record: HostConnectLogQueryResponse) => {
+    try {
+      setLoading(true);
+      await hostForceOffline({ id: record.id });
+      record.endTime = Date.now();
+      Message.success('已下线');
+    } catch (e) {
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  onMounted(() => {
+    fetchTableData();
+  });
+
+</script>
+
+<style lang="less" scoped>
+</style>
diff --git a/orion-ops-ui/src/views/asset-audit/connect-session/index.vue b/orion-ops-ui/src/views/asset-audit/connect-session/index.vue
new file mode 100644
index 00000000..7014e8ed
--- /dev/null
+++ b/orion-ops-ui/src/views/asset-audit/connect-session/index.vue
@@ -0,0 +1,39 @@
+<template>
+  <div class="layout-container" v-if="render">
+    <!-- 列表-表格 -->
+    <connect-session-table />
+  </div>
+</template>
+
+<script lang="ts">
+  export default {
+    name: 'connectSession'
+  };
+</script>
+
+<script lang="ts" setup>
+  import { ref, onBeforeMount, onUnmounted } from 'vue';
+  import { useCacheStore, useDictStore } from '@/store';
+  import { dictKeys } from './types/const';
+  import ConnectSessionTable from './components/connect-session-table.vue';
+
+  const render = ref(false);
+
+  // 加载字典配置
+  onBeforeMount(async () => {
+    const dictStore = useDictStore();
+    await dictStore.loadKeys(dictKeys);
+    render.value = true;
+  });
+
+  // 重置缓存
+  onUnmounted(() => {
+    const cacheStore = useCacheStore();
+    cacheStore.reset('users', 'hosts');
+  });
+
+</script>
+
+<style lang="less" scoped>
+
+</style>
diff --git a/orion-ops-ui/src/views/asset-audit/connect-session/types/const.ts b/orion-ops-ui/src/views/asset-audit/connect-session/types/const.ts
new file mode 100644
index 00000000..1df80c17
--- /dev/null
+++ b/orion-ops-ui/src/views/asset-audit/connect-session/types/const.ts
@@ -0,0 +1,5 @@
+// 主机连接类型 字典项
+export const connectTypeKey = 'hostConnectType';
+
+// 加载的字典值
+export const dictKeys = [connectTypeKey];
diff --git a/orion-ops-ui/src/views/asset-audit/connect-session/types/table.columns.ts b/orion-ops-ui/src/views/asset-audit/connect-session/types/table.columns.ts
new file mode 100644
index 00000000..ff4d09d8
--- /dev/null
+++ b/orion-ops-ui/src/views/asset-audit/connect-session/types/table.columns.ts
@@ -0,0 +1,56 @@
+import type { TableColumnData } from '@arco-design/web-vue/es/table/interface';
+import { dateFormat } from '@/utils';
+
+const columns = [
+  {
+    title: 'id',
+    dataIndex: 'id',
+    slotName: 'id',
+    width: 70,
+    align: 'left',
+    fixed: 'left',
+  }, {
+    title: '连接用户',
+    dataIndex: 'username',
+    slotName: 'username',
+    width: 140,
+    align: 'left',
+    ellipsis: true,
+  }, {
+    title: '连接主机',
+    dataIndex: 'hostName',
+    slotName: 'hostName',
+    align: 'left',
+    ellipsis: true,
+  }, {
+    title: '类型',
+    dataIndex: 'type',
+    slotName: 'type',
+    width: 98,
+    align: 'left',
+  }, {
+    title: '留痕地址',
+    dataIndex: 'address',
+    slotName: 'address',
+    width: 156,
+    align: 'left',
+    ellipsis: true,
+  }, {
+    title: '开始时间',
+    dataIndex: 'startTime',
+    slotName: 'startTime',
+    align: 'center',
+    width: 188,
+    render: ({ record }) => {
+      return (record.startTime && dateFormat(new Date(record.startTime)));
+    },
+  }, {
+    title: '操作',
+    slotName: 'handle',
+    width: 130,
+    align: 'left',
+    fixed: 'right',
+  },
+] as TableColumnData[];
+
+export default columns;
diff --git a/orion-ops-ui/src/views/host/terminal/components/transfer/transfer-drawer.vue b/orion-ops-ui/src/views/host/terminal/components/transfer/transfer-drawer.vue
index 920712d8..0b8315a1 100644
--- a/orion-ops-ui/src/views/host/terminal/components/transfer/transfer-drawer.vue
+++ b/orion-ops-ui/src/views/host/terminal/components/transfer/transfer-drawer.vue
@@ -26,11 +26,11 @@
         <a-space size="small">
           <a-tag v-for="option in toOptions(transferStatusKey)"
                  class="pointer"
-                 :color="option.color"
+                 :color="option.color as string"
                  :title="option.label"
                  :bordered="option.value === filterStatus"
                  :checked="option.value === filterStatus"
-                 @click="checkFilterStatus(option.value)">
+                 @click="checkFilterStatus(option.value as string)">
             <!-- 图标 -->
             <component :is="option.icon" />
             <!-- 数量 -->