aa

2024-05-21 01:06:25 +02:00
parent 387ebe6e8b
commit 65aac0a2c5
1 changed files with 36 additions and 3 deletions
--- a/resources/views/mylinkspao.blade.php
+++ b/resources/views/mylinkspao.blade.php
@@ -1,10 +1,37 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Link Page</title>
+    <style>
+        #loading {
+            display: none;
+            width: 50px;
+            height: 50px;
+            border: 5px solid #f3f3f3;
+            border-top: 5px solid #3498db;
+            border-radius: 50%;
+            animation: spin 1s linear infinite;
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+        }
+
+        @keyframes spin {
+            0% {
+                transform: rotate(0deg);
+            }
+
+            100% {
+                transform: rotate(360deg);
+            }
+        }
+    </style>
 </head>
+
 <body>
    <h1>Links</h1>
    <form id="articleForm">
@@ -12,14 +39,16 @@
        <input type="text" id="article_id" name="id" />
        <br>
        <button type="button" data-action="search">Cerca Articolo</button>
-        <button type="button" data-action="checkPrevendita">E' in PreVendita?</button><br>
+        <button type="button" data-action="checkPreOrder">E' in PreVendita?</button><br>
        <button type="button" data-action="inprevendita">Libri in Prevendita</button>
    </form>
    <div id="result"></div>
+    <div id="loading"></div>

    <script>
        const form = document.getElementById('articleForm');
        const result = document.getElementById('result');
+        const loading = document.getElementById('loading');

        const buttons = form.querySelectorAll('button');
        buttons.forEach(button => button.addEventListener('click', handleButtonClick));
@@ -28,14 +57,18 @@
            const action = event.target.dataset.action;
            const id = form.querySelector('input[name="id"]').value;
            
+            loading.style.display = 'block'; // Mostra la clessidra
+
            let baseUrl = window.location.href;
            baseUrl = baseUrl.slice(0, baseUrl.lastIndexOf('/'));

            fetch(`${baseUrl}/handle-article-action-pao/${id}/${action}`)
                .then(response => response.text())
-                .then(data => result.innerHTML = data);
+                .then(data => {
+                    result.innerHTML = data;
+                    loading.style.display = 'none'; // Nasconde la clessidra una volta completato
+                });
        }
    </script>
 </body>
 </html>
-