Modulo task

src/app/SAMWF/tasks-module/task-module-form/task-module-form.component.css

@@ -0,0 +1,11 @@
+mat-form-field.mat-form-field {
+  width: 80%;
+  font-size: 16px;
+  margin: 2px;
+}
+
+.gridTilePosition {
+  /*   position: relative;
+  margin-bottom: 10px; */
+  color: red;
+}

src/app/SAMWF/tasks-module/task-module-form/task-module-form.component.html

@@ -0,0 +1,153 @@
+<div style="width: 1000px">
+    <h1 *ngIf="data.action == 'Registrar'" mat-dialog-title class="centre">{{ 'texto.dialog.registrar' | translate }}
+        tarea
+    </h1>
+    <h1 *ngIf="data.action == 'Modificar'" mat-dialog-title class="centre">{{ 'texto.dialog.modificar' | translate }}
+        tarea
+    </h1>
+
+    <form [formGroup]="formGroup">
+        <mat-grid-list cols="12" rowHeight="85px" style="height: 100px;">
+            <mat-grid-tile colspan="6">
+                <mat-form-field hintLabel="Nombre de la tarea" appearance="standard">
+                    <mat-label>Nombre de la tarea</mat-label>
+                    <input matInput placeholder="Ingrese el nombre de la tarea" formControlName="name" required />
+                    <mat-icon matSuffix>drive_file_rename_outline</mat-icon>
+                    <mat-error *ngIf="name!.invalid">
+                        {{ 'required' | translate}}
+                    </mat-error>
+                </mat-form-field>
+            </mat-grid-tile>
+
+            <mat-grid-tile colspan="6">
+                <mat-form-field hintLabel="Descripción de la tarea" appearance="standard">
+                    <mat-label>Descripción de la tarea</mat-label>
+                    <input matInput placeholder="Ingrese una descripción" formControlName="description" required />
+                    <mat-icon matSuffix>description</mat-icon>
+                    <mat-error *ngIf="description!.invalid">
+                        {{ 'required' | translate}}
+                    </mat-error>
+                </mat-form-field>
+            </mat-grid-tile>
+
+            <!--             <mat-grid-tile colspan="6">
+                <mat-form-field hintLabel="{{ 'workflow.descripcion.form' | translate }}" appearance="standard">
+                    <mat-label>¿La tarea es una condicional?</mat-label>
+                    <input matInput placeholder="{{ 'workflow.nombre.form.placeholder' | translate }}"
+                        formControlName="isConditional" required />
+                    <mat-icon matSuffix>drive_file_rename_outline</mat-icon>
+                    <mat-error *ngIf="isConditional!.invalid">
+                        {{ 'required' | translate}}
+                    </mat-error>
+                </mat-form-field>
+            </mat-grid-tile> -->
+
+            <mat-grid-tile colspan="6">
+                <mat-form-field appearance="standard">
+                    <mat-label>¿La tarea pertenece a un workflow? </mat-label>
+                    <mat-select formControlName="id_workflow">
+                        <mat-option *ngFor=" let workflow of workflowsBD " [value]="workflow.id">{{ workflow.name }}
+                        </mat-option>
+                    </mat-select>
+                    <mat-icon matSuffix>account_tree</mat-icon>
+                    <mat-hint align="start">Campo opcional</mat-hint>
+
+                </mat-form-field>
+            </mat-grid-tile>
+
+            <mat-grid-tile colspan="6">
+                <mat-form-field appearance="standard">
+                    <mat-label>¿La tarea pertenece a un modulo?</mat-label>
+                    <mat-select formControlName="id_module">
+                        <mat-option *ngFor=" let module of modules" [value]="module.id">
+                            {{ module.name }}
+                        </mat-option>
+                    </mat-select>
+                    <mat-icon matSuffix>view_module</mat-icon>
+                    <mat-hint align="start">Campo opcional</mat-hint>
+
+                </mat-form-field>
+            </mat-grid-tile>
+            <!--             
+            <mat-grid-tile colspan="12">
+                <button mat-stroked-button color="primary" (click)="openDialogFields(item, action)">
+                    Seleccionar campos para validar
+                </button>
+            </mat-grid-tile> 
+            -->
+            <mat-grid-tile colspan="6">
+                <mat-form-field hintLabel="Campo opcional" appearance="legacy" class="m-2">
+                    <mat-label>
+                        {{ 'workflow.detalle.pasos.form.notificacion.placeholder' | translate }}
+                    </mat-label>
+                    <mat-select [value]='notificationValue' class="user-control" multiple
+                        formControlName="employeesValidate">
+                        <mat-option #allSelected (click)="toggleNotificationSelection()" [value]="0">
+                            {{ 'workflow.detalle.pasos.form.notificacion.select' | translate }}</mat-option>
+                        <mat-option [value]="store" *ngFor="let store of storesValidate"
+                            (click)="changeNotification(store)">
+                            {{ store.name }}
+                        </mat-option>
+                    </mat-select>
+                    <mat-icon matSuffix>verified_user</mat-icon>
+                </mat-form-field>
+            </mat-grid-tile>
+
+            <mat-grid-tile colspan="6">
+                <mat-form-field appearance="legacy" class="m-2">
+                    <mat-label>{{ 'workflow.detalle.pasos.form.validadores.placeholder' | translate }}</mat-label>
+                    <mat-select [value]='value' class="user-control" multiple formControlName="employeesNotify">
+                        <mat-option #allSelected (click)="toggleAllSelection()" [value]="0">
+                            {{ 'workflow.detalle.pasos.form.notificacion.select' | translate }}
+                        </mat-option>
+                        <mat-option [value]="store" *ngFor="let store of storesNotify" (click)="valueChange(store)">
+                            {{ store.name }}
+                        </mat-option>
+                    </mat-select>
+                    <mat-icon matSuffix>notifications</mat-icon>
+                    <mat-error *ngIf="employeesNotify!.invalid">
+                        {{ 'required' | translate}}
+                    </mat-error>
+                </mat-form-field>
+            </mat-grid-tile>
+
+
+        </mat-grid-list>
+
+        <mat-grid-list cols="12" rowHeight="60px" *ngIf="data.action != 'Modificar' ">
+            <mat-grid-tile colspan="12" *ngIf="data.action != 'Modificar' ">
+                <mat-label>
+                    ¿La tarea es de tipo?
+                </mat-label>
+            </mat-grid-tile>
+
+            <mat-grid-tile colspan="12">
+                <mat-radio-group required formControlName="isConditional">
+                    <mat-radio-button class="m-2" [value]="true">
+                        Condicional
+                    </mat-radio-button>
+                    <mat-radio-button [value]="false">
+                        Secuencial
+                    </mat-radio-button>
+                </mat-radio-group>
+            </mat-grid-tile>
+
+            <mat-grid-tile class="gridTilePosition" *ngIf="isConditional?.value == null " colspan="12">
+                <div>
+                    {{ 'required' | translate }}
+                </div>
+            </mat-grid-tile>
+        </mat-grid-list>
+    </form>
+    <div class="centre m-2">
+        <button mat-raised-button class="mr-2" color="warn" [mat-dialog-close]="false"
+            matTooltip="{{ 'tooltip.boton.dialog.cerrar' | translate }}">
+            Cancelar
+        </button>
+
+        <button mat-raised-button class="secondary" (click)="enviar(formGroup.value)"
+            matTooltip="{{ 'tooltip.boton.dialog.confirmar' | translate }}" [disabled]="formGroup.invalid">
+            Confirmar
+        </button>
+    </div>
+</div>

src/app/SAMWF/tasks-module/task-module-form/task-module-form.component.spec.ts

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

src/app/SAMWF/tasks-module/task-module-form/task-module-form.component.ts

@@ -0,0 +1,308 @@
+import { Component, Inject, OnInit } from '@angular/core';
+import { FormControl, FormGroup, Validators } from '@angular/forms';
+import {
+  MatDialog,
+  MatDialogRef,
+  MAT_DIALOG_DATA,
+} from '@angular/material/dialog';
+import { MatSnackBar } from '@angular/material/snack-bar';
+import { ActivatedRoute } from '@angular/router';
+import { TranslateService } from '@ngx-translate/core';
+import { lastValueFrom } from 'rxjs';
+import { WorkflowService } from 'src/app/services/SAMWF/workflow.service';
+import { WorkflowComponent } from '../../workflow.component';
+
+@Component({
+  selector: 'app-task-module-form',
+  templateUrl: './task-module-form.component.html',
+  styleUrls: ['./task-module-form.component.css'],
+})
+export class TaskModuleFormComponent implements OnInit {
+  formGroup: FormGroup;
+  value: any[] = [];
+  notificationValue: any[] = [];
+  selectAll = false;
+  desplegarCondicionales: boolean = false;
+  posicion = 0;
+  secuenciaNueva: number = 0;
+  arrIndex = 0;
+
+  workflowsBD: any[] = [];
+  modules: any[] = [];
+  tasksData: any[] = [];
+  formFields: any[] = [];
+
+  storesNotify = [
+    { id: 0, name: 'Juan Alvarez' },
+    { id: 1, name: 'Alan Carranza' },
+    { id: 2, name: 'Jean Benitez' },
+    { id: 4, name: 'Emmanuel Estrada' },
+  ];
+
+  storesValidate = [
+    { id: 0, name: 'Juan Alvarez' },
+    { id: 1, name: 'Alan Carranza' },
+    { id: 2, name: 'Jean Benitez' },
+    { id: 4, name: 'Emmanuel Estrada' },
+  ];
+
+  constructor(
+    public dialog: MatDialog,
+    public dialogRef: MatDialogRef<any>,
+    private _snackBar: MatSnackBar,
+    private _samwfService: WorkflowService,
+    private activatedRoute: ActivatedRoute,
+    @Inject(MAT_DIALOG_DATA) public data: any,
+    private translate: TranslateService
+  ) {
+    translate.setDefaultLang('es');
+    console.log(this.data.item);
+
+    this.modules = this.data.modules;
+    this.workflowsBD = this.data.workflows;
+    this.formGroup = this.createFormGroup();
+  }
+
+  ngOnInit(): void {}
+
+  private createFormGroup() {
+    if (this.data.action == 'Registrar') {
+      return new FormGroup({
+        name: new FormControl(''),
+        description: new FormControl(''),
+        sequence: new FormControl(null),
+        nextSequence: new FormControl(null),
+        changeSequence: new FormControl(null),
+        employeesNotify: new FormControl([], Validators.required),
+        employeesValidate: new FormControl([]),
+        validationRules: new FormControl([]),
+        status: new FormControl('Pending'),
+        isAvailable: new FormControl(true),
+        isValidated: new FormControl(false),
+        notification: new FormControl(''),
+        isConditional: new FormControl(null),
+        id_workflow: new FormControl(null),
+        id_module: new FormControl(null),
+      });
+    } else {
+      let positionWorkflow = this.workflowsBD.findIndex((object: any) => {
+        return object.id == this.data.item.id_workflow;
+      });
+
+      let positionModule = this.modules.findIndex((object: any) => {
+        return object.id == this.data.item.id_module;
+      });
+
+      return new FormGroup({
+        name: new FormControl(this.data.item.name),
+        description: new FormControl(this.data.item.description),
+        sequence: new FormControl(this.data.item.sequence),
+        nextSequence: new FormControl(this.data.item.nextSequence),
+        changeSequence: new FormControl(this.data.item.changeSequence),
+        employeesNotify: new FormControl(this.getBoxesNotify()),
+        employeesValidate: new FormControl(
+          this.getBoxesValidate(),
+          Validators.required
+        ),
+        validationRules: new FormControl(this.data.item.validationRules),
+        status: new FormControl(this.data.item.status),
+        isAvailable: new FormControl(this.data.item.isAvailable),
+        isValidated: new FormControl(this.data.item.isValidated),
+        notification: new FormControl(this.data.item.notification),
+        isConditional: new FormControl(this.data.item.isConditional),
+        id_workflow: new FormControl(this.data.item.id_workflow),
+        id_module: new FormControl(this.modules[positionModule].id),
+      });
+    }
+  }
+
+  enviar(item: any) {
+    if (item.id_workflow == null) {
+      delete item.id_workflow;
+    }
+
+    if (item.id_module == null) {
+      delete item.id_module;
+    }
+    item.notification = item.employeesNotify.length > 0 ? true : false;
+
+    this.dialogRef.close(item);
+  }
+
+  valueChange(id: any) {
+    if (this.value.indexOf(id) > -1) {
+      const pos = this.value.indexOf(id);
+      this.value.splice(pos, 1);
+    } else {
+      this.value.push(id);
+    }
+  }
+
+  toggleAllSelection() {
+    this.selectAll = !this.selectAll;
+    if (this.selectAll == true) {
+      this.value = this.storesNotify;
+    } else {
+      this.value = [];
+    }
+  }
+
+  changeNotification(id: any) {
+    if (this.notificationValue.indexOf(id) > -1) {
+      const pos = this.notificationValue.indexOf(id);
+      this.notificationValue.splice(pos, 1);
+    } else {
+      this.notificationValue.push(id);
+    }
+  }
+
+  toggleNotificationSelection() {
+    this.selectAll = !this.selectAll;
+    if (this.selectAll == true) {
+      this.notificationValue = this.storesValidate;
+    } else {
+      this.notificationValue = [];
+    }
+  }
+
+  openDialogFields(item: any, action: string) {
+    let dataAction = {
+      action: action,
+      item: item,
+    };
+
+    const dialogRef = this.dialog.open(WorkflowComponent, {
+      data: dataAction,
+    });
+
+    dialogRef.afterClosed().subscribe((result) => {
+      if (result) {
+        if (action == 'Registrar') {
+          console.log(result);
+        } else {
+          console.log(result);
+        }
+      }
+    });
+  }
+
+  getBoxesNotify() {
+    let arrIndex = [];
+    for (
+      let indexFor = 0;
+      indexFor < this.data.item.employeesNotify.length;
+      indexFor++
+    ) {
+      let index = this.storesNotify.findIndex(
+        (element) => element.id == this.data.item.employeesNotify[indexFor].id
+      );
+      arrIndex.push(index);
+    }
+
+    let arrUsr: any[] = [];
+    arrIndex.forEach((element) => {
+      arrUsr.push(this.storesNotify[element]);
+    });
+
+    return arrUsr;
+  }
+
+  getBoxesValidate() {
+    let arrIndex = [];
+    for (
+      let indexFor = 0;
+      indexFor < this.data.item.employeesValidate.length;
+      indexFor++
+    ) {
+      let index = this.storesValidate.findIndex(
+        (element) => element.id == this.data.item.employeesValidate[indexFor].id
+      );
+      arrIndex.push(index);
+    }
+
+    let arrUsr: any[] = [];
+    arrIndex.forEach((element) => {
+      arrUsr.push(this.storesValidate[element]);
+    });
+
+    return arrUsr;
+  }
+  get name() {
+    return this.formGroup.get('name');
+  }
+
+  get description() {
+    return this.formGroup.get('description');
+  }
+
+  get sequence() {
+    return this.formGroup.get('sequence');
+  }
+
+  get nextSequence() {
+    return this.formGroup.get('nextSequence');
+  }
+
+  get changeSequence() {
+    return this.formGroup.get('changeSequence');
+  }
+  get workflow() {
+    return this.formGroup.get('workflow');
+  }
+
+  get employeesNotify() {
+    return this.formGroup.get('employeesNotify');
+  }
+
+  get employeesValidate() {
+    return this.formGroup.get('employeesValidate');
+  }
+
+  get validationRules() {
+    return this.formGroup.get('validationRules');
+  }
+
+  get status() {
+    return this.formGroup.get('status');
+  }
+
+  get isAvailable() {
+    return this.formGroup.get('isAvailable');
+  }
+
+  get isValidated() {
+    return this.formGroup.get('isValidated');
+  }
+
+  get notification() {
+    return this.formGroup.get('notification');
+  }
+
+  get isConditional() {
+    return this.formGroup.get('isConditional');
+  }
+
+  get id_workflow() {
+    return this.formGroup.get('id_workflow');
+  }
+
+  get id_module() {
+    return this.formGroup.get('id_module');
+  }
+}
+
+/* sequence: new FormControl(''),
+nextSequence: new FormControl(''),
+changeSequence: new FormControl(''),
+workflow: new FormControl(''),
+employeesNotify: new FormControl(''),
+employeesValidate: new FormControl(''),
+validationRules: new FormControl(''),
+status: new FormControl(''),
+isAvailable: new FormControl(''),
+isValidated: new FormControl(''),
+notification: new FormControl(''),
+isConditional: new FormControl(''),
+id_workflow: new FormControl(''),
+id_module: new FormControl(''),
+}); */

src/app/SAMWF/tasks-module/tasks-module.component.css

@@ -0,0 +1,4 @@
+.mat-fab:not([class*="mat-elevation-z"]),
+.mat-mini-fab:not([class*="mat-elevation-z"]) {
+  box-shadow: none !important;
+}

src/app/SAMWF/tasks-module/tasks-module.component.html

@@ -1,8 +1,145 @@
 <mat-card class="card-normal mat-elevation-z8 animated fadeIn fast">
-    <mat-grid-list cols="12" rowHeight="55px" class="card-title">
+    <mat-grid-list cols="12" rowHeight="64px" class="card-title">
         <mat-grid-tile colspan="12">
-            <mat-card-title>Tareas</mat-card-title>
+            <mat-card-title>
+                Administración de tareas
+            </mat-card-title>
         </mat-grid-tile>
+        <app-translation (click)="updatePaginator()"></app-translation>
 
+        <mat-grid-tile colspan="2">
+            <a mat-mini-fab style="left: 10%;" class="secondary" matTooltip="{{ 'tooltip.boton.regresar' | translate }}"
+                (click)="backToWorkflows()">
+                <mat-icon>arrow_back</mat-icon>
+            </a>
+        </mat-grid-tile>
+
+        <mat-grid-tile colspan="8" class="card-title" *ngIf="dataSource.data.length != 0">
+            <mat-form-field appearance="legacy" class="searcher">
+                <mat-label>{{ 'buscador' | translate }}</mat-label>
+                <input matInput placeholder="{{ 'buscador.placeholder' | translate }}" (keyup)="applyFilter($event)" />
+                <mat-icon matSuffix>search</mat-icon>
+            </mat-form-field>
+        </mat-grid-tile>
+
+        <mat-grid-tile colspan="1">
+            <a mat-fab class="secondary" (click)="openDialogTaskForm('Registrar', null)"
+                matTooltip="{{ 'tooltip.registrar' | translate}}">
+                <mat-icon>add</mat-icon>
+            </a>
+        </mat-grid-tile>
     </mat-grid-list>
+    <!--     <p class="centre display-text text-secondary">Filtros de búsqueda</p>
+    <div class="filters mb-5">
+        <div class="flex-item">
+            <mat-form-field hintLabel="{{ 'workflow.historial.notificaciones.busqueda.fecha' | translate }}"
+                appearance="legacy">
+                <mat-label>Fecha de creación</mat-label>
+                <input [(ngModel)]='filterSendDate' matInput [min]="minDate" [max]="maxDate"
+                    [matDatepicker]="date_created">
+                <mat-datepicker-toggle matSuffix [for]="date_created"></mat-datepicker-toggle>
+                <mat-datepicker #date_created></mat-datepicker>
+            </mat-form-field>
+        </div>
+
+        <div class="flex-item">
+            <mat-form-field hintLabel="{{ 'workflow.modulos.form' | translate }}" appearance="legacy">
+                <mat-label>{{ 'workflow.modulos.form.placeholder' | translate }}</mat-label>
+                <mat-select [(ngModel)]='filterModule'>
+                    <mat-option *ngFor="let item of modules; let i = index" [value]="item.name">
+                        {{ item.name }}
+                    </mat-option>
+                </mat-select>
+                <mat-icon matSuffix>view_module</mat-icon>
+            </mat-form-field>
+        </div>
+
+        <div class="flex-item">
+            <button class="mr-1 secondary" mat-mini-fab matTooltip="Aplicar filtros" (click)="filter()">
+                <mat-icon>filter_list</mat-icon>
+            </button>
+            <button class="warn" mat-mini-fab matTooltip="Quitar filtros" (click)="clearFilter()">
+                <mat-icon>delete</mat-icon>
+            </button>
+        </div>
+    </div> -->
+
+    <div *ngIf="data_empty" class="data-empty">
+        {{ 'datos.vacios' | translate }}
+    </div>
+
+    <div *ngIf="filter_empty " class="data-empty">
+        {{ 'No se encontraron coincidencias' }}
+    </div>
+
+    <mat-progress-bar *ngIf="loading" mode="indeterminate"></mat-progress-bar>
+
+    <table mat-table [dataSource]="dataSource" class="animated fadeIn" *ngIf="dataSource.data.length != 0">
+
+        <ng-container matColumnDef="name_task">
+            <th mat-header-cell *matHeaderCellDef>
+                Tarea
+            </th>
+            <td mat-cell *matCellDef="let element">
+                {{ element.name}}
+            </td>
+        </ng-container>
+
+        <ng-container matColumnDef="module">
+            <th mat-header-cell *matHeaderCellDef>
+                Modulo
+            </th>
+            <td mat-cell *matCellDef="let element">
+                {{ element.module == null ? "Sin modulo" : "Modulo asignado" }}
+            </td>
+        </ng-container>
+
+        <ng-container matColumnDef="workflow">
+            <th mat-header-cell *matHeaderCellDef>
+                Flujo de trabajo
+            </th>
+            <td mat-cell *matCellDef="let element">
+                {{ element.workflow == null ? "Sin workflow": element.workflow.name }}
+            </td>
+        </ng-container>
+
+        <ng-container matColumnDef="isAvailable">
+            <th mat-header-cell *matHeaderCellDef>
+                Estatus de la tarea
+            </th>
+            <td mat-cell *matCellDef="let element">
+                {{ element.isAvailable == 0 ? "Inhabilitada" : "Habilitada" }}
+            </td>
+        </ng-container>
+
+        <ng-container matColumnDef="notification">
+            <th mat-header-cell *matHeaderCellDef>
+                Notificación
+            </th>
+            <td mat-cell *matCellDef="let element">
+                {{ element.employeesValidate.length > 0 ? "Si" : "No" }}
+            </td>
+        </ng-container>
+
+        <ng-container matColumnDef="actions">
+            <th mat-header-cell *matHeaderCellDef class="centre">Acciones</th>
+            <td mat-cell *matCellDef="let element" class="centre table-action">
+                <button mat-mini-fab class="mr-1 secondary" (click)="openDialogTaskForm('Modificar', element)"
+                    matTooltip="{{ 'tooltip.modificar' | translate }}">
+                    <mat-icon>edit</mat-icon>
+                </button>
+                <button mat-mini-fab color="warn" class="mr-1" (click)="disableTask(element.id)"
+                    matTooltip="{{ 'tooltip.boton.eliminar' | translate}}"
+                    [disabled]="element.sequence == 1 || element.sequence == 1000">
+                    <mat-icon>delete</mat-icon>
+                </button>
+            </td>
+
+        </ng-container>
+
+        <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+        <tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
+    </table>
+    <mat-paginator [pageSizeOptions]="[10, 20, 50]" showFirstLastButtons>
+    </mat-paginator>
 </mat-card>

src/app/SAMWF/tasks-module/tasks-module.component.ts

@@ -1,15 +1,200 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, ViewChild, AfterViewInit, OnInit } from '@angular/core';
+import { MatTableDataSource } from '@angular/material/table';
+import { MatPaginator } from '@angular/material/paginator';
+import { Router } from '@angular/router';
+import { TranslateService } from '@ngx-translate/core';
+import { MatDialog } from '@angular/material/dialog';
+import { lastValueFrom } from 'rxjs';
+import { WorkflowService } from 'src/app/services/SAMWF/workflow.service';
+import { filter } from '@syncfusion/ej2/maps';
+import { TaskModuleFormComponent } from './task-module-form/task-module-form.component';
+import { TasksJSONInterface } from '../../interfaces/SAMWF/tasks-json-interface';
+import { MatSnackBar } from '@angular/material/snack-bar';
 
 @Component({
   selector: 'app-tasks-module',
   templateUrl: './tasks-module.component.html',
-  styleUrls: ['./tasks-module.component.css']
+  styleUrls: ['./tasks-module.component.css'],
 })
 export class TasksModuleComponent implements OnInit {
+  loading: Boolean = false;
+  tasks: any[] = [];
+  data_empty = false;
+  filter_empty = false;
 
-  constructor() { }
+  displayedColumns: string[] = [
+    'name_task',
+    'module',
+    'workflow',
+    'isAvailable',
+    'notification',
+    'actions',
+  ];
+
+  minDate: Date;
+  maxDate: Date;
+  modules: any[] = [];
+  filterSendDate: any;
+  filterModule: any;
+  workflowsDataBase: any[] = [];
+  dataSource = new MatTableDataSource<any>(this.tasks);
+
+  @ViewChild(MatPaginator) paginator!: MatPaginator;
+
+  constructor(
+    public dialog: MatDialog,
+    private router: Router,
+    private translate: TranslateService,
+    private _samwfService: WorkflowService,
+    private _snackBar: MatSnackBar
+  ) {
+    const currentYear = new Date().getFullYear();
+    this.minDate = new Date(currentYear - 2, 0, 0);
+    this.maxDate = new Date(currentYear + 1, 0, 0);
+    translate.setDefaultLang('es');
+  }
+
+  ngAfterViewInit(): void {
+    this.translate.get('paginador').subscribe((data: any) => {
+      this.dataSource.paginator = this.paginator;
+      this.paginator._intl.itemsPerPageLabel = data[0];
+      this.paginator._intl.firstPageLabel = data[1];
+      this.paginator._intl.lastPageLabel = data[2];
+      this.paginator._intl.nextPageLabel = data[3];
+      this.paginator._intl.previousPageLabel = data[4];
+    });
+
+    this.dataSource.filterPredicate = function (data, filter: string): boolean {
+      return (
+        data.content.date.toString().toLowerCase().includes(filter) ||
+        data.content.workflow.toString().toLowerCase().includes(filter) ||
+        data.content.task.toLowerCase().includes(filter)
+      );
+    };
+  }
+
+  applyFilter(filterValue: any) {
+    this.dataSource.filter = filterValue.target.value.trim().toLowerCase();
+  }
 
   ngOnInit(): void {
+    this.getTasks();
+    this.getWorkflows();
+  }
+
+  backToWorkflows() {
+    this.router.navigate(['workflow']);
+  }
+
+  updatePaginator() {
+    this.translate.get('paginador').subscribe((data: any) => {
+      this.dataSource.paginator = this.paginator;
+      this.paginator._intl.itemsPerPageLabel = data[0];
+      this.paginator._intl.firstPageLabel = data[1];
+      this.paginator._intl.lastPageLabel = data[2];
+      this.paginator._intl.nextPageLabel = data[3];
+      this.paginator._intl.previousPageLabel = data[4];
+    });
+  }
+
+  async openDialogTaskForm(action: string, item: any) {
+    let dataAux = {
+      action: action,
+      item: item,
+      workflows: this.workflowsDataBase,
+      modules: this.modules,
+    };
+    const dialogRef = this.dialog.open(TaskModuleFormComponent, {
+      data: dataAux,
+    });
+
+    dialogRef.afterClosed().subscribe((result: any) => {
+      if (result) {
+        if (action == 'Registrar') {
+          console.log(result);
+
+          this.registerTask(result);
+        } else {
+        }
+      }
+    });
   }
 
+  async disableTask(idTask: any) {}
+
+  private async getWorkflows() {
+    await lastValueFrom(this._samwfService.getWorkflows()).then(
+      (data: any) => {
+        this.workflowsDataBase = data;
+      },
+      (error: any) => console.log(error)
+    );
+  }
+
+  private async registerTask(task: TasksJSONInterface) {
+    await lastValueFrom(this._samwfService.registerTask(task)).then(
+      (data: any) => {
+        if (!data.error) {
+          this._snackBar.open('!Registro de tarea existoso!', 'Cerrar', {
+            duration: 3000,
+          });
+        }
+      },
+      (error: any) => {
+        console.log(error);
+
+        this._snackBar.open(error.message, 'Cerrar', { duration: 3000 });
+      }
+    );
+  }
+
+  private async editTask(task: TasksJSONInterface) {
+    await lastValueFrom(this._samwfService.registerTask(task)).then(
+      (data: any) => {
+        if (!data.error) {
+          this._snackBar.open('!Registro de tarea existoso!', 'Cerrar', {
+            duration: 3000,
+          });
+        }
+      },
+      (error: any) => {
+        console.log(error);
+
+        this._snackBar.open(error.message, 'Cerrar', { duration: 3000 });
+      }
+    );
+  }
+
+  private formatDate(date: Date) {
+    var d = new Date(date),
+      month = '' + (d.getMonth() + 1),
+      day = '' + d.getDate(),
+      year = d.getFullYear();
+
+    if (month.length < 2) month = '0' + month;
+    if (day.length < 2) day = '0' + day;
+
+    return [year, month, day].join('-');
+  }
+
+  private async getTasks() {
+    await lastValueFrom(this._samwfService.getTasks()).then(
+      (data: any) => {
+        this.dataSource.data = data;
+        this.tasks = data;
+
+        this.dataSource.data.length > 0
+          ? (this.data_empty = false)
+          : (this.data_empty = true);
+      },
+      (error: any) => console.log(error)
+    );
+
+    await lastValueFrom(this._samwfService.getModules()).then(
+      (data: any) => {
+        this.modules = data;
+      },
+      (error: any) => console.log(error)
+    );
+  }
 }

src/app/SAMWF/workflow-detail/workflow-detail.component.ts

@@ -102,10 +102,11 @@ export class WorkflowDetailComponent implements OnInit, MaterialModule {
     );
 
     let data = item != null ? JSON.stringify(item) : null;
-    let tasks_bd = JSON.stringify(processArr);
-    localStorage.setItem('tasks_bd', tasks_bd);
+    let tasks_bd = processArr;
+
+    this.sendArrayTasks(tasks_bd);
     this.routerNavigate.navigate([
-      `/workflow/${this.idWorkflow}/tareas`,
+      `/workflow/${this.idWorkflow}/tasksFlow`,
       { data, action },
     ]);
   }
@@ -142,6 +143,10 @@ export class WorkflowDetailComponent implements OnInit, MaterialModule {
     );
   }
 
+  sendArrayTasks(data: any) {
+    this._samwfService.setArray(data);
+  }
+
   backToWorkflows() {
     this.routerNavigate.navigate(['workflow']);
   }

src/app/SAMWF/workflow-detail/workflow-tasks-form/workflow-pasos-form.component.ts

@@ -73,12 +73,15 @@ export class WorkflowPasosFormComponent implements OnInit {
       this.action = params['action'];
       this.data = JSON.parse(params['data']);
     });
-    this.tasksData = JSON.parse(localStorage.getItem('tasks_bd')!);
+    this.tasksData = this._samwfService.getArray();
     translate.setDefaultLang('es');
+
     this.formGroup = this.createFormGroup();
   }
 
   ngOnInit(): void {
+    this.tasksData = this._samwfService.getArray();
+
     this.getTasksWorkflow();
   }
 
@@ -227,22 +230,22 @@ export class WorkflowPasosFormComponent implements OnInit {
         }
       }
     }
-  
+
     // Añadir al arreglo la informacion obtenida y separandolo por lo caminos si y no
     for (let index = 0; index < arrTransform.length; index++) {
       arrFormat.push(arrTransform[index].conditionalYes);
       arrFormat.push(arrTransform[index].conditionalNo);
     }
 
-    // Si alguna tarea no encontro coincidencias quiere decir que su camino termina en la tarea 
+    // Si alguna tarea no encontro coincidencias quiere decir que su camino termina en la tarea
     // Que el usuario indico como referencia en el formulario
     for (let index = 0; index < arrFormat.length; index++) {
       if (arrFormat[index].nextSequence == null) {
         arrFormat[index].nextSequence = this.nextSecuenceFlag;
       }
     }
-    
-    // Para evitar problemas de datos repetidos, a la tarea principal seleccionada 
+
+    // Para evitar problemas de datos repetidos, a la tarea principal seleccionada
     // Se le asignan sus valores establecidos (secuencia, nextSequence y chagueSequence)
     principalTask.sequence = this.newSequenceCalculate;
     principalTask.nextSequence = arrFormat[0].sequence;
@@ -258,12 +261,11 @@ export class WorkflowPasosFormComponent implements OnInit {
     for (let index = 0; index < arrCondtionals.length; index++) {
       this.workflowTasks.push(arrCondtionals[index]);
     }
-    
+
     // Al añadir la tarea principal, la tarea anterior debe tener la nueva referencia en su nextSequence
     let positionTaskRegister = this.workflowTasks.findIndex((object: any) => {
       return object.sequence == this.tasks?.value.sequence;
     });
-    
 
     this.workflowTasks[positionTaskRegister - 1].nextSequence =
       this.newSequenceCalculate;
@@ -273,12 +275,12 @@ export class WorkflowPasosFormComponent implements OnInit {
       return this.workflowTasks.indexOf(item) === index;
     });
 
-    // Ordenar el arreglo de tareas por medio de la secuencia 
+    // Ordenar el arreglo de tareas por medio de la secuencia
     this.workflowTasks.sort((a: any, b: any) => a.sequence - b.sequence);
 
     // Añadir las tareas al objeto del workflow en la referencia "tasks"
     this.workflowObject.tasks = this.workflowTasks;
-    
+
     // Llamar al servicio para actualizar el flujo de trabajo
     this.asingTaskWorkflow();
   }
@@ -288,7 +290,7 @@ export class WorkflowPasosFormComponent implements OnInit {
     // al registrar ordenar el nuevo arreglo
     task.tasks.sequence = this.newSequenceCalculate;
     task.tasks.nextSequence = this.nextSecuenceFlag;
-    
+
     // Añandir la tarea al arreglo de tareas original del workflow
     this.workflowTasks.push(task.tasks);
 
@@ -296,8 +298,8 @@ export class WorkflowPasosFormComponent implements OnInit {
     this.workflowTasks = this.workflowTasks.filter((item, index) => {
       return this.workflowTasks.indexOf(item) === index;
     });
-  
-    // Ordenar el arreglo de tareas por medio de la secuencia 
+
+    // Ordenar el arreglo de tareas por medio de la secuencia
     this.workflowTasks.sort((a: any, b: any) => a.sequence - b.sequence);
     let positionTaskRegister = this.workflowTasks.findIndex((object: any) => {
       return object.sequence == task.tasks.sequence;
@@ -328,8 +330,8 @@ export class WorkflowPasosFormComponent implements OnInit {
         return object.sequence == this.data.sequence;
       }
     );
-    
-    // Ciclar el arreglo de condicionales enviado por el usuario contra el arreglo original 
+
+    // Ciclar el arreglo de condicionales enviado por el usuario contra el arreglo original
     // Encontrar los datos que no cuenten con una secuencia asignada y por medio de la posicion asignarsela nuevamente
     for (let index = 0; index < this.conditionals.value.length; index++) {
       if (this.conditionals.value[index].conditionalYes.sequence == null) {
@@ -354,17 +356,17 @@ export class WorkflowPasosFormComponent implements OnInit {
           this.valueConditionalsArray[index].conditionalNo.changeSequence;
       }
     }
-  
+
     // Las tareas modificadas se agregan nuevamente
     for (let index = 0; index < this.conditionals.value.length; index++) {
       taskToArray.push(this.conditionals.value[index].conditionalYes);
       taskToArray.push(this.conditionals.value[index].conditionalNo);
     }
-    
+
     // La tarea principal pierde los valroes por lo que se busca dentro del arreglo y se asignan de nuevo los valores
     taskToArray.push(this.tasks?.value);
     let taskPrincipalAux = taskToArray.pop();
-    
+
     for (let index = 0; index < taskToArray.length; index++) {
       let positionTask = this.workflowObject.tasks.findIndex((object: any) => {
         return object.sequence == taskToArray[index].sequence;
@@ -402,7 +404,7 @@ export class WorkflowPasosFormComponent implements OnInit {
           return object.sequence === this.data.changeSequence;
         }
       );
-  
+
       // Se crea un arreglo tomando como base la siguiente secuencia y el cambio de secuencia de la tarea principal
       // Con este arreglo se tienen las tareas del camino principal positivo
       filterFlow = this.workflowTasks.filter((object: any) => {
@@ -411,7 +413,7 @@ export class WorkflowPasosFormComponent implements OnInit {
           object.sequence <= this.data.changeSequence
         );
       });
-      
+
       // Se ciclan las tareas para obtener el ultimo cambio de secuencia y realizar un filtro como el anterior
       // Buscando obtener las tareas del camino negativo
       for (let index = 0; index < this.workflowTasks.length; index++) {
@@ -442,7 +444,7 @@ export class WorkflowPasosFormComponent implements OnInit {
           }
         }
       }
-      
+
       // Con la posicion del ultimo cambio de secuencia se puede filtrar el arreglo para obtener las tareas del camino negativo
       filterFlowAux = this.workflowTasks.filter((object: any) => {
         return (
@@ -451,10 +453,10 @@ export class WorkflowPasosFormComponent implements OnInit {
             this.workflowTasks[positionTaskChangeSequence].sequence
         );
       });
-      
-      // Union de los arreglos 
+
+      // Union de los arreglos
       filterFlow = filterFlow.concat(filterFlowAux);
-      
+
       // Al arreglo obtenido se realiza un filtro para obtener los niveles a los que pertenece cada tarea
       filterFlow = this.filterFlowFor(filterFlow);
 
@@ -493,10 +495,12 @@ export class WorkflowPasosFormComponent implements OnInit {
       });
 
       if (positionTaskNo > -1 && positionTaskYes > -1) {
-        filterFlow[positionTaskNo].indexPosition = this.arrayLettersForLevel[keyNum] + 1;
+        filterFlow[positionTaskNo].indexPosition =
+          this.arrayLettersForLevel[keyNum] + 1;
         filterFlow[positionTaskNo].taskCurrent = filterFlow[index];
 
-        filterFlow[positionTaskYes].indexPosition = this.arrayLettersForLevel[keyNum] + 1;
+        filterFlow[positionTaskYes].indexPosition =
+          this.arrayLettersForLevel[keyNum] + 1;
         filterFlow[positionTaskYes].taskCurrent = filterFlow[index];
 
         if (
@@ -505,18 +509,22 @@ export class WorkflowPasosFormComponent implements OnInit {
             index == 6 &&
             filterFlow[index].indexPosition.includes('2'))
         ) {
-          filterFlow[positionTaskNo].indexPosition = this.arrayLettersForLevel[keyNum] + 2;
+          filterFlow[positionTaskNo].indexPosition =
+            this.arrayLettersForLevel[keyNum] + 2;
           filterFlow[positionTaskNo].taskCurrent = filterFlow[index];
 
-          filterFlow[positionTaskYes].indexPosition = this.arrayLettersForLevel[keyNum] + 2;
+          filterFlow[positionTaskYes].indexPosition =
+            this.arrayLettersForLevel[keyNum] + 2;
           filterFlow[positionTaskYes].taskCurrent = filterFlow[index];
         }
 
         if (filterFlow[positionTaskNo].changeSequence != null) {
-          filterFlow[positionTaskNo].indexPosition = this.arrayLettersForLevel[keyNum] + 2;
+          filterFlow[positionTaskNo].indexPosition =
+            this.arrayLettersForLevel[keyNum] + 2;
           filterFlow[positionTaskNo].taskCurrent = filterFlow[index];
 
-          filterFlow[positionTaskYes].indexPosition = this.arrayLettersForLevel[keyNum] + 2;
+          filterFlow[positionTaskYes].indexPosition =
+            this.arrayLettersForLevel[keyNum] + 2;
           filterFlow[positionTaskYes].taskCurrent = filterFlow[index];
 
           positionAuxiliarNo = filterFlow.findIndex((object: any) => {
@@ -584,7 +592,7 @@ export class WorkflowPasosFormComponent implements OnInit {
     for (let index = 0; index < filterFlow.length; index++) {
       let positionTaskYes = -1;
       let positionTaskNo = -1;
-      
+
       // Ciclar el arreglo ordenado para añadirlas al formulario dinamico
 
       if (filterFlow[index + 1] != undefined) {
@@ -628,10 +636,10 @@ export class WorkflowPasosFormComponent implements OnInit {
         this.indexPositionAux++;
       }
     }
-      
+
     // Una vez creados los campos dinamicos setearles el valor
     // !!! CON TAREAS DUPLICADAS EL SELECT QUITA EL VALOR DE LAS PRIMERAS Y DEJA LA ULTIMA
-    // BUSCAR SOLUCION 
+    // BUSCAR SOLUCION
     for (let index = 0; index < this.conditionals.value.length; index++) {
       this.conditionals.value[index] = arr[index];
       this.conditionals.controls[index].setValue(arr[index]);
@@ -892,8 +900,12 @@ export class WorkflowPasosFormComponent implements OnInit {
         conditionalYes: new FormControl(''),
         conditionalNo: new FormControl(''),
         taskCurrent: new FormControl(taskCurrent),
-        indexYes: new FormControl(this.arrayLettersForLevel[this.indexPositionAux] + 1),
-        indexNo: new FormControl(this.arrayLettersForLevel[this.indexPositionAux] + 2),
+        indexYes: new FormControl(
+          this.arrayLettersForLevel[this.indexPositionAux] + 1
+        ),
+        indexNo: new FormControl(
+          this.arrayLettersForLevel[this.indexPositionAux] + 2
+        ),
         indexPosition: new FormControl('A'),
       });
       this.conditionals.push(conditionalsAux);
@@ -909,8 +921,12 @@ export class WorkflowPasosFormComponent implements OnInit {
           conditionalNo: new FormControl(''),
           taskCurrent: new FormControl(taskCurrent),
           indexPosition: new FormControl(indice),
-          indexYes: new FormControl(this.arrayLettersForLevel[this.indexPositionAux] + '1'),
-          indexNo: new FormControl(this.arrayLettersForLevel[this.indexPositionAux] + '2'),
+          indexYes: new FormControl(
+            this.arrayLettersForLevel[this.indexPositionAux] + '1'
+          ),
+          indexNo: new FormControl(
+            this.arrayLettersForLevel[this.indexPositionAux] + '2'
+          ),
         });
 
         if (position <= -1) {

src/app/app-routing.module.ts

@@ -8,15 +8,18 @@ import { WorkflowVersionsHistoryComponent } from './SAMWF/workflow-versions-hist
 import { WorkflowRequestWorkflowComponent } from './SAMWF-USER/workflow-request-workflow/workflow-request-workflow.component';
 import { WorkflowAdvanceComponent } from './SAMWF-USER/workflow-advance/workflow-advance.component';
 import { WorkflowHistoryNotificationComponent } from './SAMWF-USER/workflow-history-notification/workflow-history-notification.component';
+import { TasksModuleComponent } from './SAMWF/tasks-module/tasks-module.component';
 
 const routes: Routes = [
+  { path: 'tasks-module', component: TasksModuleComponent },
+
   { path: 'workflow', component: WorkflowComponent },
   {
     path: 'workflow/versions-history/:id',
     component: WorkflowVersionsHistoryComponent,
   },
   { path: 'workflow/:id', component: WorkflowDetailComponent },
-  { path: 'workflow/:id/tareas', component: WorkflowPasosFormComponent },
+  { path: 'workflow/:id/tasksFlow', component: WorkflowPasosFormComponent },
   { path: 'requests-workflow', component: WorkflowRequestWorkflowComponent },
   { path: 'workflow/diagrama/:id', component: WorkflowDiagramaComponent },
   { path: 'requests-advance', component: WorkflowAdvanceComponent },

src/app/app.module.ts

@@ -59,6 +59,7 @@ import { WorkflowRequestWorkflowComponent } from './SAMWF-USER/workflow-request-
 import { WorkflowAdvanceComponent } from './SAMWF-USER/workflow-advance/workflow-advance.component';
 import { WorkflowDetailAdvanceComponent } from './SAMWF-USER/workflow-advance/workflow-detail-advance/workflow-detail-advance.component';
 import { WorkflowHistoryNotificationComponent } from './SAMWF-USER/workflow-history-notification/workflow-history-notification.component';
+import { TaskModuleFormComponent } from './SAMWF/tasks-module/task-module-form/task-module-form.component';
 
 @NgModule({
   declarations: [
@@ -77,6 +78,7 @@ import { WorkflowHistoryNotificationComponent } from './SAMWF-USER/workflow-hist
     WorkflowAdvanceComponent,
     WorkflowDetailAdvanceComponent,
     WorkflowHistoryNotificationComponent,
+    TaskModuleFormComponent,
   ],
   imports: [
     BrowserModule,

src/app/interfaces/SAMWF/tasks-json-interface.ts

@@ -1,20 +1,18 @@
 export interface TasksJSONInterface {
-    id: number,
-    name:  string,
-    description: string,
-    secuence: any,
-    employeesNotify: [],
-    employeesValidate: [],
-    workflow:[],
-    validationRules: [],
-    notification: boolean,
-    hasWorkflow: boolean,
-    id_workflow: number | null,
-    id_module: number 
-    isAvailable: boolean,
-    isConditional: boolean,
-    isValidated: boolean,
-    isCompleted: boolean,
-    created_at: any,
-    updated_at: any,
+  name: string;
+  description: string;
+  secuence: any;
+  nextSequence: any;
+  changeSequence: any;
+  workflow: [];
+  employeesNotify: [];
+  employeesValidate: [];
+  validationRules: [];
+  status: any;
+  isAvailable: boolean;
+  isValidated: boolean;
+  notification: boolean;
+  isConditional: boolean;
+  id_workflow: number | null;
+  id_module: number;
 }

src/app/services/SAMWF/workflow.service.ts

@@ -5,6 +5,8 @@ import { map } from 'rxjs';
 import { WorkflowInterface } from '../../interfaces/SAMWF/workflow-interface';
 import { ResponseData } from '../../interfaces/response-data';
 import { apiUriQA } from 'src/environments/environment';
+import { TaskInterface } from '../../interfaces/SAMWF/task-interface';
+import { TasksJSONInterface } from '../../interfaces/SAMWF/tasks-json-interface';
 
 @Injectable({
   providedIn: 'root',
@@ -16,6 +18,7 @@ export class WorkflowService {
   headers = new HttpHeaders({ Authorization: 'Bearer ' + this.jwt });
   token =
     'Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJFZERTQSJ9.eyJpc3MiOiJqb3NlLmJAaXR0ZWMubXgiLCJhdWQiOiJkb21pbmlvLnN5cC5teCIsImlhdCI6MTY0NzYxMjc0NCwiY2FkIjoxNjQ3Njk5MTQ0fQ.BkpH8BMrx0hExtdU0EsNGxQxcbx_RqvTpGq12DqfbS0IEej5enf6V6q2DbqPsueK_0DMR_CWU9kMMYQCN2jrCg';
+  public arrayDelService: Array<any>;
 
   constructor(private _http: HttpClient, private _snackBar: MatSnackBar) {}
 
@@ -35,6 +38,14 @@ export class WorkflowService {
     );
   }
 
+  setArray(array: any) {
+    this.arrayDelService = array;
+  }
+
+  getArray() {
+    return this.arrayDelService;
+  }
+
   getWorkflows() {
     return this.getQuery('/workflows').pipe(map((data: any) => data));
   }
@@ -50,9 +61,12 @@ export class WorkflowService {
   }
 
   getVersionsWorkflow(idw: number) {
-    return this._http.get<any>(`${this._url}/workflowsHistory/workflow/6`, {
-      headers: this.headers,
-    });
+    return this._http.get<any>(
+      `${this._url}/workflowsHistory/workflow/${idw}`,
+      {
+        headers: this.headers,
+      }
+    );
   }
 
   getAllRequests() {
@@ -79,6 +93,14 @@ export class WorkflowService {
     );
   }
 
+  registerTask(task: TasksJSONInterface) {
+    return this.postQuery('/tasks', task).pipe(map((data: any) => data));
+  }
+
+  updateTask(task: TasksJSONInterface) {
+    return this.putQuery('/tasks', task).pipe(map((data: any) => data));
+  }
+
   registerWorkflow(workflow: WorkflowInterface) {
     return this.postQuery('/workflows', workflow).pipe(
       map((data: any) => data)

src/assets/i18n/es.json

@@ -20,6 +20,7 @@
   "tooltip.boton.dialog.confirmar": "Confirmar",
   "tooltip.boton.dialog.cerrar": "Cerrar",
   "tooltip.boton.regresar": "Regresar a la ventana anterior",
+  "tooltip.boton.eliminar": "Eliminar",
 
   "titulo.workflow": "Flujos de trabajo",
   "filtro.workflow.radio.1": "Activo",
@@ -79,9 +80,9 @@
   "workflow.detalle.pasos.form.radio.antes": "Antes de",
   "workflow.detalle.pasos.form.radio.despues": "Despues de",
   "workflow.detalle.pasos.form.posicion.paso": "Tareas",
-  "workflow.detalle.pasos.form.notificacion": "¿Desea enviar una notificacion?",
-  "workflow.detalle.pasos.form.notificacion.placeholder": "Seleccionar los usuarios que validan (opcional)",
-  "workflow.detalle.pasos.form.validadores.placeholder": "Seleccionar los usuarios a notificar (opcional)",
+  "workflow.detalle.pasos.form.notificacion": "¿Desea notificar a algunos usuarios?",
+  "workflow.detalle.pasos.form.notificacion.placeholder": "Seleccionar los usuarios que validaran la tarea",
+  "workflow.detalle.pasos.form.validadores.placeholder": "Seleccionar los usuarios a notificar ",
 
   "workflow.detalle.pasos.form.notificacion.select": "Todos",