/* ============================================================================ * ENAPRO · Portal de Agencias — interfaz (React) * * Este archivo se puede editar y ver el cambio simplemente refrescando el * navegador (F5): no hay compilación ni build. Babel lo traduce al abrir. * * Reglas del proyecto que se respetan acá: * · Nada de confirm()/alert() del navegador: siempre modales in-app. * · El resaltado de "destino modificado" es del lado ENAPRO, no de la agencia. * · Filtros con etiqueta descriptiva explícita. * · Orden de columnas del panel ENAPRO fijo: * ESTADO · ENTRADA · SALIDA · BUQUE · BANDERA · PROCEDENCIA · DESTINO · * AGENCIA · TRN · ZONA · MUELLE · IMO · ITC · COMENTARIOS (+ Acciones) * ==========================================================================*/ const { useState, useEffect, useMemo, useCallback, useRef } = React; /* ====== LISTAS DE REFERENCIA ====== */ /* "Consultado" = ya se le mando el correo a la agencia y se espera respuesta. * Es un Pendiente al que ya le preguntamos: para la agencia se comporta igual * (lo ve en "Por confirmar" y lo puede completar), la diferencia es que ENAPRO * sabe a quien ya le escribio. En el Excel esa palabra ya significaba esto. */ /* CABOTAJE es un estado propio desde el 28/09/2026. Antes era un "No * corresponde" con el motivo anotado aparte, y los dos casos —el buque que no * paga por tratamiento de bandera y el que directamente no va a facturarse— * quedaban en el mismo montón. Ahora cada uno tiene su cuadro. * El orden de esta lista es el orden de los cuadros de arriba. */ const ESTADOS = ["Pendiente", "Consultado", "Confirmado", "Rechazado", "Facturado", "Cabotaje", "No corresponde"]; // Los dos estados en los que el movimiento todavia espera que la agencia cargue // los datos. Donde diga "esta pendiente", van los dos. const ESTADOS_PENDIENTES = ["Pendiente", "Consultado"]; // Un movimiento sin dueña. Es la otra mitad de la clave del filtro cruzado. function sinAgencia(s) { return String(s.agencia || "").trim().toUpperCase() === "SIN ASIGNAR" || !String(s.agencia || "").trim(); } // Clave de la casilla del filtro cruzado: "Rechazado|sin", "Facturado|con"… function casillaDe(s) { return s.estado + "|" + (sinAgencia(s) ? "sin" : "con"); } /* SIN DUEÑO: las casillas del cruce que van en el correo a TODAS las agencias. * Los rechazados (tengan agencia anotada o no: alguna ya dijo que no es suya) y * los que esperan datos sin agencia. NO entran los "No corresponde" sin agencia: * ésos ya están cerrados y no se reclaman. * * Está acá arriba, una sola vez, porque lo usan tres cosas que tienen que decir * lo mismo siempre: la tarjeta "Sin asignar", el botón del panel de filtros y el * armado del correo en el servidor (misma regla que esAReclamar + sePuedeConsultar). */ const CASILLAS_SIN_ASIGNAR = ["Rechazado|con", "Rechazado|sin", "Pendiente|sin", "Consultado|sin"]; // Deja escondidas todas las casillas MENOS las de la lista. function soloEstasCasillas(claves) { const o = {}; ESTADOS.forEach((e) => ["con", "sin"].forEach((lado) => { const k = e + "|" + lado; if (!claves.includes(k)) o[k] = true; })); return o; } /* Un movimiento "a reclamar": lo devolvio otra agencia o no tiene duena. Estos * no van en el correo de una agencia sino en el que se manda a todas en copia * oculta, para que cada una mire si alguno es suyo. */ function esAReclamar(s) { return s.estado === "Rechazado" || String(s.agencia || "").trim().toUpperCase() === "SIN ASIGNAR"; } // Los que se pueden tildar para consultar: los que esperan datos y los que hay // que difundir a todas. function sePuedeConsultar(s) { return ESTADOS_PENDIENTES.includes(s.estado) || s.estado === "Rechazado"; } /* ====== PALETA DE LA MARCA (lámina institucional del ENAPRO) ====== * #FFCB02 Pantone 116 C amarillo * #FF7402 Pantone 1505 C naranja * #FF6D7E Pantone 1777 C rosa * #E42153 Pantone 1925 C carmín * #3C3AE5 Pantone 2728 C violeta * #494963 Pantone 5265 C gris (encabezado de las tablas y botón de exportar) * * La franja de arriba de los nueve cuadros sale de esa lámina: son nueve puntos * repartidos a lo largo del degradé amarillo → violeta, así el primero queda * amarillo y el último violeta, como en la lámina. El orden es el de los * cuadros, que NO es el de ESTADOS: "Sin asignar" se mete entre Cabotaje y No * corresponde, y el Total va al final (ver CUADROS, más abajo). * * OJO: esto es decoración de los cuadros, NO el color de los estados. Las * pastillas de la tabla (Consultado violeta, Rechazado rojo…) siguen con sus * colores de siempre a propósito: ahí el color es lo que te deja distinguir una * fila de otra de un vistazo, y la paleta de la marca es toda cálida. */ const PARADAS_MARCA = ["#FFCB02", "#FF7402", "#FF6D7E", "#E42153", "#3C3AE5"]; /* Reparte N puntos a lo largo del degradé de la marca. Antes esto era una lista * fija de nueve colores escritos a mano; ahora se calcula porque los cuadros se * pueden esconder (ver CUADROS, abajo) y con ocho o con seis la fila tiene que * seguir yendo de amarillo a violeta, no quedarse cortada en carmín. * * Con nueve da exactamente los mismos nueve colores de antes — la lista vieja * era justamente esta cuenta hecha a mano. */ function franjaCuadros(n) { const p = PARADAS_MARCA.map((h) => [parseInt(h.slice(1, 3), 16), parseInt(h.slice(3, 5), 16), parseInt(h.slice(5, 7), 16)]); if (n <= 1) return [PARADAS_MARCA[0]]; const out = []; for (let i = 0; i < n; i++) { const x = (i / (n - 1)) * (p.length - 1); const a = p[Math.floor(x)], b = p[Math.min(Math.ceil(x), p.length - 1)], t = x - Math.floor(x); out.push("#" + a.map((v, k) => Math.round(v + (b[k] - v) * t).toString(16).padStart(2, "0")).join("")); } return out; } /* LOS CUADROS DE ARRIBA, en el orden en que van. * * No es el orden de ESTADOS y no son todos estados: "Sin asignar" es un cruce * (rechazados + sin agencia) y "Total" es una suma. Por eso la lista se escribe * acá y no se recorre ESTADOS a secas. * * Esta misma lista la usan la fila de cuadros Y el panel de "Cuadros" que deja * esconderlos, así que agregar uno nuevo se hace en un solo lugar. */ const CUADROS = [ { clave: "Pendiente", label: "Pendiente" }, { clave: "Consultado", label: "Consultado" }, { clave: "Confirmado", label: "Confirmado" }, { clave: "Rechazado", label: "Rechazado" }, { clave: "Facturado", label: "Facturado" }, { clave: "Cabotaje", label: "Cabotaje" }, { clave: "sinAsignar", label: "Sin asignar" }, { clave: "No corresponde", label: "No corresponde" }, { clave: "total", label: "Total" }, ]; /* El degradé de la lámina, de punta a punta. Se usa en las dos franjas de la * marca: la que cierra la tarjeta de ingreso y la que cierra la barra de * arriba. Va con los colores escritos y NO con variables de tema: es el * degradé institucional y se ve igual de día y de noche. */ const DEGRADE_MARCA = "linear-gradient(90deg,#FFCB02 0%,#FF7402 27%,#FF6D7E 50%,#E42153 72%,#3C3AE5 100%)"; const ESTADO_COLOR = { Pendiente: { bg: "var(--f-fef3c7)", fg: "var(--t-92400e)", dot: "var(--f-d97706)" }, Confirmado: { bg: "var(--f-dcfce7)", fg: "var(--t-166534)", dot: "var(--f-16a34a)" }, Rechazado: { bg: "var(--f-fee2e2)", fg: "var(--t-991b1b)", dot: "var(--f-dc2626)" }, Facturado: { bg: "var(--f-dbeafe)", fg: "var(--t-1e40af)", dot: "var(--f-2563eb)" }, Consultado: { bg: "var(--f-ede9fe)", fg: "var(--t-5b21b6)", dot: "var(--f-7c3aed)" }, Cabotaje: { bg: "var(--f-e0f2fe)", fg: "var(--t-075985)", dot: "var(--f-2563eb)" }, "No corresponde": { bg: "var(--f-f1f5f9)", fg: "var(--t-475569)", dot: "var(--f-64748b)" }, }; let PAISES = ["Afganistán","Albania","Alemania","Angola","Arabia Saudita","Argelia","Argentina","Armenia","Australia","Austria","Azerbaiyán","Bahamas","Bangladés","Barbados","Baréin","Bélgica","Belice","Benín","Bielorrusia","Birmania","Bolivia","Bosnia y Herzegovina","Botsuana","Brasil","Brunéi","Bulgaria","Burkina Faso","Burundi","Bután","Cabo Verde","Camboya","Camerún","Canadá","Catar","Chad","Chile","China","Chipre","Colombia","Comoras","Corea del Norte","Corea del Sur","Costa de Marfil","Costa Rica","Croacia","Cuba","Dinamarca","Dominica","Ecuador","Egipto","El Salvador","Emiratos Árabes Unidos","Eritrea","Eslovaquia","Eslovenia","España","Estados Unidos","Estonia","Etiopía","Filipinas","Finlandia","Fiyi","Francia","Gabón","Gambia","Georgia","Ghana","Gibraltar","Grecia","Guatemala","Guinea","Guinea-Bisáu","Guinea Ecuatorial","Guyana","Haití","Honduras","Hong Kong","Hungría","India","Indonesia","Irak","Irán","Irlanda","Isla de Man","Islandia","Islas Caimán","Islas Marshall","Israel","Italia","Jamaica","Japón","Jordania","Kazajistán","Kenia","Kirguistán","Kiribati","Kuwait","Laos","Lesoto","Letonia","Líbano","Liberia","Libia","Liechtenstein","Lituania","Luxemburgo","Madagascar","Malasia","Malaui","Maldivas","Malí","Malta","Marruecos","Mauricio","Mauritania","México","Moldavia","Mónaco","Mongolia","Montenegro","Mozambique","Namibia","Nauru","Nepal","Nicaragua","Níger","Nigeria","Noruega","Nueva Zelanda","Omán","Países Bajos","Pakistán","Panamá","Papúa Nueva Guinea","Paraguay","Perú","Polonia","Portugal","Reino Unido","República Centroafricana","República Checa","República del Congo","República Democrática del Congo","República Dominicana","Ruanda","Rumanía","Rusia","Samoa","San Cristóbal y Nieves","San Marino","San Vicente y las Granadinas","Santa Lucía","Santo Tomé y Príncipe","Senegal","Serbia","Seychelles","Sierra Leona","Singapur","Siria","Somalia","Sri Lanka","Sudáfrica","Sudán","Sudán del Sur","Suecia","Suiza","Surinam","Tailandia","Tanzania","Tayikistán","Timor Oriental","Togo","Tonga","Trinidad y Tobago","Túnez","Turkmenistán","Turquía","Tuvalu","Ucrania","Uganda","Uruguay","Uzbekistán","Vanuatu","Venezuela","Vietnam","Yemen","Yibuti","Zambia","Zimbabue"]; // Además de países, el Excel usa puertos y plazas argentinas como destino. let DESTINOS_EXTRA = ["ROSARIO","SAN LORENZO","SAN NICOLAS","VILLA CONSTITUCION","BAHIA BLANCA","BUENOS AIRES","CAMPANA","DOCK SUD","LA PLATA","NECOCHEA","SANTA FE","ZARATE","RECALADA","SAN MARTIN","PUERTO MADRYN","USHUAIA"]; // Palabra que ENAPRO tiene que escribir en la columna ESTADO del Excel para // cada estado del portal. Espeja ESTADO_PORTAL_A_EXCEL de lib/sync.js. const ESTADO_EN_EXCEL = { // Pendiente escribe "Pendiente" (15/09/2026): ahora que "Consultado" del // Excel entra al portal como Consultado, cada estado escribe su propio // nombre. Si no, un Pendiente se iba al Excel como "Consultado" y volvia // convertido en Consultado sin que se le hubiera mandado ningun correo. Pendiente: "Pendiente", Consultado: "Consultado", Confirmado: "Confirmado", Rechazado: "Rechazado", Facturado: "Facturar", "No corresponde": "No corresponde", }; // Tope del comentario. Antes NO había ninguno: ni en pantalla ni en el // servidor, así que un pegado largo entraba entero a data/db.json y al respaldo. // Y una celda de Excel no admite más de 32.767 caracteres: con un comentario más // largo que eso, el respaldo .xlsx se rompía entero. 500 alcanza de sobra para // "la bandera correcta es Panamá; el muelle es 442 VICENTIN". const MAX_COMENTARIO = 500; /* ZONAS, MUELLES_POR_ZONA, ZONA_DE_MUELLE y zonaDeMuelle() NO se declaran acá: * las define /muelles.js, que index.html carga antes de este archivo y que el * servidor genera a partir de lib/muelles.js. * * Estaban acá hasta el 04/09/2026, y ése era el problema: el servidor no las * tenía, así que no podía completar la zona de un movimiento a partir del * muelle. Copiarlas al servidor habría dejado dos listas destinadas a * desincronizarse. Ahora hay una sola, del lado del servidor, y el navegador * la recibe servida. */ const TIPOS_ARCHIVO = ".pdf,.doc,.docx,.xls,.xlsx,.jpg,.jpeg,.png"; /* Columnas del panel ENAPRO. El ORDEN es fijo y obligatorio (regla del * proyecto): PASAVANTE va antes de IMO, como pidió el usuario. * * · `clave` identifica la columna para poder ocultarla. * · `w` ancho relativo. No hace falta que sumen 100: al ocultar columnas se * renormalizan solas, así el ancho sobrante lo reparten las visibles. * · `fijo` columnas que no se pueden ocultar (sin ellas la tabla no se usa). * · `celda` cómo se dibuja el dato. Tener el render acá permite ocultar * columnas sin repetir la fila entera en cada pestaña. */ const COLS_ADMIN = [ // Casilla para elegir a que movimientos mandarles la consulta por correo. // Es fija: no se puede ocultar desde el menu de columnas. { clave: "sel", label: "", w: 2.2, fijo: true }, { clave: "estado", label: "Estado", w: 8.5, fijo: true }, { clave: "entrada", label: "Entrada", w: 5.6, nowrap: true }, { clave: "salida", label: "Salida", w: 5.6, nowrap: true }, { clave: "buque", label: "Buque", w: 9, fijo: true }, { clave: "band", label: "Bandera", w: 5.9 }, { clave: "procedencia", label: "Procedencia", w: 6.2 }, { clave: "destino", label: "Destino", w: 6.4 }, { clave: "agencia", label: "Agencia", w: 7.2 }, { clave: "trn", label: "TRN", w: 4.6, nowrap: true }, { clave: "zona", label: "Zona", w: 5.6 }, { clave: "muelle", label: "Muelle", w: 8.2 }, { clave: "pasavante", label: "Pasavante", w: 5.2, nowrap: true }, { clave: "imo", label: "IMO", w: 5.2, nowrap: true }, { clave: "itc", label: "Adj.", w: 3.4 }, { clave: "comentario", label: "Comentarios", w: 5.1 }, { clave: "acciones", label: "Acciones", w: 11.5, fijo: true }, ]; /* Columnas de las tablas del PANEL DE AGENCIAS. Mismo mecanismo que arriba, con * su propia lista porque la agencia ve menos datos y en otro orden: el orden del * viaje (de dónde vino, a dónde fue). * * `soloEstado` marca la columna que sólo tiene sentido cuando la lista mezcla * estados: en "Por confirmar" todo está Pendiente y en "Rechazados" todo está * Rechazado, así que ahí la columna no se dibuja ni aparece en el menú. * `soloMios` es lo mismo para la lista de rechazados, que es de todas las * agencias: el pasavante de un movimiento ajeno no se muestra (y el servidor * tampoco lo manda, ver estadoCompleto). * No llevan `w`: esta tabla usa anchos naturales y desliza si hace falta. */ const COLS_AGENCIA = [ { clave: "buque", label: "Buque", fijo: true }, { clave: "estado", label: "Estado", soloEstado: true }, { clave: "band", label: "Bandera" }, { clave: "entrada", label: "Entrada" }, { clave: "salida", label: "Salida" }, /* Procedencia y Destino van SEPARADAS (25/09/2026): antes iban juntas en una sola columna "Procedencia → Destino". La agencia ve la misma tabla que ENAPRO, un dato por columna, así se puede ordenar y copiar de a uno. */ { clave: "procedencia", label: "Procedencia" }, { clave: "destino", label: "Destino" }, { clave: "zona", label: "Zona" }, { clave: "muelle", label: "Muelle" }, { clave: "motivo", label: "Por qué está acá", soloReclamar: true }, { clave: "pasavante", label: "Pasavante", soloMios: true }, { clave: "adjuntos", label: "Adjuntos" }, ]; // Qué columnas van en cada pestaña de la agencia. function colsAgencia(mostrarEstado, listaAjena) { return COLS_AGENCIA.filter((c) => (!c.soloEstado || mostrarEstado) && (!c.soloMios || !listaAjena) && (!c.soloReclamar || listaAjena)); } /* Preferencia de columnas ocultas. Se guarda en el navegador para que no haya * que volver a destildar IMO en cada F5. Va con try/catch: si el navegador no * deja usar localStorage, simplemente no se recuerda. * * Dos claves distintas: ENAPRO y las agencias tienen columnas con el mismo * nombre (Bandera, Muelle, Pasavante…) y si compartieran la preferencia, * esconder una en un panel la escondería en el otro. */ const CLAVE_COLUMNAS = "enapro.columnasOcultas"; const CLAVE_COLUMNAS_AG = "enapro.columnasOcultasAgencia"; function leerColumnas(clave) { try { const v = JSON.parse(window.localStorage.getItem(clave || CLAVE_COLUMNAS) || "{}"); return v && typeof v === "object" ? v : {}; } catch (e) { return {}; } } function guardarColumnas(clave, v) { try { window.localStorage.setItem(clave || CLAVE_COLUMNAS, JSON.stringify(v)); } catch (e) {} } /* Cuadros escondidos (pedido del usuario, 28/09/2026: "podría tener la opción * de ocultar cuadros de datos?"). * * Mismo mecanismo que las columnas —se guarda en el navegador de cada uno, así * que cada usuario del ENAPRO lo deja como quiere y a los demás no les cambia. * * ESCONDER ES SÓLO VISUAL y esto importa: los movimientos siguen estando, el * filtro por estado los sigue ofreciendo y el TOTAL SIGUE CONTÁNDOLOS. Si el * Total bajara al esconder un cuadro, el número dejaría de ser un dato y * pasaría a depender de cómo tenga cada uno configurada la pantalla. */ const CLAVE_CUADROS = "enapro.cuadrosOcultos"; function leerCuadrosOcultos() { try { const v = JSON.parse(window.localStorage.getItem(CLAVE_CUADROS) || "{}"); return v && typeof v === "object" ? v : {}; } catch (e) { return {}; } } function guardarCuadrosOcultos(v) { try { window.localStorage.setItem(CLAVE_CUADROS, JSON.stringify(v)); } catch (e) {} } /* MODO COMPACTO. Achica todo lo que hay ARRIBA de la tabla para que la primera * fila quede lo mas alta posible en la pantalla. * * Para que: ENAPRO carga la facturacion en otro programa y trabaja con las dos * ventanas encimadas —el portal arriba, el de facturacion abajo— copiando los * datos de un movimiento por vez. Cada pixel que gana la tabla es un renglon * mas que se ve sin tapar el otro programa. Medido: la primera fila arrancaba * en y=461 de 1000, o sea que casi la mitad de la pantalla era encabezado. * * Se esconden los contadores por estado y la fila de referencias, y se achica la * barra de arriba. Nada de eso cambia QUE movimientos se ven: la lista es * exactamente la misma, solo empieza mas arriba. Por eso SI se recuerda para la * proxima vez, al reves que el filtro de estados, que si esconde filas. */ const CLAVE_COMPACTO = "enapro.modoCompacto"; function leerCompacto() { try { return window.localStorage.getItem(CLAVE_COMPACTO) === "1"; } catch (e) { return false; } } function guardarCompacto(v) { try { window.localStorage.setItem(CLAVE_COMPACTO, v ? "1" : "0"); } catch (e) {} } /* ====== utilidades ====== */ function fmt(d) { if (!d) return "—"; const [y, m, day] = String(d).slice(0, 10).split("-"); return day && m && y ? `${day}/${m}/${y}` : d; } // ¿Es un año de cuatro cifras? Si no, la fecha vino mal del Excel (aparecieron // casos como "206-07-10") y hay que mostrarla completa, no abreviada, para que // se note el error en lugar de disimularlo. function anioValido(y) { return /^\d{4}$/.test(String(y || "")); } // Versión corta para las tablas: dd/mm/aa. Ahorra ancho de columna. function fmtCorto(d) { if (!d) return "—"; const [y, m, day] = String(d).slice(0, 10).split("-"); if (!day || !m || !y) return d; return anioValido(y) ? `${day}/${m}/${y.slice(2)}` : `${day}/${m}/${y}`; } function fmtHora(iso) { if (!iso) return "nunca"; const d = new Date(iso); return d.toLocaleString("es-AR", { day: "2-digit", month: "2-digit", year: "numeric", hour: "2-digit", minute: "2-digit" }); } // Días enteros desde una fecha. null si no hay fecha o no se entiende. function diasDesde(iso) { const t = Date.parse(iso || ""); if (isNaN(t)) return null; return Math.floor((Date.now() - t) / 86400000); } // "hoy" / "ayer" / "hace 5 días", para los tooltips. function haceCuanto(iso) { const d = diasDesde(iso); if (d === null) return ""; if (d <= 0) return "hoy"; if (d === 1) return "ayer"; return "hace " + d + " días"; } /* Igual que haceCuanto pero con minutos: para cosas que pasaron recién (quién * está conectado ahora, quién tocó la ficha mientras la tenías abierta). Ahí * "hace 0 días" no dice nada. */ function haceRato(iso) { const t = Date.parse(iso); if (isNaN(t)) return ""; const min = Math.floor((Date.now() - t) / 60000); if (min < 1) return "recién"; if (min === 1) return "hace 1 minuto"; if (min < 60) return "hace " + min + " minutos"; const h = Math.floor(min / 60); if (h === 1) return "hace 1 hora"; if (h < 24) return "hace " + h + " horas"; return haceCuanto(iso); } /* Cuántos días se considera que una consulta sigue "fresca". * Dentro de ese plazo, volver a mandarla es repetir; pasado, ya es razonable * volver a preguntar y la marca se apaga sola para no ensuciar la pantalla. */ const DIAS_CONSULTA_FRESCA = 7; // dd/mm corto, para la marca al lado del estado. function ddmmCorto(iso) { const d = new Date(iso); if (isNaN(d.getTime())) return ""; return String(d.getDate()).padStart(2, "0") + "/" + String(d.getMonth() + 1).padStart(2, "0"); } /* El pasavante como número. Se ordena numérico y no como texto: hoy son todos * de 5 cifras y daría igual, pero el día que pasen a 6 el orden alfabético * pondría "100001" antes que "64822". */ function pasavanteNum(v) { const n = parseInt(String(v == null ? "" : v).replace(/\D/g, ""), 10); return isNaN(n) ? null : n; } function sortShips(list, mode) { const arr = [...list]; if (mode === "salida_desc") arr.sort((a, b) => String(b.salida || "").localeCompare(String(a.salida || ""))); else if (mode === "salida_asc") arr.sort((a, b) => String(a.salida || "").localeCompare(String(b.salida || ""))); else if (mode === "reciente") arr.sort((a, b) => (b.id || 0) - (a.id || 0)); /* Por agencia, alfabetico. Sirve para preparar los correos: las filas de la * misma agencia quedan juntas y se tildan de un tiron. Dentro de cada agencia * manda la salida mas nueva, que es el orden de siempre. Los que no tienen * agencia van al final: no son de nadie todavia. */ else if (mode === "agencia_asc" || mode === "agencia_desc") { const dir = mode === "agencia_asc" ? 1 : -1; const clave = (s) => { const a = String(s.agencia || "").trim().toUpperCase(); return (!a || a === "SIN ASIGNAR") ? null : a; }; arr.sort((a, b) => { const x = clave(a), y = clave(b); if (x === null && y === null) return String(b.salida || "").localeCompare(String(a.salida || "")); if (x === null) return 1; if (y === null) return -1; if (x !== y) return x.localeCompare(y, "es") * dir; return String(b.salida || "").localeCompare(String(a.salida || "")); }); } else if (mode === "pasavante_desc" || mode === "pasavante_asc") { // Los que no tienen pasavante van SIEMPRE al final, en los dos sentidos: son // los que todavía no se facturaron y no tiene sentido que encabecen la lista. const dir = mode === "pasavante_asc" ? 1 : -1; arr.sort((a, b) => { const x = pasavanteNum(a.pasavante), y = pasavanteNum(b.pasavante); if (x === null && y === null) return String(b.salida || "").localeCompare(String(a.salida || "")); if (x === null) return 1; if (y === null) return -1; return (x - y) * dir; }); } return arr; } /* --------------------------------------------------------------------------- * El nombre del buque, sin las aclaraciones entre paréntesis. * * En el Excel hay nombres como "IONA ISLAND (reclama WAVE)": el paréntesis es una * nota de quien cargó la fila, no parte del nombre del barco, y lo mismo ya está * escrito en la columna COMENTARIO. En pantalla va sólo el nombre. * * Se limpia SÓLO para mostrar: el valor guardado no se toca (es la clave con la * que se empareja la fila del Excel) y el buscador sigue encontrando por el texto * completo, así que buscar "WAVE" sigue trayendo ese movimiento. * ------------------------------------------------------------------------- */ function nombreLimpio(v) { return String(v == null ? "" : v).replace(/\s*\([^)]*\)/g, " ").replace(/\s+/g, " ").trim(); } // Lo que decía el paréntesis, y sólo si no está ya en ninguno de los dos // comentarios. Así sacarlo del nombre no puede hacer perder información. function notaDelNombre(s) { const m = String(s.buque || "").match(/\(([^)]*)\)/g); if (!m) return ""; const norm = (x) => String(x || "").normalize("NFD").replace(/[̀-ͯ]/g, "").toUpperCase(); // Palabra por palabra, no la frase entera: el nombre dice "(reclama WAVE)" y el // comentario "Reclama agencia WAVE" — es la misma información con una palabra // más en el medio, así que comparar las frases completas no la reconocía. const yaEsta = norm((s.comentario || "") + " " + (s.comentarioExcel || "")).replace(/[^A-Z0-9]+/g, " "); const cubierta = (t) => norm(t).split(/[^A-Z0-9]+/).filter((w) => w.length > 2) .every((w) => yaEsta.includes(w)); const faltan = m.map((t) => t.replace(/[()]/g, "").trim()).filter((t) => t && !cubierta(t)); return faltan.join(" · "); } /* Los avisos que todavía valen la pena mostrar. Cuando ENAPRO trabaja el * movimiento (le cambia el estado o lo edita) el servidor anota qué avisos había * en ese momento; esos ya los vio y no tienen que quedar molestando para * siempre. Si después aparece uno NUEVO, ese sí se muestra. */ function avisosVigentes(s) { const avisos = s.avisos || []; if (!avisos.length || !s.revisado) return avisos; const vistos = s.revisado.avisos || []; return avisos.filter((a) => !vistos.includes(a.codigo)); } /* ====== cliente de la API ====== */ async function pedir(ruta, opciones) { const o = Object.assign({ credentials: "same-origin" }, opciones || {}); if (o.json) { o.method = o.method || "POST"; o.headers = { "Content-Type": "application/json" }; o.body = JSON.stringify(o.json); delete o.json; } let r; try { r = await fetch(ruta, o); } catch (e) { // fetch lanza TypeError "Failed to fetch" cuando NO pudo llegar al servidor. // Es lo que pasa si el portal está cerrado o si se está reiniciando justo en // ese momento. El mensaje crudo del navegador no le dice nada a nadie. // Sirve para la PC y para internet: ahí no hay "ventana negra" que mirar. const err = new Error("No se pudo conectar con el portal. Revisá tu conexión a internet; si el portal se está actualizando, esperá unos segundos y probá otra vez."); err.sinConexion = true; throw err; } let cuerpo = null; try { cuerpo = await r.json(); } catch (e) { cuerpo = {}; } if (!r.ok) { const err = new Error( // En el ingreso, el 401 es "correo o contraseña incorrectos" y hay que // mostrar eso; en cualquier otro lado quiere decir que la sesión se cerró. r.status === 401 && ruta !== "/api/login" ? "La sesión se cerró. Volvé a entrar." : cuerpo.error || "Error " + r.status ); err.status = r.status; // El 409 es el choque de dos personas editando lo mismo: viaja con el dato // de quién lo tocó y cuándo, para poder mostrar el aviso (ver PISADAS). if (cuerpo && cuerpo.pisada) err.pisada = cuerpo.pisada; throw err; } return cuerpo; } /* ====== MODO CLARO / MODO NOCHE ====== * Los colores viven en index.html, en dos juegos. Acá sólo se le pone (o se le * saca) el atributo data-tema="noche" al y listo: cambia todo el portal * de golpe, sin volver a dibujar nada. * * El tema se guarda en el USUARIO (servidor), así lo tenés igual desde * cualquier computadora. La copia en localStorage es sólo para no ver un * destello blanco mientras el portal averigua quién sos: ver el