added header for worklist

itg-new-design
umasoodch 6 years ago
parent e629aab07a
commit d2fac5c4d5

@ -1106,6 +1106,10 @@ public getMonthNameAr(value: number): string {
public openMyTeamPage() { public openMyTeamPage() {
this.nav.navigateForward(['/my-team/home']); this.nav.navigateForward(['/my-team/home']);
} }
public openPage(link: string) {
this.nav.navigateForward([link]);
}
public static myTeamDetailUrl =['/my-team/details','/my-team/details-2'] public static myTeamDetailUrl =['/my-team/details','/my-team/details-2']
public openMyTeamDetails() { public openMyTeamDetails() {
this.alternateNavigate(CommonService.myTeamDetailUrl,'teamDetail-open',true); this.alternateNavigate(CommonService.myTeamDetailUrl,'teamDetail-open',true);

@ -16,7 +16,8 @@
<app-stats-button <app-stats-button
[title]="button.title" [title]="button.title"
[statsValue]="button.statsValue" [statsValue]="button.statsValue"
[icon]="button.icon"> [icon]="button.icon"
(click)="openStatsButton(button.link)">
</app-stats-button> </app-stats-button>
</ion-slide> </ion-slide>
</ion-slides> </ion-slides>

@ -39,10 +39,6 @@ ion-label{
position: relative; position: relative;
width: 100%; width: 100%;
} }
.header-md:after {
height: 0px !important;
display: none !important;
}
.contentBg:before { .contentBg:before {
position: absolute; position: absolute;
content: ""; content: "";

@ -57,27 +57,32 @@ export class HomePage implements OnInit {
{ {
title: 'Work List', title: 'Work List',
statsValue: 0, statsValue: 0,
icon: 'assets/icon/new-design/work_list.png' icon: 'assets/icon/new-design/work_list.png',
link: '/notification/homepage'
}, },
{ {
title: 'Pending Request', title: 'Pending Request',
statsValue: 13, statsValue: 13,
icon: 'assets/icon/new-design/pending_request.png' icon: 'assets/icon/new-design/pending_request.png',
link: ''
}, },
{ {
title: 'Missing Swipes', title: 'Missing Swipes',
statsValue: 0, statsValue: 0,
icon: 'assets/icon/new-design/missing_swipe.png' icon: 'assets/icon/new-design/missing_swipe.png',
link: ''
}, },
{ {
title: 'Leave Balance', title: 'Leave Balance',
statsValue: 0, statsValue: 0,
icon: 'assets/icon/new-design/leave_balance.png' icon: 'assets/icon/new-design/leave_balance.png',
link: ''
}, },
{ {
title: 'Ticket Balance', title: 'Ticket Balance',
statsValue: 0, statsValue: 0,
icon: 'assets/icon/new-design/ticket_balance.png' icon: 'assets/icon/new-design/ticket_balance.png',
link: ''
} }
]; ];
@ -596,6 +601,11 @@ export class HomePage implements OnInit {
this.common.openProfile(); this.common.openProfile();
} }
openStatsButton(link: string) {
console.log(link);
this.common.openPage(link);
}
} }

@ -1,12 +1,27 @@
<ion-header> <!-- <ion-header>
<ion-toolbar class="header-toolbar"> <ion-toolbar class="header-toolbar">
<ion-title color="light"> {{ts.trPK('home','worklist')}}</ion-title> <ion-title color="light"> {{ts.trPK('home','worklist')}}</ion-title>
<ion-buttons slot="start"> <ion-buttons slot="start">
<nav-buttons backLink="/home"></nav-buttons> <nav-buttons backLink="/home"></nav-buttons>
</ion-buttons> </ion-buttons>
</ion-toolbar> </ion-toolbar>
</ion-header> -->
<ion-header>
<ion-toolbar class="header-toolbar-new">
<ion-buttons slot="start">
<nav-buttons backLink="/home"></nav-buttons>
</ion-buttons>
<ion-title>WORK LIST</ion-title>
<div class="profile-image-container" (click)="openProfilePage()">
<img [src]="userImage"/>
</div>
</ion-toolbar>
</ion-header> </ion-header>
<ion-content> <ion-content>
<div class="contentBg">
<div class="result-graph"> <div class="result-graph">
<div class="request-heading"> <div class="request-heading">
<span>Open Request Analysis</span> <span>Open Request Analysis</span>
@ -70,4 +85,5 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</ion-content> </ion-content>

@ -220,6 +220,43 @@ ion-input ,ion-datetime{
///////////////////////////////////////////NEW DESIGN///////////////////////////////////// ///////////////////////////////////////////NEW DESIGN/////////////////////////////////////
.header-toolbar-new{
--background: #22c6b3;
}
.profile-image-container{
position: relative;
z-index: 999;
img {
width: 32px;
float: right;
border-radius: 20px;
height: 32px;
margin-right: 10px;
}
}
ion-title{
color: white;
position: absolute;
top: 0;
text-align: center;
left: 15%;
right: 15%;
font-size: 0.42cm;
font-weight: bold;
height: 100%;
}
.contentBg:before {
position: absolute;
content: "";
background: #22c6b3;
height: 140px;
width: 100%;
left: 0;
top: 0px;
z-index: 1;
}
ion-content { ion-content {
--ion-background-color: whitesmoke; --ion-background-color: whitesmoke;
} }
@ -240,6 +277,7 @@ ion-content {
margin-top: 20px; margin-top: 20px;
padding-bottom: 20px; padding-bottom: 20px;
border-radius: 20px; border-radius: 20px;
z-index: 1;
} }
.result-text-container { .result-text-container {
padding: 0; padding: 0;
@ -269,10 +307,10 @@ ion-content {
max-height: 4cm; max-height: 4cm;
} }
// .swiper-container { .swiper-container {
// margin: 0 !important; margin: 0 !important;
// width: 100% !important; width: 100% !important;
// } }
.filters-row { .filters-row {
margin-top: 10px; margin-top: 10px;
margin-left: 20px; margin-left: 20px;
@ -282,6 +320,7 @@ ion-content {
padding-left: 60px; padding-left: 60px;
clear: both; clear: both;
min-height: 200px; min-height: 200px;
margin-bottom: 80px;
} }
.work-list-container:before{ .work-list-container:before{
content: ""; content: "";

@ -9,6 +9,8 @@ import { WorklistService } from '../service/worklist.service';
import { IonInfiniteScroll } from '@ionic/angular'; import { IonInfiniteScroll } from '@ionic/angular';
import { WorklistMainService } from '../service/work-list.main.service'; import { WorklistMainService } from '../service/work-list.main.service';
import { WorklistAdvancedSearchComponent } from '../worklist-advanced-search/worklist-advanced-search.component'; import { WorklistAdvancedSearchComponent } from '../worklist-advanced-search/worklist-advanced-search.component';
import { AuthenticatedUser } from 'src/app/hmg-common/services/authentication/models/authenticated-user';
@Component({ @Component({
selector: 'app-home', selector: 'app-home',
templateUrl: './home.component.html', templateUrl: './home.component.html',
@ -46,9 +48,6 @@ export class HomeComponent implements OnInit {
public isSearch: boolean = false; public isSearch: boolean = false;
public direction = 'ltr'; public direction = 'ltr';
public options = { public options = {
cutoutPercentage: 80, cutoutPercentage: 80,
tooltips: { enabled: false }, tooltips: { enabled: false },
@ -133,6 +132,10 @@ constructor(
this.WorkListObj.P_PAGE_LIMIT = 50; //number this.WorkListObj.P_PAGE_LIMIT = 50; //number
} }
public userData: any;
public userImage: any = '../assets/imgs/profile.png';
activeFilter(index: number) { activeFilter(index: number) {
for (const filter of this.filters) { for (const filter of this.filters) {
filter.active = false; filter.active = false;
@ -140,6 +143,9 @@ constructor(
this.filters[index].active = true; this.filters[index].active = true;
} }
openProfilePage() {
this.common.openProfile();
}
async openSearchModal() { async openSearchModal() {
console.log('umar786'); console.log('umar786');
@ -175,6 +181,8 @@ constructor(
ngOnInit() { ngOnInit() {
// this.direction = TranslatorService.getCurrentDirection(); // this.direction = TranslatorService.getCurrentDirection();
this.userData = this.common.sharedService.getSharedData(AuthenticatedUser.SHARED_DATA, false);
this.userImage = this.userData.EMPLOYEE_IMAGE ? 'data:image/png;base64,' + this.userData.EMPLOYEE_IMAGE : this.userImage;
} }
ionViewDidLoad() { ionViewDidLoad() {
// this.navBar.backButtonClick = () => { // this.navBar.backButtonClick = () => {

@ -994,6 +994,10 @@ border:0px
} }
.alert-button-inner.sc-ion-alert-md { .alert-button-inner.sc-ion-alert-md {
justify-content: center !important; justify-content: center !important;
} }
.header-md:after {
height: 0px !important;
display: none !important;
}

Loading…
Cancel
Save