117 lines
5.1 KiB
PHP
117 lines
5.1 KiB
PHP
{include file="public/header" /}
|
|
<div class="layui-card">
|
|
<div class="layui-card-header">
|
|
<span class="layui-badge layui-bg-blue">登录日志</span>
|
|
</div>
|
|
<div class="layui-card-body">
|
|
<form class="layui-form layui-form-pane" action="">
|
|
<div class="layui-form-item">
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">用户名</label>
|
|
<div class="layui-input-inline">
|
|
<input type="text" name="username" placeholder="请输入用户名" autocomplete="off" class="layui-input">
|
|
</div>
|
|
</div>
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">IP地址</label>
|
|
<div class="layui-input-inline">
|
|
<input type="text" name="ip" placeholder="请输入IP地址" autocomplete="off" class="layui-input">
|
|
</div>
|
|
</div>
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">状态</label>
|
|
<div class="layui-input-inline">
|
|
<select name="status">
|
|
<option value="">全部</option>
|
|
<option value="1">成功</option>
|
|
<option value="0">失败</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">时间范围</label>
|
|
<div class="layui-input-inline" style="width: 300px;">
|
|
<input type="text" name="time_range" class="layui-input" id="timeRange" placeholder="请选择时间范围">
|
|
</div>
|
|
</div>
|
|
<div class="layui-inline">
|
|
<button class="layui-btn" lay-submit lay-filter="searchForm">
|
|
<i class="layui-icon layui-icon-search"></i> 搜索
|
|
</button>
|
|
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
|
|
<table id="loginLogTable" lay-filter="loginLogTable"></table>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="/static/layui/layui.js"></script>
|
|
<script>
|
|
layui.use(['table', 'form', 'laydate'], function(){
|
|
var table = layui.table;
|
|
var form = layui.form;
|
|
var laydate = layui.laydate;
|
|
|
|
// 初始化时间范围选择器
|
|
laydate.render({
|
|
elem: '#timeRange',
|
|
type: 'datetime',
|
|
range: true
|
|
});
|
|
|
|
// 初始化表格
|
|
table.render({
|
|
elem: '#loginLogTable',
|
|
url: '{:url("log/login")}',
|
|
method: 'post',
|
|
defaultToolbar: ['filter', 'exports', 'print'],
|
|
parseData: function(res) {
|
|
return {
|
|
"code": res.code === 0 ? 0 : 1,
|
|
"msg": res.msg,
|
|
"count": res.count,
|
|
"data": res.data
|
|
};
|
|
},
|
|
cols: [[
|
|
{field: 'id', title: 'ID', width: 80, sort: true, align: 'center'},
|
|
{field: 'username', title: '用户名', align: 'center'},
|
|
{field: 'ip_address', title: 'IP地址', width: 130, align: 'center'},
|
|
{field: 'location', title: '登录地点', width: 120, align: 'center'},
|
|
{field: 'device_type', title: '设备类型', width: 100, align: 'center'},
|
|
{field: 'user_agent', title: '浏览器', width: 200, align: 'center'},
|
|
{field: 'login_status', title: '状态', width: 100, align: 'center', templet: function(d){
|
|
return d.login_status == 1 ?
|
|
'<span class="layui-badge layui-bg-green">成功</span>' :
|
|
'<span class="layui-badge layui-bg-red">失败</span>';
|
|
}},
|
|
{field: 'failure_reason', title: '失败原因', width: 150, align: 'center'},
|
|
{field: 'login_time', title: '登录时间', width: 180, sort: true, align: 'center'}
|
|
]],
|
|
page: true,
|
|
limit: 10,
|
|
limits: [10, 20, 50, 100]
|
|
});
|
|
|
|
// 监听搜索表单提交
|
|
form.on('submit(searchForm)', function(data){
|
|
var timeRange = data.field.time_range;
|
|
if(timeRange){
|
|
var times = timeRange.split(' - ');
|
|
data.field.start_time = times[0];
|
|
data.field.end_time = times[1];
|
|
}
|
|
delete data.field.time_range;
|
|
|
|
table.reload('loginLogTable', {
|
|
where: data.field,
|
|
page: {curr: 1}
|
|
});
|
|
return false;
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|