add controll panel for proejcts

src/app/customers/services/customer.service.ts

@@ -18,6 +18,13 @@ export class CustomerService {
     
     return this.http.get<Customer[]>(this.config.getServerUrl()+ "/Customers");
   }
+  public getCustomersByFilter(name : string ):Observable<Customer[]>{
+    
+    return this
+    .http
+    .get<Customer[]>(this.config.getServerUrl()+ "/Customers")
+    ;
+  }
   
   public getCustomerById(id : number ):Observable<Customer>{
     

src/app/employees/services/employees.service.ts

@@ -9,6 +9,7 @@ import { EmployeeParticipate } from '../models/responses/employeeParticipate';
 import { GetEmployeeTrackHistoryRequest } from '../models/requests/getEmployeeTrackHistoryRequest';
 import { EmployeeTrack } from '../../tracks/models/responses/employeeTrack';
 import { UpdateEmplyeeWorkHours } from '../models/requests/updateEmployeeWorkHoursRequest';
+import { Department } from '../../projects/models/responses/Department';
 
 @Injectable({
   providedIn: 'root'
@@ -29,6 +30,12 @@ export class EmployeesService {
     return this.http.get<Employee>(this.config.getServerUrl()+ "/Employees/"+id);
   }
 
+  public getDepartments( ):Observable<Department[]>{
+    
+    return this.http.get<Department[]>(this.config.getServerUrl()+ "/Employees/GetDepartments/");
+  }
+
+  
   public getCurrentEmployee( ):Observable<Employee>{
     let id = this.userService.getEmployeeId();
 

src/app/projects/components/project-controll/info-controll/info-controll.component.html

-<p>info-controll works!</p>
+<div class="row align-items-center mb-4">
+  <div class=" mb-4 text-center">
+    <strong>معلومات المشروع</strong>
+  </div>
+  <div class="row">
+    <div
+      class="col-md-6 col-lg-4"
+      [routerLink]="['/projects/', project.id,'steps']"
+    >
+      <div class="card shadow mb-4">
+        <div class="card-body file-list">
+          <div class="d-flex align-items-center">
+            <div class="circle circle-md bg-secondary">
+              <span class="fe fe-credit-card fe-16 text-white"></span>
+            </div>
+            <div class="flex-fill ml-4 fname">
+              <strong> إدارة المراحل</strong><br />
+            </div>
+          </div>
+        </div>
+        <!-- .card-body -->
+      </div>
+      <!-- .card -->
+    </div>
+    <!-- .col -->
+    <div class="col-md-6 col-lg-4">
+      <div class="card shadow mb-4">
+        <div class="card-body file-list">
+          <div class="d-flex align-items-center">
+            <div class="text-center">
+              <div class="circle circle-md bg-secondary">
+                <span class="fe fe-users fe-16 text-white"></span>
+              </div>
+            </div>
+            <div class="flex-fill ml-4 fname">
+              <strong>إضافة المرفقات</strong><br />
+            </div>
+          </div>
+        </div>
+        <!-- .card-body -->
+      </div>
+      <!-- .card -->
+    </div>
+    <!-- .col -->
+    <div
+      class="col-md-6 col-lg-4"
+      [routerLink]="['/projects/', project.id,'participants']"
+    >
+      <div class="card shadow mb-4">
+        <div class="card-body file-list">
+          <div class="d-flex align-items-center">
+            <div class="circle circle-md bg-secondary">
+              <span class="fe fe-map fe-16 text-white"></span>
+            </div>
+            <div class="flex-fill ml-4 fname">
+              <strong>إدارة المشاركين</strong><br />
+            </div>
+          </div>
+        </div>
+        <!-- .card-body -->
+      </div>
+      <!-- .card -->
+    </div>
+    <!-- .row -->
+  </div>
+  <div class="col-md-6 col-lg-4" >
+    <div class="card shadow mb-4">
+      <div class="card-body file-list">
+        <div class="d-flex align-items-center">
+          <div class="circle circle-md bg-secondary">
+            <span class="fe fe-map fe-16 text-white"></span>
+          </div>
+          <div class="flex-fill ml-4 fname">
+            <strong>تغيير مدير المشروع</strong><br />
+          </div>
+        </div>
+      </div> <!-- .card-body -->
+    </div> <!-- .card -->
+  </div>
+
+</div>

src/app/projects/components/project-controll/info-controll/info-controll.component.ts

-import { Component } from '@angular/core';
+import { Component, Input } from '@angular/core';
+import { Project } from '../../../models/responses/project';
 
 @Component({
   selector: 'info-controll',
@@ -6,5 +7,5 @@ import { Component } from '@angular/core';
   styleUrl: './info-controll.component.css'
 })
 export class InfoControllComponent {
-
+@Input() project : Project
 }

src/app/projects/components/project-controll/plan-controll/plan-controll.component.html

-<p>plan-controll works!</p>
+<div class="row align-items-center mb-4">
+    <div class=" text-center mb-4">
+      <strong>تخطيط المشروع</strong>
+    
+    </div>
+
+
+    <div class="row">
+      <div class="col-md-6 col-lg-4" [routerLink]="['/projects/',project.id,'spending']">
+        <div class="card shadow mb-4">
+          <div class="card-body file-list">
+            <div class="d-flex align-items-center">
+              <div class="circle circle-md bg-secondary">
+                <span class="fe fe-credit-card fe-16 text-white"></span>
+              </div>
+              <div class="flex-fill ml-4 fname">
+                <strong>إدارة خطة الانفاق</strong><br />
+              </div>
+              
+            </div>
+          </div> <!-- .card-body -->
+        </div> <!-- .card -->
+      </div> <!-- .col -->
+
+
+      <div class="col-md-6 col-lg-4" [routerLink]="['/projects/',project.id,'participants/']">
+        <div class="card shadow mb-4">
+          <div class="card-body file-list">
+            <div class="d-flex align-items-center">
+              <div class="text-center">
+                <div class="circle circle-md bg-secondary">
+                  <span class="fe fe-users fe-16 text-white"></span>
+                </div>
+              </div>
+              <div class="flex-fill ml-4 fname">
+                <strong>إدارة المشاركين </strong><br />
+              </div>
+            </div>
+          </div> <!-- .card-body -->
+        </div> <!-- .card -->
+      </div> <!-- .col -->
+
+      
+      <div class="col-md-6 col-lg-4" [routerLink]="['/projects/',project.id,'steps']">
+        <div class="card shadow mb-4">
+          <div class="card-body file-list">
+            <div class="d-flex align-items-center">
+              <div class="circle circle-md bg-secondary">
+                <span class="fe fe-map fe-16 text-white"></span>
+              </div>
+              <div class="flex-fill ml-4 fname">
+                <strong>إدارة الخطة</strong><br />
+              </div>
+            </div>
+          </div> <!-- .card-body -->
+        </div> <!-- .card -->
+      
+      </div> <!-- .row -->
+
+      <div class="col-md-6 col-lg-4" [routerLink]="['/projects/',project.id,'/steps']">
+        <div class="card shadow mb-4">
+          <div class="card-body file-list">
+            <div class="d-flex align-items-center">
+              <div class="circle circle-md bg-secondary">
+                <span class="fe fe-map fe-16 text-white"></span>
+              </div>
+              <div class="flex-fill ml-4 fname">
+                <strong>الانتقال إلى طور التنفيذ</strong><br />
+              </div>
+            </div>
+          </div> <!-- .card-body -->
+        </div> <!-- .card -->
+      </div>
+
+      
+  </div>

src/app/projects/components/project-controll/plan-controll/plan-controll.component.ts

-import { Component } from '@angular/core';
+import { Component, Input } from '@angular/core';
+import { Project } from '../../../models/responses/project';
 
 @Component({
   selector: 'plan-controll',
@@ -7,4 +8,5 @@ import { Component } from '@angular/core';
 })
 export class PlanControllComponent {
 
+  @Input() project : Project 
 }

src/app/projects/components/project-controll/report-controll/report-controll.component.html

+<div class="row align-items-center mb-4">
+    <div class=" mb-4 text-center">
+      <strong>تقارير المشروع</strong>
+    </div>
+    <div class="row">
+      <div
+        class="col-md-6 col-lg-4"
+        [routerLink]="['/reports/definition/', project.id]"
+      >
+        <div class="card shadow mb-4">
+          <div class="card-body file-list">
+            <div class="d-flex align-items-center">
+              <div class="circle circle-md bg-secondary">
+                <span class="fe fe-credit-card fe-16 text-white"></span>
+              </div>
+              <div class="flex-fill ml-4 fname">
+                <strong> بطاقة المشروع</strong><br />
+              </div>
+            </div>
+          </div>
+          <!-- .card-body -->
+        </div>
+        <!-- .card -->
+      </div>
+      <!-- .col -->
+      <div class="col-md-6 col-lg-4" [routerLink]="['/reports/timeline',project.id]">
+        <div class="card shadow mb-4">
+          <div class="card-body file-list">
+            <div class="d-flex align-items-center">
+              <div class="text-center">
+                <div class="circle circle-md bg-secondary">
+                  <span class="fe fe-users fe-16 text-white"></span>
+                </div>
+              </div>
+              <div class="flex-fill ml-4 fname">
+                <strong>بطاقة الخطة الزمنية</strong><br />
+              </div>
+            </div>
+          </div>
+          <!-- .card-body -->
+        </div>
+        <!-- .card -->
+      </div>
+      <!-- .col -->
+      <div
+        class="col-md-6 col-lg-4"
+       
+      >
+        <div class="card shadow mb-4">
+          <div class="card-body file-list">
+            <div class="d-flex align-items-center">
+              <div class="circle circle-md bg-secondary">
+                <span class="fe fe-map fe-16 text-white"></span>
+              </div>
+              <div class="flex-fill ml-4 fname">
+                <strong>بطاقة انجاز</strong><br />
+              </div>
+            </div>
+          </div>
+          <!-- .card-body -->
+        </div>
+        <!-- .card -->
+      </div>
+      <!-- .row -->
+    </div>
+    <div class="col-md-6 col-lg-4" >
+      <div class="card shadow mb-4">
+        <div class="card-body file-list">
+          <div class="d-flex align-items-center">
+            <div class="circle circle-md bg-secondary">
+              <span class="fe fe-map fe-16 text-white"></span>
+            </div>
+            <div class="flex-fill ml-4 fname">
+              <strong>بطاقة انشغالية العاملين</strong><br />
+            </div>
+          </div>
+        </div> <!-- .card-body -->
+      </div> <!-- .card -->
+    </div>
+    <div class="col-md-6 col-lg-4" >
+        <div class="card shadow mb-4">
+          <div class="card-body file-list">
+            <div class="d-flex align-items-center">
+              <div class="circle circle-md bg-secondary">
+                <span class="fe fe-map fe-16 text-white"></span>
+              </div>
+              <div class="flex-fill ml-4 fname">
+                <strong>بطاقة متابعة المراحل</strong><br />
+              </div>
+            </div>
+          </div> <!-- .card-body -->
+        </div> <!-- .card -->
+      </div>
+    
+  </div>
+  
\ No newline at end of file

src/app/projects/components/project-controll/report-controll/report-controll.component.ts

+import { Component, Input } from '@angular/core';
+import { Project } from '../../../models/responses/project';
+
+@Component({
+  selector: 'report-controll',
+  templateUrl: './report-controll.component.html',
+  styleUrl: './report-controll.component.css'
+})
+export class ReportControllComponent {
+
+  @Input() project : Project 
+}

src/app/projects/components/project-controll/track-controll/track-controll.component.html

-<p>track-controll works!</p>
+<div class="row align-items-center mb-4">
+    <div class=" text-center  mb-4 ">
+      <strong>متابعة المشروع</strong>
+    </div>
+    <div class="row">
+      <div class="col-md-6 col-lg-4"  [routerLink]="['/tracks/project/',project.id]">
+        <div class="card shadow mb-4">
+          <div class="card-body file-list">
+            <div class="d-flex align-items-center">
+              <div class="circle circle-md bg-secondary">
+                <span class="fe fe-compass fe-16 text-white"></span>
+              </div>
+              <div class="flex-fill ml-4 fname">
+                <strong>المتابعة</strong><br />
+              </div>
+              
+            </div>
+          </div> <!-- .card-body -->
+        </div> <!-- .card -->
+      </div> 
+      <div class="col-md-6 col-lg-4" >
+        <div class="card shadow mb-4">
+          <div class="card-body file-list">
+            <div class="d-flex align-items-center">
+              <div class="circle circle-md bg-secondary">
+                <span class="fe fe-map fe-16 text-white"></span>
+              </div>
+              <div class="flex-fill ml-4 fname">
+                <strong>إنجاز المشروع</strong><br />
+              </div>
+            </div>
+          </div> <!-- .card-body -->
+        </div> <!-- .card -->
+      </div>
+      <div class="col-md-6 col-lg-4" [routerLink]="['/projects/',project.id,'/steps']">
+        <div class="card shadow mb-4">
+          <div class="card-body file-list">
+            <div class="d-flex align-items-center">
+              <div class="circle circle-md bg-secondary">
+                <span class="fe fe-map fe-16 text-white"></span>
+              </div>
+              <div class="flex-fill ml-4 fname">
+                <strong>العودة إلى مرحلة التخطيط</strong><br />
+              </div>
+            </div>
+          </div> <!-- .card-body -->
+        </div> <!-- .card -->
+      </div>
+  </div>
+  
\ No newline at end of file

src/app/projects/components/project-controll/track-controll/track-controll.component.ts

-import { Component } from '@angular/core';
+import { Component, Input } from '@angular/core';
+import { Project } from '../../../models/responses/project';
 
 @Component({
   selector: 'track-controll',
@@ -7,4 +8,5 @@ import { Component } from '@angular/core';
 })
 export class TrackControllComponent {
 
+  @Input() project : Project
 }

src/app/projects/models/requests/project-requests/addParticipantRequest.ts

@@ -6,3 +6,4 @@ export interface AddParticipantRequest {
     partialTimeRatio: number;
     role: string;
 }
+

src/app/projects/models/requests/project-requests/changeEmployeeParticipationRequest.ts

+export class ChangeEmployeeParticipationRequest {
+    participantId: number;
+    projectId: number;
+    partialTimeRation: number;
+    role: string;
+}

src/app/projects/models/requests/project-requests/completeProjectRequest.ts

+
+export class CompleteProjectRequest {
+
+    projectId: number;
+    completionDate: Date;
+    customerNotes: string;
+    customerRate: number;
+
+}

src/app/projects/models/requests/project-requests/createProjectRequest.ts

@@ -14,7 +14,7 @@ export class CreateProjectRequest {
     projectManagerId :number
     proposerId :number
     executerId :number
-
+    projectTypeId :number 
     constructor(){
         
         this.projectAggreement= {
@@ -28,8 +28,7 @@ export class CreateProjectRequest {
 
         this.projectClassification = {
             projectNature :'',
-            projectStatus:'',
-            projectType:''
+            projectStatus:''
         }
         this.projectInfo ={
             name :'',

src/app/projects/models/responses/project.ts

@@ -9,6 +9,7 @@ import { ProjectClassification } from "../valueObjects/ProjectClassification"
 import { Department } from "./Department"
 import { Step } from "./Step"
 import { FinancialSpending } from "./FinancialSpending"
+import { ProjectType } from "../../../projects-types/models/responses/projectType"
 export class Project
 {
     id:number
@@ -24,6 +25,8 @@ export class Project
     executer:Department
     proposerId:number
     proposer:Customer
+    projectType : ProjectType
+    projectTypeId :number 
     steps :Step[]
     financialSpending : FinancialSpending[]
     employeeParticipates:EmployeeParticipate[]

src/app/projects/models/valueObjects/ProjectClassification.ts

 export interface ProjectClassification {
     projectStatus: string;
-    projectType: string;
     projectNature: string;
 }

src/app/projects/pages/project-create/project-create.component.html

-<div class="card col-10">
+<div class="card col-10" *ngIf="types && departments">
   <div class="card-body">
     <h5 class="card-title text-center"><strong>طرح مشروع جديد</strong></h5>
 
@@ -69,11 +69,7 @@
         </mat-form-field>
 
     </div>
-          
-      <!-- <div class="row mb-4" formGroupName="projectInfo">
-      
-      </div> -->
-    
+  
       <div class="row mb-4" formGroupName="financialFund">
       
         
@@ -124,13 +120,21 @@
         <mat-form-field>
           <mat-label>الفعالية المنفذة </mat-label>
           <mat-select formControlName="executerId">
-            <mat-option value="1">قسم المعلوميات</mat-option>
-            <mat-option value="2">قسم النظم الاكترونية</mat-option>
+            <mat-option *ngFor="let department of departments " [value]="department.id">{{department.name}}</mat-option>
           </mat-select>
         </mat-form-field>
         
       </div>
-    
+      <div class="col-4">
+        <mat-form-field>
+          <mat-label for="projectTypeId" class="form-label">نوع النشاط </mat-label>
+          <mat-select    id="projectTypeId" formControlName="projectTypeId">
+            <mat-option  *ngFor="let type of types " [value]="type.id">{{type.typeName}}</mat-option>
+          </mat-select>
+        </mat-form-field>
+        
+      </div>
+
       <div class="row mb-4" formGroupName="projectClassification">
       
         <mat-form-field class="col-4">
@@ -142,10 +146,6 @@
           <mat-label  for="projectNature" class="form-label" >طبيعة النشاط</mat-label>
           <input formControlName="projectNature" class="form-control" id="projectNature" matInput />
         </mat-form-field>
-        <mat-form-field class="col-4">
-          <mat-label for="projectType" class="form-label" >وضع النشاط</mat-label>
-          <input formControlName="projectType" class="form-control" id="projectType" matInput />
-        </mat-form-field>
      
       </div>
     

src/app/projects/pages/project-create/project-create.component.ts

+//#region  imports 
 import { Component } from '@angular/core';
 import { EmployeesService } from '../../../employees/services/employees.service';
 import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
 import { debounceTime, distinctUntilChanged, map, Observable, startWith, switchMap } from 'rxjs';
 import { Employee } from '../../../employees/models/responses/employee';
-import { Result } from '../../../core/models/result';
-import { Project } from '../../models/responses/project';
 import { Customer } from '../../../customers/models/customer';
 import { CustomerService } from '../../../customers/services/customer.service';
 import { ProjectService } from '../../services/project.service';
 import { CreateProjectRequest } from '../../models/requests/project-requests/createProjectRequest';
 import { ToastrComponentlessModule, ToastrService } from 'ngx-toastr';
 import { Router } from '@angular/router';
+import { Department } from '../../models/responses/Department';
+import { ProjectType } from '../../../projects-types/models/responses/projectType';
+import { ProjectsTypesService } from '../../../projects-types/services/projects-types.service';
+//#endregion imports
+
 
 @Component({
   selector: 'project-create',
@@ -18,92 +22,196 @@ import { Router } from '@angular/router';
   styleUrl: './project-create.component.css'
 })
 export class ProjectCreateComponent {
+
+  //#region  Forms and Filters 
+
   projectForm: FormGroup;
   filteredManagers: Observable<Employee[]>;
   filteredLeaders: Observable<Employee[]>;
   filteredCustomers: Observable<Customer[]>;
 
+  //#endregion Forms and Filters 
+
+  //#region  Selection options 
+  departments: Department[]
+  types : ProjectType[]
+
   projectManager :Employee 
   teamLeader :Employee 
   proposer :Customer
+  
+  //#endregion Selection options
+
+  //#region Project request 
+
   request = new CreateProjectRequest()
   
+  //#endregion Project request 
+  
+  //#region  Constructor 
   constructor(
     private fb: FormBuilder,
     private employeeService: EmployeesService,
     private customersService : CustomerService,
+    private typesService : ProjectsTypesService,
     private projectService :ProjectService,
     private toastr : ToastrService,
     private router :Router
   ) {}
 
+  //#endregion Constructor 
+  
+
+  //#region  On init 
+  
   ngOnInit(): void {
+
     this.request= new CreateProjectRequest();
+    
     this._buildFrom();
+    this.valuesChangesSubscribtion();
+    
+    this.loadDepartments();
+    this.loadProjectsTypes();
+
+  }
+  
+  //#endregion On init 
+
+
+  //#region  Oninit Data Loaders 
+  loadProjectsTypes(){
+    this
+    .typesService
+    .getAllTypes()
+    .subscribe({
+
+      next: (data)=>{
+        this.types= data ;
+      }
+      ,
+      error: (err)=>{
+        this.toastr.error("تعذر تحميل أنواع المشاريع");
+      }
+
+    });
+
+  }
+  loadDepartments(){
+    
+    this
+    .employeeService
+    .getDepartments()
+    .subscribe({
+      next: (data)=>{
+        this.departments =data 
+      }
+      ,
+      error: (err)=>{
+        this.toastr.error("تعذر تحميل الأقسام");
+      }
+
+    });
+
+  }
+
+    //#endregion  Oninit Data Loaders 
+  
 
-    this.projectForm.valueChanges.subscribe(values => {
+
+  //#region  Auto Complete Filters 
+  valuesChangesSubscribtion(){
+  
+    this
+    .projectForm
+    .valueChanges
+    .subscribe(values => {
       this.request = {
-        ...this.request, // Preserve other properties
-        ...values, // Overwrite properties with form values
+        ...this.request, 
+        ...values, 
         projectInfo: { ...this.request.projectInfo, ...values.projectInfo },
         financialFund: { ...this.request.financialFund, ...values.financialFund },
         projectAggreement: { ...this.request.projectAggreement, ...values.projectAggreement },
         projectClassification: { ...this.request.projectClassification, ...values.projectClassification },
       };
     });
+
     // Autocomplete for Project Manager
     this.filteredManagers = this.projectForm.get('projectManager')!.valueChanges.pipe(
       debounceTime(300),
       switchMap(value => this.employeeService.getByFilter(value))
     );
-
+  
     // Autocomplete for Team Leader
     this.filteredLeaders = this.projectForm.get('teamLeader')!.valueChanges.pipe(
       debounceTime(300),
       switchMap(value => this.employeeService.getByFilter(value))
     );
-
+  
     // Autocomplete for Customer
     this.filteredCustomers = this.projectForm.get('customer')!.valueChanges.pipe(
       debounceTime(300),
-      switchMap(value => this.customersService.getCustomers())
+      switchMap(value => this.customersService.getCustomersByFilter(value))
+        
     );
-  }
   
+  }
+  //#endregion Auto omplete Filters  
+ 
+ 
+  //#region  On Selection 
+
   onManagerSelected(manager: Employee) {
     this.projectManager = manager;
     this.request.projectManagerId = manager.id;
-    this.projectForm.get('projectManager')!.setValue(manager.personalInfo.firstName+" " + manager.personalInfo.lastName +" , "+manager.email , { emitEvent: false });
+    
+    this
+    .projectForm
+    .get('projectManager')!
+    .setValue(manager.personalInfo.firstName+" " + manager.personalInfo.lastName +" , "+manager.email , { emitEvent: false });
+ 
   }
 
   onLeaderSelected(leader: Employee) {
     this.teamLeader = leader;
     this.request.teamLeaderId = leader.id;
-    this.projectForm.get('teamLeader')!.setValue(leader.personalInfo.firstName+" " + leader.personalInfo.lastName +" , "+leader.email , { emitEvent: false });
+    
+    this
+    .projectForm
+    .get('teamLeader')!
+    .setValue(leader.personalInfo.firstName+" " + leader.personalInfo.lastName +" , "+leader.email , { emitEvent: false });
+  
   }
 
   onCustomerSelected(customer: Customer) {
     this.proposer = customer;
     this.request.proposerId = customer.id;
-    this.projectForm.get('customer')!.setValue(customer.customerName, { emitEvent: false });
+  
+    this
+    .projectForm
+    .get('customer')!
+    .setValue(customer.customerName, { emitEvent: false });
+  
   }
 
-  onSubmit(request : CreateProjectRequest){
+  //#endregion On Selection 
+  
 
-    console.log(request)
-    debugger
-    console.log(this.projectForm.errors)
-    console.log(this.projectForm.valid)
+  //#region  On Submit 
+
+  onSubmit(request : CreateProjectRequest){
   
     if(this.projectForm.valid){ 
-      this.projectService.createProject(request).subscribe({
-
+     
+      this
+      .projectService
+      .createProject(request)
+      .subscribe({
+        
         next: (data)=>{
           this.toastr.success("تمت إضافة الجهة بنجاح")
           this.router.navigate(['/projects/detail/',data])
-
-        }
-        ,
+        },
 
         error:(err)=>{
           this.toastr.error("لقد حدث خطاء ما")
@@ -116,6 +224,11 @@ export class ProjectCreateComponent {
       
   }
 
+  //#endregion On Submit 
+  
+
+  //#region  Form Builders 
+
   _buildFrom(){
     this.projectForm = this.fb.group({
       projectManager: [''],
@@ -144,11 +257,14 @@ export class ProjectCreateComponent {
       projectClassification: this.fb.group({
         projectStatus: ['', Validators.required],
         projectNature: ['', Validators.required],
-        projectType: ['', Validators.required],
       }),
-      executerId: ['', Validators.required],
+      projectTypeId: [1, Validators.required],
+      
+      executerId: [1, Validators.required],
     });
    
 
   }
+  //#endregion Form Builders
+  
 }

src/app/projects/pages/project-details/project-details.component.ts

@@ -4,8 +4,7 @@ import { ToastrService } from 'ngx-toastr';
 import { Project } from '../../models/responses/project';
 import { PdfDownloaderService } from '../../../core/services/pdfDownloader/pdf-downloader.service';
 import { ProjectService } from '../../services/project.service';
-import { icons } from 'feather-icons/generated/feather-icons';
-import { param } from 'jquery';
+
 
 @Component({
   selector: 'project-details',
@@ -22,18 +21,28 @@ export class ProjectDetailsComponent implements OnInit {
     private toastr: ToastrService,
     private pdfDownloader : PdfDownloaderService
     ) {}
-  ngOnInit(): void {
+
+    ngOnInit(): void {
     const id = Number(this.route.snapshot.paramMap.get('id'));
-    this.projectService.getProjectById(id).subscribe({
+
+    this
+    .projectService
+    .getProjectById(id)
+    .subscribe({
       next :(data) => {
         
-          this.project = data;
-        
-    },
-    error : (err)=>{ console.log(err)}
+        this.project = data;
+      },
+
+      error : (err)=>{ 
+        console.log(err)
+      }
+    
+    });
 
-  });
   }
+
+  
   public downloadAsPdf(): void {
     this.pdfDownloader.downloadAsPdf('pdfContent');
   }

src/app/projects/project-routing.module.ts

@@ -12,9 +12,9 @@ const routes: Routes = [
   {path:'',component :ProjectListComponent},
   { path: 'detail/:id', component: ProjectDetailsComponent },
   { path: 'create', component: ProjectCreateComponent },
-  { path: 'steps/:id', component: StepListComponent },
-  { path: 'participants/:id', component: ParticipantsListComponent },
-  { path: 'spending/:id', component: FinancialSpendingComponent }
+  { path: ':id/steps', component: StepListComponent },
+  { path: ':id/participants', component: ParticipantsListComponent },
+  { path: ':id/spending', component: FinancialSpendingComponent }
   
 
  

src/app/projects/projects.module.ts

@@ -30,6 +30,7 @@ import { AddFinancialSpendModalComponent } from './components/modals/add-financi
 import { AddAttachmentModalComponent } from './components/modals/add-attachment-modal/add-attachment-modal.component';
 import { FinancialSpendingComponent } from './pages/financial-spending/financial-spending.component';
 import { FinancialItemComponent } from './components/financial-item/financial-item.component';
+import { ReportControllComponent } from './components/project-controll/report-controll/report-controll.component';
 
 @NgModule({
   declarations: [
@@ -50,7 +51,8 @@ import { FinancialItemComponent } from './components/financial-item/financial-it
     AddFinancialSpendModalComponent,
     AddAttachmentModalComponent,
     FinancialSpendingComponent,
-    FinancialItemComponent
+    FinancialItemComponent,
+    ReportControllComponent
   ],
   providers: [
     ProjectService,

src/app/projects/services/project.service.ts

@@ -16,6 +16,8 @@ import { RePlanProjectRequest } from '../models/requests/project-requests/RePlan
 import { CreateProjectRequest } from '../models/requests/project-requests/createProjectRequest';
 import { AddAttachmentRequest } from '../models/requests/project-requests/AddAttachmentRequest';
 import { Attachment } from '../models/responses/Attachment';
+import { CompleteProjectRequest } from '../models/requests/project-requests/completeProjectRequest';
+import { ChangeEmployeeParticipationRequest } from '../models/requests/project-requests/ChangeEmployeeParticipationRequest';
 
 @Injectable({
   providedIn: 'root'
@@ -118,7 +120,11 @@ export class ProjectService {
     return this.http.post<void>(this.config.getServerUrl()+ "/Projects/RemoveParticipant",request);
 
   }
+  public changeParticipation(request  : ChangeEmployeeParticipationRequest ):Observable<void>{
+    
+    return this.http.post<void>(this.config.getServerUrl()+ "/Projects/ChangeParticipation",request);
 
+  }
   //tihs method responsible for adda new participant to the project
   //
   public addParticipant(request  : AddParticipantRequest ):Observable<void>{
@@ -157,9 +163,9 @@ export class ProjectService {
 
   //tihs method responsible for changing the state of the project to completed
   //
-  public completeProject(projectId : number  ):Observable<void>{
+  public completeProject(request : CompleteProjectRequest  ):Observable<void>{
     
-    return this.http.post<void>(this.config.getServerUrl()+ "/Projects/CompleteProject/"+projectId,{});
+    return this.http.post<void>(this.config.getServerUrl()+ "/Projects/CompleteProject/",request);
 
   }
 

src/app/reports/pages/project-definition/project-definition.component.html

@@ -43,7 +43,7 @@
               <p class="mb-4">
                 <strong>معلومات حالة المشروع </strong>
                 <br /> المرحلة التطويرير : <small>{{project.currentState }} </small>
-                <br />نوع المشروع  : <small>{{project.projectClassification.projectType}} </small>
+                <br />نوع المشروع  : <small>{{project.projectType.typeName}} </small>
                 <br /> طبيعة المشروع : <small>{{project.projectClassification.projectNature}} </small>
               
               </p>