enads work from umar machine

MOHEMM-Q3-DEV-LATEST
umasoodch 5 years ago
parent b2d06f40bf
commit e287b6a215

@ -37,12 +37,13 @@
</div>
</ion-footer> -->
<ion-content>
<ion-content dir="ltr">
<ion-grid>
<ion-row>
<ion-col size="2"></ion-col>
<ion-col size="10" *ngIf="userInfo.EMPLOYEE_IMAGE != null" padding>
<img [src]="'data:image/png;base64,'+userInfo.EMPLOYEE_IMAGE" style="width: 75%; height: 100%; border: 3px solid black;">
<ion-col size="3"></ion-col>
<ion-col size="9" *ngIf="userInfo.EMPLOYEE_IMAGE != null" padding>
<img *ngIf="userInfo.EMPLOYEE_IMAGE != null" [src]="'data:image/png;base64,'+userInfo.EMPLOYEE_IMAGE" style="width: 60%; height: 100%; border: 3px solid black;">
<img *ngIf="userInfo.EMPLOYEE_IMAGE == null" src="../assets/imgs/profilePic.png" style="width: 60%; height: 100%; border: 3px solid black;">
</ion-col>
</ion-row>
<ion-row style="padding: 0%;">
@ -50,5 +51,31 @@
<p style="font-size: 20px; padding: 0%;">191817</p>
</ion-col>
</ion-row>
<ion-row>
<ion-col style="text-align: center;font-weight: bold;font-family: 'WorkSans-Bold'; padding: 0%;">
<p style="font-size: 20px; padding: 0%;">Enad Hilal Ahmed</p>
</ion-col>
</ion-row>
<ion-row style="padding: 0%;">
<ion-col style="text-align: center;font-weight: bold;font-family: 'WorkSans-Bold'; padding: 0%;">
<p style="font-size: 15px; padding: 0%;">Mobile Developer</p>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<img style="width: 50%; max-width: 100%; margin-left: 16%;" src="../assets/imgs/HMG_LOGO.png">
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<img style="width: 50%; max-width: 100%; margin-left: 25%;" [src]="userInfo.EmployeeQR">
</ion-col>
</ion-row>
</ion-grid>
</ion-content>
</ion-content>
<ion-footer>
<div class="centerDiv" style="margin-top: 20px !important;">
<ion-button class="button-login" (click)="dismiss()"><b>{{ts.trPK('general','close')}}</b></ion-button>
</div>
</ion-footer>

@ -12,26 +12,26 @@
class="ion-segment-all">
<ion-segment-button value="item-req"
[ngClass]="activeSegment == 'item-req' ? 'active-Segment' : 'normal-Segment'">
<ion-label class="no-padding-label margin-left">{{'worklistMain , itemReq'| translate}}</ion-label>
<ion-segment-button value="info"
[ngClass]="activeSegment == 'info' ? 'active-Segment' : 'normal-Segment'">
<ion-label class="no-padding-label margin-left">{{'worklistMain , info'| translate}}</ion-label>
</ion-segment-button>
<ion-segment-button value="action-history"
[ngClass]="activeSegment == 'action-history' ? 'active-Segment' : 'normal-Segment'">
<ion-label class="no-padding-label"> {{'worklistMain, action' | translate}}</ion-label>
<ion-segment-button value="item-req"
[ngClass]="activeSegment == 'item-req' ? 'active-Segment' : 'normal-Segment'">
<ion-label class="no-padding-label">{{'worklistMain , itemReq'| translate}}</ion-label>
</ion-segment-button>
<ion-segment-button value="attach" [ngClass]="activeSegment == 'attach' ? 'active-Segment' : 'normal-Segment'">
<ion-segment-button value="action-history" [ngClass]="activeSegment == 'action-history' ? 'active-Segment' : 'normal-Segment'">
<ion-label class="no-padding-label">
{{'worklistMain, attach-file' | translate}}
{{'worklistMain, action' | translate}}
</ion-label>
</ion-segment-button>
<ion-segment-button value="info" [ngClass]="activeSegment == 'info' ? 'active-Segment' : 'normal-Segment'">
<ion-label class="no-padding-label"> {{'worklistMain , info'| translate}}</ion-label>
<ion-segment-button value="attach " [ngClass]="activeSegment == 'attach' ? 'active-Segment' : 'normal-Segment'">
<ion-label class="no-padding-label">{{'worklistMain, attach-file' | translate}} </ion-label>
</ion-segment-button>
</ion-segment>
@ -39,6 +39,163 @@
<ion-slides #slides (ionSlideDidChange)="slideChanged($event)">
<ion-slide>
<ng-container *ngIf="activeSegment === 'info'">
<ion-grid>
<ion-row>
<ion-col>
<div *ngIf="pInformation && pInformation != '' " class="tipsPadding">{{pInformation}}</div>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<ion-card class="cardContent" style="width: 90% !important;">
<!-- <ion-card-header class="boxHdr">
<div class="hrTitle"> {{ts.trPK('worklistMain','info')}} </div>
</ion-card-header> -->
<ion-card-content>
<ion-grid style="text-align: left">
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for=""> {{ts.trPK('worklistMain','from')}}
</label>
<br />
<!-- </ion-col>
<ion-col> -->
<label for="">{{getPassNotificationDetails.FROM_USER}}</label>
</ion-col>
<ion-col>
<label class="colItemReq" for="">{{ts.trPK('worklistMain','to')}}
</label>
<br />
<!-- </ion-col>
<ion-col> -->
<label for=""> {{getPassNotificationDetails.TO_USER}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','sent')}}
</label>
<br />
<!-- </ion-col>
<ion-col> -->
<label for="">{{getPassNotificationDetails.BEGIN_DATE}}</label>
</ion-col>
<ion-col>
<label class="colItemReq" for="">{{ts.trPK('worklistMain','closed')}}
</label>
<br />
<!-- </ion-col>
<ion-col> -->
<label for="">{{getPassNotificationDetails.END_DATE}}</label>
</ion-col>
</ion-row>
<!-- <ion-row>
</ion-row> -->
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','id')}}
</label>
<br />
<!-- </ion-col>
<ion-col> -->
<label for="">{{getPassNotificationDetails.NOTIFICATION_ID}}</label>
</ion-col>
<ion-col *ngIf=" getPassNotificationDetails.RESPONDER == '' ">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','responder')}}
</label>
<br />
<!-- </ion-col>
<ion-col> -->
<label for="">{{getPassNotificationDetails.RESPONDER}} </label>
</ion-col>
</ion-row>
<!-- <ion-row *ngIf=" getPassNotificationDetails.RESPONDER != '' ">
</ion-row> -->
<ion-row>
<ion-col>
<label class="colItemReq" for="">{{ts.trPK('worklistMain','subject')}} </label>
<br />
<!-- </ion-col>
<ion-col> -->
<label for="">{{getPassNotificationDetails.SUBJECT}} </label>
</ion-col>
</ion-row>
<!-- notificationBodyRes -->
<div *ngFor="let header of PRHeader">
<ion-row
*ngIf="header.HDR_ATTRIBUTE_NAME != 'Requisition Total' && header.HDR_ATTRIBUTE_NAME != 'Non-Recoverable Tax'">
<!-- *ngIf="header.HDR_ATTRIBUTE_NAME != 'Requisition Total' && header.HDR_ATTRIBUTE_NAME != 'Non-Recoverable Tax'"> -->
<ion-col>
<label class="colItemReq" for="">{{header.HDR_ATTRIBUTE_NAME}} </label>
<br />
<label for="">{{header.HDR_ATTRIBUTE_VALUE}} </label>
</ion-col>
</ion-row>
</div>
<br />
<ion-grid>
<div>
<ion-row style="text-align: center !important">
<ion-col *ngIf="totalH">
<div class="colItemReq" style="text-align: center !important">{{totalH}}</div>
<div class="labelTotal">{{valueH}}</div>
</ion-col>
<ion-col *ngIf="taxH ">
<div class="colItemReq" style="text-align: center !important">{{taxH}}</div>
<div class="labelTotal">{{taxvalueH}}</div>
</ion-col>
</ion-row>
</div>
</ion-grid>
</ion-grid>
<button ion-button *ngIf="!IsReachEnd" class="itemHISBtn" (click)="loadMoreNotificationBody()">
{{ 'general, load-more' | translate}}
</button>
</ion-card-content>
</ion-card>
</ion-col>
</ion-row>
</ion-grid>
</ng-container>
</ion-slide>
<ion-slide>
<ng-container *ngIf="activeSegment === 'item-req'">
<!-- <ion-card class="cardContent">
@ -408,162 +565,6 @@
</ng-container>
</ion-slide>
<ion-slide>
<ng-container *ngIf="activeSegment === 'info'">
<ion-grid>
<ion-row>
<ion-col>
<div *ngIf="pInformation && pInformation != '' " class="tipsPadding">{{pInformation}}</div>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<ion-card class="cardContent" style="width: 90% !important;">
<!-- <ion-card-header class="boxHdr">
<div class="hrTitle"> {{ts.trPK('worklistMain','info')}} </div>
</ion-card-header> -->
<ion-card-content>
<ion-grid style="text-align: left">
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for=""> {{ts.trPK('worklistMain','from')}}
</label>
<br />
<!-- </ion-col>
<ion-col> -->
<label for="">{{getPassNotificationDetails.FROM_USER}}</label>
</ion-col>
<ion-col>
<label class="colItemReq" for="">{{ts.trPK('worklistMain','to')}}
</label>
<br />
<!-- </ion-col>
<ion-col> -->
<label for=""> {{getPassNotificationDetails.TO_USER}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','sent')}}
</label>
<br />
<!-- </ion-col>
<ion-col> -->
<label for="">{{getPassNotificationDetails.BEGIN_DATE}}</label>
</ion-col>
<ion-col>
<label class="colItemReq" for="">{{ts.trPK('worklistMain','closed')}}
</label>
<br />
<!-- </ion-col>
<ion-col> -->
<label for="">{{getPassNotificationDetails.END_DATE}}</label>
</ion-col>
</ion-row>
<!-- <ion-row>
</ion-row> -->
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','id')}}
</label>
<br />
<!-- </ion-col>
<ion-col> -->
<label for="">{{getPassNotificationDetails.NOTIFICATION_ID}}</label>
</ion-col>
<ion-col *ngIf=" getPassNotificationDetails.RESPONDER == '' ">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','responder')}}
</label>
<br />
<!-- </ion-col>
<ion-col> -->
<label for="">{{getPassNotificationDetails.RESPONDER}} </label>
</ion-col>
</ion-row>
<!-- <ion-row *ngIf=" getPassNotificationDetails.RESPONDER != '' ">
</ion-row> -->
<ion-row>
<ion-col>
<label class="colItemReq" for="">{{ts.trPK('worklistMain','subject')}} </label>
<br />
<!-- </ion-col>
<ion-col> -->
<label for="">{{getPassNotificationDetails.SUBJECT}} </label>
</ion-col>
</ion-row>
<!-- notificationBodyRes -->
<div *ngFor="let header of PRHeader">
<ion-row
*ngIf="header.HDR_ATTRIBUTE_NAME != 'Requisition Total' && header.HDR_ATTRIBUTE_NAME != 'Non-Recoverable Tax'">
<!-- *ngIf="header.HDR_ATTRIBUTE_NAME != 'Requisition Total' && header.HDR_ATTRIBUTE_NAME != 'Non-Recoverable Tax'"> -->
<ion-col>
<label class="colItemReq" for="">{{header.HDR_ATTRIBUTE_NAME}} </label>
<br />
<label for="">{{header.HDR_ATTRIBUTE_VALUE}} </label>
</ion-col>
</ion-row>
</div>
<br />
<ion-grid>
<div>
<ion-row style="text-align: center !important">
<ion-col *ngIf="totalH">
<div class="colItemReq" style="text-align: center !important">{{totalH}}</div>
<div class="labelTotal">{{valueH}}</div>
</ion-col>
<ion-col *ngIf="taxH ">
<div class="colItemReq" style="text-align: center !important">{{taxH}}</div>
<div class="labelTotal">{{taxvalueH}}</div>
</ion-col>
</ion-row>
</div>
</ion-grid>
</ion-grid>
<button ion-button *ngIf="!IsReachEnd" class="itemHISBtn" (click)="loadMoreNotificationBody()">
{{ 'general, load-more' | translate}}
</button>
</ion-card-content>
</ion-card>
</ion-col>
</ion-row>
</ion-grid>
</ng-container>
</ion-slide>
</ion-slides>

@ -111,4 +111,27 @@
.margin-left {
margin-left: 30px;
}
}
.active-Segment {
font-size: 0.3cm !important;
background: #269DB8 !important;
text-transform: none;
--color-checked: none;
border-radius: 100px;
border:0;
}
.active-Segment ion-label{
font-size: 11px;
color: white !important;
}
.normal-Segment ion-label{
color: black !important;
font-size: 11px;
}
.normal-Segment {
font-size: 0.3cm !important;
text-transform: none;
--color-checked: none;
border: 0;
}

@ -93,7 +93,7 @@ export class WorklistMainMRComponent implements OnInit {
confirmMsg: string;
delMsg: string;
closeMsg: string;
activeSegment: any = 'item-req';
activeSegment: any = 'info';
lines_note_limit: any = 24;
orgNote: string;
truncating: boolean;
@ -148,19 +148,19 @@ export class WorklistMainMRComponent implements OnInit {
public segmentChanged(event: any) {
this.activeSegment = event.detail.value;
if(this.activeSegment === 'item-req')
if(this.activeSegment === 'info')
{
this.slides.slideTo(0);
}
else if(this.activeSegment === 'action-history')
else if(this.activeSegment === 'item-req')
{
this.slides.slideTo(1);
}
else if(this.activeSegment === 'attach')
else if(this.activeSegment === 'action-history')
{
this.slides.slideTo(2);
}
else if(this.activeSegment === 'info')
else if(this.activeSegment === 'attach')
{
this.slides.slideTo(3);
}
@ -173,19 +173,19 @@ export class WorklistMainMRComponent implements OnInit {
console.log(event);
if(index === 0)
{
this.activeSegment = 'item-req';
this.activeSegment = 'info';
}
else if(index === 1)
{
this.activeSegment = 'action-history';
this.activeSegment = 'item-req';
}
else if(index === 2)
{
this.activeSegment = 'attach';
this.activeSegment = 'action-history';
}
else if(index === 3)
{
this.activeSegment = 'info';
this.activeSegment = 'attach';
}
console.log(this.activeSegment);
});

@ -114,4 +114,27 @@
.margin-left {
margin-left: 30px;
}
}
.active-Segment {
font-size: 0.3cm !important;
background: #269DB8 !important;
text-transform: none;
--color-checked: none;
border-radius: 100px;
border:0;
}
.active-Segment ion-label{
font-size: 11px;
color: white !important;
}
.normal-Segment ion-label{
color: black !important;
font-size: 11px;
}
.normal-Segment {
font-size: 0.3cm !important;
text-transform: none;
--color-checked: none;
border: 0;
}

@ -10,10 +10,16 @@
<ion-segment mode="md" color="secondary" (ionChange)="segmentChanged($event)" [value]="activeSegment"
class="ion-segment-all">
<ion-segment-button value="item-req"
<ion-segment-button value="info"
[ngClass]="activeSegment == 'info' ? 'active-Segment' : 'normal-Segment'">
<ion-label class="no-padding-label margin-left">{{'worklistMain, info'| translate}}</ion-label>
</ion-segment-button>
<ion-segment-button checked value="item-req"
[ngClass]="activeSegment == 'item-req' ? 'active-Segment' : 'normal-Segment'">
<ion-label class="no-padding-label margin-left"> {{'worklistMain, itemReq'| translate}} </ion-label>
<ion-label class="no-padding-label"> {{'worklistMain, itemReq'| translate}} </ion-label>
</ion-segment-button>
<ion-segment-button value="action-history"
[ngClass]="activeSegment == 'action-history' ? 'active-Segment' : 'normal-Segment'">
<ion-label class="no-padding-label"> {{'worklistMain, action' | translate}} </ion-label>
@ -25,24 +31,120 @@
</ion-label>
</ion-segment-button>
<ion-segment-button checked value="info"
[ngClass]="activeSegment == 'info' ? 'active-Segment' : 'normal-Segment'">
<ion-label class="no-padding-label"> {{'worklistMain, info'| translate}} </ion-label>
</ion-segment-button>
</ion-segment>
<ion-slides #slides (ionSlideDidChange)="slideChanged($event)">
<ion-slide>
<ng-container *ngIf="activeSegment === 'info'">
<ion-grid>
<ion-row>
<ion-col>
<div *ngIf="pInformation && pInformation != '' " class="tipsPadding">{{pInformation}}
</div>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<ion-card class="cardContent" style="width: 90% !important;">
<ion-card-content>
<ion-grid style="text-align: left">
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for=""> {{ts.trPK('worklistMain','from')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.FROM_USER}}</label>
</ion-col>
<ion-col>
<label class="colItemReq" for="">{{ts.trPK('worklistMain','to')}}
</label>
<br />
<label for=""> {{getPassNotificationDetails.TO_USER}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','sent')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.BEGIN_DATE}}</label>
</ion-col>
<ion-col>
<label class="colItemReq"
for="">{{ts.trPK('worklistMain','closed')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.END_DATE}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','id')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.NOTIFICATION_ID}}</label>
</ion-col>
<ion-col>
<label class="colItemReq"
for="">{{ts.trPK('worklistMain','responder')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.RESPONDER}} </label>
</ion-col>
</ion-row>
<div *ngFor="let header of PRHeader">
<ion-row
*ngIf="header.HDR_ATTRIBUTE_NAME != 'Requisition Total' && header.HDR_ATTRIBUTE_NAME != 'Non-Recoverable Tax'">
<ion-col>
<label class="colItemReq" for="">{{header.HDR_ATTRIBUTE_NAME}}
</label>
<br />
<label for="">{{header.HDR_ATTRIBUTE_VALUE}} </label>
</ion-col>
</ion-row>
</div>
<br />
<ion-grid>
<div>
<ion-row style="text-align: center !important">
<ion-col *ngIf="totalH">
<div class="colItemReq"
style="text-align: center !important">{{totalH}}</div>
<div class="">{{valueH}}</div>
</ion-col>
<ion-col *ngIf="taxH ">
<div class="colItemReq"
style="text-align: center !important">{{taxH}}</div>
<div class="">{{taxvalueH}}</div>
</ion-col>
</ion-row>
</div>
</ion-grid>
</ion-grid>
<button *ngIf="!IsReachEnd" ion-button class="itemHISBtn"
(click)="loadMoreNotificationBody()">
{{ 'general, load-more' | translate}}
</button>
</ion-card-content>
</ion-card>
</ion-col>
</ion-row>
</ion-grid>
</ng-container>
</ion-slide>
<ion-slide>
<ng-container *ngIf="activeSegment === 'item-req'">
<div [hidden]="PRLines && PRLines.length > 0">
<p>{{ 'general, empty' | translate}}</p>
</div>
<accordin-custom style="width: 90%;">
<accordin-tab-custom *ngFor="let Lines of PRLines; let i=index;" [header]="Lines.DESCRIPTION" [show]="i === 0 ? true: false">
<div class="itemReqDiv" style="width: 100% !important;">
<accordin-tab-custom *ngFor="let Lines of PRLines; let i=index;" [header]="Lines.DESCRIPTION"
[show]="i === 0 ? true: false">
<div class="itemReqDiv" style="width: 100% !important;">
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' " class="colItems">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' "
class="colItems">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','cost-center')}}
</label>
<br />
@ -55,7 +157,8 @@
</ion-col>
</ion-row>
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' " class="colItems ">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' "
class="colItems ">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','unit')}} </label>
<br />
<ion-label class="labelValue" for="">{{Lines.UOM}} </ion-label>
@ -68,7 +171,8 @@
</ion-col>
</ion-row>
<ion-row class="rowBorder">
<ion-col class="colItems" [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<ion-col class="colItems"
[ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for="">{{ts.trPK('payslip','amount')}} ({{ 'general, sar' |
translate}})</label>
<br />
@ -138,8 +242,8 @@
<ion-label
[ngClass]="{'bg-blue-txt' : actionHistory.ACTION_CODE === 'SUBMIT' ,'bg-orange-txt' : actionHistory.ACTION_CODE === 'PENDING' ,'bg-red-txt' : actionHistory.ACTION_CODE === 'REJECT','bg-green-txt' : actionHistory.ACTION_CODE != 'PENDING' && actionHistory.ACTION_CODE != 'REJECT' && actionHistory.ACTION_CODE != 'SUBMIT'}"
class=""> {{actionHistory.ACTION}}</ion-label>
<ion-label *ngIf="actionHistory.NOTIFICATION_DATE != ''"
class="dateActionHistory">
{{actionHistory.NOTIFICATION_DATE| dateString }} </ion-label>
@ -155,123 +259,31 @@
</ng-container>
</ion-slide>
<ion-slide>
<ng-container *ngIf="activeSegment === 'attach'">
<ion-card class="cardContent" style="width: 100% !important;">
<ion-card-content>
<div class="noDataDiv" [hidden]="attachmentRes && attachmentRes.length > 0">
<p>{{ 'general, notAttch' | translate}}</p>
</div>
<div *ngIf="attachmentRes && attachmentRes.length > 0 ">
<ion-grid>
<ion-item class="itemAttch" *ngFor="let attachList of attachmentRes ; let i=index;">
<ion-label style="color: black !important">
{{i+1}}. {{attachList.FILE_NAME}} </ion-label>
<button float-end class="attachImgBtn"
(click)="OpenAttachFiles(attachList.FILE_DATA,attachList.FILE_CONTENT_TYPE)">
<img class="attachImg" src="../assets/imgs/view.png">
</button>
</ion-item>
</ion-grid>
</div>
</ion-card-content>
</ion-card>
</ng-container>
</ion-slide>
<ion-slide>
<ng-container *ngIf="activeSegment === 'info'">
<ion-grid>
<ion-row>
<ion-col>
<div *ngIf="pInformation && pInformation != '' " class="tipsPadding">{{pInformation}}</div>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<ion-card class="cardContent" style="width: 90% !important;">
<ion-card-content>
<ion-grid style="text-align: left">
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for=""> {{ts.trPK('worklistMain','from')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.FROM_USER}}</label>
</ion-col>
<ion-col>
<label class="colItemReq" for="">{{ts.trPK('worklistMain','to')}}
</label>
<br />
<label for=""> {{getPassNotificationDetails.TO_USER}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','sent')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.BEGIN_DATE}}</label>
</ion-col>
<ion-col>
<label class="colItemReq" for="">{{ts.trPK('worklistMain','closed')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.END_DATE}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','id')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.NOTIFICATION_ID}}</label>
</ion-col>
<ion-col>
<label class="colItemReq" for="">{{ts.trPK('worklistMain','responder')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.RESPONDER}} </label>
</ion-col>
</ion-row>
<div *ngFor="let header of PRHeader">
<ion-row
*ngIf="header.HDR_ATTRIBUTE_NAME != 'Requisition Total' && header.HDR_ATTRIBUTE_NAME != 'Non-Recoverable Tax'">
<ion-col>
<label class="colItemReq" for="">{{header.HDR_ATTRIBUTE_NAME}} </label>
<br />
<label for="">{{header.HDR_ATTRIBUTE_VALUE}} </label>
</ion-col>
</ion-row>
</div>
<br />
<ion-grid>
<div>
<ion-row style="text-align: center !important">
<ion-col *ngIf="totalH">
<div class="colItemReq" style="text-align: center !important">{{totalH}}</div>
<div class="">{{valueH}}</div>
</ion-col>
<ion-col *ngIf="taxH ">
<div class="colItemReq" style="text-align: center !important">{{taxH}}</div>
<div class="">{{taxvalueH}}</div>
</ion-col>
</ion-row>
</div>
</ion-grid>
<ng-container *ngIf="activeSegment === 'attach'">
<ion-card class="cardContent" style="width: 100% !important;">
<ion-card-content>
<div class="noDataDiv" [hidden]="attachmentRes && attachmentRes.length > 0">
<p>{{ 'general, notAttch' | translate}}</p>
</div>
<div *ngIf="attachmentRes && attachmentRes.length > 0 ">
<ion-grid>
<ion-item class="itemAttch" *ngFor="let attachList of attachmentRes ; let i=index;">
<ion-label style="color: black !important">
{{i+1}}. {{attachList.FILE_NAME}} </ion-label>
<button float-end class="attachImgBtn"
(click)="OpenAttachFiles(attachList.FILE_DATA,attachList.FILE_CONTENT_TYPE)">
<img class="attachImg" src="../assets/imgs/view.png">
</button>
</ion-item>
</ion-grid>
<button *ngIf="!IsReachEnd" ion-button class="itemHISBtn" (click)="loadMoreNotificationBody()">
{{ 'general, load-more' | translate}}
</button>
</ion-card-content>
</ion-card>
</ion-col>
</ion-row>
</ion-grid>
</ng-container>
</div>
</ion-card-content>
</ion-card>
</ng-container>
</ion-slide>
</ion-slides>

@ -111,4 +111,27 @@
.margin-left {
margin-left: 30px;
}
}
.active-Segment {
font-size: 0.3cm !important;
background: #269DB8 !important;
text-transform: none;
--color-checked: none;
border-radius: 100px;
border:0;
}
.active-Segment ion-label{
font-size: 11px;
color: white !important;
}
.normal-Segment ion-label{
color: black !important;
font-size: 11px;
}
.normal-Segment {
font-size: 0.3cm !important;
text-transform: none;
--color-checked: none;
border: 0;
}

@ -102,7 +102,7 @@ export class WorklistMainPRComponent implements OnInit {
demoeAttach: any = [];
notiActionBtnMore: any = [];
messageSuccess: boolean = false;
activeSegment: any = 'item-req';
activeSegment: any = 'info';
approveDis: boolean;
rejectDis: boolean;
requestDis: boolean;
@ -145,19 +145,19 @@ export class WorklistMainPRComponent implements OnInit {
public segmentChanged(event: any) {
this.activeSegment = event.detail.value;
if(this.activeSegment === 'item-req')
if(this.activeSegment === 'info')
{
this.slides.slideTo(0);
}
else if(this.activeSegment === 'action-history')
else if(this.activeSegment === 'item-req')
{
this.slides.slideTo(1);
}
else if(this.activeSegment === 'attach')
else if(this.activeSegment === 'action-history')
{
this.slides.slideTo(2);
}
else if(this.activeSegment === 'info')
else if(this.activeSegment === 'attach')
{
this.slides.slideTo(3);
}
@ -170,19 +170,19 @@ export class WorklistMainPRComponent implements OnInit {
console.log(event);
if(index === 0)
{
this.activeSegment = 'item-req';
this.activeSegment = 'info';
}
else if(index === 1)
{
this.activeSegment = 'action-history';
this.activeSegment = 'item-req';
}
else if(index === 2)
{
this.activeSegment = 'attach';
this.activeSegment = 'action-history';
}
else if(index === 3)
{
this.activeSegment = 'info';
this.activeSegment = 'attach';
}
console.log(this.activeSegment);
});

@ -10,24 +10,25 @@
class="ion-segment-all">
<ion-segment-button value="info"
[ngClass]="activeSegment == 'info' ? 'active-Segment' : 'normal-Segment'">
<ion-label class="padding-zero"> {{'worklistMain, info'| translate}} </ion-label>
</ion-segment-button>
<ion-segment-button value="item-req"
[ngClass]="activeSegment == 'item-req' ? 'active-Segment' : 'normal-Segment'">
<ion-label class="padding-zero"> {{'worklistMain, details-emp'| translate}}</ion-label>
</ion-segment-button>
<ion-segment-button value="action-history"
[ngClass]="activeSegment == 'action-history' ? 'active-Segment' : 'normal-Segment'">
<ion-label class="padding-zero"> {{'worklistMain, action' | translate}}</ion-label>
</ion-segment-button>
<ion-segment-button value="attach"
[ngClass]="activeSegment == 'attach' ? 'active-Segment' : 'normal-Segment'">
<ion-segment-button value="attach" [ngClass]="activeSegment == 'attach' ? 'active-Segment' : 'normal-Segment'">
<ion-label class="padding-zero"> {{'worklistMain, attach-file' | translate}}</ion-label>
</ion-segment-button>
<ion-segment-button value="info" [ngClass]="activeSegment == 'info' ? 'active-Segment' : 'normal-Segment'">
<ion-label class="padding-zero"> {{'worklistMain, info'| translate}} </ion-label>
</ion-segment-button>
</ion-segment>
@ -35,172 +36,244 @@
<ion-slides #slides (ionSlideDidChange)="slideChanged($event)">
<ion-slide>
<ng-container *ngIf="activeSegment === 'item-req'">
<ion-grid style="width: 1px;">
<ng-container *ngIf="activeSegment === 'info'">
<ion-grid>
<ion-row>
<ion-col>
<ion-card class="cardContent">
<ion-card-content>
<div>
<ion-grid style="text-align: left;">
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for=""> {{ts.trPK('worklistMain','from')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.FROM_USER}}</label>
</ion-col>
<ion-col class="">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','to')}}
</label>
<br />
<label for=""> {{getPassNotificationDetails.TO_USER}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','sent')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.BEGIN_DATE}}</label>
</ion-col>
<ion-col class="">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','closed')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.END_DATE}}</label>
</ion-col>
</ion-row>
<ion-row class="">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','id')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.NOTIFICATION_ID}}</label>
</ion-col>
<ion-col class="">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','responder')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.RESPONDER}} </label>
</ion-col>
</ion-row>
</ion-grid>
</div>
</ion-card-content>
</ion-card>
<div *ngIf="pInformation && pInformation != '' " class="tipsPadding">{{pInformation}}</div>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<ion-card *ngIf="submitterInfoRes?.length > 0 ">
<ion-card-content [ngClass] = " direction === 'en' ? 'cardAlignTextEn' : 'cardAlignTextAr'">
<div style="font-weight: bold;" class="hrTitle">
{{'userProfile, emp-detail' | translate}}</div>
<div *ngFor="let submitterInfo of submitterInfoRes">
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq"
for="">{{'userProfile, empNo' | translate}}</label>
<br />
<label for="">{{submitterInfo.EMPLOYEE_NUMBER}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq" for="">{{'userProfile, name' | translate}}</label>
<br />
<label for="">{{submitterInfo.EMPLOYEE_NAME}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq"
for="">{{'worklistMain, job-name' | translate}}</label>
<br />
<label for="">{{submitterInfo.POSITION_NAME}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq"
for="">{{'userProfile, grade' | translate}}</label>
<br />
<label for="">{{submitterInfo.GRADE_NAME}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq"
for="">{{'worklistMain, job_cate' | translate}}</label>
<br />
<label for="">{{submitterInfo.JOB_NAME}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq"
for="">{{'worklistMain, category' | translate}}</label>
<br />
<label for="">{{submitterInfo.EMPLOYMENT_CATEGORY_MEANING}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq"
for="">{{'worklistMain, emp-email' | translate}}</label>
<br />
<label for="">{{submitterInfo.EMPLOYEE_EMAIL_ADDRESS}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq"
for="">{{'worklistMain, org-name' | translate}}</label>
<br />
<label for="">{{submitterInfo.ORGANIZATION_NAME}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq"
for="">{{'worklistMain, loc-name' | translate}}</label>
<br />
<label for="">{{submitterInfo.LOCATION_NAME}}</label>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<label class="colItemReq"
for="">{{'worklistMain, branch-payrol' | translate}}</label>
<br />
<label for="">{{submitterInfo.PAYROLL_NAME}}</label>
</ion-col>
</ion-row>
<div *ngIf="notificationBodyRes?.length > 0 ">
<ion-card *ngFor="let item of notificationBodyRes;let i=index; " style="width: 91%;">
<ion-card-content *ngIf="item.Collection_Notification.length > 0">
<div>
<ion-row *ngIf=" item.Collection_Notification.DISPLAY_FLAG != 'N' ">
<ion-col class="rowBorder"
*ngFor="let notificationBody of item.Collection_Notification;" size="6"
[hidden]="notificationBody.DISPLAY_FLAG == 'N'">
<label class="colItemReq" for="">{{notificationBody.SEGMENT_PROMPT}}</label>
<br />
<label for="">{{notificationBody.SEGMENT_VALUE_DSP}}</label>
</ion-col>
</ion-row>
</div>
</ion-card-content>
</ion-card>
</div>
<div style="margin: 10px;font-weight: bold; "
*ngIf="subordinatesleaveList != undefined && subordinatesleaveList?.length > 0">
{{ts.trPK('worklistMain','employee-on-leave')}}
</div>
<ion-item lines="none" [ngClass]=" direction === 'en' ? 'subOrdinateList' :'subOrdinateList-Ar' "
*ngFor="let List of subordinatesleaveList;">
<ion-grid [ngClass]=" direction === 'en' ? 'gridSubordinates' :'gridSubordinates-Ar' ">
<div [ngClass]=" direction === 'en' ? 'subOrdinateDiv' :'subOrdinateDiv-Ar' ">
<img *ngIf="List.EMPLOYEE_IMAGE" class="empImgeSub"
[src]="'data:image/png;base64,'+List.EMPLOYEE_IMAGE">
<img *ngIf="List.EMPLOYEE_IMAGE == null" class="empImgeSub"
src="../assets/imgs/profile.png">
</div>
</ion-card-content>
</ion-card>
<ion-row class="rowHeader "
[ngClass]=" direction === 'en' ? 'subOrdinateRow' :'subOrdinateRow-Ar' ">
<ion-col size="9">
<label style="font-weight: bold; " class="label" for="">{{List.EMPLOYEE_NAME}}
</label>
<br />
<label class="label" for="">{{List.POSITION_TITLE}} </label><br />
</ion-col>
<ion-col class="status" size="3">
<label class="label" style="font-size: 11px;" for="label">{{List.STATUS}}</label>
</ion-col>
</ion-row>
<br />
<ion-row [ngClass]=" direction === 'en' ? 'subOrdinateRow' :'subOrdinateRow-Ar'">
<ion-col>
<label class="label" for=""> {{ts.trPK('worklistMain','from')}}</label><br />
<label class="label" for="">{{List.DATE_START |date}}</label>
</ion-col>
<ion-col>
<label class="label" for="">{{ts.trPK('worklistMain','to')}}</label><br />
<label class="label" for="">{{List.DATE_END | date}}</label>
</ion-col>
</ion-row>
</ion-grid>
</ion-item>
</ion-col>
</ion-row>
</ion-grid>
</ng-container>
</ion-slide>
<ion-slide>
<ng-container *ngIf="activeSegment === 'item-req'">
<ion-grid style="width: 1px;">
<ion-row>
<ion-col>
<ion-card class="cardContent">
<ion-card-content>
<div>
<ion-grid style="text-align: left;">
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for=""> {{ts.trPK('worklistMain','from')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.FROM_USER}}</label>
</ion-col>
<ion-col class="">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','to')}}
</label>
<br />
<label for=""> {{getPassNotificationDetails.TO_USER}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','sent')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.BEGIN_DATE}}</label>
</ion-col>
<ion-col class="">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','closed')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.END_DATE}}</label>
</ion-col>
</ion-row>
<ion-row class="">
<ion-col [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','id')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.NOTIFICATION_ID}}</label>
</ion-col>
<ion-col class="">
<label class="colItemReq" for="">{{ts.trPK('worklistMain','responder')}}
</label>
<br />
<label for="">{{getPassNotificationDetails.RESPONDER}} </label>
</ion-col>
</ion-row>
</ion-grid>
</div>
</ion-card-content>
</ion-card>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<ion-card *ngIf="submitterInfoRes?.length > 0 ">
<ion-card-content [ngClass] = " direction === 'en' ? 'cardAlignTextEn' : 'cardAlignTextAr'">
<div style="font-weight: bold;" class="hrTitle">
{{'userProfile, emp-detail' | translate}}</div>
<div *ngFor="let submitterInfo of submitterInfoRes">
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq"
for="">{{'userProfile, empNo' | translate}}</label>
<br />
<label for="">{{submitterInfo.EMPLOYEE_NUMBER}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq" for="">{{'userProfile, name' | translate}}</label>
<br />
<label for="">{{submitterInfo.EMPLOYEE_NAME}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq"
for="">{{'worklistMain, job-name' | translate}}</label>
<br />
<label for="">{{submitterInfo.POSITION_NAME}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq"
for="">{{'userProfile, grade' | translate}}</label>
<br />
<label for="">{{submitterInfo.GRADE_NAME}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq"
for="">{{'worklistMain, job_cate' | translate}}</label>
<br />
<label for="">{{submitterInfo.JOB_NAME}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq"
for="">{{'worklistMain, category' | translate}}</label>
<br />
<label for="">{{submitterInfo.EMPLOYMENT_CATEGORY_MEANING}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq"
for="">{{'worklistMain, emp-email' | translate}}</label>
<br />
<label for="">{{submitterInfo.EMPLOYEE_EMAIL_ADDRESS}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq"
for="">{{'worklistMain, org-name' | translate}}</label>
<br />
<label for="">{{submitterInfo.ORGANIZATION_NAME}}</label>
</ion-col>
</ion-row>
<ion-row class="rowBorder submitterInfo">
<ion-col>
<label class="colItemReq"
for="">{{'worklistMain, loc-name' | translate}}</label>
<br />
<label for="">{{submitterInfo.LOCATION_NAME}}</label>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<label class="colItemReq"
for="">{{'worklistMain, branch-payrol' | translate}}</label>
<br />
<label for="">{{submitterInfo.PAYROLL_NAME}}</label>
</ion-col>
</ion-row>
</div>
</ion-card-content>
</ion-card>
</ion-col>
</ion-row>
</ion-grid>
</ng-container>
</ion-slide>
<ion-slide>
<ng-container *ngIf="activeSegment === 'action-history'">
@ -306,78 +379,6 @@
</ion-card>
</ng-container>
</ion-slide>
<ion-slide>
<ng-container *ngIf="activeSegment === 'info'">
<ion-grid>
<ion-row>
<ion-col>
<div *ngIf="pInformation && pInformation != '' " class="tipsPadding">{{pInformation}}</div>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<div *ngIf="notificationBodyRes?.length > 0 ">
<ion-card *ngFor="let item of notificationBodyRes;let i=index; " style="width: 91%;">
<ion-card-content *ngIf="item.Collection_Notification.length > 0">
<div>
<ion-row *ngIf=" item.Collection_Notification.DISPLAY_FLAG != 'N' ">
<ion-col class="rowBorder"
*ngFor="let notificationBody of item.Collection_Notification;" size="6"
[hidden]="notificationBody.DISPLAY_FLAG == 'N'">
<label class="colItemReq" for="">{{notificationBody.SEGMENT_PROMPT}}</label>
<br />
<label for="">{{notificationBody.SEGMENT_VALUE_DSP}}</label>
</ion-col>
</ion-row>
</div>
</ion-card-content>
</ion-card>
</div>
<div style="margin: 10px;font-weight: bold; "
*ngIf="subordinatesleaveList != undefined && subordinatesleaveList?.length > 0">
{{ts.trPK('worklistMain','employee-on-leave')}}
</div>
<ion-item lines="none" [ngClass]=" direction === 'en' ? 'subOrdinateList' :'subOrdinateList-Ar' "
*ngFor="let List of subordinatesleaveList;">
<ion-grid [ngClass]=" direction === 'en' ? 'gridSubordinates' :'gridSubordinates-Ar' ">
<div [ngClass]=" direction === 'en' ? 'subOrdinateDiv' :'subOrdinateDiv-Ar' ">
<img *ngIf="List.EMPLOYEE_IMAGE" class="empImgeSub"
[src]="'data:image/png;base64,'+List.EMPLOYEE_IMAGE">
<img *ngIf="List.EMPLOYEE_IMAGE == null" class="empImgeSub"
src="../assets/imgs/profile.png">
</div>
<ion-row class="rowHeader "
[ngClass]=" direction === 'en' ? 'subOrdinateRow' :'subOrdinateRow-Ar' ">
<ion-col size="9">
<label style="font-weight: bold; " class="label" for="">{{List.EMPLOYEE_NAME}}
</label>
<br />
<label class="label" for="">{{List.POSITION_TITLE}} </label><br />
</ion-col>
<ion-col class="status" size="3">
<label class="label" style="font-size: 11px;" for="label">{{List.STATUS}}</label>
</ion-col>
</ion-row>
<br />
<ion-row [ngClass]=" direction === 'en' ? 'subOrdinateRow' :'subOrdinateRow-Ar'">
<ion-col>
<label class="label" for=""> {{ts.trPK('worklistMain','from')}}</label><br />
<label class="label" for="">{{List.DATE_START |date}}</label>
</ion-col>
<ion-col>
<label class="label" for="">{{ts.trPK('worklistMain','to')}}</label><br />
<label class="label" for="">{{List.DATE_END | date}}</label>
</ion-col>
</ion-row>
</ion-grid>
</ion-item>
</ion-col>
</ion-row>
</ion-grid>
</ng-container>
</ion-slide>
</ion-slides>
<ion-row>

@ -302,4 +302,27 @@ ion-card{
.padding-zero {
padding: 0px !important;
}
.active-Segment {
font-size: 0.3cm !important;
background: #269DB8 !important;
text-transform: none;
--color-checked: none;
border-radius: 100px;
border:0;
}
.active-Segment ion-label{
font-size: 11px;
color: white !important;
}
.normal-Segment ion-label{
color: black !important;
font-size: 11px;
}
.normal-Segment {
font-size: 0.3cm !important;
text-transform: none;
--color-checked: none;
border: 0;
}

@ -76,7 +76,7 @@ export class WorklistMainComponent implements OnInit {
P_PAGE_NUM: number = 1;
P_PAGE_LIMIT: number = 100;
notificationCount: any;
activeSegment: any = 'item-req';
activeSegment: any = 'info';
lines_note_limit: any = 24;
attachmentRes: any = [];
private WorkListActionHistoryObj: WorkListActionHistoryRequest;
@ -143,19 +143,19 @@ export class WorklistMainComponent implements OnInit {
public segmentChanged(event: any) {
this.activeSegment = event.detail.value;
if(this.activeSegment === 'item-req')
if(this.activeSegment === 'info')
{
this.slides.slideTo(0);
}
else if(this.activeSegment === 'action-history')
else if(this.activeSegment === 'item-req' )
{
this.slides.slideTo(1);
}
else if(this.activeSegment === 'attach')
else if(this.activeSegment === 'action-history')
{
this.slides.slideTo(2);
}
else if(this.activeSegment === 'info')
else if(this.activeSegment === 'attach')
{
this.slides.slideTo(3);
}
@ -168,19 +168,19 @@ export class WorklistMainComponent implements OnInit {
console.log(event);
if(index === 0)
{
this.activeSegment = 'item-req';
this.activeSegment = 'info';
}
else if(index === 1)
{
this.activeSegment = 'action-history';
this.activeSegment = 'item-req';
}
else if(index === 2)
{
this.activeSegment = 'attach';
this.activeSegment = 'action-history';
}
else if(index === 3)
{
this.activeSegment = 'info';
this.activeSegment = 'attach';
}
console.log(this.activeSegment);
});

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.0 KiB

Loading…
Cancel
Save