Descripción
Función en static/js/editor/devices.js que recalcula y repinta los badges de capacidad en la cabecera del editor del rack. Ejecutándose cada vez que se añade, mueve o edita un equipo, y cuando se guarda los límites en el modal “Rack Information”.
Responsabilidad clave: aplicar colores a los badges (verde OK → ámbar ≥90% → rojo si se supera el límite).
Firma
export function updatePowerRollup()
Lógica
1. Cálculo de totales
const totalW = STATE.devices.reduce((s, d) => s + (Number(d.power_w) || 0), 0);
const totalKg = STATE.devices.reduce((s, d) => s + (Number(d.weight_kg) || 0), 0);
const usedU = STATE.devices.reduce((s, d) => s + (d.zero_u ? 0 : (Number(d.u_height) || 0)), 0);
- totalW (vatios): suma de
power_wen todos los equipos. - totalKg (kilogramos): suma de
weight_kg. - usedU (unidades de rack): suma de altura sin contar PDUs de 0U (
d.zero_u→ 0 altura).
2. Obtención de límites del rack
const maxW = Number(STATE.rackData?.max_power_w) || 0;
const maxKg = Number(STATE.rackData?.max_weight_kg) || 0;
const capacityU = Number(STATE.rackData?.height_u) || 0;
- Límites de 0 → “sin límite” (los badges no se colorean en ámbar/rojo).
3. Función helper: applyCapacityState(el, used, limit)
Aplica clases CSS según el porcentaje de uso:
limit = 0→ no hace nada (sin límite).used / limit > 100%→ añade clase.capacity-over(rojo,--danger).used / limit >= 90%→ añade clase.capacity-warn(ámbar,--warning).- Menos del 90% → solo remueve las clases (verde natural).
4. Actualización de badges
Badge de U (ocupadas/totales)
const uEl = document.querySelector('.rack-u-badge');
if (uEl && capacityU) {
uEl.textContent = `${usedU}/${capacityU}U`;
uEl.title = t('Used / total rack units');
applyCapacityState(uEl, usedU, capacityU);
}
Cambia el texto de 42U a 12/42U (ocupadas/totales) y aplica coloreo.
Badge de potencia
const powerEl = ensureBadge('rack-power-rollup', t('Total power draw of the rack'));
if (powerEl) {
powerEl.textContent = maxW > 0 ? `${totalW} / ${maxW} W` : `${totalW} W`;
powerEl.title = maxW > 0 ? t('Power draw vs. rack limit') : t('Total power draw of the rack');
applyCapacityState(powerEl, totalW, maxW);
}
Muestra 350 / 3500 W si hay límite, solo 350 W si no lo hay.
Badge de peso
let weightEl = document.getElementById('rack-weight-rollup');
if (totalKg > 0 || maxKg > 0) {
weightEl = ensureBadge('rack-weight-rollup', t('Total weight of the rack'));
if (weightEl) {
const kg = Math.round(totalKg * 10) / 10;
weightEl.textContent = maxKg > 0 ? `${kg} / ${maxKg} kg` : `${kg} kg`;
weightEl.title = maxKg > 0 ? t('Weight vs. rack limit') : t('Total weight of the rack');
applyCapacityState(weightEl, totalKg, maxKg);
}
} else if (weightEl) {
weightEl.remove();
}
Crea/actualiza el badge de peso solo si hay datos (totalKg > 0) o límite definido (maxKg > 0). Se redondea al 0.1 kg.
Estilos CSS
File: static/css/pages/editor.css
.rack-u-badge.capacity-warn {
color: var(--warning); /* ámbar */
border: 1px solid var(--warning);
background: color-mix(in oklab, var(--warning) 12%, #333);
}
.rack-u-badge.capacity-over {
color: var(--danger); /* rojo */
border: 1px solid var(--danger);
background: color-mix(in oklab, var(--danger) 12%, #333);
}
Usa los tokens de diseño del sistema (--warning, --danger) para mantener consistencia visual.
Integración
Cuándo se llama
- Al cambiar vista en el editor (línea en
applyViewMode()). - Al cargar el rack (en
main.js→initEditor()). - Al editar/añadir/mover equipos (handlers en
devices.js). - Al guardar el modal “Rack Information” (en
ui_panels.js→initRackInfoModal()→ guardado exitoso).
STATE global
Lee de:
STATE.devices— array de equipos conpower_w,weight_kg,u_height,zero_u.STATE.rackData— objeto del rack conmax_power_w,max_weight_kg,height_u.
Responsabilidades (DCIM #134)
| Aspecto | Detalle |
|---|---|
| Cálculo | Suma correcta de W/kg/U respetando PDUs 0U. |
| Límites | Lee desde STATE.rackData (refrescado en PUT /api/racks/{id}). |
| Coloreo | Aplica .capacity-warn / .capacity-over dinámicamente. |
| UX | Solo muestra peso si hay datos o límite (evita “0 kg”). |
| i18n | Los titles de los badges usan t() para traducciones. |
Véase también
- [[feature—racks—capacidad-por-rack]] — feature global (v1.57.0)
- [[entity—racks—endpoint—patch-rack-limits]] — obtención de límites via API
- [[entity—racks—model—rack]] — Rack.max_power_w / max_weight_kg