mirror of https://github.com/jumpserver/jumpserver
Perf: Perf All Report
parent
a3467bdabc
commit
9466c7105c
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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 {
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
Loading…
Reference in New Issue