From e90c25523e1c96a4423bd8ecc78d0a90789dd6a3 Mon Sep 17 00:00:00 2001
From: joylink_fanyuhong <18706759286@163.com>
Date: Fri, 18 Oct 2024 17:19:40 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E8=B0=83=E6=95=B4=E6=9A=82?=
 =?UTF-8?q?=E6=97=B6=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/LogApi.ts           |  8 +++++-
 src/api/UserApi.ts          | 43 ++++++++++++++++++++++++++++++
 src/layouts/MainLayout.vue  | 17 +++++++++---
 src/pages/LoginRecord.vue   | 52 ++++++++++++++++++++++++++++++++-----
 src/pages/OperateRecord.vue | 52 ++++++++++++++++++++++++++++++++-----
 src/router/index.ts         | 33 +++++++++++++++++++++--
 src/stores/user-store.ts    | 19 ++++++++++++++
 7 files changed, 204 insertions(+), 20 deletions(-)
 create mode 100644 src/stores/user-store.ts

diff --git a/src/api/LogApi.ts b/src/api/LogApi.ts
index 59c7381..c8e0ae7 100644
--- a/src/api/LogApi.ts
+++ b/src/api/LogApi.ts
@@ -5,10 +5,16 @@ const LogUriBase = '/api/log';
 
 export interface Record {
   id: number;
+  faceName: string;
   eventType: string;
+  subEventType: string;
+  uri: string;
+  method: string;
+  parameters: string;
+  requestSuccess: boolean;
+  userName: string;
   fromUserId: number;
   mobile: string;
-  userName: string;
   createDateTime: string;
 }
 
diff --git a/src/api/UserApi.ts b/src/api/UserApi.ts
index b3f09c4..5d1ce10 100644
--- a/src/api/UserApi.ts
+++ b/src/api/UserApi.ts
@@ -72,3 +72,46 @@ export async function pageQuery(
   });
   return response.data;
 }
+
+/**
+ * 用户登出
+ */
+export async function logout(): Promise<string> {
+  const response = await api.post(`${UserUriBase}/logout`);
+  return response.data;
+}
+
+interface tokenInfo {
+  token: string;
+  remainingSecond: number;
+}
+
+/**
+ * 刷新token
+ */
+export async function refreshToken(): Promise<tokenInfo> {
+  const response = await api.post(`${UserUriBase}/refresh/token`);
+  return response.data;
+}
+
+export interface role {
+  id: number;
+  name: string;
+  roleConfig: {
+    lineId: number;
+    lineType: string;
+  };
+}
+interface userInfo {
+  remainingSecond: number;
+  roles: role[];
+  defaultRole: string;
+}
+
+/**
+ * 获取用户信息
+ */
+export async function getUserInfo(): Promise<userInfo> {
+  const response = await api.post(`${UserUriBase}/info`);
+  return response.data;
+}
diff --git a/src/layouts/MainLayout.vue b/src/layouts/MainLayout.vue
index f35de31..f676b83 100644
--- a/src/layouts/MainLayout.vue
+++ b/src/layouts/MainLayout.vue
@@ -124,6 +124,8 @@ import {
   webSocketConnect,
   closeWebSocketConnect,
 } from 'src/components/webSocketConnect';
+import { logout } from 'src/api/UserApi';
+import { ApiError } from 'src/boot/axios';
 
 const leftDrawerOpen = ref(false);
 const router = useRouter();
@@ -210,9 +212,18 @@ function logOut() {
     message: '确认是否登出？',
     cancel: true,
     persistent: true,
-  }).onOk(() => {
-    clearJwtToken();
-    router.push({ name: 'login' });
+  }).onOk(async () => {
+    try {
+      await logout();
+      clearJwtToken();
+      router.push({ name: 'login' });
+    } catch (err) {
+      const apiErr = err as ApiError;
+      $q.notify({
+        type: 'negative',
+        message: apiErr.title,
+      });
+    }
   });
 }
 
diff --git a/src/pages/LoginRecord.vue b/src/pages/LoginRecord.vue
index e7a312b..c3a6d48 100644
--- a/src/pages/LoginRecord.vue
+++ b/src/pages/LoginRecord.vue
@@ -2,7 +2,7 @@
   <div class="q-pa-md">
     <q-table
       ref="tableRef"
-      title="报警记录"
+      title="登录记录"
       :style="{ height: tableHeight + 'px' }"
       class="my-sticky-virtscroll-table"
       :rows="rows"
@@ -15,6 +15,15 @@
       binary-state-sort
       @request="onRequest"
     >
+      <template v-slot:body-cell-subEventType="props">
+        <q-td :props="props">
+          <div class="q-gutter-sm row justify-center">
+            <q-chip outline size="sm" color="primary">
+              {{ getSubEventType(props.row.subEventType) }}
+            </q-chip>
+          </div>
+        </q-td>
+      </template>
       <!-- <template v-slot:top-right>
         <q-input
           dense
@@ -78,24 +87,36 @@ onMounted(() => {
 
 const columnDefs: QTableColumn[] = [
   { name: 'id', label: 'ID', field: 'id', align: 'center' },
+  {
+    name: 'subEventType',
+    label: '操作',
+    field: 'subEventType',
+    align: 'center',
+  },
+  {
+    name: 'faceName',
+    label: '接口名称',
+    field: 'faceName',
+    align: 'center',
+  },
   {
     name: 'userName',
     label: '操作人员',
     field: 'userName',
     align: 'center',
   },
-  {
-    name: 'mobile',
-    label: '手机号',
-    field: 'mobile',
-    align: 'center',
-  },
   {
     name: 'createDateTime',
     label: '记录时间',
     field: 'createDateTime',
     align: 'center',
   },
+  {
+    name: 'requestSuccess',
+    label: '请求成功',
+    field: 'requestSuccess',
+    align: 'center',
+  },
 ];
 
 const tableRef = ref();
@@ -135,4 +156,21 @@ async function onRequest(props: any) {
     loading.value = false;
   }
 }
+
+function getSubEventType(type: string) {
+  switch (type) {
+    case 'LOGIN':
+      return '登录';
+    case 'LOGOUT':
+      return '登出';
+    case 'QUERY':
+      return '查询';
+    case 'SAVE_OR_UPDATE':
+      return '保存';
+    case 'DELETE':
+      return '删除';
+    default:
+      return '';
+  }
+}
 </script>
diff --git a/src/pages/OperateRecord.vue b/src/pages/OperateRecord.vue
index e7a312b..1361ce8 100644
--- a/src/pages/OperateRecord.vue
+++ b/src/pages/OperateRecord.vue
@@ -2,7 +2,7 @@
   <div class="q-pa-md">
     <q-table
       ref="tableRef"
-      title="报警记录"
+      title="操作记录"
       :style="{ height: tableHeight + 'px' }"
       class="my-sticky-virtscroll-table"
       :rows="rows"
@@ -15,6 +15,15 @@
       binary-state-sort
       @request="onRequest"
     >
+      <template v-slot:body-cell-subEventType="props">
+        <q-td :props="props">
+          <div class="q-gutter-sm row justify-center">
+            <q-chip outline size="sm" color="primary">
+              {{ getSubEventType(props.row.subEventType) }}
+            </q-chip>
+          </div>
+        </q-td>
+      </template>
       <!-- <template v-slot:top-right>
         <q-input
           dense
@@ -78,24 +87,36 @@ onMounted(() => {
 
 const columnDefs: QTableColumn[] = [
   { name: 'id', label: 'ID', field: 'id', align: 'center' },
+  {
+    name: 'subEventType',
+    label: '操作',
+    field: 'subEventType',
+    align: 'center',
+  },
+  {
+    name: 'faceName',
+    label: '接口名称',
+    field: 'faceName',
+    align: 'center',
+  },
   {
     name: 'userName',
     label: '操作人员',
     field: 'userName',
     align: 'center',
   },
-  {
-    name: 'mobile',
-    label: '手机号',
-    field: 'mobile',
-    align: 'center',
-  },
   {
     name: 'createDateTime',
     label: '记录时间',
     field: 'createDateTime',
     align: 'center',
   },
+  {
+    name: 'requestSuccess',
+    label: '请求成功',
+    field: 'requestSuccess',
+    align: 'center',
+  },
 ];
 
 const tableRef = ref();
@@ -135,4 +156,21 @@ async function onRequest(props: any) {
     loading.value = false;
   }
 }
+
+function getSubEventType(type: string) {
+  switch (type) {
+    case 'LOGIN':
+      return '登录';
+    case 'LOGOUT':
+      return '登出';
+    case 'QUERY':
+      return '查询';
+    case 'SAVE_OR_UPDATE':
+      return '保存';
+    case 'DELETE':
+      return '删除';
+    default:
+      return '';
+  }
+}
 </script>
diff --git a/src/router/index.ts b/src/router/index.ts
index 70554d9..6e3504c 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -7,7 +7,9 @@ import {
 } from 'vue-router';
 
 import routes from './routes';
-import { getJwtToken } from 'src/configs/TokenManage';
+import { getJwtToken, saveJwtToken } from 'src/configs/TokenManage';
+import { getUserInfo, refreshToken } from 'src/api/UserApi';
+import { useUserStore } from 'src/stores/user-store';
 
 /*
  * If not building with SSR mode, you can
@@ -42,10 +44,37 @@ export default route(function (/* { store, ssrContext } */) {
       if (!getJwtToken()) {
         next({ path: '/login' });
       } else {
-        next();
+        try {
+          const userInfo = await getUserInfo();
+          const userStore = useUserStore();
+          userStore.defaultRole = userInfo.defaultRole;
+          userStore.roles = userInfo.roles;
+          userStore.remainingSecond = userInfo.remainingSecond;
+          setTimeout(
+            () => handleRefreshToken(),
+            userInfo.remainingSecond * 1000 - 10000
+          );
+          next();
+        } catch (e) {
+          console.error('获取用户信息出错:', e);
+          next({ path: '/login' });
+        }
       }
     }
   });
 
   return Router;
 });
+
+async function handleRefreshToken() {
+  try {
+    const tokenInfo = await refreshToken();
+    saveJwtToken(tokenInfo.token);
+    setTimeout(
+      () => handleRefreshToken(),
+      tokenInfo.remainingSecond * 1000 - 10000
+    );
+  } catch (e) {
+    console.error('刷新 token 出错:', e);
+  }
+}
diff --git a/src/stores/user-store.ts b/src/stores/user-store.ts
new file mode 100644
index 0000000..039569f
--- /dev/null
+++ b/src/stores/user-store.ts
@@ -0,0 +1,19 @@
+import { defineStore } from 'pinia';
+import { role } from 'src/api/UserApi';
+
+export const useUserStore = defineStore('user', {
+  state: () => ({
+    remainingSecond: 0,
+    roles: [] as role[],
+    defaultRole: '',
+  }),
+  getters: {},
+  actions: {
+    // setRemainingSecond(remainingSecond: number) {
+    //   this.remainingSecond = remainingSecond;
+    // },
+    // setDefaultRole(defaultRole: string) {
+    //   this.defaultRole = defaultRole;
+    // },
+  },
+});