diff --git a/1.php b/1.php index 25c7d3e..a3ee541 100644 --- a/1.php +++ b/1.php @@ -5,7 +5,7 @@ - Test 3, 4 + Test 1, 2, 3, 4, 5, 6 \ No newline at end of file diff --git a/123.php b/123.php deleted file mode 100644 index e69de29..0000000 diff --git a/CONTEXT.md b/CONTEXT.md index 66b58c2..efe4dd0 100644 --- a/CONTEXT.md +++ b/CONTEXT.md @@ -2,27 +2,28 @@ ## Resumen Ejecutivo de la Sesión -El objetivo principal de esta sesión consistió en la creación e implementación de **`colaborando3.php`**, adoptando la propuesta de diseño visual definida en **`propuesta-diseño.html`**, y la depuración del código en **`jsCode.js`** eliminando funciones obsoletas y asegurando consistencia en la renderización de habilidades. +El objetivo principal de esta sesión consistió en la creación e implementación de **`colaborando3.php`**, la depuración del código en **`jsCode.js`**, y la refactorización arquitectónica de estilos mediante la extracción a **`estilos3.css`** con control de caché dinámico (*cache busting*). --- ## Decisiones Principales y Arquitectura -1. **Creación y Refactorización de `colaborando3.php`**: +1. **Desacoplamiento de Estilos (`estilos3.css`)**: + * Se extrajeron más de 1,470 líneas del bloque ` + @@ -1501,7 +36,7 @@
- Ir al Resumen + Ir al Resumen
diff --git a/doc/PROYECTO.md b/doc/PROYECTO.md deleted file mode 100644 index 0a2ca19..0000000 --- a/doc/PROYECTO.md +++ /dev/null @@ -1,80 +0,0 @@ -# Documentación General y Bitácora de Cambios - Co.Laborando - -> [!IMPORTANT] -> **Regla de Mantenimiento:** Para evitar el consumo excesivo de tokens, este archivo debe mantenerse conciso, con un tamaño objetivo de **entre 150 y 250 líneas** en total. Al realizar nuevos cambios, se debe resumir o actualizar la información en lugar de añadir bloques redundantes de texto. - ---- - -## 🎮 Concepto General del Proyecto -**Co.Laborando** es una aplicación interactiva de simulación y ludoteca empresarial. Los jugadores administran múltiples departamentos con recursos limitados (Tiempo, Personal, Capital) para completar proyectos en un tablero a lo largo de un ciclo temporal de **24 quincenas (4 trimestres)**. - ---- - -## 🏗️ Arquitectura de Archivos Principal -* **[colaborando2.php](file:///c:/CHV/ludotecaLocal/Colaborando/colaborando2.php) / [colaborando.php](file:///c:/CHV/ludotecaLocal/Colaborando/colaborando.php):** Vistas del tablero principal del juego, donde se colocan y arrastran los proyectos y recursos. -* **[resumen.php](file:///c:/CHV/ludotecaLocal/Colaborando/resumen.php):** Pantalla del panel de control central (dashboard) que muestra métricas acumuladas, estado de departamentos, listado de activos y control de habilidades. -* **[jsCode.js](file:///c:/CHV/ludotecaLocal/Colaborando/jsCode.js):** Lógica del lado del cliente que maneja las interacciones del tablero, transiciones de turnos y renders dinámicos. -* **[manejoDeSesiones.js](file:///c:/CHV/ludotecaLocal/Colaborando/manejoDeSesiones.js) / [manejoDeSesiones.php](file:///c:/CHV/ludotecaLocal/Colaborando/manejoDeSesiones.php):** Sistema de persistencia que guarda y carga el estado del juego (en archivos `.json` en la raíz del proyecto). -* **[sesiones.php](file:///c:/CHV/ludotecaLocal/Colaborando/sesiones.php):** Panel de administración para crear, inicializar o eliminar las sesiones guardadas. - ---- - -## ⚙️ Mecánicas de Juego Clave - -### 1. Departamentos y Recursos -Existen 6 departamentos: *Marketing y Ventas, Finanzas, Investigación y Desarrollo, Logística y Sistemas, Operaciones*, y *Recursos Humanos*. Cada uno posee recursos de **Tiempo, Personal** y **Capital**, representados dinámicamente en el tablero y resumen. - -### 2. Ciclo de Vida de Proyectos -* **En proceso:** Proyectos activos en los que se está trabajando. -* **Completado:** Proyectos finalizados con éxito. Sus requerimientos y recursos recuperados se contabilizan. - -### 3. Mantenimiento Trimestral y Penalizaciones -En los cierres de trimestre (quincenas 6, 12, 18 y 24), los proyectos activos en proceso requieren el pago de un coste de mantenimiento (`Tiempo`, `Personal`, `Capital`) o el pago de una **Penalización** financiera del acumulado de ingresos. -* En cualquiera de los dos casos, el proyecto se mantiene activo (`En proceso`) y visible en el tablero y en el resumen. -* En la pantalla de resumen, el proyecto se muestra en gris (deshabilitado) y sus botones de acción se bloquean una vez resuelto en el trimestre actual. - -### 4. Habilidades Especiales (Acción Quincenal) -Los departamentos pueden comprar habilidades especiales con cooldown (periodicidad). Ejemplos clave: -* **Logística y Sistemas:** Permite omitir el costo de mantenimiento de un proyecto activo (pagarlo sin gastar recursos). -* **Operaciones:** Permite penalizar un proyecto en proceso sin costo de penalización. -* **Ordenar proyectos:** Permite reordenar la cola de los próximos 5 proyectos en el tablero. - -### 5. Contabilización de Activos -Los activos producidos por proyectos completados se dividen en 6 tipos: *Personal Calificado, Analistas, Flujo de Efectivo, Crédito e Inversión, Tecnología* y *Transporte y Maquinaria*. Se calculan dinámicamente y se clasifican en: -* **Producidos:** Total de activos creados por proyectos completados. -* **Recuperados:** Activos que fueron arrastrados con éxito de vuelta a los departamentos. -* **Perdidos:** Activos que no se recuperaron a tiempo antes de cambiar de trimestre. - ---- - -## 💾 Sistema de Sesiones -* Las sesiones de juego se guardan localmente en archivos JSON en la raíz del proyecto. -* Para evitar que estos archivos ensucien el repositorio Git, el archivo [.gitignore](file:///c:/CHV/ludotecaLocal/Colaborando/.gitignore) ignora todos los archivos `/*.json` de la raíz. -* Se utiliza una técnica de *cache-busting* con el parámetro `_t` y la cabecera `cache: 'no-store'` para evitar cargas AJAX obsoletas entre pantallas. - ---- - -## 📈 Bitácora Histórica de Cambios (Changelog) - -* **16/Jul/2026:** - * **Cambio de Desechar a Penalizar:** En la pantalla de resumen, se cambió el botón "Desechar" por "Penalizar". - * **Persistencia de Actividad:** Los proyectos penalizados ahora se mantienen activos (`En proceso`) en lugar de descartarse. - * **Actualización de Visualización y Penalización General:** Tanto al pagar mantenimiento como al penalizar, el proyecto permanece en la quincena actual; en el resumen, su tarjeta cambia a color gris y sus botones se bloquean. El botón de **Penalizar** está habilitado en **todos** los proyectos e Incidencias activas durante el fin de trimestre, deduciendo la penalización del acumulado general. - * **Descuentos de Habilidades en Mantenimiento:** Al pagar mantenimiento de forma normal, se aplican correctamente los beneficios/descuentos de recursos ganados por el departamento mediante sus habilidades compradas (`habilidadTiempo`, `habilidadPersonal`, `habilidadCapital`), reduciendo el costo cobrado en base a los beneficios definidos. - * **Corrección de Proyectos Descartados en `TablaProyectoGde`:** Se corrigió un error en `continuamos()` en [jsCode.js](file:///c:/CHV/ludotecaLocal/Colaborando/jsCode.js#L3435) que provocaba que un proyecto descartado que estuviera seleccionado en el cuadro grande (`TablaProyectoGde`) se reasignara por error al volver al tablero desde el resumen. Ahora la inicialización del tablero valida estrictamente que solo se carguen proyectos `En proceso`, removiendo el proyecto descartado inmediatamente sin necesidad de refrescar la página. - * **Persistencia de Botones de Acción 1 y 2 (`bAccion1` y `bAccion2`):** Se integró el estado de las acciones en `arregloGeneral.bAccion1` y `arregloGeneral.bAccion2`. Al hacer clic en los botones 1 y 2 o reiniciarse con el timer, se guarda el estado en el servidor y al volver del resumen a la vista del tablero se restaura automáticamente la selección activa (fondo azul y texto blanco). - * **Gráfica Mixta de Progresión (Barras + Línea) con Zoom 2.5X y Posicionamiento Ajustado:** Integración de gráfica HTML5 Canvas sin dependencias en el Bloque 3 de resumen. Representa los Objetivos del Trimestre (`arregloGeneral.objetivoT1..T4`, por defecto $100,000) mediante barras azules e Ingresos Reales mediante una línea roja con nodos. El panel flotante emergente desplegado en `mouseenter` se ajustó a escala **2.5X ampliado** (560px × 185px) y se reubicó dinámicamente sobre la tarjeta del Bloque 3, evitando recortes en el borde superior de la ventana del navegador. Se corrigió el alineamiento de texto de la leyenda (`textAlign = 'left'`) para que los textos "Objetivo Trimestre" e "Ingreso Real" no se solapen con sus respectivos iconos. - * **Redistribución de Layout en Resumen:** Se reestructuró la vista en 2 filas: Fila superior con 5 columnas horizontales para métricas/gráficos/controles y Fila inferior con Departamentos (20%), Proyectos Terminados (40%) y Proyectos Activos (40%). -* **03/Jul/2026:** - * Implementación de la ventana de mantenimiento trimestral (Q6, 12, 18, 24) en resumen y tablero. - * Integración de habilidades especiales para omitir costo de mantenimiento (Logística) y omitir penalizaciones por desecho (Operaciones). - * Bypass de caché del navegador (`cache: 'no-store'`) para la carga de datos del juego. - * Añadida regla `/*.json` en `.gitignore` para limpiar el repositorio de archivos de juego locales. - * **Nuevo botón de Pantalla Completa:** Integrado en los encabezados de la pantalla de Resumen y el Tablero mediante la API de Fullscreen de HTML5, actualizando su texto de forma reactiva a eventos del navegador. - * **Alineación de Departamentos:** Se fijó la altura (38px) de la celda de habilidad especial en el tablero y se restauró el tamaño de letra original (14px) con un line-height controlado (1.2) para evitar desfases de altura cuando el texto ocupa dos líneas sin perder legibilidad. -* **11/Jun/2026:** - * Creación del módulo de contabilización de activos (Producidos, Recuperados, Perdidos) calculado dinámicamente e integrado en la esquina inferior izquierda de resumen. - * Ajustes y correcciones en la habilidad especial de reordenamiento de proyectos. -* **10/Jun/2026:** - * Implementación de la habilidad para previsualizar y ordenar los siguientes 5 proyectos del tablero. - * Añadido botón de habilidades especiales y opción de descarte de proyectos básicos. diff --git a/doc/implementation_plan.md b/doc/implementation_plan.md deleted file mode 100644 index c71da9d..0000000 --- a/doc/implementation_plan.md +++ /dev/null @@ -1,85 +0,0 @@ -# Gestión de Mantenimiento y Penalización de Proyectos Activos (Fin de Trimestre) - -Este plan revisado describe las modificaciones necesarias en el código para permitir que los usuarios paguen el mantenimiento de proyectos activos o los desechen (pagando la penalización correspondiente) **únicamente en las quincenas de fin de trimestre (6, 12, 18 y 24)**. - -## Revisión del Usuario Requerida - -> [!IMPORTANT] -> **Lógica de Visibilidad del Proyecto:** -> - Cuando un proyecto activo paga su mantenimiento en el fin de un trimestre (por ejemplo, en la quincena 6, que es el fin del Trimestre 1), el proyecto se marca con `mantenimientoPagadoEnTrimestre = 1`. -> - Durante el resto del trimestre actual (mientras sigan en la quincena 6), el proyecto **se ocultará tanto del resumen como del tablero**. -> - En cuanto la quincena avance al siguiente trimestre (quincena 7, Trimestre 2), el proyecto **reaparecerá automáticamente en el tablero** para continuar trabajando en él. -> -> **Lógica de Desecho:** -> - Si se decide no pagar el mantenimiento, el usuario puede desechar el proyecto pagando la penalización (que se resta del acumulado general del trimestre actual). El estatus del proyecto cambiará a `'descartado'` y desaparecerá permanentemente. - -## Cambios Propuestos - -### Componente Frontend y Lógica del Juego - ---- - -#### [MODIFY] [resumen.php](file:///c:/CHV/ludotecaLocal/Colaborando/resumen.php) - -1. **Modificar `crearTarjetaProyecto`**: - - Agregar botones de acción **solo si** el proyecto está activo (`!esCompletado`), tiene costo de mantenimiento (`proyecto.mantenimiento !== 'N/A'`) y la quincena actual es un fin de trimestre (`quincena % 6 === 0`). - - Botón **Pagar Manto**: Llama a `pagarMantenimientoProyecto(proyecto.id)`. - - Botón **Desechar**: Llama a `desecharProyecto(proyecto.id)`. - -2. **Actualizar `actualizarResumenUI`**: - - Filtrar los proyectos activos para mostrar solo aquellos cuyo mantenimiento **no ha sido pagado** en el trimestre actual: - `proyecto.mantenimientoPagadoEnTrimestre !== trimestreActual` - - Ocultar los proyectos que tengan mantenimiento `'N/A'` de la lista de pagos pendientes, o mostrarlos sin botones de acción (ya que no requieren pago). - -3. **Funciones de Control**: - - `parseMantenimiento(mantenimientoStr)`: Parsea el formato `'1T 1P 1C'` en un objeto `{ t, p, c }`. - - `pagarMantenimientoProyecto(projectId)`: - - Valida la selección de departamento y que este cuente con los recursos necesarios. - - Deduce los recursos y actualiza la tarjeta del departamento. - - Guarda el trimestre actual en el proyecto: `proyecto.mantenimientoPagadoEnTrimestre = trimestreActual`. - - Guarda la sesión y refresca la UI del resumen. - - `desecharProyecto(projectId)`: - - Solicita confirmación al usuario. - - Deduce la penalización de `arregloGeneral['trimestre' + trimestreActual]`. - - Cambia el estatus del proyecto a `'descartado'`. - - Guarda la sesión y refresca la UI del resumen. - -4. **Event Listeners**: - - Registrar delegación de clics con jQuery para `.btn-pagar-mantenimiento` y `.btn-desechar-proyecto`. - ---- - -#### [MODIFY] [jsCode.js](file:///c:/CHV/ludotecaLocal/Colaborando/jsCode.js) - -1. **Definir `limpiaProyectoGrande()`**: - - Función helper para limpiar visualmente el contenedor del proyecto grande en el tablero cuando este está en espera del pago de mantenimiento. - -2. **Modificar `continuamos()`**: - - Calcular el trimestre actual de la quincena cargada: - `const trimestreActual = Math.floor((parseInt(arregloGeneral.quincena) - 1) / 6) + 1;` - - Modificar el filtro de proyectos para el tablero (tablero chico): - Un proyecto se muestra solo si está en proceso y no se ha pagado su mantenimiento en el trimestre actual (o no requiere mantenimiento): - ```javascript - const proyectosEnTablero = proyectos.filter( - (p) => - p.estatus === 'En proceso' && - (!proyectoGde || p.id !== proyectoGde.id) && - (p.mantenimiento === 'N/A' || p.mantenimientoPagadoEnTrimestre !== trimestreActual) - ) - ``` - - Modificar la asignación de `proyectoGde`: - Si el proyecto grande actual está en proceso pero ya pagó su mantenimiento para el siguiente trimestre, no se muestra en el tablero actual. Se llama a `limpiaProyectoGrande()`. - -## Plan de Verificación - -### Verificación Manual -1. Iniciar o cargar una sesión en la quincena 6 (fin del Trimestre 1). -2. Ir a **Resumen** y verificar que los proyectos activos que requieren mantenimiento muestren los botones "Pagar Manto" y "Desechar". -3. Seleccionar un departamento y hacer clic en **Pagar Manto**: - - Verificar que se deduzcan los recursos del departamento. - - Verificar que el proyecto desaparezca de la lista en el resumen. - - Ir al tablero y comprobar que **no aparece** en la quincena 6. - - Avanzar a la quincena 7 (Trimestre 2) y comprobar que el proyecto **reaparece en el tablero**. -4. Volver a la quincena 6, seleccionar otro proyecto activo y hacer clic en **Desechar**: - - Confirmar y verificar que la penalización se reste del acumulado general de T1. - - Verificar que el proyecto cambie su estatus a `'descartado'` en el JSON de sesión y no vuelva a aparecer en ningún lado. diff --git a/doc/task.md b/doc/task.md deleted file mode 100644 index ea1999b..0000000 --- a/doc/task.md +++ /dev/null @@ -1,15 +0,0 @@ -- [x] Implement resource subtraction, maintenance payment, and project discarding in `resumen.php` - - [x] Add `parseMantenimiento` helper function - - [x] Add `pagarMantenimientoProyecto` function - - [x] Add `desecharProyecto` function with accumulated general check - - [x] Modify `crearTarjetaProyecto` to show action buttons on active projects at end of trimester - - [x] Filter paid projects in `actualizarResumenUI` - - [x] Bind event delegation for the buttons -- [x] Implement board rendering updates in `jsCode.js` - - [x] Define `limpiaProyectoGrande` function - - [x] Filter `proyectosEnTablero` in `continuamos` based on `mantenimientoPagadoEnTrimestre` - - [x] Adjust project grande loading in `continuamos` to respect maintenance payment -- [x] Verify functionality - - [x] Test paying maintenance - - [x] Test discarding project with check for sufficient accumulated funds - - [x] Test quincena transitions diff --git a/doc/walkthrough.md b/doc/walkthrough.md deleted file mode 100644 index d0245c7..0000000 --- a/doc/walkthrough.md +++ /dev/null @@ -1,46 +0,0 @@ -# Resumen de Cambios: Mantenimiento y Penalización de Proyectos Activos (Actualizado) - -Se ha implementado la funcionalidad solicitada para gestionar proyectos activos al final del trimestre (quincenas 6, 12, 18, 24). - -## Cambios Realizados - -### 1. Pantalla de Resumen ([resumen.php](file:///c:/CHV/ludotecaLocal/Colaborando/resumen.php)) -- **Botones Dinámicos en Tarjetas:** Las tarjetas de proyectos activos (`En proceso`) muestran los botones de acción en fin de trimestre (quincena % 6 === 0): el botón **Pagar Manto** aparece en proyectos que requieren mantenimiento (excluyendo Incidencias y mantenimiento `'N/A'`), mientras que el botón **Penalizar** aparece en **todos** los proyectos e Incidencias activas. -- **Persistencia de Proyectos:** El botón "Penalizar" ya no descarta el proyecto (no cambia su estatus a `descartado`). El proyecto permanece activo (`En proceso`). -- **Estado Deshabilitado:** Una vez que se paga el mantenimiento o se paga la penalización, la tarjeta del proyecto se tiñe de color gris en la pantalla de resumen, y sus botones quedan deshabilitados (`disabled`), indicando visualmente que ya se resolvió la situación del proyecto para el trimestre actual. -- **Descuentos por Habilidades:** Al realizar el pago de mantenimiento de forma normal, se aplican los descuentos de recursos (Tiempo, Personal, Capital) ganados mediante las habilidades compradas del departamento (`habilidadTiempo`, `habilidadPersonal`, `habilidadCapital`), restando del total del depto el costo neto descontado (mínimo de 0). -- **Textos e Interfaz:** Se ajustó la confirmación de penalización a: *"¿Estás seguro de que quieres pagar la penalización del proyecto..."*. Se detalla el costo original y costo neto final con descuento en el confirm del pago de mantenimiento. -- **Habilidad Especial de Operaciones:** Permite aplicar la penalización del proyecto sin costo utilizando la habilidad especial (actualizando su cooldown). -- **Redistribución de Layout (5 Columnas Superiores + Fila Inferior 20/40/40%):** Se reorganizó la vista de resumen en 2 filas. La fila superior (`top-row`) distribuye los 5 bloques de control/información horizontalmente en 5 columnas de igual proporción. La fila inferior (`main-container`) ubica Departamentos a la izquierda (20%), Proyectos Terminados al centro (40%) y Proyectos Activos a la derecha (40%). -- **Gráfica Mixta de Progresión (Barras + Líneas) con Zoom Flotante 2.5X y Persistencia:** En la parte inferior del Bloque 3 (Progresión), se integró una gráfica Canvas HTML5 que representa los Objetivos del Trimestre (almacenados en la sesión como `arregloGeneral.objetivoT1..T4`, por defecto $100,000) en **barras azules** y los Ingresos Reales por Trimestre (T1..T4) en una **línea roja con nodos y valores**. Al colocar el cursor sobre la gráfica (`mouseenter`), se despliega un panel emergente flotante alineado sobre la tarjeta del bloque con la gráfica en tamaño **2.5X ampliado** con posicionamiento dinámico anti-recorte y leyenda ajustada a la izquierda (`textAlign = 'left'`) para evitar cualquier solapamiento con los iconos. Se oculta al retirar el cursor (`mouseleave`). - -### 2. Tablero de Juego ([jsCode.js](file:///c:/CHV/ludotecaLocal/Colaborando/jsCode.js)) -- **Visibilidad Permanente:** Se eliminaron los filtros que ocultaban el proyecto del tablero chico o grande cuando el mantenimiento ya había sido resuelto. El proyecto permanece visible tanto en el tablero como en el resumen durante la quincena actual, permitiendo seguir trabajando en él. -- **Corrección de Proyectos Descartados (`continuamos()`):** Se actualizó la carga inicial del tablero para verificar estrictamente que el proyecto asignado a `TablaProyectoGde` tenga estatus `'En proceso'`. Si un proyecto fue descartado desde el resumen o mediante habilidad especial, al retornar al tablero ya no se cargará en `TablaProyectoGde` y desaparecerá de inmediato sin necesidad de refrescar la página. -- **Persistencia de Botones de Acción (`bAccion1` y `bAccion2`):** Se guardan los estados de selección (activado/desactivado) de las acciones 1 y 2 en `arregloGeneral.bAccion1` y `arregloGeneral.bAccion2` al pulsar `toggleColor()` y al finalizar el timer. Al navegar entre el tablero y el resumen y regresar, las acciones permanecen seleccionadas tal como las dejó el usuario. - -## Cómo Realizar las Pruebas (Verificación) - -1. **Escenario de Pago de Mantenimiento / Penalización:** - - Asegúrate de estar en una quincena fin de trimestre (ej. **Q6** del Trimestre 1). - - Ve a la pantalla de resumen. Verás los botones **Pagar Manto** y **Penalizar** en los proyectos en proceso. - - Realiza cualquiera de las dos acciones: - - **Pagar Manto:** Selecciona un departamento con recursos suficientes y pulsa el botón. - - **Penalizar:** Pulsa el botón; confirmará que tengas acumulado financiero suficiente y aplicará la deducción. - - En ambos casos: - - La tarjeta del proyecto en el resumen cambiará inmediatamente a un fondo gris y los botones de acción se deshabilitarán de forma definitiva en la quincena actual. - - Ve al Tablero (`colaborando2.php`) en la misma quincena (Q6) y verifica que el proyecto **sigue estando visible** en el tablero chico y en el slot de proyecto grande. - - Avanza la quincena a **Q7** (Trimestre 2). Vuelve a la pantalla de resumen y verifica que el proyecto recupera su color blanco y los botones ya no aparecen (pues no es fin de trimestre), y que en el tablero continúa disponible con total normalidad. - -2. **Escenario de Descarte de Proyecto Seleccionado:** - - Selecciona un proyecto en `TablaProyectoGde` en el tablero. - - Ve al resumen (o usa la Habilidad Especial de Operaciones para "Descartar un proyecto"). - - Descarta el proyecto que estaba seleccionado en `TablaProyectoGde`. - - Pulsa "Ir al Tablero". - - Verifica que el proyecto descartado **ya no aparece** en `TablaProyectoGde` ni en el tablero chico sin necesidad de refrescar la página. - -3. **Escenario de Persistencia de Acciones 1 y 2:** - - En el tablero, activa los botones de acción `1` (`bAccion1`) o `2` (`bAccion2`). - - Navega al Resumen haciendo clic en "Ir al Resumen". - - Regresa al Tablero haciendo clic en "Ir al Tablero". - - Verifica que las acciones seleccionadas se mantienen activas (color azul y texto blanco). diff --git a/estilos3.css b/estilos3.css new file mode 100644 index 0000000..6eddcdf --- /dev/null +++ b/estilos3.css @@ -0,0 +1,1469 @@ +:root { + --bg: #F2F3F6; + --panel: #FFFFFF; + --panel-2: #EFF1F5; + --border: #DEE1E8; + --border-soft: #E8EAEF; + --text: #171B24; + --text-dim: #545C70; + --text-faint: #8890A3; + --gold: #B9860E; + --sky: #0E86A8; + --violet: #8A38C4; + --timer-accent: #5FD8EE; + --red: #C6432B; + --green-ok: #2F9E5B; + --a-personal: #C79A16; + --a-analistas: #C97324; + --a-flujo: #2F9E5B; + --a-credito: #2F6FE0; + --a-tecnologia: #C6432B; + --a-transporte: #1F3B73; + --radius: 10px; + --font-display: 'Space Grotesk', sans-serif; + --font-mono: 'JetBrains Mono', monospace; + --font-body: 'Ubuntu', sans-serif; +} + +* { + box-sizing: border-box; + margin: 0; + padding: 0; +} + +body { + background: radial-gradient(1200px 700px at 15% -10%, #FFFFFF 0%, var(--bg) 55%); + color: var(--text); + font-family: var(--font-body); + padding: 16px; + min-width: 1100px; +} + +.canvas { + width: 100%; + max-width: 1680px; + margin: 0 auto; +} + +.layout { + display: grid; + grid-template-columns: 260px 1fr 350px; + gap: 14px; + align-items: start; +} + +/* ============ COLUMNA IZQUIERDA (RAIL DE CONTROL) ============ */ +.rail { + display: flex; + flex-direction: column; + gap: 11px; + background: var(--panel); + border: 1px solid var(--border); + border-radius: var(--radius); + padding: 12px; + box-shadow: 0 1px 4px rgba(23,27,36,.06); +} + +.rail-block { + display: flex; + flex-direction: column; + gap: 6px; +} + +.rail-block + .rail-block { + border-top: 1px solid var(--border-soft); + padding-top: 10px; +} + +.rail-logo { + text-align: center; +} + +.rail-logo img { + height: 26px; + max-height: 28px; + width: auto; + object-fit: contain; +} + +.rail-session { + font-family: var(--font-mono); + font-size: 10px; + font-weight: 600; + color: var(--text-dim); + text-transform: uppercase; + letter-spacing: .08em; + text-align: center; +} + +.rail-lbl { + font-family: var(--font-mono); + font-size: 10px; + letter-spacing: .08em; + color: var(--text-faint); + text-transform: uppercase; + font-weight: 700; +} + +.rail-btns { + display: flex; + flex-direction: column; + gap: 5px; +} + +.btn { + font-family: var(--font-display); + font-weight: 600; + font-size: 11px; + padding: 6px 10px; + border-radius: 6px; + border: 1px solid var(--border); + background: var(--panel-2); + color: var(--text); + white-space: nowrap; + text-align: center; + display: block; + width: 100%; + box-sizing: border-box; + text-decoration: none; + cursor: pointer; +} + +.btn:hover { + background: var(--border-soft); + color: var(--text); +} + +.btn-primary { + background: var(--gold); + color: #FFFDF6; + border-color: var(--gold); +} + +.btn-primary:hover { + background: #a2750a; + border-color: #a2750a; + color: #FFFDF6; +} + +.tq-row { + display: flex; + align-items: center; + justify-content: space-between; + gap: 6px; +} + +.trimestre-tabs { + display: flex; + gap: 3px; + margin-top: 2px; +} + +.trimestre-tab { + width: 22px; + height: 22px; + border-radius: 5px; + display: flex; + align-items: center; + justify-content: center; + font-family: var(--font-mono); + font-size: 11px; + font-weight: 700; + border: 1px solid var(--border); + color: var(--text-dim); + background: var(--panel-2); + cursor: default; +} + +.trimestre-tab[style*="068bc3"], +.trimestre-tab[style*="6, 139, 195"] { + background-color: var(--gold) !important; + border-color: var(--gold) !important; + color: #FFFDF6 !important; +} + +.quincena-stepper { + display: flex; + align-items: center; + gap: 4px; + margin-top: 2px; +} + +.step-btn { + width: 22px; + height: 22px; + border-radius: 5px; + border: 1px solid var(--border); + background: var(--panel-2); + color: var(--text); + font-family: var(--font-mono); + font-size: 12px; + font-weight: 700; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; +} + +.step-btn:hover { + background: var(--border); +} + +.quincena-value { + font-family: var(--font-mono); + font-size: 14px; + font-weight: 700; + width: 22px; + text-align: center; + border: none; + background: transparent; + color: var(--text); + outline: none; +} + +.timer-face { + font-family: var(--font-mono); + font-size: 20px; + font-weight: 700; + letter-spacing: .03em; + background: #ffffffff; + border: 1px solid var(--border); + border-radius: 6px; + /*padding: 6px 0;*/ + /*color: var(--gold);*/ + text-align: center; +} + +.timer-sub { + font-family: var(--font-mono); + font-size: 9.5px; + color: var(--text-faint); + text-align: center; + margin-top: 3px; +} + +#timeRange { + -webkit-appearance: none; + appearance: none; + accent-color: var(--gold); + height: 4px; + border-radius: 2px; + background: var(--border); + outline: none; + margin-top: 6px; +} + +#timeRange::-webkit-slider-thumb { + -webkit-appearance: none; + appearance: none; + width: 14px; + height: 14px; + border-radius: 50%; + background: var(--gold); + cursor: pointer; + border: none; +} + +#timeRange::-moz-range-thumb { + width: 14px; + height: 14px; + border-radius: 50%; + background: var(--gold); + cursor: pointer; + border: none; +} + +.resgen-block { + background: var(--panel-2); + border: 1px solid var(--border-soft); + border-radius: 8px; + padding: 8px; + text-align: center; +} + +.resgen-buttons { + display: flex; + justify-content: center; + gap: 6px; + margin-bottom: 8px; +} + +#RGR, #asignarRecursos { + background: var(--gold) !important; + color: #FFFDF6 !important; + border: 1px solid var(--gold) !important; + font-family: var(--font-display) !important; + font-weight: 600 !important; + font-size: 11px !important; + padding: 5px 10px !important; + border-radius: 6px !important; + cursor: pointer !important; + transition: all 0.15s ease !important; + box-shadow: 0 1px 2px rgba(0,0,0,0.05) !important; + text-shadow: none !important; +} + +#RGR:hover, #asignarRecursos:hover:not(.ui-state-disabled) { + background: #a2750a !important; + border-color: #a2750a !important; + color: #FFFDF6 !important; +} + +#asignarRecursos.ui-state-disabled, #asignarRecursos:disabled { + background: var(--border) !important; + border-color: var(--border) !important; + color: var(--text-faint) !important; + opacity: 0.55 !important; + cursor: not-allowed !important; +} + +/* Sobrescritura del estado activo de jQuery UI (.ui-state-active) a Dorado var(--gold) */ +.ui-state-active, +.ui-widget-content .ui-state-active, +.ui-widget-header .ui-state-active, +a.ui-button:active, +.ui-button:active, +.ui-button.ui-state-active:hover, +label[for="habilidadesAcreditadas"].ui-state-active, +label[for="habilidadesAcreditadas"]:active, +label[for="habilidadesAcreditadas"]:focus { + border: 1px solid var(--gold) !important; + background: var(--gold) !important; + background-color: var(--gold) !important; + color: #FFFDF6 !important; +} + +/* Checkbox y label de Capacitaciones */ +#habilidadesAcreditadas { + accent-color: var(--gold); + cursor: pointer; + width: 14px; + height: 14px; +} + +#habilidadesAcreditadas:checked + label, +label[for="habilidadesAcreditadas"].ui-checkboxradio-checked, +label[for="habilidadesAcreditadas"].ui-state-active { + color: #FFFDF6 !important; + font-weight: 700 !important; + background: var(--gold) !important; + background-color: var(--gold) !important; + border: 1px solid var(--gold) !important; + border-radius: 4px; + padding: 2px 6px; +} + +/* Botones de Acciones Quincenales (#bAccion1, #bAccion2) */ +#bAccion1, #bAccion2 { + font-family: var(--font-mono) !important; + font-weight: 700 !important; + font-size: 11px !important; + padding: 3px 8px !important; + border-radius: 5px !important; + border: 1px solid var(--border) !important; + background: var(--panel-2) !important; + color: var(--text) !important; + cursor: pointer !important; + transition: all 0.15s ease !important; + min-width: 28px !important; + height: 28px !important; + text-align: center !important; + box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important; + line-height: 1 !important; +} + +#bAccion1:hover, #bAccion2:hover { + border-color: var(--gold) !important; + background: var(--panel) !important; +} + +/* Sobrescritura del color azul inyectado por JS a dorado */ +#bAccion1[style*="068bc3"], #bAccion1[style*="6, 139, 195"], +#bAccion2[style*="068bc3"], #bAccion2[style*="6, 139, 195"] { + background-color: var(--gold) !important; + border-color: var(--gold) !important; + color: #FFFDF6 !important; + box-shadow: 0 2px 5px rgba(185,134,14,0.3) !important; +} + +#recRand1, #recRand2, #recRand3, #recRand4 { + display: none; +} + +#recRand1:has(img), +#recRand2:has(img), +#recRand3:has(img), +#recRand4:has(img) { + display: inline-flex; + align-items: center; + justify-content: center; + background: var(--panel); + border: 1px solid var(--border); + border-radius: 8px; + padding: 4px 6px; + box-shadow: 0 1px 3px rgba(23,27,36,.06); + transition: transform 0.15s ease, box-shadow 0.15s ease; + min-width: 38px; + min-height: 38px; +} + +#recRand1:has(img):hover, +#recRand2:has(img):hover, +#recRand3:has(img):hover, +#recRand4:has(img):hover { + transform: translateY(-1px); + box-shadow: 0 2px 5px rgba(0,0,0,.1); +} + +/* Reemplazo visual automático de imágenes de recursos por íconos SVG vectoriales modernos */ +#recRand1 img[src*="tiempo"], +#recRand2 img[src*="tiempo"], +#recRand3 img[src*="tiempo"], +#recRand4 img[src*="tiempo"] { + content: url('data:image/svg+xml;utf8,') !important; + width: 28px !important; + height: 28px !important; +} + +#recRand1 img[src*="personal"], +#recRand2 img[src*="personal"], +#recRand3 img[src*="personal"], +#recRand4 img[src*="personal"] { + content: url('data:image/svg+xml;utf8,') !important; + width: 28px !important; + height: 28px !important; +} + +#recRand1 img[src*="capital"], +#recRand2 img[src*="capital"], +#recRand3 img[src*="capital"], +#recRand4 img[src*="capital"] { + content: url('data:image/svg+xml;utf8,$') !important; + width: 28px !important; + height: 28px !important; +} + +.departamentos img[src*="tiempo"] { + content: url('data:image/svg+xml;utf8,') !important; + width: 22px !important; + height: 22px !important; + vertical-align: middle; +} + +.departamentos img[src*="personal"] { + content: url('data:image/svg+xml;utf8,') !important; + width: 22px !important; + height: 22px !important; + vertical-align: middle; +} + +.departamentos img[src*="capital"] { + content: url('data:image/svg+xml;utf8,$') !important; + width: 22px !important; + height: 22px !important; + vertical-align: middle; +} + +table.activos { + width: 100%; + border-collapse: collapse; + font-size: 11px; + background: var(--panel); + border: 1px solid var(--border); + border-radius: 6px; +} + +table.activos th { + background: #e9e9e9; + padding: 4px; + font-size: 11px; + text-align: center; +} + +table.activos td { + padding: 4px; + border-top: 1px solid var(--border-soft); + text-align: center; +} + +/* Estilos de Tabla de Activos (#tablaActivos) con borde y texto en color del activo sobre fondo suave pastel */ +#tablaActivos td.actPersonalCalificado { + background-color: #FFFDF4 !important; + color: var(--a-personal) !important; + border: 1.5px solid var(--a-personal) !important; + font-weight: 700 !important; +} + +#tablaActivos td.actAnalistas { + background-color: #FFF9F3 !important; + color: var(--a-analistas) !important; + border: 1.5px solid var(--a-analistas) !important; + font-weight: 700 !important; +} + +#tablaActivos td.actFlujoDeEfectivo { + background-color: #F3FAF5 !important; + color: var(--a-flujo) !important; + border: 1.5px solid var(--a-flujo) !important; + font-weight: 700 !important; +} + +#tablaActivos td.actCreditoEInversion { + background-color: #F3F7FE !important; + color: var(--a-credito) !important; + border: 1.5px solid var(--a-credito) !important; + font-weight: 700 !important; +} + +#tablaActivos td.actTecnologia { + background-color: #FDF4F2 !important; + color: var(--a-tecnologia) !important; + border: 1.5px solid var(--a-tecnologia) !important; + font-weight: 700 !important; +} + +#tablaActivos td.actTransporteYMaquinaria { + background-color: #F3F5FA !important; + color: var(--a-transporte) !important; + border: 1.5px solid var(--a-transporte) !important; + font-weight: 700 !important; +} + +/* Variables de Colores de Activos según la propuesta de diseño */ +:root { + --a-personal: #C79A16; + --a-analistas: #C97324; + --a-flujo: #2F9E5B; + --a-credito: #2F6FE0; + --a-tecnologia: #C6432B; + --a-transporte: #1F3B73; +} + +/* Clases de colores de activos */ +.actNinguno { background-color: #FFFFFF; color: var(--text) !important; } + +.actPersonalCalificado { + background-color: var(--a-personal) !important; + color: #FFFFFF !important; + font-weight: 600; +} +.actAnalistas { + background-color: var(--a-analistas) !important; + color: #FFFFFF !important; + font-weight: 600; +} +.actFlujoDeEfectivo { + background-color: var(--a-flujo) !important; + color: #FFFFFF !important; + font-weight: 600; +} +.actCreditoEInversion { + background-color: var(--a-credito) !important; + color: #FFFFFF !important; + font-weight: 600; +} +.actTecnologia { + background-color: var(--a-tecnologia) !important; + color: #FFFFFF !important; + font-weight: 600; +} +.actTransporteYMaquinaria { + background-color: var(--a-transporte) !important; + color: #FFFFFF !important; + font-weight: 600; +} + +/* Estilo pill/chip para los activos en tarjetas de departamento chicos */ +.activo-item { + display: inline-flex; + align-items: center; + justify-content: center; + border-radius: 14px !important; + padding: 0 10px !important; + height: 28px !important; + font-size: 9px !important; + font-weight: 700 !important; + cursor: pointer; + line-height: 1.2; + white-space: nowrap; + box-sizing: border-box; +} + +.activo-item.actPersonalCalificado { + border: 1.5px solid var(--a-personal) !important; + background: #FFFDF4 !important; + color: var(--a-personal) !important; +} +.activo-item.actPersonalCalificado::before { + content: "Pers. ×"; + margin-right: 1px; +} + +.activo-item.actAnalistas { + border: 1.5px solid var(--a-analistas) !important; + background: #FFF9F3 !important; + color: var(--a-analistas) !important; +} +.activo-item.actAnalistas::before { + content: "Anali. ×"; + margin-right: 1px; +} + +.activo-item.actFlujoDeEfectivo { + border: 1.5px solid var(--a-flujo) !important; + background: #F3FAF5 !important; + color: var(--a-flujo) !important; +} +.activo-item.actFlujoDeEfectivo::before { + content: "Flujo ×"; + margin-right: 1px; +} + +.activo-item.actCreditoEInversion { + border: 1.5px solid var(--a-credito) !important; + background: #F3F7FE !important; + color: var(--a-credito) !important; +} +.activo-item.actCreditoEInversion::before { + content: "Créd. ×"; + margin-right: 1px; +} + +.activo-item.actTecnologia { + border: 1.5px solid var(--a-tecnologia) !important; + background: #FDF4F2 !important; + color: var(--a-tecnologia) !important; +} +.activo-item.actTecnologia::before { + content: "Tecno. ×"; + margin-right: 1px; +} + +.activo-item.actTransporteYMaquinaria { + border: 1.5px solid var(--a-transporte) !important; + background: #F3F5FA !important; + color: var(--a-transporte) !important; +} +.activo-item.actTransporteYMaquinaria::before { + content: "Transp. ×"; + margin-right: 1px; +} + +.ui-draggable-dragging { + z-index: 999999 !important; +} + +.draggable, .proyectoEncabezado, #activoReqProyectoNom1, #activoReqProyectoNom2, #activoReqProyectoNom3, .departamentos, #accionGestionarProyecto, #accionComprarCapacitacion, #accionHabilidadEspecial { + cursor: pointer; +} + +/* ============ PROYECTO DESTACADO / EN TURNO (GRANDE) ============ */ +.proj-featured { + background: var(--panel-2); + border: 1.5px solid var(--gold); + border-radius: 10px; + padding: 14px 12px 10px 12px; + position: relative; + z-index: 1; + box-shadow: 0 0 18px -8px rgba(185,134,14,.4); + display: flex; + flex-direction: column; + gap: 8px; +} + +.featured-flag { + position: absolute; + top: -9px; + left: 14px; + background: var(--gold); + color: #FFFDF6; + font-family: var(--font-mono); + font-size: 8.5px; + font-weight: 700; + letter-spacing: .06em; + padding: 2px 9px; + border-radius: 4px; + text-transform: uppercase; +} + +.pf-grid { + display: grid; + grid-template-columns: 1.2fr 0.8fr; + gap: 10px; + align-items: center; + margin-top: 4px; +} + +.pf-text { + display: flex; + flex-direction: column; + gap: 4px; + min-width: 0; +} + +.pf-title-block { + font-family: var(--font-body); + font-size: 14px; + font-weight: 700; + line-height: 1.2; + color: var(--text); + display: flex; + flex-direction: column-reverse; +} + +.pf-title-block span { + font-family: var(--font-mono); + font-size: 9px; + letter-spacing: .08em; + color: var(--text-faint); + text-transform: uppercase; + font-weight: 700; + margin-bottom: 2px; +} + +.pf-desc { + font-size: 10.5px; + color: var(--text-dim); + line-height: 1.35; +} + +.pf-image-box { + width: 100%; + height: 95px; + border-radius: 8px; + overflow: hidden; + background: #ffffff; + border: 1px solid var(--border-soft); + display: flex; + align-items: center; + justify-content: center; + padding: 2px; +} + +.pf-image-box img { + max-width: 100%; + max-height: 100%; + object-fit: contain; +} + +.pf-money { + display: flex; + justify-content: space-between; + align-items: center; + font-family: var(--font-mono); + font-size: 10.5px; + margin-top: 2px; +} + +.pf-money .potencial { + color: var(--green-ok) !important; + font-weight: 700; +} + +.pf-money .penal { + color: var(--red) !important; + font-weight: 700; +} + +.pf-assets-row { + display: flex; + gap: 6px; + margin-top: 4px; +} + +.pf-asset-box { + flex: 1; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + padding: 4px 2px; + border-radius: 8px; + border: 1.5px solid var(--border); + background: var(--panel); + text-align: center; + transition: all 0.15s ease; +} + +#activoReqProyectoNom1, #activoReqProyectoNom2, #activoReqProyectoNom3 { + display: block !important; + font-size: 9px !important; + color: transparent !important; /* Oculta la cadena larga original de jsCode.js */ + background: transparent !important; + background-color: transparent !important; + border: none !important; + box-shadow: none !important; + padding: 0 !important; + margin: 0 !important; + line-height: 1.2; + width: 100%; + text-align: center; + position: relative; + height: 14px; +} + +#activoReqProyectoNom1::before, +#activoReqProyectoNom2::before, +#activoReqProyectoNom3::before { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + display: flex; + align-items: center; + justify-content: center; + font-family: var(--font-mono); + font-size: 9px; + font-weight: 700; + letter-spacing: .04em; + text-transform: uppercase; +} + +#activoReqProyectoNom1.actPersonalCalificado::before, +#activoReqProyectoNom2.actPersonalCalificado::before, +#activoReqProyectoNom3.actPersonalCalificado::before { + content: "PERS. CAL."; + color: var(--a-personal) !important; +} +#activoReqProyectoNom1.actAnalistas::before, +#activoReqProyectoNom2.actAnalistas::before, +#activoReqProyectoNom3.actAnalistas::before { + content: "ANALISTAS"; + color: var(--a-analistas) !important; +} +#activoReqProyectoNom1.actFlujoDeEfectivo::before, +#activoReqProyectoNom2.actFlujoDeEfectivo::before, +#activoReqProyectoNom3.actFlujoDeEfectivo::before { + content: "FLUJO EFVO."; + color: var(--a-flujo) !important; +} +#activoReqProyectoNom1.actCreditoEInversion::before, +#activoReqProyectoNom2.actCreditoEInversion::before, +#activoReqProyectoNom3.actCreditoEInversion::before { + content: "CRÉD. E INV."; + color: var(--a-credito) !important; +} +#activoReqProyectoNom1.actTecnologia::before, +#activoReqProyectoNom2.actTecnologia::before, +#activoReqProyectoNom3.actTecnologia::before { + content: "TECNOLOGÍA"; + color: var(--a-tecnologia) !important; +} +#activoReqProyectoNom1.actTransporteYMaquinaria::before, +#activoReqProyectoNom2.actTransporteYMaquinaria::before, +#activoReqProyectoNom3.actTransporteYMaquinaria::before { + content: "TRANSP./MAQ."; + color: var(--a-transporte) !important; +} + +.pf-asset-val { + font-family: var(--font-mono); + font-size: 14px; + font-weight: 800; + line-height: 1.1; + margin-top: 2px; + color: var(--text); +} + +/* Estilos de bordes y fondos claros de los asset boxes según el tipo de activo */ +.pf-asset-box:has(.actPersonalCalificado) { + border: 1.5px solid var(--a-personal) !important; + background: #FFFDF4 !important; +} +.pf-asset-box:has(.actAnalistas) { + border: 1.5px solid var(--a-analistas) !important; + background: #FFF9F3 !important; +} +.pf-asset-box:has(.actFlujoDeEfectivo) { + border: 1.5px solid var(--a-flujo) !important; + background: #F3FAF5 !important; +} +.pf-asset-box:has(.actCreditoEInversion) { + border: 1.5px solid var(--a-credito) !important; + background: #F3F7FE !important; +} +.pf-asset-box:has(.actTecnologia) { + border: 1.5px solid var(--a-tecnologia) !important; + background: #FDF4F2 !important; +} +.pf-asset-box:has(.actTransporteYMaquinaria) { + border: 1.5px solid var(--a-transporte) !important; + background: #F3F5FA !important; +} + +/* Fila de Activos Pagados / Asignados (#activosProyectoGde) */ +.pf-paid-row { + display: flex; + gap: 6px; + margin-top: 4px; +} + +.pf-paid-box { + flex: 1; + display: flex; + align-items: center; + justify-content: center; + padding: 3px 6px; + border-radius: 6px; + border: 1.5px solid var(--border-soft); + background: var(--panel-2); + font-family: var(--font-mono); + text-align: center; +} + +#activoReqProyectoCant1, +#activoReqProyectoCant2, +#activoReqProyectoCant3 { + font-family: var(--font-mono) !important; + font-size: 14px !important; + font-weight: 800 !important; + line-height: 1.1 !important; + background: transparent !important; + background-color: transparent !important; + border: none !important; + box-shadow: none !important; + padding: 0 !important; + margin: 0 !important; +} + +#activoReqProyectoCant1.actPersonalCalificado, +#activoReqProyectoCant2.actPersonalCalificado, +#activoReqProyectoCant3.actPersonalCalificado { + color: var(--a-personal) !important; +} +#activoReqProyectoCant1.actAnalistas, +#activoReqProyectoCant2.actAnalistas, +#activoReqProyectoCant3.actAnalistas { + color: var(--a-analistas) !important; +} +#activoReqProyectoCant1.actFlujoDeEfectivo, +#activoReqProyectoCant2.actFlujoDeEfectivo, +#activoReqProyectoCant3.actFlujoDeEfectivo { + color: var(--a-flujo) !important; +} +#activoReqProyectoCant1.actCreditoEInversion, +#activoReqProyectoCant2.actCreditoEInversion, +#activoReqProyectoCant3.actCreditoEInversion { + color: var(--a-credito) !important; +} +#activoReqProyectoCant1.actTecnologia, +#activoReqProyectoCant2.actTecnologia, +#activoReqProyectoCant3.actTecnologia { + color: var(--a-tecnologia) !important; +} +#activoReqProyectoCant1.actTransporteYMaquinaria, +#activoReqProyectoCant2.actTransporteYMaquinaria, +#activoReqProyectoCant3.actTransporteYMaquinaria { + color: var(--a-transporte) !important; +} + +.pf-foot { + display: flex; + justify-content: space-between; + align-items: center; + font-size: 9.5px; + color: var(--text-faint); + border-top: 1px solid var(--border-soft); + padding-top: 6px; + margin-top: 4px; +} + +.manto { + font-family: var(--font-mono); + font-weight: 600; + color: var(--text-dim); + background: transparent !important; +} + +.status-badge { + font-family: var(--font-mono); + font-size: 8px; + font-weight: 700; + padding: 2px 7px; + border-radius: 9px; + background: var(--panel); + border: 1px solid var(--border); + color: var(--text-dim); +} + +/* ============ PROYECTOS SECUNDARIOS / ACTIVOS (PROYECTOS CHICOS 1 AL 6) ============ */ +.proj-grid-sm { + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 10px; + margin-top: 6px; +} + +.proj-card-sm { + width: 100%; + min-width: 0; +} + +.pm-card { + background: var(--panel-2); + border: 1.5px solid var(--border); + border-radius: 8px; + padding: 10px; + display: flex; + flex-direction: column; + gap: 6px; + box-shadow: 0 1px 3px rgba(0,0,0,.04); + transition: all 0.15s ease; + position: relative; + cursor: pointer; + min-height: 125px; + box-sizing: border-box; + width: 100%; + min-width: 0; + overflow: hidden; +} + +.pm-card:hover { + border-color: #A0AABF; + box-shadow: 0 3px 8px rgba(0,0,0,.08); +} + +.pm-header { + display: flex; + flex-direction: column; + gap: 2px; + width: 100%; +} + +.pm-dept { + font-family: var(--font-mono); + font-size: 8px; + font-weight: 700; + letter-spacing: .06em; + color: var(--text-faint); + text-transform: uppercase; +} + +.pm-title { + font-family: var(--font-body); + font-size: 11.5px; + font-weight: 700; + color: var(--text); + line-height: 1.25; + width: 100%; + word-wrap: break-word; + overflow-wrap: break-word; +} + +.pm-puntos { + font-family: var(--font-mono); + font-size: 8.5px; + font-weight: 700; + color: var(--green-ok); + line-height: 1.2; + word-wrap: break-word; + overflow-wrap: break-word; + margin-top: 1px; +} + +.pm-desc { + font-size: 9.5px; + color: var(--text-dim); + line-height: 1.35; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + overflow: hidden; +} + +/* Activos Requeridos Compactos en Proyectos Chicos (Inmunes a jsCode.js class wipes) */ +.pm-assets-row { + display: flex; + flex-wrap: wrap; + gap: 4px; + align-items: center; + justify-content: center; + margin-top: 2px; +} + +.pm-card #activoReq1, +.pm-card #activoReq2, +.pm-card #activoReq3 { + display: inline-flex !important; + align-items: center !important; + justify-content: center !important; + border-radius: 12px !important; + padding: 2px 7px !important; + font-family: var(--font-mono) !important; + font-size: 9px !important; + font-weight: 700 !important; + line-height: 1.2 !important; + white-space: nowrap !important; + margin: 1px !important; +} + +.pm-card #activoReq1.actPersonalCalificado, +.pm-card #activoReq2.actPersonalCalificado, +.pm-card #activoReq3.actPersonalCalificado { + border: 1.5px solid var(--a-personal) !important; + background: #FFFDF4 !important; + color: var(--a-personal) !important; +} +.pm-card #activoReq1.actPersonalCalificado::before, +.pm-card #activoReq2.actPersonalCalificado::before, +.pm-card #activoReq3.actPersonalCalificado::before { + content: "● "; +} + +.pm-card #activoReq1.actAnalistas, +.pm-card #activoReq2.actAnalistas, +.pm-card #activoReq3.actAnalistas { + border: 1.5px solid var(--a-analistas) !important; + background: #FFF9F3 !important; + color: var(--a-analistas) !important; +} +.pm-card #activoReq1.actAnalistas::before, +.pm-card #activoReq2.actAnalistas::before, +.pm-card #activoReq3.actAnalistas::before { + content: "● "; +} + +.pm-card #activoReq1.actFlujoDeEfectivo, +.pm-card #activoReq2.actFlujoDeEfectivo, +.pm-card #activoReq3.actFlujoDeEfectivo { + border: 1.5px solid var(--a-flujo) !important; + background: #F3FAF5 !important; + color: var(--a-flujo) !important; +} +.pm-card #activoReq1.actFlujoDeEfectivo::before, +.pm-card #activoReq2.actFlujoDeEfectivo::before, +.pm-card #activoReq3.actFlujoDeEfectivo::before { + content: "● "; +} + +.pm-card #activoReq1.actCreditoEInversion, +.pm-card #activoReq2.actCreditoEInversion, +.pm-card #activoReq3.actCreditoEInversion { + border: 1.5px solid var(--a-credito) !important; + background: #F3F7FE !important; + color: var(--a-credito) !important; +} +.pm-card #activoReq1.actCreditoEInversion::before, +.pm-card #activoReq2.actCreditoEInversion::before, +.pm-card #activoReq3.actCreditoEInversion::before { + content: "● "; +} + +.pm-card #activoReq1.actTecnologia, +.pm-card #activoReq2.actTecnologia, +.pm-card #activoReq3.actTecnologia { + border: 1.5px solid var(--a-tecnologia) !important; + background: #FDF4F2 !important; + color: var(--a-tecnologia) !important; +} +.pm-card #activoReq1.actTecnologia::before, +.pm-card #activoReq2.actTecnologia::before, +.pm-card #activoReq3.actTecnologia::before { + content: "● "; +} + +.pm-card #activoReq1.actTransporteYMaquinaria, +.pm-card #activoReq2.actTransporteYMaquinaria, +.pm-card #activoReq3.actTransporteYMaquinaria { + border: 1.5px solid var(--a-transporte) !important; + background: #F3F5FA !important; + color: var(--a-transporte) !important; +} +.pm-card #activoReq1.actTransporteYMaquinaria::before, +.pm-card #activoReq2.actTransporteYMaquinaria::before, +.pm-card #activoReq3.actTransporteYMaquinaria::before { + content: "● "; +} + +.pm-card #activoReq1.actNinguno, +.pm-card #activoReq2.actNinguno, +.pm-card #activoReq3.actNinguno, +.pm-card #activoReq1:empty, +.pm-card #activoReq2:empty, +.pm-card #activoReq3:empty { + display: none !important; +} + +/* Mantenimiento en Proyectos Chicos */ +.pm-manto { + font-family: var(--font-mono); + font-size: 8.5px; + font-weight: 700; + color: var(--text-faint); + letter-spacing: .04em; + text-transform: uppercase; + margin-top: 2px; + background: transparent !important; + text-align: center; +} + +/* Activos Pagados / Asignados en Proyectos Chicos (Inmunes a jsCode.js class wipes) */ +.pm-paid-row { + display: flex; + gap: 4px; + align-items: center; + justify-content: center; + margin-top: 2px; +} + +.pm-card #activoAsignado1, +.pm-card #activoAsignado2, +.pm-card #activoAsignado3 { + font-family: var(--font-mono) !important; + font-size: 10px !important; + font-weight: 800 !important; + line-height: 1 !important; + background: transparent !important; + background-color: transparent !important; + border: 1px solid #b7b7b7 !important; + border-radius: 4px !important; + padding: 2px 7px !important; + text-align: center !important; + display: inline-block !important; + margin: 1px !important; +} + +.pm-card #activoAsignado1:empty, +.pm-card #activoAsignado2:empty, +.pm-card #activoAsignado3:empty { + display: none !important; +} + +.pm-card #activoAsignado1.actPersonalCalificado, +.pm-card #activoAsignado2.actPersonalCalificado, +.pm-card #activoAsignado3.actPersonalCalificado { + color: var(--a-personal) !important; +} +.pm-card #activoAsignado1.actAnalistas, +.pm-card #activoAsignado2.actAnalistas, +.pm-card #activoAsignado3.actAnalistas { + color: var(--a-analistas) !important; +} +.pm-card #activoAsignado1.actFlujoDeEfectivo, +.pm-card #activoAsignado2.actFlujoDeEfectivo, +.pm-card #activoAsignado3.actFlujoDeEfectivo { + color: var(--a-flujo) !important; +} +.pm-card #activoAsignado1.actCreditoEInversion, +.pm-card #activoAsignado2.actCreditoEInversion, +.pm-card #activoAsignado3.actCreditoEInversion { + color: var(--a-credito) !important; +} +.pm-card #activoAsignado1.actTecnologia, +.pm-card #activoAsignado2.actTecnologia, +.pm-card #activoAsignado3.actTecnologia { + color: var(--a-tecnologia) !important; +} +.pm-card #activoAsignado1.actTransporteYMaquinaria, +.pm-card #activoAsignado2.actTransporteYMaquinaria, +.pm-card #activoAsignado3.actTransporteYMaquinaria { + color: var(--a-transporte) !important; +} + +/* ============ COLUMNA CENTRAL (DEPARTAMENTOS) ============ */ +.col-departamentos { + display: flex; + flex-direction: column; + gap: 12px; +} + +.card-depto-gde { + background: var(--panel); + border: 2px solid var(--gold); + border-radius: var(--radius); + padding: 12px; + box-shadow: 0 2px 8px rgba(185,134,14,.15); +} + +.dept-grid { + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 10px; +} + +.dept-card-sm { + background: var(--panel); + border: 1.5px solid var(--border); + border-radius: var(--radius); + padding: 12px; + box-shadow: 0 1px 3px rgba(23,27,36,.05); + display: flex; + flex-direction: column; + gap: 10px; + transition: border-color 0.15s ease, box-shadow 0.15s ease; +} + +.dept-card-sm:hover { + border-color: #A0AABF; + box-shadow: 0 3px 8px rgba(0,0,0,.08); +} + +.dept-header-row { + display: flex; + align-items: center; + gap: 10px; +} + +.dept-avatar-box { + width: 65px; + height: 65px; + border-radius: 10px; + background: var(--panel-2); + border: 1px solid var(--border-soft); + display: flex; + align-items: center; + justify-content: center; + flex-shrink: 0; + overflow: hidden; +} + +.dept-avatar-box img { + height: 56px; + width: auto; + object-fit: contain; +} + +.dept-info-box { + display: flex; + flex-direction: column; + justify-content: center; + gap: 1px; +} + +.dept-title { + font-family: var(--font-display); + font-size: 14.5px; + font-weight: 700; + color: var(--text); + line-height: 1.2; +} + +.dept-members { + font-family: var(--font-body); + font-size: 10.5px; + color: var(--text-dim); +} + +.dept-habilidad-row { + width: 100%; + border: 1px dashed #C3C9D6; + border-radius: 8px; + background: var(--panel-2); + padding: 6px 10px; + font-size: 11px; + color: var(--text-dim); + line-height: 1.3; + box-sizing: border-box; +} + +.dept-habilidad-lbl { + font-weight: 700; + color: var(--text); +} + +.dept-resources-assets-row { + width: 100%; + display: flex; + flex-wrap: wrap; + align-items: center; + gap: 6px; +} + +.dept-res-chip { + display: inline-flex; + align-items: center; + gap: 5px; + background: var(--panel-2); + border: 1px solid var(--border-soft); + border-radius: 6px; + padding: 3px 8px; + height: 28px; + box-sizing: border-box; +} + +.val-tiempo { + color: #C79A16 !important; + font-family: var(--font-mono); + font-weight: 700; + font-size: 10px; +} + +.val-personal { + color: #0E86A8 !important; + font-family: var(--font-mono); + font-weight: 700; + font-size: 10px; +} + +.val-capital { + color: #8A38C4 !important; + font-family: var(--font-mono); + font-weight: 700; + font-size: 10px; +} + +.dept-habilidades-acreditadas-list { + width: 100%; + display: flex; + flex-direction: column; + gap: 3px; + font-size: 11px; +} + +.dept-hab-item { + color: var(--text); + font-size: 11px; + line-height: 1.3; +} + +.dept-hab-item:empty { + display: none !important; +} + +/* ============ COLUMNA DERECHA (PROYECTOS) ============ */ +.col-proyectos { + display: flex; + flex-direction: column; + gap: 12px; +} + +.card-proj-gde { + background: var(--panel); + border: 2px solid #007bff; + border-radius: var(--radius); + padding: 12px; + box-shadow: 0 2px 8px rgba(0,123,255,.15); +} + +.proj-grid-sm { + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 10px; +} + +.proj-card-sm { + background: var(--panel); + border: 1.5px solid var(--border); + border-radius: var(--radius); + padding: 8px; + box-shadow: 0 1px 3px rgba(0,0,0,.04); +} + +/* jQuery UI Alert Titlebar crimson theme */ +.ui-dialog-titlebar { + background-color: crimson; + color: white; +} +.ui-widget.ui-widget-content { + border-color: crimson; + border-width: 5px; +} +.ui-dialog .ui-dialog-content { + font-size: 16px; + font-weight: bold; + text-align: center; +} +.ui-dialog .ui-dialog-buttonpane button { + font-size: 17px; +} diff --git a/jsCode.js b/jsCode.js index 51cbdd7..87225ce 100644 --- a/jsCode.js +++ b/jsCode.js @@ -569,7 +569,7 @@ function llenaProyectoChico(proyectoNum) { proyectoActual, proyectos[proyectoNum].nombreProyecto, proyectos[proyectoNum].dificultad - ) + ) let signoPuntosGanados = '+' let signoPuntosPerdidos = '-' if (proyectos[proyectoNum].puntosGanados == 0) { diff --git a/resumen.bmp b/resumen.bmp deleted file mode 100644 index 1fdc99d..0000000 Binary files a/resumen.bmp and /dev/null differ diff --git a/resumen3.php b/resumen3.php new file mode 100644 index 0000000..65b6da2 --- /dev/null +++ b/resumen3.php @@ -0,0 +1,2151 @@ + + + + + + + Resumen de Colaborando + + + + + + + + + + + +
+ +
+ + +
+
+ +
+
+
+
+ + Ir al
Tablero +
+
+
+ + + + + +
+ +
+ + 		+
2:00
+
+ + +
+ +
2 min
+
+ +
+
+ + + + + + + +
1234
+
+
+ + + + + + +
+
+
+
+
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ACTIVOSProducciónRecuperación
Personal calificado
Analistas
Flujo de efectivo
Crédito e Inversión
Tecnología
Transporte y Maquinaria
+
+ + +
+

PROGRESIÓN

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
T1T2T3T4
Ingreso$0$0$0$0
Acumulado$0$0$0$0
+
+ + +
+
+ + +
+

PROYECTOS E INCIDENCIAS

+ + +
+ +
+ + +
+

CONTABILIZACIÓN DE ACTIVOS

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ActivoProducidosRecuperadosPerdidos
Personal calificado000
Analistas000
Flujo de efectivo000
Crédito e Inversión000
Tecnología000
Transporte y Maquinaria000
+
+ +
+ + +
+ + +
+

DEPARTAMENTOS

+ + +
+ + + + + + + + + + + + +
MARKETING Y VENTAS + 0 + 0 +
+ + + + + + + + + + + +
+ +
0
+ 		+ +
0
+ 		+ +
0
+
+
+
+ + +
+ + + + + + + + + + + + +
FINANZAS + 0 + 0 +
+ + + + + + + + + + + +
+ +
0
+ 		+ +
0
+ 		+ +
0
+
+
+
+ + +
+ + + + + + + + + + + + +
INVESTIGACIÓN Y DESARROLLO + 0 + 0 +
+ + + + + + + + + + + +
+ +
0
+ 		+ +
0
+ 		+ +
0
+
+
+
+ + +
+ + + + + + + + + + + + +
LOGÍSTICA Y SISTEMAS + 0 + 0 +
+ + + + + + + + + + + +
+ +
0
+ 		+ +
0
+ 		+ +
0
+
+
+
+ + +
+ + + + + + + + + + + + +
OPERACIONES + 0 + 0 +
+ + + + + + + + + + + +
+ +
0
+ 		+ +
0
+ 		+ +
0
+
+
+
+ + +
+ + + + + + + + + + + + +
RECURSOS HUMANOS + 0 + 0 +
+ + + + + + + + + + + +
+ +
0
+ 		+ +
0
+ 		+ +
0
+
+
+
+ + +
+ +
+
+ + +
+

PROYECTOS TERMINADOS (T)

+
+ +
+
+ + +
+

PROYECTOS ACTIVOS

+
+ +
+
+ +
+ +
+ + + + + + + + + + + + + + \ No newline at end of file