better reader for mails
This commit is contained in:
@@ -46,7 +46,7 @@
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for mail in mails %}
|
||||
{% for mail in mails.items %}
|
||||
<tr>
|
||||
<td>{{ mail.created_at.strftime('%Y-%m-%d %H:%M:%S') }}</td>
|
||||
<td>{{ mail.recipient }}</td>
|
||||
@@ -88,116 +88,84 @@
|
||||
|
||||
<!-- Mail Details Modal -->
|
||||
<div class="modal fade" id="mailDetailsModal" tabindex="-1">
|
||||
<div class="modal-dialog modal-lg">
|
||||
<div class="modal-dialog modal-lg modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title">Mail Details</h5>
|
||||
<div class="modal-header" style="background-color: var(--primary-opacity-8);">
|
||||
<h5 class="modal-title">
|
||||
<i class="fas fa-envelope me-2" style="color: var(--primary-color);"></i>Mail Details
|
||||
</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="mb-3">
|
||||
<label class="fw-bold">Subject:</label>
|
||||
<p id="modalSubject"></p>
|
||||
<div class="row g-3">
|
||||
<div class="col-md-6">
|
||||
<div class="card h-100 border-0 shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<i class="fas fa-user-circle me-2" style="color: var(--primary-color);"></i>
|
||||
<h6 class="card-subtitle mb-0" style="color: var(--primary-color); font-weight: 600;">Recipient Information</h6>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="fw-bold" style="color: var(--primary-color);">Recipient:</label>
|
||||
<p id="modalRecipient" class="mb-0"></p>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="fw-bold" style="color: var(--primary-color);">Status:</label>
|
||||
<p id="modalStatus" class="mb-0"></p>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="fw-bold" style="color: var(--primary-color);">Template:</label>
|
||||
<p id="modalTemplate" class="mb-0"></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="card h-100 border-0 shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<i class="fas fa-clock me-2" style="color: var(--primary-color);"></i>
|
||||
<h6 class="card-subtitle mb-0" style="color: var(--primary-color); font-weight: 600;">Timing Information</h6>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="fw-bold" style="color: var(--primary-color);">Created At:</label>
|
||||
<p id="modalCreatedAt" class="mb-0"></p>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="fw-bold" style="color: var(--primary-color);">Sent At:</label>
|
||||
<p id="modalSentAt" class="mb-0"></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="fw-bold">Recipient:</label>
|
||||
<p id="modalRecipient"></p>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="fw-bold">Status:</label>
|
||||
<p id="modalStatus"></p>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="fw-bold">Template:</label>
|
||||
<p id="modalTemplate"></p>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="fw-bold">Created At:</label>
|
||||
<p id="modalCreatedAt"></p>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="fw-bold">Sent At:</label>
|
||||
<p id="modalSentAt"></p>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="fw-bold">Body:</label>
|
||||
<div id="modalBody" class="border p-3 bg-light"></div>
|
||||
<div class="mt-4">
|
||||
<div class="card border-0 shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<i class="fas fa-envelope-open-text me-2" style="color: var(--primary-color);"></i>
|
||||
<h6 class="card-subtitle mb-0" style="color: var(--primary-color); font-weight: 600;">Message Content</h6>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="fw-bold" style="color: var(--primary-color);">Subject:</label>
|
||||
<p id="modalSubject" class="mb-3"></p>
|
||||
</div>
|
||||
<div>
|
||||
<label class="fw-bold" style="color: var(--primary-color);">Body:</label>
|
||||
<div id="modalBody" class="border rounded p-3 mt-2" style="max-height: 300px; overflow-y: auto; background-color: var(--primary-opacity-8);"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer" style="background-color: var(--primary-opacity-8);">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function updateFilters() {
|
||||
const status = document.getElementById('statusFilter').value;
|
||||
const dateRange = document.getElementById('dateRangeFilter').value;
|
||||
const userId = document.getElementById('userFilter').value;
|
||||
|
||||
fetch(`/settings/mails?status=${status}&date_range=${dateRange}&user_id=${userId}`, {
|
||||
headers: {
|
||||
'X-Requested-With': 'XMLHttpRequest'
|
||||
}
|
||||
})
|
||||
.then(response => response.text())
|
||||
.then(html => {
|
||||
const parser = new DOMParser();
|
||||
const doc = parser.parseFromString(html, 'text/html');
|
||||
const newTable = doc.querySelector('.table-responsive');
|
||||
const newPagination = doc.querySelector('.d-flex.justify-content-between.align-items-center.mt-4');
|
||||
|
||||
if (newTable) {
|
||||
document.querySelector('.table-responsive').innerHTML = newTable.innerHTML;
|
||||
}
|
||||
if (newPagination) {
|
||||
const existingPagination = document.querySelector('.d-flex.justify-content-between.align-items-center.mt-4');
|
||||
if (existingPagination) {
|
||||
existingPagination.innerHTML = newPagination.innerHTML;
|
||||
} else {
|
||||
document.querySelector('.card-body').appendChild(newPagination);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function clearFilters() {
|
||||
document.getElementById('statusFilter').value = '';
|
||||
document.getElementById('dateRangeFilter').value = '7d';
|
||||
document.getElementById('userFilter').value = '';
|
||||
updateFilters();
|
||||
}
|
||||
|
||||
function changePage(page) {
|
||||
const status = document.getElementById('statusFilter').value;
|
||||
const dateRange = document.getElementById('dateRangeFilter').value;
|
||||
const userId = document.getElementById('userFilter').value;
|
||||
|
||||
fetch(`/settings/mails?status=${status}&date_range=${dateRange}&user_id=${userId}&page=${page}`, {
|
||||
headers: {
|
||||
'X-Requested-With': 'XMLHttpRequest'
|
||||
}
|
||||
})
|
||||
.then(response => response.text())
|
||||
.then(html => {
|
||||
const parser = new DOMParser();
|
||||
const doc = parser.parseFromString(html, 'text/html');
|
||||
const newTable = doc.querySelector('.table-responsive');
|
||||
const newPagination = doc.querySelector('.d-flex.justify-content-between.align-items-center.mt-4');
|
||||
|
||||
if (newTable) {
|
||||
document.querySelector('.table-responsive').innerHTML = newTable.innerHTML;
|
||||
}
|
||||
if (newPagination) {
|
||||
const existingPagination = document.querySelector('.d-flex.justify-content-between.align-items-center.mt-4');
|
||||
if (existingPagination) {
|
||||
existingPagination.innerHTML = newPagination.innerHTML;
|
||||
} else {
|
||||
document.querySelector('.card-body').appendChild(newPagination);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function viewMailDetails(mailId) {
|
||||
fetch(`/settings/mails/${mailId}`)
|
||||
.then(response => response.json())
|
||||
@@ -225,5 +193,25 @@ function downloadMailLog() {
|
||||
|
||||
window.location.href = `/settings/mails/download?status=${status}&date_range=${dateRange}&user_id=${userId}`;
|
||||
}
|
||||
|
||||
function updateFilters() {
|
||||
const status = document.getElementById('statusFilter').value;
|
||||
const dateRange = document.getElementById('dateRangeFilter').value;
|
||||
const userId = document.getElementById('userFilter').value;
|
||||
|
||||
window.location.href = `/settings/mails?status=${status}&date_range=${dateRange}&user_id=${userId}`;
|
||||
}
|
||||
|
||||
function clearFilters() {
|
||||
window.location.href = '/settings/mails';
|
||||
}
|
||||
|
||||
function changePage(page) {
|
||||
const status = document.getElementById('statusFilter').value;
|
||||
const dateRange = document.getElementById('dateRangeFilter').value;
|
||||
const userId = document.getElementById('userFilter').value;
|
||||
|
||||
window.location.href = `/settings/mails?page=${page}&status=${status}&date_range=${dateRange}&user_id=${userId}`;
|
||||
}
|
||||
</script>
|
||||
{% endmacro %}
|
||||
Reference in New Issue
Block a user