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

Solve conflics
testing/ogGui-multibranch/pipeline/head There was a failure building this commit Details

oggui/translations
Manuel Aranda Rosales 2024-10-25 10:50:58 +02:00
parent 60a96170e1 2f3e119b54
commit 48636d0933
48 changed files with 1080 additions and 317 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ogWebconsole/Dockerfile
View File

@ -1,4 +1,4 @@
FROM node:22.1.0 FROM node:22.10-alpine
WORKDIR /app WORKDIR /app

15
ogWebconsole/Dockerfile-testing 100644
View File

@ -0,0 +1,15 @@
FROM node:22.10
WORKDIR /app
RUN apt -y update && apt -y install chromium
RUN npm install -g npm@latest
RUN npm install -g @angular/cli@^12.0.0
COPY . /app
RUN npm install
EXPOSE 4200
CMD ["ng", "serve", "--host", "0.0.0.0", "--disable-host-check"]

76
ogWebconsole/Jenkinsfile vendored
View File

@ -3,9 +3,7 @@ pipeline {
environment { environment {
DOCKER_REPO = "opengnsys" DOCKER_REPO = "opengnsys"
DOCKER_CREDENTIALS = credentials('docker-hub-credentials') DOCKER_CREDENTIALS = credentials('docker-hub-credentials')
DOCKER_TAG = "${env.BUILD_NUMBER}"
DOCKER_IMAGE_NAME = "oggui" DOCKER_IMAGE_NAME = "oggui"
BRANCH_NAME = "${GIT_BRANCH.split("/")[1]}"
} }
stages { stages {
stage ('Checkout') { stage ('Checkout') {
@ -13,12 +11,47 @@ pipeline {
checkout scm checkout scm
} }
} }
stage('Build Testing Image') {
steps {
sh "printenv"
echo 'Building....'
script {
def DOCKER_TAG = "${env.BUILD_NUMBER}"
dir('ogWebconsole') {
IMAGE_ID = "${DOCKER_REPO}/${DOCKER_IMAGE_NAME}:${BRANCH_NAME}-${DOCKER_TAG}"
IMAGE_ID_TESTING = "${DOCKER_REPO}/${DOCKER_IMAGE_NAME}:${BRANCH_NAME}-${DOCKER_TAG}-testing"
if (BRANCH_NAME == 'main') {
LATEST_ID = 'latest'
} else {
LATEST_ID = "${DOCKER_REPO}/${DOCKER_IMAGE_NAME}:${BRANCH_NAME}-latest"
}
env.IMAGE_ID_TESTING = IMAGE_ID_TESTING
env.IMAGE_ID = IMAGE_ID
env.LATEST_ID = LATEST_ID
docker.build("${IMAGE_ID_TESTING}", "-f Dockerfile-testing .")
}
}
}
}
stage('Testing') {
steps {
echo 'Running Tests....'
sh '''
cd ogWebconsole
mkdir -p test-results
docker run -p 4200:4200 --name oggui-testing -e CHROME_BIN=/usr/bin/chromium -v $(pwd)/karma.conf.js:/app/karma.conf.js -v $(pwd)/.env:/app/.env -d $IMAGE_ID_TESTING
docker exec oggui-testing ng test --watch=false --source-map=false --karma-config=karma.conf.js
'''
}
}
stage('Build') { stage('Build') {
steps { steps {
echo 'Building....' echo 'Building....'
script { script {
dir('ogWebconsole') { dir('ogWebconsole') {
docker.build("${DOCKER_REPO}/${DOCKER_IMAGE_NAME}:${BRANCH_NAME}-${DOCKER_TAG}", "-f Dockerfile .") docker.build("${IMAGE_ID}", "-f Dockerfile .")
docker.build("${LATEST_ID}", "-f Dockerfile .")
} }
} }
} }
@ -27,13 +60,42 @@ pipeline {
steps { steps {
echo 'Pushing....' echo 'Pushing....'
script { script {
docker.withRegistry('https://index.docker.io/v1/', 'docker-hub-credentials' ) { docker.withRegistry('https://index.docker.io/v1/', 'docker-hub-credentials') {
dir('ogWebconsole') { docker.image("${IMAGE_ID}").push()
docker.image("${DOCKER_REPO}/${DOCKER_IMAGE_NAME}:${BRANCH_NAME}-${DOCKER_TAG}").push() docker.image("${LATEST_ID}").push()
}
} }
} }
} }
} }
} }
post {
always {
echo 'Get test results....'
sh "docker cp oggui-testing:/app/test-results/ogGui-junit-report.xml ./test-results/ogGui-junit-report.xml"
sh "docker stop oggui-testing"
sh "docker rm oggui-testing"
junit '**/test-results/*.xml'
echo 'Cleaning up....'
sh "docker rmi ${IMAGE_ID} || true"
sh "docker rmi ${LATEST_ID} || true"
sh "docker rmi ${IMAGE_ID_TESTING} || true"
script {
def committerEmail = sh (
script: "git show -s --pretty=%ae",
returnStdout: true
).trim()
def buildResult = currentBuild.currentResult
mail to: committerEmail,
subject: "Opengnsys CI Build ${env.JOB_NAME} - ${env.BRANCH_NAME} - ${buildResult}",
body: """
<h1>Opengnsys CI Build ${JOB_NAME} - ${BRANCH_NAME} - ${buildResult}</h1>
<p>Build Number: ${BUILD_NUMBER}</p>
<p>Build URL: ${BUILD_URL}</p>º
Saludos cordiales,
Opengnsys CI
"""
}
}
}
} }

40
ogWebconsole/karma.conf.js 100644
View File

@ -0,0 +1,40 @@
module.exports = function(config) {
config.set({
frameworks: ['jasmine', '@angular-devkit/build-angular'],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-coverage'),
require('karma-junit-reporter'),
require('@angular-devkit/build-angular/plugins/karma')
],
client: {
clearContext: false
},
reporters: ['progress', 'kjhtml', 'junit'],
junitReporter: {
outputDir: 'test-results',
outputFile: 'ogGui-junit-report.xml',
useBrowserName: false,
},
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['ChromeHeadlessNoSandbox'],
customLaunchers: {
ChromeHeadlessNoSandbox: {
base: 'ChromeHeadless',
flags: ['--no-sandbox','--disable-setuid-sandbox']
}
},
singleRun: false,
restartOnFileChange: true
});
};

26
ogWebconsole/package-lock.json generated
View File

@ -38,6 +38,7 @@
"karma-coverage": "~2.2.0", "karma-coverage": "~2.2.0",
"karma-jasmine": "~5.1.0", "karma-jasmine": "~5.1.0",
"karma-jasmine-html-reporter": "~2.1.0", "karma-jasmine-html-reporter": "~2.1.0",
"karma-junit-reporter": "^2.0.1",
"typescript": "~5.4.5" "typescript": "~5.4.5"
} }
}, },
@ -10027,6 +10028,22 @@
"integrity": "sha512-VYz/BjjmC3klLJlLwA4Kw8ytk0zDSmbbDLNs794VnWmkcCB7I9aAL/D48VNQtmITyPvea2C3jdUMfc3kAoy0PQ==", "integrity": "sha512-VYz/BjjmC3klLJlLwA4Kw8ytk0zDSmbbDLNs794VnWmkcCB7I9aAL/D48VNQtmITyPvea2C3jdUMfc3kAoy0PQ==",
"dev": true "dev": true
}, },
"node_modules/karma-junit-reporter": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/karma-junit-reporter/-/karma-junit-reporter-2.0.1.tgz",
"integrity": "sha512-VtcGfE0JE4OE1wn0LK8xxDKaTP7slN8DO3I+4xg6gAi1IoAHAXOJ1V9G/y45Xg6sxdxPOR3THCFtDlAfBo9Afw==",
"dev": true,
"dependencies": {
"path-is-absolute": "^1.0.0",
"xmlbuilder": "12.0.0"
},
"engines": {
"node": ">= 8"
},
"peerDependencies": {
"karma": ">=0.9"
}
},
"node_modules/karma-source-map-support": { "node_modules/karma-source-map-support": {
"version": "1.4.0", "version": "1.4.0",
"resolved": "https://registry.npmjs.org/karma-source-map-support/-/karma-source-map-support-1.4.0.tgz", "resolved": "https://registry.npmjs.org/karma-source-map-support/-/karma-source-map-support-1.4.0.tgz",
@ -14831,6 +14848,15 @@
} }
} }
}, },
"node_modules/xmlbuilder": {
"version": "12.0.0",
"resolved": "https://registry.npmjs.org/xmlbuilder/-/xmlbuilder-12.0.0.tgz",
"integrity": "sha512-lMo8DJ8u6JRWp0/Y4XLa/atVDr75H9litKlb2E5j3V3MesoL50EBgZDWoLT3F/LztVnG67GjPXLZpqcky/UMnQ==",
"dev": true,
"engines": {
"node": ">=6.0"
}
},
"node_modules/y18n": { "node_modules/y18n": {
"version": "5.0.8", "version": "5.0.8",
"resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz", "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",

1
ogWebconsole/package.json
View File

@ -40,6 +40,7 @@
"karma-coverage": "~2.2.0", "karma-coverage": "~2.2.0",
"karma-jasmine": "~5.1.0", "karma-jasmine": "~5.1.0",
"karma-jasmine-html-reporter": "~2.1.0", "karma-jasmine-html-reporter": "~2.1.0",
"karma-junit-reporter": "^2.0.1",
"typescript": "~5.4.5" "typescript": "~5.4.5"
} }
} }

42
ogWebconsole/src/app/components/admin/roles/roles/roles.component.html
View File

@ -13,22 +13,34 @@
<mat-hint i18n="@@searchHint">Pulsar 'enter' para buscar</mat-hint> <mat-hint i18n="@@searchHint">Pulsar 'enter' para buscar</mat-hint>
</mat-form-field> </mat-form-field>
</div> </div>
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
<ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef">
<th mat-header-cell *matHeaderCellDef> {{ column.header }} </th>
<td mat-cell *matCellDef="let role"> {{ column.cell(role) }} </td>
</ng-container>
<ng-container matColumnDef="actions"> <div *ngIf="loading" class="loading-container">
<th mat-header-cell *matHeaderCellDef i18n="@@columnActions" style="text-align: center;">Acciones</th> <mat-spinner></mat-spinner>
<td mat-cell *matCellDef="let role" style="text-align: center;"> </div>
<button mat-icon-button color="primary" (click)="editRole(role)" i18n="@@editImage"> <mat-icon>edit</mat-icon></button>
<button mat-icon-button color="warn" (click)="deleteRole(role)" i18n="@@buttonDelete" [disabled]="role.permissions.includes('ROLE_SUPER_ADMIN')"><mat-icon>delete</mat-icon></button> <div *ngIf="!loading">
</td> <table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
</ng-container> <ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef">
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr> <th mat-header-cell *matHeaderCellDef> {{ column.header }} </th>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr> <td mat-cell *matCellDef="let role"> {{ column.cell(role) }} </td>
</table> </ng-container>
<ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef i18n="@@columnActions" style="text-align: center;">Acciones</th>
<td mat-cell *matCellDef="let role" style="text-align: center;">
<button mat-icon-button color="primary" (click)="editRole(role)" i18n="@@editImage">
<mat-icon>edit</mat-icon>
</button>
<button mat-icon-button color="warn" (click)="deleteRole(role)" i18n="@@buttonDelete" [disabled]="role.permissions.includes('ROLE_SUPER_ADMIN')">
<mat-icon>delete</mat-icon>
</button>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</div>
<div class="paginator-container"> <div class="paginator-container">
<mat-paginator [length]="length" <mat-paginator [length]="length"
[pageSize]="itemsPerPage" [pageSize]="itemsPerPage"

18
ogWebconsole/src/app/components/admin/roles/roles/roles.component.ts
View File

@ -1,13 +1,12 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { MatTableDataSource } from '@angular/material/table'; import { MatTableDataSource } from '@angular/material/table';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { AddRoleModalComponent } from './add-role-modal/add-role-modal.component';
import { DeleteModalComponent } from '../../../../shared/delete_modal/delete-modal/delete-modal.component';
import { HttpClient } from '@angular/common/http'; import { HttpClient } from '@angular/common/http';
import { ToastrService } from 'ngx-toastr'; import { ToastrService } from 'ngx-toastr';
import {DataService} from "./data.service"; import { DataService } from "./data.service";
import {CreateCalendarComponent} from "../../../calendar/create-calendar/create-calendar.component"; import { PageEvent } from "@angular/material/paginator";
import {PageEvent} from "@angular/material/paginator"; import { DeleteModalComponent } from '../../../../shared/delete_modal/delete-modal/delete-modal.component';
import { AddRoleModalComponent } from './add-role-modal/add-role-modal.component';
@Component({ @Component({
selector: 'app-roles', selector: 'app-roles',
@ -18,7 +17,7 @@ export class RolesComponent implements OnInit {
baseUrl: string = import.meta.env.NG_APP_BASE_API_URL; baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
dataSource = new MatTableDataSource<any>(); dataSource = new MatTableDataSource<any>();
filters: { [key: string]: string } = {}; filters: { [key: string]: string } = {};
loading:boolean = false; loading: boolean = false;
length: number = 0; length: number = 0;
itemsPerPage: number = 10; itemsPerPage: number = 10;
page: number = 0; page: number = 0;
@ -57,13 +56,16 @@ export class RolesComponent implements OnInit {
} }
search() { search() {
this.loading = true;
this.http.get<any>(`${this.apiUrl}?&page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe( this.http.get<any>(`${this.apiUrl}?&page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe(
(data) => { (data) => {
this.dataSource.data = data['hydra:member']; this.dataSource.data = data['hydra:member'];
this.length = data['hydra:totalItems']; this.length = data['hydra:totalItems'];
this.loading = false;
}, },
(error) => { (error) => {
console.error('Error fetching commands', error); console.error('Error fetching roles', error);
this.loading = false;
} }
); );
} }
@ -114,7 +116,7 @@ export class RolesComponent implements OnInit {
}); });
} }
onPageChange(event: any): void { onPageChange(event: PageEvent): void {
this.page = event.pageIndex; this.page = event.pageIndex;
this.itemsPerPage = event.pageSize; this.itemsPerPage = event.pageSize;
this.length = event.length; this.length = event.length;

37
ogWebconsole/src/app/components/admin/users/users/users.component.html
View File

@ -13,23 +13,30 @@
<mat-hint i18n="@@searchHint">Pulsar 'enter' para buscar</mat-hint> <mat-hint i18n="@@searchHint">Pulsar 'enter' para buscar</mat-hint>
</mat-form-field> </mat-form-field>
</div> </div>
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
<ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef"> <div *ngIf="loading" class="loading-container">
<th mat-header-cell *matHeaderCellDef> {{ column.header }} </th> <mat-spinner></mat-spinner>
<td mat-cell *matCellDef="let user"> {{ column.cell(user) }} </td> </div>
</ng-container>
<div *ngIf="!loading">
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
<ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef">
<th mat-header-cell *matHeaderCellDef> {{ column.header }} </th>
<td mat-cell *matCellDef="let user"> {{ column.cell(user) }} </td>
</ng-container>
<ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef i18n="@@columnActions" style="text-align: center;">Acciones</th>
<td mat-cell *matCellDef="let user" style="text-align: center;">
<button mat-icon-button color="primary" (click)="editUser(user)" i18n="@@editImage"> <mat-icon>edit</mat-icon></button>
<button mat-icon-button color="warn" (click)="deleteUser(user)" i18n="@@buttonDelete"><mat-icon>delete</mat-icon></button>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</div>
<ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef i18n="@@columnActions" style="text-align: center;">Acciones</th>
<td mat-cell *matCellDef="let user" style="text-align: center;">
<button mat-icon-button color="primary" (click)="editUser(user)" i18n="@@editImage"> <mat-icon>edit</mat-icon></button>
<button mat-icon-button color="warn" (click)="deleteUser(user)" i18n="@@buttonDelete"><mat-icon>delete</mat-icon></button>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<div class="paginator-container"> <div class="paginator-container">
<mat-paginator [length]="length" <mat-paginator [length]="length"
[pageSize]="itemsPerPage" [pageSize]="itemsPerPage"

15
ogWebconsole/src/app/components/admin/users/users/users.component.ts
View File

@ -5,20 +5,18 @@ import { AddUserModalComponent } from './add-user-modal/add-user-modal.component
import { DeleteModalComponent } from '../../../../shared/delete_modal/delete-modal/delete-modal.component'; import { DeleteModalComponent } from '../../../../shared/delete_modal/delete-modal/delete-modal.component';
import { HttpClient } from '@angular/common/http'; import { HttpClient } from '@angular/common/http';
import { ToastrService } from 'ngx-toastr'; import { ToastrService } from 'ngx-toastr';
import {DataService} from "./data.service"; import { DataService } from "./data.service";
import {AddRoleModalComponent} from "../../roles/roles/add-role-modal/add-role-modal.component";
@Component({ @Component({
selector: 'app-users', selector: 'app-users',
templateUrl: './users.component.html', templateUrl: './users.component.html',
styleUrls: ['./users.component.css'] styleUrls: ['./users.component.css']
}) })
export class UsersComponent implements OnInit { export class UsersComponent implements OnInit {
baseUrl: string = import.meta.env.NG_APP_BASE_API_URL; baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
dataSource = new MatTableDataSource<any>(); dataSource = new MatTableDataSource<any>();
filters: { [key: string]: string } = {}; filters: { [key: string]: string } = {};
loading:boolean = false; loading: boolean = false;
length: number = 0; length: number = 0;
itemsPerPage: number = 10; itemsPerPage: number = 10;
page: number = 0; page: number = 0;
@ -61,13 +59,16 @@ export class UsersComponent implements OnInit {
} }
search() { search() {
this.loading = true;
this.http.get<any>(`${this.apiUrl}?&page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe( this.http.get<any>(`${this.apiUrl}?&page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe(
(data) => { (data) => {
this.dataSource.data = data['hydra:member']; this.dataSource.data = data['hydra:member'];
this.length = data['hydra:totalItems']; this.length = data['hydra:totalItems'];
this.loading = false;
}, },
(error) => { (error) => {
console.error('Error fetching commands', error); console.error('Error fetching users', error);
this.loading = false;
} }
); );
} }
@ -78,7 +79,6 @@ export class UsersComponent implements OnInit {
dialogRef.componentInstance.userAdded.subscribe(() => { dialogRef.componentInstance.userAdded.subscribe(() => {
this.search(); this.search();
}); });
} }
editUser(user: any): void { editUser(user: any): void {
@ -114,8 +114,6 @@ export class UsersComponent implements OnInit {
console.error('Error deleting user:', error); console.error('Error deleting user:', error);
} }
}); });
} else {
console.log('User deletion cancelled');
} }
}); });
} }
@ -126,5 +124,4 @@ export class UsersComponent implements OnInit {
this.length = event.length; this.length = event.length;
this.search(); this.search();
} }
} }

60
ogWebconsole/src/app/components/calendar/calendar.component.html
View File

@ -13,35 +13,43 @@
<mat-hint i18n="@@searchHint">Pulsar 'enter' para buscar</mat-hint> <mat-hint i18n="@@searchHint">Pulsar 'enter' para buscar</mat-hint>
</mat-form-field> </mat-form-field>
</div> </div>
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
<ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef">
<th mat-header-cell *matHeaderCellDef> {{ column.header }} </th>
<td mat-cell *matCellDef="let image" >
<ng-container *ngIf="column.columnDef === 'isDefault' || column.columnDef === 'installed'">
<mat-icon [color]="image[column.columnDef] ? 'primary' : 'warn'">
{{ image[column.columnDef] ? 'check_circle' : 'cancel' }}
</mat-icon>
</ng-container>
<ng-container *ngIf="column.columnDef !== 'isDefault' && column.columnDef !== 'installed' && column.columnDef !== 'downloadUrl'"> <div *ngIf="loading" class="loading-container">
{{ column.cell(image) }} <mat-spinner></mat-spinner>
</ng-container> </div>
</td>
</ng-container>
<ng-container matColumnDef="actions"> <div *ngIf="!loading">
<th mat-header-cell *matHeaderCellDef i18n="@@columnActions" style="text-align: center;">Acciones</th> <table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
<td mat-cell *matCellDef="let calendar" style="text-align: center;"> <ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef">
<button mat-icon-button color="primary" (click)="editCalendar(calendar)" i18n="@@editImage"> <mat-icon>edit</mat-icon></button> <th mat-header-cell *matHeaderCellDef> {{ column.header }} </th>
<button *ngIf="!syncUds" mat-icon-button color="primary" (click)="sync(calendar)"><mat-icon>sync</mat-icon></button> <td mat-cell *matCellDef="let image" >
<button *ngIf="syncUds" mat-icon-button color="primary"><mat-spinner diameter="24"></mat-spinner></button> <ng-container *ngIf="column.columnDef === 'isDefault' || column.columnDef === 'installed'">
<button mat-icon-button color="warn" (click)="deleteCalendar(calendar)" i18n="@@buttonDelete"><mat-icon>delete</mat-icon></button> <mat-icon [color]="image[column.columnDef] ? 'primary' : 'warn'">
</td> {{ image[column.columnDef] ? 'check_circle' : 'cancel' }}
</ng-container> </mat-icon>
</ng-container>
<ng-container *ngIf="column.columnDef !== 'isDefault' && column.columnDef !== 'installed' && column.columnDef !== 'downloadUrl'">
{{ column.cell(image) }}
</ng-container>
</td>
</ng-container>
<ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef i18n="@@columnActions" style="text-align: center;">Acciones</th>
<td mat-cell *matCellDef="let calendar" style="text-align: center;">
<button mat-icon-button color="primary" (click)="editCalendar(calendar)" i18n="@@editImage"> <mat-icon>edit</mat-icon></button>
<button *ngIf="!syncUds" mat-icon-button color="primary" (click)="sync(calendar)"><mat-icon>sync</mat-icon></button>
<button *ngIf="syncUds" mat-icon-button color="primary"><mat-spinner diameter="24"></mat-spinner></button>
<button mat-icon-button color="warn" (click)="deleteCalendar(calendar)" i18n="@@buttonDelete"><mat-icon>delete</mat-icon></button>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</div>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<div class="paginator-container"> <div class="paginator-container">
<mat-paginator [length]="length" <mat-paginator [length]="length"
[pageSize]="itemsPerPage" [pageSize]="itemsPerPage"

6
ogWebconsole/src/app/components/calendar/calendar.component.spec.ts
View File

@ -10,8 +10,9 @@ import { MatButtonModule } from '@angular/material/button';
import { MatTableModule } from '@angular/material/table'; import { MatTableModule } from '@angular/material/table';
import { MatPaginatorModule } from '@angular/material/paginator'; import { MatPaginatorModule } from '@angular/material/paginator';
import { MatTooltipModule } from '@angular/material/tooltip'; import { MatTooltipModule } from '@angular/material/tooltip';
import { FormsModule } from '@angular/forms'; // Importa FormsModule para ngModel import { FormsModule } from '@angular/forms';
import { CalendarComponent } from './calendar.component'; import { CalendarComponent } from './calendar.component';
import { MatProgressSpinner } from '@angular/material/progress-spinner';
describe('CalendarComponent', () => { describe('CalendarComponent', () => {
let component: CalendarComponent; let component: CalendarComponent;
@ -32,7 +33,8 @@ describe('CalendarComponent', () => {
MatTableModule, MatTableModule,
MatPaginatorModule, MatPaginatorModule,
MatTooltipModule, MatTooltipModule,
FormsModule // Añade FormsModule aquí para que ngModel funcione FormsModule,
MatProgressSpinner
] ]
}) })
.compileComponents(); .compileComponents();

25
ogWebconsole/src/app/components/calendar/calendar.component.ts
View File

@ -1,13 +1,13 @@
import {Component, OnInit, signal} from '@angular/core'; import { Component, OnInit, signal } from '@angular/core';
import {MatTableDataSource} from "@angular/material/table"; import { MatTableDataSource } from "@angular/material/table";
import {DatePipe} from "@angular/common"; import { DatePipe } from "@angular/common";
import {MatDialog} from "@angular/material/dialog"; import { MatDialog } from "@angular/material/dialog";
import {HttpClient} from "@angular/common/http"; import { HttpClient } from "@angular/common/http";
import {DataService} from "./data.service"; import { DataService } from "./data.service";
import {ToastrService} from "ngx-toastr"; import { ToastrService } from "ngx-toastr";
import {PageEvent} from "@angular/material/paginator"; import { PageEvent } from "@angular/material/paginator";
import {CreateCalendarComponent} from "./create-calendar/create-calendar.component"; import { CreateCalendarComponent } from "./create-calendar/create-calendar.component";
import {DeleteModalComponent} from "../../shared/delete_modal/delete-modal/delete-modal.component"; import { DeleteModalComponent } from "../../shared/delete_modal/delete-modal/delete-modal.component";
@Component({ @Component({
selector: 'app-calendar', selector: 'app-calendar',
@ -22,7 +22,7 @@ export class CalendarComponent implements OnInit {
itemsPerPage: number = 10; itemsPerPage: number = 10;
page: number = 1; page: number = 1;
pageSizeOptions: number[] = [5, 10, 20, 40, 100]; pageSizeOptions: number[] = [5, 10, 20, 40, 100];
loading:boolean = false; loading: boolean = false;
filters: { [key: string]: string } = {}; filters: { [key: string]: string } = {};
alertMessage: string | null = null; alertMessage: string | null = null;
readonly panelOpenState = signal(false); readonly panelOpenState = signal(false);
@ -148,13 +148,16 @@ export class CalendarComponent implements OnInit {
} }
applyFilter() { applyFilter() {
this.loading = true;
this.http.get<any>(`${this.apiUrl}?page=${this.page}&itemsPerPage=${this.itemsPerPage}`).subscribe({ this.http.get<any>(`${this.apiUrl}?page=${this.page}&itemsPerPage=${this.itemsPerPage}`).subscribe({
next: (response) => { next: (response) => {
this.dataSource.data = response['hydra:member']; this.dataSource.data = response['hydra:member'];
this.length = response['hydra:totalItems']; this.length = response['hydra:totalItems'];
this.loading = false;
}, },
error: (error) => { error: (error) => {
console.error('Error al cargar las imágenes:', error); console.error('Error al cargar las imágenes:', error);
this.loading = false;
} }
}); });
} }

106
ogWebconsole/src/app/components/commands/commands-groups/commands-groups.component.html
View File

@ -1,57 +1,63 @@
<div class="header-container"> <div class="header-container">
<h2 class="title" i18n="@@adminCommandGroupsTitle">Administrar Grupos de Comandos</h2> <h2 class="title" i18n="@@adminCommandGroupsTitle">Administrar Grupos de Comandos</h2>
<div class="command-groups-button-row"> <div class="command-groups-button-row">
<button mat-flat-button color="primary" (click)="openCreateCommandGroupModal()">Añadir Grupo de Comandos</button> <button mat-flat-button color="primary" (click)="openCreateCommandGroupModal()">Añadir Grupo de Comandos</button>
</div>
</div>
<mat-divider class="divider"></mat-divider>
<div class="search-container">
<mat-form-field appearance="fill" class="search-string">
<mat-label i18n="@@searchLabel">Buscar nombre de grupo</mat-label>
<input matInput placeholder="Búsqueda" [(ngModel)]="filters['name']" (keyup.enter)="search()" i18n-placeholder="@@searchPlaceholder">
<mat-icon matSuffix>search</mat-icon>
<mat-hint i18n="@@searchHint">Pulsar 'enter' para buscar</mat-hint>
</mat-form-field>
</div> </div>
</div>
<mat-divider class="divider"></mat-divider>
<div class="search-container">
<mat-form-field appearance="fill" class="search-string">
<mat-label i18n="@@searchLabel">Buscar nombre de grupo</mat-label>
<input matInput placeholder="Búsqueda" [(ngModel)]="filters['name']" (keyup.enter)="search()" i18n-placeholder="@@searchPlaceholder">
<mat-icon matSuffix>search</mat-icon>
<mat-hint i18n="@@searchHint">Pulsar 'enter' para buscar</mat-hint>
</mat-form-field>
</div>
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8"> <div *ngIf="loading" class="loading-container">
<ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef"> <mat-spinner></mat-spinner>
<th mat-header-cell *matHeaderCellDef> {{ column.header }} </th> </div>
<td mat-cell *matCellDef="let commandGroup">
<ng-container *ngIf="column.columnDef !== 'commands'">
{{ column.cell(commandGroup) }}
</ng-container>
<ng-container *ngIf="column.columnDef === 'commands'"> <div *ngIf="!loading">
<button mat-button [matMenuTriggerFor]="menu">Ver comandos</button> <table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
<mat-menu #menu="matMenu"> <ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef">
<button mat-menu-item *ngFor="let command of commandGroup.commands"> <th mat-header-cell *matHeaderCellDef> {{ column.header }} </th>
{{ command.name }} <td mat-cell *matCellDef="let commandGroup">
</button> <ng-container *ngIf="column.columnDef !== 'commands'">
</mat-menu> {{ column.cell(commandGroup) }}
</ng-container> </ng-container>
</td>
</ng-container>
<ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef i18n="@@columnActions" style="text-align: center;">Acciones</th>
<td mat-cell *matCellDef="let client" style="text-align: center;">
<button mat-icon-button color="info" (click)="viewGroupDetails(client)"><mat-icon i18n="@@deleteElementTooltip">visibility</mat-icon></button>
<button mat-icon-button color="primary" (click)="editCommandGroup(client)" i18n="@@editImage"> <mat-icon>edit</mat-icon></button>
<button mat-icon-button color="warn" (click)="deleteCommandGroup(client)">
<mat-icon i18n="@@deleteElementTooltip">delete</mat-icon>
</button>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr> <ng-container *ngIf="column.columnDef === 'commands'">
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr> <button mat-button [matMenuTriggerFor]="menu">Ver comandos</button>
<mat-menu #menu="matMenu">
<button mat-menu-item *ngFor="let command of commandGroup.commands">
{{ command.name }}
</button>
</mat-menu>
</ng-container>
</td>
</ng-container>
<ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef i18n="@@columnActions" style="text-align: center;">Acciones</th>
<td mat-cell *matCellDef="let client" style="text-align: center;">
<button mat-icon-button color="info" (click)="viewGroupDetails(client)"><mat-icon i18n="@@deleteElementTooltip">visibility</mat-icon></button>
<button mat-icon-button color="primary" (click)="editCommandGroup(client)" i18n="@@editImage"> <mat-icon>edit</mat-icon></button>
<button mat-icon-button color="warn" (click)="deleteCommandGroup(client)">
<mat-icon i18n="@@deleteElementTooltip">delete</mat-icon>
</button>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table> </table>
</div>
<div class="paginator-container"> <div class="paginator-container">
<mat-paginator [length]="length" <mat-paginator [length]="length"
[pageSize]="itemsPerPage" [pageSize]="itemsPerPage"
[pageIndex]="page" [pageIndex]="page"
[pageSizeOptions]="pageSizeOptions" [pageSizeOptions]="pageSizeOptions"
(page)="onPageChange($event)"> (page)="onPageChange($event)">
</mat-paginator> </mat-paginator>
</div> </div>

10
ogWebconsole/src/app/components/commands/commands-groups/commands-groups.component.ts
View File

@ -2,11 +2,11 @@ import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http'; import { HttpClient } from '@angular/common/http';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { ToastrService } from 'ngx-toastr'; import { ToastrService } from 'ngx-toastr';
import { CreateCommandGroupComponent } from './create-command-group/create-command-group.component' import { CreateCommandGroupComponent } from './create-command-group/create-command-group.component';
import { DetailCommandGroupComponent } from './detail-command-group/detail-command-group.component'; import { DetailCommandGroupComponent } from './detail-command-group/detail-command-group.component';
import { DeleteModalComponent } from '../../../shared/delete_modal/delete-modal/delete-modal.component'; import { DeleteModalComponent } from '../../../shared/delete_modal/delete-modal/delete-modal.component';
import {MatTableDataSource} from "@angular/material/table"; import { MatTableDataSource } from "@angular/material/table";
import {DatePipe} from "@angular/common"; import { DatePipe } from "@angular/common";
@Component({ @Component({
selector: 'app-commands-groups', selector: 'app-commands-groups',
@ -22,6 +22,7 @@ export class CommandsGroupsComponent implements OnInit {
page: number = 0; page: number = 0;
pageSizeOptions: number[] = [10, 20, 40, 100]; pageSizeOptions: number[] = [10, 20, 40, 100];
datePipe: DatePipe = new DatePipe('es-ES'); datePipe: DatePipe = new DatePipe('es-ES');
loading: boolean = false;
columns = [ columns = [
{ {
columnDef: 'id', columnDef: 'id',
@ -54,13 +55,16 @@ export class CommandsGroupsComponent implements OnInit {
} }
search(): void { search(): void {
this.loading = true;
this.http.get<any>(`${this.apiUrl}?page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe( this.http.get<any>(`${this.apiUrl}?page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe(
(data) => { (data) => {
this.dataSource.data = data['hydra:member']; this.dataSource.data = data['hydra:member'];
this.length = data['hydra:totalItems']; this.length = data['hydra:totalItems'];
this.loading = false;
}, },
(error) => { (error) => {
console.error('Error fetching command groups', error); console.error('Error fetching command groups', error);
this.loading = false;
} }
); );
} }

9
ogWebconsole/src/app/components/commands/commands-groups/create-command-group/create-command-group.component.html
View File

@ -1,6 +1,10 @@
<h2 mat-dialog-title>{{ editing ? 'Editar' : 'Crear' }} grupo de comando</h2> <h2 mat-dialog-title>{{ editing ? 'Editar' : 'Crear' }} grupo de comando</h2>
<mat-dialog-content class="form-container"> <mat-dialog-content class="form-container">
<form class="command-group-form" (ngSubmit)="onSubmit()"> <div *ngIf="loading" class="loading-container">
<mat-spinner></mat-spinner>
</div>
<form *ngIf="!loading" class="command-group-form" (ngSubmit)="onSubmit()">
<mat-form-field> <mat-form-field>
<mat-label>Nombre del Grupo</mat-label> <mat-label>Nombre del Grupo</mat-label>
<input matInput [(ngModel)]="groupName" name="groupName" required /> <input matInput [(ngModel)]="groupName" name="groupName" required />
@ -11,7 +15,7 @@
<div class="command-selection"> <div class="command-selection">
<div class="available-commands"> <div class="available-commands">
<h3>Comandos Disponibles</h3> <h3>Comandos Disponibles</h3>
<div class="table-wrapper"> <!-- Agregar este contenedor --> <div class="table-wrapper">
<table mat-table [dataSource]="availableCommands" class="mat-elevation-z8"> <table mat-table [dataSource]="availableCommands" class="mat-elevation-z8">
<ng-container matColumnDef="name"> <ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef> Nombre </th> <th mat-header-cell *matHeaderCellDef> Nombre </th>
@ -57,4 +61,3 @@
<button mat-button (click)="close()">Cancelar</button> <button mat-button (click)="close()">Cancelar</button>
<button mat-button (click)="onSubmit()" cdkFocusInitial> Guardar </button> <button mat-button (click)="onSubmit()" cdkFocusInitial> Guardar </button>
</mat-dialog-actions> </mat-dialog-actions>

4
ogWebconsole/src/app/components/commands/commands-groups/create-command-group/create-command-group.component.ts
View File

@ -15,6 +15,7 @@ export class CreateCommandGroupComponent implements OnInit {
groupName: string = ''; groupName: string = '';
enabled: boolean = true; enabled: boolean = true;
editing: boolean = false; editing: boolean = false;
loading: boolean = false;
private apiUrl = `${this.baseUrl}/commands`; private apiUrl = `${this.baseUrl}/commands`;
constructor( constructor(
@ -34,12 +35,15 @@ export class CreateCommandGroupComponent implements OnInit {
} }
loadAvailableCommands(): void { loadAvailableCommands(): void {
this.loading = true;
this.http.get<any>(this.apiUrl).subscribe( this.http.get<any>(this.apiUrl).subscribe(
(data) => { (data) => {
this.availableCommands = data['hydra:member']; this.availableCommands = data['hydra:member'];
this.loading = false;
}, },
(error) => { (error) => {
console.error('Error fetching available commands', error); console.error('Error fetching available commands', error);
this.loading = false;
} }
); );
} }

18
ogWebconsole/src/app/components/commands/commands-groups/detail-command-group/detail-command-group.component.html
View File

@ -1,16 +1,21 @@
<div class="detail-command-group-container"> <div class="detail-command-group-container">
<h2>Detalles del Grupo de Comandos</h2> <h2>Detalles del Grupo de Comandos</h2>
<mat-card> <!-- Indicador de carga -->
<div *ngIf="loading" class="loading-container">
<mat-spinner></mat-spinner>
</div>
<mat-card *ngIf="!loading">
<mat-card-header> <mat-card-header>
<mat-card-title>{{ data.name }}</mat-card-title> <mat-card-title>{{ data.name }}</mat-card-title>
<mat-card-subtitle>Creado por: {{ data.createdBy }}</mat-card-subtitle> <mat-card-subtitle>Creado por: {{ data.createdBy }}</mat-card-subtitle>
</mat-card-header> </mat-card-header>
<mat-card-content> <mat-card-content>
<p><strong>ID del Grupo:</strong> {{ data.uuid }}</p> <p><strong>ID del Grupo:</strong> {{ data.uuid }}</p>
<p><strong>Fecha de Creación:</strong> {{ data.createdAt | date:'short' }}</p> <p><strong>Fecha de Creación:</strong> {{ data.createdAt | date:'short' }}</p>
<h3>Comandos Incluidos:</h3> <h3>Comandos Incluidos:</h3>
<table mat-table [dataSource]="data.commands" class="mat-elevation-z8"> <table mat-table [dataSource]="data.commands" class="mat-elevation-z8">
<ng-container matColumnDef="name"> <ng-container matColumnDef="name">
@ -27,11 +32,10 @@
<tr mat-row *matRowDef="let row; columns: ['name', 'uuid'];"></tr> <tr mat-row *matRowDef="let row; columns: ['name', 'uuid'];"></tr>
</table> </table>
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>
<!-- Sección para seleccionar clientes --> <!-- Sección para seleccionar clientes -->
<div class="additional-section" *ngIf="showClientSelect"> <div class="additional-section" *ngIf="showClientSelect && !loading">
<form [formGroup]="form"> <form [formGroup]="form">
<h4>Selecciona los clientes:</h4> <h4>Selecciona los clientes:</h4>
<mat-form-field appearance="fill"> <mat-form-field appearance="fill">
@ -48,7 +52,7 @@
</form> </form>
</div> </div>
<div class="command-group-actions"> <div class="command-group-actions" *ngIf="!loading">
<button mat-flat-button color="primary" (click)="toggleClientSelect()"> <button mat-flat-button color="primary" (click)="toggleClientSelect()">
{{ showClientSelect ? 'Ejecutar' : 'Programar Ejecución' }} {{ showClientSelect ? 'Ejecutar' : 'Programar Ejecución' }}
</button> </button>

27
ogWebconsole/src/app/components/commands/commands-groups/detail-command-group/detail-command-group.component.ts
View File

@ -13,8 +13,9 @@ export class DetailCommandGroupComponent implements OnInit {
baseUrl: string = import.meta.env.NG_APP_BASE_API_URL; baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
form!: FormGroup; form!: FormGroup;
clients: any[] = []; clients: any[] = [];
showClientSelect = false; // Ocultar selección de clientes inicialmente showClientSelect = false;
canExecute = false; canExecute = false;
loading: boolean = false;
constructor( constructor(
@Inject(MAT_DIALOG_DATA) public data: any, @Inject(MAT_DIALOG_DATA) public data: any,
@ -29,17 +30,28 @@ export class DetailCommandGroupComponent implements OnInit {
selectedClients: [[], Validators.required], selectedClients: [[], Validators.required],
}); });
// Obtener la lista de clientes this.loadClients();
this.http.get<any>(`${this.baseUrl}/clients?page=1&itemsPerPage=30`).subscribe(response => { }
this.clients = response['hydra:member'];
loadClients(): void {
this.loading = true;
this.http.get<any>(`${this.baseUrl}/clients?page=1&itemsPerPage=30`).subscribe({
next: (response) => {
this.clients = response['hydra:member'];
this.loading = false;
},
error: (error) => {
console.error('Error fetching clients:', error);
this.loading = false;
}
}); });
} }
toggleClientSelect(): void { toggleClientSelect(): void {
if (!this.showClientSelect) { if (!this.showClientSelect) {
this.showClientSelect = true; // Mostrar selección de clientes this.showClientSelect = true;
} else { } else {
this.execute(); // Ejecutar si ya está visible this.execute();
} }
} }
@ -50,13 +62,16 @@ export class DetailCommandGroupComponent implements OnInit {
}; };
const apiUrl = `${this.baseUrl}/command-groups/${this.data.uuid}/execute`; const apiUrl = `${this.baseUrl}/command-groups/${this.data.uuid}/execute`;
this.loading = true;
this.http.post(apiUrl, payload).subscribe({ this.http.post(apiUrl, payload).subscribe({
next: () => { next: () => {
this.dialogRef.close(); this.dialogRef.close();
this.toastService.success('Grupo de comandos ejecutado exitosamente'); this.toastService.success('Grupo de comandos ejecutado exitosamente');
this.loading = false;
}, },
error: (error) => { error: (error) => {
console.error('Error ejecutando grupo de comandos:', error); console.error('Error ejecutando grupo de comandos:', error);
this.loading = false;
} }
}); });
} else { } else {

74
ogWebconsole/src/app/components/commands/commands-task/commands-task.component.html
View File

@ -16,46 +16,52 @@
</mat-form-field> </mat-form-field>
</div> </div>
<table mat-table [dataSource]="tasks" class="mat-elevation-z8"> <div *ngIf="loading" class="loading-container">
<ng-container matColumnDef="taskid"> <mat-spinner></mat-spinner>
<th mat-header-cell *matHeaderCellDef> Id</th> </div>
<td mat-cell *matCellDef="let task"> {{ task.id }} </td>
</ng-container>
<ng-container matColumnDef="notes"> <div *ngIf="!loading">
<th mat-header-cell *matHeaderCellDef> Info</th> <table mat-table [dataSource]="tasks" class="mat-elevation-z8">
<td mat-cell *matCellDef="let task"> {{ task.notes }} </td> <ng-container matColumnDef="taskid">
</ng-container> <th mat-header-cell *matHeaderCellDef> Id</th>
<td mat-cell *matCellDef="let task"> {{ task.id }} </td>
</ng-container>
<ng-container matColumnDef="name"> <ng-container matColumnDef="notes">
<th mat-header-cell *matHeaderCellDef> Creado por </th> <th mat-header-cell *matHeaderCellDef> Info</th>
<td mat-cell *matCellDef="let task"> {{ task.createdBy }} </td> <td mat-cell *matCellDef="let task"> {{ task.notes }} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="scheduledDate"> <ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef> Fecha de Ejecución </th> <th mat-header-cell *matHeaderCellDef> Creado por </th>
<td mat-cell *matCellDef="let task"> {{ task.dateTime | date:'short' }} </td> <td mat-cell *matCellDef="let task"> {{ task.createdBy }} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="enabled"> <ng-container matColumnDef="scheduledDate">
<th mat-header-cell *matHeaderCellDef> Estado </th> <th mat-header-cell *matHeaderCellDef> Fecha de Ejecución </th>
<td mat-cell *matCellDef="let task"> {{ task.enabled ? 'Habilitado' : 'Deshabilitado' }} </td> <td mat-cell *matCellDef="let task"> {{ task.dateTime | date:'short' }} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="enabled">
<th mat-header-cell *matHeaderCellDef i18n="@@columnActions" style="text-align: center;">Acciones</th> <th mat-header-cell *matHeaderCellDef> Estado </th>
<td mat-cell *matCellDef="let task" style="text-align: center;"> <td mat-cell *matCellDef="let task"> {{ task.enabled ? 'Habilitado' : 'Deshabilitado' }} </td>
<button mat-icon-button color="info" (click)="viewTaskDetails(task)"><mat-icon i18n="@@deleteElementTooltip">visibility</mat-icon></button> </ng-container>
<button mat-icon-button color="primary" (click)="editTask(task)" i18n="@@editImage"> <mat-icon>edit</mat-icon></button>
<button mat-icon-button color="warn" (click)="deleteTask(task)">
<mat-icon i18n="@@deleteElementTooltip">delete</mat-icon>
</button>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr> <ng-container matColumnDef="actions">
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr> <th mat-header-cell *matHeaderCellDef i18n="@@columnActions" style="text-align: center;">Acciones</th>
</table> <td mat-cell *matCellDef="let task" style="text-align: center;">
<button mat-icon-button color="info" (click)="viewTaskDetails(task)"><mat-icon i18n="@@deleteElementTooltip">visibility</mat-icon></button>
<button mat-icon-button color="primary" (click)="editTask(task)" i18n="@@editImage"> <mat-icon>edit</mat-icon></button>
<button mat-icon-button color="warn" (click)="deleteTask(task)">
<mat-icon i18n="@@deleteElementTooltip">delete</mat-icon>
</button>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</div>
<mat-paginator [length]="length" <mat-paginator [length]="length"
[pageSize]="itemsPerPage" [pageSize]="itemsPerPage"

8
ogWebconsole/src/app/components/commands/commands-task/commands-task.component.ts
View File

@ -19,7 +19,8 @@ export class CommandsTaskComponent implements OnInit {
itemsPerPage: number = 10; itemsPerPage: number = 10;
page: number = 1; page: number = 1;
pageSizeOptions: number[] = [5, 10, 20, 40, 100]; pageSizeOptions: number[] = [5, 10, 20, 40, 100];
displayedColumns: string[] = ['taskid','notes','name', 'scheduledDate', 'enabled', 'actions']; displayedColumns: string[] = ['taskid', 'notes', 'name', 'scheduledDate', 'enabled', 'actions'];
loading: boolean = false;
private apiUrl = `${this.baseUrl}/command-tasks`; private apiUrl = `${this.baseUrl}/command-tasks`;
constructor(private http: HttpClient, private dialog: MatDialog, private toastService: ToastrService) {} constructor(private http: HttpClient, private dialog: MatDialog, private toastService: ToastrService) {}
@ -34,13 +35,16 @@ export class CommandsTaskComponent implements OnInit {
} }
loadTasks(): void { loadTasks(): void {
this.loading = true;
this.http.get<any>(`${this.apiUrl}?page=${this.page}&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe( this.http.get<any>(`${this.apiUrl}?page=${this.page}&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe(
(data) => { (data) => {
this.tasks = data['hydra:member']; this.tasks = data['hydra:member'];
this.length = data['hydra:totalItems']; this.length = data['hydra:totalItems'];
this.loading = false;
}, },
(error) => { (error) => {
console.error('Error fetching tasks', error); console.error('Error fetching tasks', error);
this.loading = false;
} }
); );
} }
@ -48,7 +52,7 @@ export class CommandsTaskComponent implements OnInit {
viewTaskDetails(task: any): void { viewTaskDetails(task: any): void {
this.dialog.open(DetailTaskComponent, { this.dialog.open(DetailTaskComponent, {
width: '800px', width: '800px',
data: {task}, data: { task },
}).afterClosed().subscribe(() => this.loadTasks()); }).afterClosed().subscribe(() => this.loadTasks());
} }

4
ogWebconsole/src/app/components/commands/commands-task/detail-task/detail-task.component.ts
View File

@ -13,11 +13,9 @@ export class DetailTaskComponent {
public dialogRef: MatDialogRef<DetailTaskComponent>, public dialogRef: MatDialogRef<DetailTaskComponent>,
@Inject(MAT_DIALOG_DATA) public data: any @Inject(MAT_DIALOG_DATA) public data: any
) { ) {
this.task = data.task; // Asignamos la tarea que viene en el modal this.task = data.task;
console.log('tasaas',this.task);
} }
// Método opcional para cerrar el modal
closeDialog(): void { closeDialog(): void {
this.dialogRef.close(); this.dialogRef.close();
} }

32
ogWebconsole/src/app/components/commands/commands-task/task-logs/task-logs.component.html
View File

@ -5,6 +5,7 @@
</div> </div>
</div> </div>
<mat-divider class="divider"></mat-divider> <mat-divider class="divider"></mat-divider>
<div class="search-container"> <div class="search-container">
<mat-form-field appearance="fill" class="search-select"> <mat-form-field appearance="fill" class="search-select">
<input type="text" matInput [formControl]="clientControl" [matAutocomplete]="clientAuto" placeholder="Seleccione un cliente"> <input type="text" matInput [formControl]="clientControl" [matAutocomplete]="clientAuto" placeholder="Seleccione un cliente">
@ -15,7 +16,6 @@
</mat-autocomplete> </mat-autocomplete>
</mat-form-field> </mat-form-field>
<!-- Autocomplete para seleccionar un comando -->
<mat-form-field appearance="fill" class="search-select"> <mat-form-field appearance="fill" class="search-select">
<input type="text" matInput [formControl]="commandControl" [matAutocomplete]="commandAuto" placeholder="Seleccione un comando"> <input type="text" matInput [formControl]="commandControl" [matAutocomplete]="commandAuto" placeholder="Seleccione un comando">
<mat-autocomplete #commandAuto="matAutocomplete" [displayWith]="displayFnCommand" (optionSelected)="onOptionCommandSelected($event.option.value)"> <mat-autocomplete #commandAuto="matAutocomplete" [displayWith]="displayFnCommand" (optionSelected)="onOptionCommandSelected($event.option.value)">
@ -26,19 +26,25 @@
</mat-form-field> </mat-form-field>
</div> </div>
<table mat-table [dataSource]="traces" class="mat-elevation-z8"> <!-- Indicador de carga -->
<ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef"> <div *ngIf="loading" class="loading-container">
<th mat-header-cell *matHeaderCellDef> {{ column.header }} </th> <mat-spinner></mat-spinner>
<td mat-cell *matCellDef="let trace" > </div>
<ng-container >
{{ column.cell(trace) }}
</ng-container>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr> <!-- Tabla de trazas -->
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr> <div *ngIf="!loading">
</table> <table mat-table [dataSource]="traces" class="mat-elevation-z8">
<ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef">
<th mat-header-cell *matHeaderCellDef> {{ column.header }} </th>
<td mat-cell *matCellDef="let trace">
{{ column.cell(trace) }}
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</div>
<div class="paginator-container"> <div class="paginator-container">
<mat-paginator [length]="length" <mat-paginator [length]="length"

23
ogWebconsole/src/app/components/commands/commands-task/task-logs/task-logs.component.ts
View File

@ -1,9 +1,9 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http'; import { HttpClient } from '@angular/common/http';
import {Observable, startWith} from 'rxjs'; import { Observable } from 'rxjs';
import {FormControl} from "@angular/forms"; import { FormControl } from '@angular/forms';
import {map} from "rxjs/operators"; import { map, startWith } from 'rxjs/operators';
import {DatePipe} from "@angular/common"; import { DatePipe } from '@angular/common';
@Component({ @Component({
selector: 'app-task-logs', selector: 'app-task-logs',
@ -46,7 +46,7 @@ export class TaskLogsComponent implements OnInit {
}, },
{ {
columnDef: 'executedAt', columnDef: 'executedAt',
header: 'Programacion de ejecución', header: 'Programación de ejecución',
cell: (trace: any) => `${this.datePipe.transform(trace.executedAt, 'dd/MM/yyyy hh:mm:ss')}`, cell: (trace: any) => `${this.datePipe.transform(trace.executedAt, 'dd/MM/yyyy hh:mm:ss')}`,
}, },
{ {
@ -110,40 +110,45 @@ export class TaskLogsComponent implements OnInit {
} }
loadTraces(): void { loadTraces(): void {
this.loading = true;
const url = `${this.baseUrl}/traces?page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}`; const url = `${this.baseUrl}/traces?page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}`;
this.http.get<any>(url, { params: this.filters }).subscribe( this.http.get<any>(url, { params: this.filters }).subscribe(
(data) => { (data) => {
this.traces = data['hydra:member']; this.traces = data['hydra:member'];
this.length = data['hydra:totalItems']; this.length = data['hydra:totalItems'];
this.groupedTraces = this.groupByCommandId(this.traces); this.groupedTraces = this.groupByCommandId(this.traces);
this.loading = false;
}, },
(error) => { (error) => {
console.error('Error fetching traces', error); console.error('Error fetching traces', error);
this.loading = false;
} }
); );
} }
loadCommands() { loadCommands() {
this.http.get<any>( `${this.baseUrl}/commands?&page=1&itemsPerPage=10000`).subscribe( this.loading = true;
this.http.get<any>(`${this.baseUrl}/commands?&page=1&itemsPerPage=10000`).subscribe(
response => { response => {
this.commands = response['hydra:member']; this.commands = response['hydra:member'];
this.loading = false; this.loading = false;
}, },
error => { error => {
console.error('Error fetching parent units:', error); console.error('Error fetching commands:', error);
this.loading = false; this.loading = false;
} }
); );
} }
loadClients() { loadClients() {
this.http.get<any>( `${this.baseUrl}/clients?&page=1&itemsPerPage=10000`).subscribe( this.loading = true;
this.http.get<any>(`${this.baseUrl}/clients?&page=1&itemsPerPage=10000`).subscribe(
response => { response => {
this.clients = response['hydra:member']; this.clients = response['hydra:member'];
this.loading = false; this.loading = false;
}, },
error => { error => {
console.error('Error fetching parent units:', error); console.error('Error fetching clients:', error);
this.loading = false; this.loading = false;
} }
); );

57
ogWebconsole/src/app/components/commands/main-commands/commands.component.html
View File

@ -5,6 +5,7 @@
</div> </div>
</div> </div>
<mat-divider class="divider"></mat-divider> <mat-divider class="divider"></mat-divider>
<div class="search-container"> <div class="search-container">
<mat-form-field appearance="fill" class="search-string"> <mat-form-field appearance="fill" class="search-string">
<mat-label i18n="@@searchLabel">Buscar nombre de comando</mat-label> <mat-label i18n="@@searchLabel">Buscar nombre de comando</mat-label>
@ -14,34 +15,38 @@
</mat-form-field> </mat-form-field>
</div> </div>
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8"> <div *ngIf="loading" class="loading-container">
<ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef"> <mat-spinner></mat-spinner>
<th mat-header-cell *matHeaderCellDef> {{ column.header }} </th> </div>
<td mat-cell *matCellDef="let command" >
<ng-container *ngIf="column.columnDef !== 'readOnly'">
{{ column.cell(command) }}
</ng-container>
<ng-container *ngIf="column.columnDef === 'readOnly'" >
<mat-chip *ngIf="command.readOnly" class="mat-chip-readonly-true"><mat-icon style="color:white;">check</mat-icon></mat-chip>
<mat-chip *ngIf="!command.readOnly" class="mat-chip-readonly-false"> <mat-icon style="color:white;">close</mat-icon></mat-chip>
</ng-container>
</td>
</ng-container>
<ng-container matColumnDef="actions"> <div *ngIf="!loading">
<th mat-header-cell *matHeaderCellDef i18n="@@columnActions" style="text-align: center;">Acciones</th> <table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
<td mat-cell *matCellDef="let client" style="text-align: center;"> <ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef">
<button mat-icon-button color="info" (click)="viewDetails($event, client)"><mat-icon i18n="@@deleteElementTooltip">visibility</mat-icon></button> <th mat-header-cell *matHeaderCellDef> {{ column.header }} </th>
<button mat-icon-button color="primary" (click)="editCommand($event, client)" i18n="@@editImage"> <mat-icon>edit</mat-icon></button> <td mat-cell *matCellDef="let command">
<button mat-icon-button color="warn" (click)="deleteCommand($event, client)"> <ng-container *ngIf="column.columnDef !== 'readOnly'">
<mat-icon i18n="@@deleteElementTooltip">delete</mat-icon> {{ column.cell(command) }}
</button> </ng-container>
</td> <ng-container *ngIf="column.columnDef === 'readOnly'">
</ng-container> <mat-chip *ngIf="command.readOnly" class="mat-chip-readonly-true"><mat-icon style="color:white;">check</mat-icon></mat-chip>
<mat-chip *ngIf="!command.readOnly" class="mat-chip-readonly-false"><mat-icon style="color:white;">close</mat-icon></mat-chip>
</ng-container>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr> <ng-container matColumnDef="actions">
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr> <th mat-header-cell *matHeaderCellDef i18n="@@columnActions" style="text-align: center;">Acciones</th>
</table> <td mat-cell *matCellDef="let client" style="text-align: center;">
<button mat-icon-button color="info" (click)="viewDetails($event, client)"><mat-icon i18n="@@deleteElementTooltip">visibility</mat-icon></button>
<button mat-icon-button color="primary" (click)="editCommand($event, client)" i18n="@@editImage"> <mat-icon>edit</mat-icon></button>
<button mat-icon-button color="warn" (click)="deleteCommand($event, client)"><mat-icon i18n="@@deleteElementTooltip">delete</mat-icon></button>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</div>
<div class="paginator-container"> <div class="paginator-container">
<mat-paginator [length]="length" <mat-paginator [length]="length"

69
ogWebconsole/src/app/components/commands/main-commands/commands.component.spec.ts
View File

@ -1,33 +1,61 @@
import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http'; import { HttpClientTestingModule } from '@angular/common/http/testing';
import { TreeViewComponent } from '../../groups/shared/tree-view/tree-view.component'; import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog';
import { MatDialogModule } from '@angular/material/dialog'; // <-- Import MatDialogModule import { ToastrModule } from 'ngx-toastr';
import { MatFormFieldModule } from '@angular/material/form-field'; // Import for mat-form-field import { MatTableModule } from '@angular/material/table';
import { MatInputModule } from '@angular/material/input'; // Import for matInput import { DatePipe } from '@angular/common';
import { MatDividerModule } from '@angular/material/divider'; // Import for mat-divider import { CommandsComponent } from './commands.component';
import { ToastrModule } from 'ngx-toastr'; // Import for Toastr import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatProgressSpinner, MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { MatSelectModule } from '@angular/material/select';
import { MatTooltipModule } from '@angular/material/tooltip';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { NgxChartsModule } from '@swimlane/ngx-charts';
describe('TreeViewComponent', () => { describe('CommandsComponent', () => {
let component: TreeViewComponent; let component: CommandsComponent;
let fixture: ComponentFixture<TreeViewComponent>; let fixture: ComponentFixture<CommandsComponent>;
beforeEach(async () => { beforeEach(async () => {
await TestBed.configureTestingModule({ await TestBed.configureTestingModule({
declarations: [TreeViewComponent], declarations: [CommandsComponent],
imports: [ imports: [
MatDialogModule, // <-- Add MatDialogModule here HttpClientTestingModule,
MatFormFieldModule, // <-- For mat-form-field ToastrModule.forRoot(),
MatInputModule, // <-- For matInput BrowserAnimationsModule,
MatDividerModule, // <-- For mat-divider MatDividerModule,
ToastrModule.forRoot() // <-- For ToastrService MatFormFieldModule,
MatInputModule,
MatIconModule,
MatButtonModule,
MatTableModule,
MatPaginatorModule,
MatTooltipModule,
FormsModule,
MatProgressSpinner,
MatProgressSpinnerModule,
MatDialogModule,
ReactiveFormsModule,
MatSelectModule,
NgxChartsModule,
DatePipe
], ],
providers: [ providers: [
provideHttpClient(withInterceptorsFromDi()) { provide: MatDialogRef, useValue: {} },
{ provide: MAT_DIALOG_DATA, useValue: {} }
] ]
})
.compileComponents(); }).compileComponents();
});
fixture = TestBed.createComponent(TreeViewComponent); beforeEach(() => {
fixture = TestBed.createComponent(CommandsComponent);
component = fixture.componentInstance; component = fixture.componentInstance;
fixture.detectChanges(); fixture.detectChanges();
}); });
@ -35,4 +63,5 @@ describe('TreeViewComponent', () => {
it('should create', () => { it('should create', () => {
expect(component).toBeTruthy(); expect(component).toBeTruthy();
}); });
}); });

12
ogWebconsole/src/app/components/commands/main-commands/commands.component.ts
View File

@ -5,8 +5,8 @@ import { ToastrService } from 'ngx-toastr';
import { CommandDetailComponent } from './detail-command/command-detail.component'; import { CommandDetailComponent } from './detail-command/command-detail.component';
import { CreateCommandComponent } from './create-command/create-command.component'; import { CreateCommandComponent } from './create-command/create-command.component';
import { DeleteModalComponent } from '../../../shared/delete_modal/delete-modal/delete-modal.component'; import { DeleteModalComponent } from '../../../shared/delete_modal/delete-modal/delete-modal.component';
import {MatTableDataSource} from "@angular/material/table"; import { MatTableDataSource } from '@angular/material/table';
import {DatePipe} from "@angular/common"; import { DatePipe } from '@angular/common';
@Component({ @Component({
selector: 'app-commands', selector: 'app-commands',
@ -22,6 +22,7 @@ export class CommandsComponent implements OnInit {
page: number = 0; page: number = 0;
pageSizeOptions: number[] = [10, 20, 40, 100]; pageSizeOptions: number[] = [10, 20, 40, 100];
datePipe: DatePipe = new DatePipe('es-ES'); datePipe: DatePipe = new DatePipe('es-ES');
loading: boolean = false;
columns = [ columns = [
{ {
columnDef: 'id', columnDef: 'id',
@ -54,13 +55,16 @@ export class CommandsComponent implements OnInit {
} }
search(): void { search(): void {
this.http.get<any>(`${this.apiUrl}?page=${this.page +1 }&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe( this.loading = true;
this.http.get<any>(`${this.apiUrl}?page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe(
(data) => { (data) => {
this.dataSource.data = data['hydra:member']; this.dataSource.data = data['hydra:member'];
this.length = data['hydra:totalItems']; this.length = data['hydra:totalItems'];
this.loading = false;
}, },
(error) => { (error) => {
console.error('Error fetching commands', error); console.error('Error fetching commands', error);
this.loading = false;
} }
); );
} }
@ -87,7 +91,7 @@ export class CommandsComponent implements OnInit {
}).afterClosed().subscribe(() => this.search()); }).afterClosed().subscribe(() => this.search());
} }
deleteCommand(event: MouseEvent,command: any): void { deleteCommand(event: MouseEvent, command: any): void {
event.stopPropagation(); event.stopPropagation();
this.dialog.open(DeleteModalComponent, { this.dialog.open(DeleteModalComponent, {
width: '300px', width: '300px',

8
ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.html
View File

@ -9,7 +9,13 @@
</button> </button>
</mat-menu> </mat-menu>
</div> </div>
<div class="client-info"> <mat-divider class="divider"></mat-divider>
<div *ngIf="loading" class="loading-container">
<mat-spinner></mat-spinner>
</div>
<div *ngIf="!loading" class="client-info">
<div class="info-section"> <div class="info-section">
<mat-tab-group dynamicHeight> <mat-tab-group dynamicHeight>
<mat-tab label="Datos generales"> <mat-tab label="Datos generales">

7
ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.ts
View File

@ -4,6 +4,7 @@ import {DatePipe} from "@angular/common";
import {MatTableDataSource} from "@angular/material/table"; import {MatTableDataSource} from "@angular/material/table";
import {PartitionAssistantComponent} from "./partition-assistant/partition-assistant.component"; import {PartitionAssistantComponent} from "./partition-assistant/partition-assistant.component";
import {MatDialog} from "@angular/material/dialog"; import {MatDialog} from "@angular/material/dialog";
interface ClientInfo { interface ClientInfo {
property: string; property: string;
value: any; value: any;
@ -58,6 +59,8 @@ export class ClientMainViewComponent implements OnInit {
}, },
]; ];
displayedColumns = [...this.columns.map(column => column.columnDef)]; displayedColumns = [...this.columns.map(column => column.columnDef)];
isDiskUsageEmpty: boolean = true;
loading: boolean = true;
constructor(private http: HttpClient, private dialog: MatDialog) { constructor(private http: HttpClient, private dialog: MatDialog) {
const url = window.location.href; const url = window.location.href;
@ -71,6 +74,8 @@ export class ClientMainViewComponent implements OnInit {
this.updateGeneralData(); this.updateGeneralData();
this.updateNetworkData(); this.updateNetworkData();
this.loadCommands() this.loadCommands()
this.calculateDiskUsage();
this.loading = false;
} }
updateGeneralData() { updateGeneralData() {
@ -85,6 +90,7 @@ export class ClientMainViewComponent implements OnInit {
{ property: 'Menú', value: this.clientData?.menu?.description || '' }, { property: 'Menú', value: this.clientData?.menu?.description || '' },
]; ];
} }
updateNetworkData() { updateNetworkData() {
this.networkData = [ this.networkData = [
{ property: 'Remote Pc', value: this.clientData.remotePc || '' }, { property: 'Remote Pc', value: this.clientData.remotePc || '' },
@ -120,6 +126,7 @@ export class ClientMainViewComponent implements OnInit {
const percentage = total > 0 ? Math.round((used / total) * 100) : 0; const percentage = total > 0 ? Math.round((used / total) * 100) : 0;
return { diskNumber, total, used, percentage }; return { diskNumber, total, used, percentage };
}); });
this.isDiskUsageEmpty = this.diskUsageData.length === 0;
} }
loadPartitions(): void { loadPartitions(): void {

7
ogWebconsole/src/app/components/groups/components/client-tab-view/client-tab-view.component.html
View File

@ -34,6 +34,12 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
</div> </div>
<div *ngIf="!loading" class="loading-container">
<mat-spinner></mat-spinner>
</div>
<div *ngIf="loading">
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8"> <table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
<ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef"> <ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef">
<th mat-header-cell *matHeaderCellDef> {{ column.header }} </th> <th mat-header-cell *matHeaderCellDef> {{ column.header }} </th>
@ -80,3 +86,4 @@
(page)="onPageChange($event)"> (page)="onPageChange($event)">
</mat-paginator> </mat-paginator>
</div> </div>
</div>

2
ogWebconsole/src/app/components/groups/components/organizational-unit-tab-view/organizational-unit-tab-view.component.ts
View File

@ -64,7 +64,7 @@ export class OrganizationalUnitTabViewComponent {
}, },
{ {
columnDef: 'available', columnDef: 'available',
header: 'Aula Reservada', header: 'Disponible remotePC',
cell: (ou: any) => `${ou.available ? 'No' : 'Si'}` cell: (ou: any) => `${ou.available ? 'No' : 'Si'}`
}, },
{ {

39
ogWebconsole/src/app/components/ogboot/ogboot-status/ogboot-status.component.spec.ts
View File

@ -2,6 +2,20 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
import { OgbootStatusComponent } from './ogboot-status.component'; import { OgbootStatusComponent } from './ogboot-status.component';
import { HttpClientTestingModule } from '@angular/common/http/testing'; import { HttpClientTestingModule } from '@angular/common/http/testing';
import { NgxChartsModule } from '@swimlane/ngx-charts'; import { NgxChartsModule } from '@swimlane/ngx-charts';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatDialogModule, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatProgressSpinner, MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { MatSelectModule } from '@angular/material/select';
import { MatTableModule } from '@angular/material/table';
import { MatTooltipModule } from '@angular/material/tooltip';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ToastrModule } from 'ngx-toastr';
describe('OgbootStatusComponent', () => { describe('OgbootStatusComponent', () => {
let component: OgbootStatusComponent; let component: OgbootStatusComponent;
let fixture: ComponentFixture<OgbootStatusComponent>; let fixture: ComponentFixture<OgbootStatusComponent>;
@ -9,7 +23,30 @@ describe('OgbootStatusComponent', () => {
beforeEach(async () => { beforeEach(async () => {
await TestBed.configureTestingModule({ await TestBed.configureTestingModule({
declarations: [OgbootStatusComponent], declarations: [OgbootStatusComponent],
imports: [HttpClientTestingModule, NgxChartsModule] imports: [
HttpClientTestingModule,
ToastrModule.forRoot(),
BrowserAnimationsModule,
MatDividerModule,
MatFormFieldModule,
MatInputModule,
MatIconModule,
MatButtonModule,
MatTableModule,
MatPaginatorModule,
MatTooltipModule,
FormsModule,
MatProgressSpinner,
MatProgressSpinnerModule,
MatDialogModule,
ReactiveFormsModule,
MatSelectModule,
NgxChartsModule
],
providers: [
{ provide: MatDialogRef, useValue: {} },
{ provide: MAT_DIALOG_DATA, useValue: {} }
]
}).compileComponents(); }).compileComponents();
}); });

8
ogWebconsole/src/app/components/ogboot/pxe-boot-files/pxe-boot-files.component.spec.ts
View File

@ -9,7 +9,7 @@ import { MatFormFieldModule } from '@angular/material/form-field';
import { MatSelectModule } from '@angular/material/select'; import { MatSelectModule } from '@angular/material/select';
import { MatPaginatorModule } from '@angular/material/paginator'; import { MatPaginatorModule } from '@angular/material/paginator';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { FormsModule } from '@angular/forms'; import { FormsModule, NgControl, ReactiveFormsModule } from '@angular/forms';
import { MatInputModule } from '@angular/material/input'; import { MatInputModule } from '@angular/material/input';
import { MatTableModule } from '@angular/material/table'; import { MatTableModule } from '@angular/material/table';
@ -36,8 +36,10 @@ describe('PxeBootFilesComponent', () => {
BrowserAnimationsModule, BrowserAnimationsModule,
FormsModule, FormsModule,
MatInputModule, MatInputModule,
MatTableModule, MatTableModule,
] ReactiveFormsModule
],
providers: [NgControl]
}) })
.compileComponents(); .compileComponents();

46
ogWebconsole/src/app/components/ogboot/pxe/add-clients-to-pxe/add-clients-to-pxe.component.spec.ts
View File

@ -1,6 +1,25 @@
import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { AddClientsToPxeComponent } from './add-clients-to-pxe.component'; import { AddClientsToPxeComponent } from './add-clients-to-pxe.component';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatOptionModule } from '@angular/material/core';
import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatProgressSpinner, MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { MatSelectModule } from '@angular/material/select';
import { MatTableModule } from '@angular/material/table';
import { MatTooltipModule } from '@angular/material/tooltip';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ToastrModule } from 'ngx-toastr';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatDialogModule, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MatListModule } from '@angular/material/list';
import { MatTabsModule } from '@angular/material/tabs';
describe('AddClientsToPxeComponent', () => { describe('AddClientsToPxeComponent', () => {
let component: AddClientsToPxeComponent; let component: AddClientsToPxeComponent;
@ -8,7 +27,32 @@ describe('AddClientsToPxeComponent', () => {
beforeEach(async () => { beforeEach(async () => {
await TestBed.configureTestingModule({ await TestBed.configureTestingModule({
declarations: [AddClientsToPxeComponent] declarations: [AddClientsToPxeComponent],
imports: [
HttpClientTestingModule,
ToastrModule.forRoot(),
BrowserAnimationsModule,
MatDividerModule,
MatFormFieldModule,
MatInputModule,
MatIconModule,
MatButtonModule,
MatTableModule,
MatPaginatorModule,
MatTooltipModule,
FormsModule,
ReactiveFormsModule,
MatProgressSpinnerModule,
MatDialogModule,
MatSelectModule,
MatTabsModule,
MatAutocompleteModule,
MatListModule
],
providers: [
{ provide: MatDialogRef, useValue: {} },
{ provide: MAT_DIALOG_DATA, useValue: {} }
]
}) })
.compileComponents(); .compileComponents();

47
ogWebconsole/src/app/components/ogboot/pxe/clients/clients.component.spec.ts
View File

@ -1,6 +1,25 @@
import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ClientsComponent } from './clients.component'; import { ClientsComponent } from './clients.component';
import { MatInputModule } from '@angular/material/input';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatOptionModule } from '@angular/material/core';
import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatProgressSpinner, MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { MatSelectModule } from '@angular/material/select';
import { MatTableModule } from '@angular/material/table';
import { MatTooltipModule } from '@angular/material/tooltip';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ToastrModule } from 'ngx-toastr';
import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatListModule } from '@angular/material/list';
import { MatTabsModule } from '@angular/material/tabs';
describe('ClientsComponent', () => { describe('ClientsComponent', () => {
let component: ClientsComponent; let component: ClientsComponent;
@ -8,7 +27,33 @@ describe('ClientsComponent', () => {
beforeEach(async () => { beforeEach(async () => {
await TestBed.configureTestingModule({ await TestBed.configureTestingModule({
declarations: [ClientsComponent] declarations: [ClientsComponent],
imports: [
HttpClientTestingModule,
ToastrModule.forRoot(),
BrowserAnimationsModule,
MatDividerModule,
MatFormFieldModule,
MatInputModule,
MatIconModule,
MatButtonModule,
MatTableModule,
MatPaginatorModule,
MatTooltipModule,
FormsModule,
ReactiveFormsModule,
MatProgressSpinnerModule,
MatDialogModule,
MatSelectModule,
MatTabsModule,
MatAutocompleteModule,
MatListModule
],
providers: [
{ provide: MatDialogRef, useValue: {} },
{ provide: MAT_DIALOG_DATA, useValue: {data: {id: 123}} }
]
}) })
.compileComponents(); .compileComponents();

1
ogWebconsole/src/app/components/ogboot/pxe/clients/clients.component.ts
View File

@ -35,7 +35,6 @@ export class ClientsComponent {
getPxeClients(): void { getPxeClients(): void {
this.http.get<any>(`${this.baseUrl}/clients?template.id=${this.data.data.id}`).subscribe({ this.http.get<any>(`${this.baseUrl}/clients?template.id=${this.data.data.id}`).subscribe({
next: data => { next: data => {
console.log(data['hydra:member'])
this.clients = data['hydra:member'] this.clients = data['hydra:member']
}, },
error: error => { error: error => {

23
ogWebconsole/src/app/components/ogboot/pxe/show-template-content/show-template-content.component.spec.ts
View File

@ -1,23 +0,0 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ShowTemplateContentComponent } from './show-template-content.component';
describe('ShowTemplateContentComponent', () => {
let component: ShowTemplateContentComponent;
let fixture: ComponentFixture<ShowTemplateContentComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ShowTemplateContentComponent]
})
.compileComponents();
fixture = TestBed.createComponent(ShowTemplateContentComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

41
ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/server-info-dialog/server-info-dialog.component.spec.ts
View File

@ -1,6 +1,22 @@
import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ServerInfoDialogComponent } from './server-info-dialog.component'; import { ServerInfoDialogComponent } from './server-info-dialog.component';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatOptionModule } from '@angular/material/core';
import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { MatSelectModule } from '@angular/material/select';
import { MatTableModule } from '@angular/material/table';
import { MatTooltipModule } from '@angular/material/tooltip';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ToastrModule } from 'ngx-toastr';
import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog'; // Importar tokens de MatDialog
describe('ServerInfoDialogComponent', () => { describe('ServerInfoDialogComponent', () => {
let component: ServerInfoDialogComponent; let component: ServerInfoDialogComponent;
@ -8,7 +24,30 @@ describe('ServerInfoDialogComponent', () => {
beforeEach(async () => { beforeEach(async () => {
await TestBed.configureTestingModule({ await TestBed.configureTestingModule({
declarations: [ServerInfoDialogComponent] declarations: [ServerInfoDialogComponent],
imports: [
HttpClientTestingModule,
ToastrModule.forRoot(),
BrowserAnimationsModule,
MatDividerModule,
MatFormFieldModule,
MatInputModule,
MatIconModule,
MatButtonModule,
MatTableModule,
MatPaginatorModule,
MatTooltipModule,
FormsModule,
MatProgressSpinnerModule,
MatOptionModule,
ReactiveFormsModule,
MatSelectModule,
MatDialogModule
],
providers: [
{ provide: MatDialogRef, useValue: {} },
{ provide: MAT_DIALOG_DATA, useValue: {} }
]
}) })
.compileComponents(); .compileComponents();

43
ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets/status/status.component.spec.ts
View File

@ -1,6 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { StatusComponent } from './status.component'; import { StatusComponent } from './status.component';
import { MatInputModule } from '@angular/material/input';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatOptionModule } from '@angular/material/core';
import { MatDialogModule, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { MatSelectModule } from '@angular/material/select';
import { MatTableModule } from '@angular/material/table';
import { MatTooltipModule } from '@angular/material/tooltip';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ToastrModule } from 'ngx-toastr';
import { NgxChartsModule } from '@swimlane/ngx-charts';
describe('StatusComponent', () => { describe('StatusComponent', () => {
let component: StatusComponent; let component: StatusComponent;
@ -8,7 +25,31 @@ describe('StatusComponent', () => {
beforeEach(async () => { beforeEach(async () => {
await TestBed.configureTestingModule({ await TestBed.configureTestingModule({
declarations: [StatusComponent] declarations: [StatusComponent],
imports: [
HttpClientTestingModule,
ToastrModule.forRoot(),
BrowserAnimationsModule,
MatDividerModule,
MatFormFieldModule,
MatInputModule,
MatIconModule,
MatButtonModule,
MatTableModule,
MatPaginatorModule,
MatTooltipModule,
FormsModule,
MatProgressSpinnerModule,
MatOptionModule,
ReactiveFormsModule,
MatSelectModule,
MatDialogModule,
NgxChartsModule
],
providers: [
{ provide: MatDialogRef, useValue: {} },
{ provide: MAT_DIALOG_DATA, useValue: {} }
]
}) })
.compileComponents(); .compileComponents();

38
ogWebconsole/src/app/components/operative-system/create-operative-system/create-operative-system.component.spec.ts
View File

@ -1,6 +1,20 @@
import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { CreateOperativeSystemComponent } from './create-operative-system.component'; import { CreateOperativeSystemComponent } from './create-operative-system.component';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatProgressSpinner, MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { MatTableModule } from '@angular/material/table';
import { MatTooltipModule } from '@angular/material/tooltip';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ToastrModule } from 'ngx-toastr';
import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog';
describe('CreateOperativeSystemComponent', () => { describe('CreateOperativeSystemComponent', () => {
let component: CreateOperativeSystemComponent; let component: CreateOperativeSystemComponent;
@ -8,7 +22,29 @@ describe('CreateOperativeSystemComponent', () => {
beforeEach(async () => { beforeEach(async () => {
await TestBed.configureTestingModule({ await TestBed.configureTestingModule({
declarations: [CreateOperativeSystemComponent] declarations: [CreateOperativeSystemComponent],
imports: [
HttpClientTestingModule,
ToastrModule.forRoot(),
BrowserAnimationsModule,
MatDividerModule,
MatFormFieldModule,
MatInputModule,
MatIconModule,
MatButtonModule,
MatTableModule,
MatPaginatorModule,
MatTooltipModule,
FormsModule,
MatProgressSpinner,
MatProgressSpinnerModule,
MatDialogModule,
ReactiveFormsModule
],
providers: [
{ provide: MatDialogRef, useValue: {} }, // Proporciona un mock de MatDialogRef
{ provide: MAT_DIALOG_DATA, useValue: {} } // Proporciona un mock de MAT_DIALOG_DATA si es necesario
]
}) })
.compileComponents(); .compileComponents();

30
ogWebconsole/src/app/components/operative-system/operative-system.component.spec.ts
View File

@ -1,6 +1,19 @@
import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { OperativeSystemComponent } from './operative-system.component'; import { OperativeSystemComponent } from './operative-system.component';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { FormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatProgressSpinner } from '@angular/material/progress-spinner';
import { MatTableModule } from '@angular/material/table';
import { MatTooltipModule } from '@angular/material/tooltip';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ToastrModule } from 'ngx-toastr';
describe('OperativeSystemComponent', () => { describe('OperativeSystemComponent', () => {
let component: OperativeSystemComponent; let component: OperativeSystemComponent;
@ -8,7 +21,22 @@ describe('OperativeSystemComponent', () => {
beforeEach(async () => { beforeEach(async () => {
await TestBed.configureTestingModule({ await TestBed.configureTestingModule({
declarations: [OperativeSystemComponent] declarations: [OperativeSystemComponent],
imports: [
HttpClientTestingModule,
ToastrModule.forRoot(),
BrowserAnimationsModule,
MatDividerModule,
MatFormFieldModule,
MatInputModule,
MatIconModule,
MatButtonModule,
MatTableModule,
MatPaginatorModule,
MatTooltipModule,
FormsModule,
MatProgressSpinner
]
}) })
.compileComponents(); .compileComponents();

45
ogWebconsole/src/app/components/software-profile/create-software-profile/create-software-profile.component.spec.ts
View File

@ -1,6 +1,24 @@
import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { CreateSoftwareProfileComponent } from './create-software-profile.component'; import { CreateSoftwareProfileComponent } from './create-software-profile.component';
import { MatFormFieldModule } from '@angular/material/form-field';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatDividerModule } from '@angular/material/divider';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { MatSelectModule } from '@angular/material/select';
import { MatTableModule } from '@angular/material/table';
import { MatTooltipModule } from '@angular/material/tooltip';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ToastrModule } from 'ngx-toastr';
import { MatDialogModule, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MatTabsModule } from '@angular/material/tabs';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatListModule } from '@angular/material/list';
describe('CreateSoftwareProfileComponent', () => { describe('CreateSoftwareProfileComponent', () => {
let component: CreateSoftwareProfileComponent; let component: CreateSoftwareProfileComponent;
@ -8,7 +26,32 @@ describe('CreateSoftwareProfileComponent', () => {
beforeEach(async () => { beforeEach(async () => {
await TestBed.configureTestingModule({ await TestBed.configureTestingModule({
declarations: [CreateSoftwareProfileComponent] declarations: [CreateSoftwareProfileComponent],
imports: [
HttpClientTestingModule,
ToastrModule.forRoot(),
BrowserAnimationsModule,
MatDividerModule,
MatFormFieldModule,
MatInputModule,
MatIconModule,
MatButtonModule,
MatTableModule,
MatPaginatorModule,
MatTooltipModule,
FormsModule,
ReactiveFormsModule,
MatProgressSpinnerModule,
MatDialogModule,
MatSelectModule,
MatTabsModule,
MatAutocompleteModule,
MatListModule
],
providers: [
{ provide: MatDialogRef, useValue: {} },
{ provide: MAT_DIALOG_DATA, useValue: {} }
]
}) })
.compileComponents(); .compileComponents();

35
ogWebconsole/src/app/components/software-profile/software-profile.component.spec.ts
View File

@ -1,6 +1,21 @@
import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { SoftwareProfileComponent } from './software-profile.component'; import { SoftwareProfileComponent } from './software-profile.component';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatOptionModule } from '@angular/material/core';
import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatProgressSpinner } from '@angular/material/progress-spinner';
import { MatSelectModule } from '@angular/material/select';
import { MatTableModule } from '@angular/material/table';
import { MatTooltipModule } from '@angular/material/tooltip';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ToastrModule } from 'ngx-toastr';
describe('SoftwareProfileComponent', () => { describe('SoftwareProfileComponent', () => {
let component: SoftwareProfileComponent; let component: SoftwareProfileComponent;
@ -8,7 +23,25 @@ describe('SoftwareProfileComponent', () => {
beforeEach(async () => { beforeEach(async () => {
await TestBed.configureTestingModule({ await TestBed.configureTestingModule({
declarations: [SoftwareProfileComponent] declarations: [SoftwareProfileComponent],
imports: [
HttpClientTestingModule,
ToastrModule.forRoot(),
BrowserAnimationsModule,
MatDividerModule,
MatFormFieldModule,
MatInputModule,
MatIconModule,
MatButtonModule,
MatTableModule,
MatPaginatorModule,
MatTooltipModule,
FormsModule,
MatProgressSpinner,
MatOptionModule,
ReactiveFormsModule,
MatSelectModule
]
}) })
.compileComponents(); .compileComponents();

41
ogWebconsole/src/app/components/software/create-software/create-software.component.spec.ts
View File

@ -1,6 +1,22 @@
import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { CreateSoftwareComponent } from './create-software.component'; import { CreateSoftwareComponent } from './create-software.component';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatOptionModule } from '@angular/material/core';
import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatProgressSpinner, MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { MatSelectModule } from '@angular/material/select';
import { MatTableModule } from '@angular/material/table';
import { MatTooltipModule } from '@angular/material/tooltip';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ToastrModule } from 'ngx-toastr';
import { MatDialogModule, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
describe('CreateSoftwareComponent', () => { describe('CreateSoftwareComponent', () => {
let component: CreateSoftwareComponent; let component: CreateSoftwareComponent;
@ -8,7 +24,30 @@ describe('CreateSoftwareComponent', () => {
beforeEach(async () => { beforeEach(async () => {
await TestBed.configureTestingModule({ await TestBed.configureTestingModule({
declarations: [CreateSoftwareComponent] declarations: [CreateSoftwareComponent],
imports: [
HttpClientTestingModule,
ToastrModule.forRoot(),
BrowserAnimationsModule,
MatDividerModule,
MatFormFieldModule,
MatInputModule,
MatIconModule,
MatButtonModule,
MatTableModule,
MatPaginatorModule,
MatTooltipModule,
FormsModule,
MatProgressSpinner,
MatProgressSpinnerModule,
MatDialogModule,
ReactiveFormsModule,
MatSelectModule
],
providers: [
{ provide: MatDialogRef, useValue: {} }, // Proporciona un mock de MatDialogRef
{ provide: MAT_DIALOG_DATA, useValue: {} } // Proporciona un mock de MAT_DIALOG_DATA si es necesario
]
}) })
.compileComponents(); .compileComponents();

4
ogWebconsole/src/app/components/software/software.component.html
View File

@ -8,13 +8,13 @@
<div class="search-container"> <div class="search-container">
<mat-form-field appearance="fill" class="search-string"> <mat-form-field appearance="fill" class="search-string">
<mat-label i18n="@@searchLabel">Buscar nombre de software</mat-label> <mat-label i18n="@@searchLabel">Buscar nombre de software</mat-label>
<input matInput placeholder="Búsqueda" [(ngModel)]="filters['name']" (keyup.enter)="search()" i18n-placeholder="@@searchPlaceholder"> <input matInput name="searchBar" placeholder="Búsqueda" [(ngModel)]="filters['name']" (keyup.enter)="search()" i18n-placeholder="@@searchPlaceholder">
<mat-icon matSuffix>search</mat-icon> <mat-icon matSuffix>search</mat-icon>
<mat-hint i18n="@@searchHint">Pulsar 'enter' para buscar</mat-hint> <mat-hint i18n="@@searchHint">Pulsar 'enter' para buscar</mat-hint>
</mat-form-field> </mat-form-field>
<mat-form-field appearance="fill" class="search-boolean"> <mat-form-field appearance="fill" class="search-boolean">
<mat-label i18n="@@searchLabel">Buscar por tipo</mat-label> <mat-label i18n="@@searchLabel">Buscar por tipo</mat-label>
<mat-select [(ngModel)]="filters['type']" (selectionChange)="search()" placeholder="Seleccionar opción"> <mat-select name="searchType" [(ngModel)]="filters['type']" (selectionChange)="search()" placeholder="Seleccionar opción">
<mat-option [value]="'application'">Aplicación</mat-option> <mat-option [value]="'application'">Aplicación</mat-option>
<mat-option [value]="'operative-system'">Sistema operativo</mat-option> <mat-option [value]="'operative-system'">Sistema operativo</mat-option>
<mat-option [value]="'file'">Sistema de ficheros</mat-option> <mat-option [value]="'file'">Sistema de ficheros</mat-option>

37
ogWebconsole/src/app/components/software/software.component.spec.ts
View File

@ -1,6 +1,21 @@
import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { SoftwareComponent } from './software.component'; import { SoftwareComponent } from './software.component';
import { MatDividerModule } from '@angular/material/divider';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { FormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatProgressSpinner } from '@angular/material/progress-spinner';
import { MatTableModule } from '@angular/material/table';
import { MatTooltipModule } from '@angular/material/tooltip';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ToastrModule } from 'ngx-toastr';
import { MatOptionModule } from '@angular/material/core';
import { ReactiveFormsModule } from '@angular/forms';
import { MatSelectModule } from '@angular/material/select';
describe('SoftwareComponent', () => { describe('SoftwareComponent', () => {
let component: SoftwareComponent; let component: SoftwareComponent;
@ -8,7 +23,25 @@ describe('SoftwareComponent', () => {
beforeEach(async () => { beforeEach(async () => {
await TestBed.configureTestingModule({ await TestBed.configureTestingModule({
declarations: [SoftwareComponent] declarations: [SoftwareComponent],
imports: [
HttpClientTestingModule,
ToastrModule.forRoot(),
BrowserAnimationsModule,
MatDividerModule,
MatFormFieldModule,
MatInputModule,
MatIconModule,
MatButtonModule,
MatTableModule,
MatPaginatorModule,
MatTooltipModule,
FormsModule,
MatProgressSpinner,
MatOptionModule,
ReactiveFormsModule,
MatSelectModule
]
}) })
.compileComponents(); .compileComponents();

32
ogWebconsole/src/styles.css
View File

@ -2,3 +2,35 @@
html, body { height: 100%; } html, body { height: 100%; }
body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; } body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; }
/* Clase general para el contenedor de carga */
.loading-container {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 1000;
background-color: rgba(255, 255, 255, 0.8); /* Fondo semitransparente */
width: 100vw;
height: 100vh;
}
/* Spinner de Angular Material */
.mat-spinner {
width: 100px;
height: 100px;
}
/* Texto que acompaña al spinner */
.loading-container p {
margin-top: 20px;
font-size: 1.2rem;
font-weight: bold;
color: #555;
}

47
ogWebconsole/test-results/ogGui-junit-report.xml 100644
View File

@ -0,0 +1,47 @@
<?xml version="1.0"?>
<testsuite name="Chrome 123.0.0.0 (Linux x86_64)" package="" timestamp="2024-10-24T11:02:26" id="0" hostname="Ubnt" tests="31" errors="0" failures="0" time="1.13">
<properties>
<property name="browser.fullName" value="Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.0.0 Safari/537.36"/>
</properties>
<testcase name="CreateOperativeSystemComponent should create" time="0.106" classname="CreateOperativeSystemComponent"/>
<testcase name="PxeBootFilesComponent should create" time="0.083" classname="PxeBootFilesComponent"/>
<testcase name="OgDhcpSubnetsComponent should create" time="0.068" classname="OgDhcpSubnetsComponent"/>
<testcase name="PXEimagesComponent should create" time="0.092" classname="PXEimagesComponent"/>
<testcase name="AddClientsToPxeComponent should create" time="0.024" classname="AddClientsToPxeComponent"/>
<testcase name="RolesComponent should create" time="0.024" classname="RolesComponent"/>
<testcase name="SoftwareProfileComponent should create" time="0.05" classname="SoftwareProfileComponent"/>
<testcase name="CreateCommandComponent should create" time="0.026" classname="CreateCommandComponent"/>
<testcase name="DashboardComponent should create the component" time="0.008" classname="DashboardComponent"/>
<testcase name="CalendarComponent should create" time="0.049" classname="CalendarComponent"/>
<testcase name="UsersComponent should create" time="0.023" classname="UsersComponent"/>
<testcase name="SoftwareComponent should create" time="0.053" classname="SoftwareComponent"/>
<testcase name="OgdhcpComponent should create" time="0.006" classname="OgdhcpComponent"/>
<testcase name="StatusComponent should create" time="0.032" classname="StatusComponent"/>
<testcase name="OperativeSystemComponent should create" time="0.04" classname="OperativeSystemComponent"/>
<testcase name="LoginComponent should create" time="0.036" classname="LoginComponent"/>
<testcase name="CommandsTaskComponent should create" time="0.041" classname="CommandsTaskComponent"/>
<testcase name="CommandsComponent should create" time="0.037" classname="CommandsComponent"/>
<testcase name="CreateSoftwareProfileComponent should create" time="0.067" classname="CreateSoftwareProfileComponent"/>
<testcase name="OgbootStatusComponent should create the component" time="0.017" classname="OgbootStatusComponent"/>
<testcase name="ClientsComponent should create" time="0.032" classname="ClientsComponent"/>
<testcase name="AdminComponent el primer botón debería tener el texto &quot;Usuarios&quot;" time="0.022" classname="AdminComponent"/>
<testcase name="AdminComponent el segundo botón debería tener el routerLink correcto" time="0.017" classname="AdminComponent"/>
<testcase name="AdminComponent el primer botón debería tener el routerLink correcto" time="0.016" classname="AdminComponent"/>
<testcase name="AdminComponent debería crear el componente" time="0.008" classname="AdminComponent"/>
<testcase name="AdminComponent el segundo botón debería tener el texto &quot;Roles&quot;" time="0.011" classname="AdminComponent"/>
<testcase name="AdminComponent debería contener dos botones" time="0.009" classname="AdminComponent"/>
<testcase name="AppComponent should create the app" time="0.009" classname="AppComponent"/>
<testcase name="CreateSoftwareComponent should create" time="0.058" classname="CreateSoftwareComponent"/>
<testcase name="PxeComponent should create the component" time="0.05" classname="PxeComponent"/>
<testcase name="ServerInfoDialogComponent should create" time="0.016" classname="ServerInfoDialogComponent"/>
<system-out>
<![CDATA[Chrome 123.0.0.0 (Linux x86_64) ERROR: 'Error fetching images', HttpErrorResponse{headers: HttpHeaders{normalizedNames: Map{}, lazyUpdate: null, headers: Map{}}, status: 0, statusText: 'Unknown Error', url: 'https://127.0.0.1:8443/og-lives?page=1&itemsPerPage=1000', ok: false, name: 'HttpErrorResponse', message: 'Http failure response for https://127.0.0.1:8443/og-lives?page=1&itemsPerPage=1000: 0 Unknown Error', error: ProgressEvent{isTrusted: true}}
,Chrome 123.0.0.0 (Linux x86_64) ERROR: 'Error fetching og lives', HttpErrorResponse{headers: HttpHeaders{normalizedNames: Map{}, lazyUpdate: null, headers: Map{}}, status: 0, statusText: 'Unknown Error', url: 'https://127.0.0.1:8443/og-lives?page=1&itemsPerPage=1000', ok: false, name: 'HttpErrorResponse', message: 'Http failure response for https://127.0.0.1:8443/og-lives?page=1&itemsPerPage=1000: 0 Unknown Error', error: ProgressEvent{isTrusted: true}}
,Chrome 123.0.0.0 (Linux x86_64) LOG: 'Selected subnet UUID:', Object{}
,Chrome 123.0.0.0 (Linux x86_64) LOG: Object{}
,Chrome 123.0.0.0 (Linux x86_64) LOG: Object{}
]]>
</system-out>
<system-err/>
</testsuite>