Update nutri_call.html

nutri_call.html

@@ -508,7 +508,29 @@ legend {
 
   
 
-
+<!-- Кастомные стили -->
+<style>
+  .pnotify-success {
+    background: linear-gradient(135deg, #4CAF50, #2E7D32) !important;
+    border-left: 5px solid #1B5E20 !important;
+  }
+  
+  .pnotify-error {
+    background: linear-gradient(135deg, #F44336, #C62828) !important;
+    border-left: 5px solid #B71C1C !important;
+  }
+  
+  .deficit-item {
+    margin: 8px 0;
+    display: flex;
+    align-items: center;
+  }
+  
+  .deficit-item i {
+    margin-right: 10px;
+    font-size: 1.2em;
+  }
+</style>
 <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/toastify-js"></script>
 <script>
 let call_data;
@@ -722,141 +744,54 @@ function data_out(response) {
 function showCalculationStatus(response) {
     // Настройки по умолчанию
     const defaults = {
-        duration: 5000,
-        gravity: "top",
-        position: "right",
-        stopOnFocus: true
+        modules: {
+            Mobile: {
+                swipeDismiss: true
+            }
+        },
+        delay: 4000,
+        width: '320px'
     };
-    
-    // Проверяем дефициты
+
+    // Успешный расчёт
     if (Object.keys(response.deficits || {}).length === 0) {
-        // Успешный расчёт (зелёный)
-        Toastify({
+        new PNotify({
             ...defaults,
-            text: "✓ Расчёт успешен! Все элементы сбалансированы",
-            backgroundColor: "#4CAF50",
-            className: "toast-success"
-        }).showToast();
-    } else {
-        // Есть дефициты (красный)
-        const deficitText = Object.entries(response.deficits)
-            .map(([el, val]) => `${el}: ${val.toFixed(2)} ppm`)
-            .join(', ');
-        
-        Toastify({
+            title: 'Успешный расчёт',
+            text: 'Все элементы идеально сбалансированы',
+            type: 'success',
+            icon: 'fas fa-check-circle',
+            styling: 'bootstrap4',
+            addclass: 'pnotify-success',
+            buttons: {
+                closer: true,
+                sticker: false
+            }
+        });
+    } 
+    // Ошибки баланса
+    else {
+        new PNotify({
             ...defaults,
-            text: `⚠ Ошибка баланса: ${deficitText}`,
-            backgroundColor: "#F44336",
-            className: "toast-error",
-            duration: 7000 // Даём больше времени на чтение ошибок
-        }).showToast();
+            title: 'Обнаружены дефициты',
+            text: Object.entries(response.deficits)
+                .map(([el, val]) => `<div class="deficit-item"><i class="fas fa-exclamation-circle"></i> ${el}: <strong>${val.toFixed(2)} ppm</strong></div>`)
+                .join(''),
+            type: 'error',
+            icon: 'fas fa-exclamation-triangle',
+            delay: 7000,
+            styling: 'bootstrap4',
+            addclass: 'pnotify-error',
+            buttons: {
+                closer: true,
+                sticker: false
+            }
+        });
     }
 }
 
 
-
-
-
-
-
-
-<style>
-  .pnotify-card {
-    font-family: 'Segoe UI', sans-serif;
-    border-radius: 8px;
-    overflow: hidden;
-    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
-  }
-  
-  .card-header {
-    padding: 16px;
-    display: flex;
-    align-items: center;
-    color: white;
-  }
-  
-  .card-header.success {
-    background: linear-gradient(135deg, #4CAF50, #2E7D32);
-  }
-  
-  .card-header.error {
-    background: linear-gradient(135deg, #F44336, #C62828);
-  }
-  
-  .card-header h3 {
-    margin: 0 0 0 12px;
-    font-size: 1.2rem;
-  }
-  
-  .card-header .icon {
-    width: 24px;
-    height: 24px;
-  }
-  
-  .card-body {
-    padding: 16px;
-    background: white;
-  }
-  
-  .card-body ul {
-    margin: 0;
-    padding-left: 20px;
-  }
-  
-  .card-body p {
-    margin: 0 0 8px 0;
-  }
-  
-  .card-body small {
-    color: #666;
-    font-size: 0.8rem;
-  }
-</style>  
-<script type="module">
-  import PNotify from 'https://cdn.jsdelivr.net/npm/@pnotify/core@5/dist/PNotify.js';
-  import PNotifyMobile from 'https://cdn.jsdelivr.net/npm/@pnotify/mobile@5/dist/PNotifyMobile.js';
-  import PNotifyBootstrap4 from 'https://cdn.jsdelivr.net/npm/@pnotify/bootstrap4@5/dist/PNotifyBootstrap4.js';
-
-  PNotify.defaultModules.set(PNotifyMobile);
-  PNotify.defaultModules.set(PNotifyBootstrap4);
-
-  window.showCalculationStatus = function(response) {
-    const defaults = {
-      modules: {
-        Mobile: {
-          swipeDismiss: true
-        }
-      }
-    };
-
-    if (Object.keys(response.deficits || {}).length === 0) {
-      new PNotify({
-        ...defaults,
-        title: 'Успешный расчёт',
-        text: 'Все элементы сбалансированы!',
-        type: 'success',
-        icon: 'fas fa-check-circle',
-        delay: 3000,
-        width: '300px'
-      });
-    } else {
-      new PNotify({
-        ...defaults,
-        title: 'Обнаружены отклонения',
-        text: Object.entries(response.deficits)
-          .map(([el, val]) => `${el}: ${val.toFixed(2)} ppm`)
-          .join('<br>'),
-        type: 'error',
-        icon: 'fas fa-exclamation-triangle',
-        delay: 5000,
-        width: '300px'
-      });
-    }
-  };
 </script>
-
-
-
   
 </body>
 </html>