Skip to content

employee view feature added #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
68 changes: 36 additions & 32 deletions cosmos-ems/src/app/app.component.html
Original file line number Diff line number Diff line change
@@ -1,36 +1,40 @@
<div>
<nav class="navbar navbar-expand-lg fixed-top ">
<a class="navbar-brand">COSMOS EMS | </a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse " id="navbarSupportedContent">
<ul class="navbar-nav mr-4">
<li class="nav-item">
<a class="nav-link" routerLink='/home' >HOME</a>
</li>
<li class="nav-item">
<a class="nav-link" routerLink='/employees'>List Employees</a>
<!-- <a class="nav-link" [routerLink]="['/employees',10]">List Employees</a> -->
</li>
<li class="nav-item">
<a class="nav-link ">Search</a>
</li>
<nav class="navbar navbar-expand-lg fixed-top">
<a class="navbar-brand">COSMOS EMS | </a>
<button
class="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-4">
<li class="nav-item">
<a class="nav-link" routerLink="/home">HOME</a>
</li>
<li class="nav-item">
<a class="nav-link" routerLink="/employees">List Employees</a>
<!-- <a class="nav-link" [routerLink]="['/employees',10]">List Employees</a> -->
</li>
<li class="nav-item">
<a class="nav-link">Search</a>
</li>
</ul>
</div>

</ul>
</div>

<div class="message mr-4" *ngIf=fullName>Welcome : {{fullName}} </div>
<ul class="navbar-nav mr-4" *ngIf=fullName>
<li class="nav-item">
<a class="nav-link">Logout</a>
</li>
</ul>


</nav>
<div class="message mr-4" *ngIf="fullName">Welcome : {{ fullName }}</div>
<ul class="navbar-nav mr-4" *ngIf="fullName">
<li class="nav-item">
<a class="nav-link">Logout</a>
</li>
</ul>
</nav>
</div>
<div>
<router-outlet></router-outlet>
</div>
<router-outlet></router-outlet>
</div>
5 changes: 4 additions & 1 deletion cosmos-ems/src/app/app.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,14 +10,16 @@ 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: [
AppComponent,
EmployeesComponent,
LkrFormatterPipe,
ProgressBarComponent,
HomeComponent
HomeComponent,
EmployeeViewComponent
],
imports: [
BrowserModule,
Expand All @@ -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' },
])
],
Expand Down
70 changes: 70 additions & 0 deletions cosmos-ems/src/app/employee-view/employee-view.component.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,70 @@
<div class="container" style="margin-top: 10rem">
<div class="row">
<div class="col-sm-6">
<div class="card">
<div class="card-body">
<h5 class="card-title">User View</h5>
<ul class="list-group list-group-flush">
<li class="list-group-item">id: {{ employee?.id }}</li>
<li class="list-group-item">
firstName: {{ employee?.firstName }}
</li>
<li class="list-group-item">lastName: {{ employee?.lastName }}</li>
<li class="list-group-item">
designation: {{ employee?.designation }}
</li>
<li class="list-group-item">
insuranceBalance: {{ employee?.insuranceBalance }}
</li>
<li class="list-group-item">
<div class="input-group mb-3">
<div class="input-group-prepend">
<div class="input-group-text">
Show RBT &nbsp;
<input type="checkbox" [(ngModel)]="checkboxFlag" />
</div>
</div>
<input
type="number"
[value]="checkboxFlag ? employee?.rbtProgress : ''"
class="form-control"
/>
</div>
</li>
</ul>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="card">
<div class="card-body">
<h5 class="card-title">User Edit</h5>
<ul class="list-group list-group-flush">
<li class="list-group-item">id: <input type="text" #eid /></li>
<li class="list-group-item">
firstName: <input type="text" #efname />
</li>
<li class="list-group-item">
lastName: <input type="text" #elname />
</li>
<li class="list-group-item">
designation: <input type="text" #edes />
</li>
<li class="list-group-item">RBT : <input type="text" #rbt /></li>
<button type="button" class="btn btn-primary">
Update Employee
</button>
</ul>
</div>
</div>
</div>
</div>
<br />
<button
type="button"
class="btn btn-primary btn-lg btn-block"
(click)="backClicked()"
>
Go back
</button>
</div>
Empty file.
30 changes: 30 additions & 0 deletions cosmos-ems/src/app/employee-view/employee-view.component.ts
Original file line number Diff line number Diff line change
@@ -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();
}

}
9 changes: 9 additions & 0 deletions cosmos-ems/src/app/employees/employee.service.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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'
})
Expand All @@ -13,4 +14,12 @@ export class EmployeeService {
getEmployees(): Observable<Employee[]> {
return this.httpService.getAllEmployees();
}

getEmployee(empId: String): Observable<Employee | undefined> {

return this.httpService.getAllEmployees().pipe(
map(data => data.find(e => e.id == empId))
);

}
}
1 change: 1 addition & 0 deletions cosmos-ems/src/app/employees/employees.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,7 @@ <h6>Filtered by : {{designationFilter}}</h6>
[progress]='employee.rbtProgress'
[firstName]='employee.firstName'
(progressClick)='onMessageRecived($event)'></em-progress-bar></td>
<td><button type="button" class="btn btn-primary" (click)="onRouteChange(employee.id)" >View Employee</button></td>
</tr>
</tbody>
</table>
Expand Down
6 changes: 5 additions & 1 deletion cosmos-ems/src/app/employees/employees.component.ts
Original file line number Diff line number Diff line change
@@ -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';

Expand Down Expand Up @@ -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 {

Expand All @@ -56,4 +57,7 @@ export class EmployeesComponent implements OnInit, OnDestroy {
this.message = value;
}

onRouteChange(empId: string) {
this.router.navigate(['empview', empId]);
}
}