ITG rearrange tabs and skip button fixed

MOHEMM-Q3-DEV-LATEST
enadhilal 5 years ago
parent f75b3b26a3
commit 05647d71ef

@ -5,25 +5,194 @@
<ion-segment mode="md" color="secondary" (ionChange)="segmentChangedClick($event)" [value]="activeSegment"
class="ion-segment-all">
<ion-segment-button value="{{segmentVal.name}}"
<!-- <ion-segment-button value="{{segmentVal.name}}"
[ngClass]="activeSegment == segmentVal.name ? 'active-Segment' : 'normal-Segment'"
*ngFor="let segmentVal of segmentsArray">
<p style="font-size: 11px;">{{segmentVal.name}}</p>
</ion-segment-button> -->
<ion-segment-button value="Request Details"
[ngClass]="activeSegment == 'Request Details' ? 'active-Segment' : 'normal-Segment'">
<p style="font-size: 11px;">Request Details</p>
</ion-segment-button>
<ion-segment-button value="Approval Level"
[ngClass]="activeSegment == 'Approval Level' ? 'active-Segment' : 'normal-Segment'">
<p style="font-size: 11px;">Approval Level</p>
</ion-segment-button>
<ion-segment-button value="Requester Details"
[ngClass]="activeSegment == 'Requester Details' ? 'active-Segment' : 'normal-Segment'">
<p style="font-size: 11px;">Requester Details</p>
</ion-segment-button>
</ion-segment>
<!-- <ion-slides #slides pager="false" (ionSlideDidChange)="slideChanged($event)">
<ion-slides #slides pager="false" (ionSlideDidChange)="slideChanged($event)">
<ion-slide>
<p>SLide 1</p>
<ion-card class="cardContent" *ngIf='activeSegment === "Request Details"' style="width: 100%;">
<ion-card-content>
<ion-grid style="text-align: left" *ngFor='let dataContant of segmentData[0]?.data'>
<ion-row>
<ion-col>
<label class="colItemReq"> {{dataContant.Title}}</label>
<br />
<label *ngIf="dataContant.Value && dataContant.Type != 'table'">{{dataContant.Value}}</label>
<div *ngIf="dataContant.MultipleValue && dataContant.Type == 'list'">
<label *ngFor="let data of dataContant.MultipleValue">{{data}}<br /></label>
</div>
<div *ngIf="dataContant.Value && dataContant.Type =='table'">
<ion-card class="cardContent">
<ion-card-content>
<div *ngFor="let multiData of dataLabelAndValue">
<div *ngFor="let dataAll of multiData">
<div *ngFor="let dataLabel of dataAll">
<label class="colItemReq">{{dataLabel.label}}
<br /></label>
<div *ngIf="dataLabel.isTable =='false'">
<label *ngIf="dataLabel.textvalue">{{dataLabel.textvalue}}
<br /></label>
<label *ngIf="dataLabel.textvalue==''">none
<br /></label>
<br />
</div>
<div *ngIf="dataLabel.isTable == 'true'">
<div *ngFor="let subData of dataLabel.textvalue">
<div>
<label style="font-weight: bold;">{{subData.label}}
<br /></label>
<label>{{subData.textvalue}}
<br /></label>
<br />
</div>
</div>
</div>
</div>
</div>
</div>
</ion-card-content>
</ion-card>
</div>
</ion-col>
</ion-row>
<ion-row *ngIf='dataContant.TableValue'>
<ion-col style="border: 1px solid gainsboro; border-radius: 15px; padding-left: 20px;">
<label class="colItemReq" *ngFor="let header of dataContant.TableValue.Header"><br /> {{header}}</label>
<br />
<label *ngFor="let rows of dataContant.TableValue.Rows"><br />{{rows}}</label>
<label *ngIf="dataContant.TableValue.Rows"><br />none</label>
</ion-col>
</ion-row>
</ion-grid>
</ion-card-content>
</ion-card>
</ion-slide>
<ion-slide>
<p>SLide 2</p>
<ion-card class="cardContent" *ngIf='activeSegment === "Approval Level"'>
<ion-card-content>
<ion-grid>
<ion-row>
<ion-col>
<ion-list class="notification-list" style="margin-left: -30px;" *ngFor="let approvalInfo of workList">
<div class="timeline">
<ion-item>
<div class="timeline-item" slot="start">
<div>
<button ion-button style=" background: none;width: 60%;">
<img src="../assets/imgs/noteSmall.png">
</button>
<div
[ngClass]="{'bg-blue-dot' : approvalInfo.Action === 'Submit', 'bg-green-dot':approvalInfo.Action === 'Approved', 'bg-red-dot':approvalInfo.Action === 'Rejected', 'bg-gray-dot':approvalInfo.Action === 'Pending'}"
[class]="direction == 'en'? 'timeline-thumb-en timeline-icon': 'timeline-thumb-ar timeline-icon'"
[ngClass]="{'bg-gray-dot' : approvalInfo.Action === ''}">
</div>
<p style="margin-left: -0%; font-size: 12px !important; width: 66px;">{{approvalInfo.Action}}</p>
</div>
</div>
<div>
<p style="margin-left: 10%; font-weight: bold;">{{approvalInfo.Name}}</p>
<div *ngIf="approvalInfo.Notes">
<p style="margin-left: 10%;">{{ 'submitAbsence, comments' | translate}}:</p>
<p style="margin-left: 10%;">{{approvalInfo.Notes}}</p>
</div>
</div>
</ion-item>
</div>
</ion-list>
</ion-col>
</ion-row>
</ion-grid>
</ion-card-content>
</ion-card>
</ion-slide>
<ion-slide>
<p>SLide 3</p>
<ion-card class="cardContent" *ngIf='activeSegment === "Requester Details"' style="width: 100%;">
<ion-card-content>
<ion-grid style="text-align: left" *ngFor='let dataContant of segmentData[1]?.data'>
<ion-row>
<ion-col>
<label class="colItemReq"> {{dataContant.Title}}</label>
<br />
<label *ngIf="dataContant.Value && dataContant.Type != 'table'">{{dataContant.Value}}</label>
<div *ngIf="dataContant.MultipleValue && dataContant.Type == 'list'">
<label *ngFor="let data of dataContant.MultipleValue">{{data}}<br /></label>
</div>
<div *ngIf="dataContant.Value && dataContant.Type =='table'">
<ion-card class="cardContent">
<ion-card-content>
<div *ngFor="let multiData of dataLabelAndValue">
<div *ngFor="let dataAll of multiData">
<div *ngFor="let dataLabel of dataAll">
<label class="colItemReq">{{dataLabel.label}}
<br /></label>
<div *ngIf="dataLabel.isTable =='false'">
<label *ngIf="dataLabel.textvalue">{{dataLabel.textvalue}}
<br /></label>
<label *ngIf="dataLabel.textvalue==''">none
<br /></label>
<br />
</div>
<div *ngIf="dataLabel.isTable == 'true'">
<div *ngFor="let subData of dataLabel.textvalue">
<div>
<label style="font-weight: bold;">{{subData.label}}
<br /></label>
<label>{{subData.textvalue}}
<br /></label>
<br />
</div>
</div>
</div>
</div>
</div>
</div>
</ion-card-content>
</ion-card>
</div>
</ion-col>
</ion-row>
<ion-row *ngIf='dataContant.TableValue'>
<ion-col style="border: 1px solid gainsboro; border-radius: 15px; padding-left: 20px;">
<label class="colItemReq" *ngFor="let header of dataContant.TableValue.Header"><br /> {{header}}</label>
<br />
<label *ngFor="let rows of dataContant.TableValue.Rows"><br />{{rows}}</label>
<label *ngIf="dataContant.TableValue.Rows"><br />none</label>
</ion-col>
</ion-row>
</ion-grid>
</ion-card-content>
</ion-card>
</ion-slide>
</ion-slides> -->
<ion-slides #slides (ionSlideDidChange)="slideChanged($event)">
</ion-slides>
<!-- <ion-slides #slides (ionSlideDidChange)="slideChanged($event)">
<ion-slide *ngFor='let segmentContant of segmentData'>
<ion-card class="cardContent" *ngIf='activeSegment === segmentContant.name' style="width: 100%;">
<ion-card-content>
@ -84,6 +253,7 @@
</ion-card-content>
</ion-card>
</ion-slide>
<ion-slide>
<ion-card class="cardContent" *ngIf='activeSegment === "Approval Level"'>
<ion-card-content>
@ -126,7 +296,8 @@
</ion-card-content>
</ion-card>
</ion-slide>
</ion-slides>
</ion-slides> -->
<!-- <div *ngFor='let segmentContant of segmentData'>
<ion-card class="cardContent" *ngIf='activeSegment === segmentContant.name'>
<ion-card-content>

@ -35,7 +35,7 @@ export class WorkListMainItgComponent implements OnInit {
public segmentsArray: { name: string, number: number }[] = [];
public segmentData: { name: string, data: any }[] = [];
public requestDetailsData: { name: string, data: any }[] = [];
public dataLabelAndValue =[];
public dataLabelAndValue = [];
public header: any = [];
public rows: any = [];
public workList: any;
@ -86,20 +86,15 @@ export class WorkListMainItgComponent implements OnInit {
this.request.Comments = this.request_info.Comments;
this.request.NewUserEMPId = this.request_info.NewUserEMPId;
this.workListService.getITGFormDetails(this.request).subscribe((result: any) => {
console.log(this.request);
console.log(result);
this.request_details = result.ITGRequest;
this.grantInfo = result.ITGRequest.GrantFields;
let count =0;
let count = 0;
for (let i = 0; i < result.ITGRequest.FieldGoups.length; i++) {
this.segmentsArray[i] = { name: result.ITGRequest.FieldGoups[i].Title, number: i };
this.segmentData[i] = { name: result.ITGRequest.FieldGoups[i].Title, data: result.ITGRequest.FieldGoups[i].Fields }
for (let j = 0; j < this.segmentData[i].data.length; j++) {
// console.log(this.segmentData[i].data[j])
if(this.segmentData[i].data[j].Type ==="table"){
// console.log(JSON.parse(this.segmentData[i].data[j].Value));
if (this.segmentData[i].data[j].Type === "table") {
this.dataLabelAndValue.push(JSON.parse(this.segmentData[i].data[j].Value))
console.log(this.dataLabelAndValue);
}
// if (this.segmentData[i].data[j].TableValue){
// this.requestDetailsData[count] ={ name:this.segmentData[i].data[j].TableValue.Header,
@ -108,9 +103,9 @@ export class WorkListMainItgComponent implements OnInit {
// }
}
}
console.log(this.dataLabelAndValue)
//console.log(this.requestDetailsData)
this.segmentsArray[this.segmentsArray.length] = { name: 'Approval Level', number: this.segmentsArray.length }
this.segmentsArray[this.segmentsArray.length] = { name: 'Approval Level', number: this.segmentsArray.length };
this.segmentsArray = [this.segmentsArray[1], this.segmentsArray[2], this.segmentsArray[0]];
this.segmentData = [this.segmentData[1], this.segmentData[0]];
this.workList = this.request_details.WFHistory;
this.options = this.request_details.AllowedActions;
this.activeSegment = this.segmentsArray[0].name;
@ -164,12 +159,24 @@ export class WorkListMainItgComponent implements OnInit {
}
public segmentChangedClick(event: any) {
for(let i=0; i< this.segmentsArray.length; i++){
if(this.segmentsArray[i].name === event.detail.value){
this.slides.slideTo(i);
this.activeSegment = event.detail.value;
}
if (event.detail.value === "Request Details") {
this.slides.slideTo(0);
this.activeSegment = event.detail.value;
}
else if (event.detail.value === "Approval Level") {
this.slides.slideTo(1);
this.activeSegment = event.detail.value;
}
else if (event.detail.value === "Requester Details") {
this.slides.slideTo(2);
this.activeSegment = event.detail.value;
}
// for(let i=0; i< this.segmentsArray.length; i++){
// if(this.segmentsArray[i].name === event.detail.value){
// this.slides.slideTo(i);
// this.activeSegment = event.detail.value;
// }
// }
}
slideChanged(event: any) {
@ -179,7 +186,7 @@ export class WorkListMainItgComponent implements OnInit {
}
skip() {
//check if the user clicked on all type of request
// check if the user clicked on all type of request
if (this.is_all_items_sents) {
for (let i = 1; i < this.all_request_names.length; i++) {
for (let j = 0; j < this.all_request_names[i].data.length; j++) {
@ -193,49 +200,42 @@ export class WorkListMainItgComponent implements OnInit {
return false;
} else if (this.index !== this.all_request_names.length) { // if there is another deffernet type.
this.clearDataArray();
this.changeITGForm(this.all_request_names[this.index].data[j], this.all_request_names[this.index].code);
this.changeITGForm(this.all_request_names[this.index].data[0], this.all_request_names[this.index].code);
return false;
}
} else if (this.index === this.all_request_names.length) { //if its the end request redirecte to worklist home
} else if (this.index === this.all_request_names.length) { // if its the end request redirecte to worklist home
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.common.openNotificationPage();
return false;
}
}
}
}
}
//if user clicked on spicific type of ITG request
else {
console.log(this.all_request);
for (let i = 0; i < this.all_request.length; i++) { // search for the request that clicked on all request
console.log("IF statment check the IDs:");
console.log(this.request_info.ID);
console.log(this.all_request[i].ID);
if (this.request_info.ID == this.all_request[i].ID) { // check if the ID for the request is found.
this.index = i + 1;
console.log("value of i: "+i);
console.log("value of index: "+this.index);
if (this.index !== this.all_request.length) { // check if its last one to redirecte to home otherwise to next request.
this.clearDataArray();
console.log(this.all_request[this.index]);
console.log(this.request_name)
this.changeITGForm(this.all_request[this.index], this.request_name);
return;
} else {
console.log("no 1");
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.common.openNotificationPage();
return;
}
}
}
// else {
// console.log("no 2");
// this.common.sharedService.setSharedData(true, 'loadWorkList');
// this.common.openNotificationPage();
// return;
// }
}
}
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.common.openNotificationPage();
return;
}
clearDataArray() {
@ -269,34 +269,31 @@ export class WorkListMainItgComponent implements OnInit {
if (result.MessageStatus != 1) {
this.common.presentAlert(this.ts.trPK('general', 'error-itg'));
} else if (result.MessageStatus == 1) {
console.log("hello action 1");
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.confirmMsg(1)
// this.common.openNotificationPage();
this.skip();
}
} else if (result.MessageStatus == 1) {
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.confirmMsg(1)
// this.common.openNotificationPage();
this.skip();
}
});
} else if (action == 2) {//reject
url = WorkListMainItgComponent.REJECT;
this.workListService.getITGActionRequest(request, url)
.subscribe((result: any) => {
console.log("hello action 2");
if (result.MessageStatus != 1) {
this.common.presentAlert(this.ts.trPK('general', 'error-itg'));
} else if (result.MessageStatus == 1) {
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.confirmMsg(2)
// this.common.openNotificationPage();
this.skip();
}
} else if (result.MessageStatus == 1) {
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.confirmMsg(2)
// this.common.openNotificationPage();
this.skip();
}
});
} else if (action == 3) {//request more info
request.NewUserEMPId = this.replcamentID;
@ -307,21 +304,19 @@ export class WorkListMainItgComponent implements OnInit {
request.Comments = comments;
this.workListService.getITGActionRequest(request, url)
.subscribe((result: any) => {
console.log("hello action 3");
if (result.MessageStatus != 1) {
//this.common.presentAlert(result.Message);
this.common.presentAlert(this.ts.trPK('general', 'error-itg'));
}
if (result.MessageStatus == 1) {
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.confirmMsg(3)
// this.common.openNotificationPage();
this.skip();
}
if (result.MessageStatus == 1) {
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.confirmMsg(3)
// this.common.openNotificationPage();
this.skip();
}
});
}
} else if (action == 4) {//delegate
@ -329,19 +324,17 @@ export class WorkListMainItgComponent implements OnInit {
url = WorkListMainItgComponent.DELEGATE;
this.workListService.getITGActionRequest(request, url)
.subscribe((result: any) => {
console.log("hello action 4");
if (result.MessageStatus != 1) {
this.common.presentAlert(this.ts.trPK('general', 'error-itg'));
} else if (result.MessageStatus == 1) {
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.confirmMsg(4)
// this.common.openNotificationPage();
this.skip();
}
} else if (result.MessageStatus == 1) {
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.confirmMsg(4)
// this.common.openNotificationPage();
this.skip();
}
});
} else if (action == 5) { //answer
url = WorkListMainItgComponent.ANSWER;
@ -350,19 +343,17 @@ export class WorkListMainItgComponent implements OnInit {
} else {
this.workListService.getITGActionRequest(request, url)
.subscribe((result: any) => {
console.log("hello action 5");
if (result.MessageStatus != 1) {
this.common.presentAlert(this.ts.trPK('general', 'error-itg'));
} else if (result.MessageStatus == 1) {
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.confirmMsg(5)
// this.common.openNotificationPage();
this.skip();
}
} else if (result.MessageStatus == 1) {
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.confirmMsg(5)
// this.common.openNotificationPage();
this.skip();
}
});
}
} else if (action == 6) { //grant
@ -375,18 +366,17 @@ export class WorkListMainItgComponent implements OnInit {
request.AdditionalFields = this.grantRequest;
this.workListService.getITGActionRequest(request, url)
.subscribe((result: any) => {
console.log("hello action 6");
if (result.MessageStatus != 1) {
this.common.presentAlert(this.ts.trPK('general', 'error-itg'));
} else if (result.MessageStatus == 1) {
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.confirmMsg(6)
// this.common.openNotificationPage();
this.skip();
}
} else if (result.MessageStatus == 1) {
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.common.presentAlert(this.ts.trPK('worklistMain', 'Tran_Succ'));
this.common.sharedService.setSharedData(true, 'loadWorkList');
this.confirmMsg(6)
// this.common.openNotificationPage();
this.skip();
}
});
} else {
this.common.presentAlert(this.ts.trPK('worklist', 'empty-comment'));
@ -406,7 +396,6 @@ export class WorkListMainItgComponent implements OnInit {
}
confirmMsg(action) {
console.log("confirmMsg");
if (action === 1) {
return this.ts.trPK('worklist', 'approveMsg');
}

Loading…
Cancel
Save