add edit step info

src/app/projects/components/step-modals/edit-step-modal/edit-step-modal.component.html

+<div class="modal-header">
+    <button type="button" class="btn-close" (click)="onClose()" ></button>
+    <h5 class="modal-title text-center">تعديل مرحلة</h5>
+  </div>
+  <div class="modal-body">
+    <form (ngSubmit)="onSubmit()" #projectForm="ngForm">
+      <div class="row">
+  
+        <div class="mb-3 col-4  offset-1">
+          <label for="stepName" class="form-label">اسم المرحلة</label>
+          <input disabled="true" type="text" name="stepName" id="stepName" class="form-control" [(ngModel)]="request.stepInfo.stepName" required>
+        </div>
+        
+        <div class="mb-3 col-4">
+          <label for="start" class="form-label">تاريخ البدء</label>
+          <input type="date" disabled="true"  id="start" class="form-control" [(ngModel)]="request.stepInfo.startDate" name="start" required>
+        </div>
+  
+
+      
+      </div>
+      <div class="row">
+        <div class="mb-3 col-4 offset-1">
+            <label for="worker" class="form-label">عدد العمال المطلوب</label>
+            <input  id="worker" class="form-control" [(ngModel)]="request.stepInfo.numberOfWorker" name="worker" required>
+          </div>
+        
+          <div class="mb-3 col-3">
+            <label for="duration" class="form-label"> المدة (أسبوع)</label>
+            <input  id="duration" class="form-control" [(ngModel)]="request.stepInfo.duration" name="duration" required>
+          </div>
+          <div class="mb-3 col-8 offset-1" >
+          <label for="decription" class="form-label">الوصف</label>
+          <textarea col="3" name="decription" id="decription" class="form-control" [(ngModel)]="request.stepInfo.description"  required>
+            </textarea>
+        </div>
+        </div>
+        <div class="row">
+          
+  
+        </div>
+      <div class="row ">
+        <button type="submit" [disabled]="projectForm.invalid" class="col-5 m-4 btn btn-primary">إضافة</button>
+        <div  class="col-5 m-4 btn btn-secondary" (click)="onClose()" >إغلاق</div>
+     
+      </div>
+       </form>
+  </div>
+  
\ No newline at end of file

src/app/projects/components/step-modals/edit-step-modal/edit-step-modal.component.ts

+import { Component, Input } from '@angular/core';
+import { Step } from '../../../models/responses/Step';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { ToastrService } from 'ngx-toastr';
+import { AddProjectStepRequest } from '../../../models/requests/project-requests/AddProjectStepRequest';
+import { ProjectService } from '../../../services/project.service';
+import { ChangeStepInfoRequest } from '../../../models/requests/step-requests/changeStepInfoRequest';
+import { StepInfo } from '../../../models/valueObjects/StepInfo';
+import { StepService } from '../../../services/step.service';
+
+@Component({
+  selector: 'edit-step-modal',
+  templateUrl: './edit-step-modal.component.html',
+  styleUrl: './edit-step-modal.component.css'
+})
+export class EditStepModalComponent {
+  @Input() stepInfo : StepInfo 
+  
+  @Input()    stepId : number 
+
+  request :ChangeStepInfoRequest 
+  
+  constructor(
+    private toastr :ToastrService,
+     public activeModal: NgbActiveModal,
+     private stepService :StepService
+    ) {}
+
+  ngOnInit(): void {
+
+    this.request ={
+      stepInfo: {
+          ...this.stepInfo
+      },
+      stepId:this.stepId
+    };
+  }
+
+  onSubmit(): void {
+    // Emit the project data or handle it as needed
+    console.log('Project data submitted:', this.request);
+    this
+    .stepService
+    .changeStepInfo(this.request)
+    .subscribe({
+
+      next: (data)=>{
+      
+        this.activeModal.close(this.stepInfo); // Close modal and pass data
+  
+      },
+      error: (err )=> this.toastr.error("لقد حدث خطاء ما")
+
+    })
+  }
+
+  onClose():void {
+    this.activeModal.close();
+  }
+
+}

src/app/projects/components/step-modals/edit-weight-modal/edit-weight-modal.component.html

+<div class="modal-header">
+    <button type="button" class="btn-close" (click)="onClose()" ></button>
+    <h5 class="modal-title text-center">تعديل ثقل مرحلة</h5>
+  </div>
+  <div class="modal-body">
+    <form (ngSubmit)="onSubmit()" #projectForm="ngForm">
+      <div class="row">
+  
+        <div class="mb-3 col-4  offset-1">
+          <label for="stepName" class="form-label">اسم المرحلة</label>
+          <input disabled="true" type="text" name="stepName" id="stepName" class="form-control" [(ngModel)]="stepInfo.stepName" >
+        </div>
+        
+        <div class="mb-3 col-4">
+          <label for="start" class="form-label">المدة </label>
+          <input  disabled="true"  id="start" class="form-control" [(ngModel)]="stepInfo.duration" name="start" >
+        </div>
+  
+
+      
+      </div>
+      <div class="row">
+        <div class="mb-3 col-4 offset-1">
+            <label for="oweight" class="form-label">الثقل القديم </label>
+            <input disabled="true" id="oweight" class="form-control" [(ngModel)]="weight" name="oweight" >
+          </div>
+        <div class="mb-3 col-4 " >
+            <label for="weight" class="form-label">الثقل الجديد </label>
+            <input  id="weight" class="form-control" [(ngModel)]="request.weight" name="weight" required>
+        </div>
+        </div>
+        <div class="row">
+          
+        </div>
+      <div class="row ">
+        <button type="submit" [disabled]="projectForm.invalid" class="col-4 m-4 btn btn-primary">إضافة</button>
+        <div  class="col-4 m-4 btn btn-secondary" (click)="onClose()" >إغلاق</div>
+     
+      </div>
+       </form>
+  </div>
+  
\ No newline at end of file

src/app/projects/components/step-modals/edit-weight-modal/edit-weight-modal.component.ts

+import { Component, Input } from '@angular/core';
+import { ChangeStepWeightRequest } from '../../../models/requests/step-requests/changeStepWeightRequest';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { ToastrService } from 'ngx-toastr';
+import { StepService } from '../../../services/step.service';
+import { StepInfo } from '../../../models/valueObjects/StepInfo';
+
+@Component({
+  selector: 'edit-weight-modal',
+  templateUrl: './edit-weight-modal.component.html',
+  styleUrl: './edit-weight-modal.component.css'
+})
+export class EditWeightModalComponent {
+  @Input() weight : number 
+  @Input() stepInfo :StepInfo
+  @Input()    stepId : number 
+
+  request :ChangeStepWeightRequest 
+  
+  constructor(
+    private toastr :ToastrService,
+     public activeModal: NgbActiveModal,
+     private stepService :StepService
+    ) {}
+
+  ngOnInit(): void {
+
+    this.request ={
+      weight: this.weight,
+      stepId:this.stepId
+    };
+  }
+
+  onSubmit(): void {
+    // Emit the project data or handle it as needed
+    console.log('Project data submitted:', this.request);
+    this
+    .stepService
+    .changeStepWeight(this.request)
+    .subscribe({
+
+      next: (data)=>{
+      
+        this.activeModal.close(this.request.weight); // Close modal and pass data
+  
+      },
+      error: (err )=> this.toastr.error("لقد حدث خطاء ما")
+
+    })
+  }
+
+  onClose():void {
+    this.activeModal.close();
+  }
+
+}

src/app/projects/components/steps/edit-step-modal/edit-step-modal.component.html

-<!-- edit-participant-modal.component.html
-<div class="modal fade" id="editParticipantModal" tabindex="-1" aria-labelledby="editParticipantModalLabel" aria-hidden="true">
-    <div class="modal-dialog">
-      <div class="modal-content">
-        <div class="modal-header">
-          <h5 class="modal-title" id="editParticipantModalLabel">تعديل معلومات مشاركة </h5>
-          <button type="button" class=" ml-4 mr-4 btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-        </div>
-        <div class="modal-body">
-          <form [formGroup]="editParticipantForm" (ngSubmit)="onSubmit()">
-            <div class="mb-3">
-              <label for="role" class="form-label">صفة المساهمة</label>
-              <input type="text" id="role" formControlName="role" class="form-control" required>
-            </div>
-            <div class="mb-3">
-              <label for="partialTimeRatio" class="form-label">نسبة التفرغ</label>
-              <input type="number" id="partialTimeRatio" formControlName="partialTimeRatio" class="form-control" required>
-            </div>
-
-            <button type="submit" class="col-4 offset-2 btn btn-primary" [disabled]="!editParticipantForm.valid">حفظ</button>
-            <button type="button" class="col-4 offset-2 btn btn-secondary" data-bs-dismiss="modal">إزالة</button>
-        
-          </form>
-        </div>
-      </div>
-    </div>
-  </div>
-   -->
\ No newline at end of file

src/app/projects/components/steps/edit-step-modal/edit-step-modal.component.ts

-// import { Component, EventEmitter, Input, Output } from '@angular/core';
-// import { Step } from '../../../models/responses/Step';
-// import { FormGroup, FormBuilder, Validators } from '@angular/forms';
-// import { ChangeEmployeeParticipationRequest } from '../../../models/requests/project-requests/ChangeEmployeeParticipationRequest';
-// import { ProjectService } from '../../../services/project.service';
-
-// @Component({
-//   selector: 'edit-step-modal',
-//   templateUrl: './edit-step-modal.component.html',
-//   styleUrl: './edit-step-modal.component.css'
-// })
-// export class EditStepModalComponent {
-//   @Input() step: Step;
-//   @Output() stepEdited = new EventEmitter<void>();
-
-//   editStepForm: FormGroup;
-
-//   constructor(private fb: FormBuilder, private projectService: ProjectService) {
-//     this.editStepForm = this.fb.group({
-//       role: ['', Validators.required],
-//       partialTimeRatio: [0, [Validators.required, Validators.min(0)]],
-//     });
-//   }
-
-//   ngOnChanges() {
-//     if (this.step) {
-//       this.editStepForm.patchValue(this.step);
-//     }
-//   }
-
-//   onSubmit() {
-//     if (this.editStepForm.valid) {
-      
-//       let request : ChangeEmployeeParticipationRequest ={
-//         role: this.editStepForm.value.role ,
-//         partialTimeRation: this.editStepForm.value.partialTimeRatio,
-//         stepId: this.step.employee.id ,
-//         projectId:this.step.projectId
-
-//       }
-//       debugger;
-//       this
-//       .projectService
-//       .changeParticipation(request)
-//       .subscribe(() => {
-//         this.stepEdited.emit();
-//         this.closeModal();
-//       });
-//     }
-//   }
-
-//   closeModal() {
-//     const modal = document.getElementById('editstepModal');
-//     if (modal) {
-//       (modal as any).modal('hide');
-//     }
-//   }
-
-// }

src/app/projects/components/steps/step-row-item/step-row-item.component.html

@@ -36,8 +36,8 @@
           
         <div class="col-auto">
           <button type="button" [routerLink]="['/tracks/history/step/',step.id]" class="btn mr-2 btn-sm btn-primary">استعراض تاريخ  متابعتها </button>
-          <button type="button" class="btn mr-2 btn-sm btn-secondary">تعديل الثقل</button>
-          <button type="button" class="btn mr-2 btn-sm btn-secondary">تعديل المعلومات</button>
+          <button type="button"(click)="onChangeWeight()"  class="btn mr-2 btn-sm btn-secondary">تعديل الثقل</button>
+          <button type="button" (click)="onEdit()"  class="btn mr-2 btn-sm btn-secondary">تعديل المعلومات</button>
           
           <button type="button"  (click)="onDelete()"  class="btn mr2 btn-sm btn-danger">إزالة</button>
        

src/app/projects/components/steps/step-row-item/step-row-item.component.ts

@@ -10,8 +10,18 @@ export class StepRowItemComponent {
 
   @Input() step :Step
   @Output() delete = new EventEmitter<void>();
-
+  @Output() edit = new EventEmitter<Step>();
+  @Output() changeWeight = new EventEmitter<Step>();
+  
   onDelete() {
     this.delete.emit();
   } 
+
+  onChangeWeight(){
+    this.changeWeight.emit(this.step);
+  }
+
+  onEdit(){
+    this.edit.emit(this.step);
+  }
 }

src/app/projects/models/requests/step-requests/changeStepInfoRequest.ts

+import { StepInfo } from "../../valueObjects/StepInfo";
+
+
+
+export class ChangeStepInfoRequest {
+    stepId: number;
+    stepInfo: StepInfo;
+}

src/app/projects/models/requests/step-requests/changeStepWeightRequest.ts

+
 export interface ChangeStepWeightRequest {
     stepId :number 
     weight  :number 

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

@@ -17,6 +17,8 @@
     *ngFor="let step of steps" 
     [step]="step"
     (delete)="openModal('delete', step)"
+    (changeWeight)="openChangeWeightModal(step)"
+    (edit)="openEditModal(step)"
     ></step-row-item>
 
     <div *ngIf="steps.length==0">
@@ -37,53 +39,6 @@
 
         </div>
         <div class="modal-body">
-          <!-- Edit Form -->
-          <!-- <div *ngIf="modalMode === 'edit'">
-            <form (ngSubmit)="saveProject()">
-                <div class="row">
-  
-                    <div class="mb-3 col-5  offset-1">
-                      <label for="stepName" class="form-label">نوع الكلفة</label>
-                      <input type="text" name="stepName" id="stepName" class="form-control" [(ngModel)]="selectedItem.costType" required>
-                    </div>
-                    
-                    <div class="mb-3 col-5">
-                      <label for="expectedSpendingDate" class="form-label">تاريخ الانفاق المتوقع</label>
-                      <input type="date" id="expectedSpendingDate" class="form-control" [(ngModel)]="selectedItem.expectedSpendingDate" name="expectedSpendingDate" required>
-                    </div>
-              
-                  <div class="mb-3 col-4  offset-1">
-                    <label for="local" class="form-label">الشراء المحلي</label>
-                    <input  id="local" class="form-control" [(ngModel)]="selectedItem.localPurchase" name="local" required>
-                  </div>
-                  <div class="mb-3 col-4 ">
-                    <label for="completion" class="form-label">الشراء الخارجي </label>
-                    <input  id="completion" class="form-control" [(ngModel)]="selectedItem.externalPurchase.ammount" name="completion" required>
-                  </div>
-                  
-                <div class="mb-3 col-2">
-                  <label for="duration" class="form-label">نوغ القطع</label>
-                  <select  id="duration" class="form-control select " [(ngModel)]="selectedItem.externalPurchase.currency" name="duration" required>
-                    <option value="USA">USA</option>  
-                    <option value="EUR">EUR</option>  
-                  </select>
-                </div>
-                  </div>
-                  <div class="row">
-                    <div class="mb-3 col-10 offset-1 " >
-                      <label for="decription" class="form-label">البيان</label>
-                      <textarea col="3" name="worker" id="decription" class="form-control" [(ngModel)]="selectedItem.description"  required>
-                        </textarea>
-                    </div>
-                    </div>
-                    <div class="row">
-
-              
-
-                </div>
-                <button type="submit" class="btn btn-success">حفظ</button>
-            </form>
-          </div> -->
           <!-- Delete Confirmation -->
           <div *ngIf="modalMode === 'delete'">
             <p>هل أنت متأكد من أنك تريد حذف المرحلة {{ selectedItem.stepInfo.stepName }}?</p>

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

@@ -8,6 +8,9 @@ import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 import { AddStepModalComponent } from '../../components/modals/add-step-modal/add-step-modal.component';
 import { Modal } from 'bootstrap';
 import { RemoveStepModalComponent } from '../../components/steps/remove-step-modal/remove-step-modal.component';
+import { EditStepModalComponent } from '../../components/step-modals/edit-step-modal/edit-step-modal.component';
+import { EditWeightModalComponent } from '../../components/step-modals/edit-weight-modal/edit-weight-modal.component';
+import { ChangeStepInfoRequest } from '../../models/requests/step-requests/changeStepInfoRequest';
 @Component({
   selector: 'step-list',
   templateUrl: './step-list.component.html',
@@ -60,14 +63,48 @@ export class StepListComponent {
       if (result) {
         // Add the new project to the list
         this.steps.push(result);
+        
+      }
+    }, (reason) => {
+      
+
+    });
+  }
+
+  openChangeWeightModal(step :Step): void {
+    const modalRef = this.modalService.open(EditWeightModalComponent);
+    modalRef.componentInstance.weight = step.weight;
+    modalRef.componentInstance.stepInfo = step.stepInfo;
+    modalRef.componentInstance.stepId = step.id;
 
+    modalRef.result.then((result) => {
+      if (result) {
+        // Add the new project to the list
+        step.weight=result.weight  
       }
     }, (reason) => {
       
 
     });
   }
+  openEditModal(step : Step): void {
+
+    const modalRef = this.modalService.open(EditStepModalComponent ,{size:'lg'});
+    modalRef.componentInstance.stepInfo = step.stepInfo;
+    modalRef.componentInstance.stepId = step.id;
 
+    modalRef.result.then((result) => {
+      if (result) {
+        // Add the new project to the list
+        
+        step.stepInfo={...result.stepInfo};
+
+      }
+    }, (reason) => {
+      
+
+    });
+  }
 
   openModal(mode: 'edit' | 'delete', item: Step): void {
     this.modalMode = mode;

src/app/projects/projects.module.ts

@@ -5,7 +5,7 @@ import { ProjectListComponent } from './pages/project-list/project-list.componen
 import { ProjectDetailsComponent } from './pages/project-details/project-details.component';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { SharedModule } from '../shared/shared.module';
-import { ProjectRoutingModule } from './project-routing.module';
+import { ProjectRoutingModule } from './routing/project-routing.module';
 import { StepRowItemComponent } from './components/steps/step-row-item/step-row-item.component';
 import { ProjectCreateComponent } from './pages/project-create/project-create.component';
 import {  MatCommonModule, MatOption, MatOptionModule } from '@angular/material/core';
@@ -43,6 +43,8 @@ import { ProjectCompleteModalComponent } from './components/projectModals/projec
 import { ProjectReplanModalComponent } from './components/projectModals/project-replan-modal/project-replan-modal.component';
 import { ChangeManagerModalComponent } from './components/projectModals/change-manager-modal/change-manager-modal.component';
 import { ChangeLeaderModalComponent } from './components/projectModals/change-leader-modal/change-leader-modal.component';
+import { EditStepModalComponent } from './components/step-modals/edit-step-modal/edit-step-modal.component';
+import { EditWeightModalComponent } from './components/step-modals/edit-weight-modal/edit-weight-modal.component';
 
 @NgModule({
   declarations: [
@@ -76,7 +78,9 @@ import { ChangeLeaderModalComponent } from './components/projectModals/change-le
     ProjectCompleteModalComponent,
     ProjectReplanModalComponent,
     ChangeManagerModalComponent,
-    ChangeLeaderModalComponent
+    ChangeLeaderModalComponent,
+    EditStepModalComponent,
+    EditWeightModalComponent
   ],
   providers: [
     ProjectService,

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

@@ -7,6 +7,7 @@ import { ChangeStepWeightRequest } from '../models/requests/step-requests/change
 import { GetStepTrackHistoryRequest } from '../models/requests/step-requests/GetStepTrackHistoryRequest';
 import { StepTrack } from '../../tracks/models/responses/steptrack';
 import { UpdateCompletionRatioRequest } from '../models/requests/step-requests/UpdateCompletionRatioRequest';
+import { ChangeStepInfoRequest } from '../models/requests/step-requests/changeStepInfoRequest';
 
 @Injectable({
   providedIn: 'root'
@@ -49,6 +50,11 @@ export class StepService {
     return this.http.put<void>(`${this.config.getServerUrl()}/Steps/ChangeCompletionRatio/?stepId=${request.stepId}`,request);
   }
   
+  // this method responsible for change the step Info 
+  public changeStepInfo(request : ChangeStepInfoRequest ):Observable<void>{
+    return this.http.put<void>(`${this.config.getServerUrl()}/Steps/UpdateStepInfo/`,request);
+  }
+
   // this method responsible for delet the step
   // 
   public deleteSep(stepId : number  ):Observable<void>{

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

@@ -43,7 +43,6 @@
         </a>
       </li>
 
-      </li><!-- End Components Nav -->
       <li class="nav-heading">الجهات الطارحة</li>
       <li class="nav-item">
         <a  [routerLink]="['customers']" class="nav-link collapsed ">