Improvements groups
parent
1612bbc9f5
commit
2508b30754
|
|
@ -5,9 +5,7 @@ import { MAT_DIALOG_DATA } from '@angular/material/dialog';
|
|||
selector: 'app-classroom-view-dialog',
|
||||
template: `
|
||||
<h2 mat-dialog-title>Plano de {{ classroomName }}</h2>
|
||||
<mat-dialog-content>
|
||||
<app-classroom-view [clients]="data.clients"></app-classroom-view>
|
||||
</mat-dialog-content>
|
||||
`,
|
||||
styles: [`
|
||||
mat-dialog-content {
|
||||
|
|
|
|||
|
|
@ -2,7 +2,6 @@
|
|||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
height: 90%;
|
||||
border: 3px solid black;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<div class="classroom">
|
||||
<mat-card *ngFor="let group of groupedClients" class="classroom-group">
|
||||
<mat-dialog-content class="classroom">
|
||||
<div *ngFor="let group of groupedClients" class="classroom-group">
|
||||
<div class="misc-clients">
|
||||
<div class="classroom-board" cdkDrag cdkDragBoundary=".classroom" i18n="@@digital-board">Pizarra digital</div>
|
||||
<img mat-card-image src="assets/images/proyector.png" alt="Proyector" class="proyector-image" cdkDrag cdkDragBoundary=".classroom" i18n-alt="@@projector-alt"/>
|
||||
|
|
@ -22,6 +22,9 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card>
|
||||
</div>
|
||||
</mat-dialog-content>
|
||||
<mat-dialog-actions>
|
||||
<button mat-flat-button class="saveDisposition-btn" color="primary" (click)="saveDisposition()" i18n="@@save-disposition-button">Guardar disposición</button>
|
||||
</mat-dialog-actions>
|
||||
|
||||
|
|
|
|||
|
|
@ -107,7 +107,7 @@ export class DataService {
|
|||
);
|
||||
}
|
||||
|
||||
getFilteredResults(filter1: string, filter2: string, filterName: string, page: number, pageSize: number): Observable<any> {
|
||||
getFilteredResults(filter1: string, filter2: string, filterName: string, filterIP: string, filterMAC: string, page: number, pageSize: number): Observable<any> {
|
||||
let params = new HttpParams();
|
||||
|
||||
if (filter2 && filter2 !== 'none') {
|
||||
|
|
@ -117,6 +117,14 @@ export class DataService {
|
|||
params = params.set('name', filterName);
|
||||
}
|
||||
|
||||
if (filterIP) {
|
||||
params = params.set('ip', filterIP);
|
||||
}
|
||||
|
||||
if (filterMAC) {
|
||||
params = params.set('mac', filterMAC);
|
||||
}
|
||||
|
||||
params = params.set('page', page.toString());
|
||||
params = params.set('itemsPerPage', pageSize.toString());
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
.groupLists-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
height: auto;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.search-container {
|
||||
|
|
@ -25,7 +27,7 @@
|
|||
.unidad-card, .elements-card {
|
||||
flex: 1 1 45%;
|
||||
background-color: #fafafa;
|
||||
height: 400px;
|
||||
height: 600px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
|
|
@ -130,10 +132,6 @@ mat-spinner {
|
|||
display: flex;
|
||||
justify-content: flex-end;
|
||||
width: 100%;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.roomMap-btn{
|
||||
}
|
||||
|
||||
.container {
|
||||
|
|
@ -202,5 +200,3 @@ mat-card {
|
|||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.temp_filter{color: red;
|
||||
}
|
||||
|
|
@ -7,9 +7,6 @@
|
|||
<button mat-flat-button color="primary" (click)="addClient($event)" i18n="@@newClientButton">Nuevo Cliente</button>
|
||||
<button mat-raised-button (click)="openBottomSheet()" i18n="@@legendButton">Leyenda</button>
|
||||
</div>
|
||||
<div class="classroomBtn-container">
|
||||
<button mat-flat-button class="roomMap-btn" color="accent" (click)="roomMap()" *ngIf="selectedDetail && selectedDetail.type === 'classroom'" i18n="@@classroomMapButton">Plano de aula</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="search-container">
|
||||
<mat-form-field appearance="fill">
|
||||
|
|
@ -18,6 +15,9 @@
|
|||
<mat-icon matSuffix>search</mat-icon>
|
||||
<mat-hint i18n="@@searchHint">Pulsar 'enter' para buscar entre las unidades organizativas</mat-hint>
|
||||
</mat-form-field>
|
||||
<div class="classroomBtn-container">
|
||||
<button mat-flat-button class="roomMap-btn" color="accent" (click)="roomMap()" *ngIf="selectedDetail && selectedDetail.type === 'classroom'" i18n="@@classroomMapButton">Plano de aula</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="groupLists-container">
|
||||
<mat-card class="card unidad-card">
|
||||
|
|
@ -29,13 +29,20 @@
|
|||
[ngClass]="{'selected-item': unidad === selectedUnidad, 'clickable-item': true}" (click)="onSelectUnidad(unidad)">
|
||||
<div class="item-content">
|
||||
<mat-icon>apartment</mat-icon>
|
||||
{{ unidad.name }}
|
||||
{{ breadcrumb.length === 0 ? unidad.name : null }}
|
||||
<ng-container *ngIf="unidad === selectedUnidad">
|
||||
<span class="breadcrumb">
|
||||
<ng-container *ngFor="let crumb of breadcrumb; let i = index">
|
||||
<a (click)="navigateToBreadcrumb(i)">{{ crumb }}</a>
|
||||
<span *ngIf="i < breadcrumb.length - 1"> > </span>
|
||||
</ng-container>
|
||||
</span>
|
||||
</ng-container>
|
||||
<span class="actions">
|
||||
<mat-icon mat-button [matMenuTriggerFor]="menu" (click)="$event.stopPropagation()">more_vert</mat-icon>
|
||||
<mat-menu #menu="matMenu">
|
||||
<button mat-menu-item (click)="onTreeClick($event, unidad)">
|
||||
<mat-icon
|
||||
class="edit-icon"
|
||||
#tooltip="matTooltip"
|
||||
matTooltip="Visualizar en forma de arbol"
|
||||
matTooltipHideDelay="0"
|
||||
|
|
@ -45,7 +52,6 @@
|
|||
</button>
|
||||
<button mat-menu-item (click)="onEditClick($event, unidad.type, unidad.uuid)">
|
||||
<mat-icon
|
||||
class="edit-icon"
|
||||
#tooltip="matTooltip"
|
||||
matTooltip="Editar unidad organizativa"
|
||||
matTooltipHideDelay="0"
|
||||
|
|
@ -55,7 +61,6 @@
|
|||
</button>
|
||||
<button mat-menu-item (click)="onShowClick($event, unidad)">
|
||||
<mat-icon
|
||||
class="edit-icon"
|
||||
#tooltip="matTooltip"
|
||||
matTooltip="Visualizar unidad organizativa"
|
||||
matTooltipHideDelay="0"
|
||||
|
|
@ -65,7 +70,6 @@
|
|||
</button>
|
||||
<button mat-menu-item (click)="addOU($event, unidad)">
|
||||
<mat-icon
|
||||
class="edit-icon"
|
||||
#tooltip="matTooltip"
|
||||
matTooltip="Crear unidad organizativa interna"
|
||||
matTooltipHideDelay="0"
|
||||
|
|
@ -75,7 +79,6 @@
|
|||
</button>
|
||||
<button mat-menu-item (click)="addClient($event, unidad)">
|
||||
<mat-icon
|
||||
class="edit-icon"
|
||||
#tooltip="matTooltip"
|
||||
matTooltip="Crear cliente en esta unidad organizativa"
|
||||
matTooltipHideDelay="0"
|
||||
|
|
@ -241,12 +244,12 @@
|
|||
|
||||
<mat-form-field class="example-full-width">
|
||||
<mat-label class="temp_filter">IP</mat-label>
|
||||
<input matInput placeholder="Dírección IP" i18n [(ngModel)]="filterIP">
|
||||
<input matInput placeholder="Dírección IP" (input)="applyFilter()" i18n [(ngModel)]="filterIP">
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field class="example-full-width" >
|
||||
<mat-label class="temp_filter">MAC</mat-label>
|
||||
<input matInput placeholder="Dírección IP" i18n [(ngModel)]="filterMAC">
|
||||
<input matInput placeholder="Dírección IP" (input)="applyFilter()" i18n [(ngModel)]="filterMAC">
|
||||
</mat-form-field>
|
||||
|
||||
</ng-container>
|
||||
|
|
@ -265,7 +268,9 @@
|
|||
</mat-checkbox>
|
||||
<mat-card-title>{{ result.name }}</mat-card-title>
|
||||
<mat-card-content>
|
||||
<p>{{ result.type }}</p>
|
||||
<p>{{ result.type !== 'client' ? result.type : '' }}</p>
|
||||
<p>{{ result.type === 'client' ? result.ip : '' }}</p>
|
||||
<p>{{ result.type === 'client' ? result.mac : '' }}</p>
|
||||
<p *ngIf="result.type !== 'client'" i18n="@@internalUnits">
|
||||
Unidades internas: {{ result.type !== 'client' ? result.children.length : 0 }}
|
||||
</p>
|
||||
|
|
|
|||
|
|
@ -290,7 +290,6 @@ export class GroupsComponent implements OnInit {
|
|||
if (this.selectedDetail && this.selectedDetail.type === 'classroom') {
|
||||
const dialogRef = this.dialog.open(ClassroomViewDialogComponent, {
|
||||
width: '90vw',
|
||||
height: '90vh',
|
||||
data: { clients: this.clientsData }
|
||||
});
|
||||
|
||||
|
|
@ -301,7 +300,7 @@ export class GroupsComponent implements OnInit {
|
|||
}
|
||||
|
||||
applyFilter() {
|
||||
this.dataService.getFilteredResults(this.selectedFilter1, this.selectedFilter2, this.filterName, this.page, this.itemsPerPage)
|
||||
this.dataService.getFilteredResults(this.selectedFilter1, this.selectedFilter2, this.filterName, this.filterIP, this.filterMAC, this.page, this.itemsPerPage)
|
||||
.subscribe(
|
||||
response => {
|
||||
this.filteredResults = response.results;
|
||||
|
|
|
|||
Loading…
Reference in New Issue