trf_certest/public/userarea/templates_dashboard.php
2026-03-28 10:28:25 +01:00

350 lines
13 KiB
PHP

<?php include('include/headscript.php'); ?>
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--favicon-->
<link rel="icon" href="assets/images/favicon-32x32.png" type="image/png" />
<?php include('cssinclude.php'); ?>
<title>TRF-Project - Template Dashboard</title>
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.6/css/dataTables.bootstrap5.min.css">
<style>
.switch {
position: relative;
display: inline-block;
width: 34px;
height: 20px;
}
.switch input {
opacity: 0;
width: 0;
height: 0;
}
.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
transition: .4s;
border-radius: 34px;
}
.slider:before {
position: absolute;
content: "";
height: 12px;
width: 12px;
left: 4px;
bottom: 4px;
background-color: white;
transition: .4s;
border-radius: 50%;
}
input:checked+.slider {
background-color: #4CAF50;
}
input:checked+.slider:before {
transform: translateX(14px);
}
.badge-source {
font-size: 11px;
padding: 0.30rem 0.55rem;
border-radius: 999px;
font-weight: 600;
display: inline-block;
min-width: 50px;
text-align: center;
line-height: 1.2;
}
.badge-source-xls {
background-color: #e7f1ff;
color: #0d6efd;
}
.badge-source-api {
background-color: #e8fff1;
color: #198754;
}
#xlsTemplatesTable {
font-size: 13px;
}
#xlsTemplatesTable th,
#xlsTemplatesTable td {
vertical-align: middle;
white-space: nowrap;
}
#xlsTemplatesTable td.description-cell,
#xlsTemplatesTable td.client-cell,
#xlsTemplatesTable td.name-cell,
#xlsTemplatesTable td.button-cell {
white-space: normal;
}
.table-actions {
min-width: 120px;
}
.table-actions .btn {
padding: 0.25rem 0.45rem;
}
.compact-card .card-body {
padding: 1rem;
}
</style>
</head>
<body>
<!--wrapper-->
<div class="wrapper">
<!--sidebar wrapper -->
<?php include('include/navbar.php'); ?>
<!--end sidebar wrapper -->
<!--start header -->
<?php include('include/topbar.php'); ?>
<!--end header -->
<!--start page wrapper -->
<div class="page-wrapper">
<div class="page-content">
<?php include('top_stat_widget.php'); ?>
<div class="card radius-10 compact-card">
<div class="card-header">
<div class="d-flex align-items-center justify-content-between">
<h6 class="mb-0">Templates Dashboard</h6>
<a href="insert_template_xls.php" class="btn btn-success ms-auto">
<i class="fas fa-plus"></i> New Template
</a>
</div>
</div>
<div class="card-body">
<div class="table-responsive">
<table id="xlsTemplatesTable" class="table table-striped table-bordered table-sm w-100">
<thead>
<tr>
<th><?= htmlspecialchars($action, ENT_QUOTES, 'UTF-8'); ?></th>
<th><?= htmlspecialchars($nametemplate, ENT_QUOTES, 'UTF-8'); ?></th>
<th>Type</th>
<th>Row</th>
<th>Col</th>
<th><?= htmlspecialchars($desctemplate, ENT_QUOTES, 'UTF-8'); ?></th>
<th>Client</th>
<th>Button</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<!-- DataTables will populate this section automatically -->
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<!--end page wrapper -->
<!--start overlay-->
<div class="overlay toggle-icon"></div>
<!--end overlay-->
<!--Start Back To Top Button-->
<a href="javaScript:;" class="back-to-top"><i class='bx bxs-up-arrow-alt'></i></a>
<!--End Back To Top Button-->
<?php include('include/footer.php'); ?>
</div>
<!--end wrapper-->
<?php include('jsinclude.php'); ?>
<script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.13.6/js/dataTables.bootstrap5.min.js"></script>
<script>
$(document).ready(function() {
$('#xlsTemplatesTable').DataTable({
processing: true,
serverSide: false,
ajax: 'load_templates.php',
pageLength: 50,
autoWidth: false,
columns: [{
data: 'id',
orderable: false,
searchable: false,
title: "Actions",
className: "table-actions text-center",
render: function(data, type, row) {
return `
<div class="d-flex justify-content-center gap-1">
<a href="edit_template_xls.php?id=${data}" class="btn btn-sm btn-primary" title="Edit">
<i class="bx bx-edit-alt"></i>
</a>
<a href="mapping_template_xls_scheme2.php?id=${data}" class="btn btn-sm btn-success" title="Mapping">
<i class="bx bx-link-alt"></i>
</a>
<button class="btn btn-sm btn-danger" onclick="confirmDelete(${data})" title="Delete">
<i class="bx bx-trash"></i>
</button>
</div>
`;
}
},
{
data: 'name',
title: "Template Name",
className: "name-cell"
},
{
data: 'source_type',
title: "Type",
className: "text-center",
render: function(data, type, row) {
const sourceType = (data || 'XLS').toUpperCase();
if (type === 'display') {
if (sourceType === 'API') {
return '<span class="badge-source badge-source-api">API</span>';
}
return '<span class="badge-source badge-source-xls">XLS</span>';
}
return sourceType;
}
},
{
data: 'header_row',
title: "Row",
className: "text-center",
defaultContent: ''
},
{
data: 'start_column',
title: "Col",
className: "text-center",
defaultContent: ''
},
{
data: 'description',
title: "Description",
className: "description-cell",
defaultContent: 'No description'
},
{
data: null,
title: "Client",
className: "client-cell",
render: function(data, type, row) {
const clientName = row.clientname || "No client";
const clientId = row.idclient || "N/A";
return `${clientName} <small class="text-muted">(ID: ${clientId})</small>`;
}
},
{
data: 'button_label',
title: "Button",
className: "button-cell",
defaultContent: 'Click Me'
},
{
data: 'status',
title: "Status",
orderable: false,
searchable: false,
className: "text-center",
render: function(status, type, row) {
let checked = (status === "active") ? "checked" : "";
return `
<label class="switch">
<input type="checkbox" class="toggle-status" data-id="${row.id}" ${checked}>
<span class="slider round"></span>
</label>
`;
}
}
],
dom: '<"card-header border-bottom p-3"<"d-flex align-items-center"<"card-title mb-0 flex-grow-1"f>>>rt<"card-footer border-top p-3"<"d-flex align-items-center"<"me-auto"l><"d-flex gap-2"ip>>>',
lengthMenu: [10, 25, 50, 100],
order: [
[1, 'asc']
],
language: {
search: "Cerca:",
lengthMenu: "Mostra _MENU_ elementi",
info: "Visualizzando da _START_ a _END_ di _TOTAL_ elementi",
paginate: {
first: "<?= isset($langdatatables['paginate_first']) ? $langdatatables['paginate_first'] : 'Primo' ?>",
last: "<?= isset($langdatatables['paginate_last']) ? $langdatatables['paginate_last'] : 'Ultimo' ?>",
next: "<?= isset($langdatatables['paginate_next']) ? $langdatatables['paginate_next'] : 'Successivo' ?>",
previous: "<?= isset($langdatatables['paginate_previous']) ? $langdatatables['paginate_previous'] : 'Precedente' ?>"
}
}
});
});
function confirmDelete(id) {
Swal.fire({
title: "Are you sure?",
text: "This action cannot be undone!",
icon: "warning",
showCancelButton: true,
confirmButtonColor: "#d33",
cancelButtonColor: "#3085d6",
confirmButtonText: "Yes, delete it!",
cancelButtonText: "Cancel"
}).then((result) => {
if (result.isConfirmed) {
window.location.href = `delete_template_xls.php?id=${id}`;
}
});
}
$(document).on("change", ".toggle-status", function() {
let templateId = $(this).data("id");
let newStatus = $(this).is(":checked") ? "active" : "inactive";
$.ajax({
url: "update_template_status.php",
type: "POST",
dataType: "json",
data: {
id: templateId,
status: newStatus
},
success: function(response) {
if (response.success) {
console.log("Status updated successfully.");
} else {
console.error("Error updating status:", response.message);
alert("Error updating status: " + response.message);
}
},
error: function(xhr) {
console.error("AJAX error:", xhr.responseText);
}
});
});
</script>
</body>
</html>