<ion-header class="theme_dark_bg" [ngClass]="lang=='ar' ? 'ar' : ''">
  <button ion-button class="nav_btn theme_color floatLeft" (click)="goBack()">
     <ion-icon name="ios-arrow-back"></ion-icon>
  </button>
  <div class="nav_header_title floatLeft">{{'coupon.Add Coupons'|translate}}</div>
  <div class="clear"></div>
</ion-header>

<ion-content padding class="cab_coupon_bg" [ngClass]="lang=='ar' ? 'ar' : ''">
  <div class="cab_coupon_wrapper">
		<form [formGroup]="promoForm">
	<div class="cab_coupon_box">
		<input class="cab_coupon_input" placeholder="{{'coupon.Enter Coupon Code'|translate}}" formControlName="promocode">
	</div>
	</form>
	<!-- <p *ngIf="">You don’t seem to have any valid coupons.<br> -->
	<!-- Invite your friends. Unlock free ride coupons</p> -->
	<button ion-button class="cab_coupon_apply" (click)="checkCode()" [disabled]="promoBtn">{{'coupon.Apply'|translate}}</button>
	<div class="cab_coupon_content">
		<p>{{'coupon.Payment Details'|translate}}</p>
		<li>
			<div class="child textLeft">{{'coupon.Total'|translate}}</div>
			<div class="child textRight">₹ {{rate[0]}}</div>
			<div class="clear"></div>
		</li>
		<li>
			<div class="child textLeft">{{'coupon.Discount'|translate}}</div>
			<div class="child textRight" *ngIf="promo.discount.slice(-1)=='%'">{{promo.discount}}</div>
			<div class="child textRight" *ngIf="promo.discount.slice(-1)!='%'">₹ {{promo.discount}}</div>
			<div class="clear"></div>
		</li>
		<li>
			<div class="child textLeft">{{'coupon.Due after service'|translate}}</div>
			<div class="child textRight">₹ {{promo.amount}}</div>
			<div class="clear"></div>
		</li>

	</div>
  </div>
</ion-content>
<ion-footer>
  <div class="cab_footer_btn_bay">
    <button ion-button class="cab_footer_btn floatRight"(click)="pay()">{{'coupon.CONTINUE'|translate}}</button>
    <button ion-button class="cab_footer_btn floatLeft theme_dark_bg" (click)="goBack()">{{'coupon.CANCEL'|translate}}</button>
    <div class="clear"></div>
  </div>
</ion-footer>
