import insert json
This commit is contained in:
@@ -78,6 +78,51 @@
|
||||
color: #198754;
|
||||
}
|
||||
|
||||
.badge-source-pdf {
|
||||
background-color: #fff3cd;
|
||||
color: #b58100;
|
||||
}
|
||||
|
||||
.type-filter-bar {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.type-filter-btn {
|
||||
border: 0;
|
||||
border-radius: 999px;
|
||||
padding: 7px 14px;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
opacity: 0.35;
|
||||
transition: all 0.15s ease-in-out;
|
||||
}
|
||||
|
||||
.type-filter-btn.active {
|
||||
opacity: 1;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
|
||||
}
|
||||
|
||||
.type-filter-btn[data-type="XLS"] {
|
||||
background-color: #0d6efd;
|
||||
}
|
||||
|
||||
.type-filter-btn[data-type="API"] {
|
||||
background-color: #198754;
|
||||
}
|
||||
|
||||
.type-filter-btn[data-type="PDF"] {
|
||||
background-color: #b58100;
|
||||
}
|
||||
|
||||
.type-filter-btn:hover {
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
#xlsTemplatesTable {
|
||||
font-size: 13px;
|
||||
}
|
||||
@@ -136,79 +181,92 @@
|
||||
</div>
|
||||
|
||||
<div class="card-body">
|
||||
|
||||
<div class="type-filter-bar">
|
||||
<span class="text-muted fw-semibold me-1">Filter by type:</span>
|
||||
|
||||
<button type="button" class="type-filter-btn active" data-type="XLS">
|
||||
XLS
|
||||
</button>
|
||||
|
||||
<button type="button" class="type-filter-btn active" data-type="API">
|
||||
JSON/API
|
||||
</button>
|
||||
|
||||
<button type="button" class="type-filter-btn active" data-type="PDF">
|
||||
PDF
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="table-responsive">
|
||||
<table id="xlsTemplatesTable" class="table table-striped table-bordered table-sm w-100">
|
||||
<table id="xlsTemplatesTable" class="table table-striped table-bordered align-middle w-100">
|
||||
<thead>
|
||||
<tr>
|
||||
<th><?= htmlspecialchars($action, ENT_QUOTES, 'UTF-8'); ?></th>
|
||||
<th><?= htmlspecialchars($nametemplate, ENT_QUOTES, 'UTF-8'); ?></th>
|
||||
<th>Actions</th>
|
||||
<th>Template Name</th>
|
||||
<th>Type</th>
|
||||
<th>Row</th>
|
||||
<th>Col</th>
|
||||
<th><?= htmlspecialchars($desctemplate, ENT_QUOTES, 'UTF-8'); ?></th>
|
||||
<th>Description</th>
|
||||
<th>Client</th>
|
||||
<th>Button</th>
|
||||
<th>Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<!-- DataTables will populate this section automatically -->
|
||||
</tbody>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</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>
|
||||
</div>
|
||||
<!--end page wrapper -->
|
||||
<!--end wrapper-->
|
||||
|
||||
<!--start overlay-->
|
||||
<div class="overlay toggle-icon"></div>
|
||||
<!--end overlay-->
|
||||
<?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>
|
||||
|
||||
<!--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-->
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
|
||||
<?php include('include/footer.php'); ?>
|
||||
</div>
|
||||
<!--end wrapper-->
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
|
||||
<?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>
|
||||
if (urlParams.get('cloned') === '1') {
|
||||
Swal.fire({
|
||||
title: "Template cloned",
|
||||
text: "The template was cloned successfully.",
|
||||
icon: "success",
|
||||
confirmButtonText: "OK"
|
||||
});
|
||||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
|
||||
if (urlParams.get('cloned') === '1') {
|
||||
Swal.fire({
|
||||
title: "Template cloned",
|
||||
text: "The template was cloned successfully.",
|
||||
icon: "success",
|
||||
confirmButtonText: "OK"
|
||||
});
|
||||
|
||||
const cleanUrl = window.location.pathname;
|
||||
window.history.replaceState({}, document.title, cleanUrl);
|
||||
}
|
||||
$('#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 `
|
||||
const cleanUrl = window.location.pathname;
|
||||
window.history.replaceState({}, document.title, cleanUrl);
|
||||
}
|
||||
const templatesTable = $('#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>
|
||||
@@ -227,121 +285,169 @@
|
||||
</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>';
|
||||
}
|
||||
},
|
||||
{
|
||||
data: 'name',
|
||||
title: "Template Name",
|
||||
className: "name-cell"
|
||||
},
|
||||
{
|
||||
data: 'source_type',
|
||||
title: "Type",
|
||||
className: "text-center",
|
||||
render: function(data, type, row) {
|
||||
let sourceType = (data || 'XLS').toUpperCase();
|
||||
|
||||
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 `
|
||||
// Treat JSON as API group for dashboard filter
|
||||
if (sourceType === 'JSON') {
|
||||
sourceType = 'API';
|
||||
}
|
||||
|
||||
if (type === 'display') {
|
||||
if (sourceType === 'API') {
|
||||
return '<span class="badge-source badge-source-api">JSON/API</span>';
|
||||
}
|
||||
|
||||
if (sourceType === 'PDF') {
|
||||
return '<span class="badge-source badge-source-pdf">PDF</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' ?>"
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
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' ?>"
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
const activeSourceTypes = {
|
||||
XLS: true,
|
||||
API: true,
|
||||
PDF: true
|
||||
};
|
||||
|
||||
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}`;
|
||||
}
|
||||
});
|
||||
}
|
||||
$.fn.dataTable.ext.search.push(function(settings, data, dataIndex) {
|
||||
if (settings.nTable.id !== 'xlsTemplatesTable') {
|
||||
return true;
|
||||
}
|
||||
|
||||
function confirmClone(id, templateName) {
|
||||
Swal.fire({
|
||||
title: "Clone template?",
|
||||
html: `
|
||||
const api = new $.fn.dataTable.Api(settings);
|
||||
const rowData = api.row(dataIndex).data();
|
||||
|
||||
let sourceType = ((rowData && rowData.source_type) ? rowData.source_type : 'XLS').toUpperCase();
|
||||
|
||||
if (sourceType === 'JSON') {
|
||||
sourceType = 'API';
|
||||
}
|
||||
|
||||
return activeSourceTypes[sourceType] === true;
|
||||
});
|
||||
|
||||
$('.type-filter-btn').on('click', function() {
|
||||
const type = $(this).data('type');
|
||||
|
||||
activeSourceTypes[type] = !activeSourceTypes[type];
|
||||
$(this).toggleClass('active', activeSourceTypes[type]);
|
||||
|
||||
const hasAtLeastOneActive = Object.values(activeSourceTypes).some(Boolean);
|
||||
|
||||
if (!hasAtLeastOneActive) {
|
||||
activeSourceTypes[type] = true;
|
||||
$(this).addClass('active');
|
||||
}
|
||||
|
||||
$('#xlsTemplatesTable').DataTable().draw();
|
||||
});
|
||||
});
|
||||
|
||||
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}`;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function confirmClone(id, templateName) {
|
||||
Swal.fire({
|
||||
title: "Clone template?",
|
||||
html: `
|
||||
<div class="text-start">
|
||||
<p class="mb-2">You are about to clone this template:</p>
|
||||
<strong>${templateName}</strong>
|
||||
@@ -350,45 +456,45 @@
|
||||
</p>
|
||||
</div>
|
||||
`,
|
||||
icon: "question",
|
||||
showCancelButton: true,
|
||||
confirmButtonColor: "#ffc107",
|
||||
cancelButtonColor: "#6c757d",
|
||||
confirmButtonText: "Yes, clone it",
|
||||
cancelButtonText: "Cancel"
|
||||
}).then((result) => {
|
||||
if (result.isConfirmed) {
|
||||
window.location.href = `clone_template.php?id=${id}`;
|
||||
icon: "question",
|
||||
showCancelButton: true,
|
||||
confirmButtonColor: "#ffc107",
|
||||
cancelButtonColor: "#6c757d",
|
||||
confirmButtonText: "Yes, clone it",
|
||||
cancelButtonText: "Cancel"
|
||||
}).then((result) => {
|
||||
if (result.isConfirmed) {
|
||||
window.location.href = `clone_template.php?id=${id}`;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$(document).on("change", ".toggle-status", function() {
|
||||
let templateId = $(this).data("id");
|
||||
let newStatus = $(this).is(":checked") ? "active" : "inactive";
|
||||
$(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>
|
||||
$.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>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user