Merge branch 'MOHEMM-Q2-DEV' of https://gitlab.com/haroon6138/mohemmionic5 into sultan26April

MOE_DEV_NEW_TEMPORARY_DESIGN
Sultan Khan 5 years ago
commit d5c946370d

@ -136,7 +136,7 @@
<img style= "height: 14px !important;" src="../assets/imgs/my_team_icon.png" item-left>
</ion-thumbnail>
<ion-label class="profile">
HR REQUEST
{{ts.trPK('userProfile','HR-Request')}}
</ion-label>
</ion-item>
<ion-item (click)="openChangePassword()">

@ -33,6 +33,6 @@
}
.my-custom-modal-css .modal-wrapper {
width: 90%;
height: 55%;
width: 95%;
height: 60%;
}

@ -140,14 +140,14 @@
<ion-row class="custom-radio">
<ion-radio-group (ionChange)="showSelectedField($event)" class="radio-list">
<ion-radio value="HR Services" [color]="myColor">HR Services</ion-radio>
<ion-label class="text-label" >HR Services</ion-label>
<ion-radio value="HR Services" [color]="myColor">{{HR}}</ion-radio>
<ion-label class="text-label" >{{HR}}</ion-label>
<ion-radio value="Complaints" [color]="myColor" >Complaints</ion-radio>
<ion-label class="text-label">Complaints</ion-label>
<ion-radio value="Complaints" [color]="myColor" >{{complaints}}</ion-radio>
<ion-label class="text-label">{{complaints}}</ion-label>
<ion-radio value="Inquiry" [color]="myColor" >Inquiry</ion-radio>
<ion-label class="text-label">Inquiry</ion-label>
<ion-radio value="Inquiry" [color]="myColor" >{{inquiry}}</ion-radio>
<ion-label class="text-label">{{inquiry}}</ion-label>
</ion-radio-group>
</ion-row>
@ -159,23 +159,35 @@
<ion-list>
<label class="labels">{{ts.trPK('userProfile','DeptName')}}</label>
<ion-item lines="none" class="filed-container">
<select class="filed" placeholder="Select Department" type="text">
<option value="1">1</option>
<option value="2">2</option>
<select class="filed1" placeholder="Select Department" type="text" [(ngModel)]="index">
<option [selected]="x.departmentName" value="{{i}}"
*ngFor="let x of departTypeList; let i=index;">
{{x.departmentName}} </option>
</select>
<!-- <select class="filed1" placeholder="Select Department" type="text">
<option >{{EmpRelations}}</option>
<option >{{Hr}}</option>
<option >{{Payroll}}</option>
<option >{{GovRelation}}</option>
</select> -->
</ion-item>
<label class="labels">{{ts.trPK('userProfile','RelatedSection')}}</label>
<ion-item lines="none" class="filed-container">
<select class="filed" placeholder="Select Sectiont" type="text">
<option value="1">1</option>
<option value="2">2</option>
<select [(ngModel)]="index" class="filed2" placeholder="Select Sectiont" type="text">
<!-- <option [selected]="projName" >{{projName}}</option> -->
<option [selected]="x.projectName" value="{{i}}"
*ngFor="let x of sectionTypeList; let i=index;">
{{x.projectName}} </option>
</select>
</ion-item>
<label class="labels">{{ts.trPK('userProfile','RelatedTopic')}}</label>
<ion-item lines="none" class="filed-container" placeholder="Select Topic" type="text">
<select class="filed" placeholder="Select Topic" type="text">
<option value="1">1</option>
<option value="2">2</option>
<ion-item lines="none" class="filed-container">
<select [(ngModel)]="index" class="filed3" placeholder="Select Topic" type="text">
<!-- <option value="1">{{topicName}}</option> -->
<option [selected]="x.topicName" value="{{i}}"
*ngFor="let x of topicTypeList; let i=index;">
{{x.topicName}} </option>
</select>
</ion-item>
</ion-list>
@ -186,17 +198,24 @@
<span>{{ts.trPK('userProfile','SupportingDocument')}}</span>
</div>
<div>
<img slot="start" style=" height: 55px;" (click)="uploadDocument()" src="../assets/imgs/add-photo.svg">
<!-- <input type="file" ng2FileSelect [uploader]="uploader"
(change)="onFileSelected($event)" (click)="onFileSelectedclick($event)" />
<label end for="file">
<img slot="start" style=" height: 55px;"src="../assets/imgs/add-photo.svg">
</label> -->
<div class="fileUpload btn btn-primary">
<img slot="start" style=" height: 55px;"src="../assets/imgs/add-photo.svg">
<input type="file" class="upload" ng2FileSelect [uploader]="uploader"
(change)="onFileSelected($event)" (click)="onFileSelectedclick($event)" />
</div>
</div>
<div class="request-heading">
<span>{{ts.trPK('userProfile','Description')}}</span>
</div>
<!-- <div class="filedDesc">
<ion-input class="labelDesc" placeholder="{{ts.trPK('userProfile','Description')}}" type="text">
</ion-input>
</div> -->
<ion-col size="12">
<ion-item style="margin-left: -20px;margin-right: -13px;" lines="none">
<ion-item style="margin-left: -20px;margin-right: -13px;margin-top: -24px;" lines="none">
<ion-input [ngClass]="direction == 'en' ? 'filedDesc':'filedDesc-ar' " placeholder="{{ts.trPK('userProfile','Description')}}" type="text"></ion-input>
</ion-item>
</ion-col>
@ -204,13 +223,13 @@
</div>
</ion-card-content>
</ion-card>
<ion-footer style=" padding:15px !important;" >
<div ng class="gridDiv" aria-disabled="true">
<button class="gridCancelBtn" ion-button (click)="cancelRequest()">{{ts.trPK('general','cancel')}}</button>
<button class="gridSubmitBtn" ion-button (click)="submitRequest()">{{ts.trPK('general','submit')}}</button>
</div>
</ion-footer>
</div>
</ion-content>
</ion-content>
<ion-footer *ngIf="showRequestDetails" >
<div class="centerDiv">
<button class="gridCancelBtn" ion-button (click)="cancelRequest()">{{ts.trPK('general','cancel')}}</button>
<button class="gridSubmitBtn" ion-button (click)="submitRequest()">{{ts.trPK('general','submit')}}</button>
</div>
</ion-footer>

@ -259,7 +259,7 @@ ion-input {
}
}
.filed{
.filed1{
border-radius: 30px;
border: 1px solid #d3d5d5 !important;
margin: 10px;
@ -267,7 +267,30 @@ ion-input {
padding-top: 6px !important;
color: #636161;
padding-bottom: 15px;
padding-right: 252px;
// padding-right: 252px;
padding-right: 115px;
}
.filed2{
border-radius: 30px;
border: 1px solid #d3d5d5 !important;
margin: 10px;
padding-left: 11px !important;
padding-top: 6px !important;
color: #636161;
padding-bottom: 15px;
// padding-right: 252px;
padding-right: 153px;
}
.filed3{
border-radius: 30px;
border: 1px solid #d3d5d5 !important;
margin: 10px;
padding-left: 11px !important;
padding-top: 6px !important;
color: #636161;
padding-bottom: 15px;
// padding-right: 252px;
padding-right: 61px;
}
.filedDesc{
border-radius: 30px;
@ -427,4 +450,27 @@ ion-input {
border: 0px !important;
box-shadow: none !important;
-webkit-box-shadow: none;
}
ion-footer .footer-button{
--background: #259CB8;
width: 80%;
}
.fileUpload {
position: relative;
overflow: hidden;
margin: 10px;
margin-left: -233px;
}
.fileUpload input.upload {
position: absolute;
top: 0;
right: 0;
margin: 0;
padding: 0;
font-size: 20px;
cursor: pointer;
opacity: 0;
filter: alpha(opacity=0);
}

@ -10,6 +10,7 @@ import { Location } from '@angular/common';
import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response';
import { LoginModel } from 'src/app/authentication/models/LoginModel';
import { SendActivationByType } from 'src/app/authentication/models/sendActivationByType';
import { FileUploader } from 'ng2-file-upload';
@Component({
selector: 'app-hr-request',
@ -37,6 +38,21 @@ export class HRRequestComponent implements OnInit {
myColor: string = 'secondary';
public showRequestDetails = false;
public proID= "CS"
public inquiry: string;
public HR : string;
public complaints:string;
public Projectresult:any;
public EmpRelations:any;
public Hr:any;
public Payroll:any;
public GovRelation:any;
public projName:any;
public topicName:any;
public departTypeList: any;
public topicTypeList:any;
public sectionTypeList:any;
filterAllowedType: any = ['application/pdf', 'image/jpeg', 'image/png', 'text/plain', 'image/jpg', 'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'];
public direction: string;
@ -106,7 +122,7 @@ export class HRRequestComponent implements OnInit {
getTicketTypes(){
const request = {
// TokenID:"xxx",
// EmployeeNumber:"191817"
EmployeeNumber:"121816",
};
this.MowadhafiService.getTicketTypes(request, ()=> {} , this.ts.trPK('general', 'retry')).subscribe((result)=>
@ -115,14 +131,16 @@ export class HRRequestComponent implements OnInit {
}) }
handlegetTicketTypesResult(result){
this.HR = result.Mohemm_Itg_TicketTypesList[0].typeName;
this.complaints = result.Mohemm_Itg_TicketTypesList[1].typeName;
this.inquiry = result.Mohemm_Itg_TicketTypesList[2].typeName;
}
getProject(){
const request = {
// TokenID:"xxx",
// EmployeeNumber:"191817",
EmployeeNumber:"121816",
ItgProjectCode:"CS"
};
@ -132,14 +150,14 @@ export class HRRequestComponent implements OnInit {
}) }
handlegetProjectResult(result){
this.Projectresult=result.Mohemm_Itg_ProjectsList[0];
}
getProjectDepartments(){
const request = {
// TokenID:"xxx",
// EmployeeNumber:"191817",
EmployeeNumber:"121816",
ItgProjectId:11,
@ -150,13 +168,18 @@ export class HRRequestComponent implements OnInit {
}) }
handlegetProjectDepartmentsResult(result){
this.departTypeList= result.Mohemm_ITG_ProjectDepartmentsList;
// this.EmpRelations= result .Mohemm_ITG_ProjectDepartmentsList[0].departmentName;
// this.Hr = result .Mohemm_ITG_ProjectDepartmentsList[1].departmentName;
// this.Payroll = result .Mohemm_ITG_ProjectDepartmentsList[2].departmentName;
// this.GovRelation = result .Mohemm_ITG_ProjectDepartmentsList[3].departmentName;
}
getDepartmentSections(){
const request = {
// TokenID:"xxx",
// EmployeeNumber:"191817",
EmployeeNumber:"121816",
ItgProjectDepartmentId:1
};
@ -166,13 +189,15 @@ export class HRRequestComponent implements OnInit {
}) }
handlegetDepartmentSectionsResult(result){
// this.projName=result.Mohemm_ITG_DepartmentSectionsList[0].projectName;
this.sectionTypeList= result.Mohemm_ITG_DepartmentSectionsList;
}
getSectionTopics(){
const request = {
// TokenID:"xxx",
// EmployeeNumber:"191817",
EmployeeNumber:"121816",
ItgDepartmentSectionId:1
};
@ -182,6 +207,8 @@ export class HRRequestComponent implements OnInit {
}) }
handlegetSectionTopicsResult(result){
// this.topicName=result.Mohemm_ITG_SectionTopicsList[0].topicName
this.topicTypeList= result.Mohemm_ITG_SectionTopicsList;
}
@ -202,11 +229,80 @@ export class HRRequestComponent implements OnInit {
this.menu.toggle();
}
submitRequest(){
/*******************Add attchement Functions*************/
public uploader: FileUploader = new FileUploader({
allowedMimeType: ['application/pdf', 'image/jpeg', 'image/png', 'text/plain', 'image/jpg', 'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'],
maxFileSize: 10 * 1024 * 1024,
formatDataFunctionIsAsync: true,
formatDataFunction: async (item) => {
return new Promise((resolve, reject) => {
resolve({
name: item._file.name,
length: item._file.size,
contentType: item._file.type,
date: new Date()
});
});
}
});
onFileSelectedclick(event){
event.target.value = '';
}
uploadDocument(){
onFileSelected(input) {
// this.uploader.onWhenAddingFileFailed = function (item: any, filter: any, options: any){
if (!(this.filterAllowedType.indexOf(input.target.files[0].type) > -1)) {
let msg: string = "";
msg = this.ts.trPK("general", "notSupport");
this.cs.presentAlert(msg);
return
} // todo: show alert that you tried uploading wrong files
else {
const file = input.target.files[0];
this.getBase64(file).then(
data => this.pushObject(data, file.name, file.type)
);
}
}
getBase64(file) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = error => reject(error);
});
}
pushObject(fileData, name, type) {
// console.log('before push: '+ this.index);
// try {
// let array = name.split('.');
// let attachType: string = array[array.length - 1];
// this.attachListOver.push(
// AttachmentID: this.attachListOver.length,
// P_FILE_CONTENT_TYPE: attachType,//type.split('/')[1],
// P_FILE_DATA: fileData.split(',')[1],
// P_FILE_NAME: name,//.split('.')[0],
// P_TRANSACTION_ID: this.P_TransactionID
// {
// })
// } catch (e) {
// }
}
submitRequest(){}
}

@ -18,7 +18,7 @@ export class MowadhafiService {
public static getTicketsByEmployee ='Services/COCWS.svc/REST/Mohemm_ITG_GetTicketsByEmployee';
public static getTicketStatisticsByEmp ='Services/COCWS.svc/REST/Mohemm_ITG_GetTicketStatisticsByEmployee';
public static getTicketTransaction ='Services/COCWS.svc/REST/Mohemm_ITG_GetTicketTransaction';
public static getTicketDetails =' Services/COCWS.svc/REST/Mohemm_ITG_GetTicketDetails';
public static getTicketDetails ='Services/COCWS.svc/REST/Mohemm_ITG_GetTicketDetails';
constructor(
public con: ConnectorService,

@ -54,7 +54,7 @@ public openRequestDetailsPage() {
getTicketsByEmployee(){
const request = {
// TokenID:"xxx",
// EmployeeNumber:"191817",
EmployeeNumber:"121816",
ItgPageSize:10,
ItgPageNo:1

@ -44,7 +44,7 @@ export class RequestDetailsComponent implements OnInit {
getTicketTransaction(){
const request = {
// EmployeeNumber:"191817",
EmployeeNumber:"121816",
ItgTicketId:"5a10de61-c4db-4c77-e464-08d8a1beaaac",
};
@ -59,8 +59,9 @@ export class RequestDetailsComponent implements OnInit {
getTicketDetails(){
const request = {
// EmployeeNumber:"191817",
ItgTicketId:"5a10de61-c4db-4c77-e464-08d8a1beaaac",
EmployeeNumber:"121816",
TokenID:"@dm!n",
ItgTicketId:"5a10de61-c4db-4c77-e464-08d8a1beaaac",
};
this.MowadhafiService.getTicketDetails(request, ()=> {} , this.ts.trPK('general', 'retry')).subscribe((result)=>

@ -12,8 +12,9 @@
<div class="result-graph" >
<div class="user-info">
<div class="user-image-container">
<div>
<img style="height: 18px; margin-left: 23px;" src="../assets/imgs/fav.svg">
<div (click)="setFavorite(employee)">
<img *ngIf="!isFavorite" style="height: 18px; margin-left: 23px;" src="../assets/imgs/fav.svg">
<img *ngIf="isFavorite" style="height: 18px; margin-left: 23px;" src="../assets/imgs/favFilled.svg">
<!-- <ion-col><img src="../assets/imgs/fav filled.svg"></ion-col> -->
</div>
<div class="user-image">
@ -268,28 +269,28 @@
<ion-col [size]="4">
<div class="attendance-information">
<span>{{ts.trPK('attendance-tracking','schedule')}}</span>
<h2>{{timeCardSummaryData.SCHEDULE_DAYS}}</h2>
<h2>{{timeCardSummaryData?.SCHEDULE_DAYS}}</h2>
</div>
</ion-col>
<ion-col [size]="2">
<div class="attendance-information">
<span>{{ts.trPK('attendance-tracking','off-days')}}</span>
<h2>{{timeCardSummaryData.OFF_DAYS}}</h2>
<h2>{{timeCardSummaryData?.OFF_DAYS}}</h2>
</div>
</ion-col>
<ion-col [size]="3">
<div class="attendance-information">
<span>{{ts.trPK('attendance-tracking','non-analyzed')}}</span>
<h2>{{timeCardSummaryData.NOT_ANALYZED_DAYS}}</h2>
<h2>{{timeCardSummaryData?.NOT_ANALYZED_DAYS}}</h2>
</div>
</ion-col>
<ion-col [size]="3">
<div class="attendance-information">
<span>{{ts.trPK('attendance-tracking','shortage-hours')}}</span>
<h2>{{timeCardSummaryData.SHORTAGE_HRS}}</h2>
<h2>{{timeCardSummaryData?.SHORTAGE_HRS}}</h2>
</div>
</ion-col>
</ion-row>

@ -92,6 +92,7 @@ export class DetailsComponent implements OnInit {
public selectedFilter = '';
public itemType = '';
public monthNo: any;
isFavorite: boolean = false;
@ -804,13 +805,15 @@ export class DetailsComponent implements OnInit {
confirmBoxhtml
, () => {
var request =
[{ "USER_NAME": selEmp['USER_NAME'], "EMPLOYEE_DISPLAY_NAME": selEmp['EMPLOYEE_DISPLAY_NAME'], "EMAIL_ADDRESS": selEmp.EMAIL_ADDRESS, "EMPLOYEE_IMAGE": selEmp.EMPLOYEE_IMAGE, "IsFavorite": true }];
{ "USER_NAME": selEmp['USER_NAME'], "EMPLOYEE_DISPLAY_NAME": selEmp['EMPLOYEE_DISPLAY_NAME'], "EMAIL_ADDRESS": selEmp.EMAIL_ADDRESS, "EMPLOYEE_IMAGE": selEmp.EMPLOYEE_IMAGE, "IsFavorite": true };
this.saveUserFavruiteList(request);
// this.isFavorite = false;
}, () => {
})
this.isFavorite = false;
// if (selectValue == "1" || selectValue == "2" || selectValue == "3") {
// this.isSelect = true;
// }
@ -825,11 +828,12 @@ export class DetailsComponent implements OnInit {
getFavruite() {
this.worklistService.getFavorite({}, () => {
}).subscribe((result) => {
if (this.common.validResponse(result)) {
this.common.stopLoading();
this.favoriteUserList = result['Mohemm_GetFavoriteReplacementsList'];
}
})
}
@ -838,6 +842,7 @@ export class DetailsComponent implements OnInit {
}).subscribe((result) => {
if (this.common.validResponse(result)) {
this.common.toastPK("replacementRoll", "favorite-saved");
this.isFavorite = true;
}
})

@ -9,7 +9,11 @@ import { IonicModule } from '@ionic/angular';
import { MyTeamPage } from './my-team.page';
import { HmgCommonModule } from '../hmg-common/hmg-common.module';
import { from } from 'rxjs';
<<<<<<< HEAD
import { WorklistService } from '../notification/service/worklist.service';
=======
import { WorklistService } from 'src/app/notification/service/worklist.service';
>>>>>>> e0a02c254f3a86fa5c1f466668fe4a4a90433c95
const routes: Routes = [
@ -41,9 +45,10 @@ const routes: Routes = [
FormsModule,
IonicModule,
RouterModule.forChild(routes)
],
declarations: [MyTeamPage, HomeComponent, DetailsComponent,
],
providers: [WorklistService],
declarations: [MyTeamPage, HomeComponent, DetailsComponent,
]
})
export class MyTeamPageModule { }

@ -10,8 +10,7 @@
class="ion-segment-all">
<ion-segment-button value="info"
[ngClass]="activeSegment == 'info' ? 'active-Segment' : 'normal-Segment'">
<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>
@ -24,8 +23,9 @@
[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>
@ -40,21 +40,24 @@
<ion-grid>
<ion-row>
<ion-col>
<div *ngIf="pInformation && pInformation != '' " class="tipsPadding">{{pInformation}}</div>
<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 *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>
*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>
@ -65,41 +68,49 @@
</div>
<div style="margin: 10px;font-weight: bold; "
*ngIf="subordinatesleaveList != undefined && subordinatesleaveList?.length > 0">
{{ts.trPK('worklistMain','employee-on-leave')}}
{{ts.trPK('worklistMain','employee-on-leave')}}
</div>
<ion-item lines="none" [ngClass]=" direction === 'en' ? 'subOrdinateList' :'subOrdinateList-Ar' "
<ion-item lines="none"
[ngClass]=" direction === 'en' ? 'subOrdinateList' :'subOrdinateList-Ar' "
*ngFor="let List of subordinatesleaveList;">
<ion-grid [ngClass]=" direction === 'en' ? 'gridSubordinates' :'gridSubordinates-Ar' ">
<ion-grid
[ngClass]=" direction === 'en' ? 'gridSubordinates' :'gridSubordinates-Ar' ">
<div [ngClass]=" direction === 'en' ? 'subOrdinateDiv' :'subOrdinateDiv-Ar' ">
<img *ngIf="List.EMPLOYEE_IMAGE" class="empImgeSub"
style="width: 70px !important; height: 70px !important;"
<img *ngIf="List.EMPLOYEE_IMAGE" class="empImgeSub"
style="width: 70px !important; height: 70px !important;"
[src]="'data:image/png;base64,'+List.EMPLOYEE_IMAGE">
<img *ngIf="List.EMPLOYEE_IMAGE == null" class="empImgeSub"
style="width: 70px !important; height: 70px !important;"
style="width: 70px !important; height: 70px !important;"
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 style="font-weight: bold; " class="label"
for="">{{List.EMPLOYEE_NAME}}
</label>
<br />
<label class="label" for="">{{List.POSITION_TITLE}} </label><br />
<br>
<label class="label" style="font-size: 11px !important; position: absolute; left: 0px; color: #000;" for="label">{{List.STATUS}}</label>
<label class="label"
style="font-size: 11px !important; position: absolute; left: 0px; color: #000;"
for="label">{{List.STATUS}}</label>
</ion-col>
<!-- <ion-col class="status" size="3">
</ion-col> -->
</ion-row>
<br />
<ion-row [ngClass]=" direction === 'en' ? 'subOrdinateRow' :'subOrdinateRow-Ar'">
<ion-row
[ngClass]=" direction === 'en' ? 'subOrdinateRow' :'subOrdinateRow-Ar'">
<ion-col>
<label class="label" for=""> {{ts.trPK('worklistMain','from')}}</label><br />
<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="">{{ts.trPK('worklistMain','to')}}</label><br />
<label class="label" for="">{{List.DATE_END | date}}</label>
</ion-col>
</ion-row>
@ -107,177 +118,189 @@
</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-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'">
@ -292,13 +315,14 @@
<div class="timeline">
<ion-item *ngFor="let actionHistory of actionHistoryRes">
<div class="timeline-item" slot="start">
<div
<div class="timeline-item" slot="start">
<div
[class]="direction == 'en'? 'timeline-thumb-en timeline-icon': 'timeline-thumb-ar timeline-icon'">
<img *ngIf="actionHistory.EMPLOYEE_IMAGE" class="empImge"
[src]="'data:image/png;base64,'+actionHistory.EMPLOYEE_IMAGE">
<img *ngIf="actionHistory.EMPLOYEE_IMAGE == null" class="empImge"
src="../assets/imgs/profile.png"> </div>
src="../assets/imgs/profile.png">
</div>
</div>
<ion-col size="8">
<ion-label class="name">
@ -322,7 +346,8 @@
</div>
<button class="showMore"
(click)="actionHistory.visible = !actionHistory.visible">{{ actionHistory.visible ? 'Show less': 'Show More' }}</button>
(click)="actionHistory.visible = !actionHistory.visible">{{
actionHistory.visible ? 'Show less': 'Show More' }}</button>
</div>
</div>
@ -336,9 +361,11 @@
{{actionHistory.NOTIFICATION_DATE| dateString }} </ion-label>
</ion-col>
<ion-col size="4">
<img class="req_info" src="assets/imgs/req info.svg" (click)="openRequestInfoDel(actionHistory, 'REQUEST_INFO')" />
<img class="req_info" src="assets/imgs/delegate.svg" (click)="openRequestInfoDel(actionHistory, 'DELEGATE')"/>
<img class="req_info" src="assets/imgs/req info.svg"
(click)="openRequestInfoDel(actionHistory, 'REQUEST_INFO')" />
<img class="req_info" src="assets/imgs/delegate.svg"
(click)="openRequestInfoDel(actionHistory, 'DELEGATE')" />
</ion-col>
<div class="line"></div>
</ion-item>
@ -452,37 +479,37 @@
<ion-tab-button *ngIf="approveDis" (click)="actionButton('APPROVED')">
<img src="../assets/imgs/mohemm-action/Approve.png">
<!-- <ion-label> {{'worklistMain, approve' | translate}}</ion-label> -->
<ion-label class = "action-btn"> {{approve_label}}</ion-label>
<ion-label class="action-btn"> {{approve_label}}</ion-label>
</ion-tab-button>
<ion-tab-button *ngIf="closeDis" (click)="actionButton('CLOSE')">
<img src="../assets/imgs/mohemm-action/Approve.png">
<!-- <ion-label> {{'worklistMain, approve' | translate}}</ion-label> -->
<ion-label class = "action-btn"> {{close_label}}</ion-label>
<ion-label class="action-btn"> {{close_label}}</ion-label>
</ion-tab-button>
<ion-tab-button *ngIf="rejectDis" (click)="actionButton('REJECTED')">
<img src="../assets/imgs/mohemm-action/Reject.png">
<!-- <ion-label > {{'worklistMain, reject' | translate}}</ion-label> -->
<ion-label class = "action-btn"> {{reject_label}}</ion-label>
<ion-label class="action-btn"> {{reject_label}}</ion-label>
</ion-tab-button>
<ion-tab-button *ngIf="requestDis" (click)="actionButton('REQUEST_INFO')">
<img src="../assets/imgs/mohemm-action/info.png">
<!-- <ion-label > {{'worklistMain, request' | translate}}</ion-label> -->
<ion-label class = "action-btn"> {{reqInfo_label}}</ion-label>
<ion-label class="action-btn"> {{reqInfo_label}}</ion-label>
</ion-tab-button>
<ion-tab-button (click)="nextNotfification()">
<img src="../assets/imgs/mohemm-action/Skip.png">
<ion-label class = "action-btn"> {{'worklistMain, skip' | translate}}</ion-label>
<ion-label class="action-btn"> {{'worklistMain, skip' | translate}}</ion-label>
</ion-tab-button>
<ion-tab-button [disabled]="moreDisabled" (click)="openMoreActions()">
<img src="../assets/imgs/mohemm-action/More.png">
<ion-label class = "action-btn"> {{'worklistMain, more' | translate}}</ion-label>
<ion-label class="action-btn"> {{'worklistMain, more' | translate}}</ion-label>
</ion-tab-button>

@ -14,7 +14,7 @@
</div>
<div [ngClass]=" direction == 'ltr' ? 'changeImgBtn' : 'changeImgBtn-ar'">
<button ion-button icon-only menuToggle class="menubutton">
<img class="changeIcon" src="../assets/imgs/edit-image.svg">
<img class="changeIcon" src="../assets/imgs/edit_icon.png">
</button>
</div>
</div>
@ -39,20 +39,23 @@
<ion-row class="ion-justify-content-center">
<ion-col [size]="4" (click)="selectedSegment('personal')">
<div class="action-button col-button">
<img style="width: 50px;" src="../assets/imgs/check_padding.png">
<span>{{ts.trPK('general','personal-info')}}</span>
<img *ngIf="!personalInfoSegment" style="width: 40px;" src="../assets/imgs/profile-icons/info@2x.png">
<img *ngIf="personalInfoSegment" style="width: 40px;" src="../assets/imgs/profile-icons/info-a@2x.png">
<span style="font-size: 11px;">{{ts.trPK('general','personal-info')}}</span>
</div>
</ion-col>
<ion-col [size]="4" (click)="selectedSegment('basic')">
<div class="action-button col-button">
<img style="width: 50px;" src="../assets/imgs/check_padding.png">
<span>{{ts.trPK('general','basic-details')}}</span>
<img *ngIf="!basicDetailsSegment" style="width: 40px;" src="../assets/imgs/profile-icons/basic-detail@2x.png">
<img *ngIf="basicDetailsSegment" style="width: 40px;" src="../assets/imgs/profile-icons/basic-detail@21.png">
<span style="font-size: 11px;">{{ts.trPK('general','basic-details')}}</span>
</div>
</ion-col>
<ion-col [size]="4" (click)="selectedSegment('address')">
<div class="action-button col-button">
<img style="width: 50px;" src="../assets/imgs/check_padding.png">
<span>{{ts.trPK('userProfile','address')}} </span>
<img *ngIf="!addressSegment" style="width: 40px;" src="../assets/imgs/profile-icons/main-address@2x.png">
<img *ngIf="addressSegment" style="width: 40px;" src="../assets/imgs/profile-icons/main address-a@2x.png">
<span style="font-size: 11px;">{{ts.trPK('userProfile','address')}} </span>
</div>
</ion-col>
</ion-row>
@ -109,86 +112,86 @@
<br>
<ion-card *ngIf="personalInfoSegment">
<ion-card *ngIf="personalInfoSegment" [ngClass]="direction === 'ltr'? 'card-size-info-en': 'card-size-info-ar' ">
<ion-card-content>
<ion-label>
<h1 style="color: black;">{{ts.trPK('userProfile','personal-informaion')}}</h1>
<h1 class="header-label-text-form">{{ts.trPK('userProfile','personal-informaion')}}</h1>
</ion-label>
<br>
<ion-label>
<h3>{{ts.trPK('userProfile','category')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('userProfile','category')}}</h3>
</ion-label>
<h3 style="font-weight: bold;">part-time</h3>
<h3 class="result-label-text-form">part-time</h3>
<br>
<ion-label>
<h3>{{ts.trPK('userProfile','address')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('userProfile','address')}}</h3>
</ion-label>
<h3 style="font-weight: bold;">DR.Sulaiman Alhabib Medical Group</h3>
<h3 class="result-label-text-form">DR.Sulaiman Alhabib Medical Group</h3>
<br>
<ion-label>
<h3>{{ts.trPK('userProfile','phone-no')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('userProfile','phone-no')}}</h3>
</ion-label>
<h3 style="font-weight: bold;">0567845661</h3>
<h3 class="result-label-text-form">0567845661</h3>
<br>
<ion-label>
<h3>{{ts.trPK('userProfile','busG')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('userProfile','busG')}}</h3>
</ion-label>
<h3 style="font-weight: bold;">CORP Cloud Solutions</h3>
<h3 class="result-label-text-form">CORP Cloud Solutions</h3>
<br>
<ion-label>
<h3>{{ts.trPK('userProfile','payrol')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('userProfile','payrol')}}</h3>
</ion-label>
<h3 style="font-weight: bold;">Cloud Solutions Payroll</h3>
<h3 class="result-label-text-form">Cloud Solutions Payroll</h3>
<br>
</ion-card-content>
</ion-card>
<ion-card *ngIf="basicDetailsSegment">
<ion-card *ngIf="basicDetailsSegment" [ngClass]="direction === 'ltr'? 'card-size-info-en': 'card-size-info-ar' ">
<ion-card-content *ngIf="!editBasic">
<ion-grid>
<ion-row>
<ion-col size="10">
<ion-label>
<h1 style="color: black;">{{ts.trPK('general','basic-details')}}</h1>
<h1 class="header-label-text-form">{{ts.trPK('general','basic-details')}}</h1>
</ion-label>
</ion-col>
<ion-col size="2">
<img style="width: 70%;border: 1px solid;border-radius: 15px;" src="../assets/imgs/edit_icon.png"
<img style="width: 70%;" src="../assets/imgs/profile-icons/editing@2x.png"
(click)="allowEdit(1)">
</ion-col>
</ion-row>
</ion-grid>
<br>
<ion-label>
<h3>{{ts.trPK('general','full-name')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('general','full-name')}}</h3>
</ion-label>
<h3 style="font-weight: bold;">ENAD HILAL NASSER MOHAMMED</h3>
<h3 class="result-label-text-form">ENAD HILAL NASSER MOHAMMED</h3>
<br>
<ion-label>
<h3>{{ts.trPK('general','marital-status')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('general','marital-status')}}</h3>
</ion-label>
<h3 style="font-weight: bold;">Married</h3>
<h3 class="result-label-text-form">Married</h3>
<br>
<ion-label>
<h3>{{ts.trPK('general','birth_date')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('general','birth_date')}}</h3>
</ion-label>
<h3 style="font-weight: bold;">01-FEB-1991</h3>
<h3 class="result-label-text-form">01-FEB-1991</h3>
<br>
<ion-label>
<h3>{{ts.trPK('general','civil-identity-number')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('general','civil-identity-number')}}</h3>
</ion-label>
<h3 style="font-weight: bold;">2093486013</h3>
<h3 class="result-label-text-form">2093486013</h3>
<br>
</ion-card-content>
<ion-card-content *ngIf="editBasic">
<ion-card-content *ngIf="editBasic" [ngClass]="direction === 'ltr'? 'card-size-info-en': 'card-size-info-ar' ">
<ion-label>
<h1 style="color: black;">{{ts.trPK('general','basic-details')}}</h1>
<h1 class="header-label-text-form">{{ts.trPK('general','basic-details')}}</h1>
</ion-label>
<ion-label>
<h3>{{ts.trPK('general','effective-date')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('general','effective-date')}}</h3>
</ion-label>
<ion-item lines="none" class="item-input-login" style="--background: white">
@ -198,7 +201,11 @@
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label>{{ts.trPK('general','title')}}</ion-label>
<ion-label>
<h3 class="type-label-text-form">
{{ts.trPK('general','title')}}
</h3>
</ion-label>
<ion-select placeholder="Select One">
<ion-select-option value="mr">Mr</ion-select-option>
<ion-select-option value="ms">Miss</ion-select-option>
@ -207,60 +214,96 @@
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label position="floating">{{ts.trPK('userProfile','family-name')}}</ion-label>
<ion-label position="floating">
<h3 class="type-label-text-form">
{{ts.trPK('userProfile','family-name')}}
</h3>
</ion-label>
<ion-input class="login-input" type="text"></ion-input>
</ion-item>
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label position="floating">{{ts.trPK('userProfile','preferred-name')}}</ion-label>
<ion-label position="floating">
<h3 >
{{ts.trPK('userProfile','preferred-name')}}
</h3>
</ion-label>
<ion-input class="login-input" type="text"></ion-input>
</ion-item>
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label position="floating">{{ts.trPK('userProfile','previous-family-name')}}</ion-label>
<ion-label position="floating">
<h3 class="type-label-text-form">
{{ts.trPK('userProfile','previous-family-name')}}
</h3>
</ion-label>
<ion-input class="login-input" type="text"></ion-input>
</ion-item>
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label position="floating">{{ts.trPK('userProfile','father-name')}}</ion-label>
<ion-label position="floating">
<h3 class="type-label-text-form">
{{ts.trPK('userProfile','father-name')}}
</h3>
</ion-label>
<ion-input class="login-input" type="text"></ion-input>
</ion-item>
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label position="floating">{{ts.trPK('userProfile','grand-father-name')}}</ion-label>
<ion-label position="floating">
<h3 class="type-label-text-form">
{{ts.trPK('userProfile','grand-father-name')}}
</h3>
</ion-label>
<ion-input class="login-input" required type="text"></ion-input>
</ion-item>
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label position="floating">{{ts.trPK('userProfile','arabic-first-name')}}</ion-label>
<ion-label position="floating">
<h3 class="type-label-text-form">
{{ts.trPK('userProfile','arabic-first-name')}}
</h3>
</ion-label>
<ion-input class="login-input" type="text"></ion-input>
</ion-item>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label position="floating">{{ts.trPK('userProfile','arabic-father-name')}}</ion-label>
<ion-label position="floating">
<h3 class="type-label-text-form">
{{ts.trPK('userProfile','arabic-father-name')}}
</h3>
</ion-label>
<ion-input class="login-input" type="text"></ion-input>
</ion-item>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label position="floating">{{ts.trPK('userProfile','arabic-grand-father-name')}}</ion-label>
<ion-label position="floating">
<h3 class="type-label-text-form">
{{ts.trPK('userProfile','arabic-grand-father-name')}}
</h3>
</ion-label>
<ion-input class="login-input" type="text"></ion-input>
</ion-item>
</ion-card-content>
</ion-card>
<ion-card>
<ion-card [ngClass]="direction === 'ltr'? 'card-size-info-en': 'card-size-info-ar' ">
<ion-card-content *ngIf="editBasic">
<ion-label>
<h1 style="color: black;">{{ts.trPK('general','other')}}</h1>
<h1 class="header-label-text-form">{{ts.trPK('general','other')}}</h1>
</ion-label>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label>{{ts.trPK('general','gender')}}</ion-label>
<ion-label>
<h3 class="type-label-text-form">
{{ts.trPK('general','gender')}}
</h3>
</ion-label>
<ion-select placeholder="Select One">
<ion-select-option value="m">Male</ion-select-option>
<ion-select-option value="f">Female</ion-select-option>
@ -269,7 +312,11 @@
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label>{{ts.trPK('general','marital-status')}}</ion-label>
<ion-label>
<h3 class="type-label-text-form">
{{ts.trPK('general','marital-status')}}
</h3>
</ion-label>
<ion-select placeholder="Select One">
<ion-select-option value="s">Singal</ion-select-option>
<ion-select-option value="m">Married</ion-select-option>
@ -278,7 +325,11 @@
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label>{{ts.trPK('general','nationality')}}</ion-label>
<ion-label>
<h3 class="type-label-text-form">
{{ts.trPK('general','nationality')}}
</h3>
</ion-label>
<ion-select placeholder="Select One">
<ion-select-option value="mr">Mr</ion-select-option>
<ion-select-option value="ms">Miss</ion-select-option>
@ -287,7 +338,11 @@
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label>{{ts.trPK('general','religion')}}</ion-label>
<ion-label>
<h3 class="type-label-text-form">
{{ts.trPK('general','religion')}}
</h3>
</ion-label>
<ion-select placeholder="Select One">
<ion-select-option value="i">Islam</ion-select-option>
<ion-select-option value="o">Other</ion-select-option>
@ -296,7 +351,11 @@
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label>{{ts.trPK('general','education-level')}}</ion-label>
<ion-label>
<h3 class="type-label-text-form">
{{ts.trPK('general','education-level')}}
</h3>
</ion-label>
<ion-select placeholder="Select One">
<ion-select-option value="u">University</ion-select-option>
<ion-select-option value="o">other</ion-select-option>
@ -307,62 +366,62 @@
</ion-card-content>
</ion-card>
<ion-card *ngIf="addressSegment">
<ion-card *ngIf="addressSegment" [ngClass]="direction === 'ltr'? 'card-size-info-en': 'card-size-info-ar' ">
<ion-card-content *ngIf="!editAddress">
<ion-grid>
<ion-row>
<ion-col size="10">
<ion-label>
<h1 style="color: black;">{{ts.trPK('general','main-address')}}</h1>
<h1 class="header-label-text-form">{{ts.trPK('general','main-address')}}</h1>
</ion-label>
</ion-col>
<ion-col size="2">
<img style="width: 70%;border: 1px solid;border-radius: 15px;" src="../assets/imgs/edit_icon.png"
<img style="width: 70%;" src="../assets/imgs/profile-icons/editing@2x.png"
(click)="allowEdit(2)">
</ion-col>
</ion-row>
</ion-grid>
<br>
<ion-label>
<h3>{{ts.trPK('general','address')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('general','address')}}</h3>
</ion-label>
<h3 style="font-weight: bold;">Riyadh</h3>
<h3 class="result-label-text-form">Riyadh</h3>
<br>
<ion-label>
<h3>{{ts.trPK('general','street')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('general','street')}}</h3>
</ion-label>
<h3 style="font-weight: bold;">-</h3>
<h3 class="result-label-text-form">-</h3>
<br>
<ion-label>
<h3>{{ts.trPK('general','area')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('general','area')}}</h3>
</ion-label>
<h3 style="font-weight: bold;">-</h3>
<h3 class="result-label-text-form">-</h3>
<br>
<ion-label>
<h3>{{ts.trPK('general','p-o-box')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('general','p-o-box')}}</h3>
</ion-label>
<h3 style="font-weight: bold;">22617</h3>
<h3 class="result-label-text-form">22617</h3>
<br>
<ion-label>
<h3>{{ts.trPK('general','city')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('general','city')}}</h3>
</ion-label>
<h3 style="font-weight: bold;">Riyadh</h3>
<h3 class="result-label-text-form">Riyadh</h3>
<br>
<ion-label>
<h3>{{ts.trPK('general','postal-code')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('general','postal-code')}}</h3>
</ion-label>
<h3 style="font-weight: bold;">11416</h3>
<h3 class="result-label-text-form">11416</h3>
<br>
</ion-card-content>
<ion-card-content *ngIf="editAddress">
<ion-label>
<h1 style="color: black;">{{ts.trPK('general','address')}}</h1>
<h1 class="header-label-text-form">{{ts.trPK('general','address')}}</h1>
</ion-label>
<ion-label>
<h3>{{ts.trPK('general','effective-date')}}</h3>
<h3 class="type-label-text-form">{{ts.trPK('general','effective-date')}}</h3>
</ion-label>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label>MMMM</ion-label>
@ -371,7 +430,11 @@
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label>{{ts.trPK('general','nationality')}}</ion-label>
<ion-label>
<h3 class="type-label-text-form">
{{ts.trPK('general','nationality')}}
</h3>
</ion-label>
<ion-select placeholder="Select One">
<ion-select-option value="mr">Mr</ion-select-option>
<ion-select-option value="ms">Miss</ion-select-option>
@ -380,37 +443,61 @@
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label position="floating">{{ts.trPK('userProfile','address')}}</ion-label>
<ion-label position="floating">
<h3 class="type-label-text-form">
{{ts.trPK('userProfile','address')}}
</h3>
</ion-label>
<ion-input class="login-input" type="text"></ion-input>
</ion-item>
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label position="floating">{{ts.trPK('userProfile','street')}}</ion-label>
<ion-label position="floating">
<h3 class="type-label-text-form">
{{ts.trPK('userProfile','street')}}
</h3>
</ion-label>
<ion-input class="login-input" type="text"></ion-input>
</ion-item>
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label position="floating">{{ts.trPK('userProfile','area')}}</ion-label>
<ion-label position="floating">
<h3 class="type-label-text-form">
{{ts.trPK('userProfile','area')}}
</h3>
</ion-label>
<ion-input class="login-input" type="text"></ion-input>
</ion-item>
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label position="floating">{{ts.trPK('userProfile','p-o-box')}}</ion-label>
<ion-label position="floating">
<h3 class="type-label-text-form">
{{ts.trPK('userProfile','p-o-box')}}
</h3>
</ion-label>
<ion-input class="login-input" type="text"></ion-input>
</ion-item>
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label position="floating">{{ts.trPK('userProfile','city')}}</ion-label>
<ion-label position="floating">
<h3 class="type-label-text-form">
{{ts.trPK('userProfile','city')}}
</h3>
</ion-label>
<ion-input class="login-input" type="text"></ion-input>
</ion-item>
<br>
<ion-item lines="none" class="item-input-login" style="--background: white">
<ion-label position="floating">{{ts.trPK('userProfile','postal-code')}}</ion-label>
<ion-label position="floating">
<h3 class="type-label-text-form">
{{ts.trPK('userProfile','postal-code')}}
</h3>
</ion-label>
<ion-input class="login-input" type="text"></ion-input>
</ion-item>
</ion-card-content>
@ -526,11 +613,11 @@
<ion-grid>
<ion-row>
<ion-col>
<ion-button style="--background: #f44336; background: white; width: 100%;" (click)="disableEdit(1)">Cancel
<ion-button style="--background: #CB3332; background: white; width: 100%;" (click)="disableEdit(1)">Cancel
</ion-button>
</ion-col>
<ion-col>
<ion-button style="--background: #46da59; background: white; width: 100%;" (click)="presentModal()">Update</ion-button>
<ion-button style="--background: #20A169; background: white; width: 100%;" (click)="presentModal()">Update</ion-button>
</ion-col>
</ion-row>
</ion-grid>

@ -970,7 +970,7 @@ $actionBtnSize: 36px;
.header-background-style-card {
padding-top: 1px;
background: #269db8;
height: 15%;
height: 115px;
}
.text-years {
@ -997,7 +997,7 @@ $actionBtnSize: 36px;
.changeImgBtn {
position: absolute;
left: 60%;
bottom: 150%;
bottom: 230%;
}
.changeImgBtn-ar {
position: absolute;
@ -1013,12 +1013,12 @@ $actionBtnSize: 36px;
}
.changeIcon {
bottom: 6px;
width: 10px;
border-radius: 50% !important;
position: relative;
color: #7f8c8d;
height: 35px;
// bottom: 6px;
// width: 10px;
// border-radius: 50% !important;
// position: relative;
// color: #7f8c8d;
// height: 35px;
}
.card-style-details-info {
@ -1039,3 +1039,34 @@ $actionBtnSize: 36px;
.login-input {
border: none;
}
.card-size-info-en{
width: 90%;
left: 2%;
}
.card-size-info-ar{
width: 90%;
right: 2%;
}
.header-label-text-form{
opacity: 1;
color: #2B353E;
font: normal normal 600 20px/30px Poppins;
letter-spacing: -0.8px;
}
.type-label-text-form{
font: normal normal 600 13px/20px Poppins;
letter-spacing: -0.52px;
color: #A2A2A2;
opacity: 1;
}
.result-label-text-form{
font: normal normal 600 16px/25px Poppins;
letter-spacing: -0.64px;
color: #2B353E;
opacity: 1;
}

@ -27,7 +27,7 @@
<ion-grid>
<ion-row>
<ion-col>
<ion-button style=" width: 90%; background: white; --background: #b4b4b4">{{ts.trPK('userProfile','cancel-text')}}</ion-button>
<ion-button style=" width: 90%; background: white; --background: #b4b4b4">{{ts.trPK('eit','cancel-text')}}</ion-button>
</ion-col>
<ion-col>

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="14.004" height="13.318" viewBox="0 0 14.004 13.318">
<path id="Path_4" data-name="Path 4" d="M18.964,10.97a.368.368,0,0,0-.343-.255l-4.738-.1L12.328,6.157a.368.368,0,0,0-.7,0L10.077,10.62l-4.738.1a.368.368,0,0,0-.214.662L8.9,14.231,7.528,18.753a.368.368,0,0,0,.562.409l3.89-2.7,3.89,2.7a.368.368,0,0,0,.562-.409L15.06,14.231l3.775-2.854A.368.368,0,0,0,18.964,10.97Z" transform="translate(-4.978 -5.91)" fill="#259cb8"/>
</svg>

After

Width:  |  Height:  |  Size: 476 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 512 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

@ -1203,6 +1203,10 @@
"en": "CREATE HR REQUEST",
"ar": "انشاء طلب"
},
"HR-Request": {
"en": "HR Request",
"ar": "HR طلبات ال "
},
"performance-evaluation": {
"en": "Performance Evaluation",
"ar": "تقييم الاداء"

Loading…
Cancel
Save