bembeng_pamungkas

<ion-header>
  <ion-navbar color="primary">
    <button ion-button menuToggle class="margin-top-10">
      <ion-icon name="menu"></ion-icon>
    </button>
    <!-- <ion-title>{{pageTitle}}</ion-title> -->
    <!-- <ion-title>{{'gox.shop'|translate}}</ion-title> -->
    <ion-searchbar
      tappable
      readonly
      class="xfood_search"
      placeholder="{{'gox.label_search'|translate}}"
      mode="md"
      (mousedown)="$event.preventDefault()"
      (touchstart)="SearchItem()"></ion-searchbar>
    <ion-buttons style="margin: 0px 5px 0px 0px;" end>
      <button ion-button class="cart_btn" (click)="gotoCart($event)">
        <ion-icon name="cart"></ion-icon>
      </button>
    </ion-buttons>
  </ion-navbar>

  <ion-toolbar color="secondary" no-border-top>
    <ion-segment [(ngModel)]="food_mode" (ionChange)="shopMode($event)">

      <ion-segment-button value="home">
        {{"gox.home" | translate}}
      </ion-segment-button>

      <ion-segment-button value="hot_list">
        {{"gox.hot_list" | translate}}
      </ion-segment-button>

      <!-- <ion-segment-button value="xfood_orders">
        Xfood Orders
      </ion-segment-button> -->

    </ion-segment>

  </ion-toolbar>

  <!-- <div *ngIf="search_show" class="{{searchbar_class}}">
    <ion-row no-padding>
      <ion-col no-padding col-12>
        <ion-searchbar
          tappable
          readonly
          class="xfood_search"
          placeholder="{{'gox.label_search'|translate}}"
          mode="ios"
          (click)="SearchItem()"
          (ionFocus)="SearchItem()"></ion-searchbar>
      </ion-col>
    </ion-row>
  </div> -->
</ion-header>

<ion-content>

  <div [ngSwitch]="food_mode">

    <div *ngSwitchCase="'loading'">
      <div class="ghost_padding"></div>
      <div class="spinner" text-center>
        <ion-spinner name="circles"></ion-spinner>
      </div>
    </div>

    <div *ngSwitchCase="'home'">
      <div class="slider-50 main-slide-container">
        <ion-slides *ngIf=" ad_banner01 && ad_banner01.length && adBannerReady " #slideMain [pager]="true" [speed]="500" [autoplay]="5000" (ionSlideAutoplayStop)="startAutoplay($event, slideMain)" [parallax]="true" [spaceBetween]="25" class="slider-50 enable-pointer">
          <ion-slide *ngFor="let slide of ad_banner01">
              <img *ngIf=" setLang == 'en' " [src]="slide.img" class="slide-image"/>
              <img *ngIf=" setLang == 'km' " [src]="slide.img_km" class="slide-image"/>
              <img *ngIf=" setLang == 'cn' " [src]="slide.img_cn" class="slide-image"/>
          </ion-slide>
        </ion-slides>
        <div class="button-next" (click)="goToSlide('next', slideMain)">
          <ion-icon name="ios-arrow-forward"></ion-icon>
        </div>
        <div class="button-prev" (click)="goToSlide('prev', slideMain)">
          <ion-icon name="ios-arrow-back"></ion-icon>
        </div>
      </div>
      <!-- <div class="slider-50 main-slide-container">
        <ion-slides *ngIf=" ad_banner01 && ad_banner01.length && adBannerReady " #adSlider [pager]="true" [speed]="500" [autoplay]="5000" (ionSlideAutoplayStop)="startAutoplay($event)" [parallax]="true" [spaceBetween]="25" class="slider-50">
          <ion-slide *ngFor="let slide of ad_banner01">
            <img *ngIf=" setLang == 'en' " [src]="slide.img" class="slide-image"/>
            <img *ngIf=" setLang == 'km' " [src]="slide.img_km" class="slide-image"/>
            <img *ngIf=" setLang == 'cn' " [src]="slide.img_cn" class="slide-image"/>
          </ion-slide>
        </ion-slides>
        <div class="button-next" (click)="goToSlide('next', slideMain)">
          <ion-icon name="ios-arrow-forward"></ion-icon>
        </div>
        <div class="button-prev" (click)="goToSlide('prev', slideMain)">
          <ion-icon name="ios-arrow-back"></ion-icon>
        </div>
      </div> -->

      <!-- <ion-card full no-padding>
        <ion-card-header>
        <ion-icon icon-left name="ios-home"></ion-icon>
          {{"gox.label_sort_by_restocat" | translate}}
        </ion-card-header>

        <div *ngIf="loadingRestoCat" text-center>
        <ion-spinner name="circles"></ion-spinner>
        </div>

        <div *ngIf="errorGetDataCat" text-center style="font-size: large; font-weight: bold; padding: 20px;">
          {{"gox.label_error_get_data"|translate}}
        </div>

        <div *ngIf="!loadingRestoCat">
        <ion-list tappable *ngFor="let p of food_menu" (click)="menuCategoryList(p)">
          <ion-item>
            <ion-thumbnail item-left>
              <img class="thumb_xfood" src="{{p.img}}"/>
            </ion-thumbnail>
            <h2 style="text-transform: uppercase;">{{p.name}}</h2>
            <p style="text-transform: uppercase;">{{p.desc}} </p>
              <ion-icon item-right name="ios-arrow-forward"></ion-icon>
          </ion-item>
        </ion-list>
        </div>
      </ion-card> -->

      <ion-card full no-padding>
        <ion-card-header style="font-weight: bold;">
          {{"gox.buy_any_you_need" | translate}}
        </ion-card-header>

        <div text-center>
          <ion-spinner *ngIf="loadingRestoTags" name="circles"></ion-spinner>
        </div>

        <div *ngIf="errorGetDataTags" text-center style="font-size: large; font-weight: bold; padding: 20px;">
          {{"gox.label_error_get_data"|translate}}
        </div>

        <ion-grid *ngIf="!loadingRestoTags" class="food_tags">
          <div class="card-background-page2">
            <ion-row class="row_tags" align-items-center wrap>
              <ion-col class="food_tags" self-align-center col-4 *ngFor="let p of food_menu">
                <ion-card tappable (click)="gotoRestoList(p)" class="card_tags">
                  <!-- <ion-img [src]="p.img"></ion-img> -->
                  <img src="{{p.img}}"/>
                  <!-- <ion-spinner name="circles"></ion-spinner> -->
                  <p class="card-name">{{p.name}}</p>
                </ion-card>
              </ion-col>
            </ion-row>
          </div>
        </ion-grid>
      </ion-card>
    </div>

    <div *ngSwitchCase="'hot_list'">
      <ion-card>

        <ion-card-header>
          Coming Soon
        </ion-card-header>

        <ion-card-content>
          <!-- Add card content here! -->
        </ion-card-content>

      </ion-card>
    </div>
  </div>

</ion-content>