fix elements

src/app/projects-types/models/requests/updateProjectTypeRequest.ts

 export class UpdateTypeRequest{
     id :number 
     typeName :string 
-    description :String 
+    description :string 
     expectedEffort :number 
     expectedNumberOfWorker :number;
 }

src/app/projects-types/pages/types-detail/types-detail.component.html

@@ -21,42 +21,13 @@
             </div>
             <div class="row mb-4">
 
-                <button   [disabled]="!canEdit()"  class="col-3 offset-1 m-4 btn btn-danger" (click)="openModal('delete')">إزالة</button>
-                <button  [disabled]="!canEdit()" class="col-3 offset-1 m-4 btn btn-primary" (click)="openModal('edit')">تعديل</button>
+                <button   [disabled]="!canEdit()"  class="col-3 offset-1 m-4 btn btn-danger" (click)="openDeleteModal(type)">إزالة</button>
+                <button  [disabled]="!canEdit()" class="col-3 offset-1 m-4 btn btn-primary" (click)="openEditModal(type)">تعديل</button>
                 
             </div>
             
           </div> <!-- /.card-body -->
         </div> <!-- /.card -->
       </div> <!-- /.col-12 -->
-      <div class="modal   fade" id="typeModal" tabindex="-1" aria-labelledby="modalLabel" aria-hidden="true">
-        <div class="modal-dialog modal-dialog-centered">
-          <div class="modal-content">
-            <div class="modal-header">
-              <button type="button" class="mr-4 ml-4 btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-              <h5 class="modal-title" id="modalLabel">{{ modalTitle }}</h5>
-      
-            </div>
-            <div class="modal-body">
-              <!-- Edit Form -->
-              <div *ngIf="modalMode === 'edit'">
-               
-              <edit-type-modal
-              [selectedItem]="selectedtype"
-              (submit)="saveType()"
-              >
-                
-              </edit-type-modal>
-              </div>
-              <!-- Delete Confirmation -->
-              <div *ngIf="modalMode === 'delete'">
-                <p>هل أنت متأكد من أنك تريد حذف النوع {{ selectedtype.typeName }} ؟</p>
-                <button type="button" class="btn m-4 btn-danger" (click)="delete()">إزالة</button>
-                <button type="button" class="btn m-4 btn-secondary" data-bs-dismiss="modal">إلغاء</button>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
     </div>
 

src/app/projects-types/pages/types-detail/types-detail.component.ts

@@ -7,6 +7,9 @@ import { Modal } from 'bootstrap';
 import { UpdateTypeRequest } from '../../models/requests/updateProjectTypeRequest';
 import { UserService } from '../../../core/services/authentication/user.service';
 import { ROLES } from '../../../core/constants/roles';
+import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
+import { RemoveTyoeModalComponent } from '../../components/remove-tyoe-modal/remove-tyoe-modal.component';
+import { EditTypeModalComponent } from '../../components/edit-type-modal/edit-type-modal.component';
 
 @Component({
   selector: 'types-detail',
@@ -26,6 +29,7 @@ export class TypesDetailComponent implements OnInit{
     private route : ActivatedRoute,
     private toastr : ToastrService,
     private router : Router,
+    private modalService :NgbModal,
     private userService :UserService
 
   ){}
@@ -62,6 +66,46 @@ export class TypesDetailComponent implements OnInit{
     }
   }
 
+  openDeleteModal(item : ProjectType): void {
+    const modalRef = this.modalService.open(RemoveTyoeModalComponent);
+    
+    modalRef.componentInstance.selectedItem = this.type;
+
+    modalRef.result.then((result : number ) => {
+      if (result) {
+
+        this.router.navigate(['/types'])
+      }
+    }, (reason) => {
+
+    });
+  }
+
+  openEditModal(item : ProjectType): void {
+    const modalRef = this.modalService.open(EditTypeModalComponent);
+    
+    modalRef.componentInstance.selectedItem = item;
+
+    modalRef.result.then((result : UpdateTypeRequest ) => {
+      if (result) {
+
+        let sp = this.type;
+        
+       sp!.description=result.description
+       sp!.expectedEffort=result.expectedEffort
+       sp!.expectedNumberOfWorker=result.expectedNumberOfWorker
+       sp!.typeName=result.typeName
+       
+       
+
+      }
+    }, (reason) => {
+
+    });
+  }
+
+
+
   saveType(): void {
     
     let request : UpdateTypeRequest ={

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

@@ -15,13 +15,18 @@
   <type-item class=" offset-2" 
     *ngFor="let item of types" 
     [item]="item"
-    (edit)="openModal('edit', item)"
-    (delete)="openModal('delete', item)"
+    (edit)="openEditModal(item)"
+    (delete)="openDeleteModal(item)"
   >
   </type-item>
 
-  <div *ngIf="types.length==0">
-        للأسف حاليا لايوجد أنواع مشاريع
+  <div *ngIf="types.length==0" class="text-center text-primary">
+    <strong>
+
+         للأسف حاليا لايوجد أنواع مشاريع
+    
+    
+        </strong>
     </div>
     </div>
     </div>

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

@@ -8,6 +8,8 @@ import { ProjectType } from '../../models/responses/projectType';
 import { UpdateTypeRequest } from '../../models/requests/updateProjectTypeRequest';
 import { ROLES } from '../../../core/constants/roles';
 import { UserService } from '../../../core/services/authentication/user.service';
+import { RemoveTyoeModalComponent } from '../../components/remove-tyoe-modal/remove-tyoe-modal.component';
+import { EditTypeModalComponent } from '../../components/edit-type-modal/edit-type-modal.component';
 
 @Component({
   selector: 'types-list',
@@ -55,6 +57,47 @@ export class TypesListComponent {
 
   }
 
+  openDeleteModal(item : ProjectType): void {
+    const modalRef = this.modalService.open(RemoveTyoeModalComponent);
+    
+    modalRef.componentInstance.selectedItem = item;
+
+    modalRef.result.then((result : number ) => {
+      if (result) {
+
+        this.types=this.types.filter(e => e.id == item.id)
+
+      }
+    }, (reason) => {
+
+    });
+  }
+
+  openEditModal(item : ProjectType): void {
+    const modalRef = this.modalService.open(EditTypeModalComponent);
+    
+    modalRef.componentInstance.selectedItem = item;
+
+    modalRef.result.then((result : UpdateTypeRequest ) => {
+      if (result) {
+
+        let sp = this.types.find(e => e.id == item.id);
+       sp!.description=result.description
+       sp!.expectedEffort=result.expectedEffort
+       sp!.expectedNumberOfWorker=result.expectedNumberOfWorker
+       sp!.typeName=result.typeName
+       
+       
+
+      }
+    }, (reason) => {
+
+    });
+  }
+
+
+
+
   openModal(mode: 'edit' | 'delete', item: ProjectType): void {
     this.modalMode = mode;
     this.selectedItem = { ...item }; // Clone project to prevent direct mutation

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

@@ -17,9 +17,12 @@
 >
 </employee-history-item>
 
-    <div *ngIf="employeeTrackHistory.length==0">
-  لم تتم متابعة هذا العامل من قبل 
-  </div>
+    <div *ngIf="employeeTrackHistory.length==0"  class="text-center text-primary">
+        <strong>
+             لم تتم متابعة هذا العامل من قبل 
+ 
+            </strong>
+        </div>
     </div>
     </div>
 </section>

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

@@ -19,9 +19,12 @@
       
     ></track-item>
 
-    <div *ngIf="tracks.length==0">
+    <div *ngIf="tracks.length==0"  class="text-center text-primary">
+      <strong>
+
         للأسف هذا المروع لايحوي على أية مراحل
-    </div>
+    
+    </strong>  </div>
     </div>
     </div>
 </section>

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

@@ -16,9 +16,11 @@
 >
 </step-history-item>
 
-    <div *ngIf="stepTrackHistory.length==0">
+    <div *ngIf="stepTrackHistory.length==0" class="text-center text-primary">
+        <strong>
+
   لم تتم متابعة هذه المرحلة من قبل
-  </div>
+  </strong></div>
     </div>
     </div>
 </section>

src/app/tracks/pages/tracks-list/tracks-list.component.html

@@ -57,9 +57,14 @@
     </div> <!-- / .card-body -->
   </div>
 
-    <div *ngIf="tracks.length==0">
-        للأسف لايحوي على أية متابعات
-    </div>
+    <div *ngIf="tracks.length==0" class="text-center text-primary">
+      <strong>
+          للأسف لايحوي على أية متابعات
+    
+    
+        </strong>
+      
+        </div>
     </div>
     </div>
 </section>