update reporting

*change block request => reporting
*update menu name and svg
*update file and script name
*change table order and add new data
*update table style with some centering
*add reporting country filter
This commit is contained in:
Jordan Blasenhauer 2024-01-22 10:56:38 +01:00
parent e1b485c874
commit 775653f39f
14 changed files with 367 additions and 113 deletions

View file

@ -1595,35 +1595,65 @@ def logs_container(container_id):
return jsonify({"logs": logs, "last_update": int(time() * 1000)})
@app.route("/block_requests", methods=["GET"])
@app.route("/reports", methods=["GET"])
@login_required
def block_requests():
def reports():
# TODO : Get block requests from database to send it
block_requests = [
{"ip": "124.0.0.1", "url": "/test", "date": "12/51/9851", "reason": "antibot", "method": "GET", "status": 403, "data": "{fesfmk fesfsf sfesfes}"},
{"ip": "124.0.0.2", "url": "/test", "date": "12/51/9851", "reason": "test", "method": "GET", "status": 403, "data": "{fesfmk fesfsf sfesfes}"},
{"ip": "124.0.0.3", "url": "/test", "date": "12/51/9851", "reason": "antibot", "method": "GET", "status": 403, "data": "{fesfmk fesfsf sfesfes}"},
reports = [
{
"user_agent": "Version 0.6.1 - Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; en-US; rv:1.5a) Gecko/20030728 Mozilla Firebird/0.6.1",
"ip": "124.0.0.1",
"country": "FR",
"url": "/test",
"date": "12/51/9851",
"reason": "antibot",
"method": "GET",
"status": 403,
"data": "{fesfmk fesfsf sfesfes}",
},
{
"user_agent": "Version 0.6.1 - Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; en-US; rv:1.5a) Gecko/20030728 Mozilla Firebird/0.6.1",
"ip": "124.0.0.2",
"country": "EN",
"url": "/test",
"date": "12/51/9851",
"reason": "test",
"method": "GET",
"status": 403,
"data": "{fesfmk fesfsf sfesfes}",
},
{
"user_agent": "Version 0.6.1 - Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; en-US; rv:1.5a) Gecko/20030728 Mozilla Firebird/0.6.1",
"ip": "124.0.0.3",
"country": "ES",
"url": "/test",
"date": "12/51/9851",
"reason": "antibot",
"method": "GET",
"status": 403,
"data": "{fesfmk fesfsf sfesfes}",
},
]
# Prepare data
reasons = {}
codes = {}
for request in block_requests:
for report in reports:
# Get top reasons
if not request["reason"] in reasons:
reasons[request["reason"]] = 0
reasons[request["reason"]] = reasons[request["reason"]] + 1
if not report["reason"] in reasons:
reasons[report["reason"]] = 0
reasons[report["reason"]] = reasons[report["reason"]] + 1
# Get top status code
if not request["status"] in codes:
codes[request["status"]] = 0
codes[request["status"]] = codes[request["status"]] + 1
if not report["status"] in codes:
codes[report["status"]] = 0
codes[report["status"]] = codes[report["status"]] + 1
top_reason = [k for k, v in reasons.items() if v == max(reasons.values())][0]
top_code = [k for k, v in codes.items() if v == max(codes.values())][0]
return render_template(
"block_requests.html",
block_requests=block_requests,
"reports.html",
reports=reports,
top_code=top_code,
top_reason=top_reason,
username=current_user.get_id(),

View file

@ -0,0 +1,21 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/x-icon" href="/images/favicon.ico" />
<link rel="stylesheet" href="/css/style.css" />
<link rel="stylesheet" href="/css/flag-icons.min.css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>BunkerWeb | Account</title>
<script type="module" crossorigin src="/assets/account-ba9110db.js"></script>
<link rel="modulepreload" crossorigin href="/assets/lang-f5f8ee65.js">
<link rel="modulepreload" crossorigin href="/assets/State-99778106.js">
<link rel="modulepreload" crossorigin href="/assets/Base-fc8c7eae.js">
<link rel="modulepreload" crossorigin href="/assets/Input-294600dd.js">
<link rel="stylesheet" href="/assets/State-26c5bb69.css">
</head>
<body>
<div id="app"></div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/x-icon" href="/images/favicon.ico" />
<link rel="stylesheet" href="/css/style.css" />
<link rel="stylesheet" href="/css/flag-icons.min.css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>BunkerWeb | Actions</title>
<script type="module" crossorigin src="/assets/actions-43d7100c.js"></script>
<link rel="modulepreload" crossorigin href="/assets/lang-f5f8ee65.js">
<link rel="modulepreload" crossorigin href="/assets/State-99778106.js">
<link rel="modulepreload" crossorigin href="/assets/List-82cc034b.js">
<link rel="modulepreload" crossorigin href="/assets/Input-294600dd.js">
<link rel="modulepreload" crossorigin href="/assets/Select-55aa1b49.js">
<link rel="modulepreload" crossorigin href="/assets/Item-e1d34516.js">
<link rel="modulepreload" crossorigin href="/assets/Datepicker-349b9bba.js">
<link rel="stylesheet" href="/assets/State-26c5bb69.css">
<link rel="stylesheet" href="/assets/Datepicker-b3d9355d.css">
</head>
<body>
<div id="app"></div>
</body>
</html>

28
src/ui/static/bans.html Normal file
View file

@ -0,0 +1,28 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/x-icon" href="/images/favicon.ico" />
<link rel="stylesheet" href="/css/style.css" />
<link rel="stylesheet" href="/css/flag-icons.min.css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>BunkerWeb | Bans</title>
<script type="module" crossorigin src="/assets/bans-04a6a92e.js"></script>
<link rel="modulepreload" crossorigin href="/assets/lang-f5f8ee65.js">
<link rel="modulepreload" crossorigin href="/assets/State-99778106.js">
<link rel="modulepreload" crossorigin href="/assets/Input-294600dd.js">
<link rel="modulepreload" crossorigin href="/assets/Select-55aa1b49.js">
<link rel="modulepreload" crossorigin href="/assets/List-82cc034b.js">
<link rel="modulepreload" crossorigin href="/assets/Item-e1d34516.js">
<link rel="modulepreload" crossorigin href="/assets/Datepicker-349b9bba.js">
<link rel="modulepreload" crossorigin href="/assets/Warning-42bddb5b.js">
<link rel="modulepreload" crossorigin href="/assets/Base-fc8c7eae.js">
<link rel="modulepreload" crossorigin href="/assets/Checkbox-a81c9afa.js">
<link rel="stylesheet" href="/assets/State-26c5bb69.css">
<link rel="stylesheet" href="/assets/Datepicker-b3d9355d.css">
</head>
<body>
<div id="app"></div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/x-icon" href="/images/favicon.ico" />
<link rel="stylesheet" href="/css/style.css" />
<link rel="stylesheet" href="/css/flag-icons.min.css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>BunkerWeb | Configs</title>
<script type="module" crossorigin src="/assets/configs-86035b54.js"></script>
<link rel="modulepreload" crossorigin href="/assets/lang-f5f8ee65.js">
<link rel="modulepreload" crossorigin href="/assets/State-99778106.js">
<link rel="modulepreload" crossorigin href="/assets/List-82cc034b.js">
<link rel="modulepreload" crossorigin href="/assets/Input-294600dd.js">
<link rel="modulepreload" crossorigin href="/assets/Checkbox-a81c9afa.js">
<link rel="modulepreload" crossorigin href="/assets/Base-27eb0461.js">
<link rel="modulepreload" crossorigin href="/assets/Base-fc8c7eae.js">
<link rel="modulepreload" crossorigin href="/assets/v4-4a60fe23.js">
<link rel="stylesheet" href="/assets/State-26c5bb69.css">
</head>
<body>
<div id="app"></div>
</body>
</html>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -1,11 +1,12 @@
class Filter {
constructor(prefix = "block_requests") {
constructor(prefix = "reports") {
this.prefix = prefix;
this.container = document.querySelector(`[data-${this.prefix}-filter]`);
this.keyInp = document.querySelector("input#keyword");
this.methodValue = "all";
this.statusValue = "all";
this.reasonValue = "all";
this.countryValue = "all";
this.initHandler();
}
@ -22,7 +23,7 @@ class Filter {
setTimeout(() => {
const value = document
.querySelector(
`[data-${this.prefix}-setting-select-text="method"]`,
`[data-${this.prefix}-setting-select-text="method"]`
)
.textContent.trim();
@ -33,6 +34,29 @@ class Filter {
}
} catch (err) {}
});
//COUNTRY HANDLER
this.container.addEventListener("click", (e) => {
try {
if (
e.target
.closest("button")
.getAttribute(`data-${this.prefix}-setting-select-dropdown-btn`) ===
"country"
) {
setTimeout(() => {
const value = document
.querySelector(
`[data-${this.prefix}-setting-select-text="country"]`
)
.textContent.trim();
this.countryValue = value;
//run filter
this.filter();
}, 10);
}
} catch (err) {}
});
//STATUS HANDLER
this.container.addEventListener("click", (e) => {
try {
@ -45,7 +69,7 @@ class Filter {
setTimeout(() => {
const value = document
.querySelector(
`[data-${this.prefix}-setting-select-text="status"]`,
`[data-${this.prefix}-setting-select-text="status"]`
)
.textContent.trim();
@ -68,7 +92,7 @@ class Filter {
setTimeout(() => {
const value = document
.querySelector(
`[data-${this.prefix}-setting-select-text="reason"]`,
`[data-${this.prefix}-setting-select-text="reason"]`
)
.textContent.trim();
@ -87,7 +111,7 @@ class Filter {
filter() {
const requests = document.querySelector(
`[data-${this.prefix}-list]`,
`[data-${this.prefix}-list]`
).children;
if (requests.length === 0) return;
//reset
@ -100,6 +124,7 @@ class Filter {
this.setFilterKeyword(requests);
this.setFilterStatus(requests);
this.setFilterReason(requests);
this.setFilterCountry(requests);
}
setFilterMethod(requests) {
@ -111,6 +136,15 @@ class Filter {
}
}
setFilterMethod(requests) {
if (this.countryValue === "all") return;
for (let i = 0; i < requests.length; i++) {
const el = requests[i];
const type = this.getElAttribut(el, "country");
if (type !== this.countryValue) el.classList.add("hidden");
}
}
setFilterKeyword(requests) {
const keyword = this.keyInp.value.trim().toLowerCase();
if (!keyword) return;
@ -159,7 +193,7 @@ class Filter {
}
class Dropdown {
constructor(prefix = "block_requests") {
constructor(prefix = "reports") {
this.prefix = prefix;
this.container = document.querySelector("main");
this.lastDrop = "";
@ -197,7 +231,7 @@ class Dropdown {
const btn = e.target.closest("button");
const btnValue = btn.getAttribute("value");
const btnSetting = btn.getAttribute(
`data-${this.prefix}-setting-select-dropdown-btn`,
`data-${this.prefix}-setting-select-dropdown-btn`
);
//stop if same value to avoid new fetching
const isSameVal = this.isSameValue(btnSetting, btnValue);
@ -223,7 +257,7 @@ class Dropdown {
closeAllDrop() {
const drops = document.querySelectorAll(
`[data-${this.prefix}-setting-select-dropdown]`,
`[data-${this.prefix}-setting-select-dropdown]`
);
drops.forEach((drop) => {
drop.classList.add("hidden");
@ -231,8 +265,8 @@ class Dropdown {
document
.querySelector(
`svg[data-${this.prefix}-setting-select="${drop.getAttribute(
`data-${this.prefix}-setting-select-dropdown`,
)}"]`,
`data-${this.prefix}-setting-select-dropdown`
)}"]`
)
.classList.remove("rotate-180");
});
@ -240,7 +274,7 @@ class Dropdown {
isSameValue(btnSetting, value) {
const selectCustom = document.querySelector(
`[data-${this.prefix}-setting-select-text="${btnSetting}"]`,
`[data-${this.prefix}-setting-select-text="${btnSetting}"]`
);
const currVal = selectCustom.textContent;
return currVal === value ? true : false;
@ -248,30 +282,30 @@ class Dropdown {
setSelectNewValue(btnSetting, value) {
const selectCustom = document.querySelector(
`[data-${this.prefix}-setting-select="${btnSetting}"]`,
`[data-${this.prefix}-setting-select="${btnSetting}"]`
);
selectCustom.querySelector(
`[data-${this.prefix}-setting-select-text]`,
`[data-${this.prefix}-setting-select-text]`
).textContent = value;
}
hideDropdown(btnSetting) {
//hide dropdown
const dropdownEl = document.querySelector(
`[data-${this.prefix}-setting-select-dropdown="${btnSetting}"]`,
`[data-${this.prefix}-setting-select-dropdown="${btnSetting}"]`
);
dropdownEl.classList.add("hidden");
dropdownEl.classList.remove("flex");
//svg effect
const dropdownChevron = document.querySelector(
`svg[data-${this.prefix}-setting-select="${btnSetting}"]`,
`svg[data-${this.prefix}-setting-select="${btnSetting}"]`
);
dropdownChevron.classList.remove("rotate-180");
}
changeDropBtnStyle(btnSetting, selectedBtn) {
const dropdownEl = document.querySelector(
`[data-${this.prefix}-setting-select-dropdown="${btnSetting}"]`,
`[data-${this.prefix}-setting-select-dropdown="${btnSetting}"]`
);
//reset dropdown btns
const btnEls = dropdownEl.querySelectorAll("button");
@ -281,7 +315,7 @@ class Dropdown {
"bg-primary",
"dark:bg-primary",
"text-gray-300",
"text-gray-300",
"text-gray-300"
);
btn.classList.add("bg-white", "dark:bg-slate-700", "text-gray-700");
});
@ -289,7 +323,7 @@ class Dropdown {
selectedBtn.classList.remove(
"bg-white",
"dark:bg-slate-700",
"text-gray-700",
"text-gray-700"
);
selectedBtn.classList.add("dark:bg-primary", "bg-primary", "text-gray-300");
}
@ -300,10 +334,10 @@ class Dropdown {
.getAttribute(`data-${this.prefix}-setting-select`);
//toggle dropdown
const dropdownEl = document.querySelector(
`[data-${this.prefix}-setting-select-dropdown="${attribute}"]`,
`[data-${this.prefix}-setting-select-dropdown="${attribute}"]`
);
const dropdownChevron = document.querySelector(
`svg[data-${this.prefix}-setting-select="${attribute}"]`,
`svg[data-${this.prefix}-setting-select="${attribute}"]`
);
dropdownEl.classList.toggle("hidden");
dropdownEl.classList.toggle("flex");

View file

@ -34,7 +34,7 @@ url_for(request.endpoint)[1:].split("/")[-1].strip() %}
<!-- info-->
<div
class="col-span-12 md:col-span-4 3xl:col-span-3 p-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
class="h-fit col-span-12 md:col-span-4 3xl:col-span-3 p-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
>
<h5 class="mb-2 font-bold dark:text-white/90">INFO</h5>
<div class="mx-1 flex items-center my-4">

View file

@ -45,8 +45,8 @@
<script type="module" src="./js/jobs.js"></script>
{% elif current_endpoint == "account" %}
<script type="module" src="./js/account.js"></script>
{% elif current_endpoint == "block_requests" %}
<script type="module" src="./js/requests.js"></script>
{% elif current_endpoint == "reports" %}
<script type="module" src="./js/reports.js"></script>
{% elif current_endpoint == "bans" %}
<link rel="stylesheet" type="text/css" href="./css/flatpickr.css" />
<link rel="stylesheet" type="text/css" href="./css/flatpickr.dark.css" />

View file

@ -2,7 +2,7 @@
url_for(request.endpoint)[1:].split("/")[-1].strip() %}
<!-- info-->
<div
class="col-span-12 md:col-span-4 3xl:col-span-3 p-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
class="h-fit col-span-12 md:col-span-4 3xl:col-span-3 p-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
>
<h5 class="mb-2 font-bold dark:text-white/90">INFO</h5>
<div class="mx-1 flex items-center my-4">
@ -209,27 +209,27 @@ url_for(request.endpoint)[1:].split("/")[-1].strip() %}
<div class="min-w-[900px] w-full grid grid-cols-12 rounded p-2">
<!-- header-->
<p
class="dark:text-gray-300 h-8 text-sm font-bold col-span-3 m-0 pb-2 border-b border-gray-400"
class=" dark:text-gray-300 h-8 text-sm font-bold col-span-3 m-0 pb-2 border-b border-gray-400"
>
Name
</p>
<p
class="dark:text-gray-300 h-8 text-sm font-bold col-span-3 m-0 pb-2 border-b border-gray-400"
class=" dark:text-gray-300 h-8 text-sm font-bold col-span-3 m-0 pb-2 border-b border-gray-400"
>
Last run
</p>
<p
class="dark:text-gray-300 h-8 text-sm font-bold col-span-1 m-0 pb-2 border-b border-gray-400"
class="flex justify-center dark:text-gray-300 h-8 text-sm font-bold col-span-1 m-0 pb-2 border-b border-gray-400"
>
Every
</p>
<p
class="dark:text-gray-300 h-8 text-sm font-bold col-span-1 m-0 pb-2 border-b border-gray-400"
class="flex justify-center dark:text-gray-300 h-8 text-sm font-bold col-span-1 m-0 pb-2 border-b border-gray-400"
>
Reload
</p>
<p
class="dark:text-gray-300 h-8 text-sm font-bold col-span-1 m-0 pb-2 border-b border-gray-400"
class="flex justify-center dark:text-gray-300 h-8 text-sm font-bold col-span-1 m-0 pb-2 border-b border-gray-400"
>
Success
</p>
@ -249,21 +249,21 @@ url_for(request.endpoint)[1:].split("/")[-1].strip() %}
>
<p
class="dark:text-gray-400 dark:opacity-80 text-sm col-span-3 m-0 my-1"
class=" dark:text-gray-400 dark:opacity-80 text-sm col-span-3 m-0 my-1"
data-{{current_endpoint}}-name
>
{{job_name}}
</p>
<p
class="dark:text-gray-400 dark:opacity-80 text-sm col-span-3 m-0 my-1"
class=" dark:text-gray-400 dark:opacity-80 text-sm col-span-3 m-0 my-1"
data-{{current_endpoint}}-last_run
>
{{value['last_run']}}
</p>
<p
class="dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1"
class="flex justify-center dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1"
data-{{current_endpoint}}-every
>
{{value["every"]}}
@ -271,7 +271,7 @@ url_for(request.endpoint)[1:].split("/")[-1].strip() %}
{% if value["reload"] %}
<p
class="ml-6 dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1"
class="flex justify-center dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1"
data-{{current_endpoint}}-reload="true"
>
<svg
@ -288,7 +288,7 @@ url_for(request.endpoint)[1:].split("/")[-1].strip() %}
{%endif %} {% if not value["reload"] %}
<p
class="ml-6 dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1"
class="flex justify-center dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1"
data-{{current_endpoint}}-reload="false"
>
<svg
@ -304,7 +304,7 @@ url_for(request.endpoint)[1:].split("/")[-1].strip() %}
{% endif %} {% if value["success"] %}
<p
class="ml-6 dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1"
class="flex justify-center dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1"
data-{{current_endpoint}}-success="true"
>
<svg
@ -320,7 +320,7 @@ url_for(request.endpoint)[1:].split("/")[-1].strip() %}
{% elif not value["success"] %}
<p
class="ml-6 dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1"
class="flex justify-center dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1"
data-{{current_endpoint}}-success="false"
>
<svg
@ -336,7 +336,7 @@ url_for(request.endpoint)[1:].split("/")[-1].strip() %}
{% endif %}
<div
class="relative dark:text-gray-400 text-sm col-span-3 m-0 my-1"
class="relative dark:text-gray-400 text-sm col-span-3 m-0 my-1"
data-{{current_endpoint}}-files
>
{% if value['cache']%}

View file

@ -304,22 +304,21 @@
<!-- item -->
<li class="mt-0.5 w-full">
<a
class="{% if current_endpoint == 'block_requests' %}font-semibold text-slate-700 dark:bg-primary/50 rounded-lg dark:hover:bg-primary/60 bg-primary/20 hover:bg-primary/30{% else %}dark:hover:bg-primary/20 hover:bg-primary/5 {% endif %} hover:rounded-lg dark:text-white dark:opacity-80 py-1 text-sm ease-nav-brand my-0 mx-2 flex items-center whitespace-nowrap px-4 transition"
href="{% if current_endpoint == 'block_requests' %}#{% else %}loading?next={{ url_for('block_requests') }}{% endif %}"
class="{% if current_endpoint == 'reports' %}font-semibold text-slate-700 dark:bg-primary/50 rounded-lg dark:hover:bg-primary/60 bg-primary/20 hover:bg-primary/30{% else %}dark:hover:bg-primary/20 hover:bg-primary/5 {% endif %} hover:rounded-lg dark:text-white dark:opacity-80 py-1 text-sm ease-nav-brand my-0 mx-2 flex items-center whitespace-nowrap px-4 transition"
href="{% if current_endpoint == 'reports' %}#{% else %}loading?next={{ url_for('reports') }}{% endif %}"
>
<div
class="mr-2 flex items-center justify-center rounded-lg bg-center stroke-0 text-center p-1 xl:p-1.5"
>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
class="stroke-amber-500 dark:stroke-amber-500 h-6 w-6 relative"
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="stroke-amber-500 dark:stroke-amber-500 h-6 w-6 relative"
>
<path stroke-linecap="round" stroke-linejoin="round" d="M10.05 4.575a1.575 1.575 0 1 0-3.15 0v3m3.15-3v-1.5a1.575 1.575 0 0 1 3.15 0v1.5m-3.15 0 .075 5.925m3.075.75V4.575m0 0a1.575 1.575 0 0 1 3.15 0V15M6.9 7.575a1.575 1.575 0 1 0-3.15 0v8.175a6.75 6.75 0 0 0 6.75 6.75h2.018a5.25 5.25 0 0 0 3.712-1.538l1.732-1.732a5.25 5.25 0 0 0 1.538-3.712l.003-2.024a.668.668 0 0 1 .198-.471 1.575 1.575 0 1 0-2.228-2.228 3.818 3.818 0 0 0-1.12 2.687M6.9 7.575V12m6.27 4.318A4.49 4.49 0 0 1 16.35 15m.002 0h-.002" />
<path stroke-linecap="round" stroke-linejoin="round" d="M3 3v1.5M3 21v-6m0 0 2.77-.693a9 9 0 0 1 6.208.682l.108.054a9 9 0 0 0 6.086.71l3.114-.732a48.524 48.524 0 0 1-.005-10.499l-3.11.732a9 9 0 0 1-6.085-.711l-.108-.054a9 9 0 0 0-6.208-.682L3 4.5M3 15V4.5" />
</svg>
</div>
<span class="ml-1 duration-300 opacity-100 pointer-events-none ease"
>
Block requests
Reporting
</span
>
</a>

View file

@ -4,7 +4,7 @@ include "plugins_modal.html" %}
<!-- info -->
<div
class="p-4 col-span-12 md:col-span-5 2xl:col-span-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
class="h-fit p-4 col-span-12 md:col-span-5 2xl:col-span-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
>
<h5 class="col-span-12 mb-4 font-bold dark:text-white/90">INFO</h5>
<div class="mx-1 flex items-center my-4">

View file

@ -4,35 +4,39 @@ url_for(request.endpoint)[1:].split("/")[-1].strip() %}
{% set methods = [] %}
{% set codes = [] %}
{% set reasons = [] %}
{% set countries = [] %}
{% for request in block_requests %}
{% if request["method"] not in methods %}
{% set methods = methods.append(request["method"]) %}
{% for report in reports %}
{% if report["method"] not in methods %}
{% set methods = methods.append(report["method"]) %}
{% endif %}
{% if request["status"] not in codes %}
{% set codes = codes.append(request["status"]) %}
{% if report["status"] not in codes %}
{% set codes = codes.append(report["status"]) %}
{% endif %}
{% if request["reason"] not in reasons %}
{% set reasons = reasons.append(request["reason"]) %}
{% if report["reason"] not in reasons %}
{% set reasons = reasons.append(report["reason"]) %}
{% endif %}
{% if report["country"] not in countries %}
{% set countries = countries.append(report["country"]) %}
{% endif %}
{% endfor %}
<!-- info-->
<div
class="col-span-12 md:col-span-4 3xl:col-span-3 p-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
class="h-fit col-span-12 md:col-span-4 3xl:col-span-3 p-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
>
<h5 class="mb-2 font-bold dark:text-white/90">INFO</h5>
<div class="mx-1 flex items-center my-4">
<p
class="transition duration-300 ease-in-out font-bold mb-0 font-sans text-sm leading-normal uppercase dark:text-gray-500 dark:opacity-80"
>
BLOCK REQUESTS TOTAL
REPORTING TOTAL
</p>
<p
class="transition duration-300 ease-in-out pl-2 col-span-1 mb-0 font-sans text-sm font-semibold leading-normal uppercase dark:text-white dark:opacity-80"
>
{{block_requests|length}}
{{reports|length}}
</p>
</div>
<div class="mx-1 flex items-center my-4">
@ -89,6 +93,68 @@ url_for(request.endpoint)[1:].split("/")[-1].strip() %}
</div>
<!-- end search inpt-->
<!-- select country -->
<div class="flex flex-col relative col-span-12 md:col-span-6">
<h5
class="my-1 transition duration-300 ease-in-out dark:opacity-90 text-sm sm:text-md font-bold m-0 dark:text-gray-300"
>
Country
</h5>
<button
aria-controls="filter-state"
data-{{current_endpoint}}-setting-select="country"
class="disabled:opacity-75 dark:disabled:text-gray-300 disabled:text-gray-700 disabled:bg-gray-400 disabled:border-gray-400 dark:disabled:bg-gray-800 dark:disabled:border-gray-800 duration-300 ease-in-out dark:opacity-90 dark:border-slate-600 dark:bg-slate-700 dark:text-gray-300 focus:border-green-500 flex justify-between align-middle items-center text-left text-sm leading-5.6 ease w-full rounded-lg border border-solid border-gray-300 bg-white bg-clip-padding px-1.5 py-1 md:px-3 font-normal text-gray-700 transition-all placeholder:text-gray-500"
>
<span
aria-description="current filter state value"
id="{{current_endpoint}}-country"
data-name="{{current_endpoint}}-country"
data-{{current_endpoint}}-setting-select-text="country"
>all</span
>
<!-- chevron -->
<svg
data-{{current_endpoint}}-setting-select="country"
class="transition-transform h-4 w-4 fill-gray-500"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 512 512"
>
<path
d="M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z"
/>
</svg>
</button>
<!-- end chevron -->
<!-- dropdown-->
<div
id="filter-state"
role="listbox"
data-{{current_endpoint}}-setting-select-dropdown="country"
class="hidden z-100 absolute h-full flex-col w-full translate-y-16"
>
<button
role="option"
data-{{current_endpoint}}-setting-select-dropdown-btn="country"
value="all"
class="border-t rounded-t border-b border-l border-r border-gray-300 dark:hover:brightness-90 hover:brightness-90 my-0 relative py-2 px-3 text-left align-middle transition-all rounded-none cursor-pointer leading-normal text-sm ease-in tracking-tight-rem dark:border-slate-600 dark:text-gray-300 dark:bg-primary bg-primary text-gray-300"
>
all
</button>
{% for country in countries %}
<button
role="option"
data-{{current_endpoint}}-setting-select-dropdown-btn="country"
value="{{country}}"
class="{% if loop.last %}rounded-b{%endif%} border-b border-l border-r border-gray-300 dark:hover:brightness-90 hover:brightness-90 bg-white text-gray-700 my-0 relative py-2 px-3 text-left align-middle transition-all rounded-none cursor-pointer leading-normal text-sm ease-in tracking-tight-rem dark:border-slate-600 dark:bg-slate-700 dark:text-gray-300"
>
{{country}}
</button>
{% endfor %}
</div>
<!-- end dropdown-->
</div>
<!-- end select country -->
<!-- select method -->
<div class="flex flex-col relative col-span-12 md:col-span-6">
<h5
@ -151,6 +217,7 @@ url_for(request.endpoint)[1:].split("/")[-1].strip() %}
</div>
<!-- end select method -->
<!-- select status -->
<div class="flex flex-col relative col-span-12 md:col-span-6">
<h5
@ -281,105 +348,129 @@ url_for(request.endpoint)[1:].split("/")[-1].strip() %}
<div class="w-full overflow-hidden grid grid-cols-12 max-h-100 sm:max-h-125 col-span-12 p-4 relative break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
>
<div class="col-span-12">
<h5 class="mb-4 mt-2 font-bold dark:text-white/90 mx-2">BLOCK REQUESTS</h5>
<h5 class="mb-4 mt-2 font-bold dark:text-white/90 mx-2">REPORTING</h5>
</div>
<div
class="col-span-12 overflow-y-auto overflow-x-auto"
> <!-- list container-->
<div class="min-w-[1024px] w-full grid grid-cols-12 rounded p-2">
<div class="min-w-[1200px] w-full grid grid-cols-12 rounded p-2">
<!-- header-->
<p
class="dark:text-gray-300 h-8 text-sm font-bold col-span-2 m-0 pb-2 border-b border-gray-400"
class="dark:text-gray-300 flex justify-center h-8 text-sm font-bold col-span-1 m-0 pb-2 border-b border-gray-400"
>
IP
Date
</p>
<p
class="dark:text-gray-300 h-8 text-sm font-bold col-span-2 m-0 pb-2 border-b border-gray-400"
class="dark:text-gray-300 flex justify-center h-8 text-sm font-bold col-span-1 m-0 pb-2 border-b border-gray-400"
>
Url
IP
</p>
<p
class="dark:text-gray-300 h-8 text-sm font-bold col-span-2 m-0 pb-2 border-b border-gray-400"
class="dark:text-gray-300 flex justify-center h-8 text-sm font-bold col-span-1 m-0 pb-2 border-b border-gray-400"
>
Date
Country
</p>
<p
class="dark:text-gray-300 h-8 text-sm font-bold col-span-1 m-0 pb-2 border-b border-gray-400"
class="dark:text-gray-300 flex justify-center h-8 text-sm font-bold col-span-1 m-0 pb-2 border-b border-gray-400"
>
Method
</p>
<p
class="dark:text-gray-300 flex justify-center h-8 text-sm font-bold col-span-2 m-0 pb-2 border-b border-gray-400"
>
Method
URL
</p>
<p
class="dark:text-gray-300 h-8 text-sm font-bold col-span-1 m-0 pb-2 border-b border-gray-400"
class="dark:text-gray-300 flex justify-center h-8 text-sm font-bold col-span-1 m-0 pb-2 border-b border-gray-400"
>
Code
</p>
<p
class="dark:text-gray-300 h-8 text-sm font-bold col-span-2 m-0 pb-2 border-b border-gray-400"
class="dark:text-gray-300 flex justify-center h-8 text-sm font-bold col-span-2 m-0 pb-2 border-b border-gray-400"
>
User agent
</p>
<p
class="dark:text-gray-300 flex justify-center h-8 text-sm font-bold col-span-1 m-0 pb-2 border-b border-gray-400"
>
Reason
</p>
<p
class="dark:text-gray-300 h-8 text-sm font-bold col-span-2 m-0 pb-2 border-b border-gray-400"
class="dark:text-gray-300 flex justify-center h-8 text-sm font-bold col-span-2 m-0 pb-2 border-b border-gray-400"
>
Data
</p>
<!-- end header-->
<!-- list -->
<ul class="col-span-12 w-full" data-{{current_endpoint}}-list>
{% for request in block_requests %}
{% for report in reports %}
<li
class="items-center grid grid-cols-12 border-b border-gray-300 py-2.5"
>
<p
class="dark:text-gray-400 dark:opacity-80 text-sm col-span-2 m-0 my-1"
data-{{current_endpoint}}-ip="{{request['ip']}}"
class="flex justify-center dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1"
data-{{current_endpoint}}-date="{{report['date']}}"
>
{{request['ip']}}
{{report['date']}}
</p>
<p
class="flex justify-center dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1"
data-{{current_endpoint}}-ip="{{report['ip']}}"
>
{{report['ip']}}
</p>
<p
class="flex justify-center dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1"
data-{{current_endpoint}}-country="{{report['country']}}"
>
{{report['country']}}
</p>
<p
class="flex justify-center dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1 "
data-{{current_endpoint}}-method="{{report['method']}}"
>
{{report["method"]}}
</p>
<p
class="dark:text-gray-400 dark:opacity-80 text-sm col-span-2 m-0 my-1"
data-{{current_endpoint}}-url="{{request['url']}}"
class="flex justify-center dark:text-gray-400 dark:opacity-80 text-sm col-span-2 m-0 my-1"
data-{{current_endpoint}}-url="{{report['url']}}"
>
{{request['url']}}
{{report['url']}}
</p>
<p
class="dark:text-gray-400 dark:opacity-80 text-sm col-span-2 m-0 my-1"
data-{{current_endpoint}}-date="{{request['date']}}"
class="flex justify-center dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1 "
data-{{current_endpoint}}-status="{{report['status']}}"
>
{{request['date']}}
{{report["status"]}}
</p>
<p
class="dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1 pl-1 "
data-{{current_endpoint}}-method="{{request['method']}}"
class="flex justify-center dark:text-gray-400 dark:opacity-80 text-sm col-span-2 m-0 my-1 "
data-{{current_endpoint}}-user_agent="{{report['user_agent']}}"
>
{{report["user_agent"]}}
</p>
<p
class="flex justify-center dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1 "
data-{{current_endpoint}}-reason="{{report['reason']}}"
>
{{request["method"]}}
{{report["reason"]}}
</p>
<p
class="dark:text-gray-400 dark:opacity-80 text-sm col-span-1 m-0 my-1 pl-0.5 "
data-{{current_endpoint}}-status="{{request['status']}}"
class="flex justify-center dark:text-gray-400 dark:opacity-80 text-sm col-span-2 m-0 my-1"
data-{{current_endpoint}}-data="{{report['data']}}"
>
{{request["status"]}}
</p>
<p
class="dark:text-gray-400 dark:opacity-80 text-sm col-span-2 m-0 my-1 pl-0.5 "
data-{{current_endpoint}}-reason="{{request['reason']}}"
>
{{request["reason"]}}
</p>
<p
class="dark:text-gray-400 dark:opacity-80 text-sm col-span-2 m-0 my-1"
data-{{current_endpoint}}-data="{{request['data']}}"
>
{{request["data"]}}
{{report["data"]}}
</p>
</li>
{% endfor %}