Differenze
Queste sono le differenze tra la revisione selezionata e la versione attuale della pagina.
| Entrambe le parti precedenti la revisioneRevisione precedenteProssima revisione | Revisione precedente | ||
| docuneo:nec_calculator_3_neoneeds [2025/07/13 10:32] – admin | docuneo:nec_calculator_3_neoneeds [2025/07/14 10:41] (versione attuale) – eliminata admin | ||
|---|---|---|---|
| Linea 1: | Linea 1: | ||
| - | < | ||
| - | < | ||
| - | /* Stili per il calcolatore NeoNEEDS */ | ||
| - | .neoneeds-calculator { | ||
| - | font-family: | ||
| - | max-width: 900px; | ||
| - | margin: 20px auto; | ||
| - | background: #fff; | ||
| - | border: 3px solid #2c3e50; | ||
| - | border-radius: | ||
| - | padding: 25px; | ||
| - | box-shadow: 0 6px 12px rgba(0, | ||
| - | } | ||
| - | .neoneeds-title { | ||
| - | text-align: center; | ||
| - | color: #2c3e50; | ||
| - | margin-bottom: | ||
| - | font-size: 28px; | ||
| - | font-weight: | ||
| - | border-bottom: | ||
| - | padding-bottom: | ||
| - | } | ||
| - | |||
| - | .neoneeds-subtitle { | ||
| - | text-align: center; | ||
| - | color: #7f8c8d; | ||
| - | margin-bottom: | ||
| - | font-size: 18px; | ||
| - | font-style: italic; | ||
| - | } | ||
| - | |||
| - | .parameter-section { | ||
| - | background: #f8f9fa; | ||
| - | border: 2px solid #6c757d; | ||
| - | border-radius: | ||
| - | margin-bottom: | ||
| - | overflow: hidden; | ||
| - | } | ||
| - | |||
| - | .parameter-header { | ||
| - | background: linear-gradient(135deg, | ||
| - | color: white; | ||
| - | padding: 15px 20px; | ||
| - | font-size: 18px; | ||
| - | font-weight: | ||
| - | display: flex; | ||
| - | justify-content: | ||
| - | align-items: | ||
| - | } | ||
| - | |||
| - | .parameter-content { | ||
| - | padding: 15px; | ||
| - | } | ||
| - | |||
| - | .score-option { | ||
| - | display: flex; | ||
| - | justify-content: | ||
| - | align-items: | ||
| - | padding: 12px 15px; | ||
| - | margin: 8px 0; | ||
| - | border: 2px solid #dee2e6; | ||
| - | border-radius: | ||
| - | background: white; | ||
| - | cursor: pointer; | ||
| - | transition: all 0.3s ease; | ||
| - | position: relative; | ||
| - | } | ||
| - | |||
| - | .score-option: | ||
| - | border-color: | ||
| - | box-shadow: 0 2px 4px rgba(52, 152, 219, 0.2); | ||
| - | } | ||
| - | |||
| - | .score-option.selected { | ||
| - | background: linear-gradient(135deg, | ||
| - | border: 2px solid #4caf50; | ||
| - | box-shadow: 0 3px 8px rgba(76, 175, 80, 0.3); | ||
| - | transform: translateX(5px); | ||
| - | } | ||
| - | |||
| - | .score-option.selected:: | ||
| - | content: " | ||
| - | position: absolute; | ||
| - | left: -10px; | ||
| - | top: 50%; | ||
| - | transform: translateY(-50%); | ||
| - | background: #4caf50; | ||
| - | color: white; | ||
| - | width: 25px; | ||
| - | height: 25px; | ||
| - | border-radius: | ||
| - | display: flex; | ||
| - | align-items: | ||
| - | justify-content: | ||
| - | font-weight: | ||
| - | font-size: 14px; | ||
| - | } | ||
| - | |||
| - | .option-text { | ||
| - | flex: 1; | ||
| - | font-size: 15px; | ||
| - | font-weight: | ||
| - | color: #2c3e50; | ||
| - | margin-right: | ||
| - | } | ||
| - | |||
| - | .score-option.selected .option-text { | ||
| - | font-weight: | ||
| - | color: #2e7d32; | ||
| - | } | ||
| - | |||
| - | .option-score { | ||
| - | background: #e74c3c; | ||
| - | color: white; | ||
| - | font-weight: | ||
| - | font-size: 16px; | ||
| - | padding: 8px 12px; | ||
| - | border-radius: | ||
| - | 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 { | ||
| - | 0% { transform: scale(1); } | ||
| - | 50% { transform: scale(1.1); } | ||
| - | 100% { transform: scale(1); } | ||
| - | } | ||
| - | |||
| - | .results-section { | ||
| - | margin-top: 30px; | ||
| - | padding: 25px; | ||
| - | border: 3px solid #e74c3c; | ||
| - | border-radius: | ||
| - | background: linear-gradient(135deg, | ||
| - | } | ||
| - | |||
| - | .total-score-display { | ||
| - | text-align: center; | ||
| - | font-size: 32px; | ||
| - | font-weight: | ||
| - | color: #c62828; | ||
| - | margin: 20px 0; | ||
| - | padding: 20px; | ||
| - | background: white; | ||
| - | border: 3px solid #e74c3c; | ||
| - | border-radius: | ||
| - | box-shadow: 0 4px 8px rgba(231, 76, 60, 0.2); | ||
| - | } | ||
| - | |||
| - | .risk-interpretation { | ||
| - | text-align: center; | ||
| - | font-size: 20px; | ||
| - | font-weight: | ||
| - | margin: 20px 0; | ||
| - | padding: 20px; | ||
| - | border-radius: | ||
| - | color: white; | ||
| - | } | ||
| - | |||
| - | .risk-low { | ||
| - | background: linear-gradient(135deg, | ||
| - | } | ||
| - | |||
| - | .risk-moderate { | ||
| - | background: linear-gradient(135deg, | ||
| - | } | ||
| - | |||
| - | .risk-high { | ||
| - | background: linear-gradient(135deg, | ||
| - | } | ||
| - | |||
| - | .risk-critical { | ||
| - | background: linear-gradient(135deg, | ||
| - | animation: blink 1s ease-in-out infinite alternate; | ||
| - | } | ||
| - | |||
| - | @keyframes blink { | ||
| - | 0% { opacity: 0.8; } | ||
| - | 100% { opacity: 1; } | ||
| - | } | ||
| - | |||
| - | .vital-signs-reference { | ||
| - | background: #e3f2fd; | ||
| - | border: 2px solid #2196f3; | ||
| - | border-radius: | ||
| - | 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: | ||
| - | gap: 10px; | ||
| - | font-size: 14px; | ||
| - | } | ||
| - | |||
| - | .vital-item { | ||
| - | background: white; | ||
| - | padding: 8px; | ||
| - | border-radius: | ||
| - | border-left: | ||
| - | } | ||
| - | |||
| - | .action-buttons { | ||
| - | display: flex; | ||
| - | justify-content: | ||
| - | gap: 15px; | ||
| - | margin-top: 25px; | ||
| - | } | ||
| - | |||
| - | .action-btn { | ||
| - | padding: 15px 30px; | ||
| - | border: none; | ||
| - | border-radius: | ||
| - | cursor: pointer; | ||
| - | font-size: 16px; | ||
| - | font-weight: | ||
| - | transition: all 0.3s ease; | ||
| - | text-transform: | ||
| - | } | ||
| - | |||
| - | .reset-btn { | ||
| - | background: linear-gradient(135deg, | ||
| - | color: white; | ||
| - | } | ||
| - | |||
| - | .reset-btn: | ||
| - | background: linear-gradient(135deg, | ||
| - | transform: translateY(-2px); | ||
| - | box-shadow: 0 4px 8px rgba(244, 67, 54, 0.3); | ||
| - | } | ||
| - | |||
| - | .print-btn { | ||
| - | background: linear-gradient(135deg, | ||
| - | color: white; | ||
| - | } | ||
| - | |||
| - | .print-btn: | ||
| - | background: linear-gradient(135deg, | ||
| - | transform: translateY(-2px); | ||
| - | box-shadow: 0 4px 8px rgba(33, 150, 243, 0.3); | ||
| - | } | ||
| - | |||
| - | .scoring-note { | ||
| - | background: #fff3e0; | ||
| - | border: 2px solid #ff9800; | ||
| - | border-radius: | ||
| - | padding: 15px; | ||
| - | margin: 20px 0; | ||
| - | color: #e65100; | ||
| - | font-weight: | ||
| - | text-align: center; | ||
| - | } | ||
| - | |||
| - | .parameter-current-score { | ||
| - | background: #4caf50; | ||
| - | color: white; | ||
| - | padding: 5px 10px; | ||
| - | border-radius: | ||
| - | font-size: 14px; | ||
| - | font-weight: | ||
| - | } | ||
| - | </ | ||
| - | |||
| - | <div class=" | ||
| - | <h1 class=" | ||
| - | <div class=" | ||
| - | | ||
| - | <div class=" | ||
| - | 📋 < | ||
| - | </ | ||
| - | |||
| - | <!-- Comportamento --> | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | < | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | </ | ||
| - | </ | ||
| - | |||
| - | <!-- Cardiovascolare --> | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | < | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | </ | ||
| - | </ | ||
| - | |||
| - | <!-- Respiratorio --> | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | < | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | </ | ||
| - | </ | ||
| - | |||
| - | <!-- Addome --> | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | < | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | </ | ||
| - | </ | ||
| - | |||
| - | <!-- Alimentazione --> | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | < | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | </ | ||
| - | </ | ||
| - | |||
| - | <!-- Fattori di Rischio Aggiuntivi --> | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | < | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | <div class=" | ||
| - | <span class=" | ||
| - | <span class=" | ||
| - | </ | ||
| - | </ | ||
| - | </ | ||
| - | |||
| - | <!-- Valori di Riferimento --> | ||
| - | <div class=" | ||
| - | < | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | </ | ||
| - | </ | ||
| - | |||
| - | <!-- Results Section --> | ||
| - | <div class=" | ||
| - | <h3 style=" | ||
| - | | ||
| - | <div class=" | ||
| - | 🎯 SCORE TOTALE: <span id=" | ||
| - | </ | ||
| - | | ||
| - | <div id=" | ||
| - | Seleziona i parametri per la valutazione del rischio | ||
| - | </ | ||
| - | | ||
| - | <div class=" | ||
| - | <button class=" | ||
| - | <button class=" | ||
| - | </ | ||
| - | </ | ||
| - | </ | ||
| - | |||
| - | < | ||
| - | var currentScores = { | ||
| - | behavior: 0, | ||
| - | cardiovascular: | ||
| - | respiratory: | ||
| - | abdominal: 0, | ||
| - | feeds: 0 | ||
| - | }; | ||
| - | |||
| - | var riskFactors = { | ||
| - | ' | ||
| - | ' | ||
| - | ' | ||
| - | }; | ||
| - | |||
| - | var totalScore = 0; | ||
| - | |||
| - | function selectOption(parameter, | ||
| - | // Rimuovi selezione da tutte le opzioni del parametro | ||
| - | var parameterSection = element.closest(' | ||
| - | var allOptions = parameterSection.querySelectorAll(' | ||
| - | | ||
| - | for (var i = 0; i < allOptions.length; | ||
| - | allOptions[i].classList.remove(' | ||
| - | } | ||
| - | | ||
| - | // Seleziona l' | ||
| - | element.classList.add(' | ||
| - | | ||
| - | // Aggiorna score del parametro | ||
| - | currentScores[parameter] = score; | ||
| - | | ||
| - | // Aggiorna display del punteggio parametro | ||
| - | document.getElementById(parameter + ' | ||
| - | | ||
| - | // Ricalcola score totale | ||
| - | calculateTotalScore(); | ||
| - | } | ||
| - | |||
| - | function toggleRiskFactor(element, | ||
| - | // Toggle stato del fattore di rischio | ||
| - | riskFactors[riskId] = !riskFactors[riskId]; | ||
| - | | ||
| - | // Toggle visual state | ||
| - | if (riskFactors[riskId]) { | ||
| - | element.classList.add(' | ||
| - | } else { | ||
| - | element.classList.remove(' | ||
| - | } | ||
| - | | ||
| - | // Ricalcola score totale | ||
| - | calculateTotalScore(); | ||
| - | } | ||
| - | |||
| - | function calculateTotalScore() { | ||
| - | totalScore = 0; | ||
| - | | ||
| - | // Somma tutti i punteggi dei parametri principali | ||
| - | for (var param in currentScores) { | ||
| - | totalScore += currentScores[param]; | ||
| - | } | ||
| - | | ||
| - | // Somma i fattori di rischio aggiuntivi | ||
| - | var riskFactorScore = 0; | ||
| - | for (var risk in riskFactors) { | ||
| - | if (riskFactors[risk]) { | ||
| - | riskFactorScore += 1; | ||
| - | } | ||
| - | } | ||
| - | | ||
| - | totalScore += riskFactorScore; | ||
| - | | ||
| - | // Aggiorna display | ||
| - | document.getElementById(' | ||
| - | document.getElementById(' | ||
| - | | ||
| - | // Aggiorna interpretazione del rischio | ||
| - | updateRiskInterpretation(); | ||
| - | } | ||
| - | |||
| - | function updateRiskInterpretation() { | ||
| - | var interpretation = document.getElementById(' | ||
| - | var riskText, riskClass; | ||
| - | | ||
| - | if (totalScore === 0) { | ||
| - | riskText = '🟢 PUNTEGGIO 0 - Rischio molto basso di NEC'; | ||
| - | riskClass = ' | ||
| - | } else if (totalScore >= 1 && totalScore <= 2) { | ||
| - | riskText = '🟡 PUNTEGGIO 1-2 - Rischio basso-moderato - Monitoraggio aumentato'; | ||
| - | riskClass = ' | ||
| - | } else if (totalScore >= 3 && totalScore <= 4) { | ||
| - | riskText = '🟠 PUNTEGGIO 3-4 - Rischio moderato-alto - Valutazione clinica approfondita'; | ||
| - | riskClass = ' | ||
| - | } else if (totalScore >= 5) { | ||
| - | riskText = '🔴 PUNTEGGIO ≥5 - Rischio molto alto - Sospetta NEC - Azione immediata richiesta'; | ||
| - | riskClass = ' | ||
| - | } | ||
| - | | ||
| - | interpretation.textContent = riskText; | ||
| - | interpretation.className = ' | ||
| - | } | ||
| - | |||
| - | function resetCalculator() { | ||
| - | // Reset tutti i punteggi parametri principali | ||
| - | for (var param in currentScores) { | ||
| - | currentScores[param] = 0; | ||
| - | document.getElementById(param + ' | ||
| - | } | ||
| - | | ||
| - | // Reset fattori di rischio | ||
| - | for (var risk in riskFactors) { | ||
| - | riskFactors[risk] = false; | ||
| - | } | ||
| - | | ||
| - | totalScore = 0; | ||
| - | | ||
| - | // Rimuovi tutte le selezioni | ||
| - | var allOptions = document.querySelectorAll(' | ||
| - | for (var i = 0; i < allOptions.length; | ||
| - | allOptions[i].classList.remove(' | ||
| - | } | ||
| - | | ||
| - | // Reset display | ||
| - | document.getElementById(' | ||
| - | document.getElementById(' | ||
| - | document.getElementById(' | ||
| - | document.getElementById(' | ||
| - | } | ||
| - | |||
| - | function printResults() { | ||
| - | window.print(); | ||
| - | } | ||
| - | |||
| - | // Inizializzazione | ||
| - | calculateTotalScore(); | ||
| - | </ | ||
| - | </ | ||