add worklist new design
parent
5b7e435a31
commit
ece6e45d97
@ -0,0 +1,44 @@
|
|||||||
|
<ion-content padding>
|
||||||
|
|
||||||
|
<!--
|
||||||
|
<ion-col col-1
|
||||||
|
style="margin-right: -22px;margin-top: -10px;">
|
||||||
|
<ion-button class="closeIcon" (click)="closeModal()">
|
||||||
|
<img src="../assets/imgs/close.png">
|
||||||
|
|
||||||
|
</ion-button>
|
||||||
|
</ion-col> -->
|
||||||
|
|
||||||
|
|
||||||
|
<ion-list>
|
||||||
|
<ion-radio-group>
|
||||||
|
<ion-list-header style="margin-bottom: 22px !important;">
|
||||||
|
<p class="Header">More Action</p>
|
||||||
|
</ion-list-header>
|
||||||
|
<div *ngFor="let button of actionBtns ">
|
||||||
|
|
||||||
|
<ion-item *ngIf="button.BUTTON_ACTION !='APPROVED' && button.BUTTON_ACTION !='REJECTED' && button.BUTTON_ACTION !='REQUEST_INFO' " >
|
||||||
|
<ion-label class="labelRadio"> {{button.BUTTON_LABEL}}</ion-label>
|
||||||
|
<ion-radio color="secondary" mode="md" value="{{button.BUTTON_ACTION}}" (ionSelect)="radioSelect(button)"></ion-radio>
|
||||||
|
|
||||||
|
<!-- </div> -->
|
||||||
|
</ion-item>
|
||||||
|
</div>
|
||||||
|
</ion-radio-group>
|
||||||
|
|
||||||
|
</ion-list>
|
||||||
|
|
||||||
|
|
||||||
|
<ion-footer>
|
||||||
|
<ion-row class="rowBtn">
|
||||||
|
<ion-button style="width:200px !important" class="confirmBtn" (click)="OkBtnModal()"> {{ts.trPK('general','ok')}}
|
||||||
|
</ion-button>
|
||||||
|
</ion-row>
|
||||||
|
|
||||||
|
<ion-row class="rowBtn">
|
||||||
|
<ion-button style="width:200px !important" class="cancelBtn" (click)="closeModal()"> {{ts.trPK('general','cancel')}}
|
||||||
|
</ion-button>
|
||||||
|
|
||||||
|
</ion-row>
|
||||||
|
</ion-footer>
|
||||||
|
</ion-content>
|
||||||
@ -0,0 +1,22 @@
|
|||||||
|
.rowBtn{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.Header{
|
||||||
|
color: black !important;
|
||||||
|
font-size: 16px !important;
|
||||||
|
font-weight: bold !important;;
|
||||||
|
margin: 0;
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
top: 50%;
|
||||||
|
transform: translate(-58px, 2px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.labelRadio{
|
||||||
|
color: black !important;
|
||||||
|
font-weight: bold !important;
|
||||||
|
}
|
||||||
@ -0,0 +1,27 @@
|
|||||||
|
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
||||||
|
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { MoreActionModalComponent } from './more-action-modal.component';
|
||||||
|
|
||||||
|
describe('MoreActionModalComponent', () => {
|
||||||
|
let component: MoreActionModalComponent;
|
||||||
|
let fixture: ComponentFixture<MoreActionModalComponent>;
|
||||||
|
|
||||||
|
beforeEach(async(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
declarations: [ MoreActionModalComponent ],
|
||||||
|
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
}));
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
fixture = TestBed.createComponent(MoreActionModalComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
@ -0,0 +1,44 @@
|
|||||||
|
import { Component, OnInit } from '@angular/core';
|
||||||
|
import { CommonService } from 'src/app/hmg-common/services/common/common.service';
|
||||||
|
import { ModalController } from '@ionic/angular';
|
||||||
|
import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-more-action-modal',
|
||||||
|
templateUrl: './more-action-modal.component.html',
|
||||||
|
styleUrls: ['./more-action-modal.component.scss'],
|
||||||
|
})
|
||||||
|
export class MoreActionModalComponent implements OnInit {
|
||||||
|
actionBtns :any =[];
|
||||||
|
radioButtonValue: any;
|
||||||
|
constructor( private ts: TranslatorService,private modalCtrl: ModalController, private cs: CommonService){}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
console.log("modal");
|
||||||
|
this.actionBtns = this.cs.sharedService.getSharedData("passActionMore" , false);
|
||||||
|
console.log("modal");
|
||||||
|
|
||||||
|
}
|
||||||
|
closeModal() {
|
||||||
|
this.modalCtrl.dismiss();
|
||||||
|
}
|
||||||
|
|
||||||
|
radioSelect(v) {
|
||||||
|
this.radioButtonValue = v;
|
||||||
|
console.log("radio selected"+v);
|
||||||
|
}
|
||||||
|
|
||||||
|
OkBtnModal() {
|
||||||
|
if (!this.radioButtonValue) {
|
||||||
|
let msg: string = this.ts.trPK("replacementRoll", "msg");
|
||||||
|
this.cs.presentAlert(msg);
|
||||||
|
return;
|
||||||
|
} else {
|
||||||
|
let data = this.radioButtonValue;
|
||||||
|
this.modalCtrl.dismiss(data);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
File diff suppressed because it is too large
Load Diff
@ -1,8 +1,107 @@
|
|||||||
.itemHISBtn{
|
// .itemHISBtn{
|
||||||
padding: 5px;
|
// padding: 5px;
|
||||||
color: var(--light);
|
// color: var(--light);
|
||||||
background: var(--darkgray);
|
// background: var(--darkgray);
|
||||||
border-radius: 3px;
|
// border-radius: 3px;
|
||||||
width: 85%;
|
// width: 85%;
|
||||||
height: 40px;
|
// height: 40px;
|
||||||
}
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// .rowBtn{
|
||||||
|
// display: flex;
|
||||||
|
// flex-direction: row;
|
||||||
|
// justify-content: center;
|
||||||
|
// align-items: center;
|
||||||
|
// background: white;
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// .rowBorder{
|
||||||
|
// border-bottom: solid 0.03cm var(--grayBG);
|
||||||
|
|
||||||
|
// }
|
||||||
|
// .colBorder{
|
||||||
|
// border-right: solid 0.03cm var(--grayBG);
|
||||||
|
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .dateActionHistory{
|
||||||
|
// text-align: end;
|
||||||
|
// // margin-top: -25px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// .actionBtn{
|
||||||
|
// --border-radius: 50% !important;
|
||||||
|
// height: 55px;
|
||||||
|
// width: 55px;
|
||||||
|
// --background: var(--newgreen); // will be dynamic
|
||||||
|
// background: transparent;
|
||||||
|
// margin:10px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .itemAttch{
|
||||||
|
// border-radius: 11px;
|
||||||
|
// margin: 8px;
|
||||||
|
// --min-height: 60px;
|
||||||
|
// --max-height: 60px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .less {
|
||||||
|
// max-height: 54px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .noDataDiv{
|
||||||
|
// background: #ffffff;
|
||||||
|
// height: 11%;
|
||||||
|
// text-align: center;
|
||||||
|
// padding-top: 1px;
|
||||||
|
// border-radius: 10px;
|
||||||
|
// margin: 10px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .container {
|
||||||
|
// font-size: 14px;
|
||||||
|
// line-height: 14px;
|
||||||
|
// height: 15px;
|
||||||
|
// overflow: hidden;
|
||||||
|
// text-align: justify;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .show {
|
||||||
|
// overflow: visible;
|
||||||
|
// height: auto;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .showMore{
|
||||||
|
// padding: 0px;
|
||||||
|
// background: transparent;
|
||||||
|
// color: blue;
|
||||||
|
// text-decoration: underline;
|
||||||
|
// font-size: 14px;
|
||||||
|
// }
|
||||||
|
// .succssfullMSG{
|
||||||
|
// height: 100%;
|
||||||
|
// width: 100%;
|
||||||
|
// background: var(--newgreen);
|
||||||
|
// color: white;
|
||||||
|
// font-weight: bold;
|
||||||
|
// font-size: 20px;
|
||||||
|
// text-align: center;
|
||||||
|
// vertical-align: middle;
|
||||||
|
// padding-top: 30px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .succssfullIcon{
|
||||||
|
// width: 60%;
|
||||||
|
// text-align: center;
|
||||||
|
// height: 60%;
|
||||||
|
// }
|
||||||
|
// .subjectNotification{
|
||||||
|
// text-align: center;
|
||||||
|
// padding-top: 10px;
|
||||||
|
// font-weight: bold;
|
||||||
|
// }
|
||||||
|
|
||||||
@ -1,8 +1,110 @@
|
|||||||
.itemHISBtn{
|
// .itemHISBtn{
|
||||||
padding: 5px;
|
// padding: 5px;
|
||||||
color: var(--light);
|
// color: var(--light);
|
||||||
background: var(--darkgray);
|
// background: var(--darkgray);
|
||||||
border-radius: 3px;
|
// border-radius: 3px;
|
||||||
width: 85%;
|
// width: 85%;
|
||||||
height: 40px;
|
// height: 40px;
|
||||||
}
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// .rowBtn{
|
||||||
|
// display: flex;
|
||||||
|
// flex-direction: row;
|
||||||
|
// justify-content: center;
|
||||||
|
// align-items: center;
|
||||||
|
// background: white;
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// .rowBorder{
|
||||||
|
// border-bottom: solid 0.03cm var(--grayBG);
|
||||||
|
|
||||||
|
// }
|
||||||
|
// .colBorder{
|
||||||
|
// border-right: solid 0.03cm var(--grayBG);
|
||||||
|
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .dateActionHistory{
|
||||||
|
// text-align: end;
|
||||||
|
// // margin-top: -25px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// .actionBtn{
|
||||||
|
// --border-radius: 50% !important;
|
||||||
|
// height: 55px;
|
||||||
|
// width: 55px;
|
||||||
|
// --background: var(--newgreen); // will be dynamic
|
||||||
|
// background: transparent;
|
||||||
|
// margin:10px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .itemAttch{
|
||||||
|
// border-radius: 11px;
|
||||||
|
// margin: 8px;
|
||||||
|
// --min-height: 60px;
|
||||||
|
// --max-height: 60px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .less {
|
||||||
|
// max-height: 54px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .noDataDiv{
|
||||||
|
// background: #ffffff;
|
||||||
|
// height: 11%;
|
||||||
|
// text-align: center;
|
||||||
|
// padding-top: 1px;
|
||||||
|
// border-radius: 10px;
|
||||||
|
// margin: 10px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// .container {
|
||||||
|
// font-size: 14px;
|
||||||
|
// line-height: 14px;
|
||||||
|
// height: 16px;
|
||||||
|
// overflow: hidden;
|
||||||
|
// text-align: justify;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .show {
|
||||||
|
// overflow: visible;
|
||||||
|
// height: auto;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .showMore{
|
||||||
|
// padding: 0px;
|
||||||
|
// background: transparent;
|
||||||
|
// color: blue;
|
||||||
|
// text-decoration: underline;
|
||||||
|
// font-size: 14px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .succssfullMSG{
|
||||||
|
// height: 100%;
|
||||||
|
// width: 100%;
|
||||||
|
// background: var(--newgreen);
|
||||||
|
// color: white;
|
||||||
|
// font-weight: bold;
|
||||||
|
// font-size: 20px;
|
||||||
|
// text-align: center;
|
||||||
|
// vertical-align: middle;
|
||||||
|
// padding-top: 30px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .succssfullIcon{
|
||||||
|
// width: 60%;
|
||||||
|
// text-align: center;
|
||||||
|
// height: 60%;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .subjectNotification{
|
||||||
|
// text-align: center;
|
||||||
|
// padding-top: 10px;
|
||||||
|
// font-weight: bold;
|
||||||
|
// }
|
||||||
|
|
||||||
@ -1,8 +1,106 @@
|
|||||||
.itemHISBtn{
|
// .itemHISBtn{
|
||||||
padding: 5px;
|
// padding: 5px;
|
||||||
color: var(--light);
|
// color: var(--light);
|
||||||
background: var(--darkgray);
|
// background: var(--darkgray);
|
||||||
border-radius: 3px;
|
// border-radius: 3px;
|
||||||
width: 85%;
|
// width: 85%;
|
||||||
height: 40px;
|
// height: 40px;
|
||||||
}
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// .rowBtn{
|
||||||
|
// display: flex;
|
||||||
|
// flex-direction: row;
|
||||||
|
// justify-content: center;
|
||||||
|
// align-items: center;
|
||||||
|
// background: white;
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// .rowBorder{
|
||||||
|
// border-bottom: solid 0.03cm var(--grayBG);
|
||||||
|
|
||||||
|
// }
|
||||||
|
// .colBorder{
|
||||||
|
// border-right: solid 0.03cm var(--grayBG);
|
||||||
|
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .dateActionHistory{
|
||||||
|
// text-align: end;
|
||||||
|
// // margin-top: -25px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// .actionBtn{
|
||||||
|
// --border-radius: 50% !important;
|
||||||
|
// height: 55px;
|
||||||
|
// width: 55px;
|
||||||
|
// --background: var(--newgreen); // will be dynamic
|
||||||
|
// background: transparent;
|
||||||
|
// margin:10px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .itemAttch{
|
||||||
|
// border-radius: 11px;
|
||||||
|
// margin: 8px;
|
||||||
|
// --min-height: 60px;
|
||||||
|
// --max-height: 60px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .less {
|
||||||
|
// max-height: 54px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .noDataDiv{
|
||||||
|
// background: #ffffff;
|
||||||
|
// height: 11%;
|
||||||
|
// text-align: center;
|
||||||
|
// padding-top: 1px;
|
||||||
|
// border-radius: 10px;
|
||||||
|
// margin: 10px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .container {
|
||||||
|
// font-size: 14px;
|
||||||
|
// line-height: 14px;
|
||||||
|
// height: 16px;
|
||||||
|
// overflow: hidden;
|
||||||
|
// text-align: justify;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .show {
|
||||||
|
// overflow: visible;
|
||||||
|
// height: auto;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .showMore{
|
||||||
|
// padding: 0px;
|
||||||
|
// background: transparent;
|
||||||
|
// color: blue;
|
||||||
|
// text-decoration: underline;
|
||||||
|
// font-size: 14px;
|
||||||
|
// }
|
||||||
|
// .succssfullMSG{
|
||||||
|
// height: 100%;
|
||||||
|
// width: 100%;
|
||||||
|
// background: var(--newgreen);
|
||||||
|
// color: white;
|
||||||
|
// font-weight: bold;
|
||||||
|
// font-size: 20px;
|
||||||
|
// text-align: center;
|
||||||
|
// vertical-align: middle;
|
||||||
|
// padding-top: 30px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .succssfullIcon{
|
||||||
|
// width: 60%;
|
||||||
|
// text-align: center;
|
||||||
|
// height: 60%;
|
||||||
|
// }
|
||||||
|
// .subjectNotification{
|
||||||
|
// text-align: center;
|
||||||
|
// padding-top: 10px;
|
||||||
|
// font-weight: bold;
|
||||||
|
// }
|
||||||
@ -1,136 +1,529 @@
|
|||||||
<ion-header >
|
<ion-header *ngIf="!messageSuccess">
|
||||||
<ion-toolbar class="header-toolbar">
|
<ion-toolbar class="header-toolbar">
|
||||||
<ion-title color="light"> {{ts.trPK('worklistMain','title')}}</ion-title>
|
<ion-title color="light"> {{ts.trPK('worklistMain','title')}}</ion-title>
|
||||||
<ion-buttons slot="start">
|
<ion-buttons slot="start">
|
||||||
<nav-buttons backLink="/notification/homepage"></nav-buttons>
|
<nav-buttons backLink="/notification/homepage"></nav-buttons>
|
||||||
</ion-buttons>
|
</ion-buttons>
|
||||||
</ion-toolbar>
|
</ion-toolbar>
|
||||||
</ion-header>
|
</ion-header>
|
||||||
<ion-content>
|
<ion-content *ngIf="!messageSuccess" class="colorBG">
|
||||||
<div *ngIf="pInformation && pInformation != '' " class="tipsPadding">{{pInformation}}</div>
|
|
||||||
|
<!-- add segemnt part -->
|
||||||
<ion-card>
|
<div class="subjectNotification">{{getPassNotificationDetails.SUBJECT}}</div>
|
||||||
<ion-card-header class="boxHdr">
|
<ion-segment [dir]="directionLTR" mode="md" color="secondary" (ionChange)="segmentChanged($event)"
|
||||||
<div class="hrTitle"> {{ts.trPK('worklistMain','info')}} </div>
|
[value]="defaultSegment" class="ion-segment-all">
|
||||||
</ion-card-header>
|
|
||||||
<ion-card-content>
|
|
||||||
<div>
|
<ion-segment-button value="item-req"
|
||||||
<ion-grid>
|
[ngClass]="activeSegment == 'item-req' ? 'active-Segment' : 'normal-Segment'">
|
||||||
<ion-row>
|
{{ts.trPK('worklistMain','title')}}
|
||||||
<ion-col class="colBold">
|
|
||||||
<label for=""> {{ts.trPK('worklistMain','from')}}
|
</ion-segment-button>
|
||||||
|
<ion-segment-button value="action-history"
|
||||||
</label>
|
[ngClass]="activeSegment == 'action-history' ? 'active-Segment' : 'normal-Segment'">
|
||||||
</ion-col>
|
{{'worklistMain, action' | translate}}
|
||||||
<ion-col>
|
</ion-segment-button>
|
||||||
<label for="">{{getPassNotificationDetails.FROM_USER}}</label>
|
|
||||||
</ion-col>
|
<ion-segment-button value="attach" [ngClass]="activeSegment == 'attach' ? 'active-Segment' : 'normal-Segment'">
|
||||||
</ion-row>
|
{{'general, file' | translate}}
|
||||||
|
|
||||||
<ion-row>
|
</ion-segment-button>
|
||||||
<ion-col class="colBold">
|
<ion-segment-button value="info" [ngClass]="activeSegment == 'info' ? 'active-Segment' : 'normal-Segment'">
|
||||||
<label for="">{{ts.trPK('worklistMain','to')}}
|
{{ts.trPK('worklistMain','info')}}
|
||||||
</label>
|
</ion-segment-button>
|
||||||
</ion-col>
|
</ion-segment>
|
||||||
<ion-col>
|
|
||||||
<label for=""> {{getPassNotificationDetails.TO_USER}}</label>
|
|
||||||
</ion-col>
|
|
||||||
</ion-row>
|
|
||||||
|
|
||||||
<ion-row>
|
<div *ngIf="pInformation && pInformation != '' " class="tipsPadding">{{pInformation}}</div>
|
||||||
<ion-col class="colBold">
|
<ng-container *ngIf="activeSegment === 'info'">
|
||||||
<label for="">{{ts.trPK('worklistMain','sent')}}
|
|
||||||
</label>
|
<div *ngIf="notificationBodyRes?.length > 0 ">
|
||||||
</ion-col>
|
<ion-card *ngFor="let item of notificationBodyRes; let i=index ">
|
||||||
<ion-col>
|
|
||||||
<label for="">{{getPassNotificationDetails.BEGIN_DATE}}</label>
|
<!-- <ion-card-header class="boxHdr">
|
||||||
</ion-col>
|
<div class="hrTitle"> {{'worklistMain, notfDetails' | translate}}</div>
|
||||||
</ion-row>
|
</ion-card-header> -->
|
||||||
<ion-row>
|
|
||||||
<ion-col class="colBold">
|
<ion-card-content>
|
||||||
<label for="">{{ts.trPK('worklistMain','closed')}}
|
<div>
|
||||||
</label>
|
|
||||||
</ion-col>
|
<ion-row class="" *ngIf=" item.Collection_Notification.DISPLAY_FLAG != 'N' ">
|
||||||
<ion-col>
|
<ion-col class="rowBorder" *ngFor="let notificationBody of item.Collection_Notification;"
|
||||||
<label for="">{{getPassNotificationDetails.END_DATE}}</label>
|
size="6">
|
||||||
</ion-col>
|
<label class="colItemReq" for="">{{notificationBody.SEGMENT_PROMPT}}</label>
|
||||||
</ion-row>
|
<!-- </ion-col>
|
||||||
<ion-row>
|
<ion-col col-7> -->
|
||||||
<ion-col class="colBold">
|
<br />
|
||||||
<label for="">{{ts.trPK('worklistMain','id')}}
|
<label for="">{{notificationBody.SEGMENT_VALUE_DSP}}</label>
|
||||||
</label>
|
</ion-col>
|
||||||
</ion-col>
|
</ion-row>
|
||||||
<ion-col>
|
</div>
|
||||||
<label for="">{{getPassNotificationDetails.NOTIFICATION_ID}}</label>
|
</ion-card-content>
|
||||||
</ion-col>
|
|
||||||
</ion-row>
|
</ion-card>
|
||||||
<ion-row *ngIf=" getPassNotificationDetails.RESPONDER != '' ">
|
</div>
|
||||||
<ion-col class="colBold">
|
|
||||||
<label for="">{{ts.trPK('worklistMain','responder')}}
|
|
||||||
</label>
|
<div style="margin: 10px; " *ngIf="subordinatesleaveList != undefined">Employee will also on leave </div>
|
||||||
</ion-col>
|
<ion-item class="subOrdinateList" *ngFor="let List of subordinatesleaveList;">
|
||||||
<ion-col>
|
|
||||||
<label for="">{{getPassNotificationDetails.RESPONDER}} </label>
|
|
||||||
</ion-col>
|
|
||||||
</ion-row>
|
<ion-grid class="gridSubordinates">
|
||||||
|
<div class="subOrdinateDiv">
|
||||||
<ion-row>
|
|
||||||
<ion-col class="colBold">
|
<img class="subOrdinateImg" src="../assets/imgs/profile.png"></div>
|
||||||
<label for="">{{ts.trPK('worklistMain','subject')}} </label>
|
|
||||||
</ion-col>
|
<ion-row class="rowHeader subOrdinateRow">
|
||||||
<ion-col>
|
|
||||||
<label for="">{{getPassNotificationDetails.SUBJECT}} </label>
|
<ion-col size="9">
|
||||||
</ion-col>
|
<label style="font-weight: bold; " class="label" for="">{{List.EMPLOYEE_NAME}} </label>
|
||||||
</ion-row>
|
<br />
|
||||||
<ion-row>
|
<label class="label" for="">JOB TITLE DEMO </label><br />
|
||||||
<ion-col class="greenTxt" col-4>
|
</ion-col>
|
||||||
<button ion-button block class="notColBtn" (click)="openNotificationBody()">
|
|
||||||
<p>{{ts.trPK('worklistMain','notfDetails')}} </p>
|
<ion-col class="status" size="3">
|
||||||
<ion-img class="serviceItemImg" src="../assets/imgs/details.png"></ion-img>
|
<label class="label" for="label">{{List.STATUS}}</label>
|
||||||
</button>
|
</ion-col>
|
||||||
</ion-col>
|
</ion-row>
|
||||||
<ion-col class="greenTxt" col-4>
|
<br />
|
||||||
<button ion-button block class="notColBtn" (click)="openActionHistory()">
|
<ion-row class="subOrdinateRow">
|
||||||
<p>{{ts.trPK('worklistMain','actionHis')}}</p>
|
<ion-col>
|
||||||
<ion-img class="serviceItemImg" src="../assets/imgs/actionHistory.png"></ion-img>
|
|
||||||
</button>
|
<label class="label" for="">From</label><br />
|
||||||
</ion-col>
|
<label class="label" for="">{{List.DATE_START |date}}</label>
|
||||||
<ion-col class="greenTxt" col-4>
|
</ion-col>
|
||||||
<button ion-button block class="notColBtn" (click)="openSupportDocuments()">
|
<ion-col>
|
||||||
<p>{{ts.trPK('worklistMain','suppDoc')}}</p>
|
|
||||||
<ion-img class="serviceItemImg" src="../assets/imgs/documents.png"></ion-img>
|
<label class="label" for="">To</label><br />
|
||||||
</button>
|
<label class="label" for="">{{List.DATE_END | date}}</label>
|
||||||
</ion-col>
|
</ion-col>
|
||||||
</ion-row>
|
</ion-row>
|
||||||
</ion-grid>
|
</ion-grid>
|
||||||
|
<!-- </ion-col> -->
|
||||||
</div>
|
</ion-item>
|
||||||
</ion-card-content>
|
<!-- </ion-card-content>
|
||||||
</ion-card>
|
</ion-card> -->
|
||||||
<div>
|
</ng-container>
|
||||||
|
<ng-container *ngIf="activeSegment === 'item-req'">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<ion-card class="cardContent">
|
||||||
|
<!-- <ion-card-header class="boxHdr">
|
||||||
|
<div class="hrTitle"> {{ts.trPK('worklistMain','info')}} </div>
|
||||||
|
</ion-card-header> -->
|
||||||
|
<ion-card-content>
|
||||||
|
<div>
|
||||||
|
<ion-grid style="text-align: left">
|
||||||
|
<ion-row class="rowBorder">
|
||||||
|
<ion-col class="colBorder">
|
||||||
|
<label class="colItemReq" for=""> {{ts.trPK('worklistMain','from')}}
|
||||||
|
|
||||||
|
</label>
|
||||||
|
<br />
|
||||||
|
<!-- </ion-col>
|
||||||
|
<ion-col> -->
|
||||||
|
<label for="">{{getPassNotificationDetails.FROM_USER}}</label>
|
||||||
|
</ion-col>
|
||||||
|
<!-- </ion-row>
|
||||||
|
|
||||||
|
<ion-row> -->
|
||||||
|
<ion-col class="">
|
||||||
|
<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 class="colBorder">
|
||||||
|
<label class="colItemReq" for="">{{ts.trPK('worklistMain','sent')}}
|
||||||
|
</label>
|
||||||
|
<br />
|
||||||
|
<!-- </ion-col>
|
||||||
|
<ion-col> -->
|
||||||
|
<label for="">{{getPassNotificationDetails.BEGIN_DATE}}</label>
|
||||||
|
</ion-col>
|
||||||
|
<!-- </ion-row>
|
||||||
|
<ion-row> -->
|
||||||
|
<ion-col class="">
|
||||||
|
<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 class="">
|
||||||
|
<ion-col class="colBorder">
|
||||||
|
<label class="colItemReq" for="">{{ts.trPK('worklistMain','id')}}
|
||||||
|
</label>
|
||||||
|
<br />
|
||||||
|
<!-- </ion-col>
|
||||||
|
<ion-col> -->
|
||||||
|
<label for="">{{getPassNotificationDetails.NOTIFICATION_ID}}</label>
|
||||||
|
</ion-col>
|
||||||
|
<!-- </ion-row>
|
||||||
|
<ion-row *ngIf=" getPassNotificationDetails.RESPONDER != '' "> -->
|
||||||
|
<ion-col class="">
|
||||||
|
<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 class="">
|
||||||
|
<ion-col class="">
|
||||||
|
<label class="colItemReq" for="">{{ts.trPK('worklistMain','subject')}} </label>
|
||||||
|
</ion-col>
|
||||||
|
<ion-col>
|
||||||
|
<br/>
|
||||||
|
<label for="">{{getPassNotificationDetails.SUBJECT}} </label>
|
||||||
|
</ion-col>
|
||||||
|
</ion-row> -->
|
||||||
|
<!-- <ion-row>
|
||||||
|
<ion-col class="greenTxt" col-4>
|
||||||
|
<button ion-button block class="notColBtn" (click)="openNotificationBody()">
|
||||||
|
<p>{{ts.trPK('worklistMain','notfDetails')}} </p>
|
||||||
|
<ion-img class="serviceItemImg" src="../assets/imgs/details.png"></ion-img>
|
||||||
|
</button>
|
||||||
|
</ion-col>
|
||||||
|
<ion-col class="greenTxt" col-4>
|
||||||
|
<button ion-button block class="notColBtn" (click)="openActionHistory()">
|
||||||
|
<p>{{ts.trPK('worklistMain','actionHis')}}</p>
|
||||||
|
<ion-img class="serviceItemImg" src="../assets/imgs/actionHistory.png"></ion-img>
|
||||||
|
</button>
|
||||||
|
</ion-col>
|
||||||
|
<ion-col class="greenTxt" col-4>
|
||||||
|
<button ion-button block class="notColBtn" (click)="openSupportDocuments()">
|
||||||
|
<p>{{ts.trPK('worklistMain','suppDoc')}}</p>
|
||||||
|
<ion-img class="serviceItemImg" src="../assets/imgs/documents.png"></ion-img>
|
||||||
|
</button>
|
||||||
|
</ion-col>
|
||||||
|
</ion-row> -->
|
||||||
|
</ion-grid>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</ion-card-content>
|
||||||
|
</ion-card>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div *ngIf="submitterInfoRes?.length > 0 ">
|
||||||
|
|
||||||
|
<ion-card>
|
||||||
|
|
||||||
|
<!-- <ion-card-header class="boxHdr">
|
||||||
|
<div class="hrTitle"> {{'general, info' | translate}}</div>
|
||||||
|
</ion-card-header> -->
|
||||||
|
|
||||||
|
<ion-card-content>
|
||||||
|
<div style="font-weight: bold;" class="hrTitle">Employee Detail</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="">{{'userProfile, position' | 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="">{{'userProfile, job' | translate}}</label>
|
||||||
|
<br />
|
||||||
|
<label for="">{{submitterInfo.JOB_NAME}}</label>
|
||||||
|
</ion-col>
|
||||||
|
</ion-row>
|
||||||
|
<ion-row class="rowBorder submitterInfo">
|
||||||
|
<ion-col>
|
||||||
|
<label class="colItemReq" for="">{{'userProfile, 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="">{{'userProfile, orgEmail' | 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="">{{'userProfile, orgName' | translate}}</label>
|
||||||
|
<br />
|
||||||
|
<label for="">{{submitterInfo.ORGANIZATION_NAME}}</label>
|
||||||
|
</ion-col>
|
||||||
|
</ion-row>
|
||||||
|
<ion-row class="rowBorder submitterInfo">
|
||||||
|
<ion-col>
|
||||||
|
<label class="colItemReq" for="">{{'userProfile, busG' | translate}}</label>
|
||||||
|
<br />
|
||||||
|
<label for="">{{submitterInfo.BUSINESS_GROUP_NAME}}</label>
|
||||||
|
</ion-col>
|
||||||
|
</ion-row>
|
||||||
|
<ion-row class="rowBorder submitterInfo">
|
||||||
|
<ion-col>
|
||||||
|
<label class="colItemReq" for="">{{'userProfile, locName' | translate}}</label>
|
||||||
|
<br />
|
||||||
|
|
||||||
|
<label for="">{{submitterInfo.LOCATION_NAME}}</label>
|
||||||
|
</ion-col>
|
||||||
|
</ion-row>
|
||||||
|
<ion-row>
|
||||||
|
<ion-col>
|
||||||
|
<label class="colItemReq" for="">{{'userProfile, payrol' | translate}}</label>
|
||||||
|
<br />
|
||||||
|
|
||||||
|
<label for="">{{submitterInfo.PAYROLL_NAME}}</label>
|
||||||
|
</ion-col>
|
||||||
|
</ion-row>
|
||||||
|
</div>
|
||||||
|
</ion-card-content>
|
||||||
|
|
||||||
|
</ion-card>
|
||||||
|
</div>
|
||||||
|
</ng-container>
|
||||||
|
<ng-container *ngIf="activeSegment === 'action-history'">
|
||||||
|
|
||||||
|
<ion-card class="cardContent">
|
||||||
|
<ion-card-content>
|
||||||
|
|
||||||
|
<div class="noDataDiv" [hidden]="actionHistoryRes && actionHistoryRes.length > 0">
|
||||||
|
<p>{{ 'general, empty' | translate}}</p>
|
||||||
|
</div>
|
||||||
|
<div *ngIf="actionHistoryRes && actionHistoryRes.length > 0 ">
|
||||||
|
<ion-list class="notification-list ">
|
||||||
|
<div class="timeline">
|
||||||
|
<ion-item *ngFor="let actionHistory of actionHistoryRes">
|
||||||
|
|
||||||
|
<div class="timeline-item" slot="start">
|
||||||
|
<div class="timeline-thumb 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>
|
||||||
|
</div>
|
||||||
|
<ion-col>
|
||||||
|
<ion-label style="color:black !important ;font-weight: bold;">
|
||||||
|
{{actionHistory.NAME}}
|
||||||
|
</ion-label>
|
||||||
|
|
||||||
|
<div *ngIf="actionHistory.NOTE != '' ">
|
||||||
|
<div *ngIf="!checkLines(actionHistory.NOTE)">
|
||||||
|
<div class="containerNote">
|
||||||
|
Note: {{actionHistory.NOTE}}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div *ngIf="checkLines(actionHistory.NOTE)">
|
||||||
|
|
||||||
|
<div class="containerNote" [ngClass]="actionHistory.visible ? 'show' : '' ">
|
||||||
|
Note: {{actionHistory.NOTE}}
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<button class="showMore"
|
||||||
|
(click)="actionHistory.visible = !actionHistory.visible">{{ actionHistory.visible ? 'Show less': 'Show More' }}</button>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<ion-label
|
||||||
|
[ngClass]="{'bg-blue-txt' : actionHistory.ACTION === 'Submite' || actionHistory.ACTION === 'Submit' ,'bg-orange-txt' : actionHistory.ACTION === 'Pending' ,'bg-red-txt' : actionHistory.ACTION === 'Reject','bg-green-txt' : actionHistory.ACTION != 'Pending' && actionHistory.ACTION != 'Reject' && actionHistory.ACTION != 'Submitted' && actionHistory.ACTION != 'Submit'}"
|
||||||
|
class=""> {{actionHistory.ACTION}}</ion-label>
|
||||||
|
|
||||||
|
|
||||||
|
<ion-label *ngIf="actionHistory.NOTIFICATION_DATE != ''" class="dateActionHistory">
|
||||||
|
{{actionHistory.NOTIFICATION_DATE| dateString }} </ion-label>
|
||||||
|
</ion-col>
|
||||||
|
<div class="line"></div>
|
||||||
|
</ion-item>
|
||||||
|
</div>
|
||||||
|
</ion-list>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<button ion-button [hidden]="IsReachEnd" class="itemHISBtn" (click)="loadMoreActionHistory()">Load
|
||||||
|
More</button>
|
||||||
|
|
||||||
|
</ion-card-content>
|
||||||
|
</ion-card>
|
||||||
|
|
||||||
|
</ng-container>
|
||||||
|
<ng-container *ngIf="activeSegment === 'attach'">
|
||||||
|
|
||||||
|
<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">
|
||||||
|
<div *ngIf="attachList.FILE_CONTENT_TYPE === 'pdf' || attachList.FILE_CONTENT_TYPE === 'PDF'">
|
||||||
|
<img float-start class="attachImg" src="../assets/imgs/pdf.png">
|
||||||
|
</div>
|
||||||
|
<div *ngIf="attachList.FILE_CONTENT_TYPE === 'txt'"> <img float-start class="attachImg"
|
||||||
|
src="../assets/imgs/doc.png">
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
*ngIf="attachList.FILE_CONTENT_TYPE != 'txt' && attachList.FILE_CONTENT_TYPE != 'PDF' && attachList.FILE_CONTENT_TYPE != 'pdf' && attachList.FILE_CONTENT_TYPE != 'png' && attachList.FILE_CONTENT_TYPE != 'jpeg' && attachList.FILE_CONTENT_TYPE != 'jpg' && attachList.FILE_CONTENT_TYPE != 'PNG' && attachList.FILE_CONTENT_TYPE != 'JPEG' && attachList.FILE_CONTENT_TYPE != 'JPG'">
|
||||||
|
<img float-start class="attachImg" src="../assets/imgs/nonfile.png">
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
*ngIf="attachList.FILE_CONTENT_TYPE === 'png' || attachList.FILE_CONTENT_TYPE === 'jpeg' || attachList.FILE_CONTENT_TYPE === 'jpg'|| attachList.FILE_CONTENT_TYPE === 'PNG' || attachList.FILE_CONTENT_TYPE === 'JPEG'|| attachList.FILE_CONTENT_TYPE === 'JPG'">
|
||||||
|
<img float-start class="attachImg" src="../assets/imgs/img.png">
|
||||||
|
</div>
|
||||||
|
<ion-label>
|
||||||
|
{{attachList.SEQ_NUM }}. {{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>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
|
||||||
|
<div>
|
||||||
|
|
||||||
<!-- ATTRIBUTE_DISPLAY_NAME: "Note"
|
<!-- ATTRIBUTE_DISPLAY_NAME: "Note"
|
||||||
ATTRIBUTE_FORMAT: "4000"
|
ATTRIBUTE_FORMAT: "4000"
|
||||||
ATTRIBUTE_NAME: "WF_NOTE"
|
ATTRIBUTE_NAME: "WF_NOTE"
|
||||||
ATTRIBUTE_TYPE: "VARCHAR2" -->
|
ATTRIBUTE_TYPE: "VARCHAR2" -->
|
||||||
<div id="notificationDynamicFields">
|
<div id="notificationDynamicFields1">
|
||||||
</div>
|
</div>
|
||||||
<!-- <json-schema-form *ngIf="schemaNotific" [form]="schemaNotific" [(ngModel)]="notExampleJsonObject">
|
<!-- <json-schema-form *ngIf="schemaNotific" [form]="schemaNotific" [(ngModel)]="notExampleJsonObject">
|
||||||
</json-schema-form> -->
|
</json-schema-form> -->
|
||||||
</div>
|
</div>
|
||||||
<ion-item *ngIf="notificationButtonRes?.length >0" class="requiredItem">
|
<!-- <ion-item *ngIf="notificationButtonRes?.length >0" class="requiredItem">
|
||||||
<ion-label class="boldTxtNav">{{'actionHis, action' | translate}} </ion-label>
|
<ion-label class="boldTxtNav">{{'actionHis, action' | translate}} </ion-label>
|
||||||
<ion-select okText="{{ts.trPK('general','ok')}}" cancelText="{{ts.trPK('general','cancel')}}" [(ngModel)]="actionType" required >
|
<ion-select okText="{{ts.trPK('general','ok')}}" cancelText="{{ts.trPK('general','cancel')}}"
|
||||||
<ion-select-option value= "{{notificationButtons.BUTTON_ACTION}}" *ngFor="let notificationButtons of notificationButtonRes; let i=index;">{{notificationButtons.BUTTON_LABEL}}</ion-select-option>
|
[(ngModel)]="actionType" required>
|
||||||
</ion-select>
|
<ion-select-option value="{{notificationButtons.BUTTON_ACTION}}"
|
||||||
</ion-item>
|
*ngFor="let notificationButtons of notificationButtonRes; let i=index;">
|
||||||
|
{{notificationButtons.BUTTON_LABEL}}</ion-select-option>
|
||||||
|
</ion-select>
|
||||||
|
</ion-item> -->
|
||||||
|
|
||||||
|
<ion-row>
|
||||||
|
<ion-col col-12>
|
||||||
|
<div id="notificationDynamicFields">
|
||||||
|
</div>
|
||||||
|
</ion-col>
|
||||||
|
</ion-row>
|
||||||
</ion-content>
|
</ion-content>
|
||||||
<ion-footer>
|
<div *ngIf="messageSuccess" class="succssfullMSG">
|
||||||
<div class="centerDiv" >
|
<ion-icon class="succssfullIcon" name="checkmark"></ion-icon>
|
||||||
<ion-button color="customnavy" class="gridBtn" (click)="actionButton()"> {{ts.trPK('general','submit')}}</ion-button>
|
<!--filled-->
|
||||||
</div>
|
<br />
|
||||||
<div class="centerDiv" >
|
<div> Transaction Successful </div>
|
||||||
<ion-button color="customnavy" class="gridBtn" (click)="nextNotfification()">{{'worklistMain, skip' | translate}}</ion-button>
|
</div>
|
||||||
</div>
|
|
||||||
</ion-footer>
|
<ion-footer class="footerSearchBtn" *ngIf="!messageSuccess">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- <ion-row class="rowBtn" *ngIf="notificationButtonRes?.length >0">
|
||||||
|
*ngFor="let notificationButtons of notificationButtonRes; let i=index;">
|
||||||
|
|
||||||
|
<ion-button class="actionBtn" (click)="actionButton(notificationButtons.BUTTON_ACTION)"
|
||||||
|
*ngFor="let notificationButtons of notificationButtonRes | slice:0:3; let i=index;" >
|
||||||
|
{{notificationButtons.BUTTON_LABEL}}
|
||||||
|
</ion-button>
|
||||||
|
|
||||||
|
<ion-button style="--background:orange" class="actionBtn" (click)="nextNotfification()">
|
||||||
|
{{'worklistMain, skip' | translate}}
|
||||||
|
|
||||||
|
</ion-button>
|
||||||
|
<ion-button style="--background:#cccccc;" class="actionBtn" (click)="openMoreActions()">
|
||||||
|
more
|
||||||
|
|
||||||
|
</ion-button>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ion-row> -->
|
||||||
|
<!-- <div class="centerDiv">
|
||||||
|
<ion-button color="customnavy" class="gridBtn" (click)="actionButton()"> {{ts.trPK('general','submit')}}
|
||||||
|
</ion-button>
|
||||||
|
</div>
|
||||||
|
<div class="centerDiv">
|
||||||
|
<ion-button color="customnavy" class="gridBtn" (click)="nextNotfification()">
|
||||||
|
{{'worklistMain, skip' | translate}}</ion-button>
|
||||||
|
</div> -->
|
||||||
|
|
||||||
|
<ion-row class="rowBtn" *ngIf="notificationButtonRes?.length >0">
|
||||||
|
|
||||||
|
<ion-tabs>
|
||||||
|
|
||||||
|
<ion-tab-bar class="tabBar" slot="bottom">
|
||||||
|
<ion-tab-button *ngIf="approveDis" (click)="actionButton('APPROVED')">
|
||||||
|
<img src="../assets/imgs/action-approve.png">
|
||||||
|
<ion-label>Approve</ion-label>
|
||||||
|
</ion-tab-button>
|
||||||
|
|
||||||
|
<ion-tab-button *ngIf="rejectDis" (click)="actionButton('REJECTED')">
|
||||||
|
<img src="../assets/imgs/action-reject.png">
|
||||||
|
<ion-label>Reject</ion-label>
|
||||||
|
</ion-tab-button>
|
||||||
|
|
||||||
|
<ion-tab-button *ngIf="requestDis" (click)="actionButton('REQUEST_INFO')">
|
||||||
|
<img src="../assets/imgs/action-info.png">
|
||||||
|
<ion-label>Request</ion-label>
|
||||||
|
</ion-tab-button>
|
||||||
|
<ion-tab-button (click)="nextNotfification()">
|
||||||
|
<img src="../assets/imgs/action-skip.png">
|
||||||
|
<ion-label>Skip</ion-label>
|
||||||
|
</ion-tab-button>
|
||||||
|
|
||||||
|
<ion-tab-button [disabled]="moreDisabled" (click)="openMoreActions()">
|
||||||
|
<img src="../assets/imgs/action-more.png">
|
||||||
|
<ion-label>More</ion-label>
|
||||||
|
</ion-tab-button>
|
||||||
|
</ion-tab-bar>
|
||||||
|
</ion-tabs>
|
||||||
|
|
||||||
|
</ion-row>
|
||||||
|
|
||||||
|
|
||||||
|
</ion-footer>
|
||||||
@ -0,0 +1,21 @@
|
|||||||
|
import { Pipe, PipeTransform } from '@angular/core';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Generated class for the JsonDatePipe pipe.
|
||||||
|
*
|
||||||
|
* See https://angular.io/api/core/Pipe for more info on Angular Pipes.
|
||||||
|
*/
|
||||||
|
@Pipe({
|
||||||
|
name: 'jsonDate',
|
||||||
|
})
|
||||||
|
export class JsonDatePipe implements PipeTransform {
|
||||||
|
/**
|
||||||
|
* Takes a value and makes it lowercase.
|
||||||
|
*/
|
||||||
|
transform(value: string): any {
|
||||||
|
if(value)
|
||||||
|
return new Date(parseInt(value.substr(6)));
|
||||||
|
else
|
||||||
|
return value;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -1,11 +1,13 @@
|
|||||||
import { NgModule } from '@angular/core';
|
import { NgModule } from '@angular/core';
|
||||||
import { DateStringPipe } from './date-string/date-string';
|
import { DateStringPipe } from './date-string/date-string';
|
||||||
import { FilterLangPipe } from './filter-lang/filter-lang';
|
import { FilterLangPipe } from './filter-lang/filter-lang';
|
||||||
|
import { TurncatePipe } from './turncate/turncate.pipe';
|
||||||
@NgModule({
|
@NgModule({
|
||||||
declarations: [DateStringPipe,
|
declarations: [DateStringPipe,
|
||||||
FilterLangPipe],
|
FilterLangPipe,
|
||||||
|
TurncatePipe],
|
||||||
imports: [],
|
imports: [],
|
||||||
exports: [DateStringPipe,
|
exports: [DateStringPipe,
|
||||||
FilterLangPipe]
|
FilterLangPipe,TurncatePipe]
|
||||||
})
|
})
|
||||||
export class PipesModule {}
|
export class PipesModule {}
|
||||||
|
|||||||
@ -0,0 +1,8 @@
|
|||||||
|
import { TurncatePipe } from './turncate.pipe';
|
||||||
|
|
||||||
|
describe('TurncatePipe', () => {
|
||||||
|
it('create an instance', () => {
|
||||||
|
const pipe = new TurncatePipe();
|
||||||
|
expect(pipe).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
@ -0,0 +1,27 @@
|
|||||||
|
import { Pipe, PipeTransform } from '@angular/core';
|
||||||
|
|
||||||
|
@Pipe({
|
||||||
|
name: 'turncate'
|
||||||
|
})
|
||||||
|
export class TurncatePipe implements PipeTransform {
|
||||||
|
|
||||||
|
transform(value: any, args?: any): any {
|
||||||
|
console.log("args" + args);
|
||||||
|
|
||||||
|
let limit = args.length > 0 ? parseInt(args[0], 10) : 10;
|
||||||
|
let trail = args.length > 1 ? args[1] : '...';
|
||||||
|
|
||||||
|
console.log("limit" + limit);
|
||||||
|
|
||||||
|
console.log("parseInt(args[0], 10)" + parseInt(args[0], 10));
|
||||||
|
console.log("trail" + trail);
|
||||||
|
console.log("limit" + limit);
|
||||||
|
console.log("parseInt(args[0], 10)" + parseInt(args[0], 10));
|
||||||
|
|
||||||
|
return value.length > limit ? value.substring(0, limit) + trail : value; }
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 977 B |
Binary file not shown.
|
After Width: | Height: | Size: 971 B |
Binary file not shown.
|
After Width: | Height: | Size: 801 B |
Binary file not shown.
|
After Width: | Height: | Size: 970 B |
Binary file not shown.
|
After Width: | Height: | Size: 958 B |
Binary file not shown.
|
After Width: | Height: | Size: 8.1 KiB |
Loading…
Reference in New Issue