<ion-header class="nav_header theme_primary">
  <button class="nav_btn floatLeft" ion-button>
      <ion-icon name="ios-menu" menuToggle></ion-icon>
  </button>
  <div class="nav_header_title floatLeft">
  Offers
  </div>
</ion-header>
<ion-content padding class="">
  <div class="fm_list">
    <div class="fm_list_tab">
     <!---  <ul>
        <li [ngClass]="{'active' : slidertab == 0}" (click)="goToSlide(0)">OPEN</li>
        <li [ngClass]="{'active' : slidertab == 1}" (click)="goToSlide(1)">ACTIVE</li>
        <li [ngClass]="{'active' : slidertab == 2}" (click)="goToSlide(2)">COMPLETED</li>
        <div class="clear"></div>
      </ul> -->
      <ion-slides pager="false" #mySlider class="fm_slide"  (ionSlideDidChange)="slideChanged()">
          <ion-slide class="theme_secondary">
            <button ion-button (click)="addOffers()" class="add_offer theme_lblue floatRight">Add Offer</button>
            <div class="clear"></div>
            <ion-list>
                <ion-item *ngFor="let list_request of request_list" (click)="edit_offers(list_request.id)">
                  <div class="left_image">
                      <img *ngIf="list_request.img" [src]="list_request.img" >
                      <img *ngIf="!list_request.img" src="assets/img/offers_dummy.png"  >
                  </div>
                  <div class="right_details">
                    <h4>{{list_request.service}}</h4>
                    <div class="row">
                        <p><span class="discount">-{{list_request.discount}}%</span></p>
                    </div>
                    <div class="row">
                        <p><span class="strike">€{{list_request.price}}</span><span class="green">€ {{list_request.total_price}}</span></p>
                    </div>
                    <div class="row">
                      <p class="expiry textLeft"><span>expiry date:{{list_request.expiry_date |date: 'd.MM.yy'}}</span></p>
                    </div>
                   
                  </div>
                </ion-item>
              <!-- <ion-item *ngFor="let list_request of request_list" (click)="edit_offers(list_request.id)" >
                <div class="fm_list_left">
                  <div class="fm_list_top">
                    <h4 class="floatLeft">{{list_request.service}}</h4>
                   
                    <div class="clear"></div>
                    <p><strong>Offer Details</strong></p>
                    <ion-row>
                      <ion-col col-6>Price </ion-col>
                      <ion-col col-6>:&nbsp;&nbsp;{{list_request.price}}</ion-col>
                    </ion-row>
                    <ion-row>
                      <ion-col col-6>Discount</ion-col>
                      <ion-col col-6>:&nbsp;&nbsp;{{list_request.discount}}</ion-col>
                    </ion-row>
                  </div>
                  <p class="floatLeft">Expiry Date&nbsp;:&nbsp;{{list_request.expiry_date |date: 'd MMM yy'}} </p>
                  <div class="clear"></div>
                </div>
               <div class="fm_list_right">
                 <div class="fm_list_img floatRight">
                    <img *ngIf="list_request.img" [src]="list_request.img" >
                    <img *ngIf="!list_request.img" src="assets/img/offers_dummy.png"  >
                 </div>
                 <div class="clear"></div>
                 <div class="fm_list_bottom floatLeft">
                    <ul>
                        <li *ngIf="list_request.status==1" class="decision approved floatRight">Approved</li>
                         <li *ngIf="list_request.status==0" class="decision pending floatRight">Pending Approval</li>
                         <div class="clear"></div>
                    </ul>
                  </div>
                </div> 
              </ion-item> -->
                <div class="no_result_found" *ngIf="!request_list" >
                 <div class="no_result_icon">
                    <img src="assets/img/icon4.png">
                 </div>
                 <p>
                    No result found
                 </p>
                </div>
            </ion-list>
          </ion-slide>
        <!---  <ion-slide class="theme_secondary">
            ACTIVE
          </ion-slide>
          <ion-slide class="theme_secondary">
            COMPLETED
          </ion-slide> -->
        </ion-slides>
    </div>
  </div>

</ion-content>
