diff --git a/ogWebconsole/src/app/components/images/create-image/create-image.component.css b/ogWebconsole/src/app/components/images/create-image/create-image.component.css index 8a9bda9..926bd5b 100644 --- a/ogWebconsole/src/app/components/images/create-image/create-image.component.css +++ b/ogWebconsole/src/app/components/images/create-image/create-image.component.css @@ -1,8 +1,25 @@ -.dialog-content { +.create-image-container { display: flex; flex-direction: column; - gap: 16px; - /* Espacio entre los elementos del formulario */ + padding: 1rem; +} + +.loading-spinner { + display: block; + margin: 0 auto; +} + +.mat-dialog-content.loading { + display: flex; + justify-content: center; + align-items: center; + height: 200px; +} + +.mat-dialog-content { + padding-left: 1.5em; + padding-right: 1.5em; + padding-top: 1em; } .image-form { diff --git a/ogWebconsole/src/app/components/images/create-image/create-image.component.html b/ogWebconsole/src/app/components/images/create-image/create-image.component.html index fcc73de..daf3d74 100644 --- a/ogWebconsole/src/app/components/images/create-image/create-image.component.html +++ b/ogWebconsole/src/app/components/images/create-image/create-image.component.html @@ -1,72 +1,72 @@ - +
+

{{ isEditMode ? 'Editar' : 'Crear' }} imagen

+
+ +
+ + + warning + Ha marcado la casilla "Imagen Global". Se transferirá la imagen al resto de repositorios en + el + caso de que no exista previamente. + + + + {{ 'imageNameLabel' | translate }} + + -

{{ imageId ? 'Editar' : 'Crear' }} imagen

+ + {{ 'repositoryLabel' | translate }} + + + {{ imageRepository.name }} + + + - - - - - warning - Ha marcado la casilla "Imagen Global". Se transferirá la imagen al resto de repositorios en el - caso de que no exista previamente. - - - - {{ 'imageNameLabel' | translate }} - - + + {{ 'descriptionLabel' | translate }} + + - - {{ 'repositoryLabel' | translate }} - - - {{ imageRepository.name }} - - - + + {{ 'commentsLabel' | translate }} + + - - {{ 'descriptionLabel' | translate }} - - + + Perfil de software + + + {{ profile.description }} + + + - - {{ 'commentsLabel' | translate }} - - + + {{ 'remotePcLabel' | translate }} + - - Perfil de software - - - {{ profile.description }} - - - + + {{ 'globalImageLabel' | translate }} + - - {{ 'remotePcLabel' | translate }} - + - - {{ 'globalImageLabel' | translate }} - +
+

Información de Partición de origen

+

Sistema de archivos: {{ partitionInfo['filesystem'] }}

+

Disco: {{ partitionInfo['numDisk'] }}

+

Particion: {{ partitionInfo['numPartition'] }}

+

Nombre del SO: {{ partitionInfo['osName'] }}

+

Código de partición: {{ partitionInfo['partitionCode'] }}

+
+ +
- - -
-

Información de Partición de origen

-

Sistema de archivos: {{ partitionInfo['filesystem'] }}

-

Disco: {{ partitionInfo['numDisk'] }}

-

Particion: {{ partitionInfo['numPartition'] }}

-

Nombre del SO: {{ partitionInfo['osName'] }}

-

Código de partición: {{ partitionInfo['partitionCode'] }}

-
- - - - - - - - + + + + +
\ No newline at end of file diff --git a/ogWebconsole/src/app/components/images/create-image/create-image.component.ts b/ogWebconsole/src/app/components/images/create-image/create-image.component.ts index df6a1e8..d4d3a04 100644 --- a/ogWebconsole/src/app/components/images/create-image/create-image.component.ts +++ b/ogWebconsole/src/app/components/images/create-image/create-image.component.ts @@ -17,6 +17,7 @@ export class CreateImageComponent implements OnInit { softwareProfiles: any[] = []; repositories: any[] = []; loading: boolean = false; + isEditMode: boolean = false; partitionInfo: { [key: string]: string } = {}; showWarning: boolean = false; @@ -42,30 +43,34 @@ export class CreateImageComponent implements OnInit { ngOnInit() { this.loading = true; if (this.data) { - this.load() + this.isEditMode = true; + this.load(); + } else { + this.loading = false; } this.fetchSoftwareProfiles(); this.fetchRepositories(); - this.loading = false; } load(): void { this.dataService.getImage(this.data).subscribe({ next: (response) => { - this.imageForm = this.fb.group({ - name: [response.name, Validators.required], - description: [response.description], - comments: [response.comments], - remotePc: [response.remotePc], - isGlobal: [response.isGlobal], - softwareProfile: [response.softwareProfile ? response.softwareProfile['@id'] : null, Validators.required], - imageRepositories: [response.imageRepositories ? response.imageRepositories.map((r: any) => r.imageRepository['@id']) : [], Validators.required], + this.imageForm.patchValue({ + name: response.name, + description: response.description, + comments: response.comments, + remotePc: response.remotePc, + isGlobal: response.isGlobal, + softwareProfile: response.softwareProfile ? response.softwareProfile['@id'] : null, + imageRepositories: response.imageRepositories ? response.imageRepositories.map((r: any) => r.imageRepository['@id']) : [], }); this.imageId = response['@id']; this.partitionInfo = response.partitionInfo; + this.loading = false; }, error: (err) => { console.error('Error fetching remote calendar:', err); + this.loading = false; } }); } @@ -135,4 +140,4 @@ export class CreateImageComponent implements OnInit { close(): void { this.dialogRef.close(); } -} +} \ No newline at end of file