From 5e440a7dc434c43eb828fa62cf9c12b0078b8565 Mon Sep 17 00:00:00 2001
From: 疯狂的狮子Li <15040126243@163.com>
Date: 星期一, 20 一月 2025 11:36:18 +0800
Subject: [PATCH] !173 发布 5.3.0-BETA 公测版本 Merge pull request !173 from 疯狂的狮子Li/dev

---
 src/views/monitor/online/index.vue |  174 +++++++++++++++++++++++++++++++---------------------------
 1 files changed, 93 insertions(+), 81 deletions(-)

diff --git a/src/views/monitor/online/index.vue b/src/views/monitor/online/index.vue
index 1084d47..7a58bb7 100644
--- a/src/views/monitor/online/index.vue
+++ b/src/views/monitor/online/index.vue
@@ -1,104 +1,116 @@
+<template>
+  <div class="p-2">
+    <div class="mb-[10px]">
+      <el-card shadow="hover">
+        <el-form ref="queryFormRef" :model="queryParams" :inline="true">
+          <el-form-item label="鐧诲綍鍦板潃" prop="ipaddr">
+            <el-input v-model="queryParams.ipaddr" placeholder="璇疯緭鍏ョ櫥褰曞湴鍧�" clearable @keyup.enter="handleQuery" />
+          </el-form-item>
+          <el-form-item label="鐢ㄦ埛鍚嶇О" prop="userName">
+            <el-input v-model="queryParams.userName" placeholder="璇疯緭鍏ョ敤鎴峰悕绉�" clearable @keyup.enter="handleQuery" />
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+            <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+          </el-form-item>
+        </el-form>
+      </el-card>
+    </div>
+    <el-card shadow="hover">
+      <el-table
+        v-loading="loading"
+        :data="onlineList.slice((queryParams.pageNum - 1) * queryParams.pageSize, queryParams.pageNum * queryParams.pageSize)"
+        style="width: 100%"
+      >
+        <el-table-column label="搴忓彿" width="50" type="index" align="center">
+          <template #default="scope">
+            <span>{{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="浼氳瘽缂栧彿" align="center" prop="tokenId" :show-overflow-tooltip="true" />
+        <el-table-column label="鐧诲綍鍚嶇О" align="center" prop="userName" :show-overflow-tooltip="true" />
+        <el-table-column label="瀹㈡埛绔�" align="center" prop="clientKey" :show-overflow-tooltip="true" />
+        <el-table-column label="璁惧绫诲瀷" align="center">
+          <template #default="scope">
+            <dict-tag :options="sys_device_type" :value="scope.row.deviceType" />
+          </template>
+        </el-table-column>
+        <el-table-column label="鎵�灞為儴闂�" align="center" prop="deptName" :show-overflow-tooltip="true" />
+        <el-table-column label="涓绘満" align="center" prop="ipaddr" :show-overflow-tooltip="true" />
+        <el-table-column label="鐧诲綍鍦扮偣" align="center" prop="loginLocation" :show-overflow-tooltip="true" />
+        <el-table-column label="鎿嶄綔绯荤粺" align="center" prop="os" :show-overflow-tooltip="true" />
+        <el-table-column label="娴忚鍣�" align="center" prop="browser" :show-overflow-tooltip="true" />
+        <el-table-column label="鐧诲綍鏃堕棿" align="center" prop="loginTime" width="180">
+          <template #default="scope">
+            <span>{{ proxy.parseTime(scope.row.loginTime) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width">
+          <template #default="scope">
+            <el-tooltip content="寮洪��" placement="top">
+              <el-button v-hasPermi="['monitor:online:forceLogout']" link type="primary" icon="Delete" @click="handleForceLogout(scope.row)">
+              </el-button>
+            </el-tooltip>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <pagination v-show="total > 0" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" :total="total" />
+    </el-card>
+  </div>
+</template>
+
 <script setup name="Online" lang="ts">
-import { forceLogout, list as initData } from "@/api/monitor/online";
-import { ComponentInternalInstance } from "vue";
-import { OnlineQuery, OnlineVO } from "@/api/monitor/online/types";
+import { forceLogout, list as initData } from '@/api/monitor/online';
+import { OnlineQuery, OnlineVO } from '@/api/monitor/online/types';
+import api from '@/api/system/user';
+import { to } from 'await-to-js';
 
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
+const { sys_device_type } = toRefs<any>(proxy?.useDict('sys_device_type'));
 
 const onlineList = ref<OnlineVO[]>([]);
 const loading = ref(true);
 const total = ref(0);
 
-const queryFormRef = ref(ElForm);
+const queryFormRef = ref<ElFormInstance>();
 
 const queryParams = ref<OnlineQuery>({
-	pageNum: 1,
-	pageSize: 10,
-	ipaddr: '',
-	userName: ''
+  pageNum: 1,
+  pageSize: 10,
+  ipaddr: '',
+  userName: ''
 });
 
 /** 鏌ヨ鐧诲綍鏃ュ織鍒楄〃 */
 const getList = async () => {
-	loading.value = true;
-	const res = await initData(queryParams.value);
-	onlineList.value = res.rows;
-	total.value = res.total;
-	loading.value = false;
-}
+  loading.value = true;
+  const res = await initData(queryParams.value);
+  onlineList.value = res.rows;
+  total.value = res.total;
+  loading.value = false;
+};
 /** 鎼滅储鎸夐挳鎿嶄綔 */
 const handleQuery = () => {
-	queryParams.value.pageNum = 1;
-	getList();
-}
+  queryParams.value.pageNum = 1;
+  getList();
+};
 /** 閲嶇疆鎸夐挳鎿嶄綔 */
 const resetQuery = () => {
-	queryFormRef.value.resetFields();
-	handleQuery();
-}
+  queryFormRef.value?.resetFields();
+  handleQuery();
+};
 /** 寮洪��鎸夐挳鎿嶄綔 */
 const handleForceLogout = async (row: OnlineVO) => {
-	await proxy?.$modal.confirm('鏄惁纭寮洪��鍚嶇О涓�"' + row.userName + '"鐨勭敤鎴�?');
-	await forceLogout(row.tokenId);
-	getList();
-	proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
-}
+  const [err] = await to(proxy?.$modal.confirm('鏄惁纭寮洪��鍚嶇О涓�"' + row.userName + '"鐨勭敤鎴�?') as any);
+  if (!err) {
+    await forceLogout(row.tokenId);
+    await getList();
+    proxy?.$modal.msgSuccess('鍒犻櫎鎴愬姛');
+  }
+};
 
 onMounted(() => {
-	getList();
-})
+  getList();
+});
 </script>
-
-<template>
-	<div class="p-2">
-		<div class="search">
-			<el-form :model="queryParams" ref="queryFormRef" :inline="true">
-				<el-form-item label="鐧诲綍鍦板潃" prop="ipaddr">
-					<el-input v-model="queryParams.ipaddr" placeholder="璇疯緭鍏ョ櫥褰曞湴鍧�" clearable style="width: 200px" @keyup.enter="handleQuery" />
-				</el-form-item>
-				<el-form-item label="鐢ㄦ埛鍚嶇О" prop="userName">
-					<el-input v-model="queryParams.userName" placeholder="璇疯緭鍏ョ敤鎴峰悕绉�" clearable style="width: 200px" @keyup.enter="handleQuery" />
-				</el-form-item>
-				<el-form-item>
-					<el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
-					<el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
-				</el-form-item>
-			</el-form>
-		</div>
-		<div class="panel">
-			<el-table
-				v-loading="loading"
-				:data="onlineList.slice((queryParams.pageNum - 1) * queryParams.pageSize, queryParams.pageNum * queryParams.pageSize)"
-				style="width: 100%;"
-			>
-				<el-table-column label="搴忓彿" width="50" type="index" align="center">
-					<template #default="scope">
-						<span>{{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}</span>
-					</template>
-				</el-table-column>
-				<el-table-column label="浼氳瘽缂栧彿" align="center" prop="tokenId" :show-overflow-tooltip="true" />
-				<el-table-column label="鐧诲綍鍚嶇О" align="center" prop="userName" :show-overflow-tooltip="true" />
-				<el-table-column label="鎵�灞為儴闂�" align="center" prop="deptName" :show-overflow-tooltip="true" />
-				<el-table-column label="涓绘満" align="center" prop="ipaddr" :show-overflow-tooltip="true" />
-				<el-table-column label="鐧诲綍鍦扮偣" align="center" prop="loginLocation" :show-overflow-tooltip="true" />
-				<el-table-column label="鎿嶄綔绯荤粺" align="center" prop="os" :show-overflow-tooltip="true" />
-				<el-table-column label="娴忚鍣�" align="center" prop="browser" :show-overflow-tooltip="true" />
-				<el-table-column label="鐧诲綍鏃堕棿" align="center" prop="loginTime" width="180">
-					<template #default="scope">
-						<span>{{ parseTime(scope.row.loginTime) }}</span>
-					</template>
-				</el-table-column>
-				<el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width">
-					<template #default="scope">
-						<el-tooltip content="寮洪��" placement="top">
-							<el-button link type="primary" icon="Delete" @click="handleForceLogout(scope.row)" v-hasPermi="['monitor:online:forceLogout']">
-							</el-button>
-						</el-tooltip>
-					</template>
-				</el-table-column>
-			</el-table>
-
-			<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" />
-		</div>
-	</div>
-</template>

--
Gitblit v1.9.3