opengnsys
/
oggui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'oggui/ogboot' into oggui/ogdhcp

oggui/ogdhcp
Alvaro Puente Mella 2024-09-11 11:27:17 +02:00
parent 6b79e56af7 2508b30754
commit 993c56d4e8
7 changed files with 58 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -5,9 +5,7 @@ import { MAT_DIALOG_DATA } from '@angular/material/dialog';
selector: 'app-classroom-view-dialog', selector: 'app-classroom-view-dialog',
template: ` template: `
<h2 mat-dialog-title>Plano de {{ classroomName }}</h2> <h2 mat-dialog-title>Plano de {{ classroomName }}</h2>
<mat-dialog-content> <app-classroom-view [clients]="data.clients"></app-classroom-view>
<app-classroom-view [clients]="data.clients"></app-classroom-view>
</mat-dialog-content>
`, `,
styles: [` styles: [`
mat-dialog-content { mat-dialog-content {
@ -30,6 +28,6 @@ export class ClassroomViewDialogComponent {
} }
} }
} }

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

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

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

@ -1,11 +1,11 @@
<div class="classroom"> <mat-dialog-content class="classroom">
<mat-card *ngFor="let group of groupedClients" class="classroom-group"> <div *ngFor="let group of groupedClients" class="classroom-group">
<div class="misc-clients"> <div class="misc-clients">
<div class="classroom-board" cdkDrag cdkDragBoundary=".classroom" i18n="@@digital-board">Pizarra digital</div> <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"/> <img mat-card-image src="assets/images/proyector.png" alt="Proyector" class="proyector-image" cdkDrag cdkDragBoundary=".classroom" i18n-alt="@@projector-alt"/>
</div> </div>
<div *ngFor="let row of group.clientRows" class="client-row"> <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"> cdkDrag [cdkDragFreeDragPosition]="client.dragPosition" (cdkDragMoved)="onDragMoved($event, client)" cdkDragBoundary=".classroom">
<div class="client-box" (dblclick)="handleClientClick(client)"> <div class="client-box" (dblclick)="handleClientClick(client)">
<mat-card appearance="outlined"> <mat-card appearance="outlined">
@ -22,6 +22,9 @@
</div> </div>
</div> </div>
</div> </div>
</mat-card> </div>
</div> </mat-dialog-content>
<button mat-flat-button class="saveDisposition-btn" color="primary" (click)="saveDisposition()" i18n="@@save-disposition-button">Guardar disposición</button> <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>

10
ogWebconsole/src/app/components/groups/data.service.ts
View File

@ -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(); let params = new HttpParams();
if (filter2 && filter2 !== 'none') { if (filter2 && filter2 !== 'none') {
@ -117,6 +117,14 @@ export class DataService {
params = params.set('name', filterName); 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('page', page.toString());
params = params.set('itemsPerPage', pageSize.toString()); params = params.set('itemsPerPage', pageSize.toString());

12
ogWebconsole/src/app/components/groups/groups.component.css
View File

@ -1,6 +1,8 @@
.groupLists-container { .groupLists-container {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
height: auto;
margin-bottom: 30px;
} }
.search-container { .search-container {
@ -25,7 +27,7 @@
.unidad-card, .elements-card { .unidad-card, .elements-card {
flex: 1 1 45%; flex: 1 1 45%;
background-color: #fafafa; background-color: #fafafa;
height: 400px; height: 600px;
overflow-y: auto; overflow-y: auto;
} }
@ -122,7 +124,7 @@ mat-spinner {
align-self: center; align-self: center;
} }
.container { .container {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
} }
@ -130,10 +132,6 @@ mat-spinner {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
width: 100%; width: 100%;
padding-right: 20px;
}
.roomMap-btn{
} }
.container { .container {
@ -202,5 +200,3 @@ mat-card {
margin-bottom: 20px; margin-bottom: 20px;
} }
.temp_filter{color: red;
}

43
ogWebconsole/src/app/components/groups/groups.component.html
View File

@ -7,9 +7,6 @@
<button mat-flat-button color="primary" (click)="addClient($event)" i18n="@@newClientButton">Nuevo Cliente</button> <button mat-flat-button color="primary" (click)="addClient($event)" i18n="@@newClientButton">Nuevo Cliente</button>
<button mat-raised-button (click)="openBottomSheet()" i18n="@@legendButton">Leyenda</button> <button mat-raised-button (click)="openBottomSheet()" i18n="@@legendButton">Leyenda</button>
</div> </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>
<div class="search-container"> <div class="search-container">
<mat-form-field appearance="fill"> <mat-form-field appearance="fill">
@ -18,6 +15,9 @@
<mat-icon matSuffix>search</mat-icon> <mat-icon matSuffix>search</mat-icon>
<mat-hint i18n="@@searchHint">Pulsar 'enter' para buscar entre las unidades organizativas</mat-hint> <mat-hint i18n="@@searchHint">Pulsar 'enter' para buscar entre las unidades organizativas</mat-hint>
</mat-form-field> </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>
<div class="groupLists-container"> <div class="groupLists-container">
<mat-card class="card unidad-card"> <mat-card class="card unidad-card">
@ -29,13 +29,20 @@
[ngClass]="{'selected-item': unidad === selectedUnidad, 'clickable-item': true}" (click)="onSelectUnidad(unidad)"> [ngClass]="{'selected-item': unidad === selectedUnidad, 'clickable-item': true}" (click)="onSelectUnidad(unidad)">
<div class="item-content"> <div class="item-content">
<mat-icon>apartment</mat-icon> <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"> <span class="actions">
<mat-icon mat-button [matMenuTriggerFor]="menu" (click)="$event.stopPropagation()">more_vert</mat-icon> <mat-icon mat-button [matMenuTriggerFor]="menu" (click)="$event.stopPropagation()">more_vert</mat-icon>
<mat-menu #menu="matMenu"> <mat-menu #menu="matMenu">
<button mat-menu-item (click)="onTreeClick($event, unidad)"> <button mat-menu-item (click)="onTreeClick($event, unidad)">
<mat-icon <mat-icon
class="edit-icon"
#tooltip="matTooltip" #tooltip="matTooltip"
matTooltip="Visualizar en forma de arbol" matTooltip="Visualizar en forma de arbol"
matTooltipHideDelay="0" matTooltipHideDelay="0"
@ -45,7 +52,6 @@
</button> </button>
<button mat-menu-item (click)="onEditClick($event, unidad.type, unidad.uuid)"> <button mat-menu-item (click)="onEditClick($event, unidad.type, unidad.uuid)">
<mat-icon <mat-icon
class="edit-icon"
#tooltip="matTooltip" #tooltip="matTooltip"
matTooltip="Editar unidad organizativa" matTooltip="Editar unidad organizativa"
matTooltipHideDelay="0" matTooltipHideDelay="0"
@ -55,7 +61,6 @@
</button> </button>
<button mat-menu-item (click)="onShowClick($event, unidad)"> <button mat-menu-item (click)="onShowClick($event, unidad)">
<mat-icon <mat-icon
class="edit-icon"
#tooltip="matTooltip" #tooltip="matTooltip"
matTooltip="Visualizar unidad organizativa" matTooltip="Visualizar unidad organizativa"
matTooltipHideDelay="0" matTooltipHideDelay="0"
@ -65,7 +70,6 @@
</button> </button>
<button mat-menu-item (click)="addOU($event, unidad)"> <button mat-menu-item (click)="addOU($event, unidad)">
<mat-icon <mat-icon
class="edit-icon"
#tooltip="matTooltip" #tooltip="matTooltip"
matTooltip="Crear unidad organizativa interna" matTooltip="Crear unidad organizativa interna"
matTooltipHideDelay="0" matTooltipHideDelay="0"
@ -75,7 +79,6 @@
</button> </button>
<button mat-menu-item (click)="addClient($event, unidad)"> <button mat-menu-item (click)="addClient($event, unidad)">
<mat-icon <mat-icon
class="edit-icon"
#tooltip="matTooltip" #tooltip="matTooltip"
matTooltip="Crear cliente en esta unidad organizativa" matTooltip="Crear cliente en esta unidad organizativa"
matTooltipHideDelay="0" matTooltipHideDelay="0"
@ -163,7 +166,7 @@
{{ savedFilter[0] }} {{ savedFilter[0] }}
</mat-option> </mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
</div> </div>
<mat-divider class="divider"></mat-divider> <mat-divider class="divider"></mat-divider>
<div class="main-content"> <div class="main-content">
@ -195,7 +198,7 @@
<mat-option value="client-group" i18n="@@clientGroupOption">Grupos de clientes</mat-option> <mat-option value="client-group" i18n="@@clientGroupOption">Grupos de clientes</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<mat-form-field> <mat-form-field>
<mat-label i18n="@@floorLabel" class="temp_filter">Planta</mat-label> <mat-label i18n="@@floorLabel" class="temp_filter">Planta</mat-label>
<mat-select [(value)]="selectedFilter1"> <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="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 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="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-select>
</mat-form-field> </mat-form-field>
<mat-form-field> <mat-form-field>
<mat-label i18n="@@selectStateLabel" class="temp_filter">Estado</mat-label> <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-option value="windows_session" i18n="@@windowsSessionOption">windows_session</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<mat-form-field class="example-full-width"> <mat-form-field class="example-full-width">
<mat-label class="temp_filter">IP</mat-label> <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>
<mat-form-field class="example-full-width" > <mat-form-field class="example-full-width" >
<mat-label class="temp_filter">MAC</mat-label> <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> </mat-form-field>
</ng-container> </ng-container>
@ -259,13 +262,15 @@
<mat-grid-list cols="4" rowHeight="1:1"> <mat-grid-list cols="4" rowHeight="1:1">
<mat-grid-tile *ngFor="let result of filteredResults"> <mat-grid-tile *ngFor="let result of filteredResults">
<mat-card class="result-card"> <mat-card class="result-card">
<mat-checkbox <mat-checkbox
[checked]="isSelected(result.name)" [checked]="isSelected(result.name)"
(change)="onCheckboxChange($event, result.name, result.uuid)"> (change)="onCheckboxChange($event, result.name, result.uuid)">
</mat-checkbox> </mat-checkbox>
<mat-card-title>{{ result.name }}</mat-card-title> <mat-card-title>{{ result.name }}</mat-card-title>
<mat-card-content> <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"> <p *ngIf="result.type !== 'client'" i18n="@@internalUnits">
Unidades internas: {{ result.type !== 'client' ? result.children.length : 0 }} Unidades internas: {{ result.type !== 'client' ? result.children.length : 0 }}
</p> </p>

3
ogWebconsole/src/app/components/groups/groups.component.ts
View File

@ -288,7 +288,6 @@ export class GroupsComponent implements OnInit {
if (this.selectedDetail && this.selectedDetail.type === 'classroom') { if (this.selectedDetail && this.selectedDetail.type === 'classroom') {
const dialogRef = this.dialog.open(ClassroomViewDialogComponent, { const dialogRef = this.dialog.open(ClassroomViewDialogComponent, {
width: '90vw', width: '90vw',
height: '90vh',
data: { clients: this.clientsData } data: { clients: this.clientsData }
}); });
@ -299,7 +298,7 @@ export class GroupsComponent implements OnInit {
} }
applyFilter() { 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( .subscribe(
response => { response => {
this.filteredResults = response.results; this.filteredResults = response.results;