src/app/admin/components/manage-jobs/attached-users/attached-users.component.html

+<div *ngIf="users.data.users && users.data.users.length != 0">
+  <p *ngFor="let user of users.data.users">
+    <span (click)="redirectTo(user)">{{ user.name }} {{ user.surname }} - {{ user.email }}</span>
+  </p>
+</div>

src/app/admin/components/manage-jobs/attached-users/attached-users.component.scss

+p {
+  margin-top: 0px;
+  margin-bottom: 0px;
+}
+
+span:hover {
+  cursor: pointer;
+  text-decoration: underline;
+}

src/app/shared/components/signin-modal/signin-modal.component.spec.ts → src/app/admin/components/manage-jobs/attached-users/attached-users.component.spec.ts

-import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import { SignInModalComponent } from './signin-modal.component';
+import { AdministredStructuresComponent } from './attached-users.component';
 
-describe('SignInModalComponent', () => {
-  let component: SignInModalComponent;
-  let fixture: ComponentFixture<SignInModalComponent>;
+describe('AdministredStructuresComponent', () => {
+  let component: AdministredStructuresComponent;
+  let fixture: ComponentFixture<AdministredStructuresComponent>;
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      declarations: [SignInModalComponent],
-      imports: [HttpClientTestingModule],
+      declarations: [AdministredStructuresComponent],
     }).compileComponents();
   });
 
   beforeEach(() => {
-    fixture = TestBed.createComponent(SignInModalComponent);
+    fixture = TestBed.createComponent(AdministredStructuresComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();
   });

src/app/admin/components/manage-jobs/attached-users/attached-users.component.ts

+import { Component, Input } from '@angular/core';
+import { AdminPannelEnum } from '../../../../shared/enum/adminPanel.enum';
+import { PanelRouteService } from '../../../services/panel-route.service';
+
+@Component({
+  selector: 'app-attached-users',
+  templateUrl: './attached-users.component.html',
+  styleUrls: ['./attached-users.component.scss'],
+})
+export class AttachedUsersComponent {
+  @Input() redirect = '';
+  public users: any;
+
+  constructor(private panelRouteService: PanelRouteService) {}
+
+  public redirectTo() {
+    this.panelRouteService.redirectTo(AdminPannelEnum.manageUsers);
+  }
+
+  public agInit(params: any): void {
+    this.users = params;
+  }
+}

src/app/admin/components/manage-jobs/delete-job/delete-job.component.html

+<button type="button" (click)="onClick()">{{ label }}</button>

src/app/admin/components/manage-jobs/delete-job/delete-job.component.spec.ts

+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DeleteJobComponent } from './delete-job.component';
+
+describe('DeleteUserComponent', () => {
+  let component: DeleteJobComponent;
+  let fixture: ComponentFixture<DeleteJobComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [DeleteJobComponent],
+    }).compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(DeleteJobComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/admin/components/manage-jobs/delete-job/delete-job.component.ts

+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-delete-job',
+  templateUrl: './delete-job.component.html',
+})
+export class DeleteJobComponent {
+  public params: any;
+  public label: string;
+
+  public agInit(params: any): void {
+    this.params = params;
+    this.label = this.params.label || null;
+  }
+
+  public onClick(): void {
+    if (this.params.onClick instanceof Function) {
+      this.params.onClick(this.params);
+    }
+  }
+}

src/app/admin/components/manage-jobs/jobPersonalOffer/job-personal-offer.component.spec.ts

+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { JobPersonalOffer } from './job-personal-offer';
+
+describe('EditJobsComponent', () => {
+  let component: JobPersonalOffer;
+  let fixture: ComponentFixture<JobPersonalOffer>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [JobPersonalOffer],
+    }).compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(JobPersonalOffer);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/admin/components/manage-jobs/jobPersonalOffer/job-personal-offer.ts

+import { Component } from '@angular/core';
+import { ICellRendererAngularComp } from 'ag-grid-angular';
+import { ICellRendererParams } from 'ag-grid-community';
+
+@Component({
+  selector: 'app-job-personal-offer',
+  template: ` {{ poStatus }} `,
+})
+export class JobPersonalOffer implements ICellRendererAngularComp {
+  public params!: ICellRendererParams;
+  public poStatus: boolean;
+
+  agInit(params: ICellRendererParams): void {
+    this.params = params.value;
+    if (params) {
+      this.poStatus = params.value;
+    } else {
+      this.poStatus = null;
+    }
+  }
+
+  refresh() {
+    return false;
+  }
+}

src/app/admin/components/manage-jobs/manage-jobs.component.html

+<div fxLayout="column" fxLayoutGap="5px" fxLayoutAlign="center center" class="userBlock">
+  <h3>
+    Gestion des fonctions
+    <span *ngIf="unvalidatedJobs && validatedJobs"> ({{ unvalidatedJobs.length + validatedJobs.length }}) </span>
+  </h3>
+</div>
+
+<div class="tables-list">
+  <div>
+    <h3 class="title" *ngIf="unvalidatedJobs">Fonctions non validées ({{ unvalidatedJobs.length }})</h3>
+    <ag-grid-angular
+      *ngIf="unvalidatedJobs"
+      class="ag-theme-alpine user-table"
+      [rowData]="unvalidatedJobs"
+      [columnDefs]="unvalidJobsColumnDefs"
+      rowSelection="multiple"
+      domLayout="autoHeight"
+      [getRowHeight]="getRowHeight"
+      [defaultColDef]="unvalidColDef"
+      [frameworkComponents]="frameworkComponents"
+    >
+    </ag-grid-angular>
+  </div>
+  <div>
+    <h3 class="title" *ngIf="validatedJobs">Fonctions validées ({{ validatedJobs.length }})</h3>
+    <ag-grid-angular
+      *ngIf="validatedJobs"
+      class="ag-theme-alpine user-table"
+      [rowData]="validatedJobs"
+      [columnDefs]="columnDefs"
+      rowSelection="multiple"
+      domLayout="autoHeight"
+      [getRowHeight]="getRowHeight"
+      [defaultColDef]="defaultColDef"
+      [frameworkComponents]="frameworkComponents"
+    >
+    </ag-grid-angular>
+  </div>
+  <div>
+    <h3 class="title" *ngIf="validatedJobs">Créer une nouvelle fonction</h3>
+    <form [formGroup]="newJobForm" (ngSubmit)="onSubmit()">
+      <input type="text" maxlength="100" formControlName="job" class="form-input" />
+      <button type="submit" [ngClass]="{ invalid: !newJobForm.valid }">Créer</button>
+    </form>
+  </div>
+</div>
+<app-modal-confirmation
+  *ngIf="jobToDelete"
+  [openned]="deleteModalOpenned"
+  [content]="'Voulez-vous vraiment supprimer cette fonction&nbsp;? (' + jobToDelete.name + ')'"
+  (closed)="deleteJob(jobToDelete, $event)"
+></app-modal-confirmation>
+<app-modal-confirmation
+  *ngIf="mergeOpe.newJob"
+  [openned]="mergeJobModalOpenned"
+  [content]="'Voulez-vous vraiment fusionner cette fonction avec&nbsp;: ' + mergeOpe.newJob.name"
+  (closed)="mergeJob(mergeOpe.newJob._id, mergeOpe.formerId, $event, contextRow)"
+></app-modal-confirmation>

src/app/admin/components/manage-jobs/manage-jobs.component.scss

+@import '../../../../assets/scss/color';
+
+.user-table {
+  width: 100%;
+  height: 100%;
+  text-overflow: clip;
+}
+
+.tables-list {
+  height: 100%;
+  width: 80%;
+  display: flex;
+  flex-direction: column;
+  margin-left: 10%;
+  margin-bottom: 2%;
+}
+
+app-delete-user {
+  text-align: center;
+}

src/app/admin/components/manage-jobs/manage-jobs.component.spec.ts

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

src/app/admin/components/manage-jobs/manage-jobs.component.ts

+import { Component, OnInit } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { ValueGetterParams } from 'ag-grid-community';
+import { Job } from '../../../models/job.model';
+import { NotificationService } from '../../../services/notification.service';
+import { AdminService } from '../../services/admin.service';
+import { JobRenderer } from '../manage-users/job-renderer/job-renderer.component';
+import { AttachedUsersComponent } from './attached-users/attached-users.component';
+import { DeleteJobComponent } from './delete-job/delete-job.component';
+import { JobPersonalOffer } from './jobPersonalOffer/job-personal-offer';
+import { ValidateJobComponent } from './validate-job/validate-job.component';
+
+@Component({
+  selector: 'app-admin-manage-jobs',
+  templateUrl: './manage-jobs.component.html',
+  styleUrls: ['./manage-jobs.component.scss'],
+})
+export class ManageJobsComponent implements OnInit {
+  public newJobForm: FormGroup;
+  public validatedJobs: Job[] = [];
+  public unvalidatedJobs: Job[] = [];
+  public deleteModalOpenned = false;
+  public validatedJobsName: String[] = [];
+  public mergeJobModalOpenned = false;
+  public jobToDelete: Job = null;
+  public mergeOpe: any = {
+    newJob: {
+      name: null,
+      hasPersonalOffer: true,
+      validated: false,
+    },
+    formerId: '',
+  };
+  public contextRow: any;
+
+  public columnDefs;
+  public unvalidJobsColumnDefs;
+  public frameworkComponents;
+  public defaultColDef = {
+    editable: true,
+    sortable: true,
+    flex: 1,
+    minWidth: 100,
+    filter: true,
+    resizable: true,
+  };
+  public unvalidColDef = {
+    ...this.defaultColDef,
+    cellStyle: {
+      color: '#da6c2e',
+    },
+  };
+
+  constructor(
+    private adminService: AdminService,
+    private notificationService: NotificationService,
+    private formBuilder: FormBuilder
+  ) {
+    this.findValidatedJobs();
+    this.findUnvalidatedJobs();
+    this.unvalidJobsColumnDefs = [
+      {
+        headerName: 'Fonction',
+        field: 'name',
+        editable: true,
+        onCellValueChanged: this.onChange.bind(this),
+      },
+      {
+        headerName: 'Offre de service',
+        field: 'hasPersonalOffer',
+        cellRenderer: 'jobPersonalOffer',
+        cellEditor: 'agSelectCellEditor',
+        valueGetter: this.translateBoolean,
+        singleClickEdit: true,
+        cellEditorParams: {
+          values: [true, false],
+          cellEditorPopup: true,
+        },
+        onCellValueChanged: this.onChange.bind(this),
+      },
+      {
+        headerName: 'Acteurs rattachés',
+        cellRenderer: 'attachedUsersComponent',
+        cellRendererParams: {
+          users: 'users',
+        },
+        minWidth: 500,
+      },
+      {
+        headerName: 'Fusionner',
+        field: '_id',
+        cellRenderer: 'jobRenderer',
+        cellEditor: 'agSelectCellEditor',
+        singleClickEdit: true,
+        cellEditorParams: {
+          values: this.validatedJobsName,
+        },
+        onCellValueChanged: this.onMerge.bind(this),
+      },
+      {
+        headerName: 'Valider',
+        editable: false,
+        minWidth: 100,
+        cellRenderer: 'validateJobComponent',
+        cellRendererParams: {
+          onClick: this.onValidateButtonClick.bind(this),
+          label: 'Valider',
+        },
+      },
+    ];
+    this.columnDefs = [
+      {
+        headerName: 'Fonction',
+        field: 'name',
+        editable: true,
+        onCellValueChanged: this.onChange.bind(this),
+      },
+      {
+        headerName: 'Offre de service',
+        field: 'hasPersonalOffer',
+        cellRenderer: 'jobPersonalOffer',
+        cellEditor: 'agSelectCellEditor',
+        valueGetter: this.translateBoolean,
+        singleClickEdit: true,
+        cellEditorParams: {
+          values: [true, false],
+        },
+        onCellValueChanged: this.onChange.bind(this),
+      },
+      {
+        headerName: 'Acteurs rattachés',
+        cellRenderer: 'attachedUsersComponent',
+        cellRendererParams: {
+          users: 'users',
+        },
+        minWidth: 500,
+      },
+      {
+        headerName: 'Suppression',
+        editable: false,
+        minWidth: 100,
+        cellRenderer: 'deleteJobComponent',
+        cellRendererParams: {
+          onClick: this.onDeleteButtonClick.bind(this),
+          label: 'Supprimer',
+        },
+      },
+    ];
+    this.frameworkComponents = {
+      jobRenderer: JobRenderer,
+      jobPersonalOffer: JobPersonalOffer,
+      deleteJobComponent: DeleteJobComponent,
+      validateJobComponent: ValidateJobComponent,
+      attachedUsersComponent: AttachedUsersComponent,
+    };
+  }
+
+  ngOnInit(): void {
+    this.newJobForm = this.formBuilder.group({
+      job: ['', Validators.required],
+    });
+  }
+
+  public onDeleteButtonClick(arg): void {
+    this.deleteJob(arg.data, false);
+  }
+
+  public onSubmit(): void {
+    if (!this.newJobForm.valid) {
+      return;
+    }
+    const name: string = this.newJobForm.value.job;
+    this.adminService.createJob(name).subscribe(
+      () => {
+        this.findValidatedJobs();
+        this.newJobForm.reset();
+        this.notificationService.showSuccess('Votre fonction a bien été créée', '');
+      },
+      (err) => {
+        this.notificationService.showError(`${err.error.message}`, 'Une erreur est survenue');
+      }
+    );
+  }
+
+  public onValidateButtonClick(arg): void {
+    this.validateJob(arg.data._id);
+  }
+
+  public deleteJob(job: Job, shouldDelete: boolean): void {
+    this.toggleDeleteJobModal(job);
+    if (shouldDelete) {
+      this.adminService.deleteJob(job._id).subscribe(
+        (data) => {
+          this.validatedJobs = this.validatedJobs.filter((obj) => obj._id !== data._id);
+          this.notificationService.showSuccess('La fonction a bien été supprimée.', '');
+        },
+        (err) => {
+          this.notificationService.showError(`${err.error.message}`, 'Une erreur est survenue');
+        }
+      );
+    }
+  }
+
+  public onChange(arg): void {
+    if (arg.oldValue === arg.newValue) {
+      return;
+    } else {
+      this.adminService.editJob(arg.data._id, arg.data.name, arg.data.hasPersonalOffer).subscribe(() => {
+        this.notificationService.showSuccess("L'opération a réussie.", '');
+        this.findValidatedJobs();
+        this.findUnvalidatedJobs();
+      });
+    }
+  }
+
+  public translateBoolean(params: ValueGetterParams) {
+    return params.data.hasPersonalOffer ? '✔️' : '❌';
+  }
+
+  public onMerge(arg): void {
+    const selectedJob = this.validatedJobs.find((job) => job.name === arg.newValue);
+    if (arg.oldValue === undefined) {
+      return;
+    }
+    if (selectedJob === arg.oldValue) {
+      return;
+    }
+    this.toggleMergeJobModal(selectedJob, arg.oldValue, arg);
+  }
+
+  public mergeJob(newJobId: string, formerId: string, shouldMerge: boolean, context?): void {
+    this.mergeJobModalOpenned = !this.mergeJobModalOpenned;
+    if (shouldMerge) {
+      this.adminService.mergeJob(formerId, newJobId).subscribe((data) => {
+        context.node.data[context.colDef.field] = data;
+        context.api.refreshCells({ rowNodes: [context.node], columns: [context.column.colId] });
+        this.findValidatedJobs();
+        this.findUnvalidatedJobs();
+        this.notificationService.showSuccess("L'opération a réussie.", '');
+      });
+    } else {
+      if (context.oldValue) {
+        context.node.data[context.colDef.field] = context.oldValue;
+        context.api.refreshCells({ rowNodes: [context.node], columns: [context.column.colId] });
+      }
+    }
+  }
+
+  public validateJob(jobId: string, context?): void {
+    this.adminService.validateJob(jobId).subscribe((data) => {
+      this.findValidatedJobs();
+      this.findUnvalidatedJobs();
+    });
+  }
+
+  public toggleDeleteJobModal(jobToDelete: Job): void {
+    this.jobToDelete = jobToDelete;
+    this.deleteModalOpenned = !this.deleteModalOpenned;
+  }
+
+  public toggleMergeJobModal(jobToMerge: Job, formerId: string, dataGrid): void {
+    this.mergeOpe.formerId = formerId;
+    this.mergeOpe.newJob = jobToMerge;
+    this.contextRow = dataGrid;
+    this.mergeJobModalOpenned = !this.mergeJobModalOpenned;
+  }
+
+  public findValidatedJobs(): void {
+    this.validatedJobsName = [];
+    this.adminService.getValidatedJobs().subscribe((jobs) => {
+      this.validatedJobs = jobs;
+      jobs.map((job) => {
+        this.validatedJobsName.push(job.name);
+      });
+    });
+  }
+
+  public findUnvalidatedJobs(): void {
+    this.adminService.getUnvalidatedJobs().subscribe((jobs) => {
+      this.unvalidatedJobs = jobs;
+    });
+  }
+
+  public getRowHeight(params): number {
+    return params.data.users ? (params.data.users.length != 0 ? params.data.users.length * 40 : 40) : 40;
+  }
+}

src/app/admin/components/manage-jobs/validate-job/validate-job.component.html

+<button type="button" (click)="onClick()">{{ label }}</button>

src/app/admin/components/manage-jobs/validate-job/validate-job.component.spec.ts

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

src/app/admin/components/manage-jobs/validate-job/validate-job.component.ts

+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-validate-job',
+  templateUrl: './validate-job.component.html',
+})
+export class ValidateJobComponent {
+  public params: any;
+  public label: string;
+
+  public agInit(params: any): void {
+    this.params = params;
+    this.label = this.params.label || null;
+  }
+
+  public onClick(): void {
+    if (this.params.onClick instanceof Function) {
+      this.params.onClick(this.params);
+    }
+  }
+}

src/app/admin/components/manage-users/administred-structures/administred-structures.component.html

-<div id="structure-list" *ngIf="structures.data.structures && structures.data.structures.length != 0">
+<div *ngIf="structures.data.structures && structures.data.structures.length != 0">
   <p *ngFor="let structure of structures.data.structures">
     <a *ngIf="structure" href="/acteurs?id={{ structure._id }}" target="_blank">{{ structure.structureName }}</a>
   </p>

src/app/admin/components/manage-users/employer-renderer/employer-renderer.component.spec.ts

+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { EmployerRenderer } from './employer-renderer.component';
+
+describe('EditEmployersComponent', () => {
+  let component: EmployerRenderer;
+  let fixture: ComponentFixture<EmployerRenderer>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [EmployerRenderer],
+    }).compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(EmployerRenderer);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/admin/components/manage-users/employer-renderer/employer-renderer.component.ts

+import { Component } from '@angular/core';
+import { ICellRendererAngularComp } from 'ag-grid-angular';
+import { ICellRendererParams } from 'ag-grid-community';
+
+@Component({
+  selector: 'app-employer-renderer',
+  template: ` <span>{{ employerName }}</span> `,
+})
+export class EmployerRenderer implements ICellRendererAngularComp {
+  public params!: ICellRendererParams;
+  public employerName: string;
+
+  agInit(params: ICellRendererParams): void {
+    this.params = params;
+    if (params.value) {
+      if (params.value.name) {
+        this.employerName = params.value.name;
+      } else if (params.data.name && !params.data.employer) {
+        this.employerName = params.data.name;
+      } else {
+        this.employerName = params.value;
+      }
+    } else {
+      this.employerName = null;
+    }
+  }
+
+  refresh() {
+    return false;
+  }
+}

src/app/admin/components/manage-users/job-renderer/job-renderer.component.spec.ts

+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { JobRenderer } from './job-renderer.component';
+
+describe('EditJobsComponent', () => {
+  let component: JobRenderer;
+  let fixture: ComponentFixture<JobRenderer>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [JobRenderer],
+    }).compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(JobRenderer);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});