theloftstore/public/userarea/import_xls.php

260 lines
10 KiB
PHP

<?php
include('include/headscript.php');
$db = DBHandlerSelect::getInstance();
$pdo = $db->getConnection();
// Recupera lista clienti
$clients = $pdo->query("SELECT idclient, client_name FROM clients ORDER BY client_name")->fetchAll(PDO::FETCH_ASSOC);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Import XLS - Cassina Products</title>
<?php include('cssinclude.php'); ?>
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.6/css/dataTables.bootstrap5.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css">
<style>
.select2-container {
width: 100% !important;
}
.table td,
.table th {
vertical-align: middle;
}
</style>
</head>
<body>
<?php include('include/navbar.php'); ?>
<div class="dashboard-main-wrapper">
<?php include('include/topbar.php'); ?>
<div class="dashboard-body">
<div class="card shadow-sm">
<div class="card-body">
<h4 class="mb-4">Import Excel File</h4>
<!-- Upload Form -->
<form id="uploadForm" enctype="multipart/form-data" method="POST">
<div class="row g-3 align-items-end">
<div class="col-md-3">
<label for="xlsFile" class="form-label">Excel file (.xls / .xlsx)</label>
<input type="file" name="xlsFile" id="xlsFile" accept=".xls,.xlsx" class="form-control" required>
</div>
<div class="col-md-2">
<label for="headerRow" class="form-label">Header row</label>
<input type="number" name="headerRow" id="headerRow" value="4" min="1" class="form-control" required>
</div>
<div class="col-md-3">
<label for="idclient" class="form-label">Client</label>
<select name="idclient" id="idclient" class="form-select select2" required>
<option value="">Select client...</option>
<?php foreach ($clients as $cl): ?>
<option value="<?= htmlspecialchars($cl['idclient']) ?>">
<?= htmlspecialchars($cl['client_name']) ?>
</option>
<?php endforeach; ?>
</select>
</div>
<div class="col-md-2">
<button type="submit" class="btn btn-primary w-100">
<i class="fas fa-upload"></i> Upload
</button>
</div>
</div>
</form>
<hr class="my-4">
<!-- Filter + Table Section -->
<div id="tableSection" class="d-none">
<div class="mb-3">
<label class="form-label">Filter by Categories</label>
<select id="categorySelect" class="form-select select2" multiple></select>
</div>
<table id="dataTable" class="table table-striped table-bordered w-100">
<thead></thead>
<tbody></tbody>
</table>
<button id="saveData" class="btn btn-success mt-3">
<i class="fas fa-save"></i> Save to Database
</button>
</div>
</div>
</div>
</div>
<?php include('include/footer.php'); ?>
</div>
<?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 src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<script>
$(document).ready(function() {
$('.select2').select2();
let fullData = [];
let table;
// === Upload Excel ===
$('#uploadForm').on('submit', function(e) {
e.preventDefault();
let formData = new FormData(this);
$.ajax({
url: 'import_xls_process.php',
type: 'POST',
data: formData,
processData: false,
contentType: false,
beforeSend: () => Swal.fire({
title: 'Processing...',
allowOutsideClick: false,
didOpen: () => Swal.showLoading()
}),
success: function(res) {
Swal.close();
let json;
try {
json = JSON.parse(res);
} catch (e) {
Swal.fire('Error', 'Invalid JSON:' + res, 'error');
return;
}
if (json.status === 'ok') {
fullData = json.data;
$('#tableSection').removeClass('d-none');
// Popola Select categorie
$('#categorySelect').empty();
json.categories.forEach(cat => {
$('#categorySelect').append(`<option value="${cat}">${cat}</option>`);
});
// Mostra tabella vuota inizialmente (nessuna categoria selezionata)
renderTable([], json.columns);
Swal.fire('Success', 'File uploaded successfully! Select categories to view data.', 'success');
} else {
Swal.fire('Error', json.message, 'error');
}
},
error: function() {
Swal.fire('Error', 'Upload failed.', 'error');
}
});
});
// === Filtro dinamico categorie ===
$('#categorySelect').on('change', function() {
const selected = $(this).val();
let filtered = [];
if (selected && selected.length) {
filtered = fullData.filter(r => selected.includes(r['category']));
}
renderTable(filtered, fullData.length ? Object.keys(fullData[0]) : []);
});
// === Funzione per DataTable ===
function renderTable(data, columns) {
if ($.fn.DataTable.isDataTable('#dataTable')) {
$('#dataTable').DataTable().destroy();
}
// Aggiungiamo una colonna "Select"
const cols = [{
title: '<input type="checkbox" id="selectAllRows" />',
data: null,
orderable: false,
searchable: false,
className: 'text-center',
render: function() {
return '<input type="checkbox" class="row-select" />';
}
},
...columns.map(c => ({
title: c.replace(/_/g, ' ').toUpperCase(),
data: c
}))
];
table = $('#dataTable').DataTable({
destroy: true,
data: data,
columns: cols,
pageLength: 25,
order: [],
createdRow: function(row, rowData) {
const selectedCats = $('#categorySelect').val() || [];
const cat = (rowData['category'] || '').trim();
if (selectedCats.includes(cat)) {
$(row).find('input.row-select').prop('checked', true);
}
$(row).find('input.row-select').data('row', rowData);
}
});
// --- Gestione "Select All" ---
$('#selectAllRows').off('click').on('click', function() {
const isChecked = this.checked;
$('#dataTable input.row-select').prop('checked', isChecked);
});
}
// === Salvataggio selezione ===
$('#saveData').on('click', function() {
const selectedRows = [];
$('#dataTable input.row-select:checked').each(function() {
const rowData = $(this).data('row');
if (rowData) selectedRows.push(rowData);
});
if (selectedRows.length === 0) {
Swal.fire('Notice', 'No rows selected for import.', 'info');
return;
}
$.ajax({
url: 'import_save.php',
type: 'POST',
data: {
rows: JSON.stringify(selectedRows),
idclient: $('#idclient').val(),
source_file: $('#xlsFile')[0].files[0]?.name || ''
},
success: function(res) {
let json;
try {
json = JSON.parse(res);
} catch (e) {
Swal.fire('Error', res, 'error');
return;
}
if (json.status === 'ok') Swal.fire('Success', 'Rows imported successfully!', 'success');
else Swal.fire('Error', json.message, 'error');
},
error: function() {
Swal.fire('Error', 'Failed to import data.', 'error');
}
});
});
});
</script>
</body>
</html>