Perf: Perf All Report

pull/14990/head
zhaojisen 2025-03-05 16:58:40 +08:00 committed by feng626
parent a3467bdabc
commit 9466c7105c
6 changed files with 731 additions and 597 deletions

View File

@ -3,52 +3,71 @@
<div class="report-container">
<header class="header">
{% autoescape off %}
{{ logo }}
{% endautoescape %}
</header>
<section class="basic-info-section">
<div class="header-container">
<span
class="triangle-down-icon collapse-toggle"
data-target="basic-info"
></span>
<div class="info-section">
<h2 class="info">
{% trans 'The following is a summary of account backup tasks, please review and handle them' %}
</h2>
<h2>{% trans 'Basic Information' %}</h2>
</div>
<main class="main-section">
<div class="synopsis-section">
<div class="synopsis-item">
<div class="synopsis-item-content">
<p>
<span class="item-label">{% trans 'Task name' %}</span>:
<span>{{ execution.automation.name }}</span>
</p>
<p>
<span class="item-label">{% trans 'Date start' %}</span>:
<span>{{ execution.date_start | date:"Y/m/d H:i:s" }}</span>
</p>
<p>
<span class="item-label">{% trans 'Date end' %}</span>:
<span>{{ execution.date_finished | date:"Y/m/d H:i:s" }}</span>
</p>
<p>
<span class="item-label">{% trans 'Time using' %}</span>:
<span>{{ execution.duration }}s</span>
</p>
<p>
<span class="item-label">{% trans 'Accounts amount' %}</span>:
<span>{{ summary.total_accounts }}</span>
</p>
<p>
<span class="item-label">{% trans 'Type count' %}</span>:
<span>{{ summary.total_types }}</span>
</p>
</div>
</div>
</div>
</main>
<div class="container-section collapsible-content" id="basic-info-content">
<div class="item">
<span class="item-label">{% trans 'Date start' %}</span>
<span class="item-value">{{ execution.date_start | date:"Y/m/d H:i:s" }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Date end' %}</span>
<span class="item-value">{{ execution.date_finished | date:"Y/m/d H:i:s" }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Accounts amount' %}</span>
<span class="item-value">{{ summary.total_accounts }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Task name' %}</span>
<span class="item-value">{{ execution.automation.name }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Time using' %}</span>
<span class="item-value">{{ execution.duration }}s</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Type count' %}</span>
<span class="item-value">{{ summary.total_types }}</span>
</div>
</div>
</section>
</div>
<style>
{% include './css/report.css' %}
</style>
</style>
<script>
const toggleButtons = document.querySelectorAll('.collapse-toggle')
toggleButtons.forEach((button) => {
button.addEventListener('click', function () {
const targetId = this.getAttribute('data-target')
const targetContent = document.getElementById(`${targetId}-content`)
if (this.classList.contains('triangle-down-icon')) {
this.classList.remove('triangle-down-icon')
this.classList.add('triangle-right-icon')
targetContent.classList.add('collapsed')
} else {
this.classList.remove('triangle-right-icon')
this.classList.add('triangle-down-icon')
targetContent.classList.remove('collapsed')
}
})
})
</script>

View File

@ -4,124 +4,159 @@
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
<div class="report-container">
<header class="header">
{% autoescape off %}
{{ logo }}
{% endautoescape %}
</header>
<section class="basic-info-section">
<div class="header-container">
<span
class="triangle-down-icon collapse-toggle"
data-target="basic-info"
></span>
<h2>{% trans 'Basic Information' %}</h2>
</div>
<div class="container-section collapsible-content" id="basic-info-content">
<div class="item">
<span class="item-label">{% trans 'Date start' %}</span>
<span class="item-value">{{ execution.date_start | date:"Y/m/d H:i:s" }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Date end' %}</span>
<span class="item-value">{{ execution.date_finished | date:"Y/m/d H:i:s" }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Assets amount' %}</span>
<span class="item-value">{{ summary.total_assets }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Asset success count' %}</span>
<span class="item-value">{{ summary.ok_assets | default:0 }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Asset failed count' %}</span>
<span class="item-value">{{ summary.fail_assets | default:0 }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Asset not support count' %}</span>
<span class="item-value">{{ summary.error_assets | default:0 }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Task name' %}</span>
<span class="item-value">{{ execution.automation.name }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Time using' %}</span>
<span class="item-value">{{ execution.duration }}s</span>
</div>
</div>
</section>
<div class="info-section">
<h2 class="info">
{% trans 'The following is a summary of account change secret tasks, please read and process' %}
</h2>
</div>
<main class="main-section">
<div class="synopsis-section">
<div class="synopsis-item">
<div class="synopsis-item-content">
<p>
<span class="item-label">{% trans 'Task name' %}</span>:
<span>{{ execution.automation.name }}</span>
</p>
<p>
<span class="item-label">{% trans 'Date start' %}</span>:
<span>{{ execution.date_start | date:"Y/m/d H:i:s" }}</span>
</p>
<p>
<span class="item-label">{% trans 'Date end' %}</span>:
<span>{{ execution.date_finished | date:"Y/m/d H:i:s" }}</span>
</p>
<p>
<span class="item-label">{% trans 'Time using' %}</span>:
<span>{{ execution.duration }}s</span>
</p>
<p>
<span class="item-label">{% trans 'Assets amount' %}</span>:
<span>{{ summary.total_assets }}</span>
</p>
<p>
<span class="item-label">{% trans 'Asset success count' %}</span>:
<span>{{ summary.ok_assets | default:0 }}</span>
</p>
<p>
<span class="item-label">{% trans 'Asset failed count' %}</span>:
<span>{{ summary.fail_assets | default:0 }}</span>
</p>
<p>
<span class="item-label">{% trans 'Asset not support count' %}</span>:
<span>{{ summary.error_assets | default:0 }}</span>
</p>
</div>
</div>
<section class="success">
<div class="header-container">
<span
class="triangle-down-icon collapse-toggle"
data-target="success"
></span>
<h2>
{% trans 'Success accounts' %}:
<span> {{ summary.ok_accounts | default:0 }} </span>
</h2>
</div>
<div class="tabel-section tabel-summery-section">
<div class="new-accounts result-section table-responsive">
<div class="section-header">
<h3>
{% trans 'Success accounts' %}:
<span>{{ summary.ok_accounts | default:0 }}</span>
</h3>
</div>
{% if summary.ok_accounts %}
<table class="custom-table table-striped table-hover data-table">
<thead>
<tr>
<th>{% trans 'No' %}</th>
<th>{% trans 'Asset' %}</th>
<th>{% trans 'Username' %}</th>
</tr>
</thead>
<tbody>
{% for account in result.ok_accounts %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ account.asset }}</td>
<td>{{ account.username }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
<p class="no-data">{% trans 'No new accounts found' %}</p>
{% endif %}
</div>
<div class="lost-accounts result-section table-responsive">
<div class="section-header">
<h3>
{% trans 'Failed accounts' %}:
<span>{{ summary.fail_accounts | default:0 }}</span>
</h3>
</div>
{% if summary.fail_accounts %}
<table class="custom-table table-hover data-table">
<thead>
<tr>
<th>{% trans 'No' %}</th>
<th>{% trans 'Asset' %}</th>
<th>{% trans 'Username' %}</th>
</tr>
</thead>
<tbody>
{% for account in result.fail_accounts %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ account.asset }}</td>
<td>{{ account.username }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
<p class="no-data">{% trans 'No new accounts found' %}</p>
{% endif %}
</div>
<div class="container-section collapsible-content" id="success-content">
{% if summary.ok_accounts %}
<table class="custom-table table-striped table-hover data-table">
<thead>
<tr>
<th>{% trans 'No' %}</th>
<th>{% trans 'Asset' %}</th>
<th>{% trans 'Username' %}</th>
</tr>
</thead>
<tbody>
{% for account in result.ok_accounts %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ account.asset }}</td>
<td>{{ account.username }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
<p class="no-data">{% trans 'No new accounts found' %}</p>
{% endif %}
</div>
</main>
</section>
<section class="failed">
<div class="header-container">
<span
class="triangle-down-icon collapse-toggle"
data-target="failed"
></span>
<h2>
{% trans 'Failed accounts' %}:
<span> {{ summary.fail_accounts | default:0 }} </span>
</h2>
</div>
<div class="container-section collapsible-content" id="failed-content">
{% if summary.fail_accounts %}
<table class="custom-table table-hover data-table">
<thead>
<tr>
<th>{% trans 'No' %}</th>
<th>{% trans 'Asset' %}</th>
<th>{% trans 'Username' %}</th>
</tr>
</thead>
<tbody>
{% for account in result.fail_accounts %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ account.asset }}</td>
<td>{{ account.username }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
<p class="no-data">{% trans 'No new accounts found' %}</p>
{% endif %}
</div>
</section>
</div>
<style>
{% include './css/report.css' %}
</style>
</style>
<script>
const toggleButtons = document.querySelectorAll('.collapse-toggle')
toggleButtons.forEach((button) => {
button.addEventListener('click', function () {
const targetId = this.getAttribute('data-target')
const targetContent = document.getElementById(`${targetId}-content`)
if (this.classList.contains('triangle-down-icon')) {
this.classList.remove('triangle-down-icon')
this.classList.add('triangle-right-icon')
targetContent.classList.add('collapsed')
} else {
this.classList.remove('triangle-right-icon')
this.classList.add('triangle-down-icon')
targetContent.classList.remove('collapsed')
}
})
})
</script>

View File

@ -3,103 +3,132 @@
<div class="report-container">
<header class="header">
{% autoescape off %}
{{ logo }}
{% endautoescape %}
</header>
<section class="basic-info-section">
<div class="header-container">
<span
class="triangle-down-icon collapse-toggle"
data-target="basic-info"
></span>
<div class="info-section">
<h2 class="info">
{% trans 'The following is a summary of the account check tasks. Please review and handle them' %}
</h2>
</div>
<main class="main-section">
<div class="synopsis-section">
<div class="synopsis-item">
<div class="synopsis-item-content">
<p>
<span class="item-label">{% trans 'Task name' %}</span>:
<span>{{ execution.automation.name }}</span>
</p>
<p>
<span class="item-label">{% trans 'Date start' %}</span>:
<span>{{ execution.date_start | date:"Y/m/d H:i:s" }}</span>
</p>
<p>
<span class="item-label">{% trans 'Date end' %}</span>:
<span>{{ execution.date_finished | date:"Y/m/d H:i:s" }}</span>
</p>
<p>
<span class="item-label">{% trans 'Time using' %}</span>:
<span>{{ execution.duration }}s</span>
</p>
<p>
<span class="item-label">{% trans 'Accounts amount' %}</span>:
<span>{{ summary.accounts }}</span>
</p>
<p>
<span class="item-label">{% trans 'Ok count' %}</span>:
<span>{{ summary.ok }}</span>
</p>
<p>
<span class="item-label">{% trans 'No password count' %}</span>:
<span>{{ summary.no_secret }}</span>
</p>
<p>
<span class="item-label">{% trans 'Asset success count' %}</span>:
<span>{{ summary.ok_assets | default:0 }}</span>
</p>
<p>
<span class="item-label">{% trans 'Asset failed count' %}</span>:
<span>{{ summary.fail_assets | default:0 }}</span>
</p>
<p>
<span class="item-label">{% trans 'Asset not support count' %}</span>:
<span>{{ summary.error_assets | default:0 }}</span>
</p>
</div>
</div>
<h2>{% trans 'Basic Information' %}</h2>
</div>
<div class="tabel-section tabel-summery-section">
<div class="new-accounts result-section table-responsive">
<div class="section-header">
<h3>
{% trans 'Weak password' %}:
<span>{{ summary.weak_password | default:0 }}</span>
</h3>
</div>
{% if summary.ok_accounts %}
<table class="custom-table table-striped table-hover data-table">
<thead>
<div class="container-section collapsible-content" id="basic-info-content">
<div class="item">
<span class="item-label">{% trans 'Date start' %}</span>
<span class="item-value">{{ execution.date_start | date:"Y/m/d H:i:s" }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Date end' %}</span>
<span class="item-value">{{ execution.date_finished | date:"Y/m/d H:i:s" }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Accounts amount' %}</span>
<span class="item-value">{{ summary.accounts }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Asset success count' %}</span>
<span class="item-value">{{ summary.ok_assets | default:0 }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Asset failed count' %}</span>
<span class="item-value">{{ summary.fail_assets | default:0 }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Asset not support count' %}</span>
<span class="item-value">{{ summary.error_assets | default:0 }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Task name' %}</span>
<span class="item-value">{{ execution.automation.name }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Time using' %}</span>
<span class="item-value">{{ execution.duration }}s</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Ok count' %}</span>
<span class="item-value">{{ summary.ok }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'No password count' %}</span>
<span class="item-value">{{ summary.no_secret }}</span>
</div>
</div>
</section>
<section class="success">
<div class="header-container">
<span
class="triangle-down-icon collapse-toggle"
data-target="success"
></span>
<h2>
{% trans 'Weak password' %}:
<span> {{ summary.weak_password | default:0 }} </span>
</h2>
</div>
<div class="container-section collapsible-content" id="success-content">
{% if summary.ok_accounts %}
<table class="custom-table table-striped table-hover data-table">
<thead>
<tr>
<th>{% trans 'No' %}</th>
<th>{% trans 'Asset' %}</th>
<th>{% trans 'Username' %}</th>
<th>{% trans 'Result' %}</th>
</tr>
</thead>
<tbody>
{% for account in result.weak_password %}
<tr>
<th>{% trans 'No' %}</th>
<th>{% trans 'Asset' %}</th>
<th>{% trans 'Username' %}</th>
<th>{% trans 'Result' %}</th>
<td>{{ forloop.counter }}</td>
<td>{{ account.asset }}</td>
<td>{{ account.username }}</td>
<td style="color: red">{% trans 'Weak password' %}</td>
</tr>
</thead>
<tbody>
{% for account in result.weak_password %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ account.asset }}</td>
<td>{{ account.username }}</td>
<td style="color: red">{% trans 'Weak password' %}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
<p class="no-data">{% trans 'No weak password' %}</p>
{% endif %}
</div>
{% endfor %}
</tbody>
</table>
{% else %}
<p class="no-data">{% trans 'No weak password' %}</p>
{% endif %}
</div>
</main>
</section>
</div>
<style>
{% include './css/report.css' %}
</style>
</style>
<script>
const toggleButtons = document.querySelectorAll('.collapse-toggle')
toggleButtons.forEach((button) => {
button.addEventListener('click', function () {
const targetId = this.getAttribute('data-target')
const targetContent = document.getElementById(`${targetId}-content`)
if (this.classList.contains('triangle-down-icon')) {
this.classList.remove('triangle-down-icon')
this.classList.add('triangle-right-icon')
targetContent.classList.add('collapsed')
} else {
this.classList.remove('triangle-right-icon')
this.classList.add('triangle-down-icon')
targetContent.classList.remove('collapsed')
}
})
})
</script>

View File

@ -11,138 +11,115 @@ p {
.report-container {
display: flex;
flex-direction: column;
row-gap: 16px;
}
.report-container .header {
display: flex;
justify-content: space-between;
align-items: center;
height: 4rem;
padding: 0.3rem 1rem;
background-color: #148f76;
}
.report-container .header svg {
height: 100%
}
.info-section {
display: flex;
justify-content: space-between;
align-items: center;
background-color: #f5f5f5;
height: 4rem;
padding: 0 1rem;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
.info-section .info {
margin: unset;
font-size: 1.6rem;
}
.main-section {
margin-top: 3rem;
padding: 0 1rem;
}
.main-section .synopsis-section {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 2rem;
}
.main-section .synopsis-section .synopsis-item {
.basic-info-section,
.success,
.failed {
display: flex;
flex-direction: column;
flex: 1;
padding: 1rem 2rem;
border: 1px solid #e0e0e0;
border-radius: 8px;
height: 350px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
.main-section .synopsis-section .synopsis-item h3 {
font-weight: 500;
font-size: 1.5rem;
}
.main-section .synopsis-section .synopsis-item .synopsis-item-content {
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: flex-start;
height: 100%;
cursor: pointer;
padding: 16px 20px;
margin: 0 20px;
border: 1px solid #dee0e3;
border-radius: 6px;
background-color: #fff;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
transition: all 0.2s ease;
}
.main-section .synopsis-section .synopsis-item .synopsis-item-content p {
display: inline-flex;
width: 100%;
line-height: 1;
gap: 2rem;
font-size: 14px;
}
.main-section .synopsis-section .synopsis-item .synopsis-item-content p .item-label {
width: 18rem;
}
.main-section .synopsis-section .synopsis-item .synopsis-item-content span {
.header-container {
display: flex;
justify-content: flex-start;
align-items: center;
justify-content: center;
height: 32px;
margin-bottom: 12px;
border-bottom: 1px solid #f0f0f0;
padding-bottom: 8px;
}
.header-container h2 {
color: #1f2329;
font: 500 16px/24px 'PingFang SC';
margin: 0;
display: flex;
align-items: center;
width: 100%;
}
.header-container h2 span {
display: inline-flex;
margin-left: 8px;
font-weight: normal;
}
.main-section .tabel-summery-section {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
align-items: flex-start;
gap: 2rem;
width: inherit;
margin-top: 2rem;
.triangle-right-icon {
display: inline-block;
width: 0;
height: 0;
border-top: 5px solid transparent;
border-bottom: 5px solid transparent;
border-left: 8px solid #1f2329;
margin-right: 10px;
cursor: pointer;
}
.main-section .tabel-summery-section .result-section {
.triangle-down-icon {
display: inline-block;
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 8px solid #1f2329;
margin-right: 10px;
cursor: pointer;
}
.container-section {
display: flex;
flex-wrap: wrap;
width: 100%;
padding: 1rem;
background: #fff;
border: 1px solid #e0e0e0;
border-radius: 8px;
height: 100%;
row-gap: 16px;
column-gap: 10px;
}
.main-section .tabel-execution-section h3 {
font-size: 1.5rem;
color: #2c3e50;
.collapsible-content {
overflow: hidden;
max-height: 1000px;
opacity: 1;
transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out;
}
.section-header {
padding-bottom: 0.5rem;
margin-bottom: 1rem;
font-size: 1.5rem;
}
.section-header h3 {
display: flex;
align-items: center;
gap: 0.5rem;
.collapsible-content.collapsed {
max-height: 0;
opacity: 0;
margin: 0;
color: #2c3e50;
font-size: inherit;
padding: 0;
}
.section-header span {
background: #e8f5e9;
color: #2e7d32;
padding: 0.2rem 0.8rem;
border-radius: 1rem;
font-size: inherit;
.container-section .item {
display: flex;
flex-basis: calc(33.33% - 10px);
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
gap: 4px;
padding: 4px 0;
}
.container-section .item .item-label {
color: #646a73;
font: 400 14px/22px 'PingFang SC';
}
.container-section .item .item-value {
color: #1f2329;
font: 500 14px/22px 'PingFang SC';
}
.custom-table {
margin-bottom: 0;
width: 100%;
@ -151,17 +128,19 @@ p {
}
.custom-table th {
background: #f6f6f6;
color: #495057;
padding: 0.75rem;
font-size: 1.5rem;
border-bottom: 2px solid #e0e0e0;
background-color: #f5f7fa;
color: #646A73;
font: 500 14px/22px 'PingFang SC';
text-align: left;
padding: 12px 8px;
border-bottom: 1px solid #ebeef5;
}
.custom-table td {
padding: 0.75rem;
font-size: 14px;
border-bottom: 1px solid #e0e0e0;
color: #1F2329;
font: 400 14px/22px 'PingFang SC';
padding: 12px 8px;
border-bottom: 1px solid #ebeef5;
}
.custom-table tr:nth-child(even) {
@ -173,13 +152,15 @@ p {
}
.no-data {
color: #909399;
font: 400 14px/22px 'PingFang SC';
text-align: center;
color: #6c757d;
padding: 2rem;
background: #f6f6f6;
border-radius: 8px;
margin: 1rem 0;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
padding: 20px;
font-style: italic;
background-color: #f9f9f9;
border-radius: 4px;
margin: 10px 0;
width: 100%;
}
.new-accounts .section-header span {

View File

@ -1,127 +1,161 @@
{% load i18n %}
{% load static %}
{% load i18n %} {% load static %}
<div class="report-container">
<header class="header">
{% autoescape off %}
{{ logo }}
{% endautoescape %}
</header>
<section class="basic-info-section">
<div class="header-container">
<span
class="triangle-down-icon collapse-toggle"
data-target="basic-info"
></span>
<div class="info-section">
<h2 class="info">
{% trans 'The following is a summary of the account check tasks. Please review and handle them' %}
</h2>
<h2>{% trans 'Basic Information' %}</h2>
</div>
<main class="main-section">
<div class="synopsis-section">
<div class="synopsis-item">
<div class="synopsis-item-content">
<p>
<span class="item-label">{% trans 'Task name' %}</span>:
<span>{{ execution.automation.name }}</span>
</p>
<p>
<span class="item-label">{% trans 'Date start' %}</span>:
<span>{{ execution.date_start | date:"Y/m/d H:i:s" }}</span>
</p>
<p>
<span class="item-label">{% trans 'Date end' %}</span>:
<span>{{ execution.date_finished | date:"Y/m/d H:i:s" }}</span>
</p>
<p>
<span class="item-label">{% trans 'Time using' %}</span>:
<span>{{ execution.duration }}s</span>
</p>
<p>
<span class="item-label">{% trans 'Assets amount' %}</span>:
<span>{{ summary.total_assets }}</span>
</p>
<p>
<span class="item-label">{% trans 'Asset success count' %}</span>:
<span>{{ summary.ok_assets | default:0 }}</span>
</p>
<p>
<span class="item-label">{% trans 'Asset failed count' %}</span>:
<span>{{ summary.fail_assets | default:0 }}</span>
</p>
<p>
<span class="item-label">{% trans 'Asset not support count' %}</span>:
<span>{{ summary.error_assets | default:0 }}</span>
</p>
</div>
</div>
</div>
<div class="container-section collapsible-content" id="basic-info-content">
<div class="item">
<span class="item-label">{% trans 'Date start' %}</span>
<span class="item-value">{{ execution.date_start | date:"Y/m/d H:i:s" }}</span>
</div>
<div class="tabel-section tabel-summery-section">
<div class="new-accounts result-section table-responsive">
<div class="section-header">
<h3>
{% trans 'New found accounts' %}:
<span>{{ summary.new_accounts | default:0 }}</span>
</h3>
</div>
{% if summary.new_accounts %}
<table class="custom-table table-striped table-hover data-table">
<thead>
<tr>
<th>{% trans 'No' %}</th>
<th>{% trans 'Asset' %}</th>
<th>{% trans 'Username' %}</th>
</tr>
</thead>
<tbody>
{% for account in result.new_accounts %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ account.asset }}</td>
<td>{{ account.username }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
<p class="no-data">{% trans 'No new accounts found' %}</p>
{% endif %}
</div>
<div class="item">
<span class="item-label">{% trans 'Date end' %}</span>
<span class="item-value">{{ execution.date_finished | date:"Y/m/d H:i:s" }}</span>
</div>
<div class="lost-accounts result-section table-responsive">
<div class="section-header">
<h3>
{% trans 'Lost accounts' %}:
<span>{{ summary.lost_accounts | default:0 }}</span>
</h3>
</div>
<div class="item">
<span class="item-label">{% trans 'Assets amount' %}</span>
<span class="item-value">{{ summary.total_assets }}</span>
</div>
{% if summary.lost_accounts %}
<table class="custom-table table-hover data-table">
<thead>
<tr>
<th>{% trans 'No' %}</th>
<th>{% trans 'Asset' %}</th>
<th>{% trans 'Username' %}</th>
</tr>
</thead>
<tbody>
{% for account in result.lost_accounts %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ account.asset }}</td>
<td>{{ account.username }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
<p class="no-data">{% trans 'No new accounts found' %}</p>
{% endif %}
</div>
</div>
</main>
<div class="item">
<span class="item-label">{% trans 'Asset success count' %}</span>
<span class="item-value">{{ summary.ok_assets | default:0 }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Asset failed count' %}</span>
<span class="item-value">{{ summary.fail_assets | default:0 }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Asset not support count' %}</span>
<span class="item-value">{{ summary.error_assets | default:0 }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Task name' %}</span>
<span class="item-value">{{ execution.automation.name }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Time using' %}</span>
<span class="item-value">{{ execution.duration }}s</span>
</div>
</div>
</section>
<section class="success">
<div class="header-container">
<span
class="triangle-down-icon collapse-toggle"
data-target="success"
></span>
<h2>
{% trans 'New found accounts' %}:
<span> {{ summary.new_accounts | default:0 }} </span>
</h2>
</div>
<div class="container-section collapsible-content" id="success-content">
{% if summary.new_accounts %}
<table class="custom-table table-striped table-hover data-table">
<thead>
<tr>
<th width="10%">No.</th>
<th width="45%">{% trans 'Asset' %}</th>
<th width="45%">{% trans 'Username' %}</th>
</tr>
</thead>
<tbody>
{% for account in result.new_accounts %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ account.asset }}</td>
<td>{{ account.username }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
<p class="no-data">{% trans 'No new accounts found' %}</p>
{% endif %}
</div>
</section>
<section class="failed">
<div class="header-container">
<span
class="triangle-down-icon collapse-toggle"
data-target="failed"
></span>
<h2>
{% trans 'Lost accounts' %}:
<span> {{ summary.lost_accounts | default:0 }} </span>
</h2>
</div>
<div class="container-section collapsible-content" id="failed-content">
{% if summary.lost_accounts %}
<table class="custom-table table-hover data-table">
<thead>
<tr>
<th width="10%">No.</th>
<th width="45%">{% trans 'Asset' %}</th>
<th width="45%">{% trans 'Username' %}</th>
</tr>
</thead>
<tbody>
{% for account in result.lost_accounts %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ account.asset }}</td>
<td>{{ account.username }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
<p class="no-data">{% trans 'No new accounts found' %}</p>
{% endif %}
</div>
</section>
</div>
<style>
{% include './css/report.css' %}
{% include './css/report.css' %}
</style>
<script>
const toggleButtons = document.querySelectorAll('.collapse-toggle')
toggleButtons.forEach((button) => {
button.addEventListener('click', function () {
const targetId = this.getAttribute('data-target')
const targetContent = document.getElementById(`${targetId}-content`)
if (this.classList.contains('triangle-down-icon')) {
this.classList.remove('triangle-down-icon')
this.classList.add('triangle-right-icon')
targetContent.classList.add('collapsed')
} else {
this.classList.remove('triangle-right-icon')
this.classList.add('triangle-down-icon')
targetContent.classList.remove('collapsed')
}
})
})
</script>

View File

@ -4,125 +4,161 @@
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
<div class="report-container">
<header class="header">
{% autoescape off %}
{{ logo }}
{% endautoescape %}
</header>
<section class="basic-info-section">
<div class="header-container">
<span
class="triangle-down-icon collapse-toggle"
data-target="basic-info"
></span>
<h2>{% trans 'Basic Information' %}</h2>
</div>
<div class="container-section collapsible-content" id="basic-info-content">
<div class="item">
<span class="item-label">{% trans 'Date start' %}</span>
<span class="item-value">{{ execution.date_start | date:"Y/m/d H:i:s" }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Date end' %}</span>
<span class="item-value">{{ execution.date_finished | date:"Y/m/d H:i:s" }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Assets amount' %}</span>
<span class="item-value">{{ summary.total_assets }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Asset success count' %}</span>
<span class="item-value">{{ summary.ok_assets | default:0 }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Asset failed count' %}</span>
<span class="item-value">{{ summary.fail_assets | default:0 }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Asset not support count' %}</span>
<span class="item-value">{{ summary.error_assets | default:0 }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Task name' %}</span>
<span class="item-value">{{ execution.automation.name }}</span>
</div>
<div class="item">
<span class="item-label">{% trans 'Time using' %}</span>
<span class="item-value">{{ execution.duration }}s</span>
</div>
</div>
</section>
<div class="info-section">
<h2 class="info">
{% trans 'The following is a summary of account push tasks, please read and process' %}
</h2>
</div>
<main class="main-section">
<div class="synopsis-section">
<div class="synopsis-item">
<div class="synopsis-item-content">
<p>
<span class="item-label">{% trans 'Task name' %}</span>:
<span>{{ execution.automation.name }}</span>
</p>
<p>
<span class="item-label">{% trans 'Date start' %}</span>:
<span>{{ execution.date_start | date:"Y/m/d H:i:s" }}</span>
</p>
<p>
<span class="item-label">{% trans 'Date end' %}</span>:
<span>{{ execution.date_finished | date:"Y/m/d H:i:s" }}</span>
</p>
<p>
<span class="item-label">{% trans 'Time using' %}</span>:
<span>{{ execution.duration }}s</span>
</p>
<p>
<span class="item-label">{% trans 'Assets amount' %}</span>:
<span>{{ summary.total_assets }}</span>
</p>
<p>
<span class="item-label">{% trans 'Asset success count' %}</span>:
<span>{{ summary.ok_assets | default:0 }}</span>
</p>
<p>
<span class="item-label">{% trans 'Asset failed count' %}</span>:
<span>{{ summary.fail_assets | default:0 }}</span>
</p>
<p>
<span class="item-label">{% trans 'Asset not support count' %}</span>:
<span>{{ summary.error_assets | default:0 }}</span>
</p>
</div>
</div>
<section class="success">
<div class="header-container">
<span
class="triangle-down-icon collapse-toggle"
data-target="success"
></span>
<h2>
{% trans 'Success accounts' %}:
<span> {{ summary.ok_accounts | default:0 }} </span>
</h2>
</div>
<div class="tabel-section tabel-summery-section">
<div class="new-accounts result-section table-responsive">
<div class="section-header">
<h3>
{% trans 'Success accounts' %}:
<span>{{ summary.ok_accounts | default:0 }}</span>
</h3>
</div>
{% if summary.ok_accounts %}
<table class="custom-table table-striped table-hover data-table">
<thead>
<tr>
<th>{% trans 'No' %}</th>
<th>{% trans 'Asset' %}</th>
<th>{% trans 'Username' %}</th>
</tr>
</thead>
<tbody>
{% for account in result.ok_accounts %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ account.asset }}</td>
<td>{{ account.username }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
<p class="no-data">{% trans 'No new accounts found' %}</p>
{% endif %}
</div>
<div class="lost-accounts result-section table-responsive">
<div class="section-header">
<h3>
{% trans 'Failed accounts' %}:
<span>{{ summary.fail_accounts | default:0 }}</span>
</h3>
</div>
{% if summary.fail_accounts %}
<table class="custom-table table-hover data-table">
<thead>
<tr>
<th>{% trans 'No' %}</th>
<th>{% trans 'Asset' %}</th>
<th>{% trans 'Username' %}</th>
</tr>
</thead>
<tbody>
{% for account in result.fail_accounts %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ account.asset }}</td>
<td>{{ account.username }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
<p class="no-data">{% trans 'No new accounts found' %}</p>
{% endif %}
</div>
<div class="container-section collapsible-content" id="success-content">
{% if summary.ok_accounts %}
<table class="custom-table table-striped table-hover data-table">
<thead>
<tr>
<th>{% trans 'No' %}</th>
<th>{% trans 'Asset' %}</th>
<th>{% trans 'Username' %}</th>
</tr>
</thead>
<tbody>
{% for account in result.ok_accounts %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ account.asset }}</td>
<td>{{ account.username }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
<p class="no-data">{% trans 'No new accounts found' %}</p>
{% endif %}
</div>
</main>
</section>
<section class="failed">
<div class="header-container">
<span
class="triangle-down-icon collapse-toggle"
data-target="failed"
></span>
<h2>
{% trans 'Failed accounts' %}:
<span> {{ summary.fail_accounts | default:0 }} </span>
</h2>
</div>
<div class="container-section collapsible-content" id="failed-content">
{% if summary.fail_accounts %}
<table class="custom-table table-hover data-table">
<thead>
<tr>
<th>{% trans 'No' %}</th>
<th>{% trans 'Asset' %}</th>
<th>{% trans 'Username' %}</th>
</tr>
</thead>
<tbody>
{% for account in result.fail_accounts %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ account.asset }}</td>
<td>{{ account.username }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
<p class="no-data">{% trans 'No new accounts found' %}</p>
{% endif %}
</div>
</section>
</div>
<style>
{% include './css/report.css' %}
</style>
<script>
const toggleButtons = document.querySelectorAll('.collapse-toggle')
toggleButtons.forEach((button) => {
button.addEventListener('click', function () {
const targetId = this.getAttribute('data-target')
const targetContent = document.getElementById(`${targetId}-content`)
if (this.classList.contains('triangle-down-icon')) {
this.classList.remove('triangle-down-icon')
this.classList.add('triangle-right-icon')
targetContent.classList.add('collapsed')
} else {
this.classList.remove('triangle-right-icon')
this.classList.add('triangle-down-icon')
targetContent.classList.remove('collapsed')
}
})
})
</script>