700 lines
25 KiB
PHP
700 lines
25 KiB
PHP
<?php include('include/headscript.php'); ?>
|
|
<!doctype html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
<link rel="icon" href="assets/images/favicon-32x32.png" type="image/png" />
|
|
|
|
<?php include('cssinclude.php'); ?>
|
|
|
|
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
|
|
<link href="assets/plugins/datatable/css/dataTables.bootstrap5.min.css" rel="stylesheet" />
|
|
|
|
<title>TRF-Project - Customer Reports</title>
|
|
|
|
<style>
|
|
.lookup-wrapper {
|
|
width: 100%;
|
|
max-width: none;
|
|
margin: 0;
|
|
}
|
|
|
|
.lookup-title {
|
|
font-size: 18px;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.lookup-subtitle {
|
|
font-size: 13px;
|
|
color: #6c757d;
|
|
}
|
|
|
|
.compact-card .card-body {
|
|
padding: 1rem;
|
|
}
|
|
|
|
.table-report th {
|
|
font-size: 12px;
|
|
text-transform: uppercase;
|
|
color: #6c757d;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.table-report td {
|
|
font-size: 13px;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.status-pill {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 6px;
|
|
padding: 5px 10px;
|
|
border-radius: 999px;
|
|
font-size: 12px;
|
|
font-weight: 700;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.status-pill-success {
|
|
background: #e8fff1;
|
|
color: #198754;
|
|
}
|
|
|
|
.status-pill-warning {
|
|
background: #fff3cd;
|
|
color: #b58100;
|
|
}
|
|
|
|
.pdf-icon-link {
|
|
width: 36px;
|
|
height: 36px;
|
|
border-radius: 10px;
|
|
background: #dc3545;
|
|
color: #fff;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 20px;
|
|
text-decoration: none;
|
|
transition: all 0.15s ease-in-out;
|
|
}
|
|
|
|
.pdf-icon-link:hover {
|
|
color: #fff;
|
|
opacity: 0.85;
|
|
transform: translateY(-1px);
|
|
}
|
|
|
|
.no-pdf {
|
|
font-size: 12px;
|
|
color: #adb5bd;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.empty-state {
|
|
border: 1px dashed #ced4da;
|
|
border-radius: 10px;
|
|
padding: 24px;
|
|
text-align: center;
|
|
color: #6c757d;
|
|
background: #fafafa;
|
|
}
|
|
|
|
.spinner-inline {
|
|
display: none;
|
|
margin-left: 8px;
|
|
}
|
|
|
|
.customer-box {
|
|
display: none;
|
|
border: 1px solid #e9ecef;
|
|
background: #fff;
|
|
border-radius: 10px;
|
|
padding: 12px 14px;
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
.customer-label {
|
|
font-size: 11px;
|
|
text-transform: uppercase;
|
|
color: #6c757d;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.customer-value {
|
|
font-size: 14px;
|
|
color: #212529;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.json-preview {
|
|
display: none;
|
|
background: #111827;
|
|
color: #e5e7eb;
|
|
border-radius: 10px;
|
|
padding: 14px;
|
|
font-size: 12px;
|
|
max-height: 420px;
|
|
overflow: auto;
|
|
white-space: pre-wrap;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.table-responsive {
|
|
border-radius: 10px;
|
|
}
|
|
}
|
|
|
|
.select2-container {
|
|
width: 100% !important;
|
|
}
|
|
|
|
.select2-container--default .select2-selection--single {
|
|
height: 38px;
|
|
border: 1px solid #ced4da;
|
|
border-radius: 6px;
|
|
}
|
|
|
|
.select2-container--default .select2-selection--single .select2-selection__rendered {
|
|
line-height: 36px;
|
|
font-size: 14px;
|
|
color: #212529;
|
|
}
|
|
|
|
.select2-container--default .select2-selection--single .select2-selection__arrow {
|
|
height: 36px;
|
|
}
|
|
|
|
.select2-dropdown {
|
|
z-index: 9999;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="wrapper">
|
|
|
|
<?php include('include/navbar.php'); ?>
|
|
|
|
<?php include('include/topbar.php'); ?>
|
|
|
|
<div class="page-wrapper">
|
|
<div class="page-content">
|
|
|
|
<?php include('top_stat_widget.php'); ?>
|
|
|
|
<div class="lookup-wrapper">
|
|
|
|
<div class="card radius-10 compact-card">
|
|
<div class="card-header">
|
|
<div class="d-flex align-items-center justify-content-between flex-wrap gap-2">
|
|
<div>
|
|
<div class="lookup-title">Customer Test Reports</div>
|
|
<div class="lookup-subtitle">
|
|
Select a VisualLims customer and retrieve the latest reports with PDF links.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card-body">
|
|
<form id="customerReportsForm" class="row g-3 align-items-end">
|
|
|
|
<div class="col-md-5">
|
|
<label for="idCliente" class="form-label fw-semibold">Customer</label>
|
|
<select id="idCliente" name="idCliente" class="form-select">
|
|
<option value="">Loading customers...</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="col-md-2">
|
|
<label for="limitReports" class="form-label fw-semibold">Limit</label>
|
|
<select id="limitReports" name="limitReports" class="form-select">
|
|
<option value="1">Last 1</option>
|
|
<option value="3" selected>Last 3</option>
|
|
<option value="5">Last 5</option>
|
|
<option value="10">Last 10</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="col-md-2">
|
|
<label for="signedStatus" class="form-label fw-semibold">Status</label>
|
|
<select id="signedStatus" name="signedStatus" class="form-select">
|
|
<option value="all" selected>All</option>
|
|
<option value="signed">Signed</option>
|
|
<option value="not_signed">Not signed</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="col-md-3">
|
|
<button type="submit" id="btnSearchReports" class="btn btn-primary w-100">
|
|
<i class="bx bx-search"></i> Search Reports
|
|
<span class="spinner-border spinner-border-sm spinner-inline" id="searchSpinner" role="status" aria-hidden="true"></span>
|
|
</button>
|
|
</div>
|
|
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="customerBox" class="customer-box">
|
|
<div class="row g-3">
|
|
<div class="col-md-4">
|
|
<div class="customer-label">Customer Code</div>
|
|
<div class="customer-value" id="selectedCustomerCode">-</div>
|
|
</div>
|
|
|
|
<div class="col-md-8">
|
|
<div class="customer-label">Customer Name</div>
|
|
<div class="customer-value" id="selectedCustomerName">-</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="resultContainer" style="display:none;">
|
|
|
|
<div class="card radius-10 compact-card">
|
|
<div class="card-header">
|
|
<div class="d-flex align-items-center justify-content-between flex-wrap gap-2">
|
|
<h6 class="mb-0">
|
|
Reports
|
|
<span class="badge bg-light text-dark ms-1" id="reportCountBadge">0</span>
|
|
</h6>
|
|
|
|
<button type="button" id="toggleJsonBtn" class="btn btn-sm btn-outline-secondary">
|
|
<i class="bx bx-code-alt"></i> Show JSON
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card-body">
|
|
|
|
<div class="table-responsive">
|
|
<table class="table table-striped table-hover table-report align-middle mb-0" id="reportsTable">
|
|
<thead>
|
|
<tr>
|
|
<th>Report Number</th>
|
|
<th>Report ID</th>
|
|
<th>Report Date</th>
|
|
<th>Print Date</th>
|
|
<th>Version</th>
|
|
<th>Status</th>
|
|
<th class="text-center">PDF</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="reportsTableBody"></tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<pre id="jsonPreview" class="json-preview mt-3"></pre>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id="emptyState" class="empty-state">
|
|
<i class="bx bx-file-find" style="font-size:34px;"></i>
|
|
<div class="mt-2 fw-semibold">No reports loaded</div>
|
|
<div class="small">Select a customer, choose the limit and click Search Reports.</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="overlay toggle-icon"></div>
|
|
|
|
<a href="javaScript:;" class="back-to-top">
|
|
<i class='bx bxs-up-arrow-alt'></i>
|
|
</a>
|
|
|
|
<?php include('include/footer.php'); ?>
|
|
|
|
</div>
|
|
|
|
<?php include('jsinclude.php'); ?>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
|
|
|
|
<script src="assets/plugins/datatable/js/jquery.dataTables.min.js"></script>
|
|
<script src="assets/plugins/datatable/js/dataTables.bootstrap5.min.js"></script>
|
|
|
|
<script>
|
|
$(document).ready(function() {
|
|
|
|
let lastJsonResponse = null;
|
|
let loadedCustomers = [];
|
|
let reportsDataTable = null;
|
|
|
|
function escapeHtml(value) {
|
|
if (value === null || value === undefined) {
|
|
return '';
|
|
}
|
|
|
|
return String(value)
|
|
.replace(/&/g, '&')
|
|
.replace(/</g, '<')
|
|
.replace(/>/g, '>')
|
|
.replace(/"/g, '"')
|
|
.replace(/'/g, ''');
|
|
}
|
|
|
|
function formatDate(value) {
|
|
if (!value) {
|
|
return '-';
|
|
}
|
|
|
|
const date = new Date(value);
|
|
|
|
if (isNaN(date.getTime())) {
|
|
return value;
|
|
}
|
|
|
|
return date.toLocaleString('it-IT', {
|
|
year: 'numeric',
|
|
month: '2-digit',
|
|
day: '2-digit',
|
|
hour: '2-digit',
|
|
minute: '2-digit'
|
|
});
|
|
}
|
|
|
|
function setLoading(isLoading) {
|
|
$('#btnSearchReports').prop('disabled', isLoading);
|
|
$('#searchSpinner').toggle(isLoading);
|
|
}
|
|
|
|
function resetResults() {
|
|
lastJsonResponse = null;
|
|
|
|
if (reportsDataTable !== null) {
|
|
reportsDataTable.destroy();
|
|
reportsDataTable = null;
|
|
}
|
|
|
|
$('#resultContainer').hide();
|
|
$('#emptyState').show();
|
|
$('#reportsTableBody').html('');
|
|
$('#reportCountBadge').text('0');
|
|
$('#jsonPreview').hide().text('');
|
|
$('#toggleJsonBtn').html('<i class="bx bx-code-alt"></i> Show JSON');
|
|
}
|
|
|
|
function loadCustomers() {
|
|
$.ajax({
|
|
url: 'get_clienti.php',
|
|
method: 'GET',
|
|
dataType: 'json',
|
|
success: function(response) {
|
|
const select = $('#idCliente');
|
|
select.empty();
|
|
|
|
const customers = response.value || response || [];
|
|
loadedCustomers = Array.isArray(customers) ? customers : [];
|
|
|
|
select.append('<option value="">Select customer...</option>');
|
|
|
|
loadedCustomers.forEach(function(customer) {
|
|
const idCliente = customer.IdCliente || '';
|
|
const codiceCliente = customer.CodiceCliente || '';
|
|
const nominativo = customer.Nominativo || '';
|
|
|
|
const label = codiceCliente ?
|
|
codiceCliente + ' - ' + nominativo :
|
|
nominativo;
|
|
|
|
select.append(
|
|
'<option value="' + escapeHtml(idCliente) + '" ' +
|
|
'data-code="' + escapeHtml(codiceCliente) + '" ' +
|
|
'data-name="' + escapeHtml(nominativo) + '">' +
|
|
escapeHtml(label) +
|
|
'</option>'
|
|
);
|
|
});
|
|
|
|
if ($.fn.select2) {
|
|
select.select2({
|
|
width: '100%',
|
|
placeholder: 'Search customer...',
|
|
allowClear: true,
|
|
minimumInputLength: 0,
|
|
matcher: function(params, data) {
|
|
if ($.trim(params.term) === '') {
|
|
return data;
|
|
}
|
|
|
|
if (typeof data.text === 'undefined') {
|
|
return null;
|
|
}
|
|
|
|
const term = params.term.toLowerCase();
|
|
const text = data.text.toLowerCase();
|
|
|
|
if (text.indexOf(term) > -1) {
|
|
return data;
|
|
}
|
|
|
|
return null;
|
|
},
|
|
sorter: function(data) {
|
|
const term = $('.select2-search__field').val();
|
|
|
|
if (!term) {
|
|
return data;
|
|
}
|
|
|
|
const search = term.toLowerCase();
|
|
|
|
return data.sort(function(a, b) {
|
|
const aText = (a.text || '').toLowerCase();
|
|
const bText = (b.text || '').toLowerCase();
|
|
|
|
const aStarts = aText.startsWith(search);
|
|
const bStarts = bText.startsWith(search);
|
|
|
|
if (aStarts && !bStarts) return -1;
|
|
if (!aStarts && bStarts) return 1;
|
|
|
|
return aText.localeCompare(bText);
|
|
});
|
|
}
|
|
});
|
|
}
|
|
},
|
|
error: function(xhr) {
|
|
$('#idCliente').html('<option value="">Error loading customers</option>');
|
|
|
|
let message = 'Unable to load customers.';
|
|
|
|
if (xhr.responseJSON && xhr.responseJSON.error) {
|
|
message = xhr.responseJSON.error;
|
|
}
|
|
|
|
Swal.fire({
|
|
title: 'Customer loading error',
|
|
text: message,
|
|
icon: 'error',
|
|
confirmButtonText: 'OK'
|
|
});
|
|
}
|
|
});
|
|
}
|
|
|
|
function updateSelectedCustomerBox() {
|
|
const selectedOption = $('#idCliente option:selected');
|
|
|
|
const customerCode = selectedOption.data('code') || '-';
|
|
const customerName = selectedOption.data('name') || '-';
|
|
|
|
if (!$('#idCliente').val()) {
|
|
$('#customerBox').hide();
|
|
$('#selectedCustomerCode').text('-');
|
|
$('#selectedCustomerName').text('-');
|
|
return;
|
|
}
|
|
|
|
$('#selectedCustomerCode').text(customerCode);
|
|
$('#selectedCustomerName').text(customerName);
|
|
$('#customerBox').show();
|
|
}
|
|
|
|
function renderStatus(isSigned) {
|
|
if (isSigned === true) {
|
|
return '<span class="status-pill status-pill-success"><i class="bx bx-check-circle"></i> Signed</span>';
|
|
}
|
|
|
|
if (isSigned === false) {
|
|
return '<span class="status-pill status-pill-warning"><i class="bx bx-time"></i> Not signed</span>';
|
|
}
|
|
|
|
return '-';
|
|
}
|
|
|
|
function renderPdfCell(pdfFiles) {
|
|
if (!Array.isArray(pdfFiles) || pdfFiles.length === 0) {
|
|
return '<span class="no-pdf">No PDF</span>';
|
|
}
|
|
|
|
const firstPdf = pdfFiles[0];
|
|
|
|
if (!firstPdf.download_url) {
|
|
return '<span class="no-pdf">No PDF</span>';
|
|
}
|
|
|
|
return `
|
|
<a href="${escapeHtml(firstPdf.download_url)}"
|
|
target="_blank"
|
|
class="pdf-icon-link"
|
|
title="${escapeHtml(firstPdf.file_name || 'Download PDF')}">
|
|
<i class="bx bxs-file-pdf"></i>
|
|
</a>
|
|
`;
|
|
}
|
|
|
|
function initReportsDataTable() {
|
|
if (reportsDataTable !== null) {
|
|
reportsDataTable.destroy();
|
|
reportsDataTable = null;
|
|
}
|
|
|
|
reportsDataTable = $('#reportsTable').DataTable({
|
|
paging: false,
|
|
searching: false,
|
|
info: false,
|
|
ordering: true,
|
|
order: [
|
|
[2, 'desc']
|
|
],
|
|
autoWidth: false,
|
|
responsive: true,
|
|
columnDefs: [{
|
|
targets: 6,
|
|
orderable: false
|
|
}],
|
|
language: {
|
|
emptyTable: 'No reports found',
|
|
zeroRecords: 'No matching reports found'
|
|
}
|
|
});
|
|
}
|
|
|
|
function renderReports(response) {
|
|
lastJsonResponse = response;
|
|
|
|
const reports = response.reports || [];
|
|
const tbody = $('#reportsTableBody');
|
|
|
|
tbody.empty();
|
|
|
|
$('#reportCountBadge').text(reports.length);
|
|
|
|
if (reports.length > 0) {
|
|
reports.forEach(function(report) {
|
|
const reportDateOrder = report.data || '';
|
|
const printDateOrder = report.data_stampa || '';
|
|
const statusOrder = report.firmato === true ? 1 : 0;
|
|
|
|
const row = `
|
|
<tr>
|
|
<td>
|
|
<strong>${escapeHtml(report.codice_rapporto || '-')}</strong>
|
|
</td>
|
|
<td>${escapeHtml(report.id_rapporto || '-')}</td>
|
|
<td data-order="${escapeHtml(reportDateOrder)}">${escapeHtml(formatDate(report.data))}</td>
|
|
<td data-order="${escapeHtml(printDateOrder)}">${escapeHtml(formatDate(report.data_stampa))}</td>
|
|
<td>${escapeHtml(report.versione !== null && report.versione !== undefined ? report.versione : '-')}</td>
|
|
<td data-order="${statusOrder}">${renderStatus(report.firmato)}</td>
|
|
<td class="text-center">${renderPdfCell(report.pdf_files)}</td>
|
|
</tr>
|
|
`;
|
|
|
|
tbody.append(row);
|
|
});
|
|
}
|
|
|
|
$('#jsonPreview').text(JSON.stringify(response, null, 4));
|
|
|
|
$('#emptyState').hide();
|
|
$('#resultContainer').show();
|
|
|
|
setTimeout(function() {
|
|
initReportsDataTable();
|
|
}, 50);
|
|
}
|
|
|
|
$('#idCliente').on('change', function() {
|
|
updateSelectedCustomerBox();
|
|
resetResults();
|
|
});
|
|
|
|
$('#customerReportsForm').on('submit', function(event) {
|
|
event.preventDefault();
|
|
|
|
const idCliente = $('#idCliente').val();
|
|
const limit = $('#limitReports').val();
|
|
const signedStatus = $('#signedStatus').val();
|
|
|
|
if (!idCliente) {
|
|
Swal.fire({
|
|
title: 'Missing customer',
|
|
text: 'Please select a customer.',
|
|
icon: 'warning',
|
|
confirmButtonText: 'OK'
|
|
});
|
|
return;
|
|
}
|
|
|
|
resetResults();
|
|
updateSelectedCustomerBox();
|
|
setLoading(true);
|
|
|
|
$.ajax({
|
|
url: 'get_rapporti_cliente.php',
|
|
method: 'GET',
|
|
dataType: 'json',
|
|
data: {
|
|
id_cliente: idCliente,
|
|
limit: limit,
|
|
signed_status: signedStatus
|
|
},
|
|
success: function(response) {
|
|
if (!response || response.success !== true) {
|
|
Swal.fire({
|
|
title: 'No data',
|
|
text: response && response.error ? response.error : 'No reports were returned.',
|
|
icon: 'warning',
|
|
confirmButtonText: 'OK'
|
|
});
|
|
return;
|
|
}
|
|
|
|
renderReports(response);
|
|
},
|
|
error: function(xhr) {
|
|
let message = 'Unexpected error while loading reports.';
|
|
|
|
if (xhr.responseJSON && xhr.responseJSON.error) {
|
|
message = xhr.responseJSON.error;
|
|
} else if (xhr.responseText) {
|
|
message = xhr.responseText.substring(0, 500);
|
|
}
|
|
|
|
Swal.fire({
|
|
title: 'Error',
|
|
text: message,
|
|
icon: 'error',
|
|
confirmButtonText: 'OK'
|
|
});
|
|
},
|
|
complete: function() {
|
|
setLoading(false);
|
|
}
|
|
});
|
|
});
|
|
|
|
$('#toggleJsonBtn').on('click', function() {
|
|
const jsonPreview = $('#jsonPreview');
|
|
const isVisible = jsonPreview.is(':visible');
|
|
|
|
jsonPreview.toggle(!isVisible);
|
|
|
|
if (isVisible) {
|
|
$(this).html('<i class="bx bx-code-alt"></i> Show JSON');
|
|
} else {
|
|
$(this).html('<i class="bx bx-hide"></i> Hide JSON');
|
|
}
|
|
});
|
|
|
|
loadCustomers();
|
|
});
|
|
</script>
|
|
|
|
</body>
|
|
|
|
</html>
|