Compare commits

...

12 Commits

13 changed files with 2360 additions and 403 deletions
@@ -120,4 +120,76 @@ class VisualLimsApiClient
return $data; return $data;
} }
public function post($endpoint, $payload)
{
$token = $this->getToken();
$url = "{$this->baseUrl}/api/odata/{$endpoint}";
$ch = curl_init($url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_POST, true);
curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($payload));
curl_setopt($ch, CURLOPT_HTTPHEADER, [
"Authorization: Bearer {$token}",
"Content-Type: application/json",
"Accept: application/json"
]);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false);
$response = curl_exec($ch);
$http_code = curl_getinfo($ch, CURLINFO_HTTP_CODE);
$curl_error = curl_error($ch);
curl_close($ch);
if ($response === false) {
throw new Exception("Errore nella richiesta POST: {$curl_error}");
}
if ($http_code < 200 || $http_code >= 300) {
throw new Exception("POST fallito: HTTP {$http_code}, Risposta: " . substr($response, 0, 1000));
}
return json_decode($response, true);
}
public function patch($endpoint, $payload)
{
$token = $this->getToken();
$url = "{$this->baseUrl}/api/odata/{$endpoint}";
$ch = curl_init($url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_CUSTOMREQUEST, "PATCH");
curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($payload));
curl_setopt($ch, CURLOPT_HTTPHEADER, [
"Authorization: Bearer {$token}",
"Content-Type: application/json",
"Accept: application/json"
]);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false);
$response = curl_exec($ch);
$http_code = curl_getinfo($ch, CURLINFO_HTTP_CODE);
$curl_error = curl_error($ch);
curl_close($ch);
if ($response === false) {
throw new Exception("Errore nella richiesta PATCH: {$curl_error}");
}
if ($http_code < 200 || $http_code >= 300) {
throw new Exception("PATCH fallito: HTTP {$http_code}, Risposta: " . substr($response, 0, 1000));
}
return json_decode($response, true);
}
public function getBaseUrl()
{
return $this->baseUrl;
}
} }
+1 -1
View File
@@ -31,6 +31,6 @@ Content-Length: 51
< strict-transport-security: max-age=2592000 < strict-transport-security: max-age=2592000
< x-powered-by: ASP.NET < x-powered-by: ASP.NET
< x-content-type-options: nosniff < x-content-type-options: nosniff
< date: Fri, 29 Aug 2025 13:36:31 GMT < date: Sat, 06 Sep 2025 10:24:00 GMT
< <
* Connection #0 to host 93.43.5.102 left intact * Connection #0 to host 93.43.5.102 left intact
+3 -3
View File
@@ -15,11 +15,11 @@
* [HTTP/2] [1] [:scheme: https] * [HTTP/2] [1] [:scheme: https]
* [HTTP/2] [1] [:authority: 93.43.5.102] * [HTTP/2] [1] [:authority: 93.43.5.102]
* [HTTP/2] [1] [:path: /limsapi/api/odata/CustomField(1083)?$expand=CustomFieldsValues] * [HTTP/2] [1] [:path: /limsapi/api/odata/CustomField(1083)?$expand=CustomFieldsValues]
* [HTTP/2] [1] [authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IjQ5MiIsIlhhZlNlY3VyaXR5QXV0aFBhc3NlZCI6IlhhZlNlY3VyaXR5QXV0aFBhc3NlZCIsImh0dHA6Ly9zY2hlbWFzLnhtbHNvYXAub3JnL3dzLzIwMDUvMDUvaWRlbnRpdHkvY2xhaW1zL25hbWUiOiJXZWJBcGlVc2VyIiwiWGFmU2VjdXJpdHkiOiJYYWZTZWN1cml0eSIsIlhhZkxvZ29uUGFyYW1zIjoicTFZS0xVNHQ4a3ZNVFZXeVVncFBUWElzeUFRSktPa29CU1FXRjVmbkY2VUF4Y3RUa3hJTE1rdUI0Z2FHU3JVQSIsImV4cCI6MTc1NjQ4MTc5MSwiaXNzIjoiTXkiLCJhdWQiOiJodHRwOi8vbG9jYWxob3N0OjQyMDAifQ.066odH6XJ_XK1D_w6xYBCXncA6Hx1AgFqsanfvKULyk] * [HTTP/2] [1] [authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IjQ5MiIsIlhhZlNlY3VyaXR5QXV0aFBhc3NlZCI6IlhhZlNlY3VyaXR5QXV0aFBhc3NlZCIsImh0dHA6Ly9zY2hlbWFzLnhtbHNvYXAub3JnL3dzLzIwMDUvMDUvaWRlbnRpdHkvY2xhaW1zL25hbWUiOiJXZWJBcGlVc2VyIiwiWGFmU2VjdXJpdHkiOiJYYWZTZWN1cml0eSIsIlhhZkxvZ29uUGFyYW1zIjoicTFZS0xVNHQ4a3ZNVFZXeVVncFBUWElzeUFRSktPa29CU1FXRjVmbkY2VUF4Y3RUa3hJTE1rdUI0Z2FHU3JVQSIsImV4cCI6MTc1NzE2MTQ0MCwiaXNzIjoiTXkiLCJhdWQiOiJodHRwOi8vbG9jYWxob3N0OjQyMDAifQ.UgVN5wzjtR8MRU2xLDFWRHIAYLJTmxF3x7kWeVU11YU]
* [HTTP/2] [1] [accept: application/json] * [HTTP/2] [1] [accept: application/json]
> GET /limsapi/api/odata/CustomField(1083)?$expand=CustomFieldsValues HTTP/2 > GET /limsapi/api/odata/CustomField(1083)?$expand=CustomFieldsValues HTTP/2
Host: 93.43.5.102 Host: 93.43.5.102
Authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IjQ5MiIsIlhhZlNlY3VyaXR5QXV0aFBhc3NlZCI6IlhhZlNlY3VyaXR5QXV0aFBhc3NlZCIsImh0dHA6Ly9zY2hlbWFzLnhtbHNvYXAub3JnL3dzLzIwMDUvMDUvaWRlbnRpdHkvY2xhaW1zL25hbWUiOiJXZWJBcGlVc2VyIiwiWGFmU2VjdXJpdHkiOiJYYWZTZWN1cml0eSIsIlhhZkxvZ29uUGFyYW1zIjoicTFZS0xVNHQ4a3ZNVFZXeVVncFBUWElzeUFRSktPa29CU1FXRjVmbkY2VUF4Y3RUa3hJTE1rdUI0Z2FHU3JVQSIsImV4cCI6MTc1NjQ4MTc5MSwiaXNzIjoiTXkiLCJhdWQiOiJodHRwOi8vbG9jYWxob3N0OjQyMDAifQ.066odH6XJ_XK1D_w6xYBCXncA6Hx1AgFqsanfvKULyk Authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IjQ5MiIsIlhhZlNlY3VyaXR5QXV0aFBhc3NlZCI6IlhhZlNlY3VyaXR5QXV0aFBhc3NlZCIsImh0dHA6Ly9zY2hlbWFzLnhtbHNvYXAub3JnL3dzLzIwMDUvMDUvaWRlbnRpdHkvY2xhaW1zL25hbWUiOiJXZWJBcGlVc2VyIiwiWGFmU2VjdXJpdHkiOiJYYWZTZWN1cml0eSIsIlhhZkxvZ29uUGFyYW1zIjoicTFZS0xVNHQ4a3ZNVFZXeVVncFBUWElzeUFRSktPa29CU1FXRjVmbkY2VUF4Y3RUa3hJTE1rdUI0Z2FHU3JVQSIsImV4cCI6MTc1NzE2MTQ0MCwiaXNzIjoiTXkiLCJhdWQiOiJodHRwOi8vbG9jYWxob3N0OjQyMDAifQ.UgVN5wzjtR8MRU2xLDFWRHIAYLJTmxF3x7kWeVU11YU
Accept: application/json Accept: application/json
< HTTP/2 200 < HTTP/2 200
@@ -30,6 +30,6 @@ Accept: application/json
< odata-version: 4.0 < odata-version: 4.0
< x-powered-by: ASP.NET < x-powered-by: ASP.NET
< x-content-type-options: nosniff < x-content-type-options: nosniff
< date: Fri, 29 Aug 2025 13:36:33 GMT < date: Sat, 06 Sep 2025 10:24:02 GMT
< <
* Connection #0 to host 93.43.5.102 left intact * Connection #0 to host 93.43.5.102 left intact
File diff suppressed because one or more lines are too long
+172
View File
@@ -0,0 +1,172 @@
<?php
require_once "class/VisualLimsApiClient.class.php";
include('include/headscript.php');
$dbHandler = DBHandlerSelect::getInstance();
$pdo = $dbHandler->getConnection();
header("Content-Type: application/json");
try {
$iddatadb = $_POST['iddatadb'] ?? null;
if (!$iddatadb) {
throw new Exception("Missing iddatadb");
}
// 🔹 STEP 1+2: Fetch Cliente ID + Schema ID
$stmt = $pdo->prepare("
SELECT et.idclient AS clienteId, et.idschema AS schemaId
FROM datadb as d
INNER JOIN excel_templates as et ON d.templateid = et.id
WHERE d.iddatadb = :iddatadb
LIMIT 1
");
$stmt->execute(['iddatadb' => $iddatadb]);
$result = $stmt->fetch(PDO::FETCH_ASSOC);
if (!$result) {
throw new Exception("No Cliente/Schema found for iddatadb {$iddatadb}");
}
$clienteId = (int) $result['clienteId'];
$schemaId = (int) $result['schemaId'];
// 🔹 STEP 3: Fetch Parts (including idmatrice)
$stmt = $pdo->prepare("
SELECT part_number, part_description, material, color, mix, idmatrice
FROM identification_parts
WHERE iddatadb = :iddatadb
");
$stmt->execute(['iddatadb' => $iddatadb]);
$parts = $stmt->fetchAll(PDO::FETCH_ASSOC);
// 🔹 STEP 4: Fetch Field Values with Labels
$stmt = $pdo->prepare("
SELECT
idd.field_value,
m.field_label,
m.schema_id,
m.field_id
FROM
import_data_details as idd
JOIN template_mapping m ON idd.mapping_id = m.id
WHERE idd.id = :iddatadb
");
$stmt->execute(['iddatadb' => $iddatadb]);
$rows = $stmt->fetchAll(PDO::FETCH_ASSOC);
$fieldValues = [];
foreach ($rows as $row) {
$fieldValues[] = [
"IdCommesseCustomFields" => (int) $row['field_id'],
"Valore" => $row['field_value']
];
}
// 🔹 Initialize API client
$api = VisualLimsApiClient::getInstance();
// 🔹 STEP 5: Create CommessaWeb (NOT WebOrder)
$commessaWebPayload = [
"Cliente" => $clienteId,
"SchemaCustomField" => $schemaId,
"Richiedente" => "Test Web Import",
"Descrizione" => "TEST CommessaWeb",
];
$commessaWeb = $api->post("CommessaWeb", $commessaWebPayload);
$commessaId = $commessaWeb["IdCommessa"];
// Estraiamo il numero della commessa usando CodiceCommessa
$commessaWebCode = substr($commessaWeb["CodiceCommessa"] ?? "TEST CommessaWeb", 0, 30); // Limite a 30 caratteri
// 🔹 STEP 6: Create Campioni (Samples) for each part
$campioni = [];
foreach ($parts as $index => $part) {
$matriceId = (int) ($part["idmatrice"] ?? 0);
if ($matriceId <= 0) {
throw new Exception("Invalid or missing idmatrice for part: " . ($part["part_number"] ?? "Unknown"));
}
$campionePayload = [
"Commessa" => $commessaId,
"Matrice" => $matriceId,
"SottoMatrice" => null,
"SchemaCustomField" => $schemaId,
"NoteWeb" => $part["part_description"] ?? ""
];
$campione = $api->post("Campione", $campionePayload);
$campione["PartNumber"] = $part["part_number"] ?? "";
$campione["Material"] = $part["material"] ?? "";
$campione["Color"] = $part["color"] ?? "";
$campione["Mix"] = $part["mix"] ?? "";
$campioni[] = $campione;
}
// 🔹 STEP 7: Update Custom Fields for CommessaWeb
if (!empty($fieldValues)) {
$commessaWithFields = $api->get("CommessaWeb(" . $commessaId . ")?\$expand=CommesseCustomFields");
$commessaCustomFields = [];
foreach ($commessaWithFields["CommesseCustomFields"] as $customField) {
foreach ($fieldValues as $fieldValue) {
if ($customField["IdCommesseCustomFields"] == $fieldValue["IdCommesseCustomFields"]) {
$commessaCustomFields[] = [
"IdCommesseCustomFields" => $customField["IdCommesseCustomFields"],
"Valore" => $fieldValue["Valore"]
];
break;
}
}
}
if (!empty($commessaCustomFields)) {
$updatePayload = ["CommesseCustomFields" => $commessaCustomFields];
$api->patch("CommessaWeb({$commessaId})", $updatePayload);
}
}
// 🔹 STEP 8: Update datadb with idcommessaweb, commessaweb, and status
$stmt = $pdo->prepare("
UPDATE datadb
SET idcommessaweb = :idcommessaweb, commessaweb = :commessaweb, status = 'l'
WHERE iddatadb = :iddatadb
");
$stmt->execute([
'idcommessaweb' => $commessaId,
'commessaweb' => $commessaWebCode,
'iddatadb' => $iddatadb
]);
// 🔹 STEP 9: Send CommessaWeb to laboratory
$sendResult = $api->post("CommessaWeb({$commessaId})/InviaCommessa", []);
// 🔹 STEP 10: Prepare final response
$finalCommessa = [
"Cliente" => $clienteId,
"SchemaCustomField" => $schemaId,
"Richiedente" => $commessaWeb["Richiedente"] ?? "Web Import",
"Descrizione" => $commessaWeb["Descrizione"] ?? "",
"CommesseCustomFields" => $fieldValues,
"Campioni" => $campioni,
"Inviata" => 1
];
echo json_encode([
"success" => true,
"commessaWeb" => $finalCommessa,
"commessaWebApiResponse" => $commessaWeb, // Incluso per debug
"totalCampioni" => count($campioni),
"totalCustomFields" => count($fieldValues),
"message" => "Export successful"
]);
} catch (Exception $e) {
error_log("LIMS Export Error: " . $e->getMessage() . "\nTrace: " . $e->getTraceAsString());
echo json_encode([
"success" => false,
"message" => "Export failed: " . $e->getMessage()
]);
}
+1
View File
@@ -948,6 +948,7 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
</div> </div>
<?php include('jsinclude.php'); ?> <?php include('jsinclude.php'); ?>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <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="photos.js"></script> <script src="photos.js"></script>
<script src="parts.js"></script> <script src="parts.js"></script>
<script src="tracking.js"></script> <script src="tracking.js"></script>
File diff suppressed because one or more lines are too long
+213 -163
View File
@@ -21,8 +21,8 @@ if ($_SERVER['REQUEST_METHOD'] !== 'POST' || !isset($_POST['template_id']) || !i
$template_id = intval($_POST['template_id']) ?? $_SESSION['template_id']; $template_id = intval($_POST['template_id']) ?? $_SESSION['template_id'];
$selected_rows = $_POST['selected_rows'] ?? $_SESSION['selected_rows']; $selected_rows = $_POST['selected_rows'] ?? $_SESSION['selected_rows'];
$columns = json_decode($_POST['columns'], true) ?? $_SESSION['columns']; // Header dell'XLS $columns = json_decode($_POST['columns'], true) ?? $_SESSION['columns'];
$rows = json_decode($_POST['rows'], true) ?? $_SESSION['rows']; // Dati dell'XLS $rows = json_decode($_POST['rows'], true) ?? $_SESSION['rows'];
$newFilename = htmlspecialchars($_POST['filename']) ?? $_SESSION['filename']; $newFilename = htmlspecialchars($_POST['filename']) ?? $_SESSION['filename'];
// Log dei dati ricevuti // Log dei dati ricevuti
@@ -31,7 +31,7 @@ error_log("Columns: " . json_encode($columns));
error_log("Rows: " . json_encode($rows)); error_log("Rows: " . json_encode($rows));
// Recupera l'ID dell'utente loggato // Recupera l'ID dell'utente loggato
$user_id = $iduserlogin ?? 1; // Default a 1 se non definito $user_id = $iduserlogin ?? 1;
$db = DBHandlerSelect::getInstance(); $db = DBHandlerSelect::getInstance();
$pdo = $db->getConnection(); $pdo = $db->getConnection();
@@ -99,30 +99,25 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
<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://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2Lw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<style> <style>
.cell-changed { .cell-changed {
background-color: #fff3b0 !important; /* რბილი ყვითელი */ background-color: #fff3b0 !important;
transition: background-color 0.3s ease; transition: background-color 0.3s ease;
} }
/* Colori pastello per input/select */
input.auto-input, input.auto-input,
select.auto-input { select.auto-input {
background-color: #d4edda; background-color: #d4edda;
/* Verde pastello */
} }
input.manual-input, input.manual-input,
select.manual-input { select.manual-input {
background-color: #fff3cd; background-color: #fff3cd;
/* Giallino pastello */
} }
input.required-input, input.required-input,
select.required-input { select.required-input {
background-color: #f8d7da; background-color: #f8d7da;
/* Rossino chiaro */
} }
/* Stili base per input/select */
input, input,
select { select {
width: 100%; width: 100%;
@@ -133,14 +128,11 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
font-size: 14px; font-size: 14px;
} }
/* Mantieni leggibilità del testo */
input, input,
select { select {
color: #333; color: #333;
/* Colore scuro per contrasto */
} }
/* Stili per i badge di stato */
.status-badge { .status-badge {
display: inline-block; display: inline-block;
padding: 2px 8px; padding: 2px 8px;
@@ -166,7 +158,6 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
color: white; color: white;
} }
/* Stili esistenti rimangono invariati */
.grid-container { .grid-container {
overflow-x: auto; overflow-x: auto;
max-width: 100%; max-width: 100%;
@@ -259,6 +250,11 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
align-items: center; align-items: center;
} }
.grid-top .save-all-cell {
flex: 0 0 210px;
align-items: flex-start;
}
.propagate-btn { .propagate-btn {
background: none; background: none;
border: none; border: none;
@@ -375,7 +371,6 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
box-shadow: 0 0 5px rgba(0, 123, 255, 0.5); box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
} }
/* Stile per l'header dei pulsanti combinati */
.grid-cell.button-cell, .grid-cell.button-cell,
.grid-header.button-header { .grid-header.button-header {
min-width: 210px !important; min-width: 210px !important;
@@ -396,6 +391,20 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
background-color: #d4edda !important; background-color: #d4edda !important;
transition: background-color 0.3s ease; transition: background-color 0.3s ease;
} }
.save-all-btn {
background-color: #28a745;
color: white;
border: none;
border-radius: 5px;
padding: 8px 16px;
cursor: pointer;
font-size: 14px;
}
.save-all-btn:hover {
background-color: #218838;
}
</style> </style>
<title>Edit Imported Data - <?= htmlspecialchars($titlewebsite, ENT_QUOTES, 'UTF-8'); ?></title> <title>Edit Imported Data - <?= htmlspecialchars($titlewebsite, ENT_QUOTES, 'UTF-8'); ?></title>
</head> </head>
@@ -426,9 +435,10 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
<div class="card-body"> <div class="card-body">
<form id="editForm"> <form id="editForm">
<div class="grid-container"> <div class="grid-container">
<!-- Riga superiore per gli input dei campi manuali -->
<div class="grid-top"> <div class="grid-top">
<div class="grid-cell button-cell" style="flex: 0 0 210px;"></div> <!-- Actions --> <div class="grid-cell save-all-cell">
<button type="button" class="save-all-btn" title="Save All Rows"><i class="fas fa-save"></i> Save All</button>
</div>
<?php if ($mainFieldMapping): ?> <?php if ($mainFieldMapping): ?>
<div class="grid-cell" style="flex: 0 0 150px;"> <div class="grid-cell" style="flex: 0 0 150px;">
<?php <?php
@@ -456,9 +466,8 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
?> ?>
</div> </div>
<?php endif; ?> <?php endif; ?>
<div class="grid-cell" style="flex: 0 0 150px;"></div> <!-- status --> <div class="grid-cell" style="flex: 0 0 150px;"></div>
<?php <?php
// Campi automatici (is_manual = 0) escluso main_field
$autoIndex = 0; $autoIndex = 0;
foreach ($allMappings as $mapping) { foreach ($allMappings as $mapping) {
if (!$mapping['is_manual'] && $mapping['main_field'] != 1) { if (!$mapping['is_manual'] && $mapping['main_field'] != 1) {
@@ -477,7 +486,6 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
$autoIndex++; $autoIndex++;
} }
} }
// Campi manuali (is_manual = 1) escluso main_field
$manualIndex = 0; $manualIndex = 0;
foreach ($allMappings as $mapping) { foreach ($allMappings as $mapping) {
if ($mapping['is_manual'] && $mapping['main_field'] != 1) { if ($mapping['is_manual'] && $mapping['main_field'] != 1) {
@@ -489,7 +497,7 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
if ($mapping['is_required']) $inputClass .= ' required-input'; if ($mapping['is_required']) $inputClass .= ' required-input';
echo "<div class='grid-cell' style='flex: 0 0 150px;'>"; echo "<div class='grid-cell' style='flex: 0 0 150px;'>";
if ($mapping['data_type'] === 'SceltaMultipla') { if ($mapping['data_type'] === 'SceltaMultipla') {
echo "<select class='custom-field dropdown-select $inputClass' data-column='manual_$manualIndex' data-field-id='{$mapping['field_id']}' data-selected-value='" . htmlspecialchars($fieldValue) . "' " . ($mapping['is_required'] ? 'required' : '') . ">"; echo "<select class='custom-field dropdown-select $inputClass' data-column='manual_$manualIndex' data-field-id='{$mapping['field_id']}' data-selected-value='" . htmlspecialchars($fieldValue) . "' " . ($mainFieldMapping['is_required'] ? 'required' : '') . ">";
echo "<option value=''>Seleziona...</option>"; echo "<option value=''>Seleziona...</option>";
echo "</select>"; echo "</select>";
} elseif ($mapping['data_type'] === 'DATE') { } elseif ($mapping['data_type'] === 'DATE') {
@@ -504,15 +512,14 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
$manualIndex++; $manualIndex++;
} }
} }
echo "<div class='grid-cell' style='flex: 0 0 200px;'></div>"; // AWB echo "<div class='grid-cell' style='flex: 0 0 200px;'></div>";
echo "<div class='grid-cell' style='flex: 0 0 250px;'></div>"; // Tracking Info echo "<div class='grid-cell' style='flex: 0 0 250px;'></div>";
echo "<div class='grid-cell' style='flex: 0 0 150px;'></div>"; // importreferencecode echo "<div class='grid-cell' style='flex: 0 0 150px;'></div>";
echo "<div class='grid-cell' style='flex: 0 0 150px;'></div>"; // filename_import echo "<div class='grid-cell' style='flex: 0 0 150px;'></div>";
echo "<div class='grid-cell' style='flex: 0 0 150px;'></div>"; // importdate echo "<div class='grid-cell' style='flex: 0 0 150px;'></div>";
?> ?>
</div> </div>
<!-- Header della tabella -->
<div class="grid-row"> <div class="grid-row">
<div class="grid-header button-header" style="flex: 0 0 210px;">Actions</div> <div class="grid-header button-header" style="flex: 0 0 210px;">Actions</div>
<?php if ($mainFieldMapping): ?> <?php if ($mainFieldMapping): ?>
@@ -549,11 +556,14 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
?> ?>
</div> </div>
<!-- Righe della tabella -->
<?php foreach ($importedData as $index => $row): ?> <?php foreach ($importedData as $index => $row): ?>
<div class="grid-row" data-id="<?= $row['iddatadb'] ?>"> <div class="grid-row" data-id="<?= $row['iddatadb'] ?>">
<div class="grid-cell button-cell" style="flex: 0 0 210px; position: relative;"> <div class="grid-cell button-cell" style="flex: 0 0 210px; position: relative;">
<!-- commented only for admin roles -->
<?php if ((Auth::user()->hasRole('Admin'))) : ?>
<button type="button" class="export-lims-btn action-btn" data-row="<?= $index ?>" data-iddatadb="<?= $row['iddatadb'] ?>" title="Export to LIMS" style="background: #eb0b0bff; color: white; border: none; border-radius: 5px; cursor: pointer;"><i class="fas fa-upload"></i></button> <button type="button" class="export-lims-btn action-btn" data-row="<?= $index ?>" data-iddatadb="<?= $row['iddatadb'] ?>" title="Export to LIMS" style="background: #eb0b0bff; color: white; border: none; border-radius: 5px; cursor: pointer;"><i class="fas fa-upload"></i></button>
<?php endif; ?>
<button type="button" class="save-btn action-btn" data-row="<?= $index ?>" title="Save" style="background: #28a745; color: white; border: none; border-radius: 5px; cursor: pointer;"><i class="fas fa-save"></i></button> <button type="button" class="save-btn action-btn" data-row="<?= $index ?>" title="Save" style="background: #28a745; color: white; border: none; border-radius: 5px; cursor: pointer;"><i class="fas fa-save"></i></button>
<button type="button" class="photos-btn action-btn" data-row="<?= $index ?>" data-iddatadb="<?= $row['iddatadb'] ?>" title="Photos" style="background: #007bff; color: white; border: none; border-radius: 5px; cursor: pointer;"><i class="fas fa-camera"></i></button> <button type="button" class="photos-btn action-btn" data-row="<?= $index ?>" data-iddatadb="<?= $row['iddatadb'] ?>" title="Photos" style="background: #007bff; color: white; border: none; border-radius: 5px; cursor: pointer;"><i class="fas fa-camera"></i></button>
<button type="button" class="parts-btn action-btn" data-row="<?= $index ?>" data-iddatadb="<?= $row['iddatadb'] ?>" title="Parts" style="background: #ffc107; color: white; border: none; border-radius: 5px; cursor: pointer;"><i class="fas fa-puzzle-piece"></i></button> <button type="button" class="parts-btn action-btn" data-row="<?= $index ?>" data-iddatadb="<?= $row['iddatadb'] ?>" title="Parts" style="background: #ffc107; color: white; border: none; border-radius: 5px; cursor: pointer;"><i class="fas fa-puzzle-piece"></i></button>
@@ -698,21 +708,50 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
</div> </div>
<?php include('jsinclude.php'); ?> <?php include('jsinclude.php'); ?>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <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="photos.js"></script> <script src="photos.js"></script>
<script src="parts.js"></script> <script src="parts.js"></script>
<script src="tracking.js"></script> <script src="tracking.js"></script>
<script> <script>
$(document).on("click", ".export-lims-btn", function() {
let rowId = $(this).data("row");
let idDataDb = $(this).data("iddatadb");
$.ajax({
url: "export_to_lims.php",
method: "POST",
data: {
iddatadb: idDataDb
},
dataType: "json",
beforeSend: function() {
alert("Export started in background for row " + rowId);
},
success: function(response) {
if (response.success) {
alert(response.message);
} else {
alert("❌ Error: " + response.message);
}
},
error: function(xhr, status, error) {
alert("❌ AJAX error: " + error);
}
});
});
document.addEventListener("DOMContentLoaded", function() { document.addEventListener("DOMContentLoaded", function() {
console.log("Page loaded, initializing event listeners");
const inputs = document.querySelectorAll(".cell-input, .dropdown-select, .carrier-select, .awb-input"); const inputs = document.querySelectorAll(".cell-input, .dropdown-select, .carrier-select, .awb-input");
const unsavedDiv = document.getElementById("unsavedChanges"); const unsavedDiv = document.getElementById("unsavedChanges");
const changedList = document.getElementById("changedFields"); const changedList = document.getElementById("changedFields");
let hasChanges = false; let hasChanges = false;
let changedFields = {}; // { rowIndex: [fieldNames...] } let changedFields = {};
function renderChangedList() { function renderChangedList() {
console.log("Rendering changed fields list:", changedFields);
changedList.innerHTML = ""; changedList.innerHTML = "";
Object.keys(changedFields).forEach(rowIndex => { Object.keys(changedFields).forEach(rowIndex => {
const fields = changedFields[rowIndex]; const fields = changedFields[rowIndex];
if (fields.length > 0) { if (fields.length > 0) {
@@ -721,14 +760,13 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
changedList.appendChild(li); changedList.appendChild(li);
} }
}); });
unsavedDiv.style.display = Object.keys(changedFields).length > 0 ? "block" : "none"; unsavedDiv.style.display = Object.keys(changedFields).length > 0 ? "block" : "none";
} }
inputs.forEach(el => { inputs.forEach(el => {
el.addEventListener("change", () => { el.addEventListener("change", () => {
console.log("Input changed:", el.name);
hasChanges = true; hasChanges = true;
const gridCell = el.closest(".grid-cell"); const gridCell = el.closest(".grid-cell");
const colIndex = gridCell?.dataset.index; const colIndex = gridCell?.dataset.index;
const rowIndex = gridCell?.dataset.row; const rowIndex = gridCell?.dataset.row;
@@ -748,8 +786,6 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
if (!changedFields[rowIndex].includes(label)) { if (!changedFields[rowIndex].includes(label)) {
changedFields[rowIndex].push(label); changedFields[rowIndex].push(label);
} }
// highlight მხოლოდ ეს კონკრეტული cell
gridCell.classList.add("cell-changed"); gridCell.classList.add("cell-changed");
} }
@@ -760,21 +796,139 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
document.querySelectorAll(".save-btn").forEach(btn => { document.querySelectorAll(".save-btn").forEach(btn => {
btn.addEventListener("click", () => { btn.addEventListener("click", () => {
const rowIndex = btn.dataset.row; const rowIndex = btn.dataset.row;
console.log(`Saving row ${rowIndex}`);
const row = btn.closest('.grid-row');
const iddatadb = row.getAttribute('data-id');
const formData = new FormData();
if (rowIndex !== undefined && changedFields[rowIndex]) { const inputs = row.querySelectorAll(`input[name^="rows[${rowIndex}][details]"], select[name^="rows[${rowIndex}][details]"]`);
delete changedFields[rowIndex]; // წავშალოთ კონკრეტული row inputs.forEach(input => {
const matches = input.name.match(/rows\[\d+\]\[details\]\[(\d+)\]\[field_value\]/);
if (matches) {
const mappingId = matches[1];
formData.append(`details${mappingId}field_value`, input.value);
if (input.tagName === 'SELECT' && input.classList.contains('dropdown-select')) {
input.setAttribute('data-selected-value', input.value);
}
}
});
formData.append('iddatadb', iddatadb);
fetch('save_edited_row.php', {
method: 'POST',
body: formData
})
.then(response => {
if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
return response.json();
})
.then(data => {
console.log("Save response:", data);
if (data.success) {
const cells = row.querySelectorAll('.grid-cell');
cells.forEach(cell => {
cell.classList.remove('flash-success');
void cell.offsetWidth;
cell.classList.add('flash-success');
});
setTimeout(() => cells.forEach(cell => cell.classList.remove('flash-success')), 500);
if (changedFields[rowIndex]) {
delete changedFields[rowIndex];
document.querySelectorAll(`.grid-cell[data-row="${rowIndex}"]`)
.forEach(cell => cell.classList.remove("cell-changed"));
renderChangedList(); renderChangedList();
hasChanges = Object.keys(changedFields).length > 0;
}
// ამოვშალოთ cell highlight იმ row-ში alert('Salvataggio riga avvenuto con successo!');
} else {
alert('Errore durante il salvataggio: ' + data.message);
}
})
.catch(error => {
console.error("Save error:", error);
alert('Errore durante il salvataggio: ' + error.message);
});
});
});
document.querySelector('.save-all-btn').addEventListener('click', async () => {
console.log("Saving all rows");
const rows = document.querySelectorAll('.grid-row');
let successCount = 0;
let errorMessages = [];
for (const row of rows) {
const saveBtn = row.querySelector('.save-btn');
if (!saveBtn) {
console.warn(`No save button found in row with data-id: ${row.getAttribute('data-id')}`);
continue;
}
const rowIndex = saveBtn.dataset.row;
const iddatadb = row.getAttribute('data-id');
if (!rowIndex || !iddatadb) {
console.warn(`Missing rowIndex or iddatadb in row:`, row);
continue;
}
console.log(`Processing row ${rowIndex} with iddatadb ${iddatadb}`);
const formData = new FormData();
const inputs = row.querySelectorAll(`input[name^="rows[${rowIndex}][details]"], select[name^="rows[${rowIndex}][details]"]`);
inputs.forEach(input => {
const matches = input.name.match(/rows\[\d+\]\[details\]\[(\d+)\]\[field_value\]/);
if (matches) {
const mappingId = matches[1];
formData.append(`details${mappingId}field_value`, input.value);
if (input.tagName === 'SELECT' && input.classList.contains('dropdown-select')) {
input.setAttribute('data-selected-value', input.value);
}
}
});
formData.append('iddatadb', iddatadb);
try {
const response = await fetch('save_edited_row.php', {
method: 'POST',
body: formData
});
if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
const data = await response.json();
console.log(`Row ${rowIndex} save response:`, data);
if (data.success) {
successCount++;
const cells = row.querySelectorAll('.grid-cell');
cells.forEach(cell => {
cell.classList.remove('flash-success');
void cell.offsetWidth;
cell.classList.add('flash-success');
});
setTimeout(() => cells.forEach(cell => cell.classList.remove('flash-success')), 500);
if (changedFields[rowIndex]) {
delete changedFields[rowIndex];
document.querySelectorAll(`.grid-cell[data-row="${rowIndex}"]`) document.querySelectorAll(`.grid-cell[data-row="${rowIndex}"]`)
.forEach(cell => cell.classList.remove("cell-changed")); .forEach(cell => cell.classList.remove("cell-changed"));
} }
} else {
// თუ აღარაფერია შესანახი → false errorMessages.push(`Riga ${parseInt(rowIndex) + 1}: ${data.message}`);
if (Object.keys(changedFields).length === 0) { }
hasChanges = false; } catch (error) {
console.error(`Row ${rowIndex} save error:`, error);
errorMessages.push(`Riga ${parseInt(rowIndex) + 1}: ${error.message}`);
}
}
renderChangedList();
hasChanges = Object.keys(changedFields).length > 0;
console.log(`Save all completed: ${successCount} successes, ${errorMessages.length} errors`);
if (errorMessages.length === 0) {
alert(`Tutte le ${successCount} righe salvate con successo!`);
} else {
alert(`Salvate ${successCount} righe con successo.\nErrori:\n${errorMessages.join('\n')}`);
} }
});
}); });
window.addEventListener("beforeunload", function(e) { window.addEventListener("beforeunload", function(e) {
@@ -785,9 +939,9 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
}); });
}); });
</script> </script>
<script> <script>
document.addEventListener("DOMContentLoaded", function() { document.addEventListener("DOMContentLoaded", function() {
console.log("Initializing cell expansion and propagation");
const inputs = document.querySelectorAll('.cell-input'); const inputs = document.querySelectorAll('.cell-input');
inputs.forEach(input => { inputs.forEach(input => {
input.addEventListener('focus', function() { input.addEventListener('focus', function() {
@@ -798,48 +952,10 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
}); });
}); });
const saveButtons = document.querySelectorAll('.save-btn');
saveButtons.forEach(button => {
button.addEventListener('click', function() {
const rowIndex = this.getAttribute('data-row');
const row = this.closest('.grid-row');
const iddatadb = row.getAttribute('data-id');
const formData = new FormData();
const inputs = row.querySelectorAll(`input[name^="rows[${rowIndex}]"], select[name^="rows[${rowIndex}]"]`);
inputs.forEach(input => {
const name = input.name.replace(`rows[${rowIndex}]`, '').replace(/\[|\]/g, '');
formData.append(name, input.value);
});
formData.append('iddatadb', iddatadb);
formData.append('mapping', JSON.stringify(<?= json_encode($allMappings) ?>));
fetch('save_edited_row.php', {
method: 'POST',
body: formData
})
.then(response => response.json())
.then(data => {
if (data.success) {
const cells = row.querySelectorAll('.grid-cell');
cells.forEach(cell => {
cell.classList.remove('flash-success');
void cell.offsetWidth;
cell.classList.add('flash-success');
});
setTimeout(() => cells.forEach(cell => cell.classList.remove('flash-success')), 500);
alert('Salvataggio avvenuto con successo!');
} else {
alert('Errore durante il salvataggio: ' + data.message);
}
})
.catch(error => alert('Errore durante il salvataggio: ' + error.message));
});
});
const propagateButtons = document.querySelectorAll('.propagate-btn'); const propagateButtons = document.querySelectorAll('.propagate-btn');
propagateButtons.forEach(button => { propagateButtons.forEach(button => {
button.addEventListener('click', function() { button.addEventListener('click', function() {
console.log("Propagating value for column:", this.getAttribute('data-column'));
const column = this.getAttribute('data-column'); const column = this.getAttribute('data-column');
const input = this.previousElementSibling; const input = this.previousElementSibling;
const value = input.value; const value = input.value;
@@ -858,6 +974,7 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
if (targetInput) { if (targetInput) {
targetInput.value = value; targetInput.value = value;
if (targetInput.tagName === 'SELECT') { if (targetInput.tagName === 'SELECT') {
targetInput.setAttribute('data-selected-value', value);
const event = new Event('change'); const event = new Event('change');
targetInput.dispatchEvent(event); targetInput.dispatchEvent(event);
} }
@@ -875,6 +992,7 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
let columnIndex = 0; let columnIndex = 0;
resizers.forEach(resizer => { resizers.forEach(resizer => {
resizer.addEventListener('mousedown', function(e) { resizer.addEventListener('mousedown', function(e) {
console.log("Starting column resize");
currentResizer = resizer; currentResizer = resizer;
const header = resizer.parentElement; const header = resizer.parentElement;
columnIndex = header.getAttribute('data-index'); columnIndex = header.getAttribute('data-index');
@@ -897,6 +1015,7 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
function stopResize() { function stopResize() {
if (currentResizer) { if (currentResizer) {
console.log("Stopping column resize");
document.removeEventListener('mousemove', resize); document.removeEventListener('mousemove', resize);
document.removeEventListener('mouseup', stopResize); document.removeEventListener('mouseup', stopResize);
currentResizer = null; currentResizer = null;
@@ -907,11 +1026,15 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
</script> </script>
<script> <script>
document.addEventListener("DOMContentLoaded", function() { document.addEventListener("DOMContentLoaded", function() {
console.log("Initializing dropdown population");
const dropdownData = {}; const dropdownData = {};
async function populateDropdowns() { async function populateDropdowns() {
const dropdowns = document.querySelectorAll('.dropdown-select'); const dropdowns = document.querySelectorAll('.dropdown-select');
if (dropdowns.length === 0) return; if (dropdowns.length === 0) {
console.log("No dropdowns found");
return;
}
const uniqueFieldIds = [ const uniqueFieldIds = [
...new Set(Array.from(dropdowns).map(d => d.getAttribute('data-field-id'))) ...new Set(Array.from(dropdowns).map(d => d.getAttribute('data-field-id')))
@@ -920,31 +1043,34 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
const missingFieldIds = uniqueFieldIds.filter(fieldId => !dropdownData[fieldId]); const missingFieldIds = uniqueFieldIds.filter(fieldId => !dropdownData[fieldId]);
if (missingFieldIds.length > 0) { if (missingFieldIds.length > 0) {
console.log("Fetching dropdown data for field IDs:", missingFieldIds);
try { try {
const response = await fetch( const response = await fetch(
`get_customfield_values.php?field_ids=${missingFieldIds.join(",")}` `get_customfield_values.php?field_ids=${missingFieldIds.join(",")}`
); );
if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
const data = await response.json(); const data = await response.json();
if (data.error) { if (data.error) {
console.error("Errore fetch multiplo:", data.error); console.error("Fetch error:", data.error);
} else { } else {
for (const fieldId of Object.keys(data)) { for (const fieldId of Object.keys(data)) {
dropdownData[fieldId] = data[fieldId] || []; dropdownData[fieldId] = data[fieldId] || [];
} }
} }
} catch (error) { } catch (error) {
console.error("Errore generale nel fetch multiplo:", error); console.error("Fetch error:", error);
} }
} }
dropdowns.forEach(dropdown => { dropdowns.forEach(dropdown => {
const fieldId = dropdown.getAttribute('data-field-id'); const fieldId = dropdown.getAttribute('data-field-id');
const selectedValue = dropdown.getAttribute('data-selected-value') || ''; const selectedValue = dropdown.getAttribute('data-selected-value') || '';
const currentValue = dropdown.value; // Preserva il valore corrente const currentValue = dropdown.value;
if (!fieldId || !dropdownData[fieldId]) { if (!fieldId || !dropdownData[fieldId]) {
dropdown.innerHTML = '<option value="">Errore nel caricamento</option>'; dropdown.innerHTML = '<option value="">Errore nel caricamento</option>';
console.warn(`No data for fieldId ${fieldId}`);
return; return;
} }
@@ -953,7 +1079,6 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
const option = document.createElement('option'); const option = document.createElement('option');
option.value = value.IdCustomFieldsValue; option.value = value.IdCustomFieldsValue;
option.textContent = value.Valore; option.textContent = value.Valore;
// Usa il valore corrente se disponibile, altrimenti usa data-selected-value
if (currentValue && currentValue === String(value.IdCustomFieldsValue)) { if (currentValue && currentValue === String(value.IdCustomFieldsValue)) {
option.selected = true; option.selected = true;
} else if (!currentValue && selectedValue === String(value.IdCustomFieldsValue)) { } else if (!currentValue && selectedValue === String(value.IdCustomFieldsValue)) {
@@ -964,87 +1089,12 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
if ((currentValue || selectedValue) && dropdown.value !== (currentValue || selectedValue)) { if ((currentValue || selectedValue) && dropdown.value !== (currentValue || selectedValue)) {
dropdown.value = ''; dropdown.value = '';
console.warn(`Valore ${currentValue || selectedValue} non trovato per fieldId ${fieldId}`); console.warn(`Value ${currentValue || selectedValue} not found for fieldId ${fieldId}`);
} }
}); });
} }
// Chiama populateDropdowns solo al caricamento iniziale
populateDropdowns(); populateDropdowns();
document.querySelectorAll('.save-btn').forEach(btn => {
btn.addEventListener('click', function() {
const rowIndex = this.getAttribute('data-row');
const row = this.closest('.grid-row');
const iddatadb = row.getAttribute('data-id');
const formData = new FormData();
const inputs = row.querySelectorAll(`input[name^="rows[${rowIndex}]"], select[name^="rows[${rowIndex}]"]`);
inputs.forEach(input => {
const name = input.name.replace(`rows[${rowIndex}]`, '').replace(/\[|\]/g, '');
formData.append(name, input.value);
// Aggiorna data-selected-value per i dropdown
if (input.tagName === 'SELECT' && input.classList.contains('dropdown-select')) {
input.setAttribute('data-selected-value', input.value);
}
});
formData.append('iddatadb', iddatadb);
formData.append('mapping', JSON.stringify(<?= json_encode($allMappings) ?>));
fetch('save_edited_row.php', {
method: 'POST',
body: formData
})
.then(response => response.json())
.then(data => {
if (data.success) {
const cells = row.querySelectorAll('.grid-cell');
cells.forEach(cell => {
cell.classList.remove('flash-success');
void cell.offsetWidth;
cell.classList.add('flash-success');
});
setTimeout(() => cells.forEach(cell => cell.classList.remove('flash-success')), 500);
alert('Salvataggio avvenuto con successo!');
} else {
alert('Errore durante il salvataggio: ' + data.message);
}
})
.catch(error => alert('Errore durante il salvataggio: ' + error.message));
});
});
const propagateButtons = document.querySelectorAll('.propagate-btn');
propagateButtons.forEach(button => {
button.addEventListener('click', function() {
const column = this.getAttribute('data-column');
const input = this.previousElementSibling;
const value = input.value;
const gridTopCells = document.querySelector('.grid-top').querySelectorAll('.grid-cell');
const targetTopIndex = Array.from(gridTopCells).findIndex(cell =>
cell.querySelector('.propagate-btn[data-column="' + column + '"]')
);
if (targetTopIndex !== -1) {
const rows = document.querySelectorAll('.grid-row');
rows.forEach(row => {
const cells = row.querySelectorAll('.grid-cell');
if (cells.length > targetTopIndex) {
const targetInput = cells[targetTopIndex].querySelector('select.dropdown-select, input');
if (targetInput) {
targetInput.value = value;
if (targetInput.tagName === 'SELECT') {
targetInput.setAttribute('data-selected-value', value); // Aggiorna anche qui
const event = new Event('change');
targetInput.dispatchEvent(event);
}
}
}
});
}
});
});
}); });
</script> </script>
</body> </body>
+35 -11
View File
@@ -9,7 +9,14 @@
<div class="modal-body"> <div class="modal-body">
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
<h6>Elenco Parti</h6> <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;">
<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;">
<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>
</div>
</div>
<ul id="partsList" class="list-group"></ul> <ul id="partsList" class="list-group"></ul>
<table class="table table-striped table-sm mt-3" id="partsTable"> <table class="table table-striped table-sm mt-3" id="partsTable">
<thead> <thead>
@@ -50,7 +57,8 @@
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-primary btn-sm" id="addDescriptionsBtn" style="padding: 0.1rem 0.5rem; font-size: 0.8rem;">Aggiungi Lista Descrizioni</button> <button type="button" class="btn btn-primary btn-sm" id="addDescriptionsBtn" style="padding: 0.1rem 0.5rem; font-size: 0.8rem;">Aggiungi Lista Descrizioni</button>
<button type="button" class="btn btn-danger btn-sm" id="removeAnnotationsBtn" style="padding: 0.1rem 0.5rem; font-size: 0.8rem;">Rimuovi Annotazioni</button> <button type="button" class="btn btn-danger btn-sm" id="removeAnnotationsBtn" style="padding: 0.1rem 0.5rem; font-size: 0.8rem;">Rimuovi Descrizioni</button>
<button type="button" class="btn btn-warning btn-sm" id="undoMarkerBtn" style="padding: 0.1rem 0.5rem; font-size: 0.8rem;">Undo Marker</button>
<button type="button" class="btn btn-success btn-sm" id="savePhotoBtn" style="padding: 0.1rem 0.5rem; font-size: 0.8rem;">Salva Foto con Nome</button> <button type="button" class="btn btn-success btn-sm" id="savePhotoBtn" style="padding: 0.1rem 0.5rem; font-size: 0.8rem;">Salva Foto con Nome</button>
<button type="button" class="btn btn-secondary btn-sm" data-bs-dismiss="modal" style="padding: 0.1rem 0.5rem; font-size: 0.8rem;">Chiudi</button> <button type="button" class="btn btn-secondary btn-sm" data-bs-dismiss="modal" style="padding: 0.1rem 0.5rem; font-size: 0.8rem;">Chiudi</button>
</div> </div>
@@ -99,12 +107,21 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding: 5px 10px;
} }
#partsList .list-group-item:hover { #partsList .list-group-item:hover {
background-color: #f5f5f5; background-color: #f5f5f5;
} }
#partsList input[type="color"] {
width: 30px;
height: 24px;
padding: 0;
margin-left: 5px;
cursor: pointer;
}
.draggable-description { .draggable-description {
position: absolute; position: absolute;
background: rgba(255, 255, 255, 0.8); background: rgba(255, 255, 255, 0.8);
@@ -121,8 +138,6 @@
position: absolute; position: absolute;
width: 24px; width: 24px;
height: 24px; height: 24px;
background: rgba(255, 0, 0, 0.5);
border: 1px solid #ff0000;
border-radius: 50%; border-radius: 50%;
color: #ffffff; color: #ffffff;
text-align: center; text-align: center;
@@ -146,23 +161,32 @@
font-size: 0.8rem; font-size: 0.8rem;
} }
/* ნორმალური Save ღილაკი */ /* Normale Save button */
#savePhotoBtn { #savePhotoBtn {
transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
} }
/* დაუმახსოვრებელი ცვლილებები */ /* Unsaved changes */
#savePhotoBtn.unsaved { #savePhotoBtn.unsaved {
background-color: #dc3545 !important; /* წითელი */ background-color: #dc3545 !important;
/* Rosso */
border-color: #dc3545 !important; border-color: #dc3545 !important;
color: white !important; color: white !important;
animation: pulse 1.2s infinite; animation: pulse 1.2s infinite;
} }
/* ლამაზი პულსაცია */ /* Animazione pulsante */
@keyframes pulse { @keyframes pulse {
0% { box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.7); } 0% {
70% { box-shadow: 0 0 10px 15px rgba(220, 53, 69, 0); } box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.7);
100% { box-shadow: 0 0 0 0 rgba(220, 53, 69, 0); } }
70% {
box-shadow: 0 0 10px 15px rgba(220, 53, 69, 0);
}
100% {
box-shadow: 0 0 0 0 rgba(220, 53, 69, 0);
}
} }
</style> </style>
+413 -118
View File
@@ -2,7 +2,7 @@ $(document).ready(function () {
console.log("parts.js caricato correttamente"); console.log("parts.js caricato correttamente");
// =================== // ===================
// GLOBAL STATE (NEW) // GLOBAL STATE
// =================== // ===================
let photoData = { let photoData = {
naturalWidth: 0, naturalWidth: 0,
@@ -12,13 +12,13 @@ $(document).ready(function () {
scale: 1, scale: 1,
}; };
// markers keyed by photo src => [{ partNumber, x, y } using NATURAL coords] // annotations keyed by photo src
let photoMarkers = {}; let photoAnnotations = {};
// colors keyed by part number
let partColors = {};
// selection & descriptions // selection
let selectedPartNumber = null; let selectedPartNumber = null;
let descriptionPosition = {x: 10, y: 10}; // NATURAL coords
let hasDescriptions = false;
// =================== // ===================
// POPUP HANDLING // POPUP HANDLING
@@ -33,8 +33,14 @@ $(document).ready(function () {
console.log("Pulsante Parts cliccato"); console.log("Pulsante Parts cliccato");
const iddatadb = $(this).data("iddatadb"); const iddatadb = $(this).data("iddatadb");
const rowIndex = $(this).data("row"); const rowIndex = $(this).data("row");
const importRef = $("table tbody tr").eq(rowIndex).find("td").eq(1).text(); const importRef = $("table tbody tr")
const description = $("table tbody tr").eq(rowIndex).find("td").eq(2).text() || "Sconosciuto"; .eq(rowIndex)
.find("td")
.eq(1)
.text();
const description =
$("table tbody tr").eq(rowIndex).find("td").eq(2).text() ||
"Sconosciuto";
$("#trfHeader").text(`${iddatadb} - ${importRef} - ${description}`); $("#trfHeader").text(`${iddatadb} - ${importRef} - ${description}`);
$("#partsModal").data("iddatadb", iddatadb); $("#partsModal").data("iddatadb", iddatadb);
@@ -76,19 +82,25 @@ $(document).ready(function () {
$.ajax({ $.ajax({
url: "load_photo.php", url: "load_photo.php",
method: "GET", method: "GET",
data: {iddatadb: iddatadb}, data: { iddatadb: iddatadb },
success: function (response) { success: function (response) {
if (response.success) { if (response.success) {
if (response.photos && response.photos.length > 1) { if (response.photos && response.photos.length > 1) {
showPhotoSelector(response.photos); showPhotoSelector(response.photos);
} else if (response.photos && response.photos.length === 1) { } else if (
response.photos &&
response.photos.length === 1
) {
loadSinglePhoto(response.photos[0]); loadSinglePhoto(response.photos[0]);
} else { } else {
$("#samplePhoto").attr("src", ""); $("#samplePhoto").attr("src", "");
alert("Nessuna foto trovata per questo TRF."); alert("Nessuna foto trovata per questo TRF.");
} }
} else { } else {
alert(response.message || "Errore nel caricamento della foto."); alert(
response.message ||
"Errore nel caricamento della foto.",
);
} }
}, },
error: function (xhr, status, error) { error: function (xhr, status, error) {
@@ -103,8 +115,9 @@ $(document).ready(function () {
const selector = $('<select id="photoSelector"></select>'); const selector = $('<select id="photoSelector"></select>');
photos.forEach((photo, index) => { photos.forEach((photo, index) => {
const option = $('<option></option>').val(photo).text(`Photo ${index + 1}`); const option = $("<option></option>")
// display option with photo name if available .val(photo)
.text(`Photo ${index + 1}`);
if (photo.includes("/")) { if (photo.includes("/")) {
const photoName = photo.split("/").pop(); const photoName = photo.split("/").pop();
option.text(`Photo ${index + 1} - ${photoName}`); option.text(`Photo ${index + 1} - ${photoName}`);
@@ -135,41 +148,47 @@ $(document).ready(function () {
const canvas = document.getElementById("photoCanvas"); const canvas = document.getElementById("photoCanvas");
const ctx = canvas.getContext("2d"); const ctx = canvas.getContext("2d");
// Real image size
const naturalWidth = img[0].naturalWidth; const naturalWidth = img[0].naturalWidth;
const naturalHeight = img[0].naturalHeight; const naturalHeight = img[0].naturalHeight;
// Compute scale to FIT inside its parent without distorting aspect ratio
const parent = $(canvas).parent(); const parent = $(canvas).parent();
const maxW = parent.width(); const maxW = parent.width();
const maxH = parent.height(); const maxH = parent.height();
const scale = Math.min(maxW / naturalWidth, maxH / naturalHeight); const scale = Math.min(maxW / naturalWidth, maxH / naturalHeight);
// Display size on screen
const displayWidth = Math.max(1, Math.round(naturalWidth * scale)); const displayWidth = Math.max(1, Math.round(naturalWidth * scale));
const displayHeight = Math.max(1, Math.round(naturalHeight * scale)); const displayHeight = Math.max(
1,
Math.round(naturalHeight * scale),
);
// Save globally photoData = {
photoData = {naturalWidth, naturalHeight, displayWidth, displayHeight, scale}; naturalWidth,
naturalHeight,
displayWidth,
displayHeight,
scale,
};
// Canvas in REAL size (so saving uses natural coords 1:1)
canvas.width = naturalWidth; canvas.width = naturalWidth;
canvas.height = naturalHeight; canvas.height = naturalHeight;
// Visual size on screen
canvas.style.width = `${displayWidth}px`; canvas.style.width = `${displayWidth}px`;
canvas.style.height = `${displayHeight}px`; canvas.style.height = `${displayHeight}px`;
// Also size/align the overlay containers to match the canvas $("#markerContainer").css({
$("#markerContainer").css({width: `${displayWidth}px`, height: `${displayHeight}px`}); width: `${displayWidth}px`,
$("#descriptionList").css({maxWidth: `${Math.max(200, Math.round(displayWidth * 0.35))}px`}); height: `${displayHeight}px`,
});
$("#descriptionList").css({
maxWidth: `${Math.max(200, Math.round(displayWidth * 0.35))}px`,
});
// Draw fresh image at full resolution
ctx.clearRect(0, 0, naturalWidth, naturalHeight); ctx.clearRect(0, 0, naturalWidth, naturalHeight);
ctx.drawImage(img.get(0), 0, 0, naturalWidth, naturalHeight); ctx.drawImage(img.get(0), 0, 0, naturalWidth, naturalHeight);
updateMarkers(); updateMarkers();
if (hasDescriptions) drawDescriptions(descriptionPosition.x, descriptionPosition.y); updateDescriptions();
}); });
} }
@@ -178,6 +197,7 @@ $(document).ready(function () {
// =================== // ===================
function addNewRow(nextPartNumber, isMix = false) { function addNewRow(nextPartNumber, isMix = false) {
const description = isMix ? "Mix" : ""; const description = isMix ? "Mix" : "";
const defaultColor = isMix ? "#0000ff" : "#ff0000";
const newRow = ` const newRow = `
<tr data-part-id=""> <tr data-part-id="">
<td><input type="number" class="form-control form-control-sm part-number" value="${nextPartNumber || 1}" style="width: 80px;"></td> <td><input type="number" class="form-control form-control-sm part-number" value="${nextPartNumber || 1}" style="width: 80px;"></td>
@@ -192,22 +212,28 @@ $(document).ready(function () {
</tr>`; </tr>`;
$("#partsTableBody").append(newRow); $("#partsTableBody").append(newRow);
updateRowButtons(); updateRowButtons();
// Initialize color for the new part
const partNumber = nextPartNumber || 1;
partColors[partNumber] = defaultColor;
} }
function updateRowButtons() { function updateRowButtons() {
const rowCount = $("#partsTableBody tr").length; const rowCount = $("#partsTableBody tr").length;
$("#partsTableBody tr").each(function () { $("#partsTableBody tr").each(function () {
const $removeBtn = $(this).find(".remove-row"); const $removeBtn = $(this).find(".remove-row");
if (rowCount > 1) $removeBtn.show(); else $removeBtn.hide(); if (rowCount > 1) $removeBtn.show();
else $removeBtn.hide();
}); });
} }
$(document).on("click", ".add-row", function (e) { $(document).on("click", ".add-row", function (e) {
e.preventDefault(); e.preventDefault();
const maxPartNumber = Math.max( const maxPartNumber = Math.max(
...$("#partsTableBody tr").map(function () { ...$("#partsTableBody tr")
.map(function () {
return parseInt($(this).find(".part-number").val()) || 0; return parseInt($(this).find(".part-number").val()) || 0;
}).get(), })
.get(),
); );
addNewRow(maxPartNumber + 1); addNewRow(maxPartNumber + 1);
updatePartsList(); updatePartsList();
@@ -216,9 +242,11 @@ $(document).ready(function () {
$(document).on("click", ".add-mix-row", function (e) { $(document).on("click", ".add-mix-row", function (e) {
e.preventDefault(); e.preventDefault();
const maxPartNumber = Math.max( const maxPartNumber = Math.max(
...$("#partsTableBody tr").map(function () { ...$("#partsTableBody tr")
.map(function () {
return parseInt($(this).find(".part-number").val()) || 0; return parseInt($(this).find(".part-number").val()) || 0;
}).get(), })
.get(),
); );
addNewRow(maxPartNumber + 1, true); addNewRow(maxPartNumber + 1, true);
updatePartsList(); updatePartsList();
@@ -228,29 +256,39 @@ $(document).ready(function () {
e.preventDefault(); e.preventDefault();
const $row = $(this).closest("tr"); const $row = $(this).closest("tr");
const partId = $row.data("part-id"); const partId = $row.data("part-id");
const partNumber = $row.find(".part-number").val();
if (partId !== "new" && partId !== undefined && partId !== null) { if (partId !== "new" && partId !== undefined && partId !== null) {
$.ajax({ $.ajax({
url: "delete_part.php", url: "delete_part.php",
method: "POST", method: "POST",
data: JSON.stringify({part_id: partId}), data: JSON.stringify({ part_id: partId }),
contentType: "application/json", contentType: "application/json",
success: function (response) { success: function (response) {
if (response.success) { if (response.success) {
$row.remove(); $row.remove();
delete partColors[partNumber];
updateRowButtons(); updateRowButtons();
updatePartsList(); updatePartsList();
clearCanvasMarkers(); clearCanvasMarkers(false); // Preserve descriptions
} else { } else {
alert("Errore nell'eliminazione: " + response.message); alert("Errore nell'eliminazione: " + response.message);
} }
}, },
error: function (xhr, status, error) { error: function (xhr, status, error) {
alert("Errore nell'eliminazione: " + error + ". Stato: " + xhr.status + " - " + xhr.responseText); alert(
"Errore nell'eliminazione: " +
error +
". Stato: " +
xhr.status +
" - " +
xhr.responseText,
);
}, },
}); });
} else { } else {
$row.remove(); $row.remove();
delete partColors[partNumber];
updateRowButtons(); updateRowButtons();
updatePartsList(); updatePartsList();
} }
@@ -266,7 +304,6 @@ $(document).ready(function () {
const iddatadb = $("#partsModal").data("iddatadb"); const iddatadb = $("#partsModal").data("iddatadb");
const isMix = partDescription.startsWith("Mix") ? "Y" : "N"; const isMix = partDescription.startsWith("Mix") ? "Y" : "N";
// არსებული part-id row-დან (თუ უკვე არსებობს)
const partId = $row.data("part-id") || null; const partId = $row.data("part-id") || null;
if (partDescription && iddatadb) { if (partDescription && iddatadb) {
@@ -280,7 +317,7 @@ $(document).ready(function () {
iddatadb: iddatadb, iddatadb: iddatadb,
parts: [ parts: [
{ {
id: partId, // გავგზავნე part-ის ID (თუ არის) id: partId,
part_number: partNumber, part_number: partNumber,
part_description: partDescription, part_description: partDescription,
mix: isMix, mix: isMix,
@@ -293,7 +330,6 @@ $(document).ready(function () {
$saveLoading.hide(); $saveLoading.hide();
$saveStatus.show(); $saveStatus.show();
updatePartsList(); updatePartsList();
// თუ ახალია, backend-მა მოგვცა ახალი ID
if (response.part_id) { if (response.part_id) {
$row.attr("data-part-id", response.part_id); $row.attr("data-part-id", response.part_id);
$row.data("part-id", response.part_id); $row.data("part-id", response.part_id);
@@ -312,16 +348,28 @@ $(document).ready(function () {
} }
}); });
$(document).on("change", ".part-color", function () {
const partNumber = $(this).closest("li").data("part-number");
const partColor = $(this).val();
partColors[partNumber] = partColor;
updateMarkers();
markUnsaved();
});
function loadExistingParts(iddatadb) { function loadExistingParts(iddatadb) {
$.ajax({ $.ajax({
url: "load_parts.php", url: "load_parts.php",
method: "GET", method: "GET",
data: {iddatadb: iddatadb}, data: { iddatadb: iddatadb },
success: function (response) { success: function (response) {
if (response.success) { if (response.success) {
$("#partsTableBody").empty(); $("#partsTableBody").empty();
if (response.parts.length > 0) { if (response.parts.length > 0) {
response.parts.forEach((part) => { response.parts.forEach((part) => {
const defaultColor =
part.part_description.startsWith("Mix")
? "#0000ff"
: "#ff0000";
const newRow = ` const newRow = `
<tr data-part-id="${part.id}"> <tr data-part-id="${part.id}">
<td><input type="number" class="form-control form-control-sm part-number" value="${part.part_number}" style="width: 80px;"></td> <td><input type="number" class="form-control form-control-sm part-number" value="${part.part_number}" style="width: 80px;"></td>
@@ -335,6 +383,7 @@ $(document).ready(function () {
</td> </td>
</tr>`; </tr>`;
$("#partsTableBody").append(newRow); $("#partsTableBody").append(newRow);
partColors[part.part_number] = defaultColor;
}); });
} else { } else {
addNewRow(1); addNewRow(1);
@@ -342,7 +391,10 @@ $(document).ready(function () {
updateRowButtons(); updateRowButtons();
updatePartsList(); updatePartsList();
} else { } else {
alert("Errore nel caricamento delle parti: " + response.message); alert(
"Errore nel caricamento delle parti: " +
response.message,
);
addNewRow(1); addNewRow(1);
} }
}, },
@@ -354,27 +406,155 @@ $(document).ready(function () {
} }
function updatePartsList() { function updatePartsList() {
const showMixParts = $("#showMixParts").is(":checked");
$("#partsList").empty(); $("#partsList").empty();
$("#partsTableBody tr").each(function () { $("#partsTableBody tr").each(function () {
const partNumber = $(this).find(".part-number").val(); const partNumber = $(this).find(".part-number").val();
const partDescription = $(this).find(".part-description").val(); const partDescription = $(this).find(".part-description").val();
if (partNumber && partDescription && !partDescription.startsWith("Mix")) { const partColor =
partColors[partNumber] ||
(partDescription.startsWith("Mix") ? "#0000ff" : "#ff0000");
if (
partNumber &&
partDescription &&
(showMixParts || !partDescription.startsWith("Mix"))
) {
const listItem = ` const listItem = `
<li class="list-group-item" data-part-number="${partNumber}"> <li class="list-group-item" data-part-number="${partNumber}">
${partNumber} - ${partDescription} ${partNumber} - ${partDescription}
<div style="display: flex; align-items: center;">
<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> <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>
<input type="color" class="part-color" value="${partColor}" style="margin-left: 5px;">
</div>
</li>`; </li>`;
$("#partsList").append(listItem); $("#partsList").append(listItem);
} }
}); });
updateMarkers();
}
function renumberParts() {
const $rows = $("#partsTableBody tr");
const iddatadb = $("#partsModal").data("iddatadb");
let newPartColors = {};
// Raccogli tutte le righe con i loro dati attuali
let partsData = $rows
.map(function (index) {
const $row = $(this);
const partNumber = $row.find(".part-number").val();
const partDescription = $row.find(".part-description").val();
const partId = $row.data("part-id");
return { partNumber, partDescription, partId };
})
.get();
// Rinumera in modo sequenziale
partsData.forEach((part, index) => {
const newNumber = index + 1;
newPartColors[newNumber] = partColors[part.partNumber] || "#ff0000";
part.partNumber = newNumber;
});
// Aggiorna i valori nella tabella
$rows.each(function (index) {
const $row = $(this);
$row.find(".part-number").val(index + 1);
});
// Aggiorna partColors
partColors = newPartColors;
// Aggiorna i marker nelle annotazioni
const currentPhoto = $("#samplePhoto").attr("src");
if (photoAnnotations[currentPhoto]) {
photoAnnotations[currentPhoto].markers.forEach((marker) => {
const oldPartNumber = marker.partNumber;
const newPartNumber = partsData.find(
(p) => p.partNumber == oldPartNumber,
)?.partNumber;
if (newPartNumber) {
marker.partNumber = newPartNumber;
marker.color = partColors[newPartNumber];
}
});
}
// Salva le modifiche nel database
const partsToSave = partsData.map((part) => ({
id: part.partId || null,
part_number: part.partNumber,
part_description: part.partDescription,
mix: part.partDescription.startsWith("Mix") ? "Y" : "N",
}));
console.log(
"Dati inviati a renumber_parts.php:",
JSON.stringify({ iddatadb: iddatadb, parts: partsToSave }),
);
$.ajax({
url: "renumber_parts.php",
method: "POST",
data: JSON.stringify({
iddatadb: iddatadb,
parts: partsToSave,
}),
contentType: "application/json",
success: function (response) {
console.log("Risposta da renumber_parts.php:", response);
if (response.success) {
$rows.each(function (index) {
const $row = $(this);
const newPartId =
response.part_ids && response.part_ids[index]
? response.part_ids[index]
: $row.data("part-id");
if (newPartId) {
$row.attr("data-part-id", newPartId);
$row.data("part-id", newPartId);
}
const $saveStatus = $row.find(".save-status");
const $saveLoading = $row.find(".save-loading");
$saveLoading.hide();
$saveStatus.show();
setTimeout(() => $saveStatus.hide(), 2000);
});
updatePartsList();
updateMarkers();
updateDescriptions();
markUnsaved();
} else {
console.error("Errore dal server:", response.message);
alert(
"Errore nella rinumerazione delle parti: " +
response.message,
);
}
},
error: function (xhr, status, error) {
console.error("Errore AJAX:", status, error, xhr.responseText);
alert(
"Errore nella rinumerazione delle parti: " +
error +
" - " +
xhr.responseText,
);
},
});
} }
$(document).on("click", ".add-to-mix-btn", function () { $(document).on("click", ".add-to-mix-btn", function () {
const $listItem = $(this).closest("li"); const $listItem = $(this).closest("li");
const partDescription = $listItem.text().split(" - ")[1].trim(); const partDescription = $listItem.text().split(" - ")[1].trim();
const $mixRow = $("#partsTableBody tr").filter(function () { const $mixRow = $("#partsTableBody tr")
return $(this).find(".part-description").val().startsWith("Mix"); .filter(function () {
}).last(); return $(this)
.find(".part-description")
.val()
.startsWith("Mix");
})
.last();
if ($mixRow.length === 0) { if ($mixRow.length === 0) {
alert("Crea prima una riga Mix usando il pulsante 'M'."); alert("Crea prima una riga Mix usando il pulsante 'M'.");
@@ -398,11 +578,22 @@ $(document).ready(function () {
}); });
$("#partsList").on("click", "li", function (e) { $("#partsList").on("click", "li", function (e) {
if ($(e.target).hasClass("add-to-mix-btn")) return; if (
$(e.target).hasClass("add-to-mix-btn") ||
$(e.target).hasClass("part-color")
)
return;
selectedPartNumber = $(this).data("part-number"); selectedPartNumber = $(this).data("part-number");
$(this).addClass("active").siblings().removeClass("active"); $(this).addClass("active").siblings().removeClass("active");
}); });
$("#showMixParts").on("change", function () {
updatePartsList();
});
$("#renumberPartsBtn").on("click", function () {
renumberParts();
});
// =================== // ===================
// MARKERS & DESCRIPTIONS // MARKERS & DESCRIPTIONS
// =================== // ===================
@@ -420,18 +611,35 @@ $(document).ready(function () {
const y = clickY / photoData.scale; const y = clickY / photoData.scale;
const currentPhoto = $("#samplePhoto").attr("src"); const currentPhoto = $("#samplePhoto").attr("src");
if (!photoMarkers[currentPhoto]) photoMarkers[currentPhoto] = []; if (!photoAnnotations[currentPhoto]) {
photoAnnotations[currentPhoto] = {
markers: [],
hasDescriptions: false,
descriptionPosition: { x: 10, y: 10 },
};
}
const existingMarker = photoMarkers[currentPhoto].find(m => m.partNumber == selectedPartNumber); const partColor = partColors[selectedPartNumber] || "#ff0000";
const existingMarker = photoAnnotations[currentPhoto].markers.find(
(m) => m.partNumber == selectedPartNumber,
);
if (existingMarker) { if (existingMarker) {
existingMarker.x = x; existingMarker.x = x;
existingMarker.y = y; existingMarker.y = y;
existingMarker.color = partColor;
} else { } else {
photoMarkers[currentPhoto].push({partNumber: selectedPartNumber, x, y}); photoAnnotations[currentPhoto].markers.push({
partNumber: selectedPartNumber,
x,
y,
color: partColor,
});
} }
updateMarkers(); updateMarkers();
if (hasDescriptions) drawDescriptions(descriptionPosition.x, descriptionPosition.y); updateDescriptions();
markUnsaved();
selectedPartNumber = null; selectedPartNumber = null;
$("#partsList li").removeClass("active"); $("#partsList li").removeClass("active");
@@ -441,17 +649,41 @@ $(document).ready(function () {
const markerContainer = $("#markerContainer"); const markerContainer = $("#markerContainer");
markerContainer.empty(); markerContainer.empty();
// keep overlay sized to canvas display markerContainer.css({
markerContainer.css({width: `${photoData.displayWidth}px`, height: `${photoData.displayHeight}px`}); width: `${photoData.displayWidth}px`,
height: `${photoData.displayHeight}px`,
});
const currentPhoto = $("#samplePhoto").attr("src"); const currentPhoto = $("#samplePhoto").attr("src");
const markers = photoMarkers[currentPhoto] || []; const annotations = photoAnnotations[currentPhoto] || {
markers: [],
hasDescriptions: false,
descriptionPosition: { x: 10, y: 10 },
};
const markers = annotations.markers;
const showMixParts = $("#showMixParts").is(":checked");
markers.forEach((marker) => { markers.forEach((marker) => {
const partRow = $("#partsTableBody tr").filter(function () {
return $(this).find(".part-number").val() == marker.partNumber;
});
const partDescription = partRow.find(".part-description").val();
if (
!showMixParts &&
partDescription &&
partDescription.startsWith("Mix")
) {
return;
}
const scaledX = marker.x * photoData.scale; const scaledX = marker.x * photoData.scale;
const scaledY = marker.y * photoData.scale; const scaledY = marker.y * photoData.scale;
const markerColor =
marker.color || partColors[marker.partNumber] || "#ff0000";
const $marker = $(`<div class="draggable-marker">${marker.partNumber}</div>`).css({ const $marker = $(
`<div class="draggable-marker" style="background: ${markerColor}; border: 1px solid ${markerColor}; color: #ffffff;">${marker.partNumber}</div>`,
).css({
left: scaledX - 8 + "px", left: scaledX - 8 + "px",
top: scaledY - 8 + "px", top: scaledY - 8 + "px",
}); });
@@ -488,15 +720,21 @@ $(document).ready(function () {
currentX = Math.max(0, Math.min(currentX, maxX)); currentX = Math.max(0, Math.min(currentX, maxX));
currentY = Math.max(0, Math.min(currentY, maxY)); currentY = Math.max(0, Math.min(currentY, maxY));
$element.css({left: currentX + "px", top: currentY + "px"}); $element.css({ left: currentX + "px", top: currentY + "px" });
if (item && item.partNumber) { if (item && item.partNumber) {
item.x = (currentX + 8) / photoData.scale; item.x = (currentX + 8) / photoData.scale;
item.y = (currentY + 8) / photoData.scale; item.y = (currentY + 8) / photoData.scale;
markUnsaved();
} else { } else {
// draggable description panel const currentPhoto = $("#samplePhoto").attr("src");
descriptionPosition.x = (currentX + 5) / photoData.scale; if (photoAnnotations[currentPhoto]) {
descriptionPosition.y = (currentY + 5) / photoData.scale; photoAnnotations[currentPhoto].descriptionPosition.x =
(currentX + 5) / photoData.scale;
photoAnnotations[currentPhoto].descriptionPosition.y =
(currentY + 5) / photoData.scale;
markUnsaved();
}
} }
}); });
@@ -508,39 +746,65 @@ $(document).ready(function () {
}); });
} }
function drawDescriptions(x, y) { function updateDescriptions() {
const currentPhoto = $("#samplePhoto").attr("src");
const annotations = photoAnnotations[currentPhoto] || {
markers: [],
hasDescriptions: false,
descriptionPosition: { x: 10, y: 10 },
};
const showMixParts = $("#showMixParts").is(":checked");
const descriptionList = $("#descriptionList");
descriptionList.empty();
if (!annotations.hasDescriptions) {
descriptionList.css("display", "none");
return;
}
const partsList = []; const partsList = [];
$("#partsTableBody tr").each(function () { $("#partsTableBody tr").each(function () {
const partNumber = $(this).find(".part-number").val(); const partNumber = $(this).find(".part-number").val();
const partDescription = $(this).find(".part-description").val(); const partDescription = $(this).find(".part-description").val();
if (partNumber && partDescription && !partDescription.startsWith("Mix")) { if (
partNumber &&
partDescription &&
(showMixParts || !partDescription.startsWith("Mix"))
) {
partsList.push(`${partNumber} ${partDescription}`); partsList.push(`${partNumber} ${partDescription}`);
} }
}); });
const descriptionList = $("#descriptionList");
descriptionList.empty();
descriptionList.css({ descriptionList.css({
display: "block", display: "block",
top: y * photoData.scale + "px", top: annotations.descriptionPosition.y * photoData.scale + "px",
left: x * photoData.scale + "px", left: annotations.descriptionPosition.x * photoData.scale + "px",
}); });
partsList.forEach((part) => descriptionList.append(`<div>${part}</div>`)); partsList.forEach((part) =>
descriptionList.append(`<div>${part}</div>`),
);
updateMarkers(); updateMarkers();
} }
function clearCanvasMarkers() { function clearCanvasMarkers(clearDescriptions = true) {
const currentPhoto = $("#samplePhoto").attr("src"); const currentPhoto = $("#samplePhoto").attr("src");
photoMarkers[currentPhoto] = []; if (clearDescriptions) {
hasDescriptions = false; if (photoAnnotations[currentPhoto]) {
photoAnnotations[currentPhoto].hasDescriptions = false;
photoAnnotations[currentPhoto].descriptionPosition = {
x: 10,
y: 10,
};
}
$("#descriptionList").css("display", "none"); $("#descriptionList").css("display", "none");
}
$("#markerContainer").empty(); $("#markerContainer").empty();
const canvas = document.getElementById("photoCanvas"); const canvas = document.getElementById("photoCanvas");
const ctx = canvas.getContext("2d"); const ctx = canvas.getContext("2d");
// reset canvas to current image (keeps proportions)
canvas.width = photoData.naturalWidth; canvas.width = photoData.naturalWidth;
canvas.height = photoData.naturalHeight; canvas.height = photoData.naturalHeight;
canvas.style.width = `${photoData.displayWidth}px`; canvas.style.width = `${photoData.displayWidth}px`;
@@ -551,22 +815,49 @@ $(document).ready(function () {
if (img[0].naturalWidth) { if (img[0].naturalWidth) {
ctx.drawImage(img.get(0), 0, 0, canvas.width, canvas.height); ctx.drawImage(img.get(0), 0, 0, canvas.width, canvas.height);
} }
markUnsaved();
updateMarkers();
}
function undoLastMarker() {
const currentPhoto = $("#samplePhoto").attr("src");
if (
photoAnnotations[currentPhoto] &&
photoAnnotations[currentPhoto].markers.length > 0
) {
photoAnnotations[currentPhoto].markers.pop();
updateMarkers();
updateDescriptions();
markUnsaved();
}
} }
$("#addDescriptionsBtn").on("click", function () { $("#addDescriptionsBtn").on("click", function () {
hasDescriptions = true; const currentPhoto = $("#samplePhoto").attr("src");
descriptionPosition = {x: 10, y: 10}; if (!photoAnnotations[currentPhoto]) {
drawDescriptions(descriptionPosition.x, descriptionPosition.y); photoAnnotations[currentPhoto] = {
markers: [],
hasDescriptions: false,
descriptionPosition: { x: 10, y: 10 },
};
}
photoAnnotations[currentPhoto].hasDescriptions = true;
updateDescriptions();
makeDraggable($("#descriptionList")); makeDraggable($("#descriptionList"));
markUnsaved();
}); });
$("#removeAnnotationsBtn").on("click", function () { $("#removeAnnotationsBtn").on("click", function () {
clearCanvasMarkers(); clearCanvasMarkers(true); // Remove only descriptions
});
$("#undoMarkerBtn").on("click", function () {
undoLastMarker();
}); });
let unsavedChanges = false; let unsavedChanges = false;
// --- helper functions --- // --- helper functions ---
function markUnsaved() { function markUnsaved() {
if (!unsavedChanges) { if (!unsavedChanges) {
unsavedChanges = true; unsavedChanges = true;
@@ -579,18 +870,13 @@ $(document).ready(function () {
$("#savePhotoBtn").removeClass("unsaved").text("Salva Foto con Nome"); $("#savePhotoBtn").removeClass("unsaved").text("Salva Foto con Nome");
} }
// --- event listeners --- // --- event listeners ---
// როცა ვცვლით input-ს ცხრილში
$(document).on("input change", "#partsTableBody input", markUnsaved); $(document).on("input change", "#partsTableBody input", markUnsaved);
// როცა ვამატებთ/ვშლით რიგს
$(document).on("click", ".add-row, .add-mix-row, .remove-row", markUnsaved); $(document).on("click", ".add-row, .add-mix-row, .remove-row", markUnsaved);
// თუ გაქვს draggable marker ან description list
$(document).on("markerChanged descriptionChanged", markUnsaved); $(document).on("markerChanged descriptionChanged", markUnsaved);
// --- modal close protection --- // --- modal close protection ---
$('#partsModal').on('hide.bs.modal', function (e) { $("#partsModal").on("hide.bs.modal", function (e) {
if (unsavedChanges) { if (unsavedChanges) {
if (!confirm("Hai modifiche non salvate. Vuoi davvero uscire?")) { if (!confirm("Hai modifiche non salvate. Vuoi davvero uscire?")) {
e.preventDefault(); e.preventDefault();
@@ -598,49 +884,57 @@ $(document).ready(function () {
} }
}); });
// --- SAVE BUTTON --- // --- SAVE BUTTON ---
$("#savePhotoBtn").on("click", function () { $("#savePhotoBtn").on("click", function () {
const canvas = document.getElementById("photoCanvas"); const canvas = document.getElementById("photoCanvas");
const ctx = canvas.getContext("2d"); const ctx = canvas.getContext("2d");
const img = $("#samplePhoto"); const img = $("#samplePhoto");
// Ensure canvas is real size
const naturalWidth = img.get(0).naturalWidth; const naturalWidth = img.get(0).naturalWidth;
const naturalHeight = img.get(0).naturalHeight; const naturalHeight = img.get(0).naturalHeight;
canvas.width = naturalWidth; canvas.width = naturalWidth;
canvas.height = naturalHeight; canvas.height = naturalHeight;
// Redraw base image
ctx.drawImage(img.get(0), 0, 0, naturalWidth, naturalHeight); ctx.drawImage(img.get(0), 0, 0, naturalWidth, naturalHeight);
// Descriptions box const currentPhoto = $("#samplePhoto").attr("src");
const annotations = photoAnnotations[currentPhoto] || {
markers: [],
hasDescriptions: false,
descriptionPosition: { x: 10, y: 10 },
};
const showMixParts = $("#showMixParts").is(":checked");
if (annotations.hasDescriptions) {
const partsList = []; const partsList = [];
$("#partsTableBody tr").each(function () { $("#partsTableBody tr").each(function () {
const partNumber = $(this).find(".part-number").val(); const partNumber = $(this).find(".part-number").val();
const partDescription = $(this).find(".part-description").val(); const partDescription = $(this).find(".part-description").val();
if (partNumber && partDescription && !partDescription.startsWith("Mix")) { if (
partNumber &&
partDescription &&
(showMixParts || !partDescription.startsWith("Mix"))
) {
partsList.push(`${partNumber} ${partDescription}`); partsList.push(`${partNumber} ${partDescription}`);
} }
}); });
if (hasDescriptions && partsList.length > 0) { if (partsList.length > 0) {
const fontSize = Math.round(naturalWidth * 0.02); const fontSize = Math.round(naturalWidth * 0.02);
ctx.font = fontSize + "px Arial"; ctx.font = fontSize + "px Arial";
const textHeight = fontSize + 8; const textHeight = fontSize + 8;
const boxWidth = Math.round(naturalWidth * 0.28); const boxWidth = Math.round(naturalWidth * 0.28);
const boxHeight = partsList.length * textHeight + 25; const boxHeight = partsList.length * textHeight + 25;
const x = descriptionPosition.x; const x = annotations.descriptionPosition.x;
const y = descriptionPosition.y; const y = annotations.descriptionPosition.y;
// ჩრდილი
ctx.save(); ctx.save();
ctx.shadowColor = "rgba(0,0,0,0.3)"; ctx.shadowColor = "rgba(0,0,0,0.3)";
ctx.shadowBlur = 8; ctx.shadowBlur = 8;
ctx.shadowOffsetX = 3; ctx.shadowOffsetX = 3;
ctx.shadowOffsetY = 3; ctx.shadowOffsetY = 3;
// ლამაზი ბექგრაუნდი
ctx.fillStyle = "rgba(255, 255, 255, 0.9)"; ctx.fillStyle = "rgba(255, 255, 255, 0.9)";
ctx.beginPath(); ctx.beginPath();
ctx.roundRect(x, y, boxWidth, boxHeight, 12); ctx.roundRect(x, y, boxWidth, boxHeight, 12);
@@ -648,44 +942,41 @@ $(document).ready(function () {
ctx.restore(); ctx.restore();
// ტექსტი
ctx.fillStyle = "#111111"; ctx.fillStyle = "#111111";
partsList.forEach((part, index) => { partsList.forEach((part, index) => {
const domWidth = $("#samplePhoto").width();
const domHeight = $("#samplePhoto").height();
// NATURAL ზომა (ფაილის რეალური ზომა)
const naturalWidth = photoData.naturalWidth;
const naturalHeight = photoData.naturalHeight;
// მასშტაბები
const scaleX = naturalWidth / domWidth;
const scaleY = naturalHeight / domHeight;
// გადაყვანილი კოორდინატები
const x = descriptionPosition.x * scaleX;
const y = descriptionPosition.y * scaleY;
ctx.fillText(part, x + 15, y + 35 + index * textHeight); ctx.fillText(part, x + 15, y + 35 + index * textHeight);
}); });
} }
}
// Markers const markers = annotations.markers;
const currentPhoto = $("#samplePhoto").attr("src");
const markers = photoMarkers[currentPhoto] || [];
markers.forEach((marker) => { markers.forEach((marker) => {
const x = marker.x; // already NATURAL coords const partRow = $("#partsTableBody tr").filter(function () {
return $(this).find(".part-number").val() == marker.partNumber;
});
const partDescription = partRow.find(".part-description").val();
if (
!showMixParts &&
partDescription &&
partDescription.startsWith("Mix")
) {
return;
}
const x = marker.x;
const y = marker.y; const y = marker.y;
const radius = Math.max(5, Math.round(naturalWidth * 0.025)); const radius = Math.max(5, Math.round(naturalWidth * 0.025));
const fontSize = Math.max(8, Math.round(radius * 0.9)); const fontSize = Math.max(8, Math.round(radius * 0.9));
const markerColor =
marker.color || partColors[marker.partNumber] || "#ff0000";
ctx.beginPath(); ctx.beginPath();
ctx.arc(x, y, radius, 0, 2 * Math.PI); ctx.arc(x, y, radius, 0, 2 * Math.PI);
ctx.fillStyle = "rgba(255,0,0,0.85)"; ctx.fillStyle = markerColor; // Use the stored color
ctx.fill(); ctx.fill();
ctx.lineWidth = 3; ctx.lineWidth = 3;
ctx.strokeStyle = "#ffffff"; ctx.strokeStyle = markerColor; // Use the same color for the border
ctx.stroke(); ctx.stroke();
ctx.fillStyle = "#ffffff"; ctx.fillStyle = "#ffffff";
@@ -700,7 +991,10 @@ $(document).ready(function () {
const iddatadb = $("#partsModal").data("iddatadb"); const iddatadb = $("#partsModal").data("iddatadb");
const defaultName = `photo_${iddatadb}_${timestamp}.png`; const defaultName = `photo_${iddatadb}_${timestamp}.png`;
const newName = prompt("Inserisci il nome del file (senza estensione):", defaultName.split(".png")[0]); const newName = prompt(
"Inserisci il nome del file (senza estensione):",
defaultName.split(".png")[0],
);
if (newName) { if (newName) {
const finalName = newName + "_" + timestamp + ".png"; const finalName = newName + "_" + timestamp + ".png";
@@ -710,16 +1004,17 @@ $(document).ready(function () {
data: { data: {
dataURL: dataURL, dataURL: dataURL,
filename: finalName, filename: finalName,
iddatadb: iddatadb iddatadb: iddatadb,
}, },
success: function (response) { success: function (response) {
if (response.success) { if (response.success) {
alert("Foto salvata con successo: " + response.file_path); alert(
"Foto salvata con successo: " + response.file_path,
);
$("#samplePhoto").attr("src", response.file_path); $("#samplePhoto").attr("src", response.file_path);
loadPhoto(iddatadb); loadPhoto(iddatadb);
clearCanvasMarkers(); clearCanvasMarkers(false); // Preserve descriptions
clearUnsaved();
clearUnsaved(); // ✅ reset unsaved status
} else { } else {
alert("Errore: " + response.message); alert("Errore: " + response.message);
} }
+204 -48
View File
@@ -187,6 +187,54 @@ document.addEventListener("DOMContentLoaded", function () {
}); });
} }
// Funzione per gestire il caricamento dei file
async function handleFiles(files, iddatadb) {
const loader = document.getElementById("loader");
if (!loader) {
console.error("Elemento loader non trovato");
return;
}
if (!files || files.length === 0) {
console.warn("Nessun file da caricare");
return;
}
for (const file of files) {
if (!file.type.startsWith("image/")) {
alert("Per favore, carica solo immagini!");
continue;
}
console.log("Inizio upload del file:", file.name);
loader.style.display = "flex";
const formData = new FormData();
formData.append("photo", file);
formData.append("iddatadb", iddatadb);
try {
const response = await fetch("upload_photo.php", {
method: "POST",
body: formData,
});
const result = await response.json();
if (result.success) {
console.log(
"Upload completato con successo, ricarico popup",
);
loadPopupContent(iddatadb);
} else {
alert("Errore durante il caricamento: " + result.message);
}
} catch (error) {
alert("Errore durante il caricamento: " + error.message);
} finally {
console.log("Nascondo loader dopo upload");
loader.style.display = "none";
}
}
}
// Funzione per attaccare gli event listener al contenuto del popup // Funzione per attaccare gli event listener al contenuto del popup
function attachPhotoEventListeners(iddatadb) { function attachPhotoEventListeners(iddatadb) {
const dropArea = document.getElementById("dropArea"); const dropArea = document.getElementById("dropArea");
@@ -332,6 +380,162 @@ document.addEventListener("DOMContentLoaded", function () {
// Inizializza la gestione della webcam // Inizializza la gestione della webcam
setupWebcam(iddatadb); setupWebcam(iddatadb);
// Gestione bottone Crea Collage
const createCollageBtn = document.getElementById("createCollageBtn");
if (createCollageBtn) {
createCollageBtn.addEventListener("click", () => {
console.log("Apertura modale collage");
document.getElementById("collageModal").style.display = "block";
initCollageCanvas();
});
}
// Chiusura modale collage
const closeCollageBtn = document.querySelector(".close-collage");
if (closeCollageBtn) {
closeCollageBtn.addEventListener("click", () => {
console.log("Chiusura modale collage");
document.getElementById("collageModal").style.display = "none";
});
}
// Inizializza canvas con Fabric.js
let canvas;
function initCollageCanvas() {
if (typeof fabric === "undefined") {
console.error("Fabric.js non è caricato!");
alert(
"Errore: Fabric.js non è disponibile. Controlla la connessione al CDN.",
);
return;
}
canvas = new fabric.Canvas("collageCanvas", {
backgroundColor: "#fff",
selection: true,
});
// Abilita ridimensionamento e trascinamento
canvas.on("object:modified", () => canvas.renderAll());
}
// Aggiungi foto selezionate al canvas
const addToCanvasBtn = document.getElementById("addToCanvasBtn");
if (addToCanvasBtn) {
addToCanvasBtn.addEventListener("click", () => {
const checkboxes = document.querySelectorAll(
".photo-checkbox:checked",
);
if (checkboxes.length === 0) {
alert("Seleziona almeno una foto!");
return;
}
checkboxes.forEach((cb) => {
const imgPath = cb.getAttribute("data-path");
fabric.Image.fromURL(imgPath, (img) => {
img.set({
left: Math.random() * 600, // Posizione random iniziale
top: Math.random() * 400,
scaleX: 0.5, // Scala iniziale
scaleY: 0.5,
hasControls: true, // Abilita resize/rotate
hasBorders: true,
});
canvas.add(img);
canvas.renderAll();
});
});
// Deseleziona checkbox dopo aggiunta
checkboxes.forEach((cb) => (cb.checked = false));
});
}
// Salva collage
const saveCollageBtn = document.getElementById("saveCollageBtn");
if (saveCollageBtn) {
saveCollageBtn.addEventListener("click", async () => {
if (canvas.getObjects().length === 0) {
alert("Il canvas è vuoto! Aggiungi almeno una foto.");
return;
}
const dataURL = canvas.toDataURL({
format: "jpeg",
quality: 0.8,
});
const blob = await (await fetch(dataURL)).blob();
const file = new File([blob], `collage_${Date.now()}.jpg`, {
type: "image/jpeg",
});
// Upload come nuova foto
await handleFiles([file], iddatadb);
// Chiudi modale e ricarica popup
document.getElementById("collageModal").style.display = "none";
loadPopupContent(iddatadb);
});
}
// Pulisci canvas
const clearCanvasBtn = document.getElementById("clearCanvasBtn");
if (clearCanvasBtn) {
clearCanvasBtn.addEventListener("click", () => {
canvas.clear();
canvas.setBackgroundColor("#fff");
canvas.renderAll();
});
}
// Gestione livelli delle immagini
const bringToFrontBtn = document.getElementById("bringToFrontBtn");
if (bringToFrontBtn) {
bringToFrontBtn.addEventListener("click", () => {
const activeObject = canvas.getActiveObject();
if (activeObject) {
canvas.bringToFront(activeObject);
canvas.renderAll();
} else {
alert("Seleziona un'immagine sul canvas!");
}
});
}
const sendToBackBtn = document.getElementById("sendToBackBtn");
if (sendToBackBtn) {
sendToBackBtn.addEventListener("click", () => {
const activeObject = canvas.getActiveObject();
if (activeObject) {
canvas.sendToBack(activeObject);
canvas.renderAll();
} else {
alert("Seleziona un'immagine sul canvas!");
}
});
}
const bringForwardBtn = document.getElementById("bringForwardBtn");
if (bringForwardBtn) {
bringForwardBtn.addEventListener("click", () => {
const activeObject = canvas.getActiveObject();
if (activeObject) {
canvas.bringForward(activeObject);
canvas.renderAll();
} else {
alert("Seleziona un'immagine sul canvas!");
}
});
}
const sendBackwardBtn = document.getElementById("sendBackwardBtn");
if (sendBackwardBtn) {
sendBackwardBtn.addEventListener("click", () => {
const activeObject = canvas.getActiveObject();
if (activeObject) {
canvas.sendBackwards(activeObject);
canvas.renderAll();
} else {
alert("Seleziona un'immagine sul canvas!");
}
});
}
// Assicurati che il loader sia nascosto all'apertura del popup // Assicurati che il loader sia nascosto all'apertura del popup
const loader = document.getElementById("loader"); const loader = document.getElementById("loader");
if (loader) { if (loader) {
@@ -340,54 +544,6 @@ document.addEventListener("DOMContentLoaded", function () {
} }
} }
// Funzione per gestire il caricamento dei file
async function handleFiles(files, iddatadb) {
const loader = document.getElementById("loader");
if (!loader) {
console.error("Elemento loader non trovato");
return;
}
if (!files || files.length === 0) {
console.warn("Nessun file da caricare");
return;
}
for (const file of files) {
if (!file.type.startsWith("image/")) {
alert("Per favore, carica solo immagini!");
continue;
}
console.log("Inizio upload del file:", file.name);
loader.style.display = "flex";
const formData = new FormData();
formData.append("photo", file);
formData.append("iddatadb", iddatadb);
try {
const response = await fetch("upload_photo.php", {
method: "POST",
body: formData,
});
const result = await response.json();
if (result.success) {
console.log(
"Upload completato con successo, ricarico popup",
);
loadPopupContent(iddatadb);
} else {
alert("Errore durante il caricamento: " + result.message);
}
} catch (error) {
alert("Errore durante il caricamento: " + error.message);
} finally {
console.log("Nascondo loader dopo upload");
loader.style.display = "none";
}
}
}
// Gestione del pulsante Photos // Gestione del pulsante Photos
const photosButtons = document.querySelectorAll(".photos-btn"); const photosButtons = document.querySelectorAll(".photos-btn");
const photosModal = document.getElementById("photosModal"); const photosModal = document.getElementById("photosModal");
+42 -2
View File
@@ -1,6 +1,10 @@
<?php <?php
// photos_popup.php // photos_popup.php
include('include/headscript.php'); include('include/headscript.php');
// Includi Fabric.js solo per questa pagina
?>
<?php
// Includi l'autoloader di Composer // Includi l'autoloader di Composer
require_once __DIR__ . '/../../vendor/autoload.php'; require_once __DIR__ . '/../../vendor/autoload.php';
@@ -116,7 +120,6 @@ $result->saveToFile($qrCodeFile);
<input type="file" id="photoInput" multiple accept="image/*" style="display: none;"> <input type="file" id="photoInput" multiple accept="image/*" style="display: none;">
</div> </div>
<!-- Area per la webcam --> <!-- Area per la webcam -->
<!-- Area per la webcam -->
<div id="webcamArea" style="display: none; text-align: center; margin-bottom: 20px;"> <div id="webcamArea" style="display: none; text-align: center; margin-bottom: 20px;">
<p>Webcam Preview</p> <p>Webcam Preview</p>
<select id="webcamSelect" style="margin-bottom: 10px; padding: 5px;"> <select id="webcamSelect" style="margin-bottom: 10px; padding: 5px;">
@@ -128,7 +131,8 @@ $result->saveToFile($qrCodeFile);
<button id="closeWebcamBtn" style="padding: 10px 20px; background: #dc3545; color: white; border: none; cursor: pointer;">Close Webcam</button> <button id="closeWebcamBtn" style="padding: 10px 20px; background: #dc3545; color: white; border: none; cursor: pointer;">Close Webcam</button>
</div> </div>
</div> </div>
<button id="openWebcamBtn" style="padding: 10px 20px; background: #007bff; color: white; border: none; cursor: pointer; margin-bottom: 20px;">Take Photo with Webcam</button> <!-- Elenco delle foto --> <button id="openWebcamBtn" style="padding: 10px 20px; background: #007bff; color: white; border: none; cursor: pointer; margin-bottom: 20px;">Take Photo with Webcam</button>
<!-- Elenco delle foto -->
<div id="photosList"> <div id="photosList">
<?php if (empty($photos)): ?> <?php if (empty($photos)): ?>
<p>No Photos present.</p> <p>No Photos present.</p>
@@ -156,6 +160,8 @@ $result->saveToFile($qrCodeFile);
</button> </button>
</div> </div>
<?php endforeach; ?> <?php endforeach; ?>
<!-- Bottone Crea Collage -->
<button id="createCollageBtn" style="padding: 10px 20px; background: #ffc107; color: white; border: none; cursor: pointer; margin-top: 20px;">Crea Collage</button>
<?php endif; ?> <?php endif; ?>
</div> </div>
@@ -164,6 +170,40 @@ $result->saveToFile($qrCodeFile);
<span class="image-modal-close">&times;</span> <span class="image-modal-close">&times;</span>
<img id="enlargedImage" class="image-modal-content" src="" alt="Immagine ingrandita"> <img id="enlargedImage" class="image-modal-content" src="" alt="Immagine ingrandita">
</div> </div>
<!-- Nuovo modale per collage -->
<div id="collageModal" class="modal" style="display: none; position: fixed; z-index: 1002; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.8);">
<div class="modal-content" style="background: white; margin: 5% auto; padding: 20px; width: 80%; max-width: 1200px; position: relative;">
<span class="close-collage" style="position: absolute; top: 10px; right: 20px; font-size: 30px; cursor: pointer;">&times;</span>
<h3>Crea Collage</h3>
<!-- Lista foto selezionabili -->
<div id="collagePhotoList" style="max-height: 200px; overflow-y: auto; margin-bottom: 20px;">
<?php foreach ($photos as $photo): ?>
<div style="display: inline-block; margin: 10px;">
<input type="checkbox" class="photo-checkbox" data-path="../photostrf/<?= htmlspecialchars($photo['file_path']) ?>">
<img src="../photostrf/<?= htmlspecialchars($photo['file_path']) ?>" alt="" style="width: 80px; height: 80px;">
</div>
<?php endforeach; ?>
</div>
<!-- Bottone per aggiungere selezionate al canvas -->
<button id="addToCanvasBtn">Aggiungi Selezionate al Canvas</button>
<!-- Canvas per editing -->
<canvas id="collageCanvas" width="800" height="600" style="border: 1px solid #ccc; margin-top: 20px;"></canvas>
<!-- Bottoni azioni -->
<div style="margin-top: 20px;">
<button id="saveCollageBtn">Salva Collage</button>
<button id="clearCanvasBtn">Pulisci Canvas</button>
<button id="bringToFrontBtn" title="Porta in primo piano">In Alto</button>
<button id="sendToBackBtn" title="Manda in fondo">In Fondo</button>
<button id="bringForwardBtn" title="Sposta avanti di un livello">Avanti</button>
<button id="sendBackwardBtn" title="Sposta indietro di un livello">Indietro</button>
</div>
</div>
</div>
</div> </div>
<style> <style>
+63
View File
@@ -0,0 +1,63 @@
<?php
header('Content-Type: application/json');
include('include/headscript.php');
$dbHandler = DBHandlerSelect::getInstance();
$pdo = $dbHandler->getConnection();
$data = json_decode(file_get_contents('php://input'), true);
$iddatadb = $data['iddatadb'] ?? null;
$parts = $data['parts'] ?? [];
if (!$iddatadb || empty($parts)) {
echo json_encode(['success' => false, 'message' => 'Dati mancanti']);
exit;
}
try {
$pdo->beginTransaction();
// Elimina tutte le parti esistenti per l'iddatadb per evitare conflitti di unicità
$stmt = $pdo->prepare("DELETE FROM identification_parts WHERE iddatadb = :iddatadb");
$stmt->execute([':iddatadb' => $iddatadb]);
// Prepara l'inserimento delle nuove parti
$stmt = $pdo->prepare("
INSERT INTO identification_parts
(iddatadb, part_number, part_description, mix, created_at, updated_at)
VALUES (:iddatadb, :part_number, :part_description, :mix, NOW(), NOW())
");
$part_ids = [];
foreach ($parts as $part) {
$partNumber = $part['part_number'] ?? null;
$partDescription = $part['part_description'] ?? '';
$mix = $part['mix'] ?? 'N';
if (!$partNumber || !$partDescription) {
throw new PDOException("Numero parte o descrizione mancante per parte: " . json_encode($part));
}
$stmt->execute([
':iddatadb' => $iddatadb,
':part_number' => $partNumber,
':part_description' => $partDescription,
':mix' => $mix
]);
$part_ids[] = $pdo->lastInsertId();
}
$pdo->commit();
echo json_encode([
'success' => true,
'part_ids' => $part_ids,
'message' => 'Parti rinumerate con successo'
]);
} catch (PDOException $e) {
$pdo->rollBack();
echo json_encode([
'success' => false,
'message' => 'Errore nel salvataggio: ' . $e->getMessage()
]);
}