hice mas ancho el moda, e integre acciones pero las acciones aun no hacen nada

src/app/components/template/notification-dialog/notification-dialog.component.ts

@@ -172,8 +172,10 @@ export class NotificationDialogComponent implements OnInit {
       console.log(response);
 
       if (!response.error) {
+        this._dialogRef.close();
         this._dialog.open(ValidateApplicationsModalComponent, {
-          width: '800px',
+          width: '1200px',
+          maxWidth: '90vw',
           data: { applications: response.response },
         });
       } else {

src/app/components/template/notification-dialog/validate-applications-modal/validate-applications-modal.component.css

@@ -4,11 +4,27 @@
   }
 
   .scroll-x table {
-    min-width: 800px;
+    min-width: 1000px;
   }
 }
 
 .override-table {
   max-height: 400px;
   overflow-y: auto;
+  width: 100%;
+}
+
+.override-table table {
+  width: 100%;
+  min-width: 1000px;
+}
+
+.disabled-button {
+  background-color: transparent !important;
+  color: #bdbdbd !important;
+  cursor: not-allowed !important;
+}
+
+.disabled-button mat-icon {
+  color: #bdbdbd !important;
 }

src/app/components/template/notification-dialog/validate-applications-modal/validate-applications-modal.component.html

@@ -27,11 +27,34 @@
         <td mat-cell *matCellDef="let app">{{ app.NOMBRE_WORKFLOW }}</td>
       </ng-container>
 
-      <tr mat-header-row *matHeaderRowDef="['fecha', 'estado', 'tarea', 'secuencia', 'workflow']"></tr>
-      <tr mat-row *matRowDef="let row; columns: ['fecha', 'estado', 'tarea', 'secuencia', 'workflow']"></tr>
+      <ng-container matColumnDef="acciones">
+        <th mat-header-cell *matHeaderCellDef>Acciones</th>
+        <td mat-cell *matCellDef="let app">
+          <button
+            mat-mini-fab
+            color="primary"
+            [class]="app.ESTADO_SOLICITUD === 'Pendiente' ? 'override_no_shadow gray_dark_font transparent_background' : 'override_no_shadow disabled-button'"
+            [matMenuTriggerFor]="app.ESTADO_SOLICITUD === 'Pendiente' ? menu : null"
+            [disabled]="app.ESTADO_SOLICITUD !== 'Pendiente'"
+          >
+            <mat-icon>more_vert</mat-icon>
+          </button>
+          <mat-menu #menu="matMenu">
+            <button mat-menu-item (click)="validateApplication(app)">
+              <mat-icon>check</mat-icon> Validar
+            </button>
+            <button mat-menu-item (click)="rejectApplication(app)">
+              <mat-icon>close</mat-icon> Rechazar
+            </button>
+          </mat-menu>
+        </td>
+      </ng-container>
+
+      <tr mat-header-row *matHeaderRowDef="['fecha', 'estado', 'tarea', 'secuencia', 'workflow', 'acciones']"></tr>
+      <tr mat-row *matRowDef="let row; columns: ['fecha', 'estado', 'tarea', 'secuencia', 'workflow', 'acciones']"></tr>
 
       <tr class="mat-row" *matNoDataRow>
-        <td class="mat-cell p-20 align-center" colspan="5">
+        <td class="mat-cell p-20 align-center" colspan="6">
           <object data="assets/img/empty_data.svg" width="150"></object>
           <h2>Sin datos</h2>
         </td>

src/app/components/template/notification-dialog/validate-applications-modal/validate-applications-modal.component.ts

@@ -21,4 +21,14 @@ export class ValidateApplicationsModalComponent {
   close() {
     this.dialogRef.close();
   }
+
+  validateApplication(app: ValidateApplication) {
+    console.log('Validar aplicación:', app);
+    // TODO: Implementar lógica de validación
+  }
+
+  rejectApplication(app: ValidateApplication) {
+    console.log('Rechazar aplicación:', app);
+    // TODO: Implementar lógica de rechazo
+  }
 }