diff --git a/cosmos-ems/src/app/app.component.html b/cosmos-ems/src/app/app.component.html index 4e030fa..5bba6f5 100644 --- a/cosmos-ems/src/app/app.component.html +++ b/cosmos-ems/src/app/app.component.html @@ -1,36 +1,40 @@
- +
Welcome : {{ fullName }}
+ +
- -
\ No newline at end of file + + diff --git a/cosmos-ems/src/app/app.module.ts b/cosmos-ems/src/app/app.module.ts index 6469633..0b51f8f 100644 --- a/cosmos-ems/src/app/app.module.ts +++ b/cosmos-ems/src/app/app.module.ts @@ -10,6 +10,7 @@ import { ProgressBarComponent } from './shared/progress-bar/progress-bar.compone import { HomeComponent } from './home/home.component'; import { RouterModule } from '@angular/router'; import { CreateEmployeeGuard } from './employees/create-employee.guard'; +import { EmployeeViewComponent } from './employee-view/employee-view.component'; @NgModule({ declarations: [ @@ -17,7 +18,8 @@ import { CreateEmployeeGuard } from './employees/create-employee.guard'; EmployeesComponent, LkrFormatterPipe, ProgressBarComponent, - HomeComponent + HomeComponent, + EmployeeViewComponent ], imports: [ BrowserModule, @@ -27,6 +29,7 @@ import { CreateEmployeeGuard } from './employees/create-employee.guard'; { path: 'employees', component: EmployeesComponent }, { path: 'employees/:id', component: EmployeesComponent, canActivate: [CreateEmployeeGuard] }, { path: 'home', component: HomeComponent }, + {path:'empview/:id',component:EmployeeViewComponent}, { path: '', redirectTo: 'home', pathMatch: 'full' }, ]) ], diff --git a/cosmos-ems/src/app/employee-view/employee-view.component.html b/cosmos-ems/src/app/employee-view/employee-view.component.html new file mode 100644 index 0000000..c04b946 --- /dev/null +++ b/cosmos-ems/src/app/employee-view/employee-view.component.html @@ -0,0 +1,70 @@ +
+
+
+
+
+
User View
+
    +
  • id: {{ employee?.id }}
  • +
  • + firstName: {{ employee?.firstName }} +
  • +
  • lastName: {{ employee?.lastName }}
  • +
  • + designation: {{ employee?.designation }} +
  • +
  • + insuranceBalance: {{ employee?.insuranceBalance }} +
  • +
  • +
    +
    +
    + Show RBT   + +
    +
    + +
    +
  • +
+
+
+
+
+
+
+
User Edit
+
    +
  • id:
  • +
  • + firstName: +
  • +
  • + lastName: +
  • +
  • + designation: +
  • +
  • RBT :
  • + +
+
+
+
+
+
+ +
diff --git a/cosmos-ems/src/app/employee-view/employee-view.component.scss b/cosmos-ems/src/app/employee-view/employee-view.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/cosmos-ems/src/app/employee-view/employee-view.component.ts b/cosmos-ems/src/app/employee-view/employee-view.component.ts new file mode 100644 index 0000000..a7399f9 --- /dev/null +++ b/cosmos-ems/src/app/employee-view/employee-view.component.ts @@ -0,0 +1,30 @@ +import { Location } from '@angular/common'; +import { Component, OnInit } from '@angular/core'; +import { ActivatedRoute } from '@angular/router'; +import { Observable } from 'rxjs'; +import { EmployeeService } from '../employees/employee.service'; +import { Employee } from '../employees/Employees.model'; + +@Component({ + selector: 'em-employee-view', + templateUrl: './employee-view.component.html', + styleUrls: ['./employee-view.component.scss'] +}) +export class EmployeeViewComponent implements OnInit { + + employee!: Employee; + + checkboxFlag!:boolean; + + constructor(private route: ActivatedRoute, private _location: Location, private employeeService: EmployeeService) { + } + + ngOnInit(): void { + this.employeeService.getEmployee(this.route.snapshot.params['id']).subscribe(emp => this.employee = emp!); + } + + backClicked() { + this._location.back(); + } + +} diff --git a/cosmos-ems/src/app/employees/employee.service.ts b/cosmos-ems/src/app/employees/employee.service.ts index 45cd4f0..8f52605 100644 --- a/cosmos-ems/src/app/employees/employee.service.ts +++ b/cosmos-ems/src/app/employees/employee.service.ts @@ -3,6 +3,7 @@ import { Observable } from 'rxjs'; import { HttpService } from '../shared/http.service'; import { Employee } from './Employees.model'; +import { find, map } from "rxjs/operators"; @Injectable({ providedIn: 'root' }) @@ -13,4 +14,12 @@ export class EmployeeService { getEmployees(): Observable { return this.httpService.getAllEmployees(); } + + getEmployee(empId: String): Observable { + + return this.httpService.getAllEmployees().pipe( + map(data => data.find(e => e.id == empId)) + ); + + } } diff --git a/cosmos-ems/src/app/employees/employees.component.html b/cosmos-ems/src/app/employees/employees.component.html index 118689f..8828ca8 100644 --- a/cosmos-ems/src/app/employees/employees.component.html +++ b/cosmos-ems/src/app/employees/employees.component.html @@ -44,6 +44,7 @@
Filtered by : {{designationFilter}}
[progress]='employee.rbtProgress' [firstName]='employee.firstName' (progressClick)='onMessageRecived($event)'> + diff --git a/cosmos-ems/src/app/employees/employees.component.ts b/cosmos-ems/src/app/employees/employees.component.ts index 47c9ac4..1e76a2c 100644 --- a/cosmos-ems/src/app/employees/employees.component.ts +++ b/cosmos-ems/src/app/employees/employees.component.ts @@ -1,4 +1,5 @@ import { Component, OnDestroy, OnInit } from '@angular/core'; +import { Router } from '@angular/router'; import { Subscription } from 'rxjs'; import { EmployeeService } from './employee.service'; @@ -30,7 +31,7 @@ export class EmployeesComponent implements OnInit, OnDestroy { return this._designationFilter; } - constructor(private employeeService: EmployeeService) { } + constructor(private employeeService: EmployeeService,private router: Router) { } ngOnInit(): void { @@ -56,4 +57,7 @@ export class EmployeesComponent implements OnInit, OnDestroy { this.message = value; } + onRouteChange(empId: string) { + this.router.navigate(['empview', empId]); + } }