Clasroom map new location
parent
0ad9f8d08c
commit
c35a58d7f5
|
@ -4,7 +4,7 @@ import { MAT_DIALOG_DATA } from '@angular/material/dialog';
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-classroom-view-dialog',
|
selector: 'app-classroom-view-dialog',
|
||||||
template: `
|
template: `
|
||||||
<h2 mat-dialog-title>Plano de Aula</h2>
|
<h2 mat-dialog-title>Plano de {{ classroomName }}</h2>
|
||||||
<mat-dialog-content>
|
<mat-dialog-content>
|
||||||
<app-classroom-view [clients]="data.clients"></app-classroom-view>
|
<app-classroom-view [clients]="data.clients"></app-classroom-view>
|
||||||
</mat-dialog-content>
|
</mat-dialog-content>
|
||||||
|
@ -16,7 +16,20 @@ import { MAT_DIALOG_DATA } from '@angular/material/dialog';
|
||||||
`]
|
`]
|
||||||
})
|
})
|
||||||
export class ClassroomViewDialogComponent {
|
export class ClassroomViewDialogComponent {
|
||||||
|
classroomName: string | undefined;
|
||||||
|
|
||||||
constructor(@Inject(MAT_DIALOG_DATA) public data: any) {
|
constructor(@Inject(MAT_DIALOG_DATA) public data: any) {
|
||||||
|
console.log('ClassroomViewDialogComponent');
|
||||||
|
console.log(data);
|
||||||
|
}
|
||||||
|
ngOnInit() {
|
||||||
|
if (this.data.clients && this.data.clients.length > 0) {
|
||||||
|
this.classroomName = this.data.clients[0].organizationalUnit.name;
|
||||||
|
} else {
|
||||||
|
this.classroomName = 'N/A';
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -132,6 +132,6 @@ mat-chip {
|
||||||
margin-bottom: 25px;
|
margin-bottom: 25px;
|
||||||
}
|
}
|
||||||
|
|
||||||
button{
|
.saveDisposition-btn{
|
||||||
margin-bottom: 10px;
|
margin-top: 10px;
|
||||||
}
|
}
|
|
@ -1,7 +1,6 @@
|
||||||
<button mat-flat-button color="primary" (click)="saveDisposition()">Guardar disposición</button>
|
|
||||||
<div class="classroom">
|
<div class="classroom">
|
||||||
<mat-card *ngFor="let group of groupedClients" class="classroom-group">
|
<mat-card *ngFor="let group of groupedClients" class="classroom-group">
|
||||||
<mat-card-title>{{ group.organizationalUnitName }}</mat-card-title>
|
|
||||||
<div class="misc-clients">
|
<div class="misc-clients">
|
||||||
<div class="classroom-board" cdkDrag cdkDragBoundary=".classroom">Pizarra digital</div>
|
<div class="classroom-board" cdkDrag cdkDragBoundary=".classroom">Pizarra digital</div>
|
||||||
<img mat-card-image src="assets/images/proyector.png" alt="Proyector" class="proyector-image" cdkDrag cdkDragBoundary=".classroom"/>
|
<img mat-card-image src="assets/images/proyector.png" alt="Proyector" class="proyector-image" cdkDrag cdkDragBoundary=".classroom"/>
|
||||||
|
@ -26,3 +25,4 @@
|
||||||
</div>
|
</div>
|
||||||
</mat-card>
|
</mat-card>
|
||||||
</div>
|
</div>
|
||||||
|
<button mat-flat-button class="saveDisposition-btn" color="primary" (click)="saveDisposition()">Guardar disposición</button>
|
||||||
|
|
|
@ -3,6 +3,7 @@ import { MatDialog } from '@angular/material/dialog';
|
||||||
import { ClientViewComponent } from "../client-view/client-view.component";
|
import { ClientViewComponent } from "../client-view/client-view.component";
|
||||||
import { CdkDragMove } from '@angular/cdk/drag-drop';
|
import { CdkDragMove } from '@angular/cdk/drag-drop';
|
||||||
import { HttpClient } from '@angular/common/http';
|
import { HttpClient } from '@angular/common/http';
|
||||||
|
import { ToastrService } from 'ngx-toastr';
|
||||||
|
|
||||||
interface GroupedClients {
|
interface GroupedClients {
|
||||||
organizationalUnitName: string;
|
organizationalUnitName: string;
|
||||||
|
@ -15,11 +16,12 @@ interface GroupedClients {
|
||||||
styleUrls: ['./classroom-view.component.css']
|
styleUrls: ['./classroom-view.component.css']
|
||||||
})
|
})
|
||||||
export class ClassroomViewComponent implements OnInit, OnChanges {
|
export class ClassroomViewComponent implements OnInit, OnChanges {
|
||||||
|
|
||||||
@Input() clients: any[] = [];
|
@Input() clients: any[] = [];
|
||||||
@Input() pcInTable: number = 5;
|
@Input() pcInTable: number = 5;
|
||||||
groupedClients: GroupedClients[] = [];
|
groupedClients: GroupedClients[] = [];
|
||||||
|
|
||||||
constructor(public dialog: MatDialog, private http: HttpClient) {}
|
constructor(public dialog: MatDialog, private http: HttpClient, private toastService: ToastrService) {}
|
||||||
|
|
||||||
|
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
|
@ -90,11 +92,20 @@ export class ClassroomViewComponent implements OnInit, OnChanges {
|
||||||
};
|
};
|
||||||
this.http.patch(url, payload).subscribe(response => {
|
this.http.patch(url, payload).subscribe(response => {
|
||||||
console.log('Cliente actualizado:', response);
|
console.log('Cliente actualizado:', response);
|
||||||
|
this.openSnackBar(false, 'Plano actualizado!');
|
||||||
}, error => {
|
}, error => {
|
||||||
console.error('Error al actualizar cliente:', error);
|
console.error('Error al actualizar cliente:', error);
|
||||||
|
this.openSnackBar(true, error);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
openSnackBar(isError: boolean, message: string) {
|
||||||
|
if (isError) {
|
||||||
|
this.toastService.error(' Error al actualizar cliente: ' + message, 'Error');
|
||||||
|
} else
|
||||||
|
this.toastService.success('Cliente actualizado!', 'Éxito');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -121,3 +121,13 @@ mat-spinner {
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
align-self: center;
|
align-self: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.container { /* Asegúrate de que esta clase sea la del contenedor del botón */
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
.roomMap-btn {
|
||||||
|
}
|
||||||
|
|
||||||
|
|
|
@ -3,9 +3,13 @@
|
||||||
<div class="groups-button-row">
|
<div class="groups-button-row">
|
||||||
<button mat-flat-button color="primary" (click)="addOU($event)">Nueva Unidad Organizativa</button>
|
<button mat-flat-button color="primary" (click)="addOU($event)">Nueva Unidad Organizativa</button>
|
||||||
<button mat-flat-button color="primary" (click)="addClient($event)">Nuevo Cliente</button>
|
<button mat-flat-button color="primary" (click)="addClient($event)">Nuevo Cliente</button>
|
||||||
<button mat-flat-button color="primary" (click)="roomMap()" *ngIf="selectedDetail && selectedDetail.type === 'classroom'">Plano de aula</button>
|
|
||||||
<button mat-raised-button (click)="openBottomSheet()">Leyenda</button>
|
<button mat-raised-button (click)="openBottomSheet()">Leyenda</button>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="container">
|
||||||
|
<button mat-flat-button class="roomMap-btn" color="accent" (click)="roomMap()" *ngIf="selectedDetail && selectedDetail.type === 'classroom'">Plano de aula</button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="search-container">
|
<div class="search-container">
|
||||||
<mat-form-field appearance="fill">
|
<mat-form-field appearance="fill">
|
||||||
|
|
Loading…
Reference in New Issue