comlete customer module

src/app/app.module.ts

@@ -24,7 +24,7 @@ import { JwtInterceptor } from './core/interceptors/jwt.interceptor';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { ToastrModule } from 'ngx-toastr';
 import { NgxPaginationModule } from 'ngx-pagination';
-import { CustomerRoutingModule } from './customers/customer-routing.module';
+import { CustomerRoutingModule } from './customers/routing/customer-routing.module';
 import { LoadingInterceptor } from './core/interceptors/loading.interceptor';
 import { ProjectsModule } from './projects/projects.module';
 import { ProjectRoutingModule } from './projects/project-routing.module';

src/app/customers/components/add-contactinfo-modal/add-contactinfo-modal.component.ts

-import { Component, Input, OnInit } from '@angular/core';
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { Customer } from '../../models/responses/customer';
 import { ToastrService } from 'ngx-toastr';
 import { CustomerService } from '../../services/customer.service';
@@ -13,7 +13,7 @@ import { AddContactInfoRequest } from '../../models/requests/updateCustomerReque
 export class AddContactinfoModalComponent implements OnInit{
 
   @Input() customer :Customer
-
+  @Output() added  = new EventEmitter<void>();
   request =new  AddContactInfoRequest(); 
  
   constructor(
@@ -46,6 +46,7 @@ export class AddContactinfoModalComponent implements OnInit{
     .subscribe({
       next : (data)=>{
        
+        this.added.emit();
         this.onClose()
       },
       error:(err)=>{

src/app/customers/components/remove-contactinfo-modal/remove-contactinfo-modal.component.html

@@ -11,7 +11,7 @@
       </div>
       
       <div class="row ">
-      <button type="submit" [disabled]="projectForm.invalid " class="col m-4 btn btn-primary">إضافة</button>
+      <button type="submit" [disabled]="projectForm.invalid " class="col m-4 btn btn-danger">إزالة</button>
       <button  class="col m-4  btn btn-seondary" (click)="onClose()" >إغلاق</button>
    
     </div>

src/app/customers/components/remove-contactinfo-modal/remove-contactinfo-modal.component.ts

-import { Component, Input } from '@angular/core';
+import { Component, EventEmitter, Input, Output } from '@angular/core';
 import { ContactInfo, Customer } from '../../models/responses/customer';
 import { RemoveContactInfoRequest } from '../../models/requests/updateCustomerRequest';
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
@@ -13,8 +13,8 @@ import { CustomerService } from '../../services/customer.service';
 export class RemoveContactinfoModalComponent {
 
   @Input() contact :ContactInfo
-
   @Input() customer :Customer
+  @Output() removed = new EventEmitter<void>()
 
   request =new  RemoveContactInfoRequest(); 
  
@@ -48,7 +48,8 @@ export class RemoveContactinfoModalComponent {
     .removeContactInfo(this.request)
     .subscribe({
       next : (data)=>{
-       this.onClose();
+        this.removed.emit();
+        this.onClose();
       },
       error:(err)=>{
         this

src/app/customers/customers.module.ts

@@ -5,7 +5,7 @@ import { CustomerService } from './services/customer.service';
 import { FormsModule, NgModel } from '@angular/forms';
 import { CustomerDetailsComponent } from './pages/customer-details/customer-details.component';
 import { UpdateCustomerComponent } from './pages/update-customer/update-customer.component';
-import { CustomerRoutingModule } from './customer-routing.module';
+import { CustomerRoutingModule } from './routing/customer-routing.module';
 import { SharedModule } from "../shared/shared.module";
 import { CustomerItemComponent } from './components/customer-item/customer-item.component';
 import { CustomerCreateComponent } from './pages/customer-create/customer-create.component';

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

@@ -8,9 +8,9 @@
           <form class="php-email-form">
             <div class="row gy-4">
               <div class="row text-center">
-                <p>
+                <h3 class="text-center text-primary p-4">
                   إضافة جهة طارحة
-                </p>
+                </h3>
             </div>
               <div class="col-12">
                 <input type="text" [(ngModel)]="request.customerName"

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

@@ -17,12 +17,18 @@ import { RemoveContactinfoModalComponent } from '../../components/remove-contact
 })
 
 export class CustomerDetailsComponent implements OnInit {
+ 
+  //#region Properties 
   modalMode: 'edit' | 'delete' = 'edit';
   modalTitle: string = '';
 
   customerId : number 
   customer: Customer ;
   selectedCustomer :Customer ;
+  
+  //#endregion Properties 
+  
+  
   constructor(
     private router : Router,
     private route: ActivatedRoute,
@@ -39,132 +45,167 @@ export class CustomerDetailsComponent implements OnInit {
 
   loadCustomer (){
 
-    this.customerService.getCustomerById(this.customerId).subscribe({
+    this
+    .customerService
+    .getCustomerById(this.customerId)
+    .subscribe({
       next :(data) => {
         
-         this.customer = data;
-     
-         this.selectedCustomer=this.customer;
-    },
-    error : (err)=>{ console.log(err)}
-
-  });
+        this.customer = data;
+        this.selectedCustomer=this.customer;
+      },
+      error : (err)=>{ console.log(err)}
+    });
   }
 
-    openModal(mode: 'edit' | 'delete'): void {
-      this.modalMode = mode;
+  openModal(mode: 'edit' | 'delete'): void {
+    this.modalMode = mode;
       
-      if (mode === 'edit') {
-        this.modalTitle = 'تعديل جهة طارحة ';
-      } else if (mode === 'delete') {
-        this.modalTitle = 'حذف جهة طارحة';
-      }
+    if (mode === 'edit') {
+      this.modalTitle = 'تعديل جهة طارحة ';
+    } 
+    else if (mode === 'delete') {
+       this.modalTitle = 'حذف جهة طارحة';
+    }
   
-      const modalElement = document.getElementById('customerModal');
-      if (modalElement) {
-        new Modal(modalElement).show(); // Open the modal
-      }
+    const modalElement = document.getElementById('customerModal');
+    if (modalElement) {
+      new Modal(modalElement).show(); // Open the modal
     }
   
-    saveCustomer(): void {
+  }
+  
+  saveCustomer(): void {
       
-      let request : UpdateCustomerRequest ={
-        ...this.selectedCustomer,
-        customerId: this.selectedCustomer.id,
-        customerName:this.selectedCustomer.customerName
-      }
+    let request : UpdateCustomerRequest ={
+      ...this.selectedCustomer,
+      customerId: this.selectedCustomer.id,
+      customerName:this.selectedCustomer.customerName
+    }
 
-      this.customerService.updateCustomer(this.selectedCustomer.id,request).subscribe({
-        next :()=>{
+    this
+    .customerService
+    .updateCustomer(this.selectedCustomer.id,request)
+    .subscribe({
+      next :()=>{
      
-          this.customer.address=this.selectedCustomer.address ;
-          this.customer.customerName=this.selectedCustomer.customerName;
-          this.customer.email=this.selectedCustomer.email
-          this.closeModal();
-        
-        }
-        ,
-        error:(err)=>{
-          this.toastr.error("لقد حدث خطاء ما ")
+        this.customer.address=this.selectedCustomer.address ;
+        this.customer.customerName=this.selectedCustomer.customerName;
+        this.customer.email=this.selectedCustomer.email
+        this.closeModal();
         
-          this.closeModal();
-        }
+      }
+      ,
+      error:(err)=>{
+
+        this.toastr.error("لقد حدث خطاء ما ")
+        this.closeModal();
+      }
   
-      })
+    })
     
-    }
+  }
   
-    delete(): void {
+  delete(): void {
   
-      this.customerService.deleteCustomer(this.customer.id).subscribe({
+    this
+    .customerService
+    .deleteCustomer(this.customer.id)
+    .subscribe({
   
-        next :()=>{
-          this.router.navigate(['/customers'])
-          this.closeModal();
+      next :()=>{
+        this.router.navigate(['/customers'])
+        this.closeModal();
           
-        }
-        ,
-        error:(err)=>{
-          this.toastr.error("لقد حدث خطاء ما ")
-        
-          this.closeModal();
-        }
+      }
+      ,
+      error:(err)=>{
+      
+        this.toastr.error("لقد حدث خطاء ما ")
+        this.closeModal();
+      }
   
   
-      }
-    );
+    });
   
-    }
+  }
 
-    openAddConatact(){
+  openAddConatact(){
+    
+    const modalRef = this.modalService.open(AddContactinfoModalComponent);
+    modalRef.componentInstance.customer = this.customer;
     
-      const modalRef = this.modalService.open(AddContactinfoModalComponent);
-      modalRef.componentInstance.customer = this.customer;
+    modalRef
+    .componentInstance
+    .added
+    .subscribe({
+      next : ()=>{
+
+        this.loadCustomer();
 
+      }
+
+    });
+    
   
-      modalRef.result.then((result) => {
-   
-        if (result) {
+    modalRef.result.then(
+      (result) => {
+  
+      if (result) {
    
-          this.loadCustomer();
-          
-        }
+        this.loadCustomer();
+        
+      }
         
-      }, (reason) => {
-                 this.loadCustomer();
+      }
+      , (reason) => {
+
+        this.loadCustomer();
       
-      });
+      }
+    );
     
-    }
+  }
   
-    openRemoveConatact(conta : ContactInfo){
+  openRemoveConatact(conta : ContactInfo){
     
-      const modalRef = this.modalService.open(RemoveContactinfoModalComponent);
-      modalRef.componentInstance.customer = this.customer;
-      modalRef.componentInstance.contact= conta
-  
-      modalRef.result.then((result) => {
+    const modalRef = this.modalService.open(RemoveContactinfoModalComponent);
+    modalRef.componentInstance.customer = this.customer;
+    modalRef.componentInstance.contact= conta
+    
+    modalRef
+    .componentInstance
+    .removed
+    .subscribe({
+      next : ()=>{
+
+        this.loadCustomer();
+
+      }
+
+    });
+
+    modalRef.result.then((result) => {
    
-        if (result) {
+      if (result) {
    
-          this.loadCustomer();
+        this.loadCustomer();
           
-        }
+      }
         
-      }, (reason) => {
+    }, (reason) => {
        
       
-      });
+    });
     
-    }
+  }
   
-    closeModal(): void {
-      const modalElement = document.getElementById('customerModal');
-      if (modalElement) {
-        new Modal(modalElement).hide(); // Close the modal
-      }
+  closeModal(): void {
+    const modalElement = document.getElementById('customerModal');
+    if (modalElement) {
+      new Modal(modalElement).hide(); // Close the modal
     }
-  
+  }
   
      
 }
\ No newline at end of file

src/app/customers/customer-routing.module.ts → src/app/customers/routing/customer-routing.module.ts

 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
-import { CustomerListComponent } from './pages/customer-list/customer-list.component';
-import { UpdateCustomerComponent } from './pages/update-customer/update-customer.component';
-import { CustomerDetailsComponent } from './pages/customer-details/customer-details.component';
-import { CustomerCreateComponent } from './pages/customer-create/customer-create.component';
+import { CustomerCreateComponent } from '../pages/customer-create/customer-create.component';
+import { UpdateCustomerComponent } from '../pages/update-customer/update-customer.component';
+import { CustomerDetailsComponent } from '../pages/customer-details/customer-details.component';
+import { CustomerListComponent } from '../pages/customer-list/customer-list.component';
 
 const routes: Routes = [
   { path: '', component: CustomerListComponent },