From d2cf87510bd0160f8c94249772d32babd7e33d84 Mon Sep 17 00:00:00 2001
From: Manuel Aranda <maranda@qindel.com>
Date: Wed, 15 Apr 2026 12:14:03 +0200
Subject: [PATCH] refs #2944. New datasize column in Imange entity

---
 .../show-monolitic-images.component.html      |  8 ++++++-
 .../show-monolitic-images.component.ts        | 23 ++++++++++++++++++-
 2 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/ogWebconsole/src/app/components/repositories/show-monolitic-images/show-monolitic-images.component.html b/ogWebconsole/src/app/components/repositories/show-monolitic-images/show-monolitic-images.component.html
index c024d87..08e72e7 100644
--- a/ogWebconsole/src/app/components/repositories/show-monolitic-images/show-monolitic-images.component.html
+++ b/ogWebconsole/src/app/components/repositories/show-monolitic-images/show-monolitic-images.component.html
@@ -60,6 +60,12 @@
             {{ image.partitionInfo?.osName }}
           </div>
         </ng-container>
+        <ng-container *ngIf="column.columnDef === 'datasize'">
+          <div>{{ formatSize(image.datasize) }}</div>
+          <div style="font-size: 0.75rem; color: gray;">
+            Comprimido: {{ formatSize(image.size) }}
+          </div>
+        </ng-container>
         <ng-container *ngIf="column.columnDef === 'isGlobal'">
           <mat-chip>
             {{ image.image?.isGlobal  ? 'Sí' : 'No' }}
@@ -78,7 +84,7 @@
           </mat-chip>
         </ng-container>
         <ng-container
-          *ngIf="column.columnDef !== 'remotePc' && column.columnDef !== 'status' && column.columnDef !== 'isGlobal' && column.columnDef !== 'name'">
+          *ngIf="column.columnDef !== 'remotePc' && column.columnDef !== 'status' && column.columnDef !== 'isGlobal' && column.columnDef !== 'name' && column.columnDef !== 'datasize'">
           {{ column.cell(image) }}
         </ng-container>
       </td>
diff --git a/ogWebconsole/src/app/components/repositories/show-monolitic-images/show-monolitic-images.component.ts b/ogWebconsole/src/app/components/repositories/show-monolitic-images/show-monolitic-images.component.ts
index 8a6e185..a37a071 100644
--- a/ogWebconsole/src/app/components/repositories/show-monolitic-images/show-monolitic-images.component.ts
+++ b/ogWebconsole/src/app/components/repositories/show-monolitic-images/show-monolitic-images.component.ts
@@ -61,6 +61,11 @@ export class ShowMonoliticImagesComponent implements OnInit {
       header: 'Estado',
       cell: (image: any) => image.status
     },
+    {
+      columnDef: 'datasize',
+      header: 'Tamaño',
+      cell: (image: any) => this.formatSize(image.datasize)
+    },
     {
       columnDef: 'description',
       header: 'Descripción',
@@ -144,17 +149,19 @@ export class ShowMonoliticImagesComponent implements OnInit {
 
   showImageInfo(event: MouseEvent, image:any) {
     event.stopPropagation();
+    this.loading = true;
     this.loadImageAlert(image).subscribe(
       response => {
         this.alertMessage = response;
+        this.loading = false;
 
+        this.loadData();
         this.dialog.open(ServerInfoDialogComponent, {
           width: '800px',
           data: {
             message: this.alertMessage
           }
         });
-        this.loading = false;
       },
       error => {
         this.toastService.error(error.error['hydra:description']);
@@ -427,5 +434,19 @@ export class ShowMonoliticImagesComponent implements OnInit {
     this.dialogRef.close();
   }
 
+  formatSize(bytes: string | number | null | undefined): string {
+    if (bytes === null || bytes === undefined || bytes === '') return '-';
+    const n = Number(bytes);
+    if (isNaN(n) || n === 0) return '-';
+    const units = ['B', 'KB', 'MB', 'GB', 'TB'];
+    let i = 0;
+    let value = n;
+    while (value >= 1024 && i < units.length - 1) {
+      value /= 1024;
+      i++;
+    }
+    return `${value.toFixed(2)} ${units[i]}`;
+  }
+
   protected readonly isDevMode = isDevMode;
 }