fixed s .

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

+<p>info-controll works!</p>

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

+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'info-controll',
+  templateUrl: './info-controll.component.html',
+  styleUrl: './info-controll.component.css'
+})
+export class InfoControllComponent {
+
+}

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

+<p>plan-controll works!</p>

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

+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'plan-controll',
+  templateUrl: './plan-controll.component.html',
+  styleUrl: './plan-controll.component.css'
+})
+export class PlanControllComponent {
+
+}

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

+<p>track-controll works!</p>

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

+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'track-controll',
+  templateUrl: './track-controll.component.html',
+  styleUrl: './track-controll.component.css'
+})
+export class TrackControllComponent {
+
+}

src/app/projects/components/step-table/step-table.component.html

@@ -12,8 +12,8 @@
       </tr>
     </thead>
     <tbody>
-      <tr  *ngFor="let step of steps " >
-        <th scope="row"></th>
+      <tr  *ngFor="let step of steps ; index as i " >
+        <th scope="row">{{i+1}}</th>
         <td> {{step.stepInfo.stepName}}
         </td>
         <td class="text-left">{{step.stepInfo.description}}</td>

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

@@ -3,3 +3,8 @@ export interface GetProjectsByProjectManagerRequest {
     pageNumber: number | null;
     pageSize: number | null;
 }
+export interface GetProjectsByTeamLeaderRequest {
+    teamLeaderrId: number;
+    pageNumber: number | null;
+    pageSize: number | null;
+}

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

@@ -4,6 +4,8 @@ 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',
@@ -12,7 +14,7 @@ import { ProjectService } from '../../services/project.service';
 })
 export class ProjectDetailsComponent implements OnInit {
   project : Project
-  @ViewChild('dataToExport', { static: false }) public dataToExport: ElementRef;
+
   constructor(
     public router : Router,
     private route: ActivatedRoute,

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

@@ -10,9 +10,13 @@
         </div>
     </div>
     <hr>
-    <div  class="row">
+    <div *ngIf="projects">
+    <div  class="row" *ngIf="projects.length > 0">
         <project-item class="col-md-4" (click)="this.router.navigate(['projects/detail',project.id])"   *ngFor="let project of projects" [project]="project"></project-item>
     </div>
-    
+    <div  class="row" *ngIf="projects.length == 0">
+            لا يوجد أي مشروع 
+    </div>
     </div>
 </div>
+</div>

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

 import { Component, OnInit } from '@angular/core';
-import { Router } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 import { ToastrService } from 'ngx-toastr';
 import { LoadingService } from '../../../core/services/loading/loading-service.service';
 import { Project } from '../../models/responses/project';
 import { ProjectService } from '../../services/project.service';
+import { GetProjectsByProjectManagerRequest, GetProjectsByTeamLeaderRequest } from '../../models/requests/project-requests/GetProjectsByProjectManagerRequest';
+import { UserService } from '../../../core/services/authentication/user.service';
 
 @Component({
   selector: 'project-list',
@@ -12,24 +14,53 @@ import { ProjectService } from '../../services/project.service';
 })
 export class ProjectListComponent  implements OnInit{
 
+  listType : string 
+  
   projects : Project[]
   constructor(
     private projectService : ProjectService,
     private toastr: ToastrService,
     public router: Router,
+    private route :ActivatedRoute,
+    private userService : UserService,
     private loadingService: LoadingService
   ) {
 
   }
 
   ngOnInit(): void {
-   this.loadProjects();
 
+    this.route.queryParams.subscribe(params => {
+      this.listType = params['listType'];
+      }
+    );
+
+    this.loadProjects();
   }
 
   loadProjects():void{
 
     this.loadingService.show()
+    switch (this.listType) {
+      case 'all':
+         this.handelAll()
+        break;
+      case 'managed':
+        this.handelByManager()
+        break;
+      case 'leaded':
+        this.handelByLeader()
+        break;
+       default :
+        this.router.navigate(['/home'])
+        this.toastr.error('لقد طلبت صفحة غير موجودة ')
+        break ;
+
+    }
+
+  }
+
+  handelAll() {
     this.projectService.getByFilter()
     .subscribe(
       {
@@ -46,5 +77,59 @@ export class ProjectListComponent  implements OnInit{
       }
     );
    }
+   handelByManager(){
+
+    let request :GetProjectsByProjectManagerRequest = {
+      projectMangerId : this.userService.getEmployeeId(),
+      pageNumber: null ,
+      pageSize:null
+
+    }
+
+    this.projectService.getByProjectManger(request)
+    .subscribe(
+      {
+        next: (res)=>{
+          
+            this.projects = res;
+            this.toastr.success("تم تحميل المشاريع بنجاح");
+              this.loadingService.hide()
+        },
+        error: (err)=>{
+          this.toastr.error("لقد حدث خظاء ما");
+          this.loadingService.hide()
+        }
+      }
+    );
+
+   }
+   handelByLeader(){
+  
+    let request :GetProjectsByTeamLeaderRequest  ={
+      teamLeaderrId : this.userService.getEmployeeId(),
+      pageNumber: null ,
+      pageSize:null
+      
+    }
+
+    this.projectService.getByTeamLeader(request)
+    .subscribe(
+      {
+        next: (res)=>{
+          
+            this.projects = res;
+            this.toastr.success("تم تحميل المشاريع بنجاح");
+              this.loadingService.hide()
+        },
+        error: (err)=>{
+          this.toastr.error("لقد حدث خظاء ما");
+          this.loadingService.hide()
+        }
+      }
+    );
+
+  
+
+   }
 
 }
\ No newline at end of file

src/app/projects/projects.module.ts

@@ -27,6 +27,9 @@ import { ProjectFooterComponent } from './components/project-footer/project-foot
 import { StepListComponent } from './pages/step-list/step-list.component';
 import { ParticipantsListComponent } from './pages/participants-list/participants-list.component';
 import { ParticipantItemComponent } from './components/participant-item/participant-item.component';
+import { PlanControllComponent } from './components/project-controll/plan-controll/plan-controll.component';
+import { TrackControllComponent } from './components/project-controll/track-controll/track-controll.component';
+import { InfoControllComponent } from './components/project-controll/info-controll/info-controll.component';
 
 @NgModule({
   declarations: [
@@ -44,7 +47,10 @@ import { ParticipantItemComponent } from './components/participant-item/particip
     ProjectFooterComponent,
     StepListComponent,
     ParticipantsListComponent,
-    ParticipantItemComponent
+    ParticipantItemComponent,
+    PlanControllComponent,
+    TrackControllComponent,
+    InfoControllComponent
   ],
   providers: [
     ProjectService,

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

@@ -4,7 +4,7 @@ import { ConfigurationService } from '../../core/services/configuration/configur
 import { Project } from '../models/responses/project';
 import { Result } from '../../core/models/result';
 import { Observable } from 'rxjs';
-import { GetProjectsByProjectManagerRequest } from '../models/requests/project-requests/GetProjectsByProjectManagerRequest';
+import { GetProjectsByProjectManagerRequest, GetProjectsByTeamLeaderRequest } from '../models/requests/project-requests/GetProjectsByProjectManagerRequest';
 import { EmployeeParticipate } from '../../employees/models/responses/employeeParticipate';
 import { ChangeProjectTeamLeaderRequest } from '../models/requests/project-requests/ChangeProjectTeamLeaderRequest';
 import { ChangeProjectManagerRequest } from '../models/requests/project-requests/ChangeProjectManagerRequest';
@@ -59,10 +59,17 @@ export class ProjectService {
     let pagination =this.getPagination(request.pageSize,request.pageNumber);
     return this
               .http
-              .get<Project[]>(`
-                ${this.config.getServerUrl()}
-                /Projects/ByProjectManager/?projectManagerId=${request.projectMangerId}${pagination}`);
+              .get<Project[]>(`${this.config.getServerUrl()}/Projects/ByProjectManager/?projectManagerId=${request.projectMangerId}${pagination}`);
   }
+  // this method retreive  the projects by its manager 
+  public getByTeamLeader(request : GetProjectsByTeamLeaderRequest ):Observable<Project[]>{
+    
+    let pagination =this.getPagination(request.pageSize,request.pageNumber);
+    return this
+              .http
+              .get<Project[]>(`${this.config.getServerUrl()}/Projects/ByFilter/?teamLeaderId=${request.teamLeaderrId}${pagination}`);
+  }
+  
   //#endregion  queries
 
   //#region  planning  managment

src/app/shared/componenets/card-item/card-item.component.html

+<div class="col-md-6 col-lg-4" [routerLink]="[item.navigate,item.params]">
+    <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 [classList]="['fe', 'fe-16', 'text-white',item.icon]" ></span>
+          </div>
+          <div class="flex-fill ml-4 fname">
+            <strong>{{item.name}}</strong><br />
+          </div>
+        </div>
+      </div> <!-- .card-body -->
+    </div> <!-- .card -->
+  
+  </div> <!-- .row -->

src/app/shared/componenets/card-item/card-item.component.ts

+import { Component, Input } from '@angular/core';
+
+@Component({
+  selector: 'card-item',
+  templateUrl: './card-item.component.html',
+  styleUrl: './card-item.component.css'
+})
+export class CardItemComponent {
+
+  @Input() item : {
+    navigate : string ,
+    icon :String ,
+    name :string ,
+    params : any []
+  }
+}

src/app/shared/shared.module.ts

@@ -9,6 +9,7 @@ import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import { NavItemComponent } from './componenets/nav-item/nav-item.component';
 import { LoadingSpinnerComponent } from './componenets/loading-spinner/loading-spinner.component';
 import { FullnamePipe } from './pipes/fullName/fullname.pipe';
+import { CardItemComponent } from './componenets/card-item/card-item.component';
 
 
 @NgModule({
@@ -20,7 +21,8 @@ import { FullnamePipe } from './pipes/fullName/fullname.pipe';
     LayoutComponent,
     NavItemComponent,
     LoadingSpinnerComponent,
-    FullnamePipe
+    FullnamePipe,
+    CardItemComponent
   
   ],
   imports: [
@@ -33,6 +35,7 @@ import { FullnamePipe } from './pipes/fullName/fullname.pipe';
     SidebarComponent,
     LayoutComponent,
     FullnamePipe,
+    CardItemComponent,
     LoadingSpinnerComponent
   ],schemas: [CUSTOM_ELEMENTS_SCHEMA]
 })

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

@@ -26,7 +26,7 @@
           </li>
 
           <li>
-            <a class="dropdown-item d-flex align-items-center" [routerLink]="['/employees/profile']">
+            <a class="dropdown-item text-center d-flex align-items-center" [routerLink]="['/employees/profile']">
               <i class="fe fe-user"></i>
               <span>ملفي الشخصي</span>
             </a>
@@ -36,7 +36,7 @@
           </li>
             
           <li>
-            <button class="dropdown-item d-flex align-items-center" (click)="logout()">
+            <button class="text-center dropdown-item d-flex align-items-center" (click)="logout()">
               <i class="fe fe-log-out"></i>
               <span>تسجيل الخروج</span>
             </button>

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

@@ -24,7 +24,9 @@
             <a href="components-alerts.html">
               <i class="fe fe-circle"></i><span>اتمام عملية متابعة</span>
             </a>
+
           </li>
+
         </ul>
 
       </li><!-- End Components Nav -->
@@ -33,6 +35,7 @@
           <i class="fe fe-flag"></i><span> عمليات المتابعة</span>
         </a>
       </li>
+
       <li class="nav-heading">التقارير</li>
 
       <li class="nav-item">
@@ -69,6 +72,7 @@
           <i class="fe fe-edit-2"></i><span>إضافة جهة طارحة</span>
         </a>
       </li>
+
       <li class="nav-heading">إدارة المشاريع</li>
 
           <li class="nav-item">
@@ -77,20 +81,37 @@
             </a>
           </li>
           <li class="nav-item">
-            <a [routerLink]="['/projects']" class="nav-link collapsed">
+            <a 
+              [routerLink]="['/projects']"
+              [queryParams]="{ listType: 'all'}"
+               class="nav-link collapsed">
               <i class="bi bi-circle"></i><span>استعراض المشاريع</span>
             </a>
           </li>
           <li class="nav-item">
-            <a class="nav-link collapsed" href="forms-editors.html">
+            <a 
+            [routerLink]="['/projects']"
+            [queryParams]="{ listType: 'managed'}"  
+              class="nav-link collapsed"
+            >
               <i class="bi bi-circle"></i><span>المشاريع التي أديرها</span>
             </a>
           </li>
           <li class="nav-item">
-            <a class="nav-link collapsed">
+            <a 
+              [routerLink]="['/projects']"
+              [queryParams]="{ listType: 'leaded'}"
+              class="nav-link collapsed"
+            >
               <i class="bi bi-circle"></i><span>المشاريع التي أرأسها</span>
             </a>
           </li>
+          <li class="nav-item">
+            <a class="nav-link collapsed">
+              <i class="bi bi-circle"></i><span>تخطيط مشروع</span>
+            </a>
+          </li>
+
           <li class="nav-heading">العمل</li>
      
           <li  [routerLink]="['/employees/participates',id]" class="nav-item">
@@ -116,6 +137,13 @@
           <i class="bi bi-layout-text-window-reverse"></i><span>ملامح المشروع</span><i class="bi bi-chevron-down ms-auto"></i>
         </a>
       </li>
+
+      <li class="nav-item">
+        <a [routerLink]="['/Help']" class="nav-link collapsed" >
+          <i class="bi bi-layout-text-window-reverse"></i><span>مساعدة</span><i class="bi bi-chevron-down ms-auto"></i>
+        </a>
+      </li>
+
     </ul>
 
   </aside><!-- End Sidebar-->
\ No newline at end of file

src/app/tracks/pages/step-track-history/step-track-history.component.html

+<p>step-track-history works!</p>

src/app/tracks/pages/step-track-history/step-track-history.component.ts

+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'step-track-history',
+  templateUrl: './step-track-history.component.html',
+  styleUrl: './step-track-history.component.css'
+})
+export class StepTrackHistoryComponent {
+
+}

src/app/tracks/tracks.module.ts

@@ -9,6 +9,7 @@ import { StepTrackComponent } from './components/step-track/step-track.component
 import { EmployeeTrackComponent } from './components/employee-track/employee-track.component';
 import { StepTrackDetailsComponent } from './pages/step-track-details/step-track-details.component';
 import { ProjectTrackHistoryComponent } from './pages/project-track-history/project-track-history.component';
+import { StepTrackHistoryComponent } from './pages/step-track-history/step-track-history.component';
 
 
 @NgModule({
@@ -19,7 +20,8 @@ import { ProjectTrackHistoryComponent } from './pages/project-track-history/proj
     StepTrackComponent,
     EmployeeTrackComponent,
     StepTrackDetailsComponent,
-    ProjectTrackHistoryComponent
+    ProjectTrackHistoryComponent,
+    StepTrackHistoryComponent
   ],
   imports: [
     CommonModule,