diff --git a/ogWebconsole/src/app/app.module.ts b/ogWebconsole/src/app/app.module.ts
index 7f82a24..f75b34a 100644
--- a/ogWebconsole/src/app/app.module.ts
+++ b/ogWebconsole/src/app/app.module.ts
@@ -84,7 +84,7 @@ import { OgDhcpSubnetsComponent } from './components/ogdhcp/og-dhcp-subnets/og-d
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 { CommandDetailComponent } from './components/commands/detail-command/command-detail.component';
import { CreateCommandComponent } from './components/commands/create-command/create-command.component';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatNativeDateModule } from '@angular/material/core';
diff --git a/ogWebconsole/src/app/components/commands/commands.component.css b/ogWebconsole/src/app/components/commands/commands.component.css
index cb42382..c98fd38 100644
--- a/ogWebconsole/src/app/components/commands/commands.component.css
+++ b/ogWebconsole/src/app/components/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/commands.component.html b/ogWebconsole/src/app/components/commands/commands.component.html
index 8bc9d38..f46b3d2 100644
--- a/ogWebconsole/src/app/components/commands/commands.component.html
+++ b/ogWebconsole/src/app/components/commands/commands.component.html
@@ -6,20 +6,52 @@
+
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.ts b/ogWebconsole/src/app/components/commands/commands.component.ts
index cff663e..e7733d2 100644
--- a/ogWebconsole/src/app/components/commands/commands.component.ts
+++ b/ogWebconsole/src/app/components/commands/commands.component.ts
@@ -1,8 +1,10 @@
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 { 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',
@@ -10,11 +12,12 @@ import { CreateCommandComponent } from './create-command/create-command.componen
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'];
+ 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) { }
+ constructor(private http: HttpClient, private dialog: MatDialog, private toastService: ToastrService) { }
ngOnInit(): void {
this.loadCommands();
@@ -31,17 +34,6 @@ export class CommandsComponent implements OnInit {
);
}
- 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'
@@ -52,5 +44,61 @@ export class CommandsComponent implements OnInit {
});
}
+ executeCommand(command: any): void {
+ console.log('Ejecutar comando:', command);
+ }
+
+ 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 {
+ console.log('Eliminar comando:', command);
+ 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/command-detail/command-detail/command-detail.component.css b/ogWebconsole/src/app/components/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/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/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/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/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/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/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/detail-command/command-detail.component.ts
similarity index 96%
rename from ogWebconsole/src/app/components/commands/command-detail/command-detail/command-detail.component.ts
rename to ogWebconsole/src/app/components/commands/detail-command/command-detail.component.ts
index 93de974..f55ee4c 100644
--- a/ogWebconsole/src/app/components/commands/command-detail/command-detail/command-detail.component.ts
+++ b/ogWebconsole/src/app/components/commands/detail-command/command-detail.component.ts
@@ -1,7 +1,7 @@
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';
@Component({
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..fb1b7cf 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,7 +4,7 @@ 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/detail-command/command-detail.component';
@Component({
selector: 'app-acctions-modal',
templateUrl: './acctions-modal.component.html',