Compare commits
13 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 5d6302fa9c | |||
| 3da8ff81c9 | |||
| a36dd02771 | |||
| 0a6fb98476 | |||
| 412dce8941 | |||
| 586226ceaf | |||
| ac09d8d0eb | |||
| 33e3ae059d | |||
| f89dbd0c23 | |||
| 9ba859e15b | |||
| 672e448e9a | |||
| 0749032fbc | |||
| d692614f70 |
@@ -120,4 +120,76 @@ class VisualLimsApiClient
|
||||
|
||||
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;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -31,6 +31,6 @@ Content-Length: 51
|
||||
< strict-transport-security: max-age=2592000
|
||||
< x-powered-by: ASP.NET
|
||||
< x-content-type-options: nosniff
|
||||
< date: Fri, 29 Aug 2025 14:28:29 GMT
|
||||
< date: Sat, 06 Sep 2025 10:24:00 GMT
|
||||
<
|
||||
* Connection #0 to host 93.43.5.102 left intact
|
||||
|
||||
@@ -15,11 +15,11 @@
|
||||
* [HTTP/2] [1] [:scheme: https]
|
||||
* [HTTP/2] [1] [:authority: 93.43.5.102]
|
||||
* [HTTP/2] [1] [:path: /limsapi/api/odata/CustomField(1083)?$expand=CustomFieldsValues]
|
||||
* [HTTP/2] [1] [authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IjQ5MiIsIlhhZlNlY3VyaXR5QXV0aFBhc3NlZCI6IlhhZlNlY3VyaXR5QXV0aFBhc3NlZCIsImh0dHA6Ly9zY2hlbWFzLnhtbHNvYXAub3JnL3dzLzIwMDUvMDUvaWRlbnRpdHkvY2xhaW1zL25hbWUiOiJXZWJBcGlVc2VyIiwiWGFmU2VjdXJpdHkiOiJYYWZTZWN1cml0eSIsIlhhZkxvZ29uUGFyYW1zIjoicTFZS0xVNHQ4a3ZNVFZXeVVncFBUWElzeUFRSktPa29CU1FXRjVmbkY2VUF4Y3RUa3hJTE1rdUI0Z2FHU3JVQSIsImV4cCI6MTc1NjQ4NDkwOSwiaXNzIjoiTXkiLCJhdWQiOiJodHRwOi8vbG9jYWxob3N0OjQyMDAifQ.VPLdAAvg-D2ReaPr7erRrgX70RQsySvuBXN284HFQ74]
|
||||
* [HTTP/2] [1] [authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IjQ5MiIsIlhhZlNlY3VyaXR5QXV0aFBhc3NlZCI6IlhhZlNlY3VyaXR5QXV0aFBhc3NlZCIsImh0dHA6Ly9zY2hlbWFzLnhtbHNvYXAub3JnL3dzLzIwMDUvMDUvaWRlbnRpdHkvY2xhaW1zL25hbWUiOiJXZWJBcGlVc2VyIiwiWGFmU2VjdXJpdHkiOiJYYWZTZWN1cml0eSIsIlhhZkxvZ29uUGFyYW1zIjoicTFZS0xVNHQ4a3ZNVFZXeVVncFBUWElzeUFRSktPa29CU1FXRjVmbkY2VUF4Y3RUa3hJTE1rdUI0Z2FHU3JVQSIsImV4cCI6MTc1NzE2MTQ0MCwiaXNzIjoiTXkiLCJhdWQiOiJodHRwOi8vbG9jYWxob3N0OjQyMDAifQ.UgVN5wzjtR8MRU2xLDFWRHIAYLJTmxF3x7kWeVU11YU]
|
||||
* [HTTP/2] [1] [accept: application/json]
|
||||
> GET /limsapi/api/odata/CustomField(1083)?$expand=CustomFieldsValues HTTP/2
|
||||
Host: 93.43.5.102
|
||||
Authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IjQ5MiIsIlhhZlNlY3VyaXR5QXV0aFBhc3NlZCI6IlhhZlNlY3VyaXR5QXV0aFBhc3NlZCIsImh0dHA6Ly9zY2hlbWFzLnhtbHNvYXAub3JnL3dzLzIwMDUvMDUvaWRlbnRpdHkvY2xhaW1zL25hbWUiOiJXZWJBcGlVc2VyIiwiWGFmU2VjdXJpdHkiOiJYYWZTZWN1cml0eSIsIlhhZkxvZ29uUGFyYW1zIjoicTFZS0xVNHQ4a3ZNVFZXeVVncFBUWElzeUFRSktPa29CU1FXRjVmbkY2VUF4Y3RUa3hJTE1rdUI0Z2FHU3JVQSIsImV4cCI6MTc1NjQ4NDkwOSwiaXNzIjoiTXkiLCJhdWQiOiJodHRwOi8vbG9jYWxob3N0OjQyMDAifQ.VPLdAAvg-D2ReaPr7erRrgX70RQsySvuBXN284HFQ74
|
||||
Authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IjQ5MiIsIlhhZlNlY3VyaXR5QXV0aFBhc3NlZCI6IlhhZlNlY3VyaXR5QXV0aFBhc3NlZCIsImh0dHA6Ly9zY2hlbWFzLnhtbHNvYXAub3JnL3dzLzIwMDUvMDUvaWRlbnRpdHkvY2xhaW1zL25hbWUiOiJXZWJBcGlVc2VyIiwiWGFmU2VjdXJpdHkiOiJYYWZTZWN1cml0eSIsIlhhZkxvZ29uUGFyYW1zIjoicTFZS0xVNHQ4a3ZNVFZXeVVncFBUWElzeUFRSktPa29CU1FXRjVmbkY2VUF4Y3RUa3hJTE1rdUI0Z2FHU3JVQSIsImV4cCI6MTc1NzE2MTQ0MCwiaXNzIjoiTXkiLCJhdWQiOiJodHRwOi8vbG9jYWxob3N0OjQyMDAifQ.UgVN5wzjtR8MRU2xLDFWRHIAYLJTmxF3x7kWeVU11YU
|
||||
Accept: application/json
|
||||
|
||||
< HTTP/2 200
|
||||
@@ -30,6 +30,6 @@ Accept: application/json
|
||||
< odata-version: 4.0
|
||||
< x-powered-by: ASP.NET
|
||||
< x-content-type-options: nosniff
|
||||
< date: Fri, 29 Aug 2025 14:28:33 GMT
|
||||
< date: Sat, 06 Sep 2025 10:24:02 GMT
|
||||
<
|
||||
* Connection #0 to host 93.43.5.102 left intact
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -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()
|
||||
]);
|
||||
}
|
||||
@@ -948,6 +948,7 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
</div>
|
||||
<?php include('jsinclude.php'); ?>
|
||||
<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="parts.js"></script>
|
||||
<script src="tracking.js"></script>
|
||||
|
||||
+1084
-56
File diff suppressed because one or more lines are too long
+262
-150
@@ -21,8 +21,8 @@ if ($_SERVER['REQUEST_METHOD'] !== 'POST' || !isset($_POST['template_id']) || !i
|
||||
|
||||
$template_id = intval($_POST['template_id']) ?? $_SESSION['template_id'];
|
||||
$selected_rows = $_POST['selected_rows'] ?? $_SESSION['selected_rows'];
|
||||
$columns = json_decode($_POST['columns'], true) ?? $_SESSION['columns']; // Header dell'XLS
|
||||
$rows = json_decode($_POST['rows'], true) ?? $_SESSION['rows']; // Dati dell'XLS
|
||||
$columns = json_decode($_POST['columns'], true) ?? $_SESSION['columns'];
|
||||
$rows = json_decode($_POST['rows'], true) ?? $_SESSION['rows'];
|
||||
$newFilename = htmlspecialchars($_POST['filename']) ?? $_SESSION['filename'];
|
||||
|
||||
// Log dei dati ricevuti
|
||||
@@ -31,7 +31,7 @@ error_log("Columns: " . json_encode($columns));
|
||||
error_log("Rows: " . json_encode($rows));
|
||||
|
||||
// Recupera l'ID dell'utente loggato
|
||||
$user_id = $iduserlogin ?? 1; // Default a 1 se non definito
|
||||
$user_id = $iduserlogin ?? 1;
|
||||
|
||||
$db = DBHandlerSelect::getInstance();
|
||||
$pdo = $db->getConnection();
|
||||
@@ -98,26 +98,26 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
<?php include('cssinclude.php'); ?>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2Lw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
||||
<style>
|
||||
/* Colori pastello per input/select */
|
||||
.cell-changed {
|
||||
background-color: #fff3b0 !important;
|
||||
transition: background-color 0.3s ease;
|
||||
}
|
||||
|
||||
input.auto-input,
|
||||
select.auto-input {
|
||||
background-color: #d4edda;
|
||||
/* Verde pastello */
|
||||
}
|
||||
|
||||
input.manual-input,
|
||||
select.manual-input {
|
||||
background-color: #fff3cd;
|
||||
/* Giallino pastello */
|
||||
}
|
||||
|
||||
input.required-input,
|
||||
select.required-input {
|
||||
background-color: #f8d7da;
|
||||
/* Rossino chiaro */
|
||||
}
|
||||
|
||||
/* Stili base per input/select */
|
||||
input,
|
||||
select {
|
||||
width: 100%;
|
||||
@@ -128,14 +128,11 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
/* Mantieni leggibilità del testo */
|
||||
input,
|
||||
select {
|
||||
color: #333;
|
||||
/* Colore scuro per contrasto */
|
||||
}
|
||||
|
||||
/* Stili per i badge di stato */
|
||||
.status-badge {
|
||||
display: inline-block;
|
||||
padding: 2px 8px;
|
||||
@@ -161,7 +158,6 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* Stili esistenti rimangono invariati */
|
||||
.grid-container {
|
||||
overflow-x: auto;
|
||||
max-width: 100%;
|
||||
@@ -254,6 +250,11 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.grid-top .save-all-cell {
|
||||
flex: 0 0 210px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.propagate-btn {
|
||||
background: none;
|
||||
border: none;
|
||||
@@ -370,7 +371,6 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
|
||||
}
|
||||
|
||||
/* Stile per l'header dei pulsanti combinati */
|
||||
.grid-cell.button-cell,
|
||||
.grid-header.button-header {
|
||||
min-width: 210px !important;
|
||||
@@ -391,6 +391,20 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
background-color: #d4edda !important;
|
||||
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>
|
||||
<title>Edit Imported Data - <?= htmlspecialchars($titlewebsite, ENT_QUOTES, 'UTF-8'); ?></title>
|
||||
</head>
|
||||
@@ -413,6 +427,7 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
<h6 class="mb-0">Modifica Dati Importati</h6>
|
||||
<div id="unsavedChanges" style="display:none; color: red; font-weight: bold; margin:10px 0;">
|
||||
⚠️ Unsaved changes detected! Please save before leaving this page.
|
||||
<ul id="changedFields" style="margin-top:5px; font-weight:normal; color:darkred;"></ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -420,9 +435,10 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
<div class="card-body">
|
||||
<form id="editForm">
|
||||
<div class="grid-container">
|
||||
<!-- Riga superiore per gli input dei campi manuali -->
|
||||
<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): ?>
|
||||
<div class="grid-cell" style="flex: 0 0 150px;">
|
||||
<?php
|
||||
@@ -450,9 +466,8 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<div class="grid-cell" style="flex: 0 0 150px;"></div> <!-- status -->
|
||||
<div class="grid-cell" style="flex: 0 0 150px;"></div>
|
||||
<?php
|
||||
// Campi automatici (is_manual = 0) escluso main_field
|
||||
$autoIndex = 0;
|
||||
foreach ($allMappings as $mapping) {
|
||||
if (!$mapping['is_manual'] && $mapping['main_field'] != 1) {
|
||||
@@ -471,7 +486,6 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
$autoIndex++;
|
||||
}
|
||||
}
|
||||
// Campi manuali (is_manual = 1) escluso main_field
|
||||
$manualIndex = 0;
|
||||
foreach ($allMappings as $mapping) {
|
||||
if ($mapping['is_manual'] && $mapping['main_field'] != 1) {
|
||||
@@ -483,7 +497,7 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
if ($mapping['is_required']) $inputClass .= ' required-input';
|
||||
echo "<div class='grid-cell' style='flex: 0 0 150px;'>";
|
||||
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 "</select>";
|
||||
} elseif ($mapping['data_type'] === 'DATE') {
|
||||
@@ -498,15 +512,14 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
$manualIndex++;
|
||||
}
|
||||
}
|
||||
echo "<div class='grid-cell' style='flex: 0 0 200px;'></div>"; // AWB
|
||||
echo "<div class='grid-cell' style='flex: 0 0 250px;'></div>"; // Tracking Info
|
||||
echo "<div class='grid-cell' style='flex: 0 0 150px;'></div>"; // importreferencecode
|
||||
echo "<div class='grid-cell' style='flex: 0 0 150px;'></div>"; // filename_import
|
||||
echo "<div class='grid-cell' style='flex: 0 0 150px;'></div>"; // importdate
|
||||
echo "<div class='grid-cell' style='flex: 0 0 200px;'></div>";
|
||||
echo "<div class='grid-cell' style='flex: 0 0 250px;'></div>";
|
||||
echo "<div class='grid-cell' style='flex: 0 0 150px;'></div>";
|
||||
echo "<div class='grid-cell' style='flex: 0 0 150px;'></div>";
|
||||
echo "<div class='grid-cell' style='flex: 0 0 150px;'></div>";
|
||||
?>
|
||||
</div>
|
||||
|
||||
<!-- Header della tabella -->
|
||||
<div class="grid-row">
|
||||
<div class="grid-header button-header" style="flex: 0 0 210px;">Actions</div>
|
||||
<?php if ($mainFieldMapping): ?>
|
||||
@@ -543,11 +556,14 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
?>
|
||||
</div>
|
||||
|
||||
<!-- Righe della tabella -->
|
||||
<?php foreach ($importedData as $index => $row): ?>
|
||||
<div class="grid-row" data-id="<?= $row['iddatadb'] ?>">
|
||||
<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>
|
||||
<?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="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>
|
||||
@@ -692,27 +708,227 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
</div>
|
||||
<?php include('jsinclude.php'); ?>
|
||||
<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="parts.js"></script>
|
||||
<script src="tracking.js"></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() {
|
||||
console.log("Page loaded, initializing event listeners");
|
||||
|
||||
const inputs = document.querySelectorAll(".cell-input, .dropdown-select, .carrier-select, .awb-input");
|
||||
const unsavedDiv = document.getElementById("unsavedChanges");
|
||||
const changedList = document.getElementById("changedFields");
|
||||
let hasChanges = false;
|
||||
let changedFields = {};
|
||||
|
||||
function renderChangedList() {
|
||||
console.log("Rendering changed fields list:", changedFields);
|
||||
changedList.innerHTML = "";
|
||||
Object.keys(changedFields).forEach(rowIndex => {
|
||||
const fields = changedFields[rowIndex];
|
||||
if (fields.length > 0) {
|
||||
const li = document.createElement("li");
|
||||
li.textContent = `Row ${parseInt(rowIndex) + 1}: ${fields.join(", ")}`;
|
||||
changedList.appendChild(li);
|
||||
}
|
||||
});
|
||||
unsavedDiv.style.display = Object.keys(changedFields).length > 0 ? "block" : "none";
|
||||
}
|
||||
|
||||
inputs.forEach(el => {
|
||||
el.addEventListener("change", () => {
|
||||
console.log("Input changed:", el.name);
|
||||
hasChanges = true;
|
||||
unsavedDiv.style.display = "block";
|
||||
const gridCell = el.closest(".grid-cell");
|
||||
const colIndex = gridCell?.dataset.index;
|
||||
const rowIndex = gridCell?.dataset.row;
|
||||
let label = "Unknown field";
|
||||
|
||||
if (colIndex) {
|
||||
const header = document.querySelector(`.grid-header[data-index="${colIndex}"]`);
|
||||
if (header) {
|
||||
label = header.textContent.replace(":", "").trim();
|
||||
}
|
||||
}
|
||||
|
||||
if (rowIndex !== undefined) {
|
||||
if (!changedFields[rowIndex]) {
|
||||
changedFields[rowIndex] = [];
|
||||
}
|
||||
if (!changedFields[rowIndex].includes(label)) {
|
||||
changedFields[rowIndex].push(label);
|
||||
}
|
||||
gridCell.classList.add("cell-changed");
|
||||
}
|
||||
|
||||
renderChangedList();
|
||||
});
|
||||
});
|
||||
|
||||
document.querySelectorAll(".save-btn").forEach(btn => {
|
||||
btn.addEventListener("click", () => {
|
||||
hasChanges = false;
|
||||
unsavedDiv.style.display = "none";
|
||||
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();
|
||||
|
||||
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);
|
||||
|
||||
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();
|
||||
hasChanges = Object.keys(changedFields).length > 0;
|
||||
}
|
||||
|
||||
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}"]`)
|
||||
.forEach(cell => cell.classList.remove("cell-changed"));
|
||||
}
|
||||
} else {
|
||||
errorMessages.push(`Riga ${parseInt(rowIndex) + 1}: ${data.message}`);
|
||||
}
|
||||
} 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) {
|
||||
@@ -723,9 +939,9 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
console.log("Initializing cell expansion and propagation");
|
||||
const inputs = document.querySelectorAll('.cell-input');
|
||||
inputs.forEach(input => {
|
||||
input.addEventListener('focus', function() {
|
||||
@@ -736,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');
|
||||
propagateButtons.forEach(button => {
|
||||
button.addEventListener('click', function() {
|
||||
console.log("Propagating value for column:", this.getAttribute('data-column'));
|
||||
const column = this.getAttribute('data-column');
|
||||
const input = this.previousElementSibling;
|
||||
const value = input.value;
|
||||
@@ -796,6 +974,7 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
if (targetInput) {
|
||||
targetInput.value = value;
|
||||
if (targetInput.tagName === 'SELECT') {
|
||||
targetInput.setAttribute('data-selected-value', value);
|
||||
const event = new Event('change');
|
||||
targetInput.dispatchEvent(event);
|
||||
}
|
||||
@@ -813,6 +992,7 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
let columnIndex = 0;
|
||||
resizers.forEach(resizer => {
|
||||
resizer.addEventListener('mousedown', function(e) {
|
||||
console.log("Starting column resize");
|
||||
currentResizer = resizer;
|
||||
const header = resizer.parentElement;
|
||||
columnIndex = header.getAttribute('data-index');
|
||||
@@ -835,6 +1015,7 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
|
||||
function stopResize() {
|
||||
if (currentResizer) {
|
||||
console.log("Stopping column resize");
|
||||
document.removeEventListener('mousemove', resize);
|
||||
document.removeEventListener('mouseup', stopResize);
|
||||
currentResizer = null;
|
||||
@@ -845,11 +1026,15 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
</script>
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
console.log("Initializing dropdown population");
|
||||
const dropdownData = {};
|
||||
|
||||
async function populateDropdowns() {
|
||||
const dropdowns = document.querySelectorAll('.dropdown-select');
|
||||
if (dropdowns.length === 0) return;
|
||||
if (dropdowns.length === 0) {
|
||||
console.log("No dropdowns found");
|
||||
return;
|
||||
}
|
||||
|
||||
const uniqueFieldIds = [
|
||||
...new Set(Array.from(dropdowns).map(d => d.getAttribute('data-field-id')))
|
||||
@@ -858,31 +1043,34 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
const missingFieldIds = uniqueFieldIds.filter(fieldId => !dropdownData[fieldId]);
|
||||
|
||||
if (missingFieldIds.length > 0) {
|
||||
console.log("Fetching dropdown data for field IDs:", missingFieldIds);
|
||||
try {
|
||||
const response = await fetch(
|
||||
`get_customfield_values.php?field_ids=${missingFieldIds.join(",")}`
|
||||
);
|
||||
if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
|
||||
const data = await response.json();
|
||||
|
||||
if (data.error) {
|
||||
console.error("Errore fetch multiplo:", data.error);
|
||||
console.error("Fetch error:", data.error);
|
||||
} else {
|
||||
for (const fieldId of Object.keys(data)) {
|
||||
dropdownData[fieldId] = data[fieldId] || [];
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Errore generale nel fetch multiplo:", error);
|
||||
console.error("Fetch error:", error);
|
||||
}
|
||||
}
|
||||
|
||||
dropdowns.forEach(dropdown => {
|
||||
const fieldId = dropdown.getAttribute('data-field-id');
|
||||
const selectedValue = dropdown.getAttribute('data-selected-value') || '';
|
||||
const currentValue = dropdown.value; // Preserva il valore corrente
|
||||
const currentValue = dropdown.value;
|
||||
|
||||
if (!fieldId || !dropdownData[fieldId]) {
|
||||
dropdown.innerHTML = '<option value="">Errore nel caricamento</option>';
|
||||
console.warn(`No data for fieldId ${fieldId}`);
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -891,7 +1079,6 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
const option = document.createElement('option');
|
||||
option.value = value.IdCustomFieldsValue;
|
||||
option.textContent = value.Valore;
|
||||
// Usa il valore corrente se disponibile, altrimenti usa data-selected-value
|
||||
if (currentValue && currentValue === String(value.IdCustomFieldsValue)) {
|
||||
option.selected = true;
|
||||
} else if (!currentValue && selectedValue === String(value.IdCustomFieldsValue)) {
|
||||
@@ -902,87 +1089,12 @@ foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {
|
||||
|
||||
if ((currentValue || selectedValue) && dropdown.value !== (currentValue || selectedValue)) {
|
||||
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();
|
||||
|
||||
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>
|
||||
</body>
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
<!-- Modal -->
|
||||
<div class="modal fade" id="partsModal" tabindex="-1" aria-labelledby="partsModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-xl" style="max-width: 80% !important; width: 80% !important;">
|
||||
<div class="modal-content">
|
||||
@@ -8,7 +9,14 @@
|
||||
<div class="modal-body">
|
||||
<div class="row">
|
||||
<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>
|
||||
<table class="table table-striped table-sm mt-3" id="partsTable">
|
||||
<thead>
|
||||
@@ -49,8 +57,8 @@
|
||||
</div>
|
||||
<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-warning btn-sm" id="removeBackgroundBtn" style="padding: 0.1rem 0.5rem; font-size: 0.8rem;">Rimuovi Sfondo</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-secondary btn-sm" data-bs-dismiss="modal" style="padding: 0.1rem 0.5rem; font-size: 0.8rem;">Chiudi</button>
|
||||
</div>
|
||||
@@ -99,12 +107,21 @@
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
#partsList .list-group-item:hover {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
#partsList input[type="color"] {
|
||||
width: 30px;
|
||||
height: 24px;
|
||||
padding: 0;
|
||||
margin-left: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.draggable-description {
|
||||
position: absolute;
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
@@ -121,8 +138,6 @@
|
||||
position: absolute;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background: rgba(255, 0, 0, 0.5);
|
||||
border: 1px solid #ff0000;
|
||||
border-radius: 50%;
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
@@ -151,15 +166,16 @@
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
/* Modifiche non salvate */
|
||||
/* Unsaved changes */
|
||||
#savePhotoBtn.unsaved {
|
||||
background-color: #dc3545 !important;
|
||||
/* Rosso */
|
||||
border-color: #dc3545 !important;
|
||||
color: white !important;
|
||||
animation: pulse 1.2s infinite;
|
||||
}
|
||||
|
||||
/* Animazione di pulsazione */
|
||||
/* Animazione pulsante */
|
||||
@keyframes pulse {
|
||||
0% {
|
||||
box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.7);
|
||||
|
||||
+428
-186
@@ -1,11 +1,6 @@
|
||||
$(document).ready(function () {
|
||||
console.log("parts.js caricato correttamente");
|
||||
|
||||
// ===================
|
||||
// CONFIGURAZIONE API Remove.bg
|
||||
// ===================
|
||||
const REMOVE_BG_API_KEY = "E85XGT5heTBUtWsf9zMLM7cg"; // Sostituisci con la tua chiave API
|
||||
|
||||
// ===================
|
||||
// GLOBAL STATE
|
||||
// ===================
|
||||
@@ -17,22 +12,21 @@ $(document).ready(function () {
|
||||
scale: 1,
|
||||
};
|
||||
|
||||
let photoMarkers = {};
|
||||
let selectedPartNumber = null;
|
||||
let descriptionPosition = { x: 10, y: 10 };
|
||||
let hasDescriptions = false;
|
||||
// annotations keyed by photo src
|
||||
let photoAnnotations = {};
|
||||
// colors keyed by part number
|
||||
let partColors = {};
|
||||
|
||||
// Verifica inizializzazione del pulsante
|
||||
console.log(
|
||||
"Verifica pulsante #removeBackgroundBtn:",
|
||||
$("#removeBackgroundBtn").length,
|
||||
);
|
||||
// selection
|
||||
let selectedPartNumber = null;
|
||||
|
||||
// ===================
|
||||
// POPUP HANDLING
|
||||
// ===================
|
||||
const partsButtons = document.querySelectorAll(".parts-btn");
|
||||
const partsModal = document.getElementById("partsModal");
|
||||
const closeBtn = document.querySelector("#partsModal .close-btn");
|
||||
const overlay = document.querySelector(".overlay");
|
||||
|
||||
partsButtons.forEach((button) => {
|
||||
button.addEventListener("click", function () {
|
||||
@@ -57,24 +51,39 @@ $(document).ready(function () {
|
||||
if (partsModal) {
|
||||
const modal = new bootstrap.Modal(partsModal);
|
||||
modal.show();
|
||||
console.log("Modale aperto");
|
||||
} else {
|
||||
console.error("Modal Parts non trovato");
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
if (closeBtn) {
|
||||
closeBtn.addEventListener("click", function () {
|
||||
partsModal.style.display = "none";
|
||||
overlay.style.display = "none";
|
||||
document.body.style.pointerEvents = "auto";
|
||||
});
|
||||
}
|
||||
|
||||
if (partsModal) {
|
||||
window.addEventListener("click", function (event) {
|
||||
if (event.target === partsModal) {
|
||||
partsModal.style.display = "none";
|
||||
overlay.style.display = "none";
|
||||
document.body.style.pointerEvents = "auto";
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// ===================
|
||||
// PHOTO LOADERS
|
||||
// ===================
|
||||
function loadPhoto(iddatadb) {
|
||||
console.log("Caricamento foto per iddatadb:", iddatadb);
|
||||
$.ajax({
|
||||
url: "load_photo.php",
|
||||
method: "GET",
|
||||
data: { iddatadb: iddatadb },
|
||||
success: function (response) {
|
||||
console.log("Risposta load_photo.php:", response);
|
||||
if (response.success) {
|
||||
if (response.photos && response.photos.length > 1) {
|
||||
showPhotoSelector(response.photos);
|
||||
@@ -86,25 +95,21 @@ $(document).ready(function () {
|
||||
} else {
|
||||
$("#samplePhoto").attr("src", "");
|
||||
alert("Nessuna foto trovata per questo TRF.");
|
||||
console.log("Nessuna foto trovata");
|
||||
}
|
||||
} else {
|
||||
alert(
|
||||
response.message ||
|
||||
"Errore nel caricamento della foto.",
|
||||
);
|
||||
console.error("Errore load_photo.php:", response.message);
|
||||
}
|
||||
},
|
||||
error: function (xhr, status, error) {
|
||||
alert("Errore nel caricamento della foto: " + error);
|
||||
console.error("Errore AJAX load_photo.php:", error, xhr.status);
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function showPhotoSelector(photos) {
|
||||
console.log("Mostra selettore foto:", photos);
|
||||
const selectorContainer = $("#photoSelectorContainer");
|
||||
selectorContainer.empty();
|
||||
|
||||
@@ -135,17 +140,11 @@ $(document).ready(function () {
|
||||
}
|
||||
|
||||
function loadSinglePhoto(photoPath) {
|
||||
console.log("Caricamento singola foto:", photoPath);
|
||||
const img = $("#samplePhoto");
|
||||
img.off("load");
|
||||
img.off("load"); // avoid stacking multiple handlers
|
||||
img.attr("src", photoPath);
|
||||
|
||||
img.on("load", function () {
|
||||
console.log(
|
||||
"Immagine caricata, dimensioni naturali:",
|
||||
img[0].naturalWidth,
|
||||
img[0].naturalHeight,
|
||||
);
|
||||
const canvas = document.getElementById("photoCanvas");
|
||||
const ctx = canvas.getContext("2d");
|
||||
|
||||
@@ -189,13 +188,7 @@ $(document).ready(function () {
|
||||
ctx.drawImage(img.get(0), 0, 0, naturalWidth, naturalHeight);
|
||||
|
||||
updateMarkers();
|
||||
if (hasDescriptions)
|
||||
drawDescriptions(descriptionPosition.x, descriptionPosition.y);
|
||||
});
|
||||
|
||||
img.on("error", function () {
|
||||
console.error("Errore caricamento immagine:", photoPath);
|
||||
alert("Errore nel caricamento dell'immagine.");
|
||||
updateDescriptions();
|
||||
});
|
||||
}
|
||||
|
||||
@@ -204,6 +197,7 @@ $(document).ready(function () {
|
||||
// ===================
|
||||
function addNewRow(nextPartNumber, isMix = false) {
|
||||
const description = isMix ? "Mix" : "";
|
||||
const defaultColor = isMix ? "#0000ff" : "#ff0000";
|
||||
const newRow = `
|
||||
<tr data-part-id="">
|
||||
<td><input type="number" class="form-control form-control-sm part-number" value="${nextPartNumber || 1}" style="width: 80px;"></td>
|
||||
@@ -218,6 +212,9 @@ $(document).ready(function () {
|
||||
</tr>`;
|
||||
$("#partsTableBody").append(newRow);
|
||||
updateRowButtons();
|
||||
// Initialize color for the new part
|
||||
const partNumber = nextPartNumber || 1;
|
||||
partColors[partNumber] = defaultColor;
|
||||
}
|
||||
|
||||
function updateRowButtons() {
|
||||
@@ -259,6 +256,7 @@ $(document).ready(function () {
|
||||
e.preventDefault();
|
||||
const $row = $(this).closest("tr");
|
||||
const partId = $row.data("part-id");
|
||||
const partNumber = $row.find(".part-number").val();
|
||||
|
||||
if (partId !== "new" && partId !== undefined && partId !== null) {
|
||||
$.ajax({
|
||||
@@ -269,9 +267,10 @@ $(document).ready(function () {
|
||||
success: function (response) {
|
||||
if (response.success) {
|
||||
$row.remove();
|
||||
delete partColors[partNumber];
|
||||
updateRowButtons();
|
||||
updatePartsList();
|
||||
clearCanvasMarkers();
|
||||
clearCanvasMarkers(false); // Preserve descriptions
|
||||
} else {
|
||||
alert("Errore nell'eliminazione: " + response.message);
|
||||
}
|
||||
@@ -289,6 +288,7 @@ $(document).ready(function () {
|
||||
});
|
||||
} else {
|
||||
$row.remove();
|
||||
delete partColors[partNumber];
|
||||
updateRowButtons();
|
||||
updatePartsList();
|
||||
}
|
||||
@@ -348,18 +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) {
|
||||
console.log("Caricamento parti esistenti per iddatadb:", iddatadb);
|
||||
$.ajax({
|
||||
url: "load_parts.php",
|
||||
method: "GET",
|
||||
data: { iddatadb: iddatadb },
|
||||
success: function (response) {
|
||||
console.log("Risposta load_parts.php:", response);
|
||||
if (response.success) {
|
||||
$("#partsTableBody").empty();
|
||||
if (response.parts.length > 0) {
|
||||
response.parts.forEach((part) => {
|
||||
const defaultColor =
|
||||
part.part_description.startsWith("Mix")
|
||||
? "#0000ff"
|
||||
: "#ff0000";
|
||||
const newRow = `
|
||||
<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>
|
||||
@@ -373,6 +383,7 @@ $(document).ready(function () {
|
||||
</td>
|
||||
</tr>`;
|
||||
$("#partsTableBody").append(newRow);
|
||||
partColors[part.part_number] = defaultColor;
|
||||
});
|
||||
} else {
|
||||
addNewRow(1);
|
||||
@@ -384,36 +395,153 @@ $(document).ready(function () {
|
||||
"Errore nel caricamento delle parti: " +
|
||||
response.message,
|
||||
);
|
||||
console.error("Errore load_parts.php:", response.message);
|
||||
addNewRow(1);
|
||||
}
|
||||
},
|
||||
error: function (xhr, status, error) {
|
||||
alert("Errore nel caricamento delle parti: " + error);
|
||||
console.error("Errore AJAX load_parts.php:", error, xhr.status);
|
||||
addNewRow(1);
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function updatePartsList() {
|
||||
const showMixParts = $("#showMixParts").is(":checked");
|
||||
$("#partsList").empty();
|
||||
$("#partsTableBody tr").each(function () {
|
||||
const partNumber = $(this).find(".part-number").val();
|
||||
const partDescription = $(this).find(".part-description").val();
|
||||
const partColor =
|
||||
partColors[partNumber] ||
|
||||
(partDescription.startsWith("Mix") ? "#0000ff" : "#ff0000");
|
||||
if (
|
||||
partNumber &&
|
||||
partDescription &&
|
||||
!partDescription.startsWith("Mix")
|
||||
(showMixParts || !partDescription.startsWith("Mix"))
|
||||
) {
|
||||
const listItem = `
|
||||
<li class="list-group-item" data-part-number="${partNumber}">
|
||||
${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>
|
||||
<input type="color" class="part-color" value="${partColor}" style="margin-left: 5px;">
|
||||
</div>
|
||||
</li>`;
|
||||
$("#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 () {
|
||||
@@ -450,11 +578,22 @@ $(document).ready(function () {
|
||||
});
|
||||
|
||||
$("#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");
|
||||
$(this).addClass("active").siblings().removeClass("active");
|
||||
});
|
||||
|
||||
$("#showMixParts").on("change", function () {
|
||||
updatePartsList();
|
||||
});
|
||||
|
||||
$("#renumberPartsBtn").on("click", function () {
|
||||
renumberParts();
|
||||
});
|
||||
// ===================
|
||||
// MARKERS & DESCRIPTIONS
|
||||
// ===================
|
||||
@@ -468,29 +607,39 @@ $(document).ready(function () {
|
||||
const clickX = e.clientX - rect.left;
|
||||
const clickY = e.clientY - rect.top;
|
||||
|
||||
const x = clickX / photoData.scale;
|
||||
const x = clickX / photoData.scale; // convert to NATURAL coords
|
||||
const y = clickY / photoData.scale;
|
||||
|
||||
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(
|
||||
const partColor = partColors[selectedPartNumber] || "#ff0000";
|
||||
|
||||
const existingMarker = photoAnnotations[currentPhoto].markers.find(
|
||||
(m) => m.partNumber == selectedPartNumber,
|
||||
);
|
||||
if (existingMarker) {
|
||||
existingMarker.x = x;
|
||||
existingMarker.y = y;
|
||||
existingMarker.color = partColor;
|
||||
} else {
|
||||
photoMarkers[currentPhoto].push({
|
||||
photoAnnotations[currentPhoto].markers.push({
|
||||
partNumber: selectedPartNumber,
|
||||
x,
|
||||
y,
|
||||
color: partColor,
|
||||
});
|
||||
}
|
||||
|
||||
updateMarkers();
|
||||
if (hasDescriptions)
|
||||
drawDescriptions(descriptionPosition.x, descriptionPosition.y);
|
||||
updateDescriptions();
|
||||
markUnsaved();
|
||||
|
||||
selectedPartNumber = null;
|
||||
$("#partsList li").removeClass("active");
|
||||
@@ -506,14 +655,34 @@ $(document).ready(function () {
|
||||
});
|
||||
|
||||
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) => {
|
||||
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 scaledY = marker.y * photoData.scale;
|
||||
const markerColor =
|
||||
marker.color || partColors[marker.partNumber] || "#ff0000";
|
||||
|
||||
const $marker = $(
|
||||
`<div class="draggable-marker">${marker.partNumber}</div>`,
|
||||
`<div class="draggable-marker" style="background: ${markerColor}; border: 1px solid ${markerColor}; color: #ffffff;">${marker.partNumber}</div>`,
|
||||
).css({
|
||||
left: scaledX - 8 + "px",
|
||||
top: scaledY - 8 + "px",
|
||||
@@ -556,9 +725,16 @@ $(document).ready(function () {
|
||||
if (item && item.partNumber) {
|
||||
item.x = (currentX + 8) / photoData.scale;
|
||||
item.y = (currentY + 8) / photoData.scale;
|
||||
markUnsaved();
|
||||
} else {
|
||||
descriptionPosition.x = (currentX + 5) / photoData.scale;
|
||||
descriptionPosition.y = (currentY + 5) / photoData.scale;
|
||||
const currentPhoto = $("#samplePhoto").attr("src");
|
||||
if (photoAnnotations[currentPhoto]) {
|
||||
photoAnnotations[currentPhoto].descriptionPosition.x =
|
||||
(currentX + 5) / photoData.scale;
|
||||
photoAnnotations[currentPhoto].descriptionPosition.y =
|
||||
(currentY + 5) / photoData.scale;
|
||||
markUnsaved();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
@@ -570,7 +746,23 @@ $(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 = [];
|
||||
$("#partsTableBody tr").each(function () {
|
||||
const partNumber = $(this).find(".part-number").val();
|
||||
@@ -578,18 +770,16 @@ $(document).ready(function () {
|
||||
if (
|
||||
partNumber &&
|
||||
partDescription &&
|
||||
!partDescription.startsWith("Mix")
|
||||
(showMixParts || !partDescription.startsWith("Mix"))
|
||||
) {
|
||||
partsList.push(`${partNumber} ${partDescription}`);
|
||||
}
|
||||
});
|
||||
|
||||
const descriptionList = $("#descriptionList");
|
||||
descriptionList.empty();
|
||||
descriptionList.css({
|
||||
display: "block",
|
||||
top: y * photoData.scale + "px",
|
||||
left: x * photoData.scale + "px",
|
||||
top: annotations.descriptionPosition.y * photoData.scale + "px",
|
||||
left: annotations.descriptionPosition.x * photoData.scale + "px",
|
||||
});
|
||||
partsList.forEach((part) =>
|
||||
descriptionList.append(`<div>${part}</div>`),
|
||||
@@ -598,11 +788,18 @@ $(document).ready(function () {
|
||||
updateMarkers();
|
||||
}
|
||||
|
||||
function clearCanvasMarkers() {
|
||||
function clearCanvasMarkers(clearDescriptions = true) {
|
||||
const currentPhoto = $("#samplePhoto").attr("src");
|
||||
photoMarkers[currentPhoto] = [];
|
||||
hasDescriptions = false;
|
||||
if (clearDescriptions) {
|
||||
if (photoAnnotations[currentPhoto]) {
|
||||
photoAnnotations[currentPhoto].hasDescriptions = false;
|
||||
photoAnnotations[currentPhoto].descriptionPosition = {
|
||||
x: 10,
|
||||
y: 10,
|
||||
};
|
||||
}
|
||||
$("#descriptionList").css("display", "none");
|
||||
}
|
||||
$("#markerContainer").empty();
|
||||
|
||||
const canvas = document.getElementById("photoCanvas");
|
||||
@@ -618,134 +815,45 @@ $(document).ready(function () {
|
||||
if (img[0].naturalWidth) {
|
||||
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 () {
|
||||
console.log("Aggiungi descrizioni cliccato");
|
||||
hasDescriptions = true;
|
||||
descriptionPosition = { x: 10, y: 10 };
|
||||
drawDescriptions(descriptionPosition.x, descriptionPosition.y);
|
||||
const currentPhoto = $("#samplePhoto").attr("src");
|
||||
if (!photoAnnotations[currentPhoto]) {
|
||||
photoAnnotations[currentPhoto] = {
|
||||
markers: [],
|
||||
hasDescriptions: false,
|
||||
descriptionPosition: { x: 10, y: 10 },
|
||||
};
|
||||
}
|
||||
photoAnnotations[currentPhoto].hasDescriptions = true;
|
||||
updateDescriptions();
|
||||
makeDraggable($("#descriptionList"));
|
||||
markUnsaved();
|
||||
});
|
||||
|
||||
$("#removeAnnotationsBtn").on("click", function () {
|
||||
console.log("Rimuovi annotazioni cliccato");
|
||||
clearCanvasMarkers();
|
||||
clearCanvasMarkers(true); // Remove only descriptions
|
||||
});
|
||||
|
||||
// ===================
|
||||
// REMOVE BACKGROUND (Remove.bg)
|
||||
// ===================
|
||||
$("#removeBackgroundBtn").on("click", function () {
|
||||
console.log("Pulsante Rimuovi Sfondo cliccato");
|
||||
|
||||
if (
|
||||
!REMOVE_BG_API_KEY ||
|
||||
REMOVE_BG_API_KEY === "INSERISCI_LA_TUA_CHIAVE_API"
|
||||
) {
|
||||
alert(
|
||||
"Chiave API di Remove.bg non configurata. Inserisci una chiave valida.",
|
||||
);
|
||||
console.error("Chiave API non valida");
|
||||
return;
|
||||
}
|
||||
|
||||
const currentPhoto = $("#samplePhoto")[0];
|
||||
if (!currentPhoto.src) {
|
||||
alert("Nessuna foto selezionata.");
|
||||
console.error("Nessuna immagine in #samplePhoto");
|
||||
return;
|
||||
}
|
||||
|
||||
console.log("Immagine corrente:", currentPhoto.src);
|
||||
|
||||
// Salva marker e descrizioni
|
||||
const currentPhotoKey = currentPhoto.src;
|
||||
const markers = photoMarkers[currentPhotoKey] || [];
|
||||
const descPos = { ...descriptionPosition };
|
||||
const hasDesc = hasDescriptions;
|
||||
|
||||
// Mostra spinner
|
||||
$("#removeBackgroundBtn")
|
||||
.html('<i class="fas fa-spinner fa-spin"></i> Elaborazione...')
|
||||
.prop("disabled", true);
|
||||
|
||||
// Controlla se l'immagine è un URL pubblico o un dataURL
|
||||
const formData = new FormData();
|
||||
if (currentPhoto.src.startsWith("data:")) {
|
||||
// Converti dataURL in blob
|
||||
console.log("Immagine è un dataURL, conversione in blob...");
|
||||
fetch(currentPhoto.src)
|
||||
.then((res) => res.blob())
|
||||
.then((blob) => {
|
||||
formData.append("image_file", blob, "image.png");
|
||||
formData.append("size", "auto");
|
||||
sendRemoveBgRequest(formData, markers, descPos, hasDesc);
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error("Errore conversione dataURL in blob:", err);
|
||||
alert("Errore nella conversione dell'immagine.");
|
||||
$("#removeBackgroundBtn")
|
||||
.html("Rimuovi Sfondo")
|
||||
.prop("disabled", false);
|
||||
$("#undoMarkerBtn").on("click", function () {
|
||||
undoLastMarker();
|
||||
});
|
||||
} else {
|
||||
// Usa URL pubblico
|
||||
console.log("Immagine è un URL, invio diretto...");
|
||||
formData.append("image_url", currentPhoto.src);
|
||||
formData.append("size", "auto");
|
||||
sendRemoveBgRequest(formData, markers, descPos, hasDesc);
|
||||
}
|
||||
});
|
||||
|
||||
function sendRemoveBgRequest(formData, markers, descPos, hasDesc) {
|
||||
console.log("Invio richiesta a Remove.bg...");
|
||||
$.ajax({
|
||||
url: "https://api.remove.bg/v1.0/removebg",
|
||||
method: "POST",
|
||||
headers: {
|
||||
"X-Api-Key": REMOVE_BG_API_KEY,
|
||||
},
|
||||
data: formData,
|
||||
processData: false,
|
||||
contentType: false,
|
||||
success: function (response) {
|
||||
console.log("Risposta Remove.bg ricevuta:", response);
|
||||
// Ripristina il pulsante
|
||||
$("#removeBackgroundBtn")
|
||||
.html("Rimuovi Sfondo")
|
||||
.prop("disabled", false);
|
||||
|
||||
// Imposta l'immagine senza sfondo
|
||||
const dataURL =
|
||||
"data:image/png;base64," + response.data.result_b64;
|
||||
$("#samplePhoto").attr("src", dataURL);
|
||||
|
||||
// Ripristina marker e descrizioni
|
||||
photoMarkers[dataURL] = markers;
|
||||
descriptionPosition = descPos;
|
||||
hasDescriptions = hasDesc;
|
||||
|
||||
loadSinglePhoto(dataURL);
|
||||
markUnsaved();
|
||||
},
|
||||
error: function (xhr) {
|
||||
console.error(
|
||||
"Errore API Remove.bg:",
|
||||
xhr.status,
|
||||
xhr.responseText,
|
||||
);
|
||||
alert(
|
||||
"Errore nella rimozione dello sfondo: " +
|
||||
(xhr.responseJSON?.errors?.[0]?.title ||
|
||||
xhr.statusText),
|
||||
);
|
||||
$("#removeBackgroundBtn")
|
||||
.html("Rimuovi Sfondo")
|
||||
.prop("disabled", false);
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
let unsavedChanges = false;
|
||||
|
||||
@@ -754,14 +862,12 @@ $(document).ready(function () {
|
||||
if (!unsavedChanges) {
|
||||
unsavedChanges = true;
|
||||
$("#savePhotoBtn").addClass("unsaved").text("⚠️ Salva Modifiche");
|
||||
console.log("Modifiche non salvate segnate");
|
||||
}
|
||||
}
|
||||
|
||||
function clearUnsaved() {
|
||||
unsavedChanges = false;
|
||||
$("#savePhotoBtn").removeClass("unsaved").text("Salva Foto con Nome");
|
||||
console.log("Modifiche salvate, stato ripristinato");
|
||||
}
|
||||
|
||||
// --- event listeners ---
|
||||
@@ -778,20 +884,156 @@ $(document).ready(function () {
|
||||
}
|
||||
});
|
||||
|
||||
// --- SAVE BUTTON (disabilitato per ora) ---
|
||||
// --- SAVE BUTTON ---
|
||||
$("#savePhotoBtn").on("click", function () {
|
||||
alert("Funzionalità di salvataggio non implementata per ora.");
|
||||
console.log("Pulsante Salva Foto cliccato");
|
||||
const canvas = document.getElementById("photoCanvas");
|
||||
const ctx = canvas.getContext("2d");
|
||||
const img = $("#samplePhoto");
|
||||
|
||||
const naturalWidth = img.get(0).naturalWidth;
|
||||
const naturalHeight = img.get(0).naturalHeight;
|
||||
canvas.width = naturalWidth;
|
||||
canvas.height = naturalHeight;
|
||||
|
||||
ctx.drawImage(img.get(0), 0, 0, naturalWidth, naturalHeight);
|
||||
|
||||
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 = [];
|
||||
$("#partsTableBody tr").each(function () {
|
||||
const partNumber = $(this).find(".part-number").val();
|
||||
const partDescription = $(this).find(".part-description").val();
|
||||
if (
|
||||
partNumber &&
|
||||
partDescription &&
|
||||
(showMixParts || !partDescription.startsWith("Mix"))
|
||||
) {
|
||||
partsList.push(`${partNumber} ${partDescription}`);
|
||||
}
|
||||
});
|
||||
|
||||
if (partsList.length > 0) {
|
||||
const fontSize = Math.round(naturalWidth * 0.02);
|
||||
ctx.font = fontSize + "px Arial";
|
||||
const textHeight = fontSize + 8;
|
||||
const boxWidth = Math.round(naturalWidth * 0.28);
|
||||
const boxHeight = partsList.length * textHeight + 25;
|
||||
|
||||
const x = annotations.descriptionPosition.x;
|
||||
const y = annotations.descriptionPosition.y;
|
||||
|
||||
ctx.save();
|
||||
ctx.shadowColor = "rgba(0,0,0,0.3)";
|
||||
ctx.shadowBlur = 8;
|
||||
ctx.shadowOffsetX = 3;
|
||||
ctx.shadowOffsetY = 3;
|
||||
|
||||
ctx.fillStyle = "rgba(255, 255, 255, 0.9)";
|
||||
ctx.beginPath();
|
||||
ctx.roundRect(x, y, boxWidth, boxHeight, 12);
|
||||
ctx.fill();
|
||||
|
||||
ctx.restore();
|
||||
|
||||
ctx.fillStyle = "#111111";
|
||||
partsList.forEach((part, index) => {
|
||||
ctx.fillText(part, x + 15, y + 35 + index * textHeight);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
const markers = annotations.markers;
|
||||
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 x = marker.x;
|
||||
const y = marker.y;
|
||||
const radius = Math.max(5, Math.round(naturalWidth * 0.025));
|
||||
const fontSize = Math.max(8, Math.round(radius * 0.9));
|
||||
const markerColor =
|
||||
marker.color || partColors[marker.partNumber] || "#ff0000";
|
||||
|
||||
ctx.beginPath();
|
||||
ctx.arc(x, y, radius, 0, 2 * Math.PI);
|
||||
ctx.fillStyle = markerColor; // Use the stored color
|
||||
ctx.fill();
|
||||
|
||||
ctx.lineWidth = 3;
|
||||
ctx.strokeStyle = markerColor; // Use the same color for the border
|
||||
ctx.stroke();
|
||||
|
||||
ctx.fillStyle = "#ffffff";
|
||||
ctx.font = `bold ${fontSize}px Arial`;
|
||||
ctx.textAlign = "center";
|
||||
ctx.textBaseline = "middle";
|
||||
ctx.fillText(marker.partNumber || "", x, y);
|
||||
});
|
||||
|
||||
const dataURL = canvas.toDataURL("image/png");
|
||||
const timestamp = new Date().toISOString().replace(/[:.]/g, "-");
|
||||
const iddatadb = $("#partsModal").data("iddatadb");
|
||||
const defaultName = `photo_${iddatadb}_${timestamp}.png`;
|
||||
|
||||
const newName = prompt(
|
||||
"Inserisci il nome del file (senza estensione):",
|
||||
defaultName.split(".png")[0],
|
||||
);
|
||||
|
||||
if (newName) {
|
||||
const finalName = newName + "_" + timestamp + ".png";
|
||||
$.ajax({
|
||||
url: "save_annotated_photo.php",
|
||||
method: "POST",
|
||||
data: {
|
||||
dataURL: dataURL,
|
||||
filename: finalName,
|
||||
iddatadb: iddatadb,
|
||||
},
|
||||
success: function (response) {
|
||||
if (response.success) {
|
||||
alert(
|
||||
"Foto salvata con successo: " + response.file_path,
|
||||
);
|
||||
$("#samplePhoto").attr("src", response.file_path);
|
||||
loadPhoto(iddatadb);
|
||||
clearCanvasMarkers(false); // Preserve descriptions
|
||||
clearUnsaved();
|
||||
} else {
|
||||
alert("Errore: " + response.message);
|
||||
}
|
||||
},
|
||||
error: function (xhr, status, error) {
|
||||
alert("Errore Ajax: " + error);
|
||||
},
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// ===================
|
||||
// DEBUG HOVER LOGS
|
||||
// ===================
|
||||
$(document).on("mouseenter", "tr", function () {
|
||||
console.log("Mouse entrato su riga");
|
||||
// console.log("Mouse entrato su riga");
|
||||
});
|
||||
|
||||
$(document).on("mouseleave", "tr", function () {
|
||||
console.log("Mouse uscito da riga");
|
||||
// console.log("Mouse uscito da riga");
|
||||
});
|
||||
});
|
||||
|
||||
+204
-48
@@ -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
|
||||
function attachPhotoEventListeners(iddatadb) {
|
||||
const dropArea = document.getElementById("dropArea");
|
||||
@@ -332,6 +380,162 @@ document.addEventListener("DOMContentLoaded", function () {
|
||||
// Inizializza la gestione della webcam
|
||||
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
|
||||
const loader = document.getElementById("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
|
||||
const photosButtons = document.querySelectorAll(".photos-btn");
|
||||
const photosModal = document.getElementById("photosModal");
|
||||
|
||||
@@ -1,6 +1,10 @@
|
||||
<?php
|
||||
// photos_popup.php
|
||||
include('include/headscript.php');
|
||||
// Includi Fabric.js solo per questa pagina
|
||||
?>
|
||||
|
||||
<?php
|
||||
// Includi l'autoloader di Composer
|
||||
require_once __DIR__ . '/../../vendor/autoload.php';
|
||||
|
||||
@@ -116,7 +120,6 @@ $result->saveToFile($qrCodeFile);
|
||||
<input type="file" id="photoInput" multiple accept="image/*" style="display: none;">
|
||||
</div>
|
||||
<!-- Area per la webcam -->
|
||||
<!-- Area per la webcam -->
|
||||
<div id="webcamArea" style="display: none; text-align: center; margin-bottom: 20px;">
|
||||
<p>Webcam Preview</p>
|
||||
<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>
|
||||
</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">
|
||||
<?php if (empty($photos)): ?>
|
||||
<p>No Photos present.</p>
|
||||
@@ -156,6 +160,8 @@ $result->saveToFile($qrCodeFile);
|
||||
</button>
|
||||
</div>
|
||||
<?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; ?>
|
||||
</div>
|
||||
|
||||
@@ -164,6 +170,40 @@ $result->saveToFile($qrCodeFile);
|
||||
<span class="image-modal-close">×</span>
|
||||
<img id="enlargedImage" class="image-modal-content" src="" alt="Immagine ingrandita">
|
||||
</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;">×</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>
|
||||
|
||||
<style>
|
||||
|
||||
@@ -1,55 +0,0 @@
|
||||
<?php
|
||||
header('Content-Type: application/json');
|
||||
|
||||
$photo_path = $_POST['photo_path'] ?? '';
|
||||
$iddatadb = $_POST['iddatadb'] ?? '';
|
||||
|
||||
if (empty($photo_path) || empty($iddatadb)) {
|
||||
echo json_encode(['success' => false, 'message' => 'Parametri mancanti']);
|
||||
exit;
|
||||
}
|
||||
|
||||
// Verifica che il file esista
|
||||
$full_path = realpath($photo_path);
|
||||
if (!$full_path || !file_exists($full_path)) {
|
||||
echo json_encode(['success' => false, 'message' => 'File non trovato']);
|
||||
exit;
|
||||
}
|
||||
|
||||
// Configurazione Remove.bg API
|
||||
$api_key = 'YOUR_API_KEY'; // Inserisci la tua chiave API di Remove.bg
|
||||
$api_url = 'https://api.remove.bg/v1.0/removebg';
|
||||
|
||||
// Preparazione della richiesta
|
||||
$ch = curl_init();
|
||||
curl_setopt($ch, CURLOPT_URL, $api_url);
|
||||
curl_setopt($ch, CURLOPT_POST, true);
|
||||
curl_setopt($ch, CURLOPT_POSTFIELDS, [
|
||||
'image_file' => new CURLFile($full_path),
|
||||
'size' => 'auto',
|
||||
]);
|
||||
curl_setopt($ch, CURLOPT_HTTPHEADER, [
|
||||
'X-Api-Key: ' . $api_key
|
||||
]);
|
||||
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
|
||||
|
||||
// Esecuzione della richiesta
|
||||
$response = curl_exec($ch);
|
||||
$http_code = curl_getinfo($ch, CURLINFO_HTTP_CODE);
|
||||
curl_close($ch);
|
||||
|
||||
if ($http_code !== 200) {
|
||||
echo json_encode(['success' => false, 'message' => 'Errore API Remove.bg']);
|
||||
exit;
|
||||
}
|
||||
|
||||
// Salva l'immagine senza sfondo
|
||||
$timestamp = date('YmdHis');
|
||||
$new_filename = "no_bg_photo_{$iddatadb}_{$timestamp}.png";
|
||||
$new_filepath = "uploads/{$new_filename}"; // Assumi una directory Uploads/
|
||||
file_put_contents($new_filepath, $response);
|
||||
|
||||
// Aggiorna il database o il sistema di file con il nuovo percorso
|
||||
// Qui potresti aggiungere logica per aggiornare il database con il nuovo percorso
|
||||
|
||||
echo json_encode(['success' => true, 'new_photo_path' => $new_filepath]);
|
||||
@@ -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()
|
||||
]);
|
||||
}
|
||||
Reference in New Issue
Block a user