intelica-library-ui 0.1.88 → 0.1.90

package/fesm2022/intelica-library-ui.mjs

@@ -2802,8 +2802,8 @@ class HtmlToExcelService {
         const groupedIndices = new Set();
         if (headerGroups.length > 0) {
             for (const group of headerGroups) {
-                const startChar = this.getExcelColumnLetter(group.startColumn);
-                const endChar = this.getExcelColumnLetter(group.endColumn);
+                const startChar = this.GetExcelColumnLetter(group.startColumn);
+                const endChar = this.GetExcelColumnLetter(group.endColumn);
                 const range = `${startChar}${startRow}:${endChar}${startRow}`;
                 worksheet.mergeCells(range);
                 const cellGroup = `${startChar}${startRow}`;
@@ -2831,7 +2831,7 @@ class HtmlToExcelService {
             }
         }
         for (let i = 0; i < columns.length; i++) {
-            const colLetter = this.getExcelColumnLetter(i);
+            const colLetter = this.GetExcelColumnLetter(i);
             const topCell = `${colLetter}${startRow}`;
             const bottomCell = `${colLetter}${startRow + 1}`;
             if (groupedIndices.has(i)) {
@@ -2889,7 +2889,7 @@ class HtmlToExcelService {
                 }
             });
             columns.forEach((col, index) => {
-                const cellAddress = `${this.getExcelColumnLetter(index)}${startRow}`;
+                const cellAddress = `${this.GetExcelColumnLetter(index)}${startRow}`;
                 const cell = worksheet.getCell(cellAddress);
                 cell.font = {
                     name: "Arial",
@@ -2911,7 +2911,6 @@ class HtmlToExcelService {
             for (let colIndex = 0; colIndex < columns.length; colIndex++) {
                 rowValues.push(colIndex === 0 ? `${rowIndex + 1}` : rows[rowIndex][columns[colIndex].columnName] ?? "");
             }
-            console.log(rowValues);
             const insertedRow = worksheet.addRow(rowValues);
             insertedRow.eachCell((cell, colNumber) => {
                 const col = columns[colNumber - 1];
@@ -2967,7 +2966,7 @@ class HtmlToExcelService {
         });
         //Subtitulos: Se inserta al final para evitar altere el autoajuste de las columnas
         for (let i = 0; i < subtitles.length; i++) {
-            const range = `A${6 + i}:${this.getExcelColumnLetter(columns.length - 1)}${6 + i}`;
+            const range = `A${6 + i}:${this.GetExcelColumnLetter(columns.length - 1)}${6 + i}`;
             worksheet.mergeCells(range);
             const cell = worksheet.getCell(`A${6 + i}`);
             cell.value = subtitles[i];
@@ -3034,7 +3033,7 @@ class HtmlToExcelService {
                 return;
             if (columns[index] == undefined)
                 return;
-            let columnWidth = columns[index].width ?? Math.max(...column.values.map(v => (v ? v.toString().length : 0)).filter(v => typeof v === "number"), columns[index].displayColumnName.length) * 1.2;
+            let columnWidth = columns[index].width ?? Math.max(...column.values.map(v => (v ? v.toString().length : 0)).filter(v => typeof v === "number"), columns[index].displayColumnName.length) * 1.4;
             column.width = Math.min(Math.max(columnWidth, 5), 100);
         });
         worksheet.eachRow((row, rowIndex) => {
@@ -3060,7 +3059,7 @@ class HtmlToExcelService {
         worksheet.views = [{ showGridLines: false }];
         const allColumns = orderColumn ? [{ displayColumnName: "N°" }, ...columns] : columns;
         allColumns.forEach((col, index) => {
-            const columnLetter = this.getExcelColumnLetter(index);
+            const columnLetter = this.GetExcelColumnLetter(index);
             const headerCell = worksheet.getCell(`${columnLetter}1`);
             headerCell.value = col.displayColumnName;
             headerCell.alignment = { horizontal: "center", vertical: "middle" };
@@ -3094,7 +3093,7 @@ class HtmlToExcelService {
         const buffer = await workbook.xlsx.writeBuffer();
         saveAs(new Blob([buffer]), excelName);
     }
-    getExcelColumnLetter(columnNumber) {
+    GetExcelColumnLetter(columnNumber) {
         let letter = "";
         while (columnNumber >= 0) {
             letter = String.fromCharCode(65 + (columnNumber % 26)) + letter;
@@ -3169,15 +3168,6 @@ class EchartService {
         }
         return axisConfiguration;
     }
-    getTooltipFormatter(color, title, body) {
-        return `
-	 	<div style="font-size: 12px; color: ${color}; border-radius: 6px; min-width: 120px; text-align: center;">
-			<b style=" font-size: 13px;">${title} </b><br>
-			<hr style="border: 1px solid ${color}; margin: 4px 0;">
-			${body}
-		</div>
-	  `;
-    }
     getGridConfiguration() {
         return {
             left: "0%",
@@ -3196,8 +3186,33 @@ class EchartService {
             textStyle: { color: Color.blue, fontSize: 14 },
         };
     }
+    /**
+     *
+     * @param color - Color of the tooltip
+     * @param title - Title of the tooltip
+     * @param body - Body of the tooltip
+     * @returns - Tooltip HTML string
+     */
+    getTooltipFormatter(color, title, body) {
+        return `
+	 	<div style="font-size: 12px; color: ${color}; border-radius: 6px; min-width: 120px; text-align: center;">
+			<b style=" font-size: 13px;">${title} </b><br>
+			<hr style="border: 1px solid ${color}; margin: 4px 0;">
+			${body}
+		</div>
+	  `;
+    }
     /// Charts Configuration
     /// BAR CHARTS
+    /**
+     *
+     * @param categories - Array of categories for the x-axis
+     * @param series - Array of series data, each containing name, value, and color
+     * @param labelConfig - Optional label configuration for the bars
+     * @param tooltipConfig - Optional tooltip configuration for the bars
+     * @param showLegend - Optional flag to show the legend
+     * @returns - EChartsOption - Configuration object for the bar chart
+     */
     getBarChartOptions(categories, series, labelConfig, tooltipConfig, showLegend = false) {
         return {
             xAxis: this.getCategoryAxisConfiguration(categories),
@@ -3230,6 +3245,15 @@ class EchartService {
             legend: showLegend ? this.getLegendConfiguration() : undefined,
         };
     }
+    /**
+     *
+     * @param categories - Array of categories for the x-axis
+     * @param series - Array of series data, each containing name, value, and color
+     * @param labelConfig - Optional label configuration for the bars
+     * @param tooltipConfig - Optional tooltip configuration for the bars
+     * @param showLegend - Optional flag to show the legend
+     * @returns - EChartsOption - Configuration object for the bar chart
+     */
     getBarChartStackOptions(categories, series, labelConfig, tooltipConfig, showLegend = false) {
         let barBase = this.getBarChartOptions(categories, series, labelConfig, tooltipConfig, showLegend);
         barBase.series.forEach((serie, index) => {
@@ -3243,6 +3267,15 @@ class EchartService {
         });
         return barBase;
     }
+    /**
+     *
+     * @param categories - Array of categories for the y-axis
+     * @param series - Array of series data, each containing name, value, and color
+     * @param labelConfig - Optional label configuration for the bars
+     * @param tooltipConfig - Optional tooltip configuration for the bars
+     * @param showLegend - Optional flag to show the legend
+     * @returns - EChartsOption - Configuration object for the bar chart
+     */
     getBarChartHorizontalOptions(categories, series, labelConfig, tooltipConfig, showLegend = false) {
         let barBase = this.getBarChartOptions(categories, series, labelConfig, tooltipConfig, showLegend);
         barBase.xAxis = this.getValueAxisConfiguration();
@@ -3252,8 +3285,23 @@ class EchartService {
                 serie.label.position = "right";
             }
         });
+        if (barBase.grid) {
+            barBase.grid.left = "10%";
+            barBase.grid.right = "10%";
+            barBase.grid.bottom = "10%";
+            barBase.grid.containLabel = true;
+        }
         return barBase;
     }
+    /**
+     *
+     * @param categories - Array of categories for the y-axis
+     * @param series - Array of series data, each containing name, value, and color
+     * @param labelConfig - Optional label configuration for the bars
+     * @param tooltipConfig - Optional tooltip configuration for the bars
+     * @param showLegend - Optional flag to show the legend
+     * @returns - EChartsOption - Configuration object for the bar chart
+     */
     getBarChartHorizontalStackOptions(categories, series, labelConfig, tooltipConfig, showLegend = false) {
         let barBase = this.getBarChartHorizontalOptions(categories, series, labelConfig, tooltipConfig, showLegend);
         barBase.series.forEach((serie, index) => {
@@ -3268,13 +3316,26 @@ class EchartService {
                 serie.label = undefined;
             }
         });
+        if (barBase.grid) {
+            barBase.grid.left = "10%";
+            barBase.grid.right = "10%";
+            barBase.grid.bottom = "10%";
+            barBase.grid.containLabel = true;
+        }
         return barBase;
     }
+    /**
+     *
+     * @param categories - Array of categories for the y-axis
+     * @param series - Array of series data, each containing name, value, and color
+     * @param labelConfig - Optional label configuration for the bars
+     * @param tooltipConfig - Optional tooltip configuration for the bars
+     * @param showLegend - Optional flag to show the legend
+     * @returns - EChartsOption - Configuration object for the bar chart
+     */
     getBarChartTopOptions(categories, series, categoryWidth = 240, labelConfig, tooltipConfig, showLegend = false) {
         let barBase = this.getBarChartHorizontalOptions(categories, series, labelConfig, tooltipConfig, showLegend);
         if (barBase.yAxis) {
-            // (barBase.yAxis as YAXisComponentOption).show = true;
-            // (barBase.yAxis as YAXisComponentOption).splitLine!.show = true;
             barBase.yAxis.inverse = true;
             barBase.yAxis.axisLabel.color = Color.blue;
             barBase.yAxis.axisLabel.fontSize = 12;
@@ -3296,6 +3357,15 @@ class EchartService {
         return barBase;
     }
     /// LINE CHARTS
+    /**
+     *
+     * @param categories - Array of categories for the x-axis
+     * @param series - Array of series data, each containing name, value, and color
+     * @param labelConfig - Optional label configuration for the lines
+     * @param tooltipConfig - Optional tooltip configuration for the lines
+     * @param showLegend - Optional flag to show the legend
+     * @returns - EChartsOption - Configuration object for the line chart
+     */
     getLineChartOptions(categories, series, labelConfig, tooltipConfig, showLegend = false) {
         return {
             xAxis: this.getCategoryAxisConfiguration(categories),
@@ -3351,6 +3421,13 @@ class EchartService {
         };
     }
     /// PIE CHARTS
+    /**
+     *
+     * @param data - Array of series data, each containing name, value, and color
+     * @param labelConfig - Optional label configuration
+     * @param tooltipConfig - Optional tooltip configuration
+     * @returns - EChartsOption - Configuration object for the pie
+     */
     getDoughnutPieOptions(data, labelConfig, tooltipConfig) {
         return {
             series: [
@@ -3395,6 +3472,14 @@ class EchartService {
             },
         };
     }
+    /**
+     *
+     * @param letter - text to show in the center of the pie
+     * @param value - rate	value
+     * @param textSize - size of the letter
+     * @param color - color of the letter and pie
+     * @returns
+     */
     getRateDoughnutPieOptions(letter, value, textSize, color) {
         const power = Math.ceil(Math.log10(value));
         const placeholderValue = Math.pow(10, power);