mejoras excel, ajustes pd

This commit is contained in:
luis cespedes 2025-05-08 13:16:16 -04:00
parent 287bc16819
commit 8c3c93d087
2 changed files with 119 additions and 26 deletions

View File

@ -68,7 +68,6 @@
<th class="tablaAzul text-white font-bold">C&oacute;digo de cronograma</th> <th class="tablaAzul text-white font-bold">C&oacute;digo de cronograma</th>
<th class="tablaAzul text-white font-bold">Etapa del Servicio</th> <th class="tablaAzul text-white font-bold">Etapa del Servicio</th>
<th class="tablaAzul text-white font-bold">Nombre sistema</th> <th class="tablaAzul text-white font-bold">Nombre sistema</th>
<th class="tablaAzul text-white font-bold">Nombre sistema</th>
<th class="tablaAzul text-white font-bold">Nombre localidad</th> <th class="tablaAzul text-white font-bold">Nombre localidad</th>
<th class="tablaAzul text-white font-bold">Tipo de inversi&oacute;n</th> <th class="tablaAzul text-white font-bold">Tipo de inversi&oacute;n</th>
<th class="tablaAzul text-white font-bold">C&oacute;digo de glosa PD</th> <th class="tablaAzul text-white font-bold">C&oacute;digo de glosa PD</th>
@ -93,7 +92,6 @@
<td>{{ product.codigoCronogramaAjuste }}</td> <td>{{ product.codigoCronogramaAjuste }}</td>
<td>{{ product.tipoCarga }}</td> <td>{{ product.tipoCarga }}</td>
<td>{{ product.estadoRevision }}</td> <td>{{ product.estadoRevision }}</td>
<td>{{ product.estadoRevision }}</td>
<td>{{ product.fechaIngreso }}</td> <td>{{ product.fechaIngreso }}</td>
<td>{{ product.estadoRevision }}</td> <td>{{ product.estadoRevision }}</td>
<td>{{ product.dato9 }}</td> <td>{{ product.dato9 }}</td>

View File

@ -103,21 +103,28 @@ export class AjustePdComponent {
dato14: 'green', dato14: 'green',
}, },
]; ];
/** /**
* Exporta los datos de la tabla a Excel con estilos en los encabezados * Exporta los datos de la tabla a Excel con estilos en los encabezados
* @param table Tabla PrimeNG a exportar * @param table Tabla PrimeNG a exportar
*/ */
exportExcelWithStyles(table: Table): void { exportExcelWithStyles(table: Table): void {
// Creamos un nuevo libro de trabajo // Creamos un nuevo libro de trabajo
const workbook = new Workbook(); const workbook = new Workbook();
const worksheet = workbook.addWorksheet('Datos'); const worksheet = workbook.addWorksheet('Datos');
// Obtenemos los datos y los cabeceros // Obtenemos los datos
const data = table.filteredValue || table.value; const data = table.filteredValue || table.value;
// Añadimos la fila de encabezados agrupados
this.addGroupedHeaders(worksheet);
// Añadimos la fila de encabezados detallados
const headers = this.getHeaders(); const headers = this.getHeaders();
worksheet.addRow(headers);
// Añadimos los datos a la hoja // Añadimos los datos a la hoja
this.populateWorksheet(worksheet, headers, data); this.populateWorksheet(worksheet, data);
// Aplicamos estilos a los encabezados // Aplicamos estilos a los encabezados
this.styleHeaders(worksheet); this.styleHeaders(worksheet);
@ -129,6 +136,50 @@ export class AjustePdComponent {
this.saveExcelFile(workbook); this.saveExcelFile(workbook);
} }
/**
* Añade la fila de encabezados agrupados
*/
private addGroupedHeaders(worksheet: any): void {
// Añadir fila de encabezados agrupados
const groupHeaderRow = worksheet.addRow([
'', '', '', '', '', '', '', '', '', '',
'Cronograma base vigente', '', '',
'Cronograma base ajustado', '', '', '',
'', ''
]);
// Combinar celdas para los grupos de encabezados
worksheet.mergeCells(1, 11, 1, 13); // Cronograma base vigente (columnas 11-13)
worksheet.mergeCells(1, 14, 1, 17); // Cronograma base ajustado (columnas 14-17)
// Dar formato a las celdas combinadas
groupHeaderRow.getCell(11).fill = {
type: 'pattern',
pattern: 'solid',
fgColor: { argb: '0066CC' } // Color azul oscuro para "Cronograma base vigente"
};
groupHeaderRow.getCell(14).fill = {
type: 'pattern',
pattern: 'solid',
fgColor: { argb: '0000CC' } // Color azul más fuerte para "Cronograma base ajustado"
};
// Estilo de texto para encabezados agrupados
[11, 14].forEach(cellIndex => {
const cell = groupHeaderRow.getCell(cellIndex);
cell.font = {
name: 'Arial',
size: 12,
bold: true,
color: { argb: 'FFFFFF' } // Texto blanco
};
cell.alignment = {
horizontal: 'center',
vertical: 'middle'
};
});
}
/** /**
* Devuelve los cabeceros para el archivo Excel * Devuelve los cabeceros para el archivo Excel
*/ */
@ -138,35 +189,50 @@ export class AjustePdComponent {
'Código de cronograma', 'Código de cronograma',
'Etapa del Servicio', 'Etapa del Servicio',
'Nombre sistema', 'Nombre sistema',
'Nombre localidad',
'Tipo de inversión', 'Tipo de inversión',
'Código de glosa PD', 'Código de glosa PD',
'Descripción glosa', 'Descripción glosa',
'Monto Inversión Total (UF)',
'Año de Inicio', 'Año de Inicio',
'Año de Término', 'Año de Término',
'Estado aprobación' 'Mes de Término',
'Tipo de ajuste',
'Año de Inicio',
'Año de Término',
'Mes de Término',
'Nota',
'Estado aprobación',
'Observación'
]; ];
} }
/** /**
* Rellena la hoja con los datos de la tabla * Rellena la hoja con los datos de la tabla
*/ */
private populateWorksheet(worksheet: any, headers: string[], data: any[]): void { private populateWorksheet(worksheet: any, data: any[]): void {
// Añadimos las cabeceras
worksheet.addRow(headers);
// Añadimos los datos // Añadimos los datos
data.forEach(item => { data.forEach(item => {
worksheet.addRow([ worksheet.addRow([
item.empresa, item.empresa,
item.codigoCronograma, item.codigoCronograma,
item.codigoCronogramaAjuste, item.codigoCronogramaAjuste, // Etapa del Servicio
item.tipoCarga, item.tipoCarga, // Nombre sistema
item.estadoRevision, item.estadoRevision, // Nombre localidad
item.analista, item.fechaIngreso, // Tipo de inversión
item.fechaIngreso, item.estadoRevision, // Código de glosa PD
item.dato9, item.dato9, // Descripción glosa
item.dato10, item.dato10, // Monto Inversión Total (UF)
item.dato13 item.dato13, // Año de Inicio (Cronograma base vigente)
item.dato14, // Año de Término (Cronograma base vigente)
item.dato15, // Mes de Término (Cronograma base vigente)
item.dato16, // Tipo de ajuste (Cronograma base ajustado)
item.dato17, // Año de Inicio (Cronograma base ajustado)
item.dato18, // Año de Término (Cronograma base ajustado)
item.dato11, // Mes de Término (Cronograma base ajustado)
item.dato12, // Nota
item.dato13, // Estado aprobación
item.analista // Observación
]); ]);
}); });
} }
@ -175,16 +241,17 @@ export class AjustePdComponent {
* Aplica estilos a los encabezados * Aplica estilos a los encabezados
*/ */
private styleHeaders(worksheet: any): void { private styleHeaders(worksheet: any): void {
const headerRow = worksheet.getRow(1); // Estilo para la segunda fila (encabezados detallados)
headerRow.height = 25; const detailedHeaderRow = worksheet.getRow(2);
detailedHeaderRow.height = 25;
headerRow.eachCell(cell => { detailedHeaderRow.eachCell(cell => {
// Estilo de texto Encabezado // Estilo de texto Encabezado
cell.font = { cell.font = {
name: 'Arial', name: 'Arial',
size: 12, size: 12,
bold: true, bold: true,
color: { argb: '000000' } color: { argb: 'FFFFFF' } // Texto blanco
}; };
// Bordes // Bordes
@ -200,7 +267,35 @@ export class AjustePdComponent {
horizontal: 'center', horizontal: 'center',
vertical: 'middle' vertical: 'middle'
}; };
// Color de fondo para encabezados normales
cell.fill = {
type: 'pattern',
pattern: 'solid',
fgColor: { argb: '0066CC' } // Color azul por defecto
};
}); });
// Aplicar colores específicos según el grupo de encabezados
// Cronograma base ajustado (columnas 14-17)
for (let i = 14; i <= 17; i++) {
const cell = detailedHeaderRow.getCell(i);
cell.fill = {
type: 'pattern',
pattern: 'solid',
fgColor: { argb: '0000CC' } // Azul más fuerte
};
}
// Estado aprobación y Observación (columnas 18-19)
for (let i = 18; i <= 19; i++) {
const cell = detailedHeaderRow.getCell(i);
cell.fill = {
type: 'pattern',
pattern: 'solid',
fgColor: { argb: '28a745' } // Color verde
};
}
} }
/** /**
@ -214,7 +309,7 @@ export class AjustePdComponent {
this.adjustColumnWidths(worksheet); this.adjustColumnWidths(worksheet);
// Congelamos la primera fila // Congelamos la primera fila
worksheet.views = [{ state: 'frozen', xSplit: 0, ySplit: 1 }]; worksheet.views = [{ state: 'frozen', xSplit: 0, ySplit: 2 }]; // Congelamos 2 filas
} }
/** /**