added employee leaves calendar
parent
081fea13a7
commit
874b9951be
@ -0,0 +1,27 @@
|
|||||||
|
<div class="team-member-container">
|
||||||
|
<ion-row>
|
||||||
|
<ion-col [size]="3" (click)="getDetails()">
|
||||||
|
<div class="user-image-container">
|
||||||
|
<div class="user-image">
|
||||||
|
<img [src]="employeeImage" alt="Team Member Image"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</ion-col>
|
||||||
|
<ion-col [size]="9" style="padding: 8px 5px 0px;margin-top: 14px;">
|
||||||
|
<div>
|
||||||
|
<span [ngClass]=" direction == 'en'? 'employee-name' : 'employee-name-ar'" (click)="getDetails()">
|
||||||
|
<h2 class="name">{{name}}</h2>
|
||||||
|
<span class="title">{{title}}</span>
|
||||||
|
</span>
|
||||||
|
<a [ngClass]="employeePhoneNumber == '' ? 'disable-phone image-container' : 'image-container'" href="tel:{{employeePhoneNumber}}">
|
||||||
|
<!-- <img src="../assets/imgs/green_call_icon.png" > -->
|
||||||
|
<img src="../assets/imgs/call.svg" >
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<!-- <div class="swipe-information">
|
||||||
|
<span class="check-in"><strong>Check-In:</strong> {{checkIn}}</span>
|
||||||
|
<span><strong>Check-Out:</strong> {{checkOut}}</span>
|
||||||
|
</div> -->
|
||||||
|
</ion-col>
|
||||||
|
</ion-row>
|
||||||
|
</div>
|
||||||
@ -0,0 +1,122 @@
|
|||||||
|
.team-member-container {
|
||||||
|
|
||||||
|
background: white;
|
||||||
|
/* margin-top: 2px; */
|
||||||
|
font-family: WorkSans-Regular;
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
border-radius: 15px;
|
||||||
|
padding-bottom: 5px;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
box-shadow: 0px 1px 5px #cdcdcd;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-image {
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
|
||||||
|
border-radius: 30px;
|
||||||
|
margin: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.employee-name {
|
||||||
|
display: inline-block;
|
||||||
|
width: 80%;
|
||||||
|
|
||||||
|
.name {
|
||||||
|
|
||||||
|
font-size: 16px;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
margin-left: -10px;
|
||||||
|
margin-top: -5px;
|
||||||
|
text-align: left;
|
||||||
|
font-weight: bold;
|
||||||
|
line-height: 25px;
|
||||||
|
letter-spacing: -0.64px;
|
||||||
|
color: #2B353E;
|
||||||
|
opacity: 1;
|
||||||
|
font-family: 'Inter' !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
|
||||||
|
font-family: 'Inter' !important;
|
||||||
|
line-height: 12px;
|
||||||
|
letter-spacing: -0.56px;
|
||||||
|
color: #575757;
|
||||||
|
opacity: 1;
|
||||||
|
font-size: 14px;
|
||||||
|
width: 100%;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
// overflow: hidden;
|
||||||
|
display: block;
|
||||||
|
margin-left: -10px;
|
||||||
|
margin-top: -10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.employee-name-ar {
|
||||||
|
display: inline-block;
|
||||||
|
width: 80%;
|
||||||
|
|
||||||
|
.name {
|
||||||
|
font-size: 16px;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
margin-left: -10px;
|
||||||
|
margin-top: -5px;
|
||||||
|
text-align: right;
|
||||||
|
font-family: 'Inter' !important;
|
||||||
|
line-height: 25px;
|
||||||
|
letter-spacing: -0.64px;
|
||||||
|
color: #2B353E;
|
||||||
|
opacity: 1;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
|
||||||
|
font-family: 'Inter' !important;
|
||||||
|
line-height: 12px;
|
||||||
|
letter-spacing: -0.56px;
|
||||||
|
color: #575757;
|
||||||
|
opacity: 1;
|
||||||
|
font-size: 14px;
|
||||||
|
width: 100%;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
// overflow: hidden;
|
||||||
|
display: block;
|
||||||
|
margin-left: -10px;
|
||||||
|
margin-top: -10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.image-container {
|
||||||
|
width: 20%;
|
||||||
|
display: inline-block;
|
||||||
|
text-align: center;
|
||||||
|
vertical-align: top;
|
||||||
|
margin-top: 5px;
|
||||||
|
position: relative;
|
||||||
|
top: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.swipe-information {
|
||||||
|
color: #888;
|
||||||
|
font-size: 12px;
|
||||||
|
border-top: 1px solid #ccc;
|
||||||
|
padding-top: 6px;
|
||||||
|
margin-top: 6px;
|
||||||
|
|
||||||
|
.check-in {
|
||||||
|
font-size: 12px;
|
||||||
|
margin-right: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,27 @@
|
|||||||
|
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
||||||
|
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { EmployeeHierarchyCardComponent } from './employee-hierarchy-card.component';
|
||||||
|
|
||||||
|
describe('EmployeeHierarchyCardComponent', () => {
|
||||||
|
let component: EmployeeHierarchyCardComponent;
|
||||||
|
let fixture: ComponentFixture<EmployeeHierarchyCardComponent>;
|
||||||
|
|
||||||
|
beforeEach(async(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
declarations: [ EmployeeHierarchyCardComponent ],
|
||||||
|
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
}));
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
fixture = TestBed.createComponent(EmployeeHierarchyCardComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
@ -0,0 +1,25 @@
|
|||||||
|
<app-generic-header
|
||||||
|
showBack="true"
|
||||||
|
backLink="/home"
|
||||||
|
[headerText]="'myTeam, employee-hierarchy' | translate">
|
||||||
|
</app-generic-header>
|
||||||
|
|
||||||
|
|
||||||
|
<ion-content>
|
||||||
|
<div class="contentBg">
|
||||||
|
<!-- <ng-container *ngFor="let subordinate of empSubordinate;let i=index">
|
||||||
|
<app-employee-information
|
||||||
|
[name]="subordinate.EMPLOYEE_NAME"
|
||||||
|
[title]="subordinate.POSITION_NAME"
|
||||||
|
[employeeImage]="subordinate.EMPLOYEE_IMAGE ? 'data:image/png;base64,'+subordinate.EMPLOYEE_IMAGE : '../assets/imgs/profile.png'"
|
||||||
|
[employeePhoneNumber]="subordinate.EMPLOYEE_MOBILE_NUMBER"
|
||||||
|
(onGetDetails)="getDetails(i)">
|
||||||
|
</app-employee-information>
|
||||||
|
</ng-container> -->
|
||||||
|
</div>
|
||||||
|
</ion-content>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -0,0 +1,27 @@
|
|||||||
|
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
||||||
|
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { EmployeeHierarchyComponent } from './employee-hierarchy.component';
|
||||||
|
|
||||||
|
describe('EmployeeHierarchyComponent', () => {
|
||||||
|
let component: EmployeeHierarchyComponent;
|
||||||
|
let fixture: ComponentFixture<EmployeeHierarchyComponent>;
|
||||||
|
|
||||||
|
beforeEach(async(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
declarations: [ EmployeeHierarchyComponent ],
|
||||||
|
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
}));
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
fixture = TestBed.createComponent(EmployeeHierarchyComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
@ -0,0 +1,24 @@
|
|||||||
|
import { Component, OnInit } from '@angular/core';
|
||||||
|
import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
|
||||||
|
import { CommonService } from 'src/app/hmg-common/services/common/common.service';
|
||||||
|
import { AuthenticationService } from 'src/app/hmg-common/services/authentication/authentication.service';
|
||||||
|
import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response';
|
||||||
|
import { MyTeamService } from '../service/my-team.service';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-employee-hierarchy',
|
||||||
|
templateUrl: './employee-hierarchy.component.html',
|
||||||
|
styleUrls: ['./employee-hierarchy.component.scss'],
|
||||||
|
})
|
||||||
|
export class EmployeeHierarchyComponent implements OnInit {
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
public ts: TranslatorService,
|
||||||
|
public authService: AuthenticationService,
|
||||||
|
public common: CommonService,
|
||||||
|
public myTeamService: MyTeamService
|
||||||
|
) { }
|
||||||
|
|
||||||
|
ngOnInit() {}
|
||||||
|
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue