bug fix

src/api/monitor/online.js

@@ -1,18 +1,18 @@
-import request from '@/utils/request'
+import request from "@/utils/request";
 
 // 查询在线用户列表
 export function list(query) {
   return request({
-    url: '/monitor/online/list',
+    url: "/monitor/online/list",
-    method: 'get',
+    method: "get",
-    params: query
+    params: query,
-  })
+  });
 }
 
 // 强退用户
 export function forceLogout(username, deviceSn) {
   return request({
-    url: '/monitor/online/' + username + '/' + deviceSn,
+    url: "/monitor/online/" + username + "/" + deviceSn,
-    method: 'delete'
+    method: "delete",
-  })
+  });
 }

src/permission.js

@@ -42,12 +42,21 @@ router.beforeEach((to, from, next) => {
               });
           })
           .catch((err) => {
+            if (err === "您已被挤下线") {
+              useUserStore()
+                .abnormalLogOut()
+                .then(() => {
+                  ElMessage.error(err);
+                  next({ path: "/" });
+                });
+            } else {
               useUserStore()
                 .logOut()
                 .then(() => {
                   ElMessage.error(err);
                   next({ path: "/" });
                 });
+            }
           });
       } else {
         next();

src/utils/request.js

@@ -132,15 +132,11 @@ service.interceptors.response.use(
     } else if (code === 4012) {
       if (!isRelogin.show) {
         isRelogin.show = true;
-        ElMessageBox.confirm(
+        ElMessageBox.confirm("您已被挤下线", "系统提示", {
-          "您以被挤下线",
-          "系统提示",
-          {
           confirmButtonText: "重新登录",
           cancelButtonText: "取消",
           type: "warning",
-          }
+        })
-        )
           .then(() => {
             isRelogin.show = false;
             useUserStore()
@@ -153,7 +149,7 @@ service.interceptors.response.use(
             isRelogin.show = false;
           });
       }
-      return Promise.reject("无效的会话，或者会话已过期，请重新登录。");
+      return Promise.reject("您已被挤下线");
     } else if (code === 500) {
       ElMessage({ message: msg, type: "error" });
       return Promise.reject(new Error(msg));

src/views/login.vue

@@ -169,7 +169,8 @@ function handleLogin() {
 
 function getCode() {
   getCodeImg().then((res) => {
-    captchaEnabled.value = res.captchaEnabled === undefined ? true : res.captchaEnabled;
+    captchaEnabled.value =
+      res.captchaEnabled === undefined ? true : res.captchaEnabled;
     register.value = res.register === undefined ? true : res.register;
     if (captchaEnabled.value) {
       codeUrl.value = "data:image/gif;base64," + res.img;

src/views/monitor/online/index.vue

@@ -2,41 +2,101 @@
   <div class="app-container">
     <el-form :model="queryParams" ref="queryRef" :inline="true">
       <el-form-item label="用户名称" prop="username">
-            <el-input v-model="queryParams.username" placeholder="请输入用户名称" clearable style="width: 200px"
+        <el-input
-               @keyup.enter="handleQuery" />
+          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 type="primary" icon="Search" @click="handleQuery"
+          >搜索</el-button
+        >
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
-      <el-table v-loading="loading" :data="onlineList.slice((pageNum - 1) * pageSize, pageNum * pageSize)"
+    <el-table
-         style="width: 100%;">
+      v-loading="loading"
+      :data="onlineList.slice((pageNum - 1) * pageSize, pageNum * pageSize)"
+      style="width: 100%"
+    >
       <el-table-column label="序号" width="50" type="index" align="center">
         <template #default="scope">
           <span>{{ (pageNum - 1) * pageSize + scope.$index + 1 }}</span>
         </template>
       </el-table-column>
-         <el-table-column label="会话编号" align="center" prop="deviceSn" :show-overflow-tooltip="true" />
+      <el-table-column
-         <el-table-column label="登录名称" align="center" prop="username" :show-overflow-tooltip="true" />
+        label="会话编号"
-         <el-table-column label="主机" align="center" prop="ip" :show-overflow-tooltip="true" />
+        align="center"
-         <el-table-column label="登录地点" align="center" prop="address" :show-overflow-tooltip="true" />
+        prop="deviceSn"
-         <el-table-column label="操作系统" align="center" prop="os" :show-overflow-tooltip="true" />
+        :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">
+      <el-table-column
+        label="登录名称"
+        align="center"
+        prop="username"
+        :show-overflow-tooltip="true"
+      />
+      <el-table-column
+        label="主机"
+        align="center"
+        prop="ip"
+        :show-overflow-tooltip="true"
+      />
+      <el-table-column
+        label="登录地点"
+        align="center"
+        prop="address"
+        :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">
+      <el-table-column
+        label="操作"
+        align="center"
+        class-name="small-padding fixed-width"
+      >
         <template #default="scope">
-               <el-button link type="primary" icon="Delete" @click="handleForceLogout(scope.row)"
+          <el-button
-                  v-hasPermi="['monitor:online:forceLogout']">强退</el-button>
+            link
+            type="primary"
+            icon="Delete"
+            @click="handleForceLogout(scope.row)"
+            v-hasPermi="['monitor:online:forceLogout']"
+            >强退</el-button
+          >
         </template>
       </el-table-column>
     </el-table>
 
-      <pagination v-show="total > 0" :total="total" v-model:page="pageNum" v-model:limit="pageSize" />
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      v-model:page="pageNum"
+      v-model:limit="pageSize"
+    />
   </div>
 </template>
 
@@ -53,13 +113,13 @@ const pageSize = ref(10);
 
 const queryParams = ref({
   ip: undefined,
-   username: undefined
+  username: undefined,
 });
 
 /** 查询登录日志列表 */
 function getList() {
   loading.value = true;
-   initData(queryParams.value).then(response => {
+  initData(queryParams.value).then((response) => {
     onlineList.value = response.rows;
     total.value = response.total;
     loading.value = false;
@@ -77,12 +137,16 @@ function resetQuery() {
 }
 /** 强退按钮操作 */
 function handleForceLogout(row) {
-   proxy.$modal.confirm('是否确认强退名称为"' + row.username + '"的用户?').then(function () {
+  proxy.$modal
+    .confirm('是否确认强退名称为"' + row.username + '"的用户?')
+    .then(function () {
       return forceLogout(row.username, row.deviceSn);
-   }).then(() => {
+    })
+    .then(() => {
       getList();
       proxy.$modal.msgSuccess("删除成功");
-   }).catch(() => { });
+    })
+    .catch(() => {});
 }
 
 getList();