add credit
This commit is contained in:
@@ -6,66 +6,77 @@
|
||||
</ion-button>
|
||||
</ion-buttons>
|
||||
<ion-buttons slot="end">
|
||||
<!-- <ion-button>-->
|
||||
<!-- <ion-icon name="ellipsis-horizontal-circle-outline"></ion-icon>-->
|
||||
<!-- </ion-button>-->
|
||||
</ion-buttons>
|
||||
<ion-title>Add Credit</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<!--<ion-header>-->
|
||||
<!-- <ion-toolbar>-->
|
||||
<!-- <ion-title>{{currency_description}} Wallet</ion-title>-->
|
||||
<!-- </ion-toolbar>-->
|
||||
<!--</ion-header>-->
|
||||
<ion-content>
|
||||
<!-- <div class="bg_image back_image" [style.backgroundImage]="'url(https://www.wrenchboard.com/assets/images/apps/redeem.jpg)'">-->
|
||||
<!-- <div class="ion-padding">-->
|
||||
<!-- <!– <ion-icon slot="start" name="arrow-back" class="back" (click)="onBack()"></ion-icon>–>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<div class="ion-padding">
|
||||
<div class="boxed_contents">
|
||||
<ion-label class="color_text">Current Balance: {{curr_balance| number : '1.2-2'}} {{currency_description}}</ion-label>
|
||||
<div class="items">
|
||||
</div>
|
||||
<ion-label class="color_text"
|
||||
>Current Balance: {{curr_balance| number : '1.2-2'}}
|
||||
{{currency_description}}</ion-label
|
||||
>
|
||||
<div class="items"></div>
|
||||
<div class="about">
|
||||
<div *ngIf="curr_page =='redeem_start'" >
|
||||
<div *ngIf="curr_page =='redeem_start'">
|
||||
<ion-card>
|
||||
<ion-card-header>
|
||||
<ion-card-title>Credit {{currency_code}} Wallet</ion-card-title>
|
||||
<ion-card-title class="top-text">Credit {{currency_code}} Wallet</ion-card-title>
|
||||
<!-- <ion-card-subtitle>Redeem from {{currency_code}} Wallet</ion-card-subtitle>-->
|
||||
</ion-card-header>
|
||||
|
||||
<ion-card-content>
|
||||
|
||||
<div *ngIf="processor == 3030">
|
||||
<ion-grid class="send-grid">
|
||||
<ion-row>
|
||||
<ion-col class="intr">Amount({{currency_code}}) :</ion-col>
|
||||
<ion-col>
|
||||
<ion-input (ionChange)="refreshFee()" type="number" label="Amount(ggg)" placeholder="Enter Amount" [(ngModel)]='amount'></ion-input>
|
||||
<ion-input
|
||||
(ionChange)="refreshFee()"
|
||||
type="number"
|
||||
label="Amount(ggg)"
|
||||
placeholder="Enter Amount"
|
||||
[(ngModel)]="amount"
|
||||
></ion-input>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-col class="intr">Fee :</ion-col>
|
||||
<ion-col>
|
||||
<ion-input label="Fee" type="number" placeholder="0" [(ngModel)]='fee_display' [readonly]="true"></ion-input>
|
||||
<ion-input
|
||||
label="Fee"
|
||||
type="number"
|
||||
placeholder="0"
|
||||
[(ngModel)]="fee_display"
|
||||
[readonly]="true"
|
||||
></ion-input>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-col class="intr">Total :</ion-col>
|
||||
<ion-col>
|
||||
<ion-input label="Total" type="number" placeholder="0" [(ngModel)]='total_display' [readonly]="true"></ion-input>
|
||||
<ion-input
|
||||
label="Total"
|
||||
type="number"
|
||||
placeholder="0"
|
||||
[(ngModel)]="total_display"
|
||||
[readonly]="true"
|
||||
></ion-input>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<ion-button expand="block" shape="round" [disabled]="isDisabled" color="secondary" (click)="contineAddCredit(processor)">Continue</ion-button>
|
||||
<ion-button
|
||||
expand="block"
|
||||
shape="round"
|
||||
[disabled]="isDisabled"
|
||||
color="secondary"
|
||||
(click)="contineAddCredit(processor)"
|
||||
>Continue</ion-button
|
||||
>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
||||
</ion-grid>
|
||||
</div>
|
||||
|
||||
@@ -74,158 +85,153 @@
|
||||
<ion-row>
|
||||
<ion-col class="intr">Amount({{currency_code}}) :</ion-col>
|
||||
<ion-col>
|
||||
<ion-input (ionChange)="refreshFee()" type="number" label="Amount(ggg)" placeholder="Enter Amount" [(ngModel)]='amount'></ion-input>
|
||||
<ion-input
|
||||
(ionChange)="refreshFee()"
|
||||
type="number"
|
||||
label="Amount(ggg)"
|
||||
placeholder="Enter Amount"
|
||||
[(ngModel)]="amount"
|
||||
></ion-input>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-col class="intr">Fee :</ion-col>
|
||||
<ion-col>
|
||||
<ion-input label="Fee" type="number" placeholder="0" [(ngModel)]='fee_display' [readonly]="true"></ion-input>
|
||||
<ion-input
|
||||
label="Fee"
|
||||
type="number"
|
||||
placeholder="0"
|
||||
[(ngModel)]="fee_display"
|
||||
[readonly]="true"
|
||||
></ion-input>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-col class="intr">Total :</ion-col>
|
||||
<ion-col>
|
||||
<ion-input label="Total" type="number" placeholder="0" [(ngModel)]='total_display' [readonly]="true"></ion-input>
|
||||
<ion-input
|
||||
label="Total"
|
||||
type="number"
|
||||
placeholder="0"
|
||||
[(ngModel)]="total_display"
|
||||
[readonly]="true"
|
||||
></ion-input>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<!-- <div class="row">-->
|
||||
<!-- <ion-label class="bg_text">3D Design</ion-label>-->
|
||||
<!-- <div class="rate">-->
|
||||
<!-- <ion-icon name="star-half-outline" color="warning"></ion-icon>-->
|
||||
<!-- <ion-label class="review">4.8 (4478 reviews)</ion-label>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<ion-row>
|
||||
<ion-col>Payment
|
||||
<ion-col
|
||||
>
|
||||
<span class="top-text">Payment</span>
|
||||
<ion-toolbar>
|
||||
<ion-buttons slot="secondary">
|
||||
<ion-button fill="outline" size="small" shape="round" (click)="setCcType(200)">
|
||||
<ion-icon slot="start" name="card" ></ion-icon>
|
||||
Cards
|
||||
<ion-buttons slot="secondary" *ngIf="card_count > 0;">
|
||||
<ion-button
|
||||
fill="outline"
|
||||
size="small"
|
||||
shape="round"
|
||||
(click)="setCcType(200)"
|
||||
>
|
||||
<ion-icon slot="start" name="card"></ion-icon>
|
||||
Cards
|
||||
</ion-button>
|
||||
</ion-buttons>
|
||||
|
||||
<ion-buttons slot="secondary">
|
||||
<ion-button fill="outline" size="small" shape="round" (click)="setCcType(400)">
|
||||
<ion-icon slot="start" name="add-circle" ></ion-icon>
|
||||
<ion-button
|
||||
fill="outline"
|
||||
size="small"
|
||||
shape="round"
|
||||
(click)="setCcType(400)"
|
||||
>
|
||||
<ion-icon slot="start" name="add-circle"></ion-icon>
|
||||
New Card
|
||||
</ion-button>
|
||||
</ion-buttons>
|
||||
</ion-toolbar>
|
||||
|
||||
<!-- <div class="row">-->
|
||||
<!-- <ion-radio-group value="custom-checked" style="margin-left: 20px; font-size: 12px; color: #1e2023;">-->
|
||||
<!-- Previous : <ion-radio value="custom-checked" aria-label="Custom checkbox"></ion-radio>-->
|
||||
<!-- New Card: <ion-radio value="custom" aria-label="Custom checkbox that is checked"></ion-radio>-->
|
||||
<!-- </ion-radio-group>-->
|
||||
|
||||
<!--<!– <ion-label class="bg_text">3D Design</ion-label>–>-->
|
||||
<!--<!– <div class="rate">–>-->
|
||||
<!--<!– –>-->
|
||||
|
||||
<!--<!– <ion-icon name="star-half-outline" color="warning"></ion-icon>–>-->
|
||||
<!--<!– <ion-label class="review">4.8 (4478 reviews)</ion-label>–>-->
|
||||
<!--<!– </div>–>-->
|
||||
<!-- </div>-->
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row *ngIf="card_level==200">
|
||||
<ion-col>
|
||||
<ion-select (ionChange)="refreshFee()" placeholder="Select Payment Card" [(ngModel)]='payment_card' size="block">
|
||||
<ion-select-option value="{{item.card_uid}}" *ngFor="let item of usersCardsData">{{item.description}} **** **** **** {{item.digits}}</ion-select-option>
|
||||
<ion-select
|
||||
(ionChange)="refreshFee()"
|
||||
placeholder="Select Payment Card"
|
||||
[(ngModel)]="payment_card"
|
||||
size="block"
|
||||
>
|
||||
<ion-select-option
|
||||
value="{{item.card_uid}}"
|
||||
*ngFor="let item of usersCardsData"
|
||||
>{{item.description}} **** **** ****
|
||||
{{item.digits}}</ion-select-option
|
||||
>
|
||||
</ion-select>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row *ngIf="card_level==400">
|
||||
<ion-col>
|
||||
|
||||
<ion-item lines="none">
|
||||
<ion-input type="text" placeholder="Card Holder"></ion-input>
|
||||
<ion-input
|
||||
type="text"
|
||||
placeholder="Card Holder"
|
||||
></ion-input>
|
||||
</ion-item>
|
||||
|
||||
<ion-item lines="none">
|
||||
<ion-input type="number" placeholder="Card Number"></ion-input>
|
||||
<ion-input
|
||||
type="number"
|
||||
placeholder="Card Number"
|
||||
maxlength="16"
|
||||
></ion-input>
|
||||
</ion-item>
|
||||
|
||||
<ion-item lines="none">
|
||||
<ion-input type="number" placeholder="Expiry Date"></ion-input>
|
||||
<ion-input
|
||||
type="number"
|
||||
placeholder="Expiry Date"
|
||||
></ion-input>
|
||||
</ion-item>
|
||||
|
||||
<ion-item lines="none">
|
||||
<ion-input type="number" placeholder="CVV"></ion-input>
|
||||
</ion-item>
|
||||
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<ion-button expand="block" shape="round" [disabled]="isDisabled" color="secondary" (click)="contineAddCredit(processor)">Continue</ion-button>
|
||||
<ion-button
|
||||
expand="block"
|
||||
shape="round"
|
||||
[disabled]="isDisabled"
|
||||
color="secondary"
|
||||
(click)="contineAddCredit(processor)"
|
||||
>Continue</ion-button
|
||||
>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
||||
</ion-grid>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- <ion-list>-->
|
||||
<!-- <ion-item>-->
|
||||
<!-- <ion-label>Amount({{currency_code}})</ion-label>-->
|
||||
<!-- <ion-input (ionChange)="refreshFee()" type="number" label="Amount(ggg)" placeholder="Enter Amount" [(ngModel)]='amount'></ion-input>-->
|
||||
<!-- </ion-item>-->
|
||||
|
||||
<!-- <ion-item>-->
|
||||
<!-- <ion-label >Fee</ion-label>-->
|
||||
<!-- <ion-input label="Fee" type="number" placeholder="0" [(ngModel)]='fee_display' [readonly]="true"></ion-input>-->
|
||||
<!-- </ion-item>-->
|
||||
|
||||
<!-- <ion-item>-->
|
||||
<!-- <ion-label>Total</ion-label>-->
|
||||
<!-- <ion-input label="Total" type="number" placeholder="0" [(ngModel)]='total_display' [readonly]="true"></ion-input>-->
|
||||
<!-- </ion-item>-->
|
||||
|
||||
<!--<!– <ion-item>–>-->
|
||||
<!--<!– <ion-select-option value="" >Select Recipient</ion-select-option>–>-->
|
||||
<!--<!–<!– <ion-select placeholder="Select Recipient" [(ngModel)]='recipient' size="block">–>–>-->
|
||||
<!--<!–<!–<!– <ion-select-option value="" >Select Recipient</ion-select-option>–>–>–>-->
|
||||
<!--<!–<!– <ion-select-option value="{{item.recipient_uid}}" *ngFor="let item of myRecipientsData">{{item.recipient}}</ion-select-option>–>–>-->
|
||||
<!--<!–<!– </ion-select>–>–>-->
|
||||
<!--<!–<!– <ion-label>{{recipient_name}}</ion-label>–>–>-->
|
||||
<!--<!– </ion-item>–>-->
|
||||
|
||||
<!-- <div>-->
|
||||
<!-- <ion-select placeholder="Select Recipient" [(ngModel)]='recipient' size="block">-->
|
||||
<!-- <!– <ion-select-option value="" >Select Recipient</ion-select-option>–>-->
|
||||
<!-- <ion-select-option value="{{item.recipient_uid}}" *ngFor="let item of myRecipientsData">{{item.recipient}}</ion-select-option>-->
|
||||
<!-- </ion-select>-->
|
||||
<!-- <ion-label>{{recipient_name}}</ion-label>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- </ion-list>-->
|
||||
|
||||
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
|
||||
<!-- <ion-card>-->
|
||||
<!-- <ion-card-header>-->
|
||||
<!-- <ion-card-title class="top-text">Payment</ion-card-title>-->
|
||||
<!-- </ion-card-header>-->
|
||||
<!-- <ion-card-content>-->
|
||||
<!-- -->
|
||||
<!-- </ion-card-content>-->
|
||||
<!-- </ion-card>-->
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</ion-content>
|
||||
|
||||
<div *ngIf="isModalOpenBackdrop==true">
|
||||
<ion-backdrop [visible]="isModalOpenBackdrop"></ion-backdrop>
|
||||
<ion-modal class="common_modal" [isOpen]="isModalOpen">
|
||||
|
||||
<ng-template>
|
||||
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Confirm Payment</ion-title>
|
||||
@@ -235,7 +241,6 @@
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content class="ion-padding">
|
||||
|
||||
<ion-list class="pop_list">
|
||||
<ion-list-header>
|
||||
<ion-label>Credit {{currency_code}} Wallet</ion-label>
|
||||
@@ -254,26 +259,30 @@
|
||||
</ion-item>
|
||||
<ion-item *ngIf="startCreditResult.card_uid !='' ">
|
||||
<ion-label>Payment: </ion-label>
|
||||
<div>{{selPaymentCard.description}} **** **** {{selPaymentCard.digits}}</div>
|
||||
<div>
|
||||
{{selPaymentCard.description}} **** **** {{selPaymentCard.digits}}
|
||||
</div>
|
||||
</ion-item>
|
||||
|
||||
</ion-list>
|
||||
|
||||
<ion-list class="pop_list" lines="none">
|
||||
<ion-item >
|
||||
<ion-item>
|
||||
<ion-label>Ref Number: </ion-label>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<div>{{startCreditResult.credit_reference}}</div>
|
||||
</ion-item>
|
||||
|
||||
<!-- <ion-item style="background-color: #d9f3d9;" *ngIf="credit_confirmation !='' ">-->
|
||||
<!-- <ion-label>Confirmation: </ion-label>-->
|
||||
<!-- <div>{{credit_confirmation}}</div>-->
|
||||
<!-- </ion-item>-->
|
||||
<!-- <ion-item style="background-color: #d9f3d9;" *ngIf="credit_confirmation !='' ">-->
|
||||
<!-- <ion-label>Confirmation: </ion-label>-->
|
||||
<!-- <div>{{credit_confirmation}}</div>-->
|
||||
<!-- </ion-item>-->
|
||||
</ion-list>
|
||||
|
||||
<div style="background-color: #d9f3d9;" *ngIf="credit_confirmation !='' ">
|
||||
<div
|
||||
style="background-color: #d9f3d9"
|
||||
*ngIf="credit_confirmation !='' "
|
||||
>
|
||||
<ion-list class="pop_list" lines="none">
|
||||
<ion-item>
|
||||
<div>Credit is Successful</div>
|
||||
@@ -285,13 +294,14 @@
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</ion-content>
|
||||
<ion-footer>
|
||||
<ion-toolbar>
|
||||
<ion-button [disabled]="isProcessDisabled" (click)="processPayment(processor)">Complete</ion-button>
|
||||
<ion-button
|
||||
[disabled]="isProcessDisabled"
|
||||
(click)="processPayment(processor)"
|
||||
>Complete</ion-button
|
||||
>
|
||||
</ion-toolbar>
|
||||
</ion-footer>
|
||||
</ng-template>
|
||||
|
||||
@@ -10,6 +10,10 @@ ion-content {
|
||||
ion-card-title{
|
||||
font-size: 18px;
|
||||
}
|
||||
.top-text{
|
||||
font-weight: bolder;
|
||||
color: #8b198e;
|
||||
}
|
||||
.back_image {
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
|
||||
@@ -29,7 +29,7 @@ export class AddcreditPage implements OnInit {
|
||||
card_level:number=200;
|
||||
flutterwave_key:string='';
|
||||
|
||||
|
||||
card_count:number = 0;
|
||||
|
||||
publicKey = "FLWPUBK_TEST-XXXXXXXXX";
|
||||
|
||||
@@ -110,6 +110,10 @@ export class AddcreditPage implements OnInit {
|
||||
this.usersCardsData = this.usersCardsTotalData.result_list;
|
||||
// debugger;
|
||||
console.log("usersCardsData RETURN DATA->", this.usersCardsData);
|
||||
this.card_count = this.usersCardsData.length;
|
||||
if (this.card_count == 0 ){
|
||||
this.setCcType(400);
|
||||
}
|
||||
//this.total_family = this.familyData.length;
|
||||
}
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user