diff --git a/ogWebconsole/src/app/app-routing.module.ts b/ogWebconsole/src/app/app-routing.module.ts index ae46aaa..97dbbef 100644 --- a/ogWebconsole/src/app/app-routing.module.ts +++ b/ogWebconsole/src/app/app-routing.module.ts @@ -15,8 +15,14 @@ import { PxeBootFilesComponent } from './components/ogboot/pxe-boot-files/pxe-bo import {OgbootStatusComponent} from "./components/ogboot/ogboot-status/ogboot-status.component"; import { OgdhcpComponent } from './components/ogdhcp/ogdhcp.component'; import { OgDhcpSubnetsComponent } from './components/ogdhcp/og-dhcp-subnets/og-dhcp-subnets.component'; +<<<<<<< HEAD import { CommandsComponent } from './components/commands/commands.component'; import { CalendarComponent } from "./components/calendar/calendar.component"; +======= +import { CommandsComponent } from './components/commands/main-commands/commands.component'; +import { CommandsGroupsComponent } from './components/commands/commands-groups/commands-groups.component'; +import { CommandsTaskComponent } from './components/commands/commands-task/commands-task.component'; +>>>>>>> 30cd43ff0fcccafbf6d2b7534dd31ba0b3c2c257 const routes: Routes = [ { path: '', redirectTo: 'auth/login', pathMatch: 'full' }, { diff --git a/ogWebconsole/src/app/app.module.ts b/ogWebconsole/src/app/app.module.ts index ac45ef0..1c4b813 100644 --- a/ogWebconsole/src/app/app.module.ts +++ b/ogWebconsole/src/app/app.module.ts @@ -83,15 +83,16 @@ import { OgdhcpComponent } from './components/ogdhcp/ogdhcp.component'; import { OgDhcpSubnetsComponent } from './components/ogdhcp/og-dhcp-subnets/og-dhcp-subnets.component'; import { CreateSubnetComponent } from './components/ogdhcp/og-dhcp-subnets/create-subnet/create-subnet.component'; import { AddClientsToSubnetComponent } from './components/ogdhcp/og-dhcp-subnets/add-clients-to-subnet/add-clients-to-subnet.component'; -import { CommandsComponent } from './components/commands/commands.component'; -import { CommandDetailComponent } from './components/commands/command-detail/command-detail/command-detail.component'; -import { CreateCommandComponent } from './components/commands/create-command/create-command.component'; +import { CommandsComponent } from './components/commands/main-commands/commands.component'; +import { CommandDetailComponent } from './components/commands/main-commands/detail-command/command-detail.component'; +import { CreateCommandComponent } from './components/commands/main-commands/create-command/create-command.component'; import { MatDatepickerModule } from '@angular/material/datepicker'; import { MatNativeDateModule } from '@angular/material/core'; import { CalendarComponent } from './components/calendar/calendar.component'; import { CreateCalendarComponent } from './components/calendar/create-calendar/create-calendar.component'; import {MatRadioButton, MatRadioGroup} from "@angular/material/radio"; import { CreateCalendarRuleComponent } from './components/calendar/create-calendar-rule/create-calendar-rule.component'; + @NgModule({ declarations: [ AppComponent, diff --git a/ogWebconsole/src/app/components/commands/commands-groups/commands-groups.component.css b/ogWebconsole/src/app/components/commands/commands-groups/commands-groups.component.css new file mode 100644 index 0000000..e69de29 diff --git a/ogWebconsole/src/app/components/commands/commands-groups/commands-groups.component.html b/ogWebconsole/src/app/components/commands/commands-groups/commands-groups.component.html new file mode 100644 index 0000000..aba3a48 --- /dev/null +++ b/ogWebconsole/src/app/components/commands/commands-groups/commands-groups.component.html @@ -0,0 +1 @@ +

commands-groups works!

diff --git a/ogWebconsole/src/app/components/commands/commands-groups/commands-groups.component.spec.ts b/ogWebconsole/src/app/components/commands/commands-groups/commands-groups.component.spec.ts new file mode 100644 index 0000000..f9a69a0 --- /dev/null +++ b/ogWebconsole/src/app/components/commands/commands-groups/commands-groups.component.spec.ts @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CommandsGroupsComponent } from './commands-groups.component'; + +describe('CommandsGroupsComponent', () => { + let component: CommandsGroupsComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [CommandsGroupsComponent] + }) + .compileComponents(); + + fixture = TestBed.createComponent(CommandsGroupsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/ogWebconsole/src/app/components/commands/commands-groups/commands-groups.component.ts b/ogWebconsole/src/app/components/commands/commands-groups/commands-groups.component.ts new file mode 100644 index 0000000..8729d11 --- /dev/null +++ b/ogWebconsole/src/app/components/commands/commands-groups/commands-groups.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'app-commands-groups', + templateUrl: './commands-groups.component.html', + styleUrl: './commands-groups.component.css' +}) +export class CommandsGroupsComponent { + +} diff --git a/ogWebconsole/src/app/components/commands/commands-task/commands-task.component.css b/ogWebconsole/src/app/components/commands/commands-task/commands-task.component.css new file mode 100644 index 0000000..e69de29 diff --git a/ogWebconsole/src/app/components/commands/commands-task/commands-task.component.html b/ogWebconsole/src/app/components/commands/commands-task/commands-task.component.html new file mode 100644 index 0000000..385462e --- /dev/null +++ b/ogWebconsole/src/app/components/commands/commands-task/commands-task.component.html @@ -0,0 +1 @@ +

commands-task works!

diff --git a/ogWebconsole/src/app/components/commands/commands-task/commands-task.component.spec.ts b/ogWebconsole/src/app/components/commands/commands-task/commands-task.component.spec.ts new file mode 100644 index 0000000..d176107 --- /dev/null +++ b/ogWebconsole/src/app/components/commands/commands-task/commands-task.component.spec.ts @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CommandsTaskComponent } from './commands-task.component'; + +describe('CommandsTaskComponent', () => { + let component: CommandsTaskComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [CommandsTaskComponent] + }) + .compileComponents(); + + fixture = TestBed.createComponent(CommandsTaskComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/ogWebconsole/src/app/components/commands/commands-task/commands-task.component.ts b/ogWebconsole/src/app/components/commands/commands-task/commands-task.component.ts new file mode 100644 index 0000000..15cf5ff --- /dev/null +++ b/ogWebconsole/src/app/components/commands/commands-task/commands-task.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'app-commands-task', + templateUrl: './commands-task.component.html', + styleUrl: './commands-task.component.css' +}) +export class CommandsTaskComponent { + +} diff --git a/ogWebconsole/src/app/components/commands/commands.component.html b/ogWebconsole/src/app/components/commands/commands.component.html deleted file mode 100644 index 8bc9d38..0000000 --- a/ogWebconsole/src/app/components/commands/commands.component.html +++ /dev/null @@ -1,25 +0,0 @@ -
-

Administrar comandos

-
- -
-
- - - - - - - - - - - - - - - - - - -
Nombre {{ command.name }} Creado por {{ command.createdBy }} Fecha de creación {{ command.createdAt | date:'short' }}
diff --git a/ogWebconsole/src/app/components/commands/commands.component.ts b/ogWebconsole/src/app/components/commands/commands.component.ts deleted file mode 100644 index cff663e..0000000 --- a/ogWebconsole/src/app/components/commands/commands.component.ts +++ /dev/null @@ -1,56 +0,0 @@ -import { Component, OnInit } from '@angular/core'; -import { HttpClient } from '@angular/common/http'; -import { MatDialog } from '@angular/material/dialog'; -import { CommandDetailComponent } from './command-detail/command-detail/command-detail.component'; -import { CreateCommandComponent } from './create-command/create-command.component'; - -@Component({ - selector: 'app-commands', - templateUrl: './commands.component.html', - styleUrls: ['./commands.component.css'] -}) -export class CommandsComponent implements OnInit { - commands: any[] = []; - displayedColumns: string[] = ['name', 'createdBy', 'createdAt']; - private apiUrl = 'http://127.0.0.1:8001/commands?page=1&itemsPerPage=30'; - - constructor(private http: HttpClient, private dialog: MatDialog) { } - - ngOnInit(): void { - this.loadCommands(); - } - - loadCommands(): void { - this.http.get(this.apiUrl).subscribe( - (data) => { - this.commands = data['hydra:member']; - }, - (error) => { - console.error('Error fetching commands', error); - } - ); - } - - openCommandDetailModal(command: any): void { - const dialogRef = this.dialog.open(CommandDetailComponent, { - width: '800px', - data: command - }); - - dialogRef.afterClosed().subscribe(result => { - this.loadCommands(); - }); - } - - openCreateCommandModal(): void { - const dialogRef = this.dialog.open(CreateCommandComponent, { - width: '600px' - }); - - dialogRef.afterClosed().subscribe(result => { - this.loadCommands(); - }); - } - - -} diff --git a/ogWebconsole/src/app/components/commands/commands.component.css b/ogWebconsole/src/app/components/commands/main-commands/commands.component.css similarity index 87% rename from ogWebconsole/src/app/components/commands/commands.component.css rename to ogWebconsole/src/app/components/commands/main-commands/commands.component.css index cb42382..c98fd38 100644 --- a/ogWebconsole/src/app/components/commands/commands.component.css +++ b/ogWebconsole/src/app/components/commands/main-commands/commands.component.css @@ -39,6 +39,9 @@ pre { margin-top: 20px; } tr:hover { - background-color: rgba(0, 0, 0, 0.1); - cursor: pointer; + background-color: rgba(219, 219, 219, 0.219); +} + +.detailBtn{ + cursor: pointer; } \ No newline at end of file diff --git a/ogWebconsole/src/app/components/commands/main-commands/commands.component.html b/ogWebconsole/src/app/components/commands/main-commands/commands.component.html new file mode 100644 index 0000000..f974425 --- /dev/null +++ b/ogWebconsole/src/app/components/commands/main-commands/commands.component.html @@ -0,0 +1,53 @@ +
+

Administrar comandos

+
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Nombre {{ command.name }} Creado por {{ command.createdBy }} Fecha de creación {{ command.createdAt | date:'short' }} Acciones + + + + + + +
diff --git a/ogWebconsole/src/app/components/commands/commands.component.spec.ts b/ogWebconsole/src/app/components/commands/main-commands/commands.component.spec.ts similarity index 100% rename from ogWebconsole/src/app/components/commands/commands.component.spec.ts rename to ogWebconsole/src/app/components/commands/main-commands/commands.component.spec.ts diff --git a/ogWebconsole/src/app/components/commands/main-commands/commands.component.ts b/ogWebconsole/src/app/components/commands/main-commands/commands.component.ts new file mode 100644 index 0000000..81460c5 --- /dev/null +++ b/ogWebconsole/src/app/components/commands/main-commands/commands.component.ts @@ -0,0 +1,99 @@ +import { Component, OnInit } from '@angular/core'; +import { HttpClient } from '@angular/common/http'; +import { MatDialog } from '@angular/material/dialog'; +import { CommandDetailComponent } from './detail-command/command-detail.component'; +import { CreateCommandComponent } from './create-command/create-command.component'; +import { DeleteModalComponent } from '../../../shared/delete_modal/delete-modal/delete-modal.component'; +import { ToastrService } from 'ngx-toastr'; + +@Component({ + selector: 'app-commands', + templateUrl: './commands.component.html', + styleUrls: ['./commands.component.css'] +}) +export class CommandsComponent implements OnInit { + baseUrl: string = import.meta.env.NG_APP_BASE_API_URL; + commands: any[] = []; + displayedColumns: string[] = ['name', 'createdBy', 'createdAt', 'actions']; + private apiUrl = 'http://127.0.0.1:8001/commands?page=1&itemsPerPage=30'; + + constructor(private http: HttpClient, private dialog: MatDialog, private toastService: ToastrService) { } + + ngOnInit(): void { + this.loadCommands(); + } + + loadCommands(): void { + this.http.get(this.apiUrl).subscribe( + (data) => { + this.commands = data['hydra:member']; + }, + (error) => { + console.error('Error fetching commands', error); + } + ); + } + + openCreateCommandModal(): void { + const dialogRef = this.dialog.open(CreateCommandComponent, { + width: '600px' + }); + + dialogRef.afterClosed().subscribe(result => { + this.loadCommands(); + }); + } + + editCommand(command: any): void { + const dialogRef = this.dialog.open(CreateCommandComponent, { + width: '600px', + data: { command: command } + }); + + dialogRef.afterClosed().subscribe(result => { + if (result) { + console.log('Comando editado:', result); + this.loadCommands(); + } + }); + } + + viewDetails(command: any): void { + const dialogRef = this.dialog.open(CommandDetailComponent, { + width: '800px', + data: command + }); + + dialogRef.afterClosed().subscribe(result => { + this.loadCommands(); + }); + } + + deleteCommand(command: any): void { + const dialogRef = this.dialog.open(DeleteModalComponent, + { + width: '300px', + data: { name: command.name } + }); + + dialogRef.afterClosed().subscribe(result => { + if (result) { + const apiUrl = `${this.baseUrl}/commands/${command.uuid}`; + + this.http.delete(apiUrl).subscribe({ + next: () => { + console.log('Role deleted successfully'); + this.loadCommands(); + this.toastService.success('Role deleted successfully'); + }, + error: (error) => { + console.error('Error deleting role:', error); + } + }); + } else { + console.log('Role deletion cancelled'); + } + }); + } + +} diff --git a/ogWebconsole/src/app/components/commands/create-command/create-command.component.css b/ogWebconsole/src/app/components/commands/main-commands/create-command/create-command.component.css similarity index 100% rename from ogWebconsole/src/app/components/commands/create-command/create-command.component.css rename to ogWebconsole/src/app/components/commands/main-commands/create-command/create-command.component.css diff --git a/ogWebconsole/src/app/components/commands/create-command/create-command.component.html b/ogWebconsole/src/app/components/commands/main-commands/create-command/create-command.component.html similarity index 100% rename from ogWebconsole/src/app/components/commands/create-command/create-command.component.html rename to ogWebconsole/src/app/components/commands/main-commands/create-command/create-command.component.html diff --git a/ogWebconsole/src/app/components/commands/create-command/create-command.component.spec.ts b/ogWebconsole/src/app/components/commands/main-commands/create-command/create-command.component.spec.ts similarity index 100% rename from ogWebconsole/src/app/components/commands/create-command/create-command.component.spec.ts rename to ogWebconsole/src/app/components/commands/main-commands/create-command/create-command.component.spec.ts diff --git a/ogWebconsole/src/app/components/commands/create-command/create-command.component.ts b/ogWebconsole/src/app/components/commands/main-commands/create-command/create-command.component.ts similarity index 100% rename from ogWebconsole/src/app/components/commands/create-command/create-command.component.ts rename to ogWebconsole/src/app/components/commands/main-commands/create-command/create-command.component.ts diff --git a/ogWebconsole/src/app/components/commands/command-detail/command-detail/command-detail.component.css b/ogWebconsole/src/app/components/commands/main-commands/detail-command/command-detail.component.css similarity index 87% rename from ogWebconsole/src/app/components/commands/command-detail/command-detail/command-detail.component.css rename to ogWebconsole/src/app/components/commands/main-commands/detail-command/command-detail.component.css index 48e4f08..08d7eb3 100644 --- a/ogWebconsole/src/app/components/commands/command-detail/command-detail/command-detail.component.css +++ b/ogWebconsole/src/app/components/commands/main-commands/detail-command/command-detail.component.css @@ -4,13 +4,16 @@ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); border-radius: 10px; width: calc(100% - 40px); + max-width: 800px; height: calc(100% - 40px); - margin: 20px; + max-height: 90vh; + margin: 20px auto; display: flex; flex-direction: column; justify-content: space-between; font-family: 'Roboto', sans-serif; box-sizing: border-box; + overflow: hidden; } .modal-title { @@ -25,6 +28,7 @@ flex-grow: 1; overflow-y: auto; padding: 10px; + max-height: calc(100vh - 200px); } .modal-content p { @@ -39,8 +43,11 @@ color: #ffffff; padding: 15px; border-radius: 8px; - font-size: 0.9em; + font-size: 1.2em; overflow: auto; + max-height: 300px; + white-space: pre-wrap; + word-wrap: break-word; } .button-row { diff --git a/ogWebconsole/src/app/components/commands/command-detail/command-detail/command-detail.component.html b/ogWebconsole/src/app/components/commands/main-commands/detail-command/command-detail.component.html similarity index 100% rename from ogWebconsole/src/app/components/commands/command-detail/command-detail/command-detail.component.html rename to ogWebconsole/src/app/components/commands/main-commands/detail-command/command-detail.component.html diff --git a/ogWebconsole/src/app/components/commands/command-detail/command-detail/command-detail.component.spec.ts b/ogWebconsole/src/app/components/commands/main-commands/detail-command/command-detail.component.spec.ts similarity index 100% rename from ogWebconsole/src/app/components/commands/command-detail/command-detail/command-detail.component.spec.ts rename to ogWebconsole/src/app/components/commands/main-commands/detail-command/command-detail.component.spec.ts diff --git a/ogWebconsole/src/app/components/commands/command-detail/command-detail/command-detail.component.ts b/ogWebconsole/src/app/components/commands/main-commands/detail-command/command-detail.component.ts similarity index 75% rename from ogWebconsole/src/app/components/commands/command-detail/command-detail/command-detail.component.ts rename to ogWebconsole/src/app/components/commands/main-commands/detail-command/command-detail.component.ts index 93de974..d2cc7d9 100644 --- a/ogWebconsole/src/app/components/commands/command-detail/command-detail/command-detail.component.ts +++ b/ogWebconsole/src/app/components/commands/main-commands/detail-command/command-detail.component.ts @@ -1,8 +1,9 @@ import { Component, Inject, OnInit } from '@angular/core'; import { FormBuilder, FormGroup, Validators } from '@angular/forms'; import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from '@angular/material/dialog'; -import { CreateCommandComponent } from '../../create-command/create-command.component'; +import { CreateCommandComponent } from '../create-command/create-command.component'; import { HttpClient } from '@angular/common/http'; +import { ToastrService } from 'ngx-toastr'; @Component({ selector: 'app-command-detail', @@ -10,6 +11,7 @@ import { HttpClient } from '@angular/common/http'; styleUrls: ['./command-detail.component.css'] }) export class CommandDetailComponent implements OnInit { + baseUrl: string = import.meta.env.NG_APP_BASE_API_URL; form!: FormGroup; clients: any[] = []; showClientSelect = false; @@ -21,8 +23,9 @@ export class CommandDetailComponent implements OnInit { private http: HttpClient, public dialogRef: MatDialogRef, private dialog: MatDialog, + private toastService: ToastrService, @Inject(MAT_DIALOG_DATA) public data: any - ) {} + ) { } ngOnInit(): void { this.form = this.fb.group({ @@ -42,7 +45,24 @@ export class CommandDetailComponent implements OnInit { this.showClientSelect = true; } else { if (this.form.get('selectedClients')?.value.length > 0) { - console.log('Ejecutar comando con los siguientes clientes:', this.form.value.selectedClients); + + const payload = { + clients: this.form.value.selectedClients.map((uuid: any) => `/clients/${uuid}`) + }; + + const apiUrl = `${this.baseUrl}/commands/${this.data.command.uuid}/execute`; + + this.http.post(apiUrl, payload).subscribe({ + next: () => { + console.log('Command executed successfully'); + this.dialogRef.close(); + this.toastService.success('Command executed successfully'); + }, + error: (error) => { + console.error('Error executing command:', error); + } + }); + this.dialogRef.close(); } else { this.form.get('selectedClients')?.markAsTouched(); diff --git a/ogWebconsole/src/app/components/groups/acctions-modal/acctions-modal.component.ts b/ogWebconsole/src/app/components/groups/acctions-modal/acctions-modal.component.ts index 5b5e30f..8474ff9 100644 --- a/ogWebconsole/src/app/components/groups/acctions-modal/acctions-modal.component.ts +++ b/ogWebconsole/src/app/components/groups/acctions-modal/acctions-modal.component.ts @@ -4,13 +4,14 @@ import { MatDialogRef, MAT_DIALOG_DATA, MatDialog } from '@angular/material/dial 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/command-detail/command-detail/command-detail.component'; +import { CommandDetailComponent } from '../../commands/main-commands/detail-command/command-detail.component'; @Component({ selector: 'app-acctions-modal', templateUrl: './acctions-modal.component.html', styleUrls: ['./acctions-modal.component.css'] }) export class AcctionsModalComponent { + baseUrl: string = import.meta.env.NG_APP_BASE_API_URL; selectedElements: any; commands: any[] = []; displayedColumns: string[] = ['name', 'createdBy', 'createdAt']; @@ -52,19 +53,22 @@ export class AcctionsModalComponent { } onCommandClick(command: any): void { - const dialogRef = this.dialog.open(CommandDetailComponent, { - width: '600px', - data: { - command: command, - importedClients: this.selectedElements - } - }); +const payload = { + clients: this.selectedElements.map((uuid: any) => `/clients/${uuid}`) +}; - dialogRef.afterClosed().subscribe(result => { - if (result) { - console.log('Modal cerrado. Resultado:', result); - } - }); +const apiUrl = `${this.baseUrl}/commands/${command.uuid}/execute`; + +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[] { diff --git a/ogWebconsole/src/app/components/groups/groups.component.ts b/ogWebconsole/src/app/components/groups/groups.component.ts index d5c01c3..b8be0e8 100644 --- a/ogWebconsole/src/app/components/groups/groups.component.ts +++ b/ogWebconsole/src/app/components/groups/groups.component.ts @@ -378,7 +378,7 @@ export class GroupsComponent implements OnInit { onCheckboxChange(event: any, name: string, uuid: string) { if (event.checked) { - this.selectedElements.push({ name, uuid }); + this.selectedElements.push(uuid); } else { const index = this.selectedElements.indexOf(name); if (index > -1) { @@ -387,14 +387,13 @@ export class GroupsComponent implements OnInit { } this.isAllSelected = this.selectedElements.length === this.filteredResults.length; - console.log(this.selectedElements); } toggleSelectAll() { this.isAllSelected = !this.isAllSelected; if (this.isAllSelected) { - this.selectedElements = this.filteredResults.map(result => result.name); + this.selectedElements = this.filteredResults.map(result => result.uuid); } else { this.selectedElements = []; } diff --git a/ogWebconsole/src/app/layout/main-layout/main-layout.component.css b/ogWebconsole/src/app/layout/main-layout/main-layout.component.css index 60e093c..79922ec 100644 --- a/ogWebconsole/src/app/layout/main-layout/main-layout.component.css +++ b/ogWebconsole/src/app/layout/main-layout/main-layout.component.css @@ -3,12 +3,16 @@ } .container { - width: auto; - height: calc(100vh - 60px); + width: 100vw; + height: calc(100vh - 10vh); +} + +.sidebar { + width: 250px; } .content { margin: 10px; padding: 10px; -} - + box-sizing: border-box; +} \ No newline at end of file diff --git a/ogWebconsole/src/app/layout/main-layout/main-layout.component.html b/ogWebconsole/src/app/layout/main-layout/main-layout.component.html index d9d7a08..7a97670 100644 --- a/ogWebconsole/src/app/layout/main-layout/main-layout.component.html +++ b/ogWebconsole/src/app/layout/main-layout/main-layout.component.html @@ -1,11 +1,11 @@ - + - + diff --git a/ogWebconsole/src/app/layout/sidebar/sidebar.component.css b/ogWebconsole/src/app/layout/sidebar/sidebar.component.css index 23b5659..8267199 100644 --- a/ogWebconsole/src/app/layout/sidebar/sidebar.component.css +++ b/ogWebconsole/src/app/layout/sidebar/sidebar.component.css @@ -1,5 +1,7 @@ mat-nav-list { - width: 250px; + width: auto; + margin-right: 3px; + overflow-x: hidden; } mat-list-item { @@ -8,22 +10,22 @@ mat-list-item { align-items: center; } -.entry{ +.entry { display: flex; align-items: center; gap: 1rem; - padding:0.75rem; + padding: 0.75rem; } mat-icon { margin-right: 8px; } -.user-logged{ +.user-logged { align-items: center; height: 70px; gap: 2rem; - padding:1rem; + padding: 1rem; font-size: medium; } @@ -39,7 +41,7 @@ mat-icon { @media (max-width: 680px) { mat-nav-list { - width: 0px; + width: auto; } } diff --git a/ogWebconsole/src/app/layout/sidebar/sidebar.component.html b/ogWebconsole/src/app/layout/sidebar/sidebar.component.html index 534f632..53e17ab 100644 --- a/ogWebconsole/src/app/layout/sidebar/sidebar.component.html +++ b/ogWebconsole/src/app/layout/sidebar/sidebar.component.html @@ -15,12 +15,36 @@ - - chevron_right - Comandos + + playlist_play + Acciones + + + + + chevron_right + Comandos + + + + + splitscreen_add + Grupo de comandos + + + + + task + Tareas + + + + + + desktop_windows diff --git a/ogWebconsole/src/app/layout/sidebar/sidebar.component.ts b/ogWebconsole/src/app/layout/sidebar/sidebar.component.ts index 51dc05a..963703f 100644 --- a/ogWebconsole/src/app/layout/sidebar/sidebar.component.ts +++ b/ogWebconsole/src/app/layout/sidebar/sidebar.component.ts @@ -13,6 +13,7 @@ export class SidebarComponent { decodedToken: any = ""; showOgBootSub: boolean = false; showOgDhcpSub: boolean = false; + showCommandSub: boolean = false; toggleOgBootSub() { this.showOgBootSub = !this.showOgBootSub; @@ -20,6 +21,9 @@ export class SidebarComponent { toggleOgDhcpSub() { this.showOgDhcpSub = !this.showOgDhcpSub; } + toggleCommandSub() { + this.showCommandSub = !this.showCommandSub; + } constructor(public dialog: MatDialog) {}