README.md

@@ -1,6 +1,6 @@
 # Cronogramas PrimeNG Application
 
-Este proyecto es una aplicación Angular 19 utilizando PrimeNG para la gestión de cronogramas de concesiones.
+Este proyecto es una aplicación Angular 19 utilizando PrimeNG para la gestión de cronogramas.
 
 ## Instalación
 
@@ -25,8 +25,6 @@ Este proyecto es una aplicación Angular 19 utilizando PrimeNG para la gestión
    npm install
    ```
 
-   > **Importante**: Durante la instalación, se ejecutará automáticamente el script `setup-project.js` (definido como `postinstall` en package.json) que solicitará el nombre del nuevo proyecto para personalizar la configuración.
-
 3. **Iniciar el Servidor de Desarrollo**
 
    ```bash
@@ -35,7 +33,7 @@ Este proyecto es una aplicación Angular 19 utilizando PrimeNG para la gestión
 
    La aplicación estará disponible en `http://localhost:4200/`
 
-## Dependencias Principales
+### Dependencias Principales
 
 El proyecto utiliza las siguientes bibliotecas clave:
 
@@ -59,66 +57,16 @@ El proyecto utiliza las siguientes bibliotecas clave:
   npm install primeicons
   ```
 
-- **PDFMake 0.2.19**: Para generación de PDFs
-  ```bash
-  npm install pdfmake @types/pdfmake
-  ```
-
 - **ExcelJS 4.4.0**: Para exportación a Excel
   ```bash
   npm install exceljs
   ```
 
-- **File-Saver 2.5.0**: Para guardar archivos en el cliente
+- **File-Saver 2.0.5**: Para guardar archivos en el cliente
   ```bash
   npm install file-saver @types/file-saver
   ```
 
-- **Animate.css 4.1.1**: Para animaciones CSS
-  ```bash
-  npm install animate.css
-  ```
-
-## Configuración del Proyecto
-
-### Script de Configuración (setup-project.js)
-
-El proyecto incluye un script de configuración post-instalación (`setup-project.js`) que se ejecuta automáticamente después de `npm install`. Este script realiza las siguientes tareas:
-
-1. Solicita el nombre del nuevo proyecto
-2. Actualiza package.json con el nuevo nombre
-3. Modifica angular.json para actualizar todas las referencias al nombre del proyecto
-4. Actualiza el título en src/index.html
-
-Este script facilita la reutilización del template para crear nuevos proyectos basados en esta estructura.
-
-### Configuración de Estilos en angular.json
-
-El proyecto está configurado para utilizar varios estilos externos a través del archivo `angular.json`:
-
-```json
-"styles": [
-  "src/styles.scss",
-  {
-    "input": "node_modules/animate.css/animate.min.css",
-    "bundleName": "animate",
-    "inject": true
-  },
-  {
-    "input": "node_modules/primeflex/primeflex.css",
-    "bundleName": "primeflex",
-    "inject": true
-  },
-  {
-    "input": "node_modules/primeicons/primeicons.css",
-    "bundleName": "primeicons",
-    "inject": true
-  }
-]
-```
-
-Para añadir nuevos estilos externos, sigue el mismo patrón en el archivo angular.json.
-
 ## Estructura del Proyecto
 
 ```
@@ -126,40 +74,33 @@ Para añadir nuevos estilos externos, sigue el mismo patrón en el archivo angul
 ├── src/                      # Código fuente
 │   ├── app/                  # Componentes Angular
 │   │   ├── components/       # Componentes compartidos 
-│   │   │   ├── alert-dialog/ # Diálogo de alertas
-│   │   │   ├── footer/       # Pie de página
-│   │   │   ├── layout/       # Estructura principal
-│   │   │   ├── navbar/       # Barra de navegación
-│   │   │   ├── sidebar/      # Barra lateral
-│   │   │   └── visor-pdf/    # Visualizador de PDF
 │   │   ├── guards/           # Guardias de ruta
 │   │   ├── interceptors/     # Interceptores HTTP
 │   │   ├── models/           # Interfaces de datos
 │   │   ├── pages/            # Componentes de página
 │   │   ├── services/         # Servicios
 │   │   └── utils/            # Utilidades
-│   ├── pipes/                # Pipes personalizados
 │   ├── index.html            # HTML principal
 │   ├── main.ts               # Punto de entrada  
 │   └── styles.scss           # Estilos globales
 ├── public/                   # Recursos estáticos
 ├── angular.json              # Configuración de Angular
 ├── package.json              # Dependencias y scripts
-├── setup-project.js          # Script de configuración post-instalación
 ├── tsconfig.json             # Configuración TypeScript
-└── sonar-project.properties  # Configuración para SonarQube
+├── Dockerfile                # Configuración de Docker
+└── docker-compose.yml        # Configuración Docker Compose
 ```
 
-## Modelos de Datos (Interfaces)
+## Estructura de Interfaces
 
-El proyecto define las siguientes interfaces para los modelos de datos:
+Se han creado las siguientes interfaces para los modelos de datos:
 
 - **Cronograma**: Modelo base para todos los cronogramas
 - **Empresa**: Modelo para empresas
 - **TipoCarga**: Modelo para tipos de carga
 - **EstadoAprobacion**: Modelo para estados de aprobación
-- **ActualizacionPd**: Modelo para actualizaciones de Plan de Desarrollo
+- **ActualizacionPd**: Modelo para actualizaciones de PD
-- **AjustePd**: Modelo para ajustes de Plan de Desarrollo
+- **AjustePd**: Modelo para ajustes de PD
 - **UnidadInformacion**: Modelo para unidades de información
 
 ## Servicios
@@ -174,103 +115,14 @@ Los servicios implementados permiten conectarse a un backend mediante HTTP:
 - **TipoCargaService**: Consulta de tipos de carga
 - **EstadoAprobacionService**: Consulta de estados de aprobación
 - **AuthService**: Autenticación y gestión de tokens
-- **PdfService**: Generación y manejo de PDFs
-- **AlertService**: Gestión de alertas
-
-## Generación de PDFs con PDFMake
-
-El proyecto utiliza PDFMake para la generación dinámica de PDFs. La configuración básica se realiza así:
-
-1. **Importar pdfMake en el servicio**:
-
-```typescript
-import pdfMake from 'pdfmake/build/pdfmake';
-import pdfFonts from 'pdfmake/build/vfs_fonts';
-
-pdfMake.vfs = pdfFonts.vfs;
-```
-
-2. **Definir el documento PDF** usando la estructura de pdfMake:
-
-```typescript
-const docDefinition = {
-  content: [
-    { text: 'Título del Documento', style: 'header' },
-    // Contenido del documento
-  ],
-  styles: {
-    header: {
-      fontSize: 18,
-      bold: true
-    }
-  }
-};
-```
-
-3. **Generar o descargar el PDF**:
-
-```typescript
-// Generar como URL de datos
-const pdfDocGenerator = pdfMake.createPdf(docDefinition);
-pdfDocGenerator.getDataUrl((dataUrl) => {
-  // Usar dataUrl para mostrar el PDF en un iframe
-});
-
-// Descargar el PDF
-pdfMake.createPdf(docDefinition).download('nombre-archivo.pdf');
-```
-
-4. **Visualizar el PDF** usando el componente `visor-pdf`:
-
-```typescript
-// En el componente que necesita mostrar el PDF
-import { DialogService } from 'primeng/dynamicdialog';
-import { VisorPdfComponent } from 'path/to/visor-pdf.component';
-
-constructor(private dialogService: DialogService) {}
-
-mostrarPDF() {
-  this.dialogService.open(VisorPdfComponent, {
-    header: 'Cronograma PDF',
-    width: '80%',
-    data: {
-      product: this.item // Datos para el PDF
-    }
-  });
-}
-```
 
 ## Seguridad
 
 La aplicación incluye:
 
-- **AuthInterceptor**: Interceptor HTTP para añadir tokens de autenticación a las solicitudes
+- Interceptor HTTP para añadir tokens de autenticación
-- **AuthGuard**: Guard para proteger rutas que requieren autenticación
+- Guard para proteger rutas
-- **Login**: Componente para autenticación de usuarios
+- Login y sistema de autenticación
-
-## Animaciones de Ruta
-
-El proyecto implementa animaciones de transición entre rutas usando:
-
-- **RouteAnimationsComponent**: Define las animaciones para las transiciones de ruta
-- **Animate.css**: Proporciona clases CSS predefinidas para animaciones
-
-## Componentes Principales
-
-### Layout Component
-
-Define la estructura principal de la aplicación, incluyendo:
-- Barra de navegación (navbar)
-- Barra lateral (sidebar)
-- Contenido principal con soporte para animaciones de ruta
-- Pie de página (footer)
-
-### VisorPDF Component
-
-Componente standalone que permite:
-- Visualizar PDFs generados dinámicamente
-- Descargar el PDF visualizado
-- Enviar el PDF a través del sistema
 
 ## Comandos Disponibles
 
@@ -282,37 +134,45 @@ Componente standalone que permite:
 | `npm run watch` | Compila en modo observador |
 | `npm test` | Ejecuta pruebas unitarias |
 
-## Extendiendo el Proyecto
+## Despliegue con Docker
 
-Para extender este proyecto como base para un nuevo desarrollo:
+El proyecto incluye archivos Docker para facilitar el despliegue:
 
-1. Clona el repositorio
+1. Construir y ejecutar con Docker Compose:
-2. Ejecuta `npm install` (esto iniciará automáticamente el script setup-project.js)
-3. Proporciona el nombre del nuevo proyecto cuando se te solicite
-4. El script actualizará automáticamente la configuración con el nuevo nombre
-5. Comienza a desarrollar tu aplicación personalizada
 
-## Buenas Prácticas
+```bash
+docker-compose up --build
+```
 
-1. **Organización de Componentes**:
+Esto expone la aplicación en `http://localhost:80`.
-   - Componentes de página en la carpeta `pages/`
-   - Componentes reutilizables en `components/`
 
-2. **Modelo de Datos**:
+2. Construir manualmente con Docker:
-   - Definir interfaces para todos los modelos en `models/`
-   - Exportar todas las interfaces desde `models/index.ts`
 
-3. **Servicios**:
+```bash
-   - Mantener la responsabilidad única para cada servicio
+docker build -t cronogramas-primeng .
-   - Centralizar la lógica de negocio en los servicios
+docker run -p 80:80 cronogramas-primeng
+```
 
-4. **Gestión de Estado**:
+## Development server
-   - Utilizar servicios para compartir estado entre componentes
 
-## Recursos Adicionales
+Para iniciar un servidor de desarrollo local, ejecute:
 
-- [Documentación de Angular](https://angular.dev/)
+```bash
-- [Documentación de PrimeNG](https://primeng.org/installation)
+ng serve
-- [Documentación de PrimeFlex](https://primeflex.org/)
+```
-- [Documentación de PDFMake](http://pdfmake.org/)
+
-- [Documentación de ExcelJS](https://github.com/exceljs/exceljs)
+Una vez que el servidor esté en funcionamiento, abra su navegador y navegue a `http://localhost:4200/`. La aplicación se recargará automáticamente cuando modifique cualquiera de los archivos fuente.
+
+## Building
+
+Para compilar el proyecto ejecute:
+
+```bash
+ng build
+```
+
+Esto compilará su proyecto y almacenará los artefactos de compilación en el directorio `dist/`. Por defecto, la compilación para producción optimiza su aplicación para el rendimiento y la velocidad.
+
+## Additional Resources
+
+Para más información sobre el uso de Angular CLI, incluyendo referencias detalladas de comandos, visite la página [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli).