Commit e58c887e authored by hasan khaddour's avatar hasan khaddour

fix modal

parent 96ebd933
......@@ -35,6 +35,7 @@ export class AuthenticationService {
return this.http
.post<AuthenticationResponse>(
this.config.getServerUrl()+ "/Authentication/Login",loginRequest).pipe(
tap(response => {
// Store JWT token in cookie
this.cookieService.set('token', response.token,1); // Expires in days
......
......@@ -54,7 +54,6 @@ export class LoginComponent implements OnInit {
next: (res:AuthenticationResponse)=>{
if(res.email) {
this.dataStorage.setItem('userDetails', JSON.stringify(res));
this.dataStorage.setItem('token', JSON.stringify(res.token));
this.toastr.info('مرحبا بك مجددا يا ' + res.firstName+" " +res.lastName);
this.router.navigateByUrl('/home');
......
<form (ngSubmit)="saveType()">
<div class="modal-header">
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
<h5 class="modal-title" id="modalLabel">تعديل نوع مشروع</h5>
</div>
<div class="modal-body">
<!-- Edit Form -->
<form (ngSubmit)="saveType()">
<div class="row">
<div class="mb-3 col-5 offset-1">
<label for="employee" class="form-label">عدد العمال المطلوب لهذا النوع </label>
<input type="number" name="employee" id="employee" class="form-control"[min]="0" [(ngModel)]="selectedItem.expectedNumberOfWorker" required>
<input type="number" name="employee" id="employee" class="form-control"[min]="0" [(ngModel)]="request.expectedNumberOfWorker" required>
</div>
<div class="mb-3 col-5 ">
<label for="efort" class="form-label">الجهد لهذا النوع من المشاريع</label>
<input id="efort" class="form-control" [(ngModel)]="selectedItem.expectedEffort" [min]="0" name="efort" required>
<input id="efort" class="form-control" [(ngModel)]="request.expectedEffort" [min]="0" name="efort" required>
</div>
<div class="mb-3 col-9 offset-1">
<label for="typeDescription" class="form-label">وصف هذا النوع</label>
<textarea id="typeDescription" class="form-control" [cols]="3" [(ngModel)]="selectedItem.description" name="typeDescription" required>
<textarea id="typeDescription" class="form-control" [cols]="3" [(ngModel)]="request.description" name="typeDescription" required>
</textarea>
</div>
</div>
<button type="submit" class="btn btn-success">حفظ</button>
</form>
</form>
</div>
\ No newline at end of file
import { Component, EventEmitter, Input, Output } from '@angular/core';
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { ProjectType } from '../../models/responses/projectType';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { ProjectsTypesService } from '../../services/projects-types.service';
import { ToastrService } from 'ngx-toastr';
import { UpdateTypeRequest } from '../../models/requests/updateProjectTypeRequest';
@Component({
selector: 'edit-type-modal',
templateUrl: './edit-type-modal.component.html',
styleUrl: './edit-type-modal.component.css'
})
export class EditTypeModalComponent {
export class EditTypeModalComponent implements OnInit{
@Input() selectedItem : ProjectType
request : UpdateTypeRequest
@Output() submit = new EventEmitter<ProjectType>();
constructor(){}
constructor(
private avtive : NgbActiveModal,
private service : ProjectsTypesService,
private toastr :ToastrService
){}
ngOnInit(): void {
this.request = {...this.selectedItem}
}
saveType(){
this.submit.emit(this.selectedItem);
this
.service
.updateType(this.selectedItem.id,this.request)
.subscribe({
next : ()=>{
this.avtive.close(this.request);
}
})
}
}
<div class="modal-header">
<button type="button" class="btn-close" (click)="close()"></button>
<h5 class="modal-title" id="modalLabel">حذف نوع مشروع </h5>
</div>
<div class="modal-body">
<p>هل أنت متأكد من أنك تريد حذف عنصر {{ item.typeName }}?</p>
<button type="button" class="col-4 m-4 btn btn-danger" (click)="remove()">إزالة</button>
<button type="button" class="btn col-4 my-4 btn-secondary" (click)="close()">إلغاء</button>
</div>
import { Component, Input } from '@angular/core';
import { ProjectType } from '../../models/responses/projectType';
import { ProjectsTypesService } from '../../services/projects-types.service';
import { ToastrService } from 'ngx-toastr';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
@Component({
selector: 'remove-tyoe-modal',
templateUrl: './remove-tyoe-modal.component.html',
styleUrl: './remove-tyoe-modal.component.css'
})
export class RemoveTyoeModalComponent {
@Input() item : ProjectType
constructor(
private prt : ProjectsTypesService,
private toastr : ToastrService,
private active : NgbActiveModal
){}
remove(){
this
.prt
.delete(this.item.id)
.subscribe({
next : ()=>{
this.active.close(this.item.id);
this.toastr.success('تم الحذف بنجاح')
},
error:(err)=>{
}
})
}
close(){
this.active.close();
}
}
......@@ -26,31 +26,3 @@
</div>
</div>
</section>
<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="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]="selectedItem"
(submit)="saveType()"
></edit-type-modal>
</div>
<!-- Delete Confirmation -->
<div *ngIf="modalMode === 'delete'" class="row ">
<p>هل أنت متأكد من أنك تريد حذف عنصر {{ selectedItem.typeName }}?</p>
<button type="button" class="col-4 m-4 btn btn-danger" (click)="delete()">إزالة</button>
<button type="button" class="btn col-4 my-4 btn-secondary" data-bs-dismiss="modal">إلغاء</button>
</div>
</div>
</div>
</div>
</div>
\ No newline at end of file
......@@ -8,6 +8,7 @@ import { TypesCreateComponent } from './pages/types-create/types-create.componen
import { EditTypeModalComponent } from './components/edit-type-modal/edit-type-modal.component';
import { FormsModule } from '@angular/forms';
import { TypesDetailComponent } from './pages/types-detail/types-detail.component';
import { RemoveTyoeModalComponent } from './components/remove-tyoe-modal/remove-tyoe-modal.component';
@NgModule({
......@@ -16,7 +17,8 @@ import { TypesDetailComponent } from './pages/types-detail/types-detail.componen
TypesListComponent,
TypesCreateComponent,
EditTypeModalComponent,
TypesDetailComponent
TypesDetailComponent,
RemoveTyoeModalComponent
],
imports: [
CommonModule,
......
<div class="modal-header">
<button type="button" class="btn-close" (click)="close()" ></button>
<h5 class="modal-title" id="modalLabel">تعديل عنصر إنفاق</h5>
</div>
<div class="modal-body">
<!-- Edit Form -->
<div>
<form (ngSubmit)="saveItem()">
<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 m-4 btn-success">حفظ</button>
<button type="submit" (click)="close()" class="btn m-4 btn-secondary">إلغاء</button>
</form>
</div>
<!-- Delete Confirmation -->
</div>
import { Component, Input } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { FinancialSpending } from '../../models/responses/financialSpending';
import { FinancialSpendingService } from '../../services/financial-spending.service';
import { UpdateFinancialSpendItemRequest } from '../../models/requests/financial-reuqests/UpdateFinancialSpendItemRequest';
import { ToastrService } from 'ngx-toastr';
@Component({
selector: 'edit-financial-modal',
templateUrl: './edit-financial-modal.component.html',
styleUrl: './edit-financial-modal.component.css'
})
export class EditFinancialModalComponent {
@Input() selectedItem : FinancialSpending
@Input() projectId : number
constructor(
private activeModal: NgbActiveModal,
private toastr : ToastrService,
private financialService : FinancialSpendingService
){}
saveItem(){
let request : UpdateFinancialSpendItemRequest ={
...this.selectedItem,
projectId: this.projectId
}
this.financialService.updateSpendItem(request).subscribe({
next :()=>{
this.activeModal.close(request);
}
,
error:(err)=>{
this.toastr.error("لقد حدث خطاء ما ")
}
})
}
close(){
this.activeModal.close();
}
}
<div class="modal-header">
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
<h5 class="modal-title" id="modalLabel">حذف عنصر إنفاق</h5>
</div>
<div class="modal-body">
<!-- Delete Confirmation -->
<div>
<p class="text-center text-danger">هل أنت متأكد من أنك تريد حذف عنصر {{ selectedItem.costType }}?</p>
<button type="button" class="btn m-4 btn-danger" (click)="saveItem()">إزالة</button>
<button type="button" class="btn btn-secondary" (click)="close()">إلغاء</button>
</div>
\ No newline at end of file
import { Component, Input } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { ToastrService } from 'ngx-toastr';
import { UpdateFinancialSpendItemRequest } from '../../models/requests/financial-reuqests/UpdateFinancialSpendItemRequest';
import { FinancialSpending } from '../../models/responses/financialSpending';
import { FinancialSpendingService } from '../../services/financial-spending.service';
import { RemoveFinancialSpendItemRequest } from '../../models/requests/financial-reuqests/RemoveFinancialSpendItemRequest';
@Component({
selector: 'remove-financial-modal',
templateUrl: './remove-financial-modal.component.html',
styleUrl: './remove-financial-modal.component.css'
})
export class RemoveFinancialModalComponent {
@Input() selectedItem : FinancialSpending
@Input() projectId : number
constructor(
private activeModal: NgbActiveModal,
private toastr : ToastrService,
private financialService : FinancialSpendingService
){}
saveItem(){
let request : RemoveFinancialSpendItemRequest ={
...this.selectedItem,
projectId: this.projectId
}
this.financialService.delete(request).subscribe({
next :()=>{
this.activeModal.close(request);
}
,
error:(err)=>{
this.toastr.error("لقد حدث خطاء ما ")
}
})
}
close(){
this.activeModal.close();
}
}
......@@ -15,14 +15,19 @@
<financial-item class=" offset-2"
*ngFor="let item of spends"
[item]="item"
(edit)="openModal('edit', item)"
(delete)="openModal('delete', item)"
(edit)="openEditModal(item)"
(delete)="openDeleteModal(item)"
>
</financial-item>
<div *ngIf="spends.length==0">
<div *ngIf="spends.length==0" class="text-center text-primary">
<strong>
للأسف هذا المشروع لايحوي على خطة انفاق
</strong>
</div>
</div>
</div>
......
......@@ -11,6 +11,8 @@ import { AddFinancialSpendModalComponent } from '../../components/modals/add-fin
import { UpdateFinancialSpendItemRequest } from '../../models/requests/financial-reuqests/UpdateFinancialSpendItemRequest';
import { RemoveFinancialSpendItemRequest } from '../../models/requests/financial-reuqests/RemoveFinancialSpendItemRequest';
import { Modal } from 'bootstrap';
import { EditFinancialModalComponent } from '../../components/edit-financial-modal/edit-financial-modal.component';
import { RemoveFinancialModalComponent } from '../../components/remove-financial-modal/remove-financial-modal.component';
@Component({
selector: 'financial-spending',
......@@ -159,4 +161,43 @@ export class FinancialSpendingComponent {
});
}
openEditModal(item : FinancialSpending): void {
const modalRef = this.modalService.open(EditFinancialModalComponent);
modalRef.componentInstance.projectId = this.projectId;
modalRef.componentInstance.selectedItem = item;
modalRef.result.then((result :UpdateFinancialSpendItemRequest) => {
if (result) {
let sp = this.spends.find(e => e.id == item.id);
sp={...item};
}
}, (reason) => {
});
}
openDeleteModal(item : FinancialSpending): void {
const modalRef = this.modalService.open(RemoveFinancialModalComponent);
modalRef.componentInstance.projectId = this.projectId;
modalRef.componentInstance.selectedItem = item;
modalRef.result.then((result : number ) => {
if (result) {
let sp = this.spends.filter(e => e.id != item.id);
}
}, (reason) => {
});
}
}
......@@ -32,9 +32,9 @@
</div>
</div>
<div class="row mt-5 align-items-center">
<p>
<p class="text-center">
إن السيد <b>{{participant.personalInfo | fullname}}</b>
يعمل حاليا في المشروع بصفة <b>{{currentParticipation.role}}</b> وبنسبة تفرغ قدرها <b>{{currentParticipation.partialTimeRatio}}</b> ويبين الجدول التالي تبدلات عمله اثناء عمله في المشروع
يعمل حاليا في المشروع بصفة <b>{{currentParticipation.role}}</b> وبنسبة تفرغ قدرها <b>{{currentParticipation.partialTimeRatio}}</b> سلعة، ويبين الجدول التالي تبدلات عمله اثناء عمله في المشروع
</p>
</div>
<div class="row mt-5 align-items-center">
......
......@@ -48,6 +48,8 @@ import { EditWeightModalComponent } from './components/step-modals/edit-weight-m
import { ProjectBycreterionComponent } from './pages/project-bycreterion/project-bycreterion.component';
import { FilterModalComponent } from './components/filter-modal/filter-modal.component';
import { CancelProjectComponent } from './components/cancel-project/cancel-project.component';
import { EditFinancialModalComponent } from './components/edit-financial-modal/edit-financial-modal.component';
import { RemoveFinancialModalComponent } from './components/remove-financial-modal/remove-financial-modal.component';
@NgModule({
declarations: [
......@@ -86,7 +88,9 @@ import { CancelProjectComponent } from './components/cancel-project/cancel-proje
EditWeightModalComponent,
ProjectBycreterionComponent,
FilterModalComponent,
CancelProjectComponent
CancelProjectComponent,
EditFinancialModalComponent,
RemoveFinancialModalComponent
],
providers: [
ProjectService,
......
......@@ -39,7 +39,7 @@ export class FinancialSpendingService {
public updateSpendItem(request : UpdateFinancialSpendItemRequest ):Observable<FinancialSpending>{
return this.http.put<FinancialSpending>(this.config.getServerUrl()+ "/FinancialSpends/",request);
return this.http.put<FinancialSpending>(this.config.getServerUrl()+ "/FinancialSpends/"+request.id,request);
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment