fixed for matrici
This commit is contained in:
parent
07ddcafd3f
commit
a0b12463c0
@ -80,6 +80,7 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
<?php include('cssinclude.php'); ?>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2Lw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr@4.6.13/dist/flatpickr.min.css">
|
||||
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet">
|
||||
<style>
|
||||
.cell-changed {
|
||||
background-color: #fff3b0 !important;
|
||||
@ -725,6 +726,7 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/5.3.1/fabric.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/flatpickr@4.6.13/dist/flatpickr.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
|
||||
<script src="photos.js"></script>
|
||||
<script src="parts.js"></script>
|
||||
<script src="tracking.js"></script>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
<!-- Modal modificato con pulsante per riconoscimento vocale e download -->
|
||||
<!-- Modal modificato con pulsante per riconoscimento vocale, download e selezione matrici -->
|
||||
<div class="modal fade" id="partsModal" tabindex="-1" aria-labelledby="partsModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-xl" style="max-width: 80% !important; width: 80% !important;">
|
||||
<div class="modal-content">
|
||||
@ -9,10 +9,12 @@
|
||||
<div class="modal-body">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;">
|
||||
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; min-width: 0;">
|
||||
<h6 style="margin: 0; white-space: nowrap;">Elenco Parti</h6>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<input type="checkbox" id="showMixParts" name="showMixParts" style="margin-right: 5px;">
|
||||
<div style="display: flex; align-items: center; min-width: 0;">
|
||||
<select id="global-matrice" class="ms-2" style="width: 250px !important; min-width: 250px !important;">
|
||||
</select>
|
||||
<input type="checkbox" id="showMixParts" name="showMixParts" style="margin-right: 5px; margin-left: 10px;">
|
||||
<label for="showMixParts" style="font-size: 0.9rem; margin-right: 10px;">Mix</label>
|
||||
<button type="button" class="btn btn-info btn-sm" id="renumberPartsBtn" style="padding: 0.1rem 0.5rem; font-size: 0.8rem;">Rinumera Parti</button>
|
||||
<button type="button" class="btn btn-secondary btn-sm ms-2" id="toggleVoiceBtn" style="padding: 0.1rem 0.5rem; font-size: 0.8rem;"><i class="fas fa-microphone"></i> Voce</button>
|
||||
@ -45,13 +47,14 @@
|
||||
<div class="col-md-6">
|
||||
<h6>Foto del Campione</h6>
|
||||
<div style="display: flex; align-items: center; margin-bottom: 10px;">
|
||||
<button type="button" class="btn btn-primary btn-sm" id="downloadPhotoBtn" style="padding: 0.1rem 0.5rem; font-size: 0.8rem; margin-right: 10px;"><i class="fas fa-download"></i> </button>
|
||||
<button type="button" class="btn btn-primary btn-sm" id="downloadPhotoBtn" style="padding: 0.1rem 0.5rem; font-size: 0.8rem; margin-right: 10px;"><i class="fas fa-download"></i></button>
|
||||
<div id="photoSelectorContainer" style="display: none;"></div>
|
||||
</div>
|
||||
<div style="position: relative; width: 100%; min-height: 400px;">
|
||||
<img id="samplePhoto" src="" alt="Foto del campione" style="max-width: 100%; max-height: 100%; object-fit: contain; position: absolute; top: 0; left: 0;">
|
||||
<canvas id="photoCanvas" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"></canvas>
|
||||
<canvas id="overlayCanvas" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000;"></canvas> <!-- Nuovo canvas per Fabric.js -->
|
||||
<canvas id="overlayCanvas" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000;"></canvas>
|
||||
<div id="descriptionList" class="draggable-description" style="display: none;"></div>
|
||||
<div id="markerContainer"></div>
|
||||
</div>
|
||||
</div>
|
||||
@ -249,4 +252,59 @@
|
||||
border: 2px solid #000;
|
||||
margin: 2px;
|
||||
}
|
||||
|
||||
/* Stili per Select2 in #partsList e #global-matrice */
|
||||
#partsList .select2-container,
|
||||
.select2-container--default #global-matrice {
|
||||
width: 250px !important;
|
||||
min-width: 250px !important;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
#partsList .select2-selection--single,
|
||||
.select2-container--default #global-matrice .select2-selection--single {
|
||||
height: 26px !important;
|
||||
padding: 0.2rem 0.5rem !important;
|
||||
font-size: 0.9rem !important;
|
||||
border: 1px solid #ced4da !important;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
|
||||
#partsList .select2-selection__rendered,
|
||||
.select2-container--default #global-matrice .select2-selection__rendered {
|
||||
line-height: 24px !important;
|
||||
overflow: hidden !important;
|
||||
text-overflow: ellipsis !important;
|
||||
white-space: nowrap !important;
|
||||
}
|
||||
|
||||
#partsList .select2-selection__arrow,
|
||||
.select2-container--default #global-matrice .select2-selection__arrow {
|
||||
height: 26px !important;
|
||||
}
|
||||
|
||||
#partsList .save-status,
|
||||
#partsList .save-loading {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.select2-container--open .select2-dropdown {
|
||||
z-index: 1051 !important;
|
||||
border: 1px solid #aaa !important;
|
||||
border-radius: 4px !important;
|
||||
background: white !important;
|
||||
overflow-y: auto !important;
|
||||
max-height: 200px !important;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-search--dropdown .select2-search__field {
|
||||
width: 100% !important;
|
||||
padding: 0.2rem !important;
|
||||
}
|
||||
|
||||
.select2-container--default .part-matrice,
|
||||
.select2-container--default #global-matrice {
|
||||
width: 250px !important;
|
||||
min-width: 250px !important;
|
||||
}
|
||||
</style>
|
||||
@ -12,11 +12,13 @@ $(document).ready(function () {
|
||||
|
||||
let photoAnnotations = {};
|
||||
let partColors = {};
|
||||
let partMatrice = {};
|
||||
let selectedPartNumber = null;
|
||||
let unsavedChanges = false;
|
||||
let fabricCanvas = null;
|
||||
let descriptionTextbox = null;
|
||||
let markerObjects = {};
|
||||
let matrici = [];
|
||||
|
||||
// ===================
|
||||
// VOICE RECOGNITION SETUP
|
||||
@ -137,8 +139,35 @@ $(document).ready(function () {
|
||||
.data("iddatadb", iddatadb)
|
||||
.data("idquotations", idquotations);
|
||||
|
||||
loadPhoto(iddatadb, idquotations);
|
||||
loadExistingParts(iddatadb, idquotations);
|
||||
// Precarica le matrici se iddatadb (assumendo matrici solo per iddatadb)
|
||||
if (iddatadb) {
|
||||
if (matrici.length === 0) {
|
||||
$.ajax({
|
||||
url: "get_matrice.php",
|
||||
method: "GET",
|
||||
dataType: "json",
|
||||
success: function (data) {
|
||||
matrici = data.value || [];
|
||||
initializeGlobalSelect2();
|
||||
loadPhoto(iddatadb, idquotations);
|
||||
loadExistingParts(iddatadb, idquotations);
|
||||
},
|
||||
error: function (xhr, status, error) {
|
||||
matrici = [];
|
||||
initializeGlobalSelect2();
|
||||
loadPhoto(iddatadb, idquotations);
|
||||
loadExistingParts(iddatadb, idquotations);
|
||||
},
|
||||
});
|
||||
} else {
|
||||
initializeGlobalSelect2();
|
||||
loadPhoto(iddatadb, idquotations);
|
||||
loadExistingParts(iddatadb, idquotations);
|
||||
}
|
||||
} else {
|
||||
loadPhoto(iddatadb, idquotations);
|
||||
loadExistingParts(iddatadb, idquotations);
|
||||
}
|
||||
|
||||
const modal = new bootstrap.Modal(
|
||||
document.getElementById("partsModal"),
|
||||
@ -175,6 +204,7 @@ $(document).ready(function () {
|
||||
};
|
||||
photoAnnotations = {};
|
||||
partColors = {};
|
||||
partMatrice = {};
|
||||
selectedPartNumber = null;
|
||||
unsavedChanges = false;
|
||||
if (fabricCanvas) {
|
||||
@ -184,10 +214,12 @@ $(document).ready(function () {
|
||||
}
|
||||
descriptionTextbox = null;
|
||||
markerObjects = {};
|
||||
matrici = [];
|
||||
// Clear UI elements
|
||||
$("#photoSelectorContainer").empty().hide();
|
||||
$("#samplePhoto").attr("src", "");
|
||||
$("#partsTableBody").empty();
|
||||
$("#global-matrice").empty(); // Pulisci select globale se presente
|
||||
// Remove any temporary messages
|
||||
$(".temp-alert").remove();
|
||||
});
|
||||
@ -535,6 +567,7 @@ $(document).ready(function () {
|
||||
if (response.success) {
|
||||
$row.remove();
|
||||
delete partColors[partNumber];
|
||||
delete partMatrice[partNumber];
|
||||
if (markerObjects[partNumber]) {
|
||||
fabricCanvas.remove(markerObjects[partNumber]);
|
||||
delete markerObjects[partNumber];
|
||||
@ -576,6 +609,7 @@ $(document).ready(function () {
|
||||
} else {
|
||||
$row.remove();
|
||||
delete partColors[partNumber];
|
||||
delete partMatrice[partNumber];
|
||||
if (markerObjects[partNumber]) {
|
||||
fabricCanvas.remove(markerObjects[partNumber]);
|
||||
delete markerObjects[partNumber];
|
||||
@ -717,6 +751,9 @@ $(document).ready(function () {
|
||||
</tr>`;
|
||||
$("#partsTableBody").append(newRow);
|
||||
partColors[part.part_number] = defaultColor;
|
||||
if (part.idmatrice) {
|
||||
partMatrice[part.part_number] = part.idmatrice;
|
||||
}
|
||||
});
|
||||
} else {
|
||||
addNewRow(1);
|
||||
@ -743,6 +780,163 @@ $(document).ready(function () {
|
||||
});
|
||||
}
|
||||
|
||||
// Funzione per inizializzare Select2 sulle tendine delle matrici
|
||||
function initializeSelect2($select, partNumber, partId, idmatrice) {
|
||||
if (typeof $.fn.select2 === "undefined") {
|
||||
$select.replaceWith(
|
||||
'<input type="text" class="form-control form-control-sm" placeholder="Select2 non disponibile" disabled>',
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
const options = matrici.map(function (matrice) {
|
||||
return {
|
||||
id: matrice.IdMatrice,
|
||||
text: matrice.NomeMatriceTraduzione,
|
||||
};
|
||||
});
|
||||
|
||||
$select.select2({
|
||||
placeholder: "Seleziona matrice",
|
||||
allowClear: true,
|
||||
data: options,
|
||||
dropdownParent: $("#partsModal"),
|
||||
matcher: function (params, data) {
|
||||
if (!params.term || params.term.length < 3) {
|
||||
return data;
|
||||
}
|
||||
const term = params.term.toUpperCase();
|
||||
if (data.text.toUpperCase().indexOf(term) >= 0) {
|
||||
return data;
|
||||
}
|
||||
return null;
|
||||
},
|
||||
});
|
||||
|
||||
if (partId && partId !== "new" && idmatrice) {
|
||||
const matrice = matrici.find((m) => m.IdMatrice == idmatrice);
|
||||
if (matrice) {
|
||||
const option = new Option(
|
||||
matrice.NomeMatriceTraduzione,
|
||||
matrice.IdMatrice,
|
||||
true,
|
||||
true,
|
||||
);
|
||||
$select.append(option).trigger("change");
|
||||
partMatrice[partNumber] = matrice.IdMatrice;
|
||||
}
|
||||
}
|
||||
|
||||
$select.on("change", function () {
|
||||
const idmatrice = $(this).val();
|
||||
const $listItem = $(this).closest("li");
|
||||
const $saveStatus = $listItem.find(".save-status");
|
||||
const $saveLoading = $listItem.find(".save-loading");
|
||||
|
||||
partMatrice[partNumber] = idmatrice || null;
|
||||
|
||||
if (partId && partId !== "new") {
|
||||
$saveLoading.show();
|
||||
$saveStatus.hide();
|
||||
|
||||
const iddatadb = $("#partsModal").data("iddatadb");
|
||||
const idquotations = $("#partsModal").data("idquotations");
|
||||
const endpoint = idquotations
|
||||
? "save_matrice_quotation.php"
|
||||
: "save_matrice.php"; // Assumendo esista per quotations, altrimenti adatta
|
||||
const data = idquotations
|
||||
? { idquotations: idquotations }
|
||||
: { iddatadb: iddatadb };
|
||||
|
||||
$.ajax({
|
||||
url: endpoint,
|
||||
method: "POST",
|
||||
data: JSON.stringify({
|
||||
...data,
|
||||
parts: [
|
||||
{
|
||||
id: partId,
|
||||
idmatrice: idmatrice || null,
|
||||
},
|
||||
],
|
||||
}),
|
||||
contentType: "application/json",
|
||||
success: function (response) {
|
||||
if (response.success) {
|
||||
$saveLoading.hide();
|
||||
$saveStatus.show();
|
||||
setTimeout(() => $saveStatus.hide(), 2000);
|
||||
} else {
|
||||
const errorMsg = $(
|
||||
'<div class="alert alert-danger temp-alert" role="alert">Errore nel salvataggio della matrice: ' +
|
||||
response.message +
|
||||
"</div>",
|
||||
);
|
||||
$("#partsModal .modal-body").prepend(errorMsg);
|
||||
setTimeout(function () {
|
||||
errorMsg.fadeOut(500, function () {
|
||||
$(this).remove();
|
||||
});
|
||||
}, 5000);
|
||||
$saveLoading.hide();
|
||||
}
|
||||
},
|
||||
error: function (xhr, status, error) {
|
||||
const errorMsg = $(
|
||||
'<div class="alert alert-danger temp-alert" role="alert">Errore nel salvataggio della matrice: ' +
|
||||
error +
|
||||
" (" +
|
||||
xhr.status +
|
||||
")</div>",
|
||||
);
|
||||
$("#partsModal .modal-body").prepend(errorMsg);
|
||||
setTimeout(function () {
|
||||
errorMsg.fadeOut(500, function () {
|
||||
$(this).remove();
|
||||
});
|
||||
}, 5000);
|
||||
$saveLoading.hide();
|
||||
},
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Funzione per inizializzare Select2 sul dropdown globale
|
||||
function initializeGlobalSelect2() {
|
||||
const $select = $("#global-matrice");
|
||||
if (typeof $.fn.select2 === "undefined") {
|
||||
$select.replaceWith(
|
||||
'<input type="text" class="form-control form-control-sm" placeholder="Select2 non disponibile" disabled>',
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
const options = matrici.map(function (matrice) {
|
||||
return {
|
||||
id: matrice.IdMatrice,
|
||||
text: matrice.NomeMatriceTraduzione,
|
||||
};
|
||||
});
|
||||
|
||||
$select.select2({
|
||||
placeholder: "Seleziona matrice globale",
|
||||
allowClear: true,
|
||||
data: options,
|
||||
dropdownParent: $("#partsModal"),
|
||||
matcher: function (params, data) {
|
||||
if (!params.term || params.term.length < 3) {
|
||||
return data;
|
||||
}
|
||||
const term = params.term.toUpperCase();
|
||||
if (data.text.toUpperCase().indexOf(term) >= 0) {
|
||||
return data;
|
||||
}
|
||||
return null;
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
// ===================
|
||||
// PARTS LIST
|
||||
// ===================
|
||||
@ -763,6 +957,7 @@ $(document).ready(function () {
|
||||
$("#partsTableBody tr").each(function () {
|
||||
const partNumber = $(this).find(".part-number").val();
|
||||
const partDescription = $(this).find(".part-description").val();
|
||||
const partId = $(this).data("part-id");
|
||||
const partColor =
|
||||
partColors[partNumber] ||
|
||||
(partDescription.startsWith("Mix") ? "#0000ff" : "#ff0000");
|
||||
@ -778,17 +973,30 @@ $(document).ready(function () {
|
||||
)
|
||||
.join("");
|
||||
const listItem = `
|
||||
<li class="list-group-item" data-part-number="${partNumber}">
|
||||
<li class="list-group-item" data-part-number="${partNumber}" data-part-id="${partId}">
|
||||
${partNumber} - ${partDescription}
|
||||
<div style="display: flex; align-items: center;">
|
||||
<button type="button" class="btn btn-primary btn-sm propagate-matrice-btn" style="padding: 0.1rem 0.3rem; font-size: 0.8rem; margin-right: 3px;"><i class="fas fa-arrow-right fa-xs"></i></button>
|
||||
<select class="part-matrice" style="width: 250px !important; margin-right: 10px;"></select>
|
||||
<button type="button" class="btn btn-success btn-sm add-to-mix-btn" style="padding: 0.1rem 0.3rem; font-size: 0.8rem;"><i class="fas fa-plus fa-xs"></i></button>
|
||||
<div class="color-picker-container">
|
||||
<div class="color-option selected-color" style="background-color: ${partColor}; margin-left: 5px;"></div>
|
||||
<div class="color-picker">${colorOptions}</div>
|
||||
</div>
|
||||
<span class="save-status text-success" style="display: none; margin-left: 5px;"><i class="fas fa-check fa-xs"></i></span>
|
||||
<span class="save-loading text-warning" style="display: none; margin-left: 5px;"><i class="fas fa-spinner fa-spin fa-xs"></i></span>
|
||||
</div>
|
||||
</li>`;
|
||||
$("#partsList").append(listItem);
|
||||
const $select = $("#partsList").find(
|
||||
`li[data-part-number="${partNumber}"] .part-matrice`,
|
||||
);
|
||||
initializeSelect2(
|
||||
$select,
|
||||
partNumber,
|
||||
partId,
|
||||
partMatrice[partNumber],
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
@ -862,11 +1070,32 @@ $(document).ready(function () {
|
||||
}
|
||||
});
|
||||
|
||||
$(document).on("click", ".propagate-matrice-btn", function () {
|
||||
const $listItem = $(this).closest("li");
|
||||
const globalVal = $("#global-matrice").val();
|
||||
if (globalVal) {
|
||||
$listItem.find(".part-matrice").val(globalVal).trigger("change");
|
||||
} else {
|
||||
const errorMsg = $(
|
||||
'<div class="alert alert-danger temp-alert" role="alert">Seleziona una matrice globale prima di propagare.</div>',
|
||||
);
|
||||
$("#partsModal .modal-body").prepend(errorMsg);
|
||||
setTimeout(function () {
|
||||
errorMsg.fadeOut(500, function () {
|
||||
$(this).remove();
|
||||
});
|
||||
}, 5000);
|
||||
}
|
||||
});
|
||||
|
||||
$("#partsList").on("click", "li", function (e) {
|
||||
if (
|
||||
$(e.target).hasClass("add-to-mix-btn") ||
|
||||
$(e.target).hasClass("color-option") ||
|
||||
$(e.target).closest(".color-picker-container").length
|
||||
$(e.target).closest(".color-picker-container").length ||
|
||||
$(e.target).hasClass("part-matrice") ||
|
||||
$(e.target).closest(".select2-container").length ||
|
||||
$(e.target).hasClass("propagate-matrice-btn")
|
||||
)
|
||||
return;
|
||||
selectedPartNumber = $(this).data("part-number");
|
||||
@ -892,6 +1121,7 @@ $(document).ready(function () {
|
||||
? { idquotations: idquotations }
|
||||
: { iddatadb: iddatadb };
|
||||
let newPartColors = {};
|
||||
let newPartMatrice = {};
|
||||
let newMarkerObjects = {};
|
||||
|
||||
let partsData = $rows
|
||||
@ -908,6 +1138,7 @@ $(document).ready(function () {
|
||||
partsData.forEach((part, index) => {
|
||||
const newNumber = index + 1;
|
||||
newPartColors[newNumber] = partColors[part.partNumber] || "#ff0000";
|
||||
newPartMatrice[newNumber] = partMatrice[part.partNumber] || null;
|
||||
if (markerObjects[part.partNumber]) {
|
||||
newMarkerObjects[newNumber] = markerObjects[part.partNumber];
|
||||
}
|
||||
@ -934,6 +1165,7 @@ $(document).ready(function () {
|
||||
}
|
||||
|
||||
partColors = newPartColors;
|
||||
partMatrice = newPartMatrice;
|
||||
markerObjects = newMarkerObjects;
|
||||
|
||||
const partsToSave = partsData.map((part) => ({
|
||||
@ -941,6 +1173,7 @@ $(document).ready(function () {
|
||||
part_number: part.partNumber,
|
||||
part_description: part.partDescription,
|
||||
mix: part.partDescription.startsWith("Mix") ? "Y" : "N",
|
||||
idmatrice: partMatrice[part.partNumber] || null,
|
||||
}));
|
||||
|
||||
$.ajax({
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user