add employee participation

angular.json

@@ -44,7 +44,7 @@
               }
             ],
           "styles": [
-            "@angular/material/prebuilt-themes/deeppurple-amber.css",
+            "@angular/material/prebuilt-themes/azure-blue.css",
             "src/styles.css",
             "src/assets/css/app-light.css",
             "./node_modules/@fortawesome/fontawesome-free/css/all.min.css",

src/app/employees/employees-routing.module.ts

@@ -6,9 +6,13 @@ import { Observable } from 'rxjs';
 import { Result } from '../core/models/result';
 import { Employee } from './models/responses/employee';
 import { EmployeeProfileComponent } from './pages/employee-profile/employee-profile.component';
+import { EmployeeParticipateComponent } from './pages/employee-participate/employee-participate.component';
+import { EmployeeParticipatesComponent } from './pages/employee-participates/employee-participates.component';
 
 const routes: Routes = [
-  {path:"profile", component:EmployeeProfileComponent}
+  {path:"profile", component:EmployeeProfileComponent},
+  {path:"participates/:id", component:EmployeeParticipatesComponent}
+  
 ];
 
 @NgModule({

src/app/employees/employees.module.ts

@@ -6,6 +6,7 @@ import { EmployeeProfileComponent } from './pages/employee-profile/employee-prof
 import { EmployeeParticipatesComponent } from './pages/employee-participates/employee-participates.component';
 import { EmployeeParticipateComponent } from './pages/employee-participate/employee-participate.component';
 import { ParticipateItemComponent } from './components/participate-item/participate-item.component';
+import { SharedModule } from '../shared/shared.module';
 
 
 @NgModule({
@@ -17,6 +18,7 @@ import { ParticipateItemComponent } from './components/participate-item/particip
   ],
   imports: [
     CommonModule,
+    SharedModule,
     EmployeesRoutingModule
   ]
 })

src/app/employees/pages/employee-participate/employee-participate.component.html

-<p>employee-participate works!</p>
+<div class="card shadow mb-4">
+    <div class="card-header py-3">
+      <div class="row align-items-center">
+        <div class="col-auto">
+          <a href="profile-posts.html" class="avatar avatar-md">
+            <img src="./assets/images/users/4.jpg" alt="..." class="avatar-img rounded-circle">
+          </a>
+        </div>
+        <div class="col ml-n2">
+          <strong class="mb-1">{{employeeParticipate.partialTimeRatio}}</strong><span class="dot dot-lg bg-success ml-1"></span>
+          <p class="small text-muted mb-1">Fringilla Ornare Placerat Consulting</p>
+        </div>
+        <div class="col-auto">
+          <span class="m-1"><i class="fe fe-facebook fe-12 text-muted"></i></span>
+          <span class="m-1"><i class="fe fe-twitter fe-12 text-muted"></i></span>
+        </div>
+      </div>
+    </div>
+    <div class="card-body">
+      <div class="row align-items-center">
+        <div class="col">
+          <div class="small mb-2 d-flex">
+            <span class="text-muted flex-fill">Progress</span>
+            <span class="text-muted">68</span>
+          </div>
+          <div class="progress" style="height: 2px;">
+            <div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
+          </div>
+        </div>
+        <div class="col-auto">
+          <button type="button" class="btn btn-sm btn-primary">Message</button>
+          <button type="button" class="btn btn-sm btn-secondary">Profile</button>
+        </div>
+      </div>
+    </div> <!-- / .card-body -->
+  </div>
\ No newline at end of file

src/app/employees/pages/employee-participate/employee-participate.component.ts

-import { Component } from '@angular/core';
+import { Component, Input } from '@angular/core';
+import { EmployeeParticipate } from '../../models/responses/employeeParticipate';
 
 @Component({
   selector: 'employee-participate',
@@ -7,4 +8,9 @@ import { Component } from '@angular/core';
 })
 export class EmployeeParticipateComponent {
 
+  @Input() employeeParticipate :EmployeeParticipate 
+  
+  constructor(){}
+
+  
 }

src/app/employees/pages/employee-participates/employee-participates.component.html

-<p>employee-participates works!</p>
+<section  *ngIf="employeeParticipates" class="row">
+
+    <employee-participate class="col-8 offset-2" *ngFor="let participate of employeeParticipates" [employeeParticipate]="participate"></employee-participate>
+
+    <div *ngIf="employeeParticipates.length==0">
+        للأسف أنت لم تشارك حتى الآن بأي مشروع
+    </div>
+</section>
\ No newline at end of file

src/app/employees/pages/employee-participates/employee-participates.component.ts

-import { Component } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
+import { EmployeeParticipate } from '../../models/responses/employeeParticipate';
+import { EmployeesService } from '../../services/employees.service';
+import { ToastrService } from 'ngx-toastr';
+import { ActivatedRoute } from '@angular/router';
 
 @Component({
   selector: 'employee-participates',
   templateUrl: './employee-participates.component.html',
   styleUrl: './employee-participates.component.css'
 })
-export class EmployeeParticipatesComponent {
+export class EmployeeParticipatesComponent implements OnInit {
 
+  employeeParticipates : EmployeeParticipate[] 
+  employeeId = Number(this.route.snapshot.paramMap.get('id'));
+  constructor(
+    private emploeesService :EmployeesService,
+    private toastr : ToastrService,
+    private route: ActivatedRoute
+  ) {
+    
+  }
+  ngOnInit(): void {
+    this.loadParticipations();
+
+  }
+   loadParticipations(): void{
+
+    this.emploeesService.getEmployeeParticipations(this.employeeId).subscribe({
+      next: (data)=> {
+        this.employeeParticipates= data 
+        this.toastr.success("تم تحميل مساهماتك بنجاح");
+      }
+      ,
+
+      error:(err)=>{
+        console.log(err)
+        this.toastr.error("لقد حدث خطاء ما")
+      }
+    })
+
+  }
 }

src/app/employees/pages/employee-profile/employee-profile.component.html

-<section dir="lrt" class="vh-100" style="background-color: #f4f5f7;">
-    <div class="container py-5 h-100">
-      <div class="row d-flex justify-content-center align-items-center h-100">
-        <div class="col col-lg-6 mb-4 mb-lg-0">
-          <div class="card mb-3" style="border-radius: .5rem;">
-            <div class="row g-0">
-              <div class="col-md-4 gradient-custom text-center text-white"
-                style="border-top-left-radius: .5rem; border-bottom-left-radius: .5rem;">
-                <img src="https://mdbcdn.b-cdn.net/img/Photos/new-templates/bootstrap-chat/ava1-bg.webp"
-                  alt="Avatar" class="img-fluid my-5" style="width: 80px;" />
-                <h5>Marie Horwitz</h5>
-                <p>Web Designer</p>
-                <i class="far fa-edit mb-5"></i>
+<div class="card profile shadow">
+  <div class="card-body my-4">
+    <div class="row align-items-center">
+      <div class="col-md-3 text-center mb-5">
+        <a href="#!" class="avatar avatar-xl">
+          <img src="./assets/images/users/3.jpg" alt="..." class="avatar-img rounded-circle">
+        </a>
       </div>
-              <div class="col-md-8">
-                <div class="card-body p-4">
-                  <h6>Information</h6>
-                  <hr class="mt-0 mb-4">
-                  <div class="row pt-1">
-                    <div class="col-6 mb-3">
-                      <h6>Email</h6>
-                      <p class="text-muted">infoexample.com</p>
+      <div class="col">
+        <div class="row align-items-center">
+          <div class="col-md-7">
+            <h4 class="mb-1 text-bold text-black">{{employee.personalInfo| fullname}}</h4>
+            <p class="small mb-3"><span class="text-primary">{{employee.email}}</span></p>
           </div>
-                    <div class="col-6 mb-3">
-                      <h6>Phone</h6>
-                      <p class="text-muted">123 456 789</p>
+          <div class="col">
           </div>
         </div>
-                  <h6>Projects</h6>
-                  <hr class="mt-0 mb-4">
-                  <div class="row pt-1">
-                    <div class="col-6 mb-3">
-                      <h6>Recent</h6>
-                      <p class="text-muted">Lorem ipsum</p>
+        <div class="row mb-4">
+          <div class="col-md-7">
+            <p class="text-muted">الوظيفة {{employee.workInfo.workJob}} , صفة العمل {{employee.workInfo.workType}} </p>
           </div>
-                    <div class="col-6 mb-3">
-                      <h6>Most Viewed</h6>
-                      <p class="text-muted">Dolor sit amet</p>
+          <div class="col">
+            <p class="small mb-0 text-muted">ساعات عملي {{employee.availability.currentWorkingHours}}</p>
+            <p class="small mb-0 text-muted">يعمل لدى {{employee.departmentName}}</p>
           </div>
         </div>
-                  <div class="d-flex justify-content-start">
-                    <a href="#!"><i class="fab fa-facebook-f fa-lg me-3"></i></a>
-                    <a href="#!"><i class="fab fa-twitter fa-lg me-3"></i></a>
-                    <a href="#!"><i class="fab fa-instagram fa-lg"></i></a>
+        <div class="row align-items-center">
+          <div class="col mb-2">
+            <button type="button" [routerLink]="['/employees/participates',id]" class="btn m-3 btn-primary">استعراض مساهماتي</button>
+            <button type="button" class="btn m-3 btn-secondary">إصدار تقرير بعملي</button>
           </div>
         </div>
       </div>
-            </div>
-          </div>
-        </div>
-      </div>
+    </div> <!-- / .row- -->
+  </div> <!-- / .card-body - -->
+</div>
\ No newline at end of file
-    </div>
-  </section>
\ No newline at end of file

src/app/employees/pages/employee-profile/employee-profile.component.ts

-import { Component } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
+import { Employee } from '../../models/responses/employee';
+import { EmployeesService } from '../../services/employees.service';
+import { ToastrService } from 'ngx-toastr';
+import { UserService } from '../../../core/services/authentication/user.service';
 
 @Component({
   selector: 'employee-profile',
   templateUrl: './employee-profile.component.html',
   styleUrl: './employee-profile.component.css'
 })
-export class EmployeeProfileComponent {
+export class EmployeeProfileComponent  implements OnInit{
 
+  employee : Employee 
+  id : number 
+  constructor(
+    private employeeSerivce : EmployeesService,
+    private userSerivce : UserService,
+    
+    private toastr : ToastrService ){}
+
+  ngOnInit(): void {
+  this.id =this.userSerivce.getEmployeeId()
+  this.employeeSerivce.getCurrentEmployee().subscribe({
+
+    next:(data)=>this.employee=data, 
+    error :(err)=>this.toastr.error("لقد حدث خطاء ما")
+  });
+
+  }
 }

src/app/employees/services/employees.service.ts

@@ -42,13 +42,13 @@ export class EmployeesService {
   
   public getAvailableEmployees( ):Observable<Employee[]>{
 
-    //this api endpoint take a pagination , i'll use i later 
+    //this api endpoint take a pagination , i'll use it later 
     return this.http.get<Employee[]>(this.config.getServerUrl() + "/Employees/Available");
   }
   
   public getEmployeeParticipations(id :number ):Observable<EmployeeParticipate[]>{
 
-    return this.http.get<EmployeeParticipate[]>(`${this.config.getServerUrl}/Employees/EmployeeParticipations/employeeId=${id}`);
+    return this.http.get<EmployeeParticipate[]>(`${this.config.getServerUrl()}/Employees/EmployeeParticipations/?employeeId=${id}`);
   }
 
   public getMyParticipation( ):Observable<EmployeeParticipate[]>{

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

-import { Aggreement } from "../valueObjects/Aggreement"
-import { FinancialFund } from "../valueObjects/FinancialFund"
-import { ProjectClassification } from "../valueObjects/ProjectClassification"
-import { ProjectInfo } from "../valueObjects/ProjectInfo"
-import { ProposalInfo } from "../valueObjects/proposalInfo"
+import { Aggreement } from "../../valueObjects/Aggreement"
+import { FinancialFund } from "../../valueObjects/FinancialFund"
+import { ProjectClassification } from "../../valueObjects/ProjectClassification"
+import { ProjectInfo } from "../../valueObjects/ProjectInfo"
+import { ProposalInfo } from "../../valueObjects/proposalInfo"
 
 export class CreateProjectRequest {
     projectInfo :ProjectInfo 

src/app/projects/models/valueObjects/FinancialFund.ts

 export interface FinancialFund {
-
-
     financialStatus: string;
     source: string;
 }

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

+<p>project-attachments works!</p>

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

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

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

@@ -120,10 +120,10 @@
      
       </div>
     
-      <div class="col-4" formGroupName="executerId">
+      <div class="col-4">
         <mat-form-field>
           <mat-label>الفعالية المنفذة </mat-label>
-          <mat-select>
+          <mat-select formControlName="executerId">
             <mat-option value="1">قسم المعلوميات</mat-option>
             <mat-option value="2">قسم النظم الاكترونية</mat-option>
           </mat-select>
@@ -134,7 +134,7 @@
       <div class="row mb-4" formGroupName="projectClassification">
       
         <mat-form-field class="col-4">
-          <mat-label  for="projectStatus" class="form-label" >وضع النشاط</mat-label>
+          <mat-label  for="projectStatus" class="form-label" >حالة النشاط</mat-label>
           <input formControlName="projectStatus" class="form-control" id="projectStatus" matInput />
         </mat-form-field>
      

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

@@ -7,8 +7,8 @@ import { Result } from '../../../core/models/result';
 import { Project } from '../../models/responses/project';
 import { Customer } from '../../../customers/models/customer';
 import { CustomerService } from '../../../customers/services/customer.service';
-import { CreateProjectRequest } from '../../models/requests/createProjectRequest';
 import { ProjectService } from '../../services/project.service';
+import { CreateProjectRequest } from '../../models/requests/project-requests/createProjectRequest';
 
 @Component({
   selector: 'project-create',
@@ -117,8 +117,12 @@ export class ProjectCreateComponent {
 
   onSubmit(request : CreateProjectRequest){
 
+    console.log(request)
+    
+    console.log(this.projectForm.errors)
     if(this.projectForm.valid){
-      console.log(true)
+      console.log(request);
+      this.projectService.createProject(request);
     }
   
     

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

@@ -139,7 +139,7 @@
             
                 <p class="mb-4">
                   <strong>مدير المشروع </strong>
-                  <br/><small>{{project.projectManager.personalInfo.firstName}}</small>
+                  <br/><small>{{project.projectManager.personalInfo | fullname}}</small>
                     
                   </p>
   
@@ -148,7 +148,7 @@
             
                 <p class="mb-4">
                   <strong>رئيس فريق العمل </strong>
-                  <br/><small>{{project.projectManager.personalInfo.firstName}}</small>
+                  <br/><small>{{project.projectManager.personalInfo | fullname }}</small>
                     
                   </p>
   
@@ -203,32 +203,118 @@
                 <img src="/assets/images/users/4.jpg" class="navbar-brand-img brand-sm mx-auto my-4" alt="...">
               </div>  
             </div> <!-- /.row -->
-  
            <hr>
-            <div class="row mt-5">
-              <button class="btn btn-primary">لاطلاع على  خطة الانفاق</button>
-              <button class="btn btn-primary">الاطلاع على المرفقات </button>
-              <button class="btn btn-primary">الاطلاع على عمليات المتابعة</button>
-            
+            <div class="row align-items-center mb-4">
+              <div class="col-auto">
+                <strong>تخطيط المشروع</strong>
               </div>
-            <div class="row mt-5 d-flex align-items-around">
-              <button class=" btn btn-primary">إضافة مرفقات</button>
-              <button class=" btn btn-primary">إضافة دراسة جدوى </button>
-              <button class=" btn btn-primary">إضافة تصنيف مشروع</button>
 
+              <div class="row">
+                <div class="col-md-6 col-lg-4">
+                  <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 class="fe fe-credit-card fe-16 text-white"></span>
+                        </div>
+                        <div class="flex-fill ml-4 fname">
+                          <strong>إارة خطة الانفاق</strong><br />
                         </div>
                         
-            <div class="row mt-5">
-              <button class="btn btn-primary">إضافة مرحلة</button>
-              <button class="btn btn-primary">إضافة مشارك</button>
                       </div>
-           <div class="row mt-5">
-            <button class="btn btn-primary">إضافة عملية متابعة</button>
+                    </div> <!-- .card-body -->
+                  </div> <!-- .card -->
+                </div> <!-- .col -->
+                <div class="col-md-6 col-lg-4">
+                  <div class="card shadow mb-4">
+                    <div class="card-body file-list">
+                      <div class="d-flex align-items-center">
+                        <div class="text-center">
+                          <div class="circle circle-md bg-secondary">
+                            <span class="fe fe-users fe-16 text-white"></span>
+                          </div>
+                        </div>
+                        <div class="flex-fill ml-4 fname">
+                          <strong>إضافة معلومات المشروع</strong><br />
+                        </div>
+                      </div>
+                    </div> <!-- .card-body -->
+                  </div> <!-- .card -->
+                </div> <!-- .col -->
+                <div class="col-md-6 col-lg-4">
+                  <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 class="fe fe-map fe-16 text-white"></span>
+                        </div>
+                        <div class="flex-fill ml-4 fname">
+                          <strong>إدارة الخطة</strong><br />
+                        </div>
+                      </div>
+                    </div> <!-- .card-body -->
+                  </div> <!-- .card -->
                 
+                </div> <!-- .row -->
       
             </div>
+
      <hr>     
+         <div class="row align-items-center mb-4">
+    <div class="col-auto ">
+      <strong>معلومات المشروع</strong>
+    </div>
+    <div class="row">
+      <div class="col-md-6 col-lg-4">
+        <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 class="fe fe-credit-card fe-16 text-white"></span>
+              </div>
+              <div class="flex-fill ml-4 fname">
+                <strong>المراحل</strong><br />
+              </div>
+              
+            </div>
+          </div> <!-- .card-body -->
+        </div> <!-- .card -->
+      </div> <!-- .col -->
+      <div class="col-md-6 col-lg-4">
+        <div class="card shadow mb-4">
+          <div class="card-body file-list">
+            <div class="d-flex align-items-center">
+              <div class="text-center">
+                <div class="circle circle-md bg-secondary">
+                  <span class="fe fe-users fe-16 text-white"></span>
+                </div>
+              </div>
+              <div class="flex-fill ml-4 fname">
+                <strong>إضافة المرفقات</strong><br />
+              </div>
+            </div>
+          </div> <!-- .card-body -->
+        </div> <!-- .card -->
+      </div> <!-- .col -->
+      <div class="col-md-6 col-lg-4">
+        <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 class="fe fe-map fe-16 text-white"></span>
+              </div>
+              <div class="flex-fill ml-4 fname">
+                <strong>إدارة المشاركين</strong><br />
+              </div>
+            </div>
+          </div> <!-- .card-body -->
+        </div> <!-- .card -->
+      
+      </div> <!-- .row -->
+
+  </div>
   
+<hr>         
             <div class="row mt-5">
               <div class="col-2 text-center">
                 <img src="/assets/images/users/4.jpg" class="navbar-brand-img brand-sm mx-auto my-4" alt="...">

src/app/projects/projects.module.ts

@@ -19,6 +19,7 @@ import { ProjectService } from './services/project.service';
 import {MatSelectModule} from '@angular/material/select';
 import {MatDatepickerModule} from '@angular/material/datepicker';
 import {provideNativeDateAdapter} from '@angular/material/core';
+import { ProjectAttachmentsComponent } from './pages/project-attachments/project-attachments.component';
 
 @NgModule({
   declarations: [
@@ -28,7 +29,8 @@ import {provideNativeDateAdapter} from '@angular/material/core';
     ProjectDetailsComponent,
     StepRowItemComponent,
     ProjectHeaderComponent,
-    ProjectCreateComponent
+    ProjectCreateComponent,
+    ProjectAttachmentsComponent
   ],
   providers: [
     ProjectService,