add main domains services

src/app/core/interceptors/jwt.interceptor.ts

@@ -15,7 +15,7 @@ export class JwtInterceptor implements HttpInterceptor {
     if (token) {
       request = request.clone({
         setHeaders: {
-          Authorization: `Bearer ${token}`
+          Authorization: `Bearer ${token.trim()}`
         }
       });
     }

src/app/customers/pages/customer-create/customer-create.component.ts

@@ -30,14 +30,10 @@ export class CustomerCreateComponent {
     this.customerService.createCustomer(request)
     .subscribe({
       next : (res)=>{
-        if(res.isSuccess){
-
-          this.toastr.success("تمت إضافة الجهة بنجاح");
-          this.router.navigate(['customers/detail', res.value.id]);
-        }else {
-          this.toastr.error(res.validationErrors[0].errorMessage);
-        }
-
+        
+        this.toastr.success("تمت إضافة الجهة بنجاح");
+        this.router.navigate(['customers/detail', res.id]);
+        
       }
       ,
       error : (err)=>this.toastr.error("An error Occured")

src/app/customers/pages/customer-details/customer-details.component.ts

@@ -25,15 +25,9 @@ export class CustomerDetailsComponent implements OnInit {
     const id = Number(this.route.snapshot.paramMap.get('id'));
     this.customerService.getCustomerById(id).subscribe({
       next :(data) => {
-        console.log(data.validationErrors)
-          
-        if(data.isSuccess){
-          this.customer = data.value;
-        }else {
-          this.toastr.error(data.validationErrors[0].errorMessage);
-          // this.router()
-
-        }
+        
+         this.customer = data;
+        
     },
     error : (err)=>{ console.log(err)}
 

src/app/customers/pages/customer-list/customer-list.component.ts

@@ -44,19 +44,13 @@ export class CustomerListComponent implements OnInit {
     this.customerService.getCustomers().subscribe({
       next : (res) =>{ 
         console.log(res);
-        if(res.isSuccess){
-          this.toastr.success('تم تحميل الجهات الطارجة بنجاح');
-          this.customers = res.value; 
-          
-        }else {
-          this.toastr.error(res.errors[0],"error");
-        
-        }
+        this.toastr.success('تم تحميل الجهات الطارجة بنجاح');
+        this.customers = res; 
 
         this.loadingService.hide();
       },
       error: (err)=>{
-        this.toastr.error('Failed to load customers');
+        this.toastr.error('لقد حدث خطاء ما ');
         this.loadingService.hide();
         
       }

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

@@ -13,24 +13,24 @@ export class CustomerService {
 
   constructor(private http :HttpClient ,private config : ConfigurationService) { }
   
-  public getCustomers():Observable<Result<Customer[]>>{
+  public getCustomers():Observable<Customer[]>{
     
-    return this.http.get<Result<Customer[]>>(this.config.getServerUrl()+ "/Customers");
+    return this.http.get<Customer[]>(this.config.getServerUrl()+ "/Customers");
   }
   
-  public getCustomerById(id : number ):Observable<Result<Customer>>{
+  public getCustomerById(id : number ):Observable<Customer>{
     
-    return this.http.get<Result<Customer>>(this.config.getServerUrl()+ "/Customers/"+id);
+    return this.http.get<Customer>(this.config.getServerUrl()+ "/Customers/"+id);
   }
   
-  public createCustomer(customer :CreateCustomerRequest):Observable<Result<Customer>>{
+  public createCustomer(customer :CreateCustomerRequest):Observable<Customer>{
     
-    return this.http.post<Result<Customer>>(this.config.getServerUrl()+ "/Customers",customer);
+    return this.http.post<Customer>(this.config.getServerUrl()+ "/Customers",customer);
   }
 
-  public updateCustomer(id :number ,customer :Customer):Observable<Result<void>>{
+  public updateCustomer(id :number ,customer :Customer):Observable<void>{
     
-    return this.http.put<Result<void>>(`${this.config.getServerUrl()}/Customers/${id}` ,customer);
+    return this.http.put<void>(`${this.config.getServerUrl()}/Customers/${id}` ,customer);
   }
   
   public deleteCustomer(id: number): Observable<void> {

src/app/employees/models/responses/employee.ts

-import { Availability } from "../vakueObjects/Availability"
+import { Availability } from "../vakueObjects/availability"
 import { PersonalInfo } from "../vakueObjects/personalInfo"
-import { WorkInfo } from "../vakueObjects/WorkInfo"
+import { WorkInfo } from "../vakueObjects/workInfo"
 
 export class Employee {
     id:number
     hiastId :number
     userId :number
+    email : string
     departmentName :string
     personalInfo :PersonalInfo
     availability :Availability

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

@@ -24,34 +24,40 @@ export class EmployeesService {
    }
   
   
-  public getEmployeeById(id : number ):Observable<Result<Employee>>{
+  public getEmployeeById(id : number ):Observable<Employee>{
     
-    return this.http.get<Result<Employee>>(this.config.getServerUrl()+ "/Employees/"+id);
+    return this.http.get<Employee>(this.config.getServerUrl()+ "/Employees/"+id);
   }
-  public getCurrentEmployee( ):Observable<Result<Employee>>{
+
+  public getCurrentEmployee( ):Observable<Employee>{
     let id = this.userService.getEmployeeId();
 
     return this.getEmployeeById(id);
   }
   
-  public getAvailableEmployees( ):Observable<Result<Employee[]>>{
+    public getByFilter(email : string  ):Observable<Employee[]>{
+    return this.http.get<Employee[]>(`${this.config.getServerUrl()}/Employees/ByFilter/?email=${email}`);
+
+  }
+  
+  public getAvailableEmployees( ):Observable<Employee[]>{
 
     //this api endpoint take a pagination , i'll use i later 
-    return this.http.get<Result<Employee[]>>(this.config.getServerUrl + "/Employees/Available");
+    return this.http.get<Employee[]>(this.config.getServerUrl() + "/Employees/Available");
   }
   
-  public getEmployeeParticipations(id :number ):Observable<Result<EmployeeParticipate[]>>{
+  public getEmployeeParticipations(id :number ):Observable<EmployeeParticipate[]>{
 
-    return this.http.get<Result<EmployeeParticipate[]>>(`${this.config.getServerUrl}/Employees/EmployeeParticipations/employeeId=${id}`);
+    return this.http.get<EmployeeParticipate[]>(`${this.config.getServerUrl}/Employees/EmployeeParticipations/employeeId=${id}`);
   }
 
-  public getMyParticipation( ):Observable<Result<EmployeeParticipate[]>>{
+  public getMyParticipation( ):Observable<EmployeeParticipate[]>{
 
     let id = this.userService.getEmployeeId();
     return this.getEmployeeParticipations(id);
 
   }
-  public getEmployeeTrackHistory( request: GetEmployeeTrackHistoryRequest):Observable<Result<EmployeeTrack[]>>{
+  public getEmployeeTrackHistory( request: GetEmployeeTrackHistoryRequest):Observable<EmployeeTrack[]>{
     let pagination=''
     if(request.pageSize && request.pageNumber){
        pagination = `&pageSize=${request.pageSize}&pageNumber=${request.pageNumber}`
@@ -60,26 +66,26 @@ export class EmployeesService {
     let query =`employeeId=${request.employeeId}&projectId=${request.projectId}${pagination}`
     return  this
               .http
-              .get<Result<EmployeeTrack[]>>(
+              .get<EmployeeTrack[]>(
                   `${this.config.getServerUrl}/Employees/TrackHistory/?${query}`
                 );
   }
   
-  public getMyTrackHistory(projectId : number):Observable<Result<EmployeeTrack[]>>{
+  public getMyTrackHistory(projectId : number):Observable<EmployeeTrack[]>{
     
     let query =`employeeId=${this.userService.getEmployeeId()}&projectId=${projectId}`
     return  this
               .http
-              .get<Result<EmployeeTrack[]>>(
+              .get<EmployeeTrack[]>(
                   `${this.config.getServerUrl}/Employees/TrackHistory/?${query}`
                 );
   }
 
-  public postEmployeeWorkHours( request: UpdateEmplyeeWorkHours):Observable<Result<void>>{
+  public postEmployeeWorkHours( request: UpdateEmplyeeWorkHours):Observable<void>{
 
     return  this
               .http
-              .post<Result<void>>(
+              .post<void>(
                   `${this.config.getServerUrl}/Employees/UpdateWorkHours/`,
                   request
                 );

src/app/pages/home/home.component.html

-<div class="pagetitle">
-    <h1>Dashboard</h1>
-    <nav>
-      <ol class="breadcrumb">
-        <li class="breadcrumb-item"><a href="index.html">Home</a></li>
-        <li class="breadcrumb-item active">Dashboard</li>
-      </ol>
-    </nav>
-  </div>
-  <section class="section dashboard">
-    workkkk
-    <h1 i18n="@@appTitle">My Awesome App</h1>
-    </section>
+<div class="row gy-4 align-items-center  py-5 features-item">
+          <div class="col-md-5 d-flex align-items-center aos-init aos-animate" data-aos="zoom-out" data-aos-delay="100">
+            <img src="assets/images/home/features-2.png" class="img-fluid" alt="">
+          </div>
+          <div class="col-md-7 aos-init aos-animate" data-aos="fade-up" data-aos-delay="100">
+            <h3>
+	مرحبا بك في موقع إدارة حالة المشاريع
+            </h3>
+            <p class="fst-italic">
+			 تابع مشاريعك بسهولة واستعرض ساعات عملك  
+            </p>
+
+            <p class="fst-italic">
\ No newline at end of file
+		
+            </p>
+            <ul>
+              <li><i class="bi bi-check"></i><span> تستطيع من خلال هذا الموقع الاطلاع على المشاريع التي تديرها ومتابعتها </span></li>
+              <li><i class="bi bi-check"></i> <span>كما يمكنك الاطلاع على ساعات عملك ضمن المشاريع التي تساهم بها</span></li>
+              <li><i class="bi bi-check"></i> <span>أصدر التقارير التي تحتاجها</span></li>
+            </ul>
+          </div>
+        </div>
\ No newline at end of file

src/app/pages/login/login.component.html

@@ -16,11 +16,11 @@
               <label for="inputPassword" class="sr-only">Password</label>
               <input type="password" id="inputPassword"name="password" [(ngModel)]="loginRequest.passWord" class="form-control form-control-lg" placeholder="Password" required="">
             </div>
-            <div class="checkbox mb-3">
+            <!-- <div class="checkbox mb-3">
               <label>
                 <input type="checkbox" value="remember-me"> Stay logged in </label>
             
-              </div>
+              </div> -->
             <button class="btn  btn-primary btn-block" (click)="onLogin()">Let me in</button>
             
             <p class="mt-5 mb-3 text-muted">© 2024</p>

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

 import { Aggreement } from "../valueObjects/Aggreement"
 import { FinancialFund } from "../valueObjects/FinancialFund"
+import { ProjectClassification } from "../valueObjects/ProjectClassification"
 import { ProjectInfo } from "../valueObjects/ProjectInfo"
 import { ProposalInfo } from "../valueObjects/proposalInfo"
 
@@ -8,8 +9,39 @@ export class CreateProjectRequest {
     proposalInfo :ProposalInfo
     projectAggreement :Aggreement
     financialFund :FinancialFund
+    projectClassification :ProjectClassification
     teamLeaderId :number
     projectManagerId :number
     proposerId :number
     executerId :number
+
+    constructor(){
+        
+        this.projectAggreement= {
+            aggreementDate :new Date(),
+            aggreementNumber:0
+        }
+        this.financialFund= {
+            source:'',
+            financialStatus :''
+        };
+
+        this.projectClassification = {
+            projectNature :'',
+            projectStatus:'',
+            projectType:''
+        }
+        this.projectInfo ={
+            name :'',
+            description:'',
+            code :'',
+            startDate : new Date(),
+            expectedEndDate :new Date ()
+        }
+        this.proposalInfo ={
+            proposingBookDate: new Date(),
+            proposingBookNumber:0 
+        }
+
+    }
 }
\ No newline at end of file

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

+
+export class Department {
+    id: number;
+    name: String;
+}

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

@@ -5,6 +5,8 @@ import { Aggreement } from "../valueObjects/Aggreement"
 import { FinancialFund } from "../valueObjects/FinancialFund"
 import { ProjectInfo } from "../valueObjects/ProjectInfo"
 import { ProposalInfo } from "../valueObjects/proposalInfo"
+import { ProjectClassification } from "../valueObjects/ProjectClassification"
+import { Department } from "./Department"
 import { Step } from "./Step"
 
 export class Project
@@ -13,17 +15,17 @@ export class Project
     proposalInfo : ProposalInfo 
     projectInfo :ProjectInfo
     currentState: string
+    projectClassification :ProjectClassification
     projectAggreement :Aggreement
     teamLeaderId: number
     teamLeader :Employee
     projectManagerId:number
     projectManager: Employee
-    executer: {
-        name :string
-    }
+    executer:Department
     proposerId:number
     proposer:Customer
     steps :Step[]
     employeeParticipates:EmployeeParticipate[]
     financialFund:FinancialFund
 }
+

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

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

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

@@ -2,3 +2,4 @@ export interface ProposalInfo{
     proposingBookNumber :number
     proposingBookDate : Date
 }
+

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

+:host {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+  }
\ No newline at end of file

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

-<form [formGroup]="projectForm">
-    <mat-form-field>
-      <input type="text" matInput placeholder="Project Manager" [formControl]="projectManagerControl" [matAutocomplete]="auto">
-      <mat-autocomplete #auto="matAutocomplete">
-        <mat-option *ngFor="let employee of filteredEmployees | async" [value]="employee.value.personalInfo.firstName">
-          {{ employee.name }}
-        </mat-option>
-      </mat-autocomplete>
-    </mat-form-field>
-  </form>
-  
+<div class="card col-10">
+  <div class="card-body">
+    <h5 class="card-title text-center">طرح مشروع جديد</h5>
+
+    <!-- Multi Columns Form -->
+    <form class="row g-3" [formGroup]="projectForm" (ngSubmit)="onSubmit(request)">
+      <div class="row">
+      <mat-form-field class="col-4"> 
+        <input type="text" placeholder="مدير المشروع" formControlName="projectManager" matInput [matAutocomplete]="autoPM">
+        <mat-autocomplete #autoPM="matAutocomplete" (optionSelected)="onManagerSelected($event.option.value)">
+          <mat-option *ngFor="let manager of filteredManagers | async" [value]="manager">
\ No newline at end of file
+            {{ manager.personalInfo | fullname }} , {{manager.email}}
+          </mat-option>
+        </mat-autocomplete>
+      </mat-form-field>
+    
+      <!-- Team Leader -->
+      <mat-form-field class="col-4">
+        <input type="text" placeholder="رئيس فريق العمل" formControlName="teamLeader" matInput [matAutocomplete]="autoTL">
+        <mat-autocomplete #autoTL="matAutocomplete" (optionSelected)="onLeaderSelected($event.option.value)">
+          <mat-option *ngFor="let leader of filteredLeaders | async" [value]="leader">
+            {{ leader.personalInfo | fullname  }} , {{leader.email}}
+          </mat-option>
+        </mat-autocomplete>
+      </mat-form-field>
+    
+      <!-- Customer -->
+      <mat-form-field class="col-4">
+        <input type="text" placeholder="الجهة الطارحة" formControlName="customer" matInput [matAutocomplete]="autoCustomer">
+        <mat-autocomplete #autoCustomer="matAutocomplete" (optionSelected)="onCustomerSelected($event.option.value)">
+          <mat-option *ngFor="let customer of filteredCustomers | async" [value]="customer">
+            {{ customer.customerName }} , {{customer.email}}
+          </mat-option>
+        </mat-autocomplete>
+      </mat-form-field>
+
+      </div>
+      <hr>
+    <div class="row mb-4" formGroupName="projectInfo">
+
+      <div class="col-4">
+        
+        <mat-form-field class="example-full-width">
+          <mat-label for="name" class="form-label">اسم النشاط</mat-label>
+          <input matInput  formControlName="name" [value]="request.projectInfo.name" placeholder="اسم المشروع" class="form-control" id="name">
+        </mat-form-field>
+      
+      </div>
+    
+      <div class="col-8 ">
+        <label for="description" class="form-label">الوصف</label>
+        <textarea formControlName="description" placeholder="تعريف النشاط " class="form-control"></textarea>
+      </div>
+
+    </div>
+          
+      <div class="row" formGroupName="projectInfo">
+        <div class="col-4">
+          <label for="code" class="form-label">رمز المشروع</label>
+          <input formControlName="code" class="form-control" id="code">
+        </div>
+        <div class="col-4">
+          <label for="endDate" class="form-label">تاريخ النهاية المتوقع</label>
+          <input type="date" formControlName="expectedEndDate" class="form-control" id="endDate">
+        </div>
+        <div class="col-4">
+          <label for="startDate" class="form-label">تاريخ البداية</label>
+          <input type="date" formControlName="startDate" class="form-control" id="startDate">
+        </div>
+      </div>
+    
+      <div class="row " formGroupName="financialFund">
+        <div class="col-4">
+          <label for="source" class="form-label">مصدر التمويل</label>
+          <input formControlName="source" class="form-control" id="source">
+        </div>
+        <div class="col-4">
+          <label for="financialStatus" class="form-label">وضع التمويل</label>
+          <input formControlName="financialStatus" class="form-control" id="financialStatus">
+        </div>
+      </div>
+    
+      <div class="row" formGroupName="projectAggreement">
+        <div class="col-4">
+          <mat-form-field>
+            <mat-label>تاريخ كتاب الموافقة</mat-label>
+            <input matInput [matDatepicker]="picker">
+            <mat-hint>MM/DD/YYYY</mat-hint>
+            <mat-datepicker-toggle matIconSuffix [for]="picker"></mat-datepicker-toggle>
+            <mat-datepicker #picker></mat-datepicker>
+          </mat-form-field>
+          </div>
+        <div class="col-4">
+          <label for="aggreementNumber" class="form-label">رقم كتاب الموافقة</label>
+          <input formControlName="aggreementNumber" class="form-control" id="aggreementNumber">
+        </div>
+      </div>
+    
+      <div class="col-4" formGroupName="executerId">
+        <mat-form-field>
+          <mat-label>الفعالية المنفذة </mat-label>
+          <mat-select>
+            <mat-option value="1">قسم المعلوميات</mat-option>
+            <mat-option value="2">قسم النظم الاكترونية</mat-option>
+          </mat-select>
+        </mat-form-field>
+        
+      </div>
+    
+      <div class="row" formGroupName="projectClassification">
+        <div class="col-4">
+          <label for="projectStatus" class="form-label">وضع النشاط</label>
+          <input formControlName="projectStatus" class="form-control" id="projectStatus">
+        </div>
+        <div class="col-4">
+          <label for="projectNature" class="form-label">طبيعة النشاط</label>
+          <input formControlName="projectNature" class="form-control" id="projectNature">
+        </div>
+        <div class="col-4">
+          <label for="projectType" class="form-label">نوع النشاط</label>
+          <input formControlName="projectType" class="form-control" id="projectType">
+        </div>
+      </div>
+    
+      <hr>
+      <div class="text-center">
+
+        <button type="submit" class="btn btn-primary">Submit</button>
+      </div>
+      
+    </form><!-- End Multi Columns Form -->
+
+  </div>
+</div>

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

 import { Component } from '@angular/core';
 import { EmployeesService } from '../../../employees/services/employees.service';
-import { FormBuilder, FormControl, FormGroup } from '@angular/forms';
-import { debounceTime, distinctUntilChanged, Observable, switchMap } from 'rxjs';
+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 { CreateProjectRequest } from '../../models/requests/createProjectRequest';
 
 @Component({
   selector: 'project-create',
@@ -12,25 +16,103 @@ import { Result } from '../../../core/models/result';
 })
 export class ProjectCreateComponent {
   projectForm: FormGroup;
-  filteredEmployees: any[] = [];
+  filteredManagers: Observable<Employee[]>;
+  filteredLeaders: Observable<Employee[]>;
+  filteredCustomers: Observable<Customer[]>;
 
-  constructor(private employeeService: EmployeesService) {}
+  projectManager :Employee 
+  teamLeader :Employee 
+  proposer :Customer
+  request = new CreateProjectRequest()
+  
+  constructor(
+    private fb: FormBuilder,
+    private employeeService: EmployeesService,
+    private customersService : CustomerService
+  ) {}
 
   ngOnInit(): void {
-    this.projectForm = new FormGroup({
-      projectName: new FormControl(''),
-      projectManager: new FormControl('')
+    this.request= new CreateProjectRequest();
+    
+    this.projectForm = this.fb.group({
+      projectManager: [''],
+      teamLeader: [''],
+      customer: [''],
+
+      projectInfo: this.fb.group({
+        name: [''],
+        description: [''],
+        code: ['', Validators.required],
+        startDate: ['', Validators.required],
+        expectedEndDate: ['', Validators.required],
+      }),
+      financialFund: this.fb.group({
+        source: ['', Validators.required],
+        financialStatus: ['', Validators.required],
+      }),
+      projectAggreement: this.fb.group({
+        aggreementDate: ['', Validators.required],
+        aggreementNumber: ['', Validators.required],
+      }),
+      proposalInfo: this.fb.group({
+        // Add any fields needed here
+      }),
+      projectClassification: this.fb.group({
+        projectStatus: ['', Validators.required],
+        projectNature: ['', Validators.required],
+        projectType: ['', Validators.required],
+      }),
+      executerId: ['', Validators.required],
+    });
+    console.log(this.request)
+    this.projectForm.valueChanges.subscribe(values => {
+      this.request = {
+        ...this.request, // Preserve other properties
+        ...values, // Overwrite properties with form 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())
+    );
+  }
+  
+  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 });
+  }
+
+  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 });
+  }
 
-    // Watch the projectManager field for changes and fetch matching employees
-    this.projectForm.get('projectManager').valueChanges.pipe(
-      debounceTime(300), // Wait for user to stop typing
-      switchMap(value => this.employeeService.getAvailableEmployees()) // Call the service
-    ).subscribe(employees => this.filteredEmployees = employees.value);
+  onCustomerSelected(customer: Customer) {
+    this.proposer = customer;
+    this.request.proposerId = customer.id;
+    this.projectForm.get('customer')!.setValue(customer.customerName, { emitEvent: false });
   }
 
-  selectManager(employee: any): void {
-    this.projectForm.get('projectManager').setValue(employee.fullName);
-    this.filteredEmployees = [];
+  onSubmit(request : CreateProjectRequest){
+    console.log(request);
   }
 }

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

@@ -24,15 +24,9 @@ export class ProjectDetailsComponent implements OnInit {
     const id = Number(this.route.snapshot.paramMap.get('id'));
     this.projectService.getProjectById(id).subscribe({
       next :(data) => {
-        console.log(data.validationErrors)
-          
-        if(data.isSuccess){
-          this.project = data.value;
-        }else {
-          this.toastr.error(data.validationErrors[0].errorMessage);
-          // this.router()
-
-        }
+        
+          this.project = data;
+        
     },
     error : (err)=>{ console.log(err)}
 

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

@@ -33,11 +33,10 @@ export class ProjectListComponent  implements OnInit{
       .subscribe(
         {
           next: (res)=>{
-            if(res.isSuccess){
-              this.projects = res.value;
+            
+              this.projects = res;
               this.toastr.success("تم تحميل المشاريع بنجاح");
-            }
-
+            
           },
           error: (err)=>{
             this.toastr.error("لقد حدث خظاء ما");

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

@@ -2,11 +2,13 @@ import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
 import { ProjectListComponent } from './pages/project-list/project-list.component';
 import { ProjectDetailsComponent } from './pages/project-details/project-details.component';
+import { ProjectCreateComponent } from './pages/project-create/project-create.component';
 
 
 const routes: Routes = [
   {path:'',component :ProjectListComponent},
   { path: 'detail/:id', component: ProjectDetailsComponent },
+  { path: 'create', component: ProjectCreateComponent }
  
 ];
 

src/app/projects/projects.module.ts

-import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
+import {  NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { ProjectItemComponent } from './components/project-item/project-item.component';
 import { AttachmentComponent } from './components/attachment/attachment.component';
 import { ProjectListComponent } from './pages/project-list/project-list.component';
 import { ProjectDetailsComponent } from './pages/project-details/project-details.component';
-import { FormControl, FormsModule } from '@angular/forms';
+import { FormControl, FormGroup, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { SharedModule } from '../shared/shared.module';
 import { ProjectRoutingModule } from './project-routing.module';
 import { StepRowItemComponent } from './components/step-row-item/step-row-item.component';
 import { ProjectHeaderComponent } from './components/project-header/project-header.component';
 import { ProjectCreateComponent } from './pages/project-create/project-create.component';
-import { MatCommonModule, MatOption } from '@angular/material/core';
+import {  MatCommonModule, MatOption, MatOptionModule } from '@angular/material/core';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import {MatAutocompleteModule} from '@angular/material/autocomplete';
 import { MatInputModule } from '@angular/material/input';
 import { ProjectService } from './services/project.service';
-
-
+import {MatSelectModule} from '@angular/material/select';
+import {MatDatepickerModule} from '@angular/material/datepicker';
+import {provideNativeDateAdapter} from '@angular/material/core';
 
 @NgModule({
   declarations: [
@@ -30,7 +31,8 @@ import { ProjectService } from './services/project.service';
     ProjectCreateComponent
   ],
   providers: [
-    ProjectService
+    ProjectService,
+    provideNativeDateAdapter()
   ],
   exports:[
     ProjectRoutingModule
@@ -38,14 +40,16 @@ import { ProjectService } from './services/project.service';
   imports: [
     CommonModule,
     FormsModule,
-    BrowserAnimationsModule,
     MatFormFieldModule,
-    FormControl,
-    MatOption,
+    MatCommonModule,
+    MatSelectModule,
+    MatOptionModule,
     MatAutocompleteModule,
+    MatDatepickerModule,
+
     MatInputModule,
+    ReactiveFormsModule ,
     SharedModule
-  ],
-  schemas:[CUSTOM_ELEMENTS_SCHEMA ]
+  ]
 })
 export class ProjectsModule { }

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

@@ -12,14 +12,14 @@ export class ProjectService {
 
   constructor(private http :HttpClient ,private config : ConfigurationService) { }
   
-  public getByFilter():Observable<Result<Project[]>>{
+  public getByFilter():Observable<Project[]>{
 
-    return this.http.get<Result<Project[]>>(this.config.getServerUrl()+ "/Projects/ByFilter");
+    return this.http.get<Project[]>(this.config.getServerUrl()+ "/Projects/ByFilter");
   
   }
-  public getProjectById(id : number ):Observable<Result<Project>>{
+  public getProjectById(id : number ):Observable<Project>{
     
-    return this.http.get<Result<Project>>(this.config.getServerUrl()+ "/Projects/"+id);
+    return this.http.get<Project>(this.config.getServerUrl()+ "/Projects/"+id);
   }
   
 }

src/app/shared/sharedLayout/header/header.component.html

@@ -18,8 +18,8 @@
 
         <ul class="dropdown-menu dropdown-menu-end dropdown-menu-arrow profile">
           <li class="dropdown-header">
-            <h6>Kevin Anderson</h6>
-            <span>Team Leader</span>
+            <h6>{{fullName}}</h6>
+            <span>موظف</span>
           </li>
           <li>
             <hr class="dropdown-divider">

src/styles.css

+.mat-form-field {
+  color: #7722ff !important; /* Changes the color of the label */
+  background-color: #012970;
+}
+
+.mat-input-element {
+  color: #26ff22; /* Changes the color of the input text */
+}
+
+.mat-hint {
+  color: #ff5722; /* Changes the color of the hint */
+}
+
+.mat-form-field-underline .mat-form-field-ripple {
+  background-color: #ff5722; /* Changes the color of the underline */
+}
+
+.mat-form-field.mat-focused .mat-form-field-label {
+  color: #ff5722; /* Changes the color of the label when focused */
+}
 
+.accordion-button::after {
+  flex-shrink: 0;
+  width: var(--bs-accordion-btn-icon-width);
+  height: var(--bs-accordion-btn-icon-width);
+  margin-right: auto;
+  content: "";
+  background-image: var(--bs-accordion-btn-icon);
+  background-repeat: no-repeat;
+  background-size: var(--bs-accordion-btn-icon-width);
+  transition: var(--bs-accordion-btn-icon-transition);
+}
 #toast-container {
   width: 100%;
   top: 30px;