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

Fix double click event in advanced search component and add partition assistant component

oggui/calendar
Alvaro Puente Mella 2024-10-09 10:29:56 +02:00
parent e56d03f281
commit 8c311c354c
13 changed files with 269 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
ogWebconsole/src/app/app-routing.module.ts
View File

@ -20,38 +20,42 @@ import { CommandsComponent } from './components/commands/main-commands/commands.
import { CommandsGroupsComponent } from './components/commands/commands-groups/commands-groups.component';
import { CommandsTaskComponent } from './components/commands/commands-task/commands-task.component';
import { TaskLogsComponent } from './components/commands/commands-task/task-logs/task-logs.component';
import { PartitionAssistantComponent } from './components/commands/commands-modals/partition-assistant/partition-assistant.component';
import { ClientMainViewComponent } from './components/groups/components/client-main-view/client-main-view.component';
const routes: Routes = [
{ path: '', redirectTo: 'auth/login', pathMatch: 'full' },
{
path: '',
component: MainLayoutComponent,
children: [
{ path: 'dashboard', component: DashboardComponent },
{ path: 'admin', component: AdminComponent },
{ path: 'users', component: UsersComponent },
{ path: 'user-groups', component: RolesComponent },
{ path: 'groups', component: GroupsComponent },
{ path: 'images', component: ImagesComponent },
{ path: 'pxe', component: PxeComponent },
{ path: 'pxe-boot-file', component: PxeBootFilesComponent },
{ path: 'ogboot-status', component: OgbootStatusComponent },
{ path: 'dhcp', component: OgdhcpComponent },
{ path: 'dhcp-subnets', component: OgDhcpSubnetsComponent },
{ path: 'commands', component: CommandsComponent },
{ path: 'commands-groups', component: CommandsGroupsComponent },
{ path: 'commands-task', component: CommandsTaskComponent },
{ path: 'commands-logs', component: TaskLogsComponent },
{ path: 'calendars', component: CalendarComponent },
],
},
{
path: 'auth',
component: AuthLayoutComponent,
children: [
{ path: 'login', component: LoginComponent },
],
},
{ path: '**', component: PageNotFoundComponent },
{
path: '',
component: MainLayoutComponent,
children: [
{ path: 'dashboard', component: DashboardComponent },
{ path: 'admin', component: AdminComponent },
{ path: 'users', component: UsersComponent },
{ path: 'user-groups', component: RolesComponent },
{ path: 'groups', component: GroupsComponent },
{ path: 'images', component: ImagesComponent },
{ path: 'pxe', component: PxeComponent },
{ path: 'pxe-boot-file', component: PxeBootFilesComponent },
{ path: 'ogboot-status', component: OgbootStatusComponent },
{ path: 'dhcp', component: OgdhcpComponent },
{ path: 'dhcp-subnets', component: OgDhcpSubnetsComponent },
{ path: 'commands', component: CommandsComponent },
{ path: 'commands-groups', component: CommandsGroupsComponent },
{ path: 'commands-task', component: CommandsTaskComponent },
{ path: 'commands-logs', component: TaskLogsComponent },
{ path: 'calendars', component: CalendarComponent },
{ path: 'partitionAssistant', component: PartitionAssistantComponent},
{ path: 'client/:id', component: ClientMainViewComponent },
],
},
{
path: 'auth',
component: AuthLayoutComponent,
children: [
{ path: 'login', component: LoginComponent },
],
},
{ path: '**', component: PageNotFoundComponent },
];
@NgModule({

8
ogWebconsole/src/app/app.module.ts
View File

@ -100,6 +100,9 @@ import { ClientTabViewComponent } from './components/groups/components/client-ta
import { AdvancedSearchComponent } from './components/groups/components/advanced-search/advanced-search.component';
import { TaskLogsComponent } from './components/commands/commands-task/task-logs/task-logs.component';
import { OrganizationalUnitTabViewComponent } from './components/groups/components/organizational-unit-tab-view/organizational-unit-tab-view.component';
import { PartitionAssistantComponent } from './components/commands/commands-modals/partition-assistant/partition-assistant.component';
import { ClientMainViewComponent } from './components/groups/components/client-main-view/client-main-view.component';
import {MatSliderModule} from '@angular/material/slider';
@NgModule({
declarations: [
AppComponent,
@ -156,7 +159,9 @@ import { OrganizationalUnitTabViewComponent } from './components/groups/componen
ClientTabViewComponent,
AdvancedSearchComponent,
TaskLogsComponent,
OrganizationalUnitTabViewComponent
OrganizationalUnitTabViewComponent,
PartitionAssistantComponent,
ClientMainViewComponent
],
bootstrap: [AppComponent],
imports: [BrowserModule,
@ -184,6 +189,7 @@ import { OrganizationalUnitTabViewComponent } from './components/groups/componen
NgxChartsModule,
MatDatepickerModule,
MatNativeDateModule,
MatSliderModule,
ToastrModule.forRoot(
{
timeOut: 5000,

79
ogWebconsole/src/app/components/commands/commands-modals/partition-assistant/partition-assistant.component.css 100644
View File

@ -0,0 +1,79 @@
.title {
font-size: 24px;
}
.calendar-button-row {
display: flex;
justify-content: flex-start;
margin-top: 16px;
}
.divider {
margin: 20px 0;
}
.lists-container {
padding: 16px;
}
.imagesLists-container {
flex: 1;
}
.card.unidad-card {
height: 100%;
box-sizing: border-box;
}
table {
width: 100%;
margin-top: 50px;
}
.search-container {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
padding: 0 5px;
box-sizing: border-box;
}
.search-string {
flex: 2;
padding: 5px;
}
.search-boolean {
flex: 1;
padding: 5px;
}
.header-container {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px;
}
.mat-elevation-z8 {
box-shadow: 0px 0px 0px rgba(0,0,0,0.2);
}
.paginator-container {
display: flex;
justify-content: end;
margin-bottom: 30px;
}
.mat-chip-readonly-true {
background-color: #4CAF50 !important;
color: white !important;
}
.mat-chip-readonly-false {
background-color: #F44336 !important;
color: white !important;
}

20
ogWebconsole/src/app/components/commands/commands-modals/partition-assistant/partition-assistant.component.html 100644
View File

@ -0,0 +1,20 @@
<div class="header-container">
<h2 class="title">Asistente de particionado</h2>
</div>
<mat-divider class="divider"></mat-divider>
<div class="client" *ngIf="clientInfo && clientInfo.name">
<mat-card class="result-card">
<mat-card-title>Cliente: {{clientInfo.name}}</mat-card-title>
<mat-card-subtitle>Tipo: {{clientInfo.type}}</mat-card-subtitle>
<mat-card-content>
<p><strong>IP:</strong> {{clientInfo.ip}}</p>
<p><strong>MAC:</strong> {{clientInfo.mac}}</p>
<p><strong>Número de serie:</strong> {{clientInfo.serialNumber}}</p>
<p><strong>Interfaz de red:</strong> {{clientInfo.netiface}}</p>
<p><strong>Driver de red:</strong> {{clientInfo.netDriver}}</p>
</mat-card-content>
</mat-card>
</div>

55
ogWebconsole/src/app/components/commands/commands-modals/partition-assistant/partition-assistant.component.ts 100644
View File

@ -0,0 +1,55 @@
import { HttpClient } from '@angular/common/http';
import { Component, Inject } from '@angular/core';
import { MAT_DIALOG_DATA, MatDialog } from '@angular/material/dialog';
import { ToastrService } from 'ngx-toastr';
import { DataService } from '../../main-commands/data.service';
interface ClientInfo {
name: string;
type: string;
ip: string;
mac: string;
serialNumber: string;
netiface: string;
netDriver: string;
}
@Component({
selector: 'app-partition-assistant',
templateUrl: './partition-assistant.component.html',
styleUrl: './partition-assistant.component.css'
})
export class PartitionAssistantComponent {
baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
client: string[] = [];
clientInfo: ClientInfo | undefined;
constructor(
private dataService: DataService,
public dialog: MatDialog,
private toastService: ToastrService,
private http: HttpClient,
@Inject(MAT_DIALOG_DATA) public data: { clients: string[] , command?: any }
) {
console.log('clients', data.clients[0]);
}
ngOnInit(): void {
this.getClientInfo(this.data.clients[0]);
}
getClientInfo(uuid: string): void {
this.http.get<ClientInfo>(`${this.baseUrl}/clients/${uuid}`)
.subscribe(
(response: ClientInfo) => {
this.clientInfo = response;
},
error => {
console.error('Error fetching client info:', error);
}
);
}
}

2
ogWebconsole/src/app/components/groups/components/advanced-search/advanced-search.component.html
View File

@ -99,7 +99,7 @@
<ng-container *ngIf="filteredResults && filteredResults.length > 0; else noResults">
<mat-grid-list cols="4" rowHeight="1:1">
<mat-grid-tile *ngFor="let result of filteredResults">
<mat-card class="result-card">
<mat-card class="result-card" (dblclick)="onDobleClick($event, result.uuid, result.type)">
<mat-checkbox
[checked]="isSelected(result.name)"
(change)="onCheckboxChange($event, result.name, result.uuid)">

18
ogWebconsole/src/app/components/groups/components/advanced-search/advanced-search.component.ts
View File

@ -19,6 +19,7 @@ import { SaveFiltersDialogComponent } from '../../shared/save-filters-dialog/sav
import { AcctionsModalComponent } from '../../shared/acctions-modal/acctions-modal.component';
import {MatTableDataSource} from "@angular/material/table";
import {DatePipe} from "@angular/common";
import { Router } from '@angular/router';
@Component({
@ -62,7 +63,8 @@ export class AdvancedSearchComponent {
public dialog: MatDialog,
private toastService: ToastrService,
private _bottomSheet: MatBottomSheet,
private http: HttpClient
private http: HttpClient,
private router: Router
) {}
ngOnInit(): void {
@ -406,9 +408,21 @@ export class AdvancedSearchComponent {
}
sendActions() {
const dialogRef = this.dialog.open(AcctionsModalComponent, { data: { selectedElements: this.selectedElements }, width: '700px'});
}
onDobleClick(event: MouseEvent, data: any, type: string): void {
console.log('Doble click en:', data);
if (type === 'client') {
this.router.navigate(['client', data]);
}
else {
console.error('ADD VIEW FOR OU');
}
}
}

0
ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.css 100644
View File

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

@ -0,0 +1 @@
<p>client-main-view works!</p>

23
ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.spec.ts 100644
View File

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

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

@ -0,0 +1,10 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-client-main-view',
templateUrl: './client-main-view.component.html',
styleUrl: './client-main-view.component.css'
})
export class ClientMainViewComponent {
}

33
ogWebconsole/src/app/components/groups/shared/acctions-modal/acctions-modal.component.ts
View File

@ -5,6 +5,8 @@ import { ToastrService } from 'ngx-toastr';
import { CreatePxeBootFileComponent } from '../../../ogboot/pxe-boot-files/create-pxeBootFile/create-pxe-boot-file/create-pxe-boot-file.component';
import { HttpClient } from '@angular/common/http';
import { CommandDetailComponent } from '../../../commands/main-commands/detail-command/command-detail.component';
import { RouterLink } from '@angular/router';
import { PartitionAssistantComponent } from '../../../commands/commands-modals/partition-assistant/partition-assistant.component';
@Component({
selector: 'app-acctions-modal',
templateUrl: './acctions-modal.component.html',
@ -53,22 +55,33 @@ export class AcctionsModalComponent {
}
onCommandClick(command: any): void {
const payload = {
clients: this.selectedElements.map((uuid: any) => `/clients/${uuid}`)
};
const apiUrl = `${this.baseUrl}/commands/${command.uuid}/execute`;
console.log(this.selectedElements.length)
if (command.uuid === '01924d28-5880-734f-9187-f6b0f6c0c8d7' && this.selectedElements.length == 1) {
const dialogRef = this.dialog.open(PartitionAssistantComponent, { data: { clients: this.selectedElements }, width: '150%', height: '100%' });
}
if (command.uuid === '01924d28-5880-734f-9187-f6b0f6c0c8d7' && this.selectedElements.length != 1) {
this.toastService.error('Please select only one client to execute this command');
}
else{
this.http.post(apiUrl, payload).subscribe({
next: () => {
console.log('Command executed successfully');
this.loadCommands();
this.toastService.success('Command executed successfully');
},
error: (error) => {
console.error('Error executing command:', error);
}
});
}
this.http.post(apiUrl, payload).subscribe({
next: () => {
console.log('Command executed successfully');
this.loadCommands();
this.toastService.success('Command executed successfully');
},
error: (error) => {
console.error('Error executing command:', error);
}
});
}
chunkArray(arr: any[], chunkSize: number): any[] {

4
ogWebconsole/src/app/components/ogboot/pxe-boot-files/create-pxeBootFile/create-pxe-boot-file/create-pxe-boot-file.component.ts
View File

@ -27,8 +27,6 @@ export class CreatePxeBootFileComponent implements OnInit {
this.selectedElements = this.data.clients;
this.clientes = this.selectedElements.map((client: { uuid: any }) => `/clients/${client.uuid}`);
this.loadPxeTemplates();
// Configura el modo de edición si se proporciona bootFile
if (this.data.bootFile) {
this.isEditMode = true;
this.selectedPxeTemplate = this.data.bootFile.template.uuid;
@ -60,7 +58,6 @@ export class CreatePxeBootFileComponent implements OnInit {
};
if (this.isEditMode && this.data.bootFile) {
// Edit mode: Actualizar boot file existente
this.http.put(`${this.baseUrl}/pxe-boot-files/${this.data.bootFile.uuid}`, payload)
.subscribe({
next: response => {
@ -72,7 +69,6 @@ export class CreatePxeBootFileComponent implements OnInit {
}
});
} else {
// Create mode: Crear nuevo boot file
this.http.post(`${this.baseUrl}/pxe-boot-files`, payload)
.subscribe({
next: response => {