You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
103 lines
4.5 KiB
HTML
103 lines
4.5 KiB
HTML
|
|
<ion-content>
|
|
<div class="head-title">
|
|
|
|
<app-generic-header showImage="false" showBack="true" [headerText]="'general,pending-transaction' | translate">
|
|
</app-generic-header>
|
|
</div>
|
|
<div class="header"></div>
|
|
<div class="bottom"></div>
|
|
<div #containerDiv id="containerDiv">
|
|
<div class="search-header" *ngIf="!transactionDetails">
|
|
<ion-row class="ion-justify-content-center">
|
|
<ion-col [size]="11">
|
|
<div [ngClass]=" direction === 'en' ? 'custom-text-area-element Field-en' : 'custom-text-area-element Field-ar'" >
|
|
<label class="label" position='floating' class="colBold requiredClass">{{ 'general,select' | translate}} </label>
|
|
<select name="selectAbsenceType" class="label-Select" #selectAbsenceType="ngModel" [(ngModel)]="selectedTransaction" required>
|
|
<option value="noType" selected hidden selected><p>{{ts.trPK('absenceList','selectType')}}</p></option>
|
|
<option *ngFor="let transaction of transactions" [value]="transaction.FUNCTION_ID">{{ transaction.FUNCTION_PROMPT}} </option>
|
|
</select>
|
|
</div>
|
|
<!-- </ion-item> -->
|
|
</ion-col>
|
|
</ion-row>
|
|
<div class="date-container">
|
|
<ion-row class="ion-justify-content-center">
|
|
<ion-col [size]="6">
|
|
<ion-item [ngClass]=" direction === 'en' ? 'custom-text-area-element Field-en padding_date' : 'custom-text-area-element padding_date Field-ar'" >
|
|
<div class="date-time-icon date-primary"> <ion-icon name="calendar" class="date-icon"></ion-icon></div>
|
|
|
|
<ion-label>{{ 'general,from-date' | translate}}</ion-label>
|
|
<ion-datetime
|
|
|
|
display-format="DD/MM/YYYY"
|
|
[min]="1900"
|
|
[max]="2100"
|
|
[(ngModel)]="dateFrom"
|
|
[doneText]="'general,done' | translate"
|
|
[cancelText]="'general,cencel' | translate"
|
|
></ion-datetime>
|
|
</ion-item>
|
|
</ion-col>
|
|
<ion-col [size]="6">
|
|
<ion-item [ngClass]=" direction === 'en' ? 'custom-text-area-element padding_date Field-en' : 'custom-text-area-element padding_date Field-ar'" >
|
|
<div class="date-time-icon date-primary"> <ion-icon class="date-icon" name="calendar"></ion-icon></div>
|
|
|
|
<ion-label>{{ 'general,to-date' | translate}}</ion-label>
|
|
<ion-datetime
|
|
placeholder="Select"
|
|
display-format="DD/MM/YYYY"
|
|
[min]="1900"
|
|
[max]="2100"
|
|
[(ngModel)]="dateTo"
|
|
[doneText]="'general,done' | translate"
|
|
[cancelText]="'general,cencel' | translate"
|
|
></ion-datetime>
|
|
</ion-item>
|
|
</ion-col>
|
|
</ion-row>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="data-content">
|
|
<div class="no-dataDiv"
|
|
*ngIf="transactionDetails && transactionDetails.length==0">
|
|
<!-- <div class="no-dataDiv"> -->
|
|
<ion-row>
|
|
<img class="empty-data" src="../assets/imgs/box.png" />
|
|
</ion-row>
|
|
<h4> {{'general, noData' | translate}}</h4>
|
|
</div>
|
|
</div>
|
|
<div *ngIf="transactionDetails && transactionDetails.length>0" class="transaction-list">
|
|
<ion-card *ngFor="let transaction of transactionDetails">
|
|
<div [ngClass]="direction ==='en'? 'date-en':'date-ar'">{{transaction.CREATION_DATE}}</div>
|
|
<ion-label class="ion-text-wrap">
|
|
<ion-text color="primary">
|
|
<p class="display-created bold" >{{'transaction, created-for' | translate}}</p>
|
|
<p class="display-created bold padding">{{transaction.TRANSACTION_CREATED_FOR}}</p>
|
|
</ion-text>
|
|
|
|
<ion-text color="secondary">
|
|
<div class="">
|
|
<p class="color-black display-inline">{{'transaction, request-type' | translate}}</p>
|
|
<p class="display-inline red">{{transaction.REQUEST_TYPE}}</p>
|
|
</div>
|
|
</ion-text>
|
|
</ion-label>
|
|
</ion-card>
|
|
|
|
</div>
|
|
</div>
|
|
</ion-content>
|
|
|
|
<ion-footer>
|
|
<div class="centerDiv">
|
|
<ion-button *ngIf="!transactionDetails" class="footer-button" style="background: var(--newgreen)!important;border-radius: 10px; --background: transparent; width:80%; --border-radius: 10px;" ion-button [disabled]="!isValid()" (click)="getPendingRequestDetails()">
|
|
{{'general, submit' | translate}}</ion-button>
|
|
<ion-button *ngIf="transactionDetails && transactionDetails.length>0" class="footer-button" style="background: var(--newgreen)!important;border-radius: 10px; --background: transparent; width:80%; --border-radius: 10px;" ion-button (click)="transactionDetails=null">
|
|
{{'general, reset' | translate}}</ion-button>
|
|
</div>
|
|
</ion-footer>
|
|
|