Hass/Message-Push-Nest
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add login log record

Browse Source
This commit is contained in:
engigu
2025-10-01 00:30:55 +08:00
parent 6dbc8352e9
commit cbda9baffe
1 changed files with 41 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/components/pages/settings/LoginLogs.vue
+41 -34
View File
@@ -1,5 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, ref } from 'vue' import { onMounted, ref } from 'vue'
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
// @ts-ignore // @ts-ignore
import { request } from '@/api/api' import { request } from '@/api/api'
@@ -32,42 +33,48 @@ onMounted(fetchLogs)
</script> </script>
<template> <template>
<div class="space-y-3"> <Card>
<div class="flex items-center justify-between"> <CardHeader class="flex items-start sm:items-center justify-between gap-2">
<h2 class="text-lg font-semibold">最近登录日志</h2> <div class="min-w-0">
<button class="text-sm text-muted-foreground hover:text-foreground" @click="fetchLogs" :disabled="loading"> <CardTitle>最近登录日志</CardTitle>
<CardDescription class="mt-1">展示最近 8 条登录记录</CardDescription>
</div>
<button class="text-sm text-muted-foreground hover:text-foreground flex-shrink-0" @click="fetchLogs" :disabled="loading">
{{ loading ? '刷新中...' : '刷新' }} {{ loading ? '刷新中...' : '刷新' }}
</button> </button>
</div> </CardHeader>
<CardContent>
<div class="overflow-hidden rounded-md border border-border"> <div class="overflow-x-auto">
<table class="w-full text-sm"> <div class="min-w-full rounded-md border border-border">
<thead> <table class="w-full text-sm">
<tr class="bg-muted"> <thead>
<th class="px-3 py-2 text-left">用户名</th> <tr class="bg-muted">
<th class="px-3 py-2 text-left">IP</th> <th class="px-3 py-2 text-left">用户名</th>
<th class="px-3 py-2 text-left">UA</th> <th class="px-3 py-2 text-left">IP</th>
<th class="px-3 py-2 text-left">登录时间</th> <th class="px-3 py-2 text-left">UA</th>
</tr> <th class="px-3 py-2 text-left">登录时间</th>
</thead> </tr>
<tbody> </thead>
<tr v-if="!logs.length"> <tbody>
<td colspan="4" class="px-3 py-6"> <tr v-if="!logs.length">
<div class="flex items-center justify-center"> <td colspan="4" class="px-3 py-6">
<span class="text-sm text-muted-foreground">暂无数据</span> <div class="flex items-center justify-center">
</div> <span class="text-sm text-muted-foreground">暂无数据</span>
</td> </div>
</tr> </td>
<tr v-for="item in logs" :key="item.id" class="border-t border-border"> </tr>
<td class="px-3 py-2">{{ item.username }}</td> <tr v-for="item in logs" :key="item.id" class="border-t border-border">
<td class="px-3 py-2">{{ item.ip }}</td> <td class="px-3 py-2">{{ item.username }}</td>
<td class="px-3 py-2 truncate max-w-[420px]" :title="item.ua">{{ item.ua }}</td> <td class="px-3 py-2">{{ item.ip }}</td>
<td class="px-3 py-2">{{ item.created_on }}</td> <td class="px-3 py-2 truncate max-w-[220px] sm:max-w-[420px]" :title="item.ua">{{ item.ua }}</td>
</tr> <td class="px-3 py-2">{{ item.created_on }}</td>
</tbody> </tr>
</table> </tbody>
</div> </table>
</div> </div>
</div>
</CardContent>
</Card>
</template> </template>