Files
xbotcontrol/smarty/template/index.tpl

269 lines
11 KiB
Smarty

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>XBotControl</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous">
</script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-table@1.23.5/dist/bootstrap-table.min.css">
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap-table@1.23.5/dist/bootstrap-table.min.js"></script>
<!-- Latest compiled and minified Locales -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap-table@1.23.5/dist/locale/bootstrap-table-zh-CN.min.js"></script>
<link rel="stylesheet" type="text/css"
href="https://cdn.jsdelivr.net/npm/bootstrap-table@1.23.5/dist/extensions/filter-control/bootstrap-table-filter-control.css">
<script
src="https://cdn.jsdelivr.net/npm/bootstrap-table@1.23.5/dist/extensions/filter-control/bootstrap-table-filter-control.js">
</script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.1/css/all.min.css" rel="stylesheet">
</head>
<body>
<div id="main-menu " style="background-color: #003366;">
<div class="container text-center text-light">
<nav class="navbar navbar-expand-lg text-light">
<div class="container">
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="btn text-light" onclick="initializeTable('latest_requests');">Latest</a>
</li>
<li class="nav-item">
<a class="btn text-light" onclick="initializeTable('count_requests_by_ip');">Top by IP</a>
</li>
<li class="nav-item">
<a class="btn text-light" onclick="initializeTable('count_requests_by_ua');">Top by UA</a>
</li>
<li class="nav-item">
<a class="btn text-light" onclick="initializeTable('top_ip_ua_path');">IP+UA+Path</a>
</li>
<li class="nav-item">
<a class="btn text-light" onclick="initializeTable('top_ip_by_load');">IP+Load</a>
</li>
<li class="nav-item">
<a class="btn text-light" onclick="initializeTable('top_ip_by_rps');">IP+RPS</a>
</li>
<li class="nav-item">
<a class="btn text-light" onclick="initializeTable('top_net_28_by_rps');">IP+RPS</a>
</li>
</ul>
</div>
</div>
</nav>
</div>
</div>
<div class="content">
<div id="main-body">
<div class="container" style="max-width: 95%;">
<div class="row p-3">
<div class="col-10">
</div>
</div>
<div id="toolbar" class="row ">
<div class="col-auto">
<div class="input-group">
<div class="input-group-text">Limit</div>
<select id="limit" name="limit" class="form-control mr-3">
<option value="10">10</option>
<option value="50">50</option>
<option value="100" selected>100</option>
<option value="200">200</option>
<option value="500">500</option>
<option value="1000">1000</option>
<option value="100000">100000</option>
<option value="0">0</option>
</select>
</div>
</div>
<div class="col-auto">
<div class="input-group">
<div class="input-group-text">From</div>
<input type="datetime-local" id="date-from" name="date-from" class="form-control mr-3" >
</div>
</div>
<div class="col-auto">
<div class="input-group">
<div class="input-group-text">To</div>
<input type="datetime-local" id="date-to" name="date-to" class="form-control mr-3">
</div>
</div>
</div>
<table id="table">
</table>
</div>
</div>
</div>
<script>
document.getElementById('date-from').addEventListener('change', refreshTable);
document.getElementById('limit').addEventListener('change', refreshTable);
function refreshTable() {
$('#table').bootstrapTable('refresh');
}
window.onload = function() {
const dateFrom = document.getElementById('date-from');
const dateTo = document.getElementById('date-to');
const today = new Date();
const yesterday = new Date(today);
yesterday.setDate(today.getDate() - 1);
const tomorrow = new Date(today);
tomorrow.setDate(today.getDate() + 1);
dateFrom.value = yesterday.toISOString().slice(0, 16);
dateTo.value = tomorrow.toISOString().slice(0, 16);
};
document.getElementById('date-to').addEventListener('change', refreshTable);
function initializeTable(latest_requests) {
var url = location.pathname + '/api/report/' + latest_requests;
var $table = $('#table');
if ($table.length) {
$table.bootstrapTable('destroy');
}
$.get(url, function(response) {
$table.bootstrapTable({
url: url,
sortable: true,
toolbar: '#toolbar',
showRefresh: true,
iconsPrefix: 'fa',
showColumns: true,
classes: ['table', 'table-borderless', 'table-hover', 'table-striped'],
filterControl: true,
searchable: true,
pagination: false,
sidePagination: "server",
serverSort: false,
columns: response.columns,
queryParams: queryParams,
loadingFontSize: '12px'
});
});
}
function queryParams(params) {
const limit = document.getElementById('limit').value;
const from = document.getElementById('date-from').value;
const to = document.getElementById('date-to').value;
params.limit = limit;
params.from = from;
params.to = to;
return params;
}
function buttons() {
{if $smarty.session.user_role == 'admin'}
return {
btnAdd: {
text: 'Add new list',
icon: 'fa-plus',
event: function() {
// Prompt the user for a new list name
const newListName = prompt('Enter new list name:');
// Only proceed if the user provides a valid list name
if (newListName) {
// Define the URL where the form needs to be posted
const url = '{$smarty.env.BASEURI}/lists/create'; // Replace with actual URL
// Create a new hidden form element
const form = document.createElement('form');
form.method = 'POST';
form.action = url;
// Create hidden input to store the list name
const input = document.createElement('input');
input.type = 'hidden';
input.name = 'listName'; // The name expected by the server
input.value = newListName;
// Append the input to the form
form.appendChild(input);
// Append the form to the body to make it part of the DOM
document.body.appendChild(form);
// Submit the form automatically
form.submit();
} else {
// Handle case where user cancels or enters an empty name
alert('List creation was cancelled or name was empty.');
}
},
attributes: {
title: 'Add a new list to the table'
}
}
}
{else}
return {
}
{/if}
}
function listFormatter(value, row, index) {
var editBtn = '<a class="btn" href="{$smarty.env.BASEURI}/lists/edit/' + row.list_id + '" title="Edit"><i class="fa-solid fa-pen-to-square"></i></a> ';
var showBtn = '<a class="btn" href="{$smarty.env.BASEURI}/lists/show/' + row.list_id + '" title="Show"><i class="fa-solid fa-eye"></i></a>';
{if $smarty.session.user_role == 'admin'}
return [showBtn, editBtn, value, ].join('')
{else}
return [showBtn, value, ].join('')
{/if}
}
</script>
<footer class="centro-blue text-white text-center py-3">
<div class="footer">
<div class="container text-center centro-blue text-light">
<h6>Copyright 2024
</h6>
</div>
</div>
</footer>
</body>