first commit

Jenkinsfile

@@ -0,0 +1,77 @@
+pipeline {
+    agent any //we tell jenkins to use any available agent
+    tools {
+        maven 'Maven'
+        jdk 'Java17'
+        nodejs 'Nodejs'
+    }
+    stages {
+                
+        stage ('Build-service-1') {
+            steps {
+                dir('./spring-project-back/microservices-config-service'){ //enter in folder to locate pom.xml
+                    sh 'mvn -B -DskipTests clean verify'
+                }
+            }
+        }
+        stage ('Build-service-2') {
+            steps {
+                dir('./spring-project-back/microservices-registration-service'){
+                    sh 'mvn -B -DskipTests clean verify'
+                }
+            }
+        }
+        stage ('Build-service-3') {
+            steps {
+                dir ('./spring-project-back/backend-frontend-gateway-service'){
+                     sh 'mvn -B -DskipTests clean verify'
+                }
+                
+            }
+         }
+
+        stage ('Build-service-4') {
+            steps {
+                dir('./spring-project-back/clean-archi-business-service-address/'){
+                      sh 'mvn -B -DskipTests clean verify'
+                }
+            }
+         }
+        stage ('Build-service-5'){
+            steps {
+                dir('./spring-project-back/clean-archi-business-service-company/'){
+                     sh 'mvn -B -DskipTests clean verify'
+                }
+                
+            }
+          }
+        stage ('Build-service-6'){
+            steps{
+                dir('./spring-project-back/clean-archi-business-service-employee/'){
+                     sh 'mvn -B -DskipTests clean verify'
+                }
+            }
+           }
+        stage ('Build-service-7'){
+            steps {
+                dir('./spring-project-back/clean-archi-business-service-project/'){
+                    sh 'mvn -B -DskipTests clean verify'
+                }
+            }
+        }
+        stage('NPM install'){
+            steps{
+                dir('./angular-project-front'){//enter in angular project to run some commands
+                    sh 'npm install'
+                }
+            }
+        }
+        stage('Build-frontend'){
+            steps{
+                dir('./angular-project-front'){//enter in angular project to run some commands
+                    sh 'ng build'
+                }
+            }
+        }
+    }
+}

README.md

@@ -0,0 +1,36 @@
+#Full stack application
+## Description
+
+- Application de gestion des employées, des projets associés à ces employées et ces projets sont crées pour des sociétés.
+- La partie back: architecture orientée microservices,le pattern clean-architecture et le front: Angular, le pattern RxJS
+- Containeurisation de chaque service de l'application avec docker et docker-compose
+
+### Backend:
+- framework spring boot
+- microservices-base application
+	- ***clean-archi-business-service-address***
+	- ***clean-archi-business-service-employee***
+	- ***clean-archi-business-service-project***
+	- ***clean-archi-business-service-company***
+	
+- communication entre microservices (1); gestion des scénarios alternatifs et la résilience (2)
+	- (1) spring cloud openfeign
+	- (2) spring cloud circuit breaker (Resilience4J)
+
+- design pattern dev pour chaque microservice métier: clean architecture
+- service utilitaire pour la centralisation et la gestion des configurations des services métiers et utilitaires: ***microservices-config-service***
+- service de passerelle entre le backend (spring-project-back) et le frontend (angular-project-front): ***backend-frontend-gateway-service***
+     
+- service d'enregistrement des microservices métiers et la gateway dans un annuaire: ***microservices-registration-service***
+     
+- Images docker des services de l'application
+- Déploiement de la pile des images de l'application dans des containers docker avec un docker-compose file: [docker-compose](https://github.com/placidenduwayo1/fullstack-application-springboot-angular-deployment.git)
+   
+
+### Frontend:
+
+- framework angular
+- pattern observer RxJS
+
+### Architecture globale: 
+[architecture](https://drive.google.com/file/d/1cl-0_Iv-YiYb8pXeH6rUK0WdogEmwGNl/view?usp=share_link)

angular-project-front/.browserslistrc

@@ -0,0 +1,16 @@
+# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
+# For additional information regarding the format and rule options, please see:
+# https://github.com/browserslist/browserslist#queries
+
+# For the full list of supported browsers by the Angular framework, please see:
+# https://angular.io/guide/browser-support
+
+# You can see what browsers were selected by your queries by running:
+#   npx browserslist
+
+last 1 Chrome version
+last 1 Firefox version
+last 2 Edge major versions
+last 2 Safari major versions
+last 2 iOS major versions
+Firefox ESR

angular-project-front/.editorconfig

@@ -0,0 +1,16 @@
+# Editor configuration, see https://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.ts]
+quote_type = single
+
+[*.md]
+max_line_length = off
+trim_trailing_whitespace = false

angular-project-front/.eslintrc.json

@@ -0,0 +1,46 @@
+{
+  "root": true,
+  "ignorePatterns": [
+    "projects/**/*"
+  ],
+  "overrides": [
+    {
+      "files": [
+        "*.ts"
+      ],
+      "extends": [
+        "eslint:recommended",
+        "plugin:@typescript-eslint/recommended",
+        "plugin:@angular-eslint/recommended",
+        "plugin:@angular-eslint/template/process-inline-templates"
+      ],
+      "rules": {
+        "@angular-eslint/directive-selector": [
+          "error",
+          {
+            "type": "attribute",
+            "prefix": "app",
+            "style": "camelCase"
+          }
+        ],
+        "@angular-eslint/component-selector": [
+          "error",
+          {
+            "type": "element",
+            "prefix": "app",
+            "style": "kebab-case"
+          }
+        ]
+      }
+    },
+    {
+      "files": [
+        "*.html"
+      ],
+      "extends": [
+        "plugin:@angular-eslint/template/recommended"
+      ],
+      "rules": {}
+    }
+  ]
+}

angular-project-front/.gitignore

@@ -0,0 +1,42 @@
+# See http://help.github.com/ignore-files/ for more about ignoring files.
+
+# Compiled output
+/dist
+/tmp
+/out-tsc
+/bazel-out
+
+# Node
+/node_modules
+npm-debug.log
+yarn-error.log
+
+# IDEs and editors
+.idea/
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# Visual Studio Code
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+.history/*
+
+# Miscellaneous
+/.angular/cache
+.sass-cache/
+/connect.lock
+/coverage
+/libpeerconnection.log
+testem.log
+/typings
+
+# System files
+.DS_Store
+Thumbs.db

angular-project-front/.vscode/extensions.json

@@ -0,0 +1,4 @@
+{
+  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=827846
+  "recommendations": ["angular.ng-template"]
+}

angular-project-front/.vscode/launch.json

@@ -0,0 +1,20 @@
+{
+  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "name": "ng serve",
+      "type": "pwa-chrome",
+      "request": "launch",
+      "preLaunchTask": "npm: start",
+      "url": "http://localhost:4200/"
+    },
+    {
+      "name": "ng test",
+      "type": "chrome",
+      "request": "launch",
+      "preLaunchTask": "npm: test",
+      "url": "http://localhost:9876/debug.html"
+    }
+  ]
+}

angular-project-front/.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+    "terminal.explorerKind": "external"
+}

angular-project-front/.vscode/tasks.json

@@ -0,0 +1,42 @@
+{
+  // For more information, visit: https://go.microsoft.com/fwlink/?LinkId=733558
+  "version": "2.0.0",
+  "tasks": [
+    {
+      "type": "npm",
+      "script": "start",
+      "isBackground": true,
+      "problemMatcher": {
+        "owner": "typescript",
+        "pattern": "$tsc",
+        "background": {
+          "activeOnStart": true,
+          "beginsPattern": {
+            "regexp": "(.*?)"
+          },
+          "endsPattern": {
+            "regexp": "bundle generation complete"
+          }
+        }
+      }
+    },
+    {
+      "type": "npm",
+      "script": "test",
+      "isBackground": true,
+      "problemMatcher": {
+        "owner": "typescript",
+        "pattern": "$tsc",
+        "background": {
+          "activeOnStart": true,
+          "beginsPattern": {
+            "regexp": "(.*?)"
+          },
+          "endsPattern": {
+            "regexp": "bundle generation complete"
+          }
+        }
+      }
+    }
+  ]
+}

angular-project-front/Dockerfile

@@ -0,0 +1,7 @@
+FROM node:14.21.3
+WORKDIR /frontend-app
+COPY package.json .
+RUN npm install
+COPY . .
+EXPOSE 4200
+CMD [ "ng","serve" ]

angular-project-front/angular.json

@@ -0,0 +1,155 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "angular13-project-train-front": {
+      "projectType": "application",
+      "schematics": {
+        "@schematics/angular:component": {
+          "style": "scss",
+          "skipTests": true
+        },
+        "@schematics/angular:class": {
+          "skipTests": true
+        },
+        "@schematics/angular:directive": {
+          "skipTests": true
+        },
+        "@schematics/angular:guard": {
+          "skipTests": true
+        },
+        "@schematics/angular:interceptor": {
+          "skipTests": true
+        },
+        "@schematics/angular:pipe": {
+          "skipTests": true
+        },
+        "@schematics/angular:resolver": {
+          "skipTests": true
+        },
+        "@schematics/angular:service": {
+          "skipTests": true
+        },
+        "@schematics/angular:application": {
+          "strict": true
+        }
+      },
+      "root": "",
+      "sourceRoot": "src",
+      "prefix": "app",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:browser",
+          "options": {
+            "outputPath": "dist/angular13-project-train-front",
+            "index": "src/index.html",
+            "main": "src/main.ts",
+            "polyfills": "src/polyfills.ts",
+            "tsConfig": "tsconfig.app.json",
+            "inlineStyleLanguage": "scss",
+            "assets": [
+              "src/favicon.ico",
+              "src/assets"
+            ],
+            "styles": [
+              "src/styles.scss",
+              "node_modules/bootstrap/dist/css/bootstrap.min.css",
+              "node_modules/font-awesome/css/font-awesome.min.css",
+              "node_modules/primeicons/primeicons.css",
+              "node_modules/primeng/resources/themes/lara-light-blue/theme.css",
+              "node_modules/primeng/resources/primeng.min.css"
+            ],
+            "scripts": [
+              "node_modules/jquery/dist/jquery.min.js",
+              "node_modules/bootstrap/dist/js/bootstrap.min.js"
+            ]
+          },
+          "configurations": {
+            "production": {
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "2mb",
+                  "maximumError": "5mb"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "2mb",
+                  "maximumError": "5mb"
+                }
+              ],
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.prod.ts"
+                }
+              ],
+              "outputHashing": "all"
+            },
+            "development": {
+              "buildOptimizer": false,
+              "optimization": false,
+              "vendorChunk": true,
+              "extractLicenses": false,
+              "sourceMap": true,
+              "namedChunks": true
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "configurations": {
+            "production": {
+              "browserTarget": "angular13-project-train-front:build:production"
+            },
+            "development": {
+              "browserTarget": "angular13-project-train-front:build:development"
+            }
+          },
+          "defaultConfiguration": "development"
+        },
+        "extract-i18n": {
+          "builder": "@angular-devkit/build-angular:extract-i18n",
+          "options": {
+            "browserTarget": "angular13-project-train-front:build"
+          }
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "main": "src/test.ts",
+            "polyfills": "src/polyfills.ts",
+            "tsConfig": "tsconfig.spec.json",
+            "karmaConfig": "karma.conf.js",
+            "inlineStyleLanguage": "scss",
+            "assets": [
+              "src/favicon.ico",
+              "src/assets"
+            ],
+            "styles": [
+              "src/styles.scss"
+            ],
+            "scripts": []
+          }
+        },
+        "lint": {
+          "builder": "@angular-eslint/builder:lint",
+          "options": {
+            "lintFilePatterns": [
+              "src/**/*.ts",
+              "src/**/*.html"
+            ]
+          }
+        }
+      }
+    }
+  },
+  "cli": {
+    "analytics": "1a0066d5-a0ba-4af2-a9bd-5cf9ff85c677",
+    "schematicCollections": [
+      "@angular-eslint/schematics"
+    ]
+  }
+}

angular-project-front/karma.conf.js

@@ -0,0 +1,44 @@
+// Karma configuration file, see link for more information
+// https://karma-runner.github.io/1.0/config/configuration-file.html
+
+module.exports = function (config) {
+  config.set({
+    basePath: '',
+    frameworks: ['jasmine', '@angular-devkit/build-angular'],
+    plugins: [
+      require('karma-jasmine'),
+      require('karma-chrome-launcher'),
+      require('karma-jasmine-html-reporter'),
+      require('karma-coverage'),
+      require('@angular-devkit/build-angular/plugins/karma')
+    ],
+    client: {
+      jasmine: {
+        // you can add configuration options for Jasmine here
+        // the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html
+        // for example, you can disable the random execution with `random: false`
+        // or set a specific seed with `seed: 4321`
+      },
+      clearContext: false // leave Jasmine Spec Runner output visible in browser
+    },
+    jasmineHtmlReporter: {
+      suppressAll: true // removes the duplicated traces
+    },
+    coverageReporter: {
+      dir: require('path').join(__dirname, './coverage/angular13-project-train-front'),
+      subdir: '.',
+      reporters: [
+        { type: 'html' },
+        { type: 'text-summary' }
+      ]
+    },
+    reporters: ['progress', 'kjhtml'],
+    port: 9876,
+    colors: true,
+    logLevel: config.LOG_INFO,
+    autoWatch: true,
+    browsers: ['Chrome'],
+    singleRun: false,
+    restartOnFileChange: true
+  });
+};

angular-project-front/package.json

@@ -0,0 +1,56 @@
+{
+  "name": "angular13-project-train-front",
+  "version": "0.0.0",
+  "scripts": {
+    "ng": "ng",
+    "start": "ng serve",
+    "build": "ng build",
+    "watch": "ng build --watch --configuration development",
+    "test": "ng test",
+    "lint": "ng lint"
+  },
+  "private": true,
+  "dependencies": {
+    "@angular-devkit/core": "^15.2.1",
+    "@angular/animations": "^15.2.0",
+    "@angular/cdk": "^15.2.0",
+    "@angular/common": "^15.2.0",
+    "@angular/compiler": "^15.2.0",
+    "@angular/core": "^15.2.0",
+    "@angular/forms": "^15.2.0",
+    "@angular/material": "^15.2.0",
+    "@angular/platform-browser": "^15.2.0",
+    "@angular/platform-browser-dynamic": "^15.2.0",
+    "@angular/router": "^15.2.0",
+    "bootstrap": "^5.2.3",
+    "font-awesome": "^4.7.0",
+    "jquery": "^3.6.2",
+    "primeicons": "^6.0.1",
+    "primeng": "^15.2.0",
+    "rxjs": "~7.5.0",
+    "tslib": "^2.3.0",
+    "zone.js": "~0.11.4"
+  },
+  "devDependencies": {
+    "@angular-devkit/build-angular": "^15.2.1",
+    "@angular-eslint/builder": "15.2.1",
+    "@angular-eslint/eslint-plugin": "15.2.1",
+    "@angular-eslint/eslint-plugin-template": "15.2.1",
+    "@angular-eslint/schematics": "15.2.1",
+    "@angular-eslint/template-parser": "15.2.1",
+    "@angular/cli": "^15.2.0",
+    "@angular/compiler-cli": "^15.2.0",
+    "@types/jasmine": "~3.10.0",
+    "@types/node": "^12.11.1",
+    "@typescript-eslint/eslint-plugin": "5.48.2",
+    "@typescript-eslint/parser": "5.48.2",
+    "eslint": "^8.33.0",
+    "jasmine-core": "~4.0.0",
+    "karma": "~6.3.0",
+    "karma-chrome-launcher": "~3.1.0",
+    "karma-coverage": "~2.1.0",
+    "karma-jasmine": "~4.0.0",
+    "karma-jasmine-html-reporter": "~1.7.0",
+    "typescript": "^4.9.5"
+  }
+}

angular-project-front/src/app/app-routing.module.ts

@@ -0,0 +1,10 @@
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+
+const routes: Routes = [];
+
+@NgModule({
+  imports: [RouterModule.forRoot(routes)],
+  exports: [RouterModule]
+})
+export class AppRoutingModule { }

angular-project-front/src/app/app.component.html

@@ -0,0 +1,2 @@
+<app-base-menu></app-base-menu>
+<router-outlet></router-outlet>

angular-project-front/src/app/app.component.ts

@@ -0,0 +1,10 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-root',
+  templateUrl: './app.component.html',
+  styleUrls: ['./app.component.scss']
+})
+export class AppComponent {
+  title = 'angular training project front';
+}

angular-project-front/src/app/app.module.ts

@@ -0,0 +1,42 @@
+import { ModuleProjectManagerModule } from './pages/module-project-manager/module-project-manager.module';
+import { ModuleCompanyManagerModule } from './pages/module-company-manager/module-company-manager.module';
+import { ModuleEmployeeManagerModule } from './pages/module-employee-manager/module-employee-manger.module';
+import { ModuleAddressManagerModule } from './pages/module-address-manager/module-address-manager.module';
+import { ModuleAccueilModule } from './pages/module-accueil/module-accueil.module';
+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+
+import { AppRoutingModule } from './app-routing.module';
+import { AppComponent } from './app.component';
+import { HttpClientModule } from '@angular/common/http';
+import { BaseMenuComponent } from './pages/base-menu/base-menu.component';
+import { LayoutModule } from '@angular/cdk/layout';
+import { MatToolbarModule } from '@angular/material/toolbar';
+import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
+import { MatSidenavModule } from '@angular/material/sidenav';
+import { MatIconModule } from '@angular/material/icon';
+import { MatLegacyListModule as MatListModule } from '@angular/material/legacy-list';
+
+@NgModule({
+  declarations: [AppComponent, BaseMenuComponent],
+  imports: [
+    BrowserModule,
+    AppRoutingModule,
+    HttpClientModule,
+    LayoutModule,
+    MatToolbarModule,
+    MatButtonModule,
+    MatSidenavModule,
+    MatIconModule,
+    MatListModule,
+    BrowserAnimationsModule,
+    ModuleAccueilModule,
+    ModuleAddressManagerModule,
+    ModuleEmployeeManagerModule,
+    ModuleCompanyManagerModule,
+    ModuleProjectManagerModule,
+  ],
+  bootstrap: [AppComponent],
+})
+export class AppModule {}

angular-project-front/src/app/pages/base-menu/base-menu.component.html

@@ -0,0 +1,30 @@
+<mat-sidenav-container class="sidenav-container">
+  <mat-sidenav #drawer class="sidenav" fixedInViewport
+      [attr.role]="(isHandset$ | async) ? 'dialog' : 'navigation'"
+      [mode]="(isHandset$ | async) ? 'over' : 'side'"
+      [opened]="(isHandset$ | async) === false">
+    <mat-toolbar><a mat-list-item routerLink="/"><img src="../assets/natan.png" width="100"/></a></mat-toolbar>
+    <mat-nav-list>
+      <a mat-list-item routerLink="/">Welcome</a>
+      <a mat-list-item routerLink="/addresses-management">addresses</a>
+      <a mat-list-item routerLink="/employees-management">employees</a>
+      <a mat-list-item routerLink="/companies-management">companies</a>
+      <a mat-list-item routerLink="/projects-management">projects</a>
+    </mat-nav-list>
+  </mat-sidenav>
+  <mat-sidenav-content>
+    <mat-toolbar>
+      <button
+        type="button"
+        aria-label="Toggle sidenav"
+        mat-icon-button
+        (click)="drawer.toggle()"
+        *ngIf="isHandset$ | async">
+        <mat-icon aria-label="Side nav toggle icon">menu</mat-icon>
+      </button>
+
+      full stack application microservices-oriented demo: clean architecture-spring cloud-microservices registration-rxjs angular
+    </mat-toolbar>
+    <!-- Add Content Here -->
+  </mat-sidenav-content>
+</mat-sidenav-container>

angular-project-front/src/app/pages/base-menu/base-menu.component.scss

@@ -0,0 +1,17 @@
+.sidenav-container {
+  height: 100%;
+}
+
+.sidenav {
+  width: 200px;
+}
+
+.sidenav .mat-toolbar {
+  background: inherit;
+}
+
+.mat-toolbar.mat-primary {
+  position: sticky;
+  top: 0;
+  z-index: 1;
+}

angular-project-front/src/app/pages/base-menu/base-menu.component.ts

@@ -0,0 +1,21 @@
+import { Component } from '@angular/core';
+import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
+import { Observable } from 'rxjs';
+import { map, shareReplay } from 'rxjs/operators';
+
+@Component({
+  selector: 'app-base-menu',
+  templateUrl: './base-menu.component.html',
+  styleUrls: ['./base-menu.component.scss']
+})
+export class BaseMenuComponent {
+
+  isHandset$: Observable<boolean> = this.breakpointObserver.observe(Breakpoints.Handset)
+    .pipe(
+      map(result => result.matches),
+      shareReplay()
+    );
+
+  constructor(private breakpointObserver: BreakpointObserver) {}
+
+}

angular-project-front/src/app/pages/module-accueil/compo-accueil/compo-accueil.component.html

@@ -0,0 +1,15 @@
+
+<div class="container mt-5">
+  <div class="row d-flex justify-content-left">
+
+    <div class="card bg-light" style="width: 20rem;">
+      <div class="card-body">
+        <h4 class="card-title">Welcome to Natan</h4>
+        <p class="card-text">NATAN est palindrome</p>
+        <p>Ce qui fait de NATAN le meilleur</p>
+        <p>Constantly innovating</p>
+      </div>
+    </div>
+
+  </div>
+</div>

angular-project-front/src/app/pages/module-accueil/compo-accueil/compo-accueil.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-compo-accueil',
+  templateUrl: './compo-accueil.component.html',
+  styleUrls: ['./compo-accueil.component.scss']
+})
+export class CompoAccueilComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

angular-project-front/src/app/pages/module-accueil/module-accueil-routing.module.ts

@@ -0,0 +1,15 @@
+import { CompoAccueilComponent } from './compo-accueil/compo-accueil.component';
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+
+const routes: Routes = [
+  {
+    path:"", component: CompoAccueilComponent
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
+})
+export class ModuleAccueilRoutingModule { }

angular-project-front/src/app/pages/module-accueil/module-accueil.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { ModuleAccueilRoutingModule } from './module-accueil-routing.module';
+import { CompoAccueilComponent } from './compo-accueil/compo-accueil.component';
+
+
+@NgModule({
+  declarations: [
+    CompoAccueilComponent
+  ],
+  imports: [
+    CommonModule,
+    ModuleAccueilRoutingModule
+  ]
+})
+export class ModuleAccueilModule { }

angular-project-front/src/app/pages/module-address-manager/compo-address-manager/compo-address-manager.component.html

@@ -0,0 +1,9 @@
+
+<header>
+  <div class="container mt-2">
+    <button class="btn btn-outline-info" (click)="onPrintAddresses()">print addresses</button> &nbsp;
+    <button class="btn btn-outline-info" (click)="onCreateAddress()">create address</button>
+  </div>
+</header>
+
+<app-sub-compo-address-printer [addressesList]="addressesList"></app-sub-compo-address-printer>

angular-project-front/src/app/pages/module-address-manager/compo-address-manager/compo-address-manager.component.ts

@@ -0,0 +1,58 @@
+import { AddressService } from '../../../shared/services/service-REST/addresses.service';
+import { Address } from '../../../shared/models/address/address.model';
+import { AddressEvent } from '../../../shared/models/events.model';
+import { AddressEventPublisher } from '../../../shared/events-publisher/events.publisher';
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+
+@Component({
+  selector: 'app-compo-address-manager',
+  templateUrl: './compo-address-manager.component.html',
+  styleUrls: ['./compo-address-manager.component.scss']
+})
+export class CompoAddressPrinterComponent implements OnInit {
+
+  constructor(
+    private activatedRoute: ActivatedRoute,
+    private addressEventPubliser : AddressEventPublisher,
+    private addressService: AddressService,
+    private router: Router) { }
+
+  addressesList!: Array<Address>;
+
+  ngOnInit(): void {
+    this.addressEventPubliser.addressEventObservable.subscribe((addressEvent: AddressEvent)=>{
+      switch(addressEvent){
+
+        case AddressEvent.GET_ALL_ADDRESSES:
+          this.activatedRoute.data.subscribe(addresses=>{
+            this.addressesList = addresses["getAllAddressesResolve"];
+            console.log(addresses)
+            console.log(AddressEvent.GET_ALL_ADDRESSES)
+          });
+          console.log(addressEvent);
+          break;
+
+        case AddressEvent.CREATE_ADDRESS_FORM:
+          console.log(addressEvent);
+          this.router.navigateByUrl("address-form-create");
+          break;
+
+        case AddressEvent.REFRESH:
+          this.addressService.getAllAddresses().subscribe((addresses: Array<Address>)=>{
+            this.addressesList=addresses
+          });
+          break;
+      }
+    });
+  }
+
+  onPrintAddresses(){
+    this.addressEventPubliser.publishAddressEvent(AddressEvent.GET_ALL_ADDRESSES)
+  }
+
+  onCreateAddress(){
+    this.addressEventPubliser.publishAddressEvent(AddressEvent.CREATE_ADDRESS_FORM);
+  }
+
+}

angular-project-front/src/app/pages/module-address-manager/compo-address-manager/sub-compo-address-create/sub-compo-address-create.component.html

@@ -0,0 +1,84 @@
+<div class="container mt-2">
+  <div class="card">
+    <div class="card-header">Address infos</div>
+    <div class="card-body">
+      <form [formGroup]="addressForm" (ngSubmit)="onAddressFormSubmit(); addressForm.reset()">
+        <label for="num">num</label>
+        <input
+          type="text"
+          formControlName="num"
+          class="form-control"
+          [ngClass]="{
+            'is-invalid':
+              addressForm.controls['num'].touched &&
+              addressForm.controls['num'].invalid
+          }"
+        />
+        <div class="invalid-feedback">
+          <span *ngIf="addressForm.controls['num'].errors?.['required']">
+            num required
+          </span>
+          <span *ngIf="addressForm.controls['num'].errors?.['min']">
+            invalid num
+          </span>
+        </div>
+
+        <label for="street">street</label>
+        <input
+          type="text"
+          formControlName="street"
+          class="form-control"
+          [ngClass]="{
+            'is-invalid':
+              addressForm.controls['street'].touched &&
+              addressForm.controls['street'].invalid
+          }"
+        />
+
+        <div class="invalid-feedback">
+          <span *ngIf="addressForm.controls['street'].errors?.['required']">
+            street name required
+          </span>
+          <span *ngIf="addressForm.controls['street'].errors?.['minlength']">
+            street name length is short
+          </span>
+        </div>
+
+
+        <label for="pb">pb</label>
+        <input type="text" formControlName="pb" class="form-control"
+        [ngClass]="{'is-invalid':addressForm.controls['pb'].touched && addressForm.controls['pb'].invalid}"/>
+
+        <div class="invalid-feedback">
+          <span *ngIf="addressForm.controls['pb'].errors?.['required']"> zip code required</span>
+          <span *ngIf="addressForm.controls['pb'].errors?.['min']"> zip code not for France</span>
+        </div>
+
+        <label for="city">city</label>
+        <input type="text" formControlName="city" class="form-control"
+        [ngClass]="{'is-invalid':addressForm.controls['city'].touched && addressForm.controls['city'].invalid}"
+        />
+
+        <div class="invalid-feedback">
+          <span *ngIf="addressForm.controls['city'].errors?.['required']"> city required</span>
+          <span *ngIf="addressForm.controls['city'].errors?.['minlength']"> city length invalid</span>
+        </div>
+
+        <label for="country">country</label>
+        <input type="text" formControlName="country" class="form-control"
+        [ngClass]="{'is-invalid':addressForm.controls['country'].touched && addressForm.controls['country'].invalid}"
+        />
+
+        <div class="invalid-feedback">
+          <span *ngIf="addressForm.controls['country'].errors?.['required']"> country required</span>
+          <span *ngIf="addressForm.controls['country'].errors?.['minlength']"> country length very short</span>
+          <span *ngIf="addressForm.controls['country'].errors?.['maxlength']"> country length very long</span>
+        </div>
+
+        <div class="text-center mt-2">
+          <button type="submit" class="btn btn-outline-primary">save</button>
+        </div>
+      </form>
+    </div>
+  </div>
+</div>

angular-project-front/src/app/pages/module-address-manager/compo-address-manager/sub-compo-address-create/sub-compo-address-create.component.ts

@@ -0,0 +1,38 @@
+import { Address } from '../../../../shared/models/address/address.model';
+import { AddressService } from '../../../../shared/services/service-REST/addresses.service';
+import { Component, OnInit } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+
+@Component({
+  selector: 'app-sub-compo-address-create',
+  templateUrl: './sub-compo-address-create.component.html',
+  styleUrls: ['./sub-compo-address-create.component.scss']
+})
+export class SubCompoAddressCreateComponent implements OnInit {
+
+  addressForm!: FormGroup;
+  constructor(private formBuilder: FormBuilder,
+    private addressService: AddressService) { }
+
+  ngOnInit(): void {
+    this.addressForm = this.formBuilder.group({
+      addressID:['', Validators.required],
+      num:['', [Validators.required, Validators.min(1)]],
+      street: ['', [Validators.required, Validators.minLength(5)]],
+      pb: ['',[Validators.required, Validators.min(10000)]],
+      city: ['', [Validators.required, Validators.minLength(5)]],
+      country: ['', [Validators.required, Validators.minLength(5), Validators.maxLength(50)]]
+    });
+
+  }
+
+  onAddressFormSubmit(){
+    if(window.confirm("CONFIRM")){
+      this.addressService.createAddress(this.addressForm.value).subscribe((newAddress: Address)=>{
+        console.log(newAddress);
+      })
+    }
+
+  }
+
+}

angular-project-front/src/app/pages/module-address-manager/compo-address-manager/sub-compo-address-printer/sub-compo-address-printer.component.html

@@ -0,0 +1,51 @@
+<div class="container mt-3">
+<p-table
+[value]="addressesList"
+responsiveLayout="scroll"
+styleClass="p-datatable-striped"
+*ngIf="addressesList"
+[paginator]="true"
+[rows]="10"
+[showCurrentPageReport]="true"
+currentPageReportTemplate="{first} - {last} of {totalRecords} entries"
+[rowsPerPageOptions]="[10, 20, 30]"
+class="p-3"
+>
+<ng-template pTemplate="body" let-address>
+  <tr>
+    <td>{{ address.num }}</td>
+    <td>{{ address.street }}</td>
+    <td>{{ address.pb }}</td>
+    <td>{{ address.city }}</td>
+    <td>{{ address.country }}</td>
+    <td>
+      <button class="btn">
+        <i
+          class="fa fa-pencil"
+          style="color: mediumturquoise"
+          (click)="onAddressUpdate(address)"
+        ></i>
+      </button>
+    </td>
+    <td>
+      <button class="btn">
+        <i
+          class="fa fa-trash"
+          style="color: red"
+          (click)="onAddressDelete(address.addressID)"
+        ></i>
+      </button>
+    </td>
+    <td>
+      <button class="btn">
+        <i
+        class="fa fa-search"
+        style="color: mediumturquoise"
+        (click)="onPrintEmployeesLivigOnThisAddress(address.addressID)"
+      > employees </i>
+      </button>
+    </td>
+  </tr>
+</ng-template>
+
+</p-table>

angular-project-front/src/app/pages/module-address-manager/compo-address-manager/sub-compo-address-printer/sub-compo-address-printer.component.ts

@@ -0,0 +1,55 @@
+import { AddressEventPublisher } from '../../../../shared/events-publisher/events.publisher';
+import {  Router } from '@angular/router';
+import { AddressService } from '../../../../shared/services/service-REST/addresses.service';
+import { Address } from '../../../../shared/models/address/address.model';
+import { Component, Input, OnInit } from '@angular/core';
+import { AddressEvent } from 'src/app/shared/models/events.model';
+
+@Component({
+  selector: 'app-sub-compo-address-printer',
+  templateUrl: './sub-compo-address-printer.component.html',
+  styleUrls: ['./sub-compo-address-printer.component.scss'],
+})
+export class SubCompoAddressPrinterComponent implements OnInit{
+  @Input() addressesList!: Address[];
+
+  constructor(
+    private addressService: AddressService,
+    private router: Router,
+    private addressEventPublisher: AddressEventPublisher,
+  ) {}
+
+
+  ngOnInit(): void {
+    this.addressEventPublisher.addressEventObservable.subscribe((addressEvent: AddressEvent)=>{
+      switch(addressEvent) {
+        case AddressEvent.EMPLOYEES_AT_ADDRESS:
+          this.router.navigateByUrl('employees-at-address/'+this.addressEmployeesRelated);
+          console.log(addressEvent);
+          break;
+      }
+    })
+  }
+
+
+  onAddressUpdate(address: Address) {
+    this.router.navigateByUrl('address-form-update/' + address.addressID);
+  }
+
+  onAddressDelete(addressID: string) {
+    if (window.confirm('CONFIRM DELETE')) {
+      this.addressService
+        .deleteAddress(addressID)
+        .subscribe(()=>{
+          this.addressEventPublisher.publishAddressEvent(AddressEvent.REFRESH);
+        });
+    }
+  }
+
+  addressEmployeesRelated!: number;
+
+  onPrintEmployeesLivigOnThisAddress(addressID: number){
+    this.addressEmployeesRelated = addressID;
+    this.addressEventPublisher.publishAddressEvent(AddressEvent.EMPLOYEES_AT_ADDRESS);
+  }
+}

angular-project-front/src/app/pages/module-address-manager/compo-address-manager/sub-compo-address-update/sub-compo-address-update.component.html

@@ -0,0 +1,84 @@
+<div class="container mt-2" *ngIf="addressForm">
+ <div class="card">
+  <div class="card-header">Address infos</div>
+  <div class="card-body">
+
+    <form [formGroup]="addressForm" (ngSubmit)="onAddressFormSubmit(); addressForm.reset()">
+      <label for="num">num</label>
+      <input
+        type="text"
+        formControlName="num"
+        class="form-control"
+        [ngClass]="{
+          'is-invalid':
+            addressForm.controls['num'].touched &&
+            addressForm.controls['num'].invalid
+        }"
+      />
+      <div class="invalid-feedback">
+        <span *ngIf="addressForm.controls['num'].errors?.['required']">
+          num required
+        </span>
+        <span *ngIf="addressForm.controls['num'].errors?.['min']">
+          invalid num
+        </span>
+      </div>
+
+      <label for="street">street</label>
+      <input
+        type="text"
+        formControlName="street"
+        class="form-control"
+        [ngClass]="{
+          'is-invalid':
+            addressForm.controls['street'].touched &&
+            addressForm.controls['street'].invalid
+        }"
+      />
+
+      <div class="invalid-feedback">
+        <span *ngIf="addressForm.controls['street'].errors?.['required']">
+          street name required
+        </span>
+        <span *ngIf="addressForm.controls['street'].errors?.['minlength']">
+          street name length is short
+        </span>
+      </div>
+
+
+      <label for="pb">pb</label>
+      <input type="text" formControlName="pb" class="form-control"
+      [ngClass]="{'is-invalid':addressForm.controls['pb'].touched && addressForm.controls['pb'].invalid}"/>
+
+      <div class="invalid-feedback">
+        <span *ngIf="addressForm.controls['pb'].errors?.['required']"> zip code required</span>
+        <span *ngIf="addressForm.controls['pb'].errors?.['min']"> zip code not for France</span>
+      </div>
+
+      <label for="city">city</label>
+      <input type="text" formControlName="city" class="form-control"
+      [ngClass]="{'is-invalid':addressForm.controls['city'].touched && addressForm.controls['city'].invalid}"
+      />
+
+      <div class="invalid-feedback">
+        <span *ngIf="addressForm.controls['city'].errors?.['required']"> city required</span>
+        <span *ngIf="addressForm.controls['city'].errors?.['minlength']"> city length invalid</span>
+      </div>
+
+      <label for="country">country</label>
+      <input type="text" formControlName="country" class="form-control"
+      [ngClass]="{'is-invalid':addressForm.controls['country'].touched && addressForm.controls['country'].invalid}"
+      />
+
+      <div class="invalid-feedback">
+        <span *ngIf="addressForm.controls['country'].errors?.['required']"> country required</span>
+        <span *ngIf="addressForm.controls['country'].errors?.['minlength']"> country length very short</span>
+        <span *ngIf="addressForm.controls['country'].errors?.['maxlength']"> country length very long</span>
+      </div>
+
+      <button class="btn btn-outline-info mt-2" [disabled]="addressForm.invalid">save</button>
+    </form>
+
+  </div>
+ </div>
+</div>

angular-project-front/src/app/pages/module-address-manager/compo-address-manager/sub-compo-address-update/sub-compo-address-update.component.ts

@@ -0,0 +1,41 @@
+import { FormGroup, FormBuilder, Validators } from '@angular/forms';
+import { ActivatedRoute } from '@angular/router';
+import { AddressService } from '../../../../shared/services/service-REST/addresses.service';
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-sub-compo-address-update',
+  templateUrl: './sub-compo-address-update.component.html',
+  styleUrls: ['./sub-compo-address-update.component.scss']
+})
+export class SubCompoAddressUpdateComponent implements OnInit {
+  addressForm!: FormGroup;
+
+  constructor(private addressService: AddressService,
+    private activatedRoute: ActivatedRoute,
+    private formBuilder: FormBuilder) {}
+
+  ngOnInit(): void {
+
+    this.activatedRoute.data.subscribe((data)=>{
+      let address = data['getAddressByIDResolve'];
+      this.addressForm = this.formBuilder.group({
+        addressID:[address.addressID],
+        num:[address.num, [Validators.required, Validators.min(1)]],
+        street: [address.street, [Validators.required, Validators.minLength(5)]],
+        pb: [address.pb,[Validators.required, Validators.min(10000)]],
+        city: [address.city, [Validators.required, Validators.minLength(5)]],
+        country: [address.country, [Validators.required, Validators.minLength(5), Validators.maxLength(50)]]
+      });
+    });
+  }
+
+  onAddressFormSubmit(){
+    if(window.confirm("COMFIRM ADDRESS UPDATE")){
+      this.addressService.updateAddress(this.addressForm.value).subscribe(updatedAddress=>{
+        console.log(updatedAddress);
+      });
+    }
+  }
+
+}

angular-project-front/src/app/pages/module-address-manager/compo-address-manager/sub-compo-print-employees-at-address/sub-compo-print-employees-at-address.component.html

@@ -0,0 +1,35 @@
+<div class="container">
+
+  <p-table
+  [value]="employeesAtAddress"
+  responsiveLayout="scroll"
+  styleClass="p-datatable-striped"
+  [paginator]="true"
+  [rows]="4"
+  [showCurrentPageReport]="true"
+  currentPageReportTemplate="{first} - {last} of {totalRecords} entries"
+  [rowsPerPageOptions]="[4, 8, 12]"
+  class="p-3"
+>
+<ng-template pTemplate="header">
+  <tr>
+    <th>ID</th><th>firstname</th><th>lastname</th><th>email</th><th>hire date</th>
+    <th>state</th> <th>type</th>
+  </tr>
+</ng-template>
+
+<ng-template pTemplate="body" let-employee>
+  <tr>
+    <td>{{ employee.employeeID }}</td>
+      <td>{{ employee.firstname | titlecase}}</td>
+      <td>{{ employee.lastname | titlecase}}</td>
+      <td>{{ employee.email | lowercase }}</td>
+      <td>{{ employee.hireDate | date : "dd-MM-yyyy:HH:mm" }}</td>
+      <td>{{ employee.employeeState }}</td>
+      <td>{{ employee.employeeType}}</td>
+
+  </tr>
+</ng-template>
+</p-table>
+
+</div>

angular-project-front/src/app/pages/module-address-manager/compo-address-manager/sub-compo-print-employees-at-address/sub-compo-print-employees-at-address.component.ts

@@ -0,0 +1,19 @@
+import { ActivatedRoute } from '@angular/router';
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-sub-compo-print-employees-at-address',
+  templateUrl: './sub-compo-print-employees-at-address.component.html',
+  styleUrls: ['./sub-compo-print-employees-at-address.component.scss']
+})
+export class SubCompoPrintEmployeesAtAddressComponent implements OnInit{
+  employeesAtAddress!: Array<any>;
+  constructor(private activatedRoute: ActivatedRoute){}
+  ngOnInit(): void {
+    this.activatedRoute.data.subscribe(data=>{
+      this.employeesAtAddress = data['getEmployeesAtAddressResolve'];
+    });
+  }
+
+
+}

angular-project-front/src/app/pages/module-address-manager/module-address-manager-routing.module.ts

@@ -0,0 +1,42 @@
+import { SubCompoPrintEmployeesAtAddressComponent } from './compo-address-manager/sub-compo-print-employees-at-address/sub-compo-print-employees-at-address.component';
+import { GetAddressByIDResolve, GetEmployeesAtAddressResolve } from './../../shared/services/service-route-resolve/address-resolve/addresse.route.resolve';
+import { CompoAddressPrinterComponent as CompoAddressManagerComponent } from './compo-address-manager/compo-address-manager.component';
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { SubCompoAddressCreateComponent } from './compo-address-manager/sub-compo-address-create/sub-compo-address-create.component';
+import { SubCompoAddressUpdateComponent } from './compo-address-manager/sub-compo-address-update/sub-compo-address-update.component';
+import { GetAllAddressesResolve } from 'src/app/shared/services/service-route-resolve/address-resolve/addresse.route.resolve';
+
+const routes: Routes = [
+  {
+    path :"addresses-management", component: CompoAddressManagerComponent,
+    resolve:{
+      getAllAddressesResolve: GetAllAddressesResolve
+    }
+  }
+  ,
+  {
+    path:"address-form-create",
+    component: SubCompoAddressCreateComponent
+  },
+  {
+    path:'address-form-update/:addressID',
+    component: SubCompoAddressUpdateComponent,
+    resolve:{
+      getAddressByIDResolve: GetAddressByIDResolve
+    }
+  },
+  {
+    path:'employees-at-address/:addressID',
+    component: SubCompoPrintEmployeesAtAddressComponent,
+    resolve:{
+      getEmployeesAtAddressResolve: GetEmployeesAtAddressResolve
+    }
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
+})
+export class ModuleAddressManagerRoutingModule { }

angular-project-front/src/app/pages/module-address-manager/module-address-manager.module.ts

@@ -0,0 +1,28 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { TableModule } from 'primeng/table';
+import { ModuleAddressManagerRoutingModule } from './module-address-manager-routing.module';
+import { CompoAddressPrinterComponent as CompoAddressManagerComponent } from './compo-address-manager/compo-address-manager.component';
+import { SubCompoAddressPrinterComponent } from './compo-address-manager/sub-compo-address-printer/sub-compo-address-printer.component';
+import { ReactiveFormsModule } from '@angular/forms';
+import { SubCompoAddressCreateComponent } from './compo-address-manager/sub-compo-address-create/sub-compo-address-create.component';
+import { SubCompoAddressUpdateComponent } from './compo-address-manager/sub-compo-address-update/sub-compo-address-update.component';
+import { SubCompoPrintEmployeesAtAddressComponent } from './compo-address-manager/sub-compo-print-employees-at-address/sub-compo-print-employees-at-address.component';
+
+
+@NgModule({
+  declarations: [
+    CompoAddressManagerComponent,
+    SubCompoAddressPrinterComponent,
+    SubCompoAddressCreateComponent,
+    SubCompoAddressUpdateComponent,
+    SubCompoPrintEmployeesAtAddressComponent
+  ],
+  imports: [
+    CommonModule,
+    ModuleAddressManagerRoutingModule,
+    ReactiveFormsModule,
+    TableModule
+  ]
+})
+export class ModuleAddressManagerModule { }

angular-project-front/src/app/pages/module-company-manager/compo-company-manager/compo-company-manager.component.html

@@ -0,0 +1,10 @@
+<div class="container">
+  <button class="btn btn-outline-info" (click)="onPrintCompanies()">
+    print companies
+  </button>
+  &nbsp;
+  <button class="btn btn-outline-info" (click)="onCreateCompany()">
+    create a company
+  </button>
+</div>
+<app-sub-compo-company-printer [companies]="companies"></app-sub-compo-company-printer>

angular-project-front/src/app/pages/module-company-manager/compo-company-manager/compo-company-manager.component.ts

@@ -0,0 +1,53 @@
+import { CompanyEventPublisher } from '../../../shared/events-publisher/events.publisher';
+import { Company } from '../../../shared/models/company/company.model';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Component, OnInit } from '@angular/core';
+import { CompanyEvent } from 'src/app/shared/models/events.model';
+import { CompanyService } from 'src/app/shared/services/service-REST/companies.service';
+
+@Component({
+  selector: 'app-compo-company-manager',
+  templateUrl: './compo-company-manager.component.html',
+  styleUrls: ['./compo-company-manager.component.scss'],
+})
+export class CompoCompanyManagerComponent implements OnInit {
+  constructor(
+    private activatedRoute: ActivatedRoute,
+    private companyEventPublisher: CompanyEventPublisher,
+    private router: Router,
+    private companyService: CompanyService
+  ) {}
+
+  companies!: Array<Company>;
+
+  ngOnInit(): void {
+    this.companyEventPublisher.companyEventObservable.subscribe(
+      (companyEvent: CompanyEvent) => {
+        switch (companyEvent) {
+          case CompanyEvent.GET_ALL_COMPANIES:
+            this.activatedRoute.data.subscribe((data) => {
+              console.log(companyEvent);
+              this.companies = data['getAllCompaniesResolve'];
+              console.log(this.companies);
+            });
+            break;
+
+          case CompanyEvent.COMPANY_DELETED:
+            this.companyService.getAllCompanies().subscribe((data: Array<Company>)=>{
+              this.companies=data;
+            })
+            break;
+        }
+      }
+    );
+  }
+  onPrintCompanies() {
+    this.companyEventPublisher.publishCompanyEvent(
+      CompanyEvent.GET_ALL_COMPANIES
+    );
+  }
+
+  onCreateCompany() {
+    this.router.navigate(['/company-create']);
+  }
+}

angular-project-front/src/app/pages/module-company-manager/compo-company-manager/sub-compo-company-create/sub-compo-company-create.component.html

@@ -0,0 +1,83 @@
+<div class="container">
+  <div class="card">
+    <div class="card-header">Company infos</div>
+    <div class="card-body">
+      <form
+        #companyForm="ngForm"
+        (ngSubmit)="onCompanyCreate(); companyForm.resetForm()"
+      >
+        <label for="companyName">company name</label>
+        <input
+          type="text"
+          class="form-control"
+          name="companyName"
+          #companyName="ngModel"
+          [(ngModel)]="company.companyName"
+          [ngClass]="{
+            'is-invalid': companyName.touched && companyName.invalid
+          }"
+          required
+          minlength="4"
+          maxlength="20"
+        />
+
+        <div class="invalid-feedback">
+          <span *ngIf="companyName.errors?.['required']">required</span>
+          <span *ngIf="companyName.errors?.['minlength']"
+            >very short company name</span
+          >
+          <span *ngIf="companyName.errors?.['maxlength']"
+            >too long company name</span
+          >
+        </div>
+
+        <label for="companyType">type of company</label>
+        <select
+          class="form-control"
+          required
+          name="companyType"
+          #companyType="ngModel"
+          [(ngModel)]="company.companyType"
+        >
+          <option
+            *ngFor="let type of companyTypes | keyvalue"
+            [ngValue]="type.key"
+          >
+            {{ type.value }}
+          </option>
+        </select>
+
+        <div class="invalid-feedback">
+          <span *ngIf="companyType.errors?.['required']">required</span>
+        </div>
+
+        <label for="agency">agency</label>
+        <input
+          type="text"
+          class="form-control"
+          name="agency"
+          #agency="ngModel"
+          [(ngModel)]="company.agency"
+          [ngClass]="{
+            'is-invalid': agency.touched && agency.invalid
+          }"
+          required
+        />
+
+        <div class="invalid-feedback">
+          <span *ngIf="agency.errors?.['required']"> required</span>
+        </div>
+
+        <div class="text-center mt-2">
+          <button
+            type="submit"
+            class="btn btn-outline-primary"
+            [disabled]="companyForm.invalid"
+          >
+            save
+          </button>
+        </div>
+      </form>
+    </div>
+  </div>
+</div>

angular-project-front/src/app/pages/module-company-manager/compo-company-manager/sub-compo-company-create/sub-compo-company-create.component.ts

@@ -0,0 +1,24 @@
+import { Company } from '../../../../shared/models/company/company.model';
+import { Component } from '@angular/core';
+import { CompanyType } from 'src/app/shared/models/company/company.type';
+import { CompanyService } from 'src/app/shared/services/service-REST/companies.service';
+
+@Component({
+  selector: 'app-sub-compo-company-create',
+  templateUrl: './sub-compo-company-create.component.html',
+  styleUrls: ['./sub-compo-company-create.component.scss']
+})
+export class SubCompoCompanyCreateComponent  {
+
+  constructor(private companyService: CompanyService) { }
+  companyTypes = CompanyType;
+
+  company: Company = new Company();
+  onCompanyCreate(){
+    if(window.confirm("COMFIRM COMPANY CREATE")){
+      this.companyService.createCompany(this.company).subscribe((newCompany: Company)=>{
+        console.log(newCompany)
+      })
+    }
+  }
+}

angular-project-front/src/app/pages/module-company-manager/compo-company-manager/sub-compo-company-printer/sub-compo-company-printer.component.html

@@ -0,0 +1,58 @@
+<div class="container mt-3">
+  <p-table
+  [value]="companies"
+  responsiveLayout="scroll"
+  styleClass="p-datatable-striped"
+  *ngIf="companies"
+  [paginator]="true"
+  [rows]="9"
+  [showCurrentPageReport]="true"
+  currentPageReportTemplate="{first} - {last} of {totalRecords} entries"
+  [rowsPerPageOptions]="[9, 10, 11]"
+  class="p-3"
+  >
+  <ng-template pTemplate="header">
+    <tr>
+      <th>ID</th><th>name</th><th>type</th><th>connected date</th> <th>agency</th>
+      <th></th><th></th><th></th>
+    </tr>
+  </ng-template>
+  <ng-template pTemplate="body" let-company>
+    <tr>
+      <td>{{ company.companyID }}</td>
+      <td>{{ company.companyName }}</td>
+      <td>{{ company.companyType }}</td>
+      <td>{{company.connectedDate}} </td>
+      <td> {{company.agency}} </td>
+      <td>
+        <button class="btn">
+          <i
+            class="fa fa-pencil"
+            style="color: mediumturquoise"
+            (click)="onCompanyUpdate(company)"
+          ></i>
+        </button>
+      </td>
+      <td>
+        <button class="btn">
+          <i
+            class="fa fa-trash"
+            style="color: red"
+            (click)="onCompanyDelete(company.companyID)"
+          ></i>
+        </button>
+      </td>
+      <td>
+        <button class="btn">
+          <i
+            class="fa fa-search"
+            style="color: mediumturquoise"
+            (click)="onPrintProjectsRelated(company.companyID)"
+          > projects</i>
+        </button>
+      </td>
+    </tr>
+  </ng-template>
+
+  </p-table>
+

angular-project-front/src/app/pages/module-company-manager/compo-company-manager/sub-compo-company-printer/sub-compo-company-printer.component.ts

@@ -0,0 +1,58 @@
+import { Router } from '@angular/router';
+import { CompanyEventPublisher } from '../../../../shared/events-publisher/events.publisher';
+import { Company } from '../../../../shared/models/company/company.model';
+import { Component, Input, OnInit } from '@angular/core';
+import { CompanyEvent } from 'src/app/shared/models/events.model';
+import { CompanyService } from 'src/app/shared/services/service-REST/companies.service';
+
+@Component({
+  selector: 'app-sub-compo-company-printer',
+  templateUrl: './sub-compo-company-printer.component.html',
+  styleUrls: ['./sub-compo-company-printer.component.scss']
+})
+export class SubCompoCompanyPrinterComponent implements OnInit {
+
+  constructor(private companyEventPublisher: CompanyEventPublisher,
+    private companyService: CompanyService,
+    private router : Router) { }
+
+  @Input () companies!: Array<Company>;
+
+  ngOnInit(): void {
+    this.companyEventPublisher.companyEventObservable.subscribe((companyEvent: CompanyEvent)=>{
+      switch(companyEvent) {
+        case CompanyEvent.UPDATE_COMPANY_FORM:
+          this.router.navigateByUrl('company-update/'+this.idToUpdate);
+          console.log(companyEvent);
+          break;
+        case CompanyEvent.PROJECTS_ASSIGNEDTO_COMPANY:
+          this.router.navigateByUrl('projects-assignedto-company/'+this.companyIDProjectsRelated);
+          console.log(companyEvent);
+          break;
+      }
+    })
+  }
+
+  idToUpdate!: string;
+
+  onCompanyUpdate(company: Company){
+    this.idToUpdate = company.companyID;
+    this.companyEventPublisher.publishCompanyEvent(CompanyEvent.UPDATE_COMPANY_FORM)
+  }
+
+  onCompanyDelete(companyID: string){
+    if(window.confirm('CONFIRM COMPANY DELETE')){
+      this.companyService.deleteCompany(companyID).subscribe(
+        ()=>{
+          this.companyEventPublisher.publishCompanyEvent(CompanyEvent.REFRESH);
+        }
+      );
+    }
+  }
+
+  companyIDProjectsRelated!: string;
+  onPrintProjectsRelated(companyID: string){
+    this.companyIDProjectsRelated = companyID;
+    this.companyEventPublisher.publishCompanyEvent(CompanyEvent.PROJECTS_ASSIGNEDTO_COMPANY)
+  }
+}

angular-project-front/src/app/pages/module-company-manager/compo-company-manager/sub-compo-company-update/sub-compo-company-update.component.html

@@ -0,0 +1,72 @@
+<div class="container" *ngIf="companyForm">
+  <div class="card">
+    <div class="card-header">Company infos</div>
+    <div class="card-body">
+      <form [formGroup]="companyForm"
+        (ngSubmit)="onCompanyUpdate(); companyForm.reset()"
+      >
+        <label for="companyName">company name</label>
+        <input
+          type="text"
+          class="form-control"
+          formControlName="companyName"
+          [ngClass]="{
+            'is-invalid': companyForm.controls['companyName'].touched && companyForm.controls['companyName'].invalid
+          }"
+        />
+
+        <div class="invalid-feedback">
+          <span *ngIf="companyForm.controls['companyName'].errors?.['required']">required</span>
+          <span *ngIf="companyForm.controls['companyName'].errors?.['minlength']"
+            >very short company name</span
+          >
+          <span *ngIf="companyForm.controls['companyName'].errors?.['maxlength']"
+            >too long company name</span
+          >
+        </div>
+
+        <label for="companyType">type of company</label>
+        <select
+          class="form-control" formControlName="companyType"
+        >
+          <option
+            *ngFor="let type of companyTypes | keyvalue"
+            [ngValue]="type.value"
+          >
+            {{ type.value }}
+          </option>
+        </select>
+
+        <div class="invalid-feedback">
+          <span *ngIf="companyForm.controls['companyType'].errors?.['required']">required</span>
+        </div>
+
+        <label for="agency">agency</label>
+        <input
+          type="text"
+          class="form-control"
+          formControlName="agency"
+          [ngClass]="{
+            'is-invalid': companyForm.controls['agency'].touched && companyForm.controls['agency'].invalid
+          }"
+        />
+
+        <div class="invalid-feedback">
+          <span *ngIf="companyForm.controls['agency'].errors?.['required']"> required</span>
+          <span *ngIf="companyForm.controls['agency'].errors?.['minlength']"> required</span>
+        </div>
+
+        <div class="text-center mt-2">
+          <button
+            type="submit"
+            class="btn btn-outline-primary"
+            [disabled]="companyForm.invalid"
+          >
+            save
+          </button>
+        </div>
+      </form>
+    </div>
+  </div>
+</div>
+

angular-project-front/src/app/pages/module-company-manager/compo-company-manager/sub-compo-company-update/sub-compo-company-update.component.ts

@@ -0,0 +1,55 @@
+import { Company } from './../../../../shared/models/company/company.model';
+import { CompanyEventPublisher } from '../../../../shared/events-publisher/events.publisher';
+import { FormGroup, FormBuilder, Validators } from '@angular/forms';
+import { ActivatedRoute } from '@angular/router';
+import { Component, OnInit } from '@angular/core';
+import { CompanyEvent } from 'src/app/shared/models/events.model';
+import { CompanyType } from 'src/app/shared/models/company/company.type';
+import { CompanyService } from 'src/app/shared/services/service-REST/companies.service';
+
+@Component({
+  selector: 'app-sub-compo-company-update',
+  templateUrl: './sub-compo-company-update.component.html',
+  styleUrls: ['./sub-compo-company-update.component.scss'],
+})
+export class SubCompoCompanyUpdateComponent implements OnInit {
+  companyForm!: FormGroup;
+  constructor(
+    private activatedRoute: ActivatedRoute,
+    private fbuilder: FormBuilder,
+    private companyService: CompanyService,
+    private companyEventPublisher: CompanyEventPublisher
+  ) {}
+
+  companyTypes = CompanyType;
+
+  ngOnInit(): void {
+    this.activatedRoute.data.subscribe(data=>{
+      let company: Company = data['getCompanyByIDResolve'];
+      console.log(company);
+      this.companyForm = this.fbuilder.group({
+        companyID: [company.companyID],
+        companyName: [
+          company.companyName,
+          [
+            Validators.required,
+            Validators.minLength(4),
+            Validators.maxLength(20),
+          ],
+        ],
+        companyType: [company.companyType, Validators.required],
+        agency: [company.agency,[Validators.required, Validators.minLength(5)]]
+      });
+    });
+  }
+
+  onCompanyUpdate() {
+    let company:Company = this.companyForm.value;
+    if(window.confirm("COMPANY CONFIRM UPDATE")){
+      this.companyService.updateCompany(company).subscribe((updatedCompany: Company)=>{
+        this.companyEventPublisher.publishCompanyEvent(CompanyEvent.UPDATE_COMPANY);
+        console.log(updatedCompany);
+      })
+    }
+  }
+}

angular-project-front/src/app/pages/module-company-manager/compo-company-manager/sub-compo-print-projects-for-company/sub-compo-print-projects-for-company.component.html

@@ -0,0 +1,34 @@
+<div class="container">
+  <p-table
+    [value]="projects"
+    responsiveLayout="scroll"
+    styleClass="p-datatable-striped"
+    *ngIf="projects"
+    [paginator]="true"
+    [rows]="5"
+    [showCurrentPageReport]="true"
+    currentPageReportTemplate="{first} - {last} of {totalRecords} entries"
+    [rowsPerPageOptions]="[5, 10, 15]"
+    class="p-3"
+  >
+    <ng-template pTemplate="header">
+      <tr>
+        <th>ID</th>
+        <th>project name</th>
+        <th>description</th>
+        <th>priority</th>
+        <th>state</th>
+      </tr>
+    </ng-template>
+
+    <ng-template pTemplate="body" let-project>
+      <tr>
+        <td>{{ project.projectID }}</td>
+        <td>{{ project.projectName }}</td>
+        <td>{{ project.description }}</td>
+        <td>{{ project.priority }}</td>
+        <td>{{ project.projectState }}</td>
+      </tr>
+    </ng-template>
+  </p-table>
+</div>

angular-project-front/src/app/pages/module-company-manager/compo-company-manager/sub-compo-print-projects-for-company/sub-compo-print-projects-for-company.component.ts

@@ -0,0 +1,20 @@
+import { ActivatedRoute } from '@angular/router';
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-sub-compo-print-projects-for-company',
+  templateUrl: './sub-compo-print-projects-for-company.component.html',
+  styleUrls: ['./sub-compo-print-projects-for-company.component.scss']
+})
+export class SubCompoPrintProjectsForCompanyComponent implements OnInit {
+
+  constructor(private route: ActivatedRoute) { }
+  projects!: Array<any>
+
+  ngOnInit(): void {
+    this.route.data.subscribe(data=>{
+      this.projects = data['getProjectsAssignedToCompanyResolve'];
+    })
+  }
+
+}

angular-project-front/src/app/pages/module-company-manager/module-company-manager-routing.module.ts

@@ -0,0 +1,42 @@
+import { SubCompoPrintProjectsForCompanyComponent } from './compo-company-manager/sub-compo-print-projects-for-company/sub-compo-print-projects-for-company.component';
+import { GetCompanyByIDResolve, GetProjectsAssignedToCompanyResolve } from './../../shared/services/service-route-resolve/company-resolve/company.route.resolve';
+import { SubCompoCompanyUpdateComponent } from './compo-company-manager/sub-compo-company-update/sub-compo-company-update.component';
+import { SubCompoCompanyCreateComponent } from './compo-company-manager/sub-compo-company-create/sub-compo-company-create.component';
+import { CompoCompanyManagerComponent } from './compo-company-manager/compo-company-manager.component';
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { GetAllCompaniesResolve } from 'src/app/shared/services/service-route-resolve/company-resolve/company.route.resolve';
+
+const routes: Routes = [
+  {
+    path:'companies-management',
+    component: CompoCompanyManagerComponent,
+    resolve:{
+      getAllCompaniesResolve: GetAllCompaniesResolve
+    }
+  },
+  {
+    path:'company-create',
+    component: SubCompoCompanyCreateComponent
+  },
+  {
+    path:'company-update/:companyID',
+    component: SubCompoCompanyUpdateComponent,
+    resolve:{
+      getCompanyByIDResolve: GetCompanyByIDResolve
+    }
+  },
+  {
+    path: 'projects-assignedto-company/:companyID',
+    component: SubCompoPrintProjectsForCompanyComponent,
+    resolve:{
+      getProjectsAssignedToCompanyResolve: GetProjectsAssignedToCompanyResolve
+    }
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
+})
+export class ModuleCompanyManagerRoutingModule { }

angular-project-front/src/app/pages/module-company-manager/module-company-manager.module.ts

@@ -0,0 +1,30 @@
+import { TableModule } from 'primeng/table';
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { ModuleCompanyManagerRoutingModule } from './module-company-manager-routing.module';
+import { CompoCompanyManagerComponent } from './compo-company-manager/compo-company-manager.component';
+import { SubCompoCompanyPrinterComponent } from './compo-company-manager/sub-compo-company-printer/sub-compo-company-printer.component';
+import { SubCompoCompanyCreateComponent } from './compo-company-manager/sub-compo-company-create/sub-compo-company-create.component';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { SubCompoCompanyUpdateComponent } from './compo-company-manager/sub-compo-company-update/sub-compo-company-update.component';
+import { SubCompoPrintProjectsForCompanyComponent } from './compo-company-manager/sub-compo-print-projects-for-company/sub-compo-print-projects-for-company.component';
+
+
+@NgModule({
+  declarations: [
+    CompoCompanyManagerComponent,
+    SubCompoCompanyPrinterComponent,
+    SubCompoCompanyCreateComponent,
+    SubCompoCompanyUpdateComponent,
+    SubCompoPrintProjectsForCompanyComponent
+  ],
+  imports: [
+    CommonModule,
+    ModuleCompanyManagerRoutingModule,
+    TableModule,
+    FormsModule,
+    ReactiveFormsModule
+  ]
+})
+export class ModuleCompanyManagerModule { }

angular-project-front/src/app/pages/module-employee-manager/compo-employee-manager/compo-employee-manager.component.html

@@ -0,0 +1,13 @@
+<div class="container mt-2">
+  <button class="btn btn-outline-info" (click)="onPrintEmployees()">
+    List all employees
+  </button>
+  &nbsp;
+  <button class="btn btn-outline-info" (click)="onCreateEmployee()">
+    create employee
+  </button>
+</div>
+
+<app-sub-compo-employee-printer
+  [employeesList]="employeesList"
+></app-sub-compo-employee-printer>

angular-project-front/src/app/pages/module-employee-manager/compo-employee-manager/compo-employee-manager.component.ts

@@ -0,0 +1,61 @@
+import { EmployeeEventPublisher } from '../../../shared/events-publisher/events.publisher';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Component, OnInit } from '@angular/core';
+import { EmployeeEvent } from 'src/app/shared/models/events.model';
+import { Employee } from 'src/app/shared/models/employee/employee.model';
+import { EmployeeService } from 'src/app/shared/services/service-REST/employees.service';
+
+@Component({
+  selector: 'app-compo-employee-manager',
+  templateUrl: './compo-employee-manager.component.html',
+  styleUrls: ['./compo-employee-manager.component.scss'],
+})
+export class CompoEmployeeManagerComponent implements OnInit {
+  constructor(
+    private activatedRoute: ActivatedRoute,
+    private employeeEventPubliser: EmployeeEventPublisher,
+    private employeeService: EmployeeService,
+    private router : Router
+  ) {}
+
+  employeesList!: Array<Employee>;
+
+  onPrintEmployees() {
+    this.employeeEventPubliser.publishEmployeeEvent(
+      EmployeeEvent.GET_ALL_EMPLOYEES
+    );
+  }
+
+  ngOnInit(): void {
+
+    this.employeeEventPubliser.employeeEnventObservable.subscribe(
+      (employeeEvent: EmployeeEvent) => {
+
+        switch (employeeEvent) {
+          case EmployeeEvent.GET_ALL_EMPLOYEES:
+            this.activatedRoute.data.subscribe((employees) => {
+              this.employeesList = employees['getAllEmployeesResolve'];
+            });
+            console.log(employeeEvent);
+            break;
+
+          case EmployeeEvent.CREATE_EMPLOYEE_FORM:
+            console.log(employeeEvent);
+            this.router.navigateByUrl("/employee-form-create")
+            break;
+
+          case EmployeeEvent.REFRESH:
+            this.employeeService.getAllEmployees().subscribe((employees: Array<Employee>)=>{
+              this.employeesList = employees;
+            })
+            console.log(employeeEvent);
+            break;
+        }
+      }
+    );
+  }
+
+  onCreateEmployee(){
+    this.employeeEventPubliser.publishEmployeeEvent(EmployeeEvent.CREATE_EMPLOYEE_FORM);
+  }
+}

angular-project-front/src/app/pages/module-employee-manager/compo-employee-manager/sub-compo-employee-create/sub-compo-employee-create.component.html

@@ -0,0 +1,109 @@
+<div class="container mt-2">
+
+  <div class="card">
+    <div class="card-header">Employee infos</div>
+    <div class="card-body">
+
+      <form
+      [formGroup]="employeeForm"
+      (ngSubmit)="onSaveEmployeeFormData(); employeeForm.reset()"
+    >
+
+          <label for="firstname">firstname</label>
+          <input
+            type="text"
+            class="form-control"
+            formControlName="firstname"
+            [ngClass]="{
+              'is-invalid':
+                employeeForm.controls['firstname'].touched &&
+                employeeForm.controls['firstname'].invalid
+            }"
+          />
+
+          <div class="invalid-feedback">
+            <span *ngIf="employeeForm.controls['firstname'].errors?.['required']">
+              firstname is required</span
+            >
+          </div>
+
+          <label for="lastname">lastname</label>
+          <input
+            type="text"
+            class="form-control"
+            formControlName="lastname"
+            [ngClass]="{
+              'is-invalid':
+                employeeForm.controls['lastname'].touched &&
+                employeeForm.controls['lastname'].invalid
+            }"
+          />
+
+          <div class="invalid-feedback">
+            <span *ngIf="employeeForm.controls['lastname'].errors?.['required']"
+              >lastname is required</span
+            >
+          </div>
+
+          <label for="employeeState">Employee state </label>
+          <select formControlName="employeeState" class="form-control">
+            <option
+              *ngFor="let state of employeeState | keyvalue"
+              [ngValue]="state.value"
+            >
+              {{ state.value }}
+            </option>
+          </select>
+
+          <div class="invalid-feedback">
+            <span *ngIf="employeeForm.controls['employeeState'].errors?.['required']"
+              >state is required</span
+            >
+          </div>
+
+          <label for="employeeType">Employee type </label>
+          <select formControlName="employeeType" class="form-control">
+            <option
+              *ngFor="let type of employeeType | keyvalue"
+              [ngValue]="type.value"
+            >
+              {{ type.value }}
+            </option>
+          </select>
+
+          <div class="invalid-feedback">
+            <span *ngIf="employeeForm.controls['employeeType'].errors?.['required']"
+              >type is required</span
+            >
+          </div>
+
+          <label for="addressID">Address ID for the employee</label>
+          <select formControlName="addressID" class="form-control">
+            <option
+              *ngFor="let addressMap of addressesMap | keyvalue" [ngValue]="addressMap.key"
+            >
+              {{addressMap.value}}
+            </option>
+          </select>
+
+          <div class="invalid-feedback">
+            <span *ngIf="employeeForm.controls['addressID'].errors?.['required']"
+              >address is required</span
+            >
+          </div>
+
+      <div class="text-center mt-2">
+        <button
+          type="submit"
+          class="btn btn-outline-primary"
+          [disabled]="employeeForm.invalid"
+        >
+          save
+        </button>
+      </div>
+    </form>
+
+    </div>
+  </div>
+
+</div>

angular-project-front/src/app/pages/module-employee-manager/compo-employee-manager/sub-compo-employee-create/sub-compo-employee-create.component.ts

@@ -0,0 +1,75 @@
+import { AddressService } from '../../../../shared/services/service-REST/addresses.service';
+import { EmployeeEventPublisher } from '../../../../shared/events-publisher/events.publisher';
+import { Employee } from '../../../../shared/models/employee/employee.model';
+import { Component, OnInit } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { EmployeeEvent } from 'src/app/shared/models/events.model';
+import { Address } from 'src/app/shared/models/address/address.model';
+import { EmployeeState } from 'src/app/shared/models/employee/employee.state';
+import { EmployeeType } from 'src/app/shared/models/employee/employee.type';
+import { EmployeeService } from 'src/app/shared/services/service-REST/employees.service';
+
+@Component({
+  selector: 'app-sub-compo-employee-create',
+  templateUrl: './sub-compo-employee-create.component.html',
+  styleUrls: ['./sub-compo-employee-create.component.scss'],
+})
+export class SubCompoEmployeeCreateComponent implements OnInit {
+  employeeForm!: FormGroup;
+
+  constructor(
+    private employeeFormBuilder: FormBuilder,
+    private employeeEventPublisher: EmployeeEventPublisher,
+    private employeeService: EmployeeService,
+    private addressService: AddressService,
+  ) {}
+
+  employeeState = EmployeeState;
+  employeeType = EmployeeType;
+
+  addresses!: Array<Address>;
+  addressesMap: Map<number, string> = new Map();
+
+  ngOnInit(): void {
+    this.addressService.getAllAddresses().subscribe(data=>{
+      this.addresses = data;
+      this.addresses.forEach(address=>{
+        this.addressesMap.set(
+          address.addressID,
+          address.num +
+            ' ' +
+            address.street +
+            ', ' +
+            address.pb +
+            ' ' +
+            address.city +
+            ', ' +
+            address.country
+        );
+      })
+    })
+    this.employeeForm = this.employeeFormBuilder.group({
+      employeeID: [0, Validators.required],
+      firstname: ['', Validators.required],
+      lastname: ['', Validators.required],
+      employeeState: [, Validators.required],
+      employeeType: [, Validators.required],
+      addressID: [, Validators.required],
+    });
+  }
+
+  onSaveEmployeeFormData() {
+    this.employeeEventPublisher.publishEmployeeEvent(
+      EmployeeEvent.SAVE_EMPLOYEE_FORM_DATA
+    );
+    let employee: Employee = this.employeeForm.value;
+
+    if (window.confirm('CONFIRM SAVING NEW EMPLOYEE')) {
+      this.employeeService
+        .createEmployee(employee)
+        .subscribe((newEmployee: Employee) => {
+          console.log(newEmployee);
+        });
+    }
+  }
+}

angular-project-front/src/app/pages/module-employee-manager/compo-employee-manager/sub-compo-employee-printer/sub-compo-employee-printer.component.html

@@ -0,0 +1,72 @@
+<div class="container">
+
+  <p-table
+  [value]="employeesList"
+  responsiveLayout="scroll"
+  styleClass="p-datatable-striped"
+  *ngIf="employeesList"
+  [paginator]="true"
+  [rows]="4"
+  [showCurrentPageReport]="true"
+  currentPageReportTemplate="{first} - {last} of {totalRecords} entries"
+  [rowsPerPageOptions]="[4, 8, 12]"
+  class="p-3"
+>
+<ng-template pTemplate="header">
+  <tr>
+    <th>ID</th><th>firstname</th><th>lastname</th><th>email</th><th>address</th><th>hire date</th>
+    <th>state</th> <th>type</th> <th></th><th></th><th></th>
+  </tr>
+</ng-template>
+
+<ng-template pTemplate="body" let-employee>
+  <tr>
+      <td>{{ employee.employeeID }}</td>
+      <td>{{ employee.firstname | titlecase}}</td>
+      <td>{{ employee.lastname | titlecase}}</td>
+      <td>{{ employee.email | lowercase }}</td>
+      <td>
+        <ul>
+          <li>{{ employee.address.num }}{{ employee.address.street }}</li>
+          <li>
+            {{ employee.address.pb }}
+            {{ employee.address.city }}
+          </li>
+        </ul>
+      </td>
+      <td>{{ employee.hireDate | date : "dd-MM-yyyy" }}</td>
+      <td>{{ employee.employeeState }}</td>
+      <td>{{ employee.employeeType}}</td>
+      <td>
+        <button class="btn">
+          <i
+            class="fa fa-pencil"
+            style="color: mediumturquoise"
+            (click)="onEmployeeUpdate(employee)"
+          ></i>
+        </button>
+      </td>
+      <td>
+        <button class="btn">
+          <i
+            class="fa fa-trash"
+            style="color: red"
+            (click)="onEmployeeDelete(employee.employeeID)"
+          ></i>
+        </button>
+      </td>
+      <td>
+        <button class="btn">
+          <i
+            class="fa fa-search"
+            style="color: mediumturquoise"
+            (click)="onPrintProjectsAssigned(employee.employeeID)">&nbsp;projects
+          </i>
+        </button>
+      </td>
+
+  </tr>
+</ng-template>
+</p-table>
+
+</div>

angular-project-front/src/app/pages/module-employee-manager/compo-employee-manager/sub-compo-employee-printer/sub-compo-employee-printer.component.ts

@@ -0,0 +1,62 @@
+import { Router } from '@angular/router';
+import { EmployeeEventPublisher } from '../../../../shared/events-publisher/events.publisher';
+import { Employee } from '../../../../shared/models/employee/employee.model';
+import { Component, Input, OnInit } from '@angular/core';
+import { EmployeeEvent } from 'src/app/shared/models/events.model';
+import { EmployeeService } from 'src/app/shared/services/service-REST/employees.service';
+
+@Component({
+  selector: 'app-sub-compo-employee-printer',
+  templateUrl: './sub-compo-employee-printer.component.html',
+  styleUrls: ['./sub-compo-employee-printer.component.scss']
+})
+export class SubCompoEmployeePrinterComponent implements OnInit{
+
+  @Input () employeesList!: Array<Employee>
+
+  constructor(private employeeService: EmployeeService,
+   private employeeEventPublisher: EmployeeEventPublisher,
+   private router: Router){}
+
+  ngOnInit(): void {
+    this.employeeEventPublisher.employeeEnventObservable.subscribe((employeeEvent: EmployeeEvent)=>{
+
+      switch(employeeEvent) {
+
+        case EmployeeEvent.UPDATE_EMPLOYEE_FORM:
+          this.router.navigateByUrl('/employee-form-update/'+this.idToUpdate);
+          console.log(employeeEvent)
+          break;
+        case EmployeeEvent.PROJECTS_ASSIGNEDTO_EMPLOYEE:
+          this.router.navigateByUrl('/projects-assignedto-employees/'+this.employeeIDProjectsRelated);
+          console.log(employeeEvent);
+          break;
+      }
+    })
+  }
+
+
+  idToUpdate!: string;
+  onEmployeeUpdate(employee: Employee){
+    this.idToUpdate = employee.employeeID;
+    this.employeeEventPublisher.publishEmployeeEvent(EmployeeEvent.UPDATE_EMPLOYEE_FORM);
+  }
+
+  idToDelete!: string;
+
+  onEmployeeDelete(employeeID: string){
+    if(window.confirm("CONFIRM EMPLOYEE DELETE!!")){
+      this.employeeService.deleteEmployee(employeeID).subscribe(()=>{
+        this.employeeEventPublisher.publishEmployeeEvent(EmployeeEvent.REFRESH);
+      });
+    }
+  }
+
+  employeeIDProjectsRelated!: string;
+
+  onPrintProjectsAssigned(employeeID: string){
+    this.employeeIDProjectsRelated=employeeID;
+    this.employeeEventPublisher.publishEmployeeEvent(EmployeeEvent.PROJECTS_ASSIGNEDTO_EMPLOYEE);
+  }
+
+}

angular-project-front/src/app/pages/module-employee-manager/compo-employee-manager/sub-compo-employee-update/sub-compo-employee-update.component.html

@@ -0,0 +1,109 @@
+<div class="container mt-2" *ngIf="employeeForm">
+  <div class="card">
+    <div class="card-header">Employee infos</div>
+    <div class="card-body">
+
+      <form
+    [formGroup]="employeeForm"
+    (ngSubmit)="onSaveEmployeeFormData(); employeeForm.reset()"
+  >
+        <label for="firstname">firstname</label>
+        <input
+          type="text"
+          class="form-control"
+          formControlName="firstname"
+          [ngClass]="{
+            'is-invalid':
+              employeeForm.controls['firstname'].touched &&
+              employeeForm.controls['firstname'].invalid
+          }"
+        />
+
+        <div class="invalid-feedback">
+          <span *ngIf="employeeForm.controls['firstname'].errors?.['required']">
+            firstname is required</span
+          >
+        </div>
+
+        <label for="lastname">lastname</label>
+        <input
+          type="text"
+          class="form-control"
+          formControlName="lastname"
+          [ngClass]="{
+            'is-invalid':
+              employeeForm.controls['lastname'].touched &&
+              employeeForm.controls['lastname'].invalid
+          }"
+        />
+
+        <div class="invalid-feedback">
+          <span *ngIf="employeeForm.controls['lastname'].errors?.['required']"
+            >lastname is required</span
+          >
+        </div>
+
+        <label for="employeeState">Employee state </label>
+        <select formControlName="employeeState" class="form-control">
+          <option
+            *ngFor="let state of employeeState | keyvalue"
+            [ngValue]="state.value"
+          >
+            {{ state.value }}
+          </option>
+        </select>
+
+        <div class="invalid-feedback">
+          <span
+            *ngIf="employeeForm.controls['employeeState'].errors?.['required']"
+            >state is required</span
+          >
+        </div>
+
+        <label for="employeeType">Employee type </label>
+        <select formControlName="employeeType" class="form-control">
+          <option
+            *ngFor="let type of employeeType | keyvalue"
+            [ngValue]="type.value"
+          >
+            {{ type.value }}
+          </option>
+        </select>
+
+        <div class="invalid-feedback">
+          <span
+            *ngIf="employeeForm.controls['employeeType'].errors?.['required']"
+            >type is required</span
+          >
+        </div>
+
+        <label for="addressID">Address ID for the employee</label>
+        <select class="form-control" formControlName="addressID">
+          <option
+            *ngFor="let addressMap of addressesMap | keyvalue" [ngValue]="addressMap.key"
+          >
+           {{addressMap.value}}
+          </option>
+        </select>
+
+        <div class="invalid-feedback">
+          <span *ngIf="employeeForm.controls['addressID'].errors?.['required']"
+            >address is required</span
+          >
+        </div>
+
+    <div class="text-center mt-2">
+      <button
+        type="submit"
+        class="btn btn-outline-primary"
+        [disabled]="employeeForm.invalid"
+      >
+        save
+      </button>
+    </div>
+  </form>
+
+    </div>
+  </div>
+
+</div>

angular-project-front/src/app/pages/module-employee-manager/compo-employee-manager/sub-compo-employee-update/sub-compo-employee-update.component.ts

@@ -0,0 +1,76 @@
+import { AddressService } from '../../../../shared/services/service-REST/addresses.service';
+import { Address } from '../../../../shared/models/address/address.model';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { ActivatedRoute } from '@angular/router';
+import { Component, OnInit } from '@angular/core';
+import { EmployeeEvent } from 'src/app/shared/models/events.model';
+import { Employee } from 'src/app/shared/models/employee/employee.model';
+import { EmployeeState } from 'src/app/shared/models/employee/employee.state';
+import { EmployeeType } from 'src/app/shared/models/employee/employee.type';
+import { EmployeeService } from 'src/app/shared/services/service-REST/employees.service';
+
+@Component({
+  selector: 'app-sub-compo-employee-update',
+  templateUrl: './sub-compo-employee-update.component.html',
+  styleUrls: ['./sub-compo-employee-update.component.scss'],
+})
+export class SubCompoEmployeeUpdateComponent implements OnInit {
+
+  constructor(
+    private activatedRoute: ActivatedRoute,
+    private employeeService: EmployeeService,
+    private fbuilder: FormBuilder,
+    private addressService: AddressService
+  ) {}
+
+  employeeForm!: FormGroup;
+  employeeType = EmployeeType;
+  employeeState = EmployeeState;
+  addresses!: Array<Address>;
+  addressesMap: Map<number, string> = new Map();
+
+  ngOnInit(): void {
+    this.addressService.getAllAddresses().subscribe((data: Array<Address>) => {
+      this.addresses = data;
+      this.addresses.forEach((address: Address) => {
+        this.addressesMap.set(
+          address.addressID,
+          address.num +
+            ' ' +
+            address.street +
+            ', ' +
+            address.pb +
+            ' ' +
+            address.city +
+            ', ' +
+            address.country
+        );
+      });
+    });
+
+    this.activatedRoute
+      .data.subscribe((data) => {
+        let employee: Employee = data['getEmployeeByIDResolve'];
+        console.log(employee);
+        this.employeeForm = this.fbuilder.group({
+          employeeID: [employee.employeeID],
+          firstname: [employee.firstname, Validators.required],
+          lastname: [employee.lastname, Validators.required],
+          employeeState: [employee.employeeState, Validators.required],
+          employeeType: [employee.employeeType, Validators.required],
+          addressID: [employee.addressID, Validators.required],
+        });
+      });
+  }
+
+  onSaveEmployeeFormData() {
+    if (window.confirm('COMFIRM EMPLOYEE UPDATE')) {
+      this.employeeService
+        .updateEmployee(this.employeeForm.value)
+        .subscribe((employee: Employee) => {
+          console.log(employee);
+          console.log(EmployeeEvent.UPDATE_EMPLOYEE);
+        });
+    }
+  }
+}

angular-project-front/src/app/pages/module-employee-manager/compo-employee-manager/sub-compo-print-projects-assignedto-employee/sub-compo-print-projects-assignedto-employee.component.html

@@ -0,0 +1,34 @@
+<div class="container">
+  <p-table
+    [value]="projects"
+    responsiveLayout="scroll"
+    styleClass="p-datatable-striped"
+    *ngIf="projects"
+    [paginator]="true"
+    [rows]="5"
+    [showCurrentPageReport]="true"
+    currentPageReportTemplate="{first} - {last} of {totalRecords} entries"
+    [rowsPerPageOptions]="[5, 10, 15]"
+    class="p-3"
+  >
+    <ng-template pTemplate="header">
+      <tr>
+        <th>ID</th>
+        <th>project name</th>
+        <th>description</th>
+        <th>priority</th>
+        <th>state</th>
+      </tr>
+    </ng-template>
+
+    <ng-template pTemplate="body" let-project>
+      <tr>
+        <td>{{ project.projectID }}</td>
+        <td>{{ project.projectName }}</td>
+        <td>{{ project.description }}</td>
+        <td>{{ project.priority }}</td>
+        <td>{{ project.projectState }}</td>
+      </tr>
+    </ng-template>
+  </p-table>
+</div>

angular-project-front/src/app/pages/module-employee-manager/compo-employee-manager/sub-compo-print-projects-assignedto-employee/sub-compo-print-projects-assignedto-employee.component.ts

@@ -0,0 +1,22 @@
+import { ActivatedRoute } from '@angular/router';
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-sub-compo-print-projects-assignedto-employee',
+  templateUrl: './sub-compo-print-projects-assignedto-employee.component.html',
+  styleUrls: ['./sub-compo-print-projects-assignedto-employee.component.scss']
+})
+export class SubCompoPrintProjectsAssignedtoEmployeeComponent implements OnInit {
+
+  constructor(private route: ActivatedRoute) { }
+
+  projects!: Array<any>;
+
+  ngOnInit(): void {
+    this.route.data.subscribe(data=>{
+      this.projects = data['getProjectsAssignedToEmployeeResolve'];
+      console.log(this.projects);
+    })
+  }
+
+}

angular-project-front/src/app/pages/module-employee-manager/module-employee-manager-routing.module.ts

@@ -0,0 +1,42 @@
+import { GetProjectsAssignedToEmployeeResolve } from './../../shared/services/service-route-resolve/employee-resolve/employee.route.resolve';
+import { SubCompoPrintProjectsAssignedtoEmployeeComponent } from './compo-employee-manager/sub-compo-print-projects-assignedto-employee/sub-compo-print-projects-assignedto-employee.component';
+import { SubCompoEmployeeUpdateComponent } from './compo-employee-manager/sub-compo-employee-update/sub-compo-employee-update.component';
+import { SubCompoEmployeeCreateComponent } from './compo-employee-manager/sub-compo-employee-create/sub-compo-employee-create.component';
+import { CompoEmployeeManagerComponent } from './compo-employee-manager/compo-employee-manager.component';
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { GetAllEmployeesResolve, GetEmployeeByIDResolve } from 'src/app/shared/services/service-route-resolve/employee-resolve/employee.route.resolve';
+
+const routes: Routes = [
+  {
+    path: 'employees-management',
+    component: CompoEmployeeManagerComponent,
+    resolve: {
+      getAllEmployeesResolve: GetAllEmployeesResolve,
+    },
+  },
+  {
+    path: 'employee-form-create',
+    component: SubCompoEmployeeCreateComponent,
+  },
+  {
+    path: 'employee-form-update/:employeeID',
+    component: SubCompoEmployeeUpdateComponent,
+    resolve:{
+      getEmployeeByIDResolve:GetEmployeeByIDResolve
+    }
+  },
+  {
+    path:'projects-assignedto-employees/:employeeID',
+    component: SubCompoPrintProjectsAssignedtoEmployeeComponent,
+    resolve:{
+      getProjectsAssignedToEmployeeResolve: GetProjectsAssignedToEmployeeResolve
+    }
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class ModuleEmployeeManagerRoutingModule {}

angular-project-front/src/app/pages/module-employee-manager/module-employee-manger.module.ts

@@ -0,0 +1,30 @@
+import { TableModule } from 'primeng/table';
+import { ReactiveFormsModule } from '@angular/forms';
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { ModuleEmployeeManagerRoutingModule } from './module-employee-manager-routing.module';
+import { CompoEmployeeManagerComponent } from './compo-employee-manager/compo-employee-manager.component';
+import { SubCompoEmployeePrinterComponent } from './compo-employee-manager/sub-compo-employee-printer/sub-compo-employee-printer.component';
+import { SubCompoEmployeeCreateComponent } from './compo-employee-manager/sub-compo-employee-create/sub-compo-employee-create.component';
+import { SubCompoEmployeeUpdateComponent } from './compo-employee-manager/sub-compo-employee-update/sub-compo-employee-update.component';
+import { SubCompoPrintProjectsAssignedtoEmployeeComponent } from './compo-employee-manager/sub-compo-print-projects-assignedto-employee/sub-compo-print-projects-assignedto-employee.component';
+
+
+@NgModule({
+  declarations: [
+    CompoEmployeeManagerComponent,
+    SubCompoEmployeePrinterComponent,
+    SubCompoEmployeeCreateComponent,
+    SubCompoEmployeeUpdateComponent,
+    SubCompoPrintProjectsAssignedtoEmployeeComponent
+  ],
+  imports: [
+    CommonModule,
+    ModuleEmployeeManagerRoutingModule,
+    ReactiveFormsModule,
+    TableModule
+  ]
+
+})
+export class ModuleEmployeeManagerModule { }

angular-project-front/src/app/pages/module-project-manager/compo-project-manager/compo-project-manager.component.html

@@ -0,0 +1,10 @@
+<div class="container mt-2">
+  <button class="btn btn-outline-info" (click)="onPrintProjects()">
+    List all projects
+  </button>
+  &nbsp;
+  <button class="btn btn-outline-info" (click)="onCreateProject()">
+    Create a project
+  </button>
+</div>
+<app-sub-compo-project-printer [projects]="projects"></app-sub-compo-project-printer>

angular-project-front/src/app/pages/module-project-manager/compo-project-manager/compo-project-manager.component.ts

@@ -0,0 +1,52 @@
+import { ProjectEventPublisher } from '../../../shared/events-publisher/events.publisher';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Component, OnInit } from '@angular/core';
+import { ProjectEvent } from 'src/app/shared/models/events.model';
+import { Project } from 'src/app/shared/models/project/project.model';
+import { ProjectService } from 'src/app/shared/services/service-REST/projects.service';
+
+@Component({
+  selector: 'app-compo-project-manager',
+  templateUrl: './compo-project-manager.component.html',
+  styleUrls: ['./compo-project-manager.component.scss']
+})
+export class CompoProjectManagerComponent implements OnInit {
+
+  constructor(private activatedRoute: ActivatedRoute,
+    private projectEventPublisher: ProjectEventPublisher,
+    private projectService: ProjectService,
+    private router: Router) { }
+
+    projects!: Array<Project>;
+
+  ngOnInit(): void {
+    this.projectEventPublisher.projectEventObservable.subscribe((projectEvent: ProjectEvent)=>{
+      switch(projectEvent) {
+        case ProjectEvent.GET_ALL_PROJECTS :
+          this.activatedRoute.data.subscribe(data=>{
+            this.projects = data['getAllProjectsResolve']
+            console.log(this.projects.length)
+          })
+          console.log(projectEvent);
+          break;
+        case ProjectEvent.CREATE_PROJECT_FORM:
+          this.router.navigateByUrl('/project-create')
+          break;
+        case ProjectEvent.REFRESH:
+          this.projectService.getAllProjects().subscribe((data: Array<Project>)=>{
+            this.projects = data;
+            console.log(projectEvent);
+          });
+          break;
+      }
+    })
+  }
+
+  onPrintProjects(){
+    this.projectEventPublisher.publishProjectEvent(ProjectEvent.GET_ALL_PROJECTS);
+  }
+  onCreateProject(){
+    this.projectEventPublisher.publishProjectEvent(ProjectEvent.CREATE_PROJECT_FORM);
+  }
+
+}

angular-project-front/src/app/pages/module-project-manager/compo-project-manager/sub-compo-project-create/sub-compo-project-create.component.html

@@ -0,0 +1,99 @@
+<div class="container mt-3">
+
+  <div class="card">
+    <div class="card-header">Project info</div>
+    <div class="card-body">
+
+      <form [formGroup]="projectForm" (ngSubmit)="onSaveProjectForm(); projectForm.reset()">
+        <label for="projectName">project name</label>
+        <input type="text" class="form-control" formControlName="projectName"
+        [ngClass]="{'is-invalid': projectForm.controls['projectName'].touched && projectForm.controls['projectName'].invalid}">
+
+
+        <div class="invalid-feedback">
+          <span *ngIf="projectForm.controls['projectName'].errors?.['required']"
+            >required</span
+          >
+        </div>
+
+        <label for="description"> description</label>
+        <input type="text" class="form-control" formControlName="description"
+        [ngClass]="{'is-invalid': projectForm.controls['description'].touched && projectForm.controls['description'].invalid}">
+
+        <div class="invalid-feedback">
+          <span *ngIf="projectForm.controls['description'].errors?.['required']"
+            >required</span
+          >
+          <span *ngIf="projectForm.controls['description'].errors?.['minlength']"
+          >very short description</span
+        >
+        </div>
+
+        <label for="priority">priority</label>
+        <select class="form-control" formControlName="priority">
+          <option *ngFor="let priority of priorities | keyvalue" [ngValue]="priority.value">
+              {{ priority.value }}
+          </option>
+        </select>
+       <div class="invalid-feedback">
+        <span *ngIf="projectForm.controls['priority'].errors?.['required']">required</span>
+       </div>
+        <label for="projectState">project state</label>
+        <select
+        class="form-control" formControlName="projectState">
+        <option
+          *ngFor="let state of states | keyvalue"
+          [ngValue]="state.value"
+        >
+          {{ state.value }}
+        </option>
+        </select>
+
+        <div class="invalid-feedback">
+          <span *ngIf="projectForm.controls['projectState'].errors?.['required']"
+            >required</span
+          >
+        </div>
+
+        <label for="employeeID"> employee</label>
+        <select formControlName="employeeID" class="form-control">
+          <option
+            *ngFor="let employeeMap of employeesMap | keyvalue" [ngValue]="employeeMap.key"
+          >
+            {{employeeMap.value}}
+          </option>
+        </select>
+        <div class="invalid-feedback">
+          <span *ngIf="projectForm.controls['employeeID'].errors?.['required']"
+            >required</span
+          >
+        </div>
+
+        <label for="companyID"> company</label>
+        <select formControlName="companyID" class="form-control">
+          <option
+            *ngFor="let companyMap of companiesMap | keyvalue" [ngValue]="companyMap.key"
+          >
+            {{companyMap.value}}
+          </option>
+        </select>
+        <div class="invalid-feedback">
+          <span *ngIf="projectForm.controls['projectState'].errors?.['required']"
+            >required</span
+          >
+        </div>
+
+        <div class="text-center mt-2">
+          <button
+            type="submit"
+            class="btn btn-outline-primary"
+          >
+            save
+          </button>
+        </div>
+      </form>
+
+    </div>
+  </div>
+
+</div>

angular-project-front/src/app/pages/module-project-manager/compo-project-manager/sub-compo-project-create/sub-compo-project-create.component.ts

@@ -0,0 +1,85 @@
+import { Company } from './../../../../shared/models/company/company.model';
+import { Employee } from './../../../../shared/models/employee/employee.model';
+import { ProjectState } from './../../../../shared/models/project/project.state';
+import { Priority } from './../../../../shared/models/project/project.priority';
+import { FormGroup, FormBuilder, Validators } from '@angular/forms';
+import { Component, OnInit } from '@angular/core';
+import { Project } from 'src/app/shared/models/project/project.model';
+import { CompanyService } from 'src/app/shared/services/service-REST/companies.service';
+import { EmployeeService } from 'src/app/shared/services/service-REST/employees.service';
+import { ProjectService } from 'src/app/shared/services/service-REST/projects.service';
+
+@Component({
+  selector: 'app-sub-compo-project-create',
+  templateUrl: './sub-compo-project-create.component.html',
+  styleUrls: ['./sub-compo-project-create.component.scss'],
+})
+export class SubCompoProjectCreateComponent implements OnInit {
+  projectForm!: FormGroup;
+
+  constructor(
+    private fBuilder: FormBuilder,
+    private employeeService: EmployeeService,
+    private companyService: CompanyService,
+    private projectService: ProjectService
+  ) {}
+
+  priorities = Priority;
+  states = ProjectState;
+
+  employees!: Array<Employee>;
+  employeesMap: Map<string, string> = new Map();
+  companies!: Array<Company>;
+  companiesMap: Map<string, string> = new Map();
+
+  ngOnInit(): void {
+    this.employeeService
+      .getAllEmployees()
+      .subscribe((data: Array<Employee>) => {
+        this.employees = data;
+        this.employees.forEach((employee: Employee) => {
+          this.employeesMap.set(
+            employee.employeeID,
+            employee.firstname +
+              ' ' +
+              employee.lastname +
+              ' email: ' +
+              employee.email
+          );
+        });
+      });
+
+    this.companyService.getAllCompanies().subscribe((data: Array<Company>) => {
+      this.companies = data;
+      this.companies.forEach((company: Company) => {
+        this.companiesMap.set(
+          company.companyID,
+          company.companyName +
+            ' ' +
+            company.agency
+        );
+      });
+    });
+
+    this.projectForm = this.fBuilder.group({
+      projectID: ['', Validators.required],
+      projectName: ['', [Validators.required, Validators.minLength(4)]],
+      description: ['', [Validators.required, Validators.minLength(10)]],
+      priority: ['', Validators.required],
+      projectState: ['', Validators.required],
+      employeeID: ['', Validators.required],
+      companyID: ['', Validators.required],
+    });
+  }
+
+  onSaveProjectForm() {
+    let project: Project = this.projectForm.value;
+    if (window.confirm('CONFIRM PROJECT CREATE')) {
+      this.projectService
+        .createProject(project)
+        .subscribe((newProject: Project) => {
+          console.log(newProject);
+        });
+    }
+  }
+}

angular-project-front/src/app/pages/module-project-manager/compo-project-manager/sub-compo-project-printer/sub-compo-project-printer.component.html

@@ -0,0 +1,69 @@
+<div class="container">
+  <p-table
+    [value]="projects"
+    responsiveLayout="scroll"
+    styleClass="p-datatable-striped"
+    *ngIf="projects"
+    [paginator]="true"
+    [rows]="5"
+    [showCurrentPageReport]="true"
+    currentPageReportTemplate="{first} - {last} of {totalRecords} entries"
+    [rowsPerPageOptions]="[5, 10, 15]"
+    class="p-3"
+  >
+    <ng-template pTemplate="header">
+      <tr>
+        <th>ID</th>
+        <th>project name</th>
+        <th>description</th>
+        <th>priority</th>
+        <th>state</th>
+        <th>user assigned</th>
+        <th>company related</th>
+        <th></th><th></th>
+      </tr>
+    </ng-template>
+
+    <ng-template pTemplate="body" let-project>
+      <tr>
+        <td>{{ project.projectID }}</td>
+        <td>{{ project.projectName }}</td>
+        <td>{{ project.description }}</td>
+        <td>{{ project.priority }}</td>
+        <td>{{ project.projectState }}</td>
+        <td>
+          <ul>
+            <li>User ID: {{project.employee.employeeID}}</li>
+            <li>{{ project.employee.firstname }} {{ project.employee.lastname }}</li>
+            <li>{{ project.employee.email }}</li>
+            <li>{{ project.employee.employeeType }}, {{ project.employee.employeeState }}</li>
+          </ul>
+        </td>
+        <td>
+          <ul>
+            <li>{{ project.company.companyName }} {{ project.company.agency }}</li>
+            <li>{{ project.company.companyType }}</li>
+          </ul>
+        </td>
+        <td>
+          <button class="btn">
+            <i
+              class="fa fa-pencil"
+              style="color: mediumturquoise"
+              (click)="onProjectUpdate(project)"
+            ></i>
+          </button>
+        </td>
+        <td>
+          <button class="btn">
+            <i
+              class="fa fa-trash"
+              style="color: red"
+              (click)="onProjectDelete(project.projectID)"
+            ></i>
+          </button>
+        </td>
+      </tr>
+    </ng-template>
+  </p-table>
+</div>

angular-project-front/src/app/pages/module-project-manager/compo-project-manager/sub-compo-project-printer/sub-compo-project-printer.component.ts

@@ -0,0 +1,46 @@
+import { Router } from '@angular/router';
+import { ProjectEventPublisher } from '../../../../shared/events-publisher/events.publisher';
+import { Component, Input, OnInit } from '@angular/core';
+import { Project } from 'src/app/shared/models/project/project.model';
+import { ProjectEvent } from 'src/app/shared/models/events.model';
+import { ProjectService } from 'src/app/shared/services/service-REST/projects.service';
+
+@Component({
+  selector: 'app-sub-compo-project-printer',
+  templateUrl: './sub-compo-project-printer.component.html',
+  styleUrls: ['./sub-compo-project-printer.component.scss']
+})
+export class SubCompoProjectPrinterComponent implements OnInit {
+
+  constructor(private projectService: ProjectService,
+    private projectEventPublisher: ProjectEventPublisher,
+    private router: Router) { }
+
+  @Input () projects!: Array<Project>;
+
+  ngOnInit(): void {
+    this.projectEventPublisher.projectEventObservable.subscribe((projectEvent: ProjectEvent)=>{
+      switch(projectEvent){
+        case ProjectEvent.UPDATE_PROJECT_FORM:
+          this.router.navigateByUrl('/project-update/'+this.projectID);
+          break;
+      }
+    })
+  }
+
+projectID!: string;
+onProjectUpdate(project: Project){
+  this.projectID = project.projectID;
+  this.projectEventPublisher.publishProjectEvent(ProjectEvent.UPDATE_PROJECT_FORM);
+}
+onProjectDelete(projectID: string){
+  if(window.confirm('COMFIRM PROJECT DELETE')){
+    this.projectService.deleteProject(projectID).subscribe(
+      ()=>{
+        this.projectEventPublisher.publishProjectEvent(ProjectEvent.REFRESH);
+      }
+    );
+  }
+}
+
+}

angular-project-front/src/app/pages/module-project-manager/compo-project-manager/subcompo-project-update/subcompo-project-update.component.html

@@ -0,0 +1,97 @@
+<div class="container mt-3">
+  <div class="card">
+    <div class="card-header">Project info</div>
+    <div class="card-body">
+
+      <form [formGroup]="projectForm" (ngSubmit)="onSaveProjectForm(); projectForm.reset()">
+        <label for="projectName">project name</label>
+        <input type="text" class="form-control" formControlName="projectName"
+        [ngClass]="{'is-invalid': projectForm.controls['projectName'].touched && projectForm.controls['projectName'].invalid}">
+
+
+        <div class="invalid-feedback">
+          <span *ngIf="projectForm.controls['projectName'].errors?.['required']"
+            >required</span
+          >
+        </div>
+
+        <label for="description"> description</label>
+        <input type="text" class="form-control" formControlName="description"
+        [ngClass]="{'is-invalid': projectForm.controls['description'].touched && projectForm.controls['description'].invalid}">
+
+        <div class="invalid-feedback">
+          <span *ngIf="projectForm.controls['description'].errors?.['required']"
+            >required</span
+          >
+          <span *ngIf="projectForm.controls['description'].errors?.['minlength']"
+          >very short description</span
+        >
+        </div>
+
+        <label for="priority">priority</label>
+        <select class="form-control" formControlName="priority">
+          <option *ngFor="let priority of priorities | keyvalue" [ngValue]="priority.value">
+              {{ priority.value }}
+          </option>
+        </select>
+       <div class="invalid-feedback">
+        <span *ngIf="projectForm.controls['priority'].errors?.['required']">required</span>
+       </div>
+        <label for="projectState">project state</label>
+        <select
+        class="form-control" formControlName="projectState">
+        <option
+          *ngFor="let state of states | keyvalue"
+          [ngValue]="state.value"
+        >
+          {{ state.value }}
+        </option>
+        </select>
+
+        <div class="invalid-feedback">
+          <span *ngIf="projectForm.controls['projectState'].errors?.['required']"
+            >required</span
+          >
+        </div>
+
+        <label for="employeeID"> employee</label>
+        <select formControlName="employeeID" class="form-control">
+          <option
+            *ngFor="let employeeMap of employeesMap | keyvalue" [ngValue]="employeeMap.key"
+          >
+            {{employeeMap.value}}
+          </option>
+        </select>
+        <div class="invalid-feedback">
+          <span *ngIf="projectForm.controls['employeeID'].errors?.['required']"
+            >required</span
+          >
+        </div>
+
+        <label for="companyID"> company</label>
+        <select formControlName="companyID" class="form-control">
+          <option
+            *ngFor="let companyMap of companiesMap | keyvalue" [ngValue]="companyMap.key" disabled
+          >
+            {{companyMap.value}}
+          </option>
+        </select>
+        <div class="invalid-feedback">
+          <span *ngIf="projectForm.controls['projectState'].errors?.['required']"
+            >required</span
+          >
+        </div>
+
+        <div class="text-center mt-2">
+          <button
+            type="submit"
+            class="btn btn-outline-primary"
+          >
+            save
+          </button>
+        </div>
+      </form>
+
+    </div>
+  </div>
+</div>

angular-project-front/src/app/pages/module-project-manager/compo-project-manager/subcompo-project-update/subcompo-project-update.component.ts

@@ -0,0 +1,90 @@
+import { CompanyService } from 'src/app/shared/services/service-REST/companies.service';
+import { Project } from './../../../../shared/models/project/project.model';
+import { ActivatedRoute } from '@angular/router';
+import { Component, OnInit } from '@angular/core';
+import { FormGroup, FormBuilder, Validators } from '@angular/forms';
+import { Company } from 'src/app/shared/models/company/company.model';
+import { Employee } from 'src/app/shared/models/employee/employee.model';
+import { Priority } from 'src/app/shared/models/project/project.priority';
+import { ProjectState } from 'src/app/shared/models/project/project.state';
+import { EmployeeService } from 'src/app/shared/services/service-REST/employees.service';
+import { ProjectService } from 'src/app/shared/services/service-REST/projects.service';
+
+
+@Component({
+  selector: 'app-subcompo-project-update',
+  templateUrl: './subcompo-project-update.component.html',
+  styleUrls: ['./subcompo-project-update.component.scss']
+})
+export class SubcompoProjectUpdateComponent implements OnInit {
+
+  projectForm!: FormGroup;
+
+  constructor(private fBuilder: FormBuilder,private employeeService: EmployeeService,
+    private companyService: CompanyService, private activatedRoute: ActivatedRoute,
+    private projectService: ProjectService) {}
+
+  priorities = Priority;
+  states = ProjectState;
+
+  employees!: Array<Employee>;
+  employeesMap:Map<string, string> = new Map();
+  companies!: Array<Company>
+  companiesMap:Map<string, string> = new Map();
+  project!: Project;
+
+  ngOnInit(): void {
+    this.employeeService
+    .getAllEmployees()
+    .subscribe((data: Array<Employee>) => {
+      this.employees = data;
+      this.employees.forEach((employee: Employee) => {
+        this.employeesMap.set(
+          employee.employeeID,
+          employee.firstname +
+            ' ' +
+            employee.lastname +
+            ' email: ' +
+            employee.email
+        );
+      });
+    });
+
+    this.companyService.getAllCompanies().subscribe((data: Array<Company>) => {
+      this.companies = data;
+      this.companies.forEach((company: Company) => {
+        this.companiesMap.set(
+          company.companyID,
+          company.companyName +
+            ' ' +
+            company.agency
+        );
+      });
+    });
+
+    this.activatedRoute.data.subscribe(data=>{
+      let project: Project = data['getProjectByIDResolve'];
+      console.log(project);
+
+      this.projectForm = this.fBuilder.group({
+        projectID: [project.projectID, Validators.required],
+        projectName: [project.projectName, [Validators.required, Validators.minLength(4)]],
+        description: [project.description, [Validators.required, Validators.minLength(10)]],
+        priority: [project.priority, Validators.required],
+        projectState: [project.projectState, Validators.required],
+        employeeID: [project.employeeID, Validators.required],
+        companyID: [project.companyID, Validators.required],
+      });
+
+    });
+  }
+
+  onSaveProjectForm(){
+    if(window.confirm("CONFIRM PROJECT UPDATE")){
+      this.projectService.updateProject(this.projectForm.value).subscribe((newProject: Project)=>{
+        console.log(newProject);
+      })
+    }
+  }
+
+}

angular-project-front/src/app/pages/module-project-manager/module-project-manager-routing.module.ts

@@ -0,0 +1,33 @@
+import { SubcompoProjectUpdateComponent } from './compo-project-manager/subcompo-project-update/subcompo-project-update.component';
+import { SubCompoProjectCreateComponent } from './compo-project-manager/sub-compo-project-create/sub-compo-project-create.component';
+import { CompoProjectManagerComponent } from './compo-project-manager/compo-project-manager.component';
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { GetAllProjectsResolve, GetProjectByIDResolve } from 'src/app/shared/services/service-route-resolve/project-resolve/route.resolve';
+
+const routes: Routes = [
+  {
+    path:'projects-management',
+    component: CompoProjectManagerComponent,
+    resolve:{
+      getAllProjectsResolve: GetAllProjectsResolve
+    }
+  },
+  {
+    path:'project-create',
+    component: SubCompoProjectCreateComponent
+  },
+  {
+    path:'project-update/:projectID',
+    component: SubcompoProjectUpdateComponent,
+    resolve:{
+      getProjectByIDResolve:GetProjectByIDResolve
+    }
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
+})
+export class ModuleProjectManagerRoutingModule { }

angular-project-front/src/app/pages/module-project-manager/module-project-manager.module.ts

@@ -0,0 +1,28 @@
+import { GetEmployeeByIDResolve } from 'src/app/shared/services/service-route-resolve/employee-resolve/employee.route.resolve';
+import { ReactiveFormsModule } from '@angular/forms';
+import { TableModule } from 'primeng/table';
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { ModuleProjectManagerRoutingModule } from './module-project-manager-routing.module';
+import { CompoProjectManagerComponent } from './compo-project-manager/compo-project-manager.component';
+import { SubCompoProjectPrinterComponent } from './compo-project-manager/sub-compo-project-printer/sub-compo-project-printer.component';
+import { SubCompoProjectCreateComponent } from './compo-project-manager/sub-compo-project-create/sub-compo-project-create.component';
+import { SubcompoProjectUpdateComponent } from './compo-project-manager/subcompo-project-update/subcompo-project-update.component';
+
+
+@NgModule({
+  declarations: [
+    CompoProjectManagerComponent,
+    SubCompoProjectPrinterComponent,
+    SubCompoProjectCreateComponent,
+    SubcompoProjectUpdateComponent
+  ],
+  imports: [
+    CommonModule,
+    ModuleProjectManagerRoutingModule,
+    TableModule,
+    ReactiveFormsModule
+  ],
+})
+export class ModuleProjectManagerModule { }

angular-project-front/src/app/shared/events-publisher/events.publisher.ts

@@ -0,0 +1,43 @@
+import { ProjectEvent } from '../models/events.model';
+import { EmployeeEvent, AddressEvent, CompanyEvent } from '../models/events.model';
+import { Injectable } from "@angular/core";
+import { Observable, Subject } from "rxjs";
+
+@Injectable({providedIn:"root"})
+export class EmployeeEventPublisher {
+
+  private employeeEventSubject: Subject<EmployeeEvent> = new Subject<EmployeeEvent>();
+  employeeEnventObservable: Observable<EmployeeEvent> = this.employeeEventSubject.asObservable();
+
+  publishEmployeeEvent(employeeEvent: EmployeeEvent){
+    this.employeeEventSubject.next(employeeEvent);
+  }
+}
+
+@Injectable({providedIn: "root"})
+export class AddressEventPublisher {
+
+  addressEventSubject: Subject<AddressEvent> = new Subject<AddressEvent>();
+  addressEventObservable: Observable<AddressEvent> = this.addressEventSubject.asObservable();
+  publishAddressEvent(addressEvent: AddressEvent){
+    this.addressEventSubject.next(addressEvent);
+  }
+}
+
+@Injectable({providedIn:'root'})
+export class CompanyEventPublisher {
+  companyEventSubject: Subject<CompanyEvent> = new Subject<CompanyEvent>();
+  companyEventObservable: Observable<CompanyEvent> = this.companyEventSubject.asObservable();
+  publishCompanyEvent(companyEvent: CompanyEvent){
+    this.companyEventSubject.next(companyEvent);
+  }
+}
+
+@Injectable({providedIn:'root'})
+export class ProjectEventPublisher {
+  projectEventSubject : Subject<ProjectEvent> = new Subject<ProjectEvent>();
+  projectEventObservable: Observable<ProjectEvent> = this.projectEventSubject.asObservable();
+  publishProjectEvent(projectEvent: ProjectEvent){
+    this.projectEventSubject.next(projectEvent);
+  }
+}

angular-project-front/src/app/shared/models/address/address.model.ts

@@ -0,0 +1,8 @@
+export class Address {
+  addressID!: number;
+  num!: number;
+  street!: string;
+  pb!: number;
+  city!: string;
+  country!: string;
+}

angular-project-front/src/app/shared/models/company/company.model.ts

@@ -0,0 +1,9 @@
+import { CompanyType } from "./company.type";
+
+export class Company {
+  companyID!: string;
+  companyName!: string;
+  agency!: string;
+  companyType!: CompanyType;
+  connectedDate!: Date;
+}

angular-project-front/src/app/shared/models/company/company.type.ts

@@ -0,0 +1,4 @@
+export enum CompanyType {
+  CLIENT ="CLIENT",
+  PROSPECT="PROSPECT"
+}

angular-project-front/src/app/shared/models/employee/employee.model.ts

@@ -0,0 +1,13 @@
+import { EmployeeType } from './employee.type';
+import { EmployeeState } from './employee.state';
+
+export class Employee {
+  employeeID!: string;
+  firstname!:string;
+  lastname!: string;
+  email!: string;
+  hireDate!: Date;
+  employeeState!: EmployeeState
+  employeeType!: EmployeeType
+  addressID!: string
+}

angular-project-front/src/app/shared/models/employee/employee.state.ts

@@ -0,0 +1,4 @@
+export enum EmployeeState {
+  ACTIVE ="ACTIVE",
+  HISTORIZED = "HISTORIZED"
+}