69 lines
2.2 KiB
HTML
69 lines
2.2 KiB
HTML
|
<!DOCTYPE html>
|
||
|
<html>
|
||
|
<head>
|
||
|
<meta charset="utf-8">
|
||
|
<title>令牌使用日志</title>
|
||
|
<link rel="stylesheet" href="/static/layui/css/layui.css">
|
||
|
<link rel="stylesheet" href="/static/css/style.css">
|
||
|
</head>
|
||
|
<body>
|
||
|
<div class="layui-fluid">
|
||
|
<div class="layui-card">
|
||
|
<div class="layui-card-header">令牌使用日志</div>
|
||
|
<div class="layui-card-body">
|
||
|
<table id="log-table" lay-filter="log-table"></table>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<!-- 状态模板 -->
|
||
|
<script type="text/html" id="statusTpl">
|
||
|
{{# if(d.status === 'success'){ }}
|
||
|
<span class="layui-badge layui-bg-green">成功</span>
|
||
|
{{# } else { }}
|
||
|
<span class="layui-badge layui-bg-red">失败</span>
|
||
|
{{# } }}
|
||
|
</script>
|
||
|
|
||
|
<!-- 操作类型模板 -->
|
||
|
<script type="text/html" id="actionTpl">
|
||
|
{{# var types = {
|
||
|
'create': '创建',
|
||
|
'use': '使用',
|
||
|
'revoke': '撤销'
|
||
|
}; }}
|
||
|
{{# var type = types[d.action] || d.action; }}
|
||
|
<span>{{type}}</span>
|
||
|
</script>
|
||
|
|
||
|
<script src="/static/layui/layui.js"></script>
|
||
|
<script>
|
||
|
layui.use(['table', 'layer'], function(){
|
||
|
var table = layui.table;
|
||
|
var layer = layui.layer;
|
||
|
var $ = layui.$;
|
||
|
|
||
|
// 获取令牌ID
|
||
|
var tokenId = location.search.match(/id=(\d+)/)[1];
|
||
|
|
||
|
// 初始化表格
|
||
|
table.render({
|
||
|
elem: '#log-table',
|
||
|
url: '/api/tokens/' + tokenId + '/logs',
|
||
|
headers: {
|
||
|
'Authorization': 'Bearer ' + localStorage.getItem('token')
|
||
|
},
|
||
|
cols: [[
|
||
|
{field: 'action', title: '操作类型', width: 100, templet: '#actionTpl'},
|
||
|
{field: 'ip', title: 'IP地址', width: 150},
|
||
|
{field: 'userAgent', title: 'User-Agent', width: 300},
|
||
|
{field: 'status', title: '状态', width: 100, templet: '#statusTpl'},
|
||
|
{field: 'message', title: '详细信息'},
|
||
|
{field: 'createdAt', title: '时间', width: 160}
|
||
|
]],
|
||
|
page: true
|
||
|
});
|
||
|
});
|
||
|
</script>
|
||
|
</body>
|
||
|
</html>
|