refs #798 Commands task search bar

ogWebconsole/src/app/components/commands/commands-groups/commands-groups.component.spec.ts

@@ -1,63 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { HttpClientModule } from '@angular/common/http';
-import { MatDialogModule, MatDialogRef } from '@angular/material/dialog';
-import { MatPaginatorModule } from '@angular/material/paginator';
-import { MatDividerModule } from '@angular/material/divider';
-import { MatButtonModule } from '@angular/material/button';
-import { MatIconModule } from '@angular/material/icon';
-import { MatFormFieldModule } from '@angular/material/form-field';
-import { MatInputModule } from '@angular/material/input';
-import { MatTableModule } from '@angular/material/table';
-import { MatMenuModule } from '@angular/material/menu';
-import { FormsModule } from '@angular/forms'; 
-import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; 
-import { ToastrService } from 'ngx-toastr';
-import { CommandsGroupsComponent } from './commands-groups.component';
-
-class MockToastrService {
-  success() {}
-}
-
-class MockMatDialogRef {
-  close() {}
-}
-
-describe('CommandsGroupsComponent', () => {
-  let component: CommandsGroupsComponent;
-  let fixture: ComponentFixture<CommandsGroupsComponent>;
-  let toastService: ToastrService;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [CommandsGroupsComponent],
-      imports: [
-        HttpClientModule,
-        MatDialogModule,
-        MatPaginatorModule,
-        MatDividerModule,
-        MatButtonModule,
-        MatIconModule,
-        MatFormFieldModule,
-        MatInputModule,
-        MatTableModule,
-        MatMenuModule,
-        FormsModule,
-        BrowserAnimationsModule, 
-      ],
-      providers: [
-        { provide: ToastrService, useClass: MockToastrService },
-        { provide: MatDialogRef, useClass: MockMatDialogRef }
-      ]
-    }).compileComponents();
-
-    fixture = TestBed.createComponent(CommandsGroupsComponent);
-    component = fixture.componentInstance;
-    toastService = TestBed.inject(ToastrService);
-    fixture.detectChanges();
-  });
-
-  it('should create the component', () => {
-    expect(component).toBeTruthy();
-  });
-
-});

ogWebconsole/src/app/components/commands/commands-task/commands-task.component.css

@@ -1,3 +1,74 @@
 .task-button-row{
     margin-bottom: 10px;
+}
+
+.commands-list {
+    margin-bottom: 20px;
+  }
+  
+  .command-item {
+    cursor: pointer;
+    margin-bottom: 10px;
+    padding: 10px;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    background-color: #f9f9f9;
+  }
+  
+  .command-item:hover {
+    background-color: #e9e9e9;
+  }
+  
+  .command-details {
+    padding: 20px;
+    border: 1px solid #ddd;
+    background-color: #f4f4f4;
+    border-radius: 4px;
+  }
+  
+  .script-display {
+    margin-top: 20px;
+    background-color: #000;
+    color: #fff;
+    padding: 10px;
+    border-radius: 4px;
+  }
+  
+  pre {
+    margin: 0;
+    font-family: 'Courier New', Courier, monospace;
+  }
+  
+  .mat-elevation-z8{
+    margin-top: 20px;
+  }
+  tr:hover {
+    background-color: rgba(219, 219, 219, 0.219); 
+  }
+  
+  .detailBtn{
+    cursor: pointer;
+  }
+  
+  .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;
+  }
+
+  .command-groups-button-row{
+    margin-bottom: 10px;
 }

ogWebconsole/src/app/components/commands/commands-task/commands-task.component.html

@@ -5,6 +5,15 @@
   </div>
 </div>
 
+<div class="search-container">
+  <mat-form-field appearance="fill" class="search-string">
+    <mat-label>Buscar tarea</mat-label>
+    <input matInput placeholder="Búsqueda" [(ngModel)]="filters['name']" (keyup.enter)="search()" />
+    <mat-icon matSuffix>search</mat-icon>
+    <mat-hint>Pulsar 'enter' para buscar</mat-hint>
+  </mat-form-field>
+</div>
+
 <table mat-table [dataSource]="tasks" class="mat-elevation-z8">
   <ng-container matColumnDef="notes">
     <th mat-header-cell *matHeaderCellDef> Info</th>

ogWebconsole/src/app/components/commands/commands-task/commands-task.component.ts

@@ -28,6 +28,11 @@ export class CommandsTaskComponent implements OnInit {
     this.loadTasks();
   }
 
+  search(): void {
+    this.page = 1;
+    this.loadTasks();
+  }
+
   loadTasks(): void {
     this.http.get<any>(`${this.apiUrl}?page=${this.page}&itemsPerPage=${this.itemsPerPage}`, { params: this.filters }).subscribe(
       (data) => {

ogWebconsole/src/app/components/groups/shared/organizational-units/edit-organizational-unit/edit-organizational-unit.component.html

@@ -47,6 +47,7 @@
         </mat-form-field>
 
         <!-- Campo nuevo para seleccionar el calendario asociado -->
+        <p>Calendario asociado actual {{currentCalendar.name}}</p>
         <mat-form-field appearance="fill">
           <mat-label>Calendario Asociado</mat-label>
           <mat-select formControlName="calendarSelect" (selectionChange)="onCalendarChange($event)">

ogWebconsole/src/app/components/groups/shared/organizational-units/edit-organizational-unit/edit-organizational-unit.component.ts

@@ -19,9 +19,10 @@ export class EditOrganizationalUnitComponent implements OnInit {
   networkSettingsFormGroup: FormGroup;
   classroomInfoFormGroup: FormGroup;
   types: string[] = ['organizational-unit', 'classrooms-group', 'classroom', 'clients-group'];
-  parentUnits: any[] = []; // Array to store parent units fetched from API
+  parentUnits: any[] = []; 
   hardwareProfiles: any[] = [];
-  isEditMode: boolean; // Flag to check if it's edit mode
+  isEditMode: boolean; 
+  currentCalendar: any;
   protected p2pModeOptions = [
     {"name": 'Leecher', "value": "p2p-mode-leecher"},
     {"name": 'Peer', "value": "p2p-mode-peer"},
@@ -126,6 +127,16 @@ export class EditOrganizationalUnitComponent implements OnInit {
     );
   }
 
+  loadCurrentCalendar(uuid: string): void {
+    const apiUrl = `${this.baseUrl}/remote-calendars/${uuid}`;
+    this.http.get<any>(apiUrl).subscribe(
+      response => this.currentCalendar = response,      
+      error => {
+        console.error('Error loading current calendar', error);
+        this.openSnackBar(true, 'Error loading current calendar');
+      }
+    );}
+
   onCalendarChange(event: any) {
     const selectedCalendarId = event.value;
     console.log('Selected calendar ID:', selectedCalendarId);
@@ -170,6 +181,7 @@ export class EditOrganizationalUnitComponent implements OnInit {
           capacity: data.capacity,
           calendarSelect: data.remoteCalendar['@id']
         });
+        this.loadCurrentCalendar(data.remoteCalendar.uuid);
       },
       error => {
         console.error('Error fetching data for edit:', error);