Differenze

Queste sono le differenze tra la revisione selezionata e la versione attuale della pagina.

--- docuneo:nec_calculator_3_neoneeds [2025/07/13 10:20] – creata admin
+++ docuneo:nec_calculator_3_neoneeds [2025/07/14 10:41] (versione attuale) – eliminata admin
@@ Linea 1: / Linea 1: @@
-<html>
-<style>
-/* Stili per il calcolatore NeoNEEDS */
-.neoneeds-calculator {
-    font-family: Arial, sans-serif;
-    max-width: 900px;
-    margin: 20px auto;
-    background: #fff;
-    border: 3px solid #2c3e50;
-    border-radius: 15px;
-    padding: 25px;
-    box-shadow: 0 6px 12px rgba(0,0,0,0.15);
-}
-.neoneeds-title {
-    text-align: center;
-    color: #2c3e50;
-    margin-bottom: 10px;
-    font-size: 28px;
-    font-weight: bold;
-    border-bottom: 4px solid #e74c3c;
-    padding-bottom: 15px;
-}
-.neoneeds-subtitle {
-    text-align: center;
-    color: #7f8c8d;
-    margin-bottom: 25px;
-    font-size: 18px;
-    font-style: italic;
-}
-.parameter-section {
-    background: #f8f9fa;
-    border: 2px solid #6c757d;
-    border-radius: 10px;
-    margin-bottom: 20px;
-    overflow: hidden;
-}
-.parameter-header {
-    background: linear-gradient(135deg, #34495e, #2c3e50);
-    color: white;
-    padding: 15px 20px;
-    font-size: 18px;
-    font-weight: bold;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-}
-.parameter-content {
-    padding: 15px;
-}
-.score-option {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 12px 15px;
-    margin: 8px 0;
-    border: 2px solid #dee2e6;
-    border-radius: 8px;
-    background: white;
-    cursor: pointer;
-    transition: all 0.3s ease;
-    position: relative;
-}
-.score-option:hover {
-    border-color: #3498db;
-    box-shadow: 0 2px 4px rgba(52, 152, 219, 0.2);
-}
-.score-option.selected {
-    background: linear-gradient(135deg, #e8f5e9, #c8e6c9);
-    border: 2px solid #4caf50;
-    box-shadow: 0 3px 8px rgba(76, 175, 80, 0.3);
-    transform: translateX(5px);
-}
-.score-option.selected::before {
-    content: "✓";
-    position: absolute;
-    left: -10px;
-    top: 50%;
-    transform: translateY(-50%);
-    background: #4caf50;
-    color: white;
-    width: 25px;
-    height: 25px;
-    border-radius: 50%;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    font-weight: bold;
-    font-size: 14px;
-}
-.option-text {
-    flex: 1;
-    font-size: 15px;
-    font-weight: 500;
-    color: #2c3e50;
-    margin-right: 15px;
-}
-.score-option.selected .option-text {
-    font-weight: bold;
-    color: #2e7d32;
-}
-.option-score {
-    background: #e74c3c;
-    color: white;
-    font-weight: bold;
-    font-size: 16px;
-    padding: 8px 12px;
-    border-radius: 50%;
-    min-width: 35px;
-    text-align: center;
-    box-shadow: 0 2px 4px rgba(231, 76, 60, 0.3);
-}
-.score-option.selected .option-score {
-    background: #4caf50;
-    animation: pulse 0.5s ease-in-out;
-}
-@keyframes pulse {
-% { transform: scale(1); }
-% { transform: scale(1.1); }
-% { transform: scale(1); }
-}
-.results-section {
-    margin-top: 30px;
-    padding: 25px;
-    border: 3px solid #e74c3c;
-    border-radius: 15px;
-    background: linear-gradient(135deg, #fff5f5, #ffebee);
-}
-.total-score-display {
-    text-align: center;
-    font-size: 32px;
-    font-weight: bold;
-    color: #c62828;
-    margin: 20px 0;
-    padding: 20px;
-    background: white;
-    border: 3px solid #e74c3c;
-    border-radius: 12px;
-    box-shadow: 0 4px 8px rgba(231, 76, 60, 0.2);
-}
-.risk-interpretation {
-    text-align: center;
-    font-size: 20px;
-    font-weight: bold;
-    margin: 20px 0;
-    padding: 20px;
-    border-radius: 10px;
-    color: white;
-}
-.risk-low {
-    background: linear-gradient(135deg, #4caf50, #388e3c);
-}
-.risk-moderate {
-    background: linear-gradient(135deg, #ff9800, #f57c00);
-}
-.risk-high {
-    background: linear-gradient(135deg, #f44336, #d32f2f);
-}
-.risk-critical {
-    background: linear-gradient(135deg, #9c27b0, #7b1fa2);
-    animation: blink 1s ease-in-out infinite alternate;
-}
-@keyframes blink {
-% { opacity: 0.8; }
-% { opacity: 1; }
-}
-.vital-signs-reference {
-    background: #e3f2fd;
-    border: 2px solid #2196f3;
-    border-radius: 8px;
-    padding: 15px;
-    margin: 20px 0;
-}
-.vital-signs-reference h4 {
-    margin-top: 0;
-    color: #1976d2;
-    text-align: center;
-}
-.vital-reference-grid {
-    display: grid;
-    grid-template-columns: 1fr 1fr;
-    gap: 10px;
-    font-size: 14px;
-}
-.vital-item {
-    background: white;
-    padding: 8px;
-    border-radius: 4px;
-    border-left: 4px solid #2196f3;
-}
-.action-buttons {
-    display: flex;
-    justify-content: center;
-    gap: 15px;
-    margin-top: 25px;
-}
-.action-btn {
-    padding: 15px 30px;
-    border: none;
-    border-radius: 8px;
-    cursor: pointer;
-    font-size: 16px;
-    font-weight: bold;
-    transition: all 0.3s ease;
-    text-transform: uppercase;
-}
-.reset-btn {
-    background: linear-gradient(135deg, #f44336, #d32f2f);
-    color: white;
-}
-.reset-btn:hover {
-    background: linear-gradient(135deg, #d32f2f, #b71c1c);
-    transform: translateY(-2px);
-    box-shadow: 0 4px 8px rgba(244, 67, 54, 0.3);
-}
-.print-btn {
-    background: linear-gradient(135deg, #2196f3, #1976d2);
-    color: white;
-}
-.print-btn:hover {
-    background: linear-gradient(135deg, #1976d2, #1565c0);
-    transform: translateY(-2px);
-    box-shadow: 0 4px 8px rgba(33, 150, 243, 0.3);
-}
-.scoring-note {
-    background: #fff3e0;
-    border: 2px solid #ff9800;
-    border-radius: 8px;
-    padding: 15px;
-    margin: 20px 0;
-    color: #e65100;
-    font-weight: bold;
-    text-align: center;
-}
-.parameter-current-score {
-    background: #4caf50;
-    color: white;
-    padding: 5px 10px;
-    border-radius: 20px;
-    font-size: 14px;
-    font-weight: bold;
-}
-</style>
-<div class="neoneeds-calculator">
-    <h1 class="neoneeds-title">🚨 NeoNEEDS Calculator</h1>
-    <div class="neoneeds-subtitle">Sistema di Allerta Precoce per Enterocolite Necrotizzante</div>
-    <div class="scoring-note">
-        📋 <strong>Istruzioni:</strong> Seleziona UNA opzione per ogni parametro. Aggiungi +1 punto per ogni fattore di rischio aggiuntivo.
-    </div>
-    <!-- Comportamento -->
-    <div class="parameter-section">
-        <div class="parameter-header">
-            <span>🎯 Comportamento</span>
-            <span class="parameter-current-score" id="behavior-score">0 punti</span>
-        </div>
-        <div class="parameter-content">
-            <div class="score-option" onclick="selectOption('behavior', this, 0)">
-                <span class="option-text">Vigile/Attivo</span>
-                <span class="option-score">0</span>
-            </div>
-            <div class="score-option" onclick="selectOption('behavior', this, 1)">
-                <span class="option-text">Attività ridotta, ma risponde appropriatamente alla stimolazione</span>
-                <span class="option-score">1</span>
-            </div>
-            <div class="score-option" onclick="selectOption('behavior', this, 2)">
-                <span class="option-text">Attività ridotta con risposta minima alla stimolazione</span>
-                <span class="option-score">2</span>
-            </div>
-        </div>
-    </div>
-    <!-- Cardiovascolare -->
-    <div class="parameter-section">
-        <div class="parameter-header">
-            <span>❤️ Cardiovascolare</span>
-            <span class="parameter-current-score" id="cardiovascular-score">0 punti</span>
-        </div>
-        <div class="parameter-content">
-            <div class="score-option" onclick="selectOption('cardiovascular', this, 0)">
-                <span class="option-text">Nessun episodio AED, riempimento capillare rapido <2 sec, FC e PAM stabili</span>
-                <span class="option-score">0</span>
-            </div>
-            <div class="score-option" onclick="selectOption('cardiovascular', this, 1)">
-                <span class="option-text">Riempimento capillare 2-5 sec O riduzione PAM 10% dal basale O PAM >10% dal basale</span>
-                <span class="option-score">1</span>
-            </div>
-            <div class="score-option" onclick="selectOption('cardiovascular', this, 2)">
-                <span class="option-text">Riempimento capillare >5 sec O FC>160 per >1h O PAM instabile che richiede pressori</span>
-                <span class="option-score">2</span>
-            </div>
-        </div>
-    </div>
-    <!-- Respiratorio -->
-    <div class="parameter-section">
-        <div class="parameter-header">
-            <span>🫁 Respiratorio</span>
-            <span class="parameter-current-score" id="respiratory-score">0 punti</span>
-        </div>
-        <div class="parameter-content">
-            <div class="score-option" onclick="selectOption('respiratory', this, 0)">
-                <span class="option-text">Nessun cambiamento nelle impostazioni attuali o frequenza respiratoria</span>
-                <span class="option-score">0</span>
-            </div>
-            <div class="score-option" onclick="selectOption('respiratory', this, 1)">
-                <span class="option-text">Aumento AED sopra basale O FR >60 per 1h O uso muscoli accessori O aumento FiO2 >10% dal basale</span>
-                <span class="option-score">1</span>
-            </div>
-            <div class="score-option" onclick="selectOption('respiratory', this, 2)">
-                <span class="option-text">Cluster AED o ABD con stimolazione/aspirazione O FR >20 sopra normale con rientramenti O aumento supporto respiratorio</span>
-                <span class="option-score">2</span>
-            </div>
-        </div>
-    </div>
-    <!-- Addome -->
-    <div class="parameter-section">
-        <div class="parameter-header">
-            <span>🤱 Addome</span>
-            <span class="parameter-current-score" id="abdominal-score">0 punti</span>
-        </div>
-        <div class="parameter-content">
-            <div class="score-option" onclick="selectOption('abdominal', this, 0)">
-                <span class="option-text">Soffice, non disteso, rumori intestinali normoattivi</span>
-                <span class="option-score">0</span>
-            </div>
-            <div class="score-option" onclick="selectOption('abdominal', this, 1)">
-                <span class="option-text">Addome leggermente disteso (>1cm dal basale) O rumori intestinali ipoattivi</span>
-                <span class="option-score">1</span>
-            </div>
-            <div class="score-option" onclick="selectOption('abdominal', this, 2)">
-                <span class="option-text">Disteso >2cm (dal basale) O difesa/dolorabile O assenza rumori intestinali per 2 min</span>
-                <span class="option-score">2</span>
-            </div>
-        </div>
-    </div>
-    <!-- Alimentazione -->
-    <div class="parameter-section">
-        <div class="parameter-header">
-            <span>🍼 Alimentazione</span>
-            <span class="parameter-current-score" id="feeds-score">0 punti</span>
-        </div>
-        <div class="parameter-content">
-            <div class="score-option" onclick="selectOption('feeds', this, 0)">
-                <span class="option-text">Tollera boli, nessun residuo, nessun vomito</span>
-                <span class="option-score">0</span>
-            </div>
-            <div class="score-option" onclick="selectOption('feeds', this, 1)">
-                <span class="option-text">Vomito/Residui >10% volume, parzialmente digerito</span>
-                <span class="option-score">1</span>
-            </div>
-            <div class="score-option" onclick="selectOption('feeds', this, 2)">
-                <span class="option-text">Significativamente disteso O Vomito/Residui >20% volume O residui/vomito colorato (biliare)</span>
-                <span class="option-score">2</span>
-            </div>
-        </div>
-    </div>
-    <!-- Segni Vitali di Riferimento -->
-    <div class="vital-signs-reference">
-        <h4>📊 Valori di Riferimento Segni Vitali Neonatali</h4>
-        <div class="vital-reference-grid">
-            <div class="vital-item"><strong>Frequenza Cardiaca (a riposo):</strong> 100-160</div>
-            <div class="vital-item"><strong>Frequenza Respiratoria (a riposo):</strong> 40-60</div>
-        </div>
-    </div>
-    <!-- Results Section -->
-    <div class="results-section">
-        <h3 style="text-align: center; margin-top: 0; color: #c62828;">📈 Risultati NeoNEEDS</h3>
-        <div class="total-score-display">
-            🎯 SCORE TOTALE: <span id="total-score">0</span> / 10
-        </div>
-        <div id="risk-interpretation" class="risk-interpretation">
-            Seleziona i parametri per la valutazione del rischio
-        </div>
-        <div class="action-buttons">
-            <button class="action-btn reset-btn" onclick="resetCalculator()">🔄 Reset</button>
-            <button class="action-btn print-btn" onclick="printResults()">🖨️ Stampa</button>
-        </div>
-    </div>
-</div>
-<script>
-var currentScores = {
-    behavior: 0,
-    cardiovascular: 0,
-    respiratory: 0,
-    abdominal: 0,
-    feeds: 0
-};
-var totalScore = 0;
-function selectOption(parameter, element, score) {
-    // Rimuovi selezione da tutte le opzioni del parametro
-    var parameterSection = element.closest('.parameter-section');
-    var allOptions = parameterSection.querySelectorAll('.score-option');
-    for (var i = 0; i < allOptions.length; i++) {
-        allOptions[i].classList.remove('selected');
-    }
-    // Seleziona l'opzione corrente
-    element.classList.add('selected');
-    // Aggiorna score del parametro
-    currentScores[parameter] = score;
-    // Aggiorna display del punteggio parametro
-    document.getElementById(parameter + '-score').textContent = score + ' punti';
-    // Ricalcola score totale
-    calculateTotalScore();
-}
-function calculateTotalScore() {
-    totalScore = 0;
-    // Somma tutti i punteggi dei parametri
-    for (var param in currentScores) {
-        totalScore += currentScores[param];
-    }
-    // Aggiorna display
-    document.getElementById('total-score').textContent = totalScore;
-    // Aggiorna interpretazione del rischio
-    updateRiskInterpretation();
-}
-function updateRiskInterpretation() {
-    var interpretation = document.getElementById('risk-interpretation');
-    var riskText, riskClass;
-    if (totalScore === 0) {
-        riskText = '🟢 PUNTEGGIO 0 - Rischio molto basso di NEC';
-        riskClass = 'risk-low';
-    } else if (totalScore >= 1 && totalScore <= 2) {
-        riskText = '🟡 PUNTEGGIO 1-2 - Rischio basso-moderato - Monitoraggio aumentato';
-        riskClass = 'risk-moderate';
-    } else if (totalScore >= 3 && totalScore <= 4) {
-        riskText = '🟠 PUNTEGGIO 3-4 - Rischio moderato-alto - Valutazione clinica approfondita';
-        riskClass = 'risk-high';
-    } else if (totalScore >= 5) {
-        riskText = '🔴 PUNTEGGIO ≥5 - Rischio molto alto - Sospetta NEC - Azione immediata richiesta';
-        riskClass = 'risk-critical';
-    }
-    interpretation.textContent = riskText;
-    interpretation.className = 'risk-interpretation ' + riskClass;
-}
-function resetCalculator() {
-    // Reset tutti i punteggi
-    for (var param in currentScores) {
-        currentScores[param] = 0;
-        document.getElementById(param + '-score').textContent = '0 punti';
-    }
-    totalScore = 0;
-    // Rimuovi tutte le selezioni
-    var allOptions = document.querySelectorAll('.score-option');
-    for (var i = 0; i < allOptions.length; i++) {
-        allOptions[i].classList.remove('selected');
-    }
-    // Reset display
-    document.getElementById('total-score').textContent = '0';
-    document.getElementById('risk-interpretation').textContent = 'Seleziona i parametri per la valutazione del rischio';
-    document.getElementById('risk-interpretation').className = 'risk-interpretation';
-}
-function printResults() {
-    window.print();
-}
-// Inizializzazione
-calculateTotalScore();
-</script>
-</html>