Merge branch 'oggui/ogboot' into oggui/ogdhcp

ogWebconsole/src/app/components/groups/classroom-view/classroom-view-modal.ts

@@ -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>
+  <app-classroom-view [clients]="data.clients"></app-classroom-view>
   `,
   styles: [`
     mat-dialog-content {
@@ -30,6 +28,6 @@ export class ClassroomViewDialogComponent {
     }
   }
 
-  
-  
+
+
 }

ogWebconsole/src/app/components/groups/classroom-view/classroom-view.component.css

@@ -2,7 +2,6 @@
   display: flex;
   flex-wrap: wrap;
   gap: 10px;
-  height: 90%;
   border: 3px solid black;
 }
 
@@ -13,11 +12,11 @@
 
 mat-card {
   width: 150px;
-  position: relative; 
+  position: relative;
 }
 
 .client-image-container {
-  position: relative; 
+  position: relative;
 }
 
 .client-image {
@@ -27,19 +26,19 @@ mat-card {
 
 .proyector-image {
   width: auto;
-  height: 100px; 
+  height: 100px;
 }
 
 .client-info {
-  position: absolute; 
+  position: absolute;
   top: 20px;
   left: 5px;
   width: 100%;
   height: 100%;
   display: flex;
   flex-direction: column;
-  background-color: rgba(0, 0, 0, 0); 
-  color: black; 
+  background-color: rgba(0, 0, 0, 0);
+  color: black;
   text-align: center;
   padding: 15px;
   box-sizing: border-box;
@@ -122,7 +121,7 @@ mat-chip {
   align-items: center;
   justify-content: center;
   text-align: center;
-  margin-right: 20px; 
+  margin-right: 20px;
 }
 
 .misc-clients {
@@ -134,4 +133,4 @@ mat-chip {
 
 .saveDisposition-btn{
   margin-top: 10px;
-}
+}

ogWebconsole/src/app/components/groups/classroom-view/classroom-view.component.html

@@ -1,11 +1,11 @@
-<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"/>
     </div>
     <div *ngFor="let row of group.clientRows" class="client-row">
-      <div class="client-container" *ngFor="let client of row" 
+      <div class="client-container" *ngFor="let client of row"
            cdkDrag [cdkDragFreeDragPosition]="client.dragPosition" (cdkDragMoved)="onDragMoved($event, client)" cdkDragBoundary=".classroom">
         <div class="client-box" (dblclick)="handleClientClick(client)">
           <mat-card appearance="outlined">
@@ -22,6 +22,9 @@
         </div>
       </div>
     </div>
-  </mat-card>
-</div>
-<button mat-flat-button class="saveDisposition-btn" color="primary" (click)="saveDisposition()" i18n="@@save-disposition-button">Guardar disposición</button>
+  </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>
+

ogWebconsole/src/app/components/groups/data.service.ts

@@ -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());
 

ogWebconsole/src/app/components/groups/groups.component.css

@@ -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;
 }
 
@@ -122,7 +124,7 @@ mat-spinner {
   align-self: center;
 }
 
-.container { 
+.container {
   display: flex;
   justify-content: flex-end;
 }
@@ -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;
-}

ogWebconsole/src/app/components/groups/groups.component.html

@@ -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"
@@ -163,7 +166,7 @@
               {{ savedFilter[0] }}
             </mat-option>
           </mat-select>
-        </mat-form-field>        
+        </mat-form-field>
       </div>
       <mat-divider class="divider"></mat-divider>
       <div class="main-content">
@@ -195,7 +198,7 @@
               <mat-option value="client-group" i18n="@@clientGroupOption">Grupos de clientes</mat-option>
             </mat-select>
           </mat-form-field>
-          
+
           <mat-form-field>
             <mat-label i18n="@@floorLabel" class="temp_filter">Planta</mat-label>
             <mat-select [(value)]="selectedFilter1">
@@ -219,10 +222,10 @@
               <mat-option value="Windows 10 Education 1803 64 bits">Windows 10 Education 1803 64 bits</mat-option>
               <mat-option value="Ubuntu 18.04.1 LTS 64 bits">Ubuntu 18.04.1 LTS 64 bits</mat-option>
               <mat-option value="Ubuntu 16.04.4 LTS 64 bits">Ubuntu 16.04.4 LTS 64 bits</mat-option>
-              <mat-option value="DATA">RESTO DE OPCIONES TBI</mat-option>   
+              <mat-option value="DATA">RESTO DE OPCIONES TBI</mat-option>
             </mat-select>
           </mat-form-field>
-          
+
 
           <mat-form-field>
             <mat-label i18n="@@selectStateLabel" class="temp_filter">Estado</mat-label>
@@ -238,15 +241,15 @@
               <mat-option value="windows_session" i18n="@@windowsSessionOption">windows_session</mat-option>
             </mat-select>
           </mat-form-field>
-          
+
           <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>
@@ -259,13 +262,15 @@
             <mat-grid-list cols="4" rowHeight="1:1">
               <mat-grid-tile *ngFor="let result of filteredResults">
                 <mat-card class="result-card">
-                  <mat-checkbox 
-                    [checked]="isSelected(result.name)" 
+                  <mat-checkbox
+                    [checked]="isSelected(result.name)"
                     (change)="onCheckboxChange($event, result.name, result.uuid)">
                   </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>

ogWebconsole/src/app/components/groups/groups.component.ts

@@ -288,7 +288,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 }
       });
 
@@ -299,7 +298,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;