Questa è una vecchia versione del documento!
<!DOCTYPE html> <html lang=“it”> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Calcolatore NEC per DokuWiki</title>
<style>
/* Stili compatibili con DokuWiki */
.nec-calculator {
font-family: Arial, sans-serif;
max-width: 900px;
margin: 20px auto;
background: #fff;
border: 1px solid #ccc;
border-radius: 5px;
padding: 20px;
}
.nec-title {
text-align: center;
color: #333;
margin-bottom: 20px;
font-size: 24px;
font-weight: bold;
}
.section {
margin-bottom: 20px;
border: 2px solid #666;
border-radius: 5px;
overflow: hidden;
}
.section-header {
padding: 10px 15px;
font-weight: bold;
color: white;
display: flex;
justify-content: space-between;
align-items: center;
font-size: 16px;
}
.general { background-color: #8FBC8F; }
.abdominal { background-color: #90EE90; }
.bilious { background-color: #FFB6C1; }
.investigations { background-color: #98FB98; }
.xray { background-color: #87CEEB; }
.section-content {
background-color: #f9f9f9;
}
.item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 12px 15px;
border-bottom: 1px solid #ddd;
background-color: white;
}
.item:nth-child(even) {
background-color: #f5f5f5;
}
.item:last-child {
border-bottom: none;
}
.item-text {
flex: 1;
font-size: 14px;
}
.item-score {
font-weight: bold;
margin: 0 15px;
min-width: 30px;
text-align: center;
}
.checkbox-container {
display: flex;
align-items: center;
}
.custom-checkbox {
width: 20px;
height: 20px;
cursor: pointer;
transform: scale(1.2);
}
.scoring-summary {
margin-top: 30px;
padding: 20px;
border: 3px solid #333;
border-radius: 10px;
background: linear-gradient(135deg, #f0f8ff, #e6f3ff);
}
.subtotal {
display: flex;
justify-content: space-between;
margin: 8px 0;
font-weight: bold;
padding: 5px 10px;
background-color: #e9e9e9;
border-radius: 3px;
}
.total-score {
font-size: 24px;
text-align: center;
margin: 20px 0;
padding: 15px;
border: 2px solid #333;
border-radius: 8px;
background-color: #fff;
}
.interpretation {
text-align: center;
font-size: 18px;
font-weight: bold;
padding: 15px;
border-radius: 8px;
margin-top: 15px;
}
.risk-low { background-color: #d4edda; color: #155724; }
.risk-moderate { background-color: #fff3cd; color: #856404; }
.risk-high { background-color: #f8d7da; color: #721c24; }
.risk-very-high { background-color: #d1ecf1; color: #0c5460; }
.special-note {
background-color: #fff3cd;
border: 1px solid #ffeaa7;
border-radius: 5px;
padding: 10px;
margin: 10px 0;
font-style: italic;
font-size: 13px;
}
.reset-button {
background-color: #dc3545;
color: white;
border: none;
padding: 10px 20px;
border-radius: 5px;
cursor: pointer;
font-size: 16px;
margin-top: 20px;
}
.reset-button:hover {
background-color: #c82333;
}
.print-button {
background-color: #007bff;
color: white;
border: none;
padding: 10px 20px;
border-radius: 5px;
cursor: pointer;
font-size: 16px;
margin-top: 20px;
margin-left: 10px;
}
.print-button:hover {
background-color: #0056b3;
}
</style>
</head> <body>
<div class="nec-calculator">
<h1 class="nec-title">Calcolatore di Scoring per Enterocolite Necrotizzante (NEC)</h1>
<!-- Segni Generali -->
<div class="section">
<div class="section-header general">
<span>Segni Generali (cambiamenti nelle ultime 12 ore)</span>
<span>Max: 2 punti | Corrente: <span id="general-subtotal">0</span></span>
</div>
<div class="section-content">
<div class="item">
<span class="item-text">Aumentata frequenza di desaturazioni/bradicardie</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="general" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">Tachicardia (in assenza di ipertermia)</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="general" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">Apnea</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="general" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">Instabilità della temperatura</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="general" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">Improvviso aumento delle impostazioni ventilatorie</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="general" onchange="updateScore()">
</div>
</div>
</div>
</div>
<!-- Segni Addominali -->
<div class="section">
<div class="section-header abdominal">
<span>Segni Addominali</span>
<span>Max: 8 punti | Corrente: <span id="abdominal-subtotal">0</span></span>
</div>
<div class="section-content">
<div class="item">
<span class="item-text">Peggioramento della distensione addominale/scoloramento</span>
<span class="item-score">2</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="2" data-category="abdominal" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">Dolorabilità addominale</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="abdominal" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">Aumentati aspirati</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="abdominal" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">>30% dell'ultima poppata, o >2-5ml aspirato singolo</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="abdominal" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">Vomito</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="abdominal" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">Sangue visibile nelle feci</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="abdominal" onchange="updateScore()">
</div>
</div>
</div>
</div>
<!-- Vomito Bilioso -->
<div class="section">
<div class="section-header bilious">
<span>Vomito Bilioso</span>
<span>Punteggio: <span id="bilious-subtotal">0</span></span>
</div>
<div class="section-content">
<div class="special-note">
<strong>⚠️ IMPORTANTE:</strong> Punteggio SOLO se precedentemente tollerava l'alimentazione completa per 48 ore
</div>
<div class="item">
<span class="item-text">Vomito bilioso (con alimentazione tollerata per 48h)</span>
<span class="item-score">4</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="4" data-category="bilious" onchange="updateScore()">
</div>
</div>
</div>
</div>
<!-- Indagini -->
<div class="section">
<div class="section-header investigations">
<span>Indagini</span>
<span>Max: 5 punti | Corrente: <span id="investigations-subtotal">0</span></span>
</div>
<div class="section-content">
<div class="item">
<span class="item-text">Nuova/peggiorante acidosi metabolica</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="investigations" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">Nuovi/peggioranti cambiamenti metabolici (alto lattato, basso glucosio/sodio ecc.)</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="investigations" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">Conta leucocitaria suggestiva di sepsi</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="investigations" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">PCR elevata/in aumento</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="investigations" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">Piastrine basse/in calo</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="investigations" onchange="updateScore()">
</div>
</div>
</div>
</div>
<!-- Radiografia Addominale -->
<div class="section">
<div class="section-header xray">
<span>Radiografia Addominale</span>
<span>Corrente: <span id="xray-subtotal">0</span></span>
</div>
<div class="section-content">
<div class="item">
<span class="item-text">Evidenza di perforazione</span>
<span class="item-score">8</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="8" data-category="xray" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">Evidenza di pneumatosi</span>
<span class="item-score">8</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="8" data-category="xray" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">Evidenza di fluido peritoneale</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="xray" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">Dilatazione dell'ansa intestinale</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="xray" onchange="updateScore()">
</div>
</div>
<div class="item">
<span class="item-text">Addome senza gas</span>
<span class="item-score">1</span>
<div class="checkbox-container">
<input type="checkbox" class="custom-checkbox" data-score="1" data-category="xray" onchange="updateScore()">
</div>
</div>
</div>
</div>
<!-- Riassunto Punteggi -->
<div class="scoring-summary">
<h3 style="text-align: center; margin-top: 0;">Riassunto Punteggi</h3>
<div class="subtotal">
<span>Segni Generali:</span>
<span><span id="general-total">0</span> / 5</span>
</div>
<div class="subtotal">
<span>Segni Addominali:</span>
<span><span id="abdominal-total">0</span> / 8</span>
</div>
<div class="subtotal">
<span>Vomito Bilioso:</span>
<span><span id="bilious-total">0</span> / 4</span>
</div>
<div class="subtotal">
<span>Indagini:</span>
<span><span id="investigations-total">0</span> / 5</span>
</div>
<div class="subtotal">
<span>Radiografia:</span>
<span><span id="xray-total">0</span> / 19</span>
</div>
<div class="total-score">
<strong>PUNTEGGIO TOTALE: <span id="total-score">0</span> / 41</strong>
</div>
<div id="interpretation" class="interpretation">
Inserire i dati per la valutazione
</div>
<div style="text-align: center;">
<button class="reset-button" onclick="resetCalculator()">🔄 Reset</button>
<button class="print-button" onclick="printResults()">🖨️ Stampa</button>
</div>
</div>
</div>
<script>
function updateScore() {
// Calcola i subtotali per categoria
const categories = ['general', 'abdominal', 'bilious', 'investigations', 'xray'];
let totalScore = 0;
categories.forEach(category => {
const checkboxes = document.querySelectorAll(`input[data-category="${category}"]`);
let subtotal = 0;
checkboxes.forEach(checkbox => {
if (checkbox.checked) {
subtotal += parseInt(checkbox.getAttribute('data-score'));
}
});
// Aggiorna i subtotali nell'header e nel riassunto
document.getElementById(`${category}-subtotal`).textContent = subtotal;
document.getElementById(`${category}-total`).textContent = subtotal;
totalScore += subtotal;
});
// Aggiorna il punteggio totale
document.getElementById('total-score').textContent = totalScore;
// Aggiorna l'interpretazione
updateInterpretation(totalScore);
}
function updateInterpretation(score) {
const interpretationElement = document.getElementById('interpretation');
let interpretation, className;
if (score <= 5) {
interpretation = "🟢 BASSO RISCHIO - Monitoraggio di routine";
className = "risk-low";
} else if (score <= 10) {
interpretation = "🟡 RISCHIO MODERATO - Monitoraggio stretto consigliato";
className = "risk-moderate";
} else if (score <= 15) {
interpretation = "🟠 ALTO RISCHIO - Considerare terapia intensiva";
className = "risk-high";
} else {
interpretation = "🔴 RISCHIO MOLTO ALTO - Valutare urgentemente intervento chirurgico";
className = "risk-very-high";
}
interpretationElement.textContent = interpretation;
interpretationElement.className = `interpretation ${className}`;
}
function resetCalculator() {
// Deseleziona tutte le checkbox
const checkboxes = document.querySelectorAll('.custom-checkbox');
checkboxes.forEach(checkbox => {
checkbox.checked = false;
});
// Aggiorna tutti i punteggi
updateScore();
}
function printResults() {
window.print();
}
// Inizializza il calcolatore
document.addEventListener('DOMContentLoaded', function() {
updateScore();
});
</script>
</body> </html>