|
|
|
|
<ion-content>
|
|
|
|
|
<div class="head-title">
|
|
|
|
|
<app-generic-header
|
|
|
|
|
showImage="false"
|
|
|
|
|
showMenu="false"
|
|
|
|
|
[headerText]="'itemforsale,title' | translate">
|
|
|
|
|
</app-generic-header>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="segments-container">
|
|
|
|
|
<ion-segment (ionChange)="segmentChanged($event)" value="1" class="item-for-sale-indicator">
|
|
|
|
|
<ion-segment-button value="1" >
|
|
|
|
|
<ion-label>{{ts.trPK('itemforsale','title')}} </ion-label>
|
|
|
|
|
</ion-segment-button>
|
|
|
|
|
<ion-segment-button value="2">
|
|
|
|
|
<ion-label>{{ts.trPK('itemforsale','my-posted-ad')}}</ion-label>
|
|
|
|
|
</ion-segment-button>
|
|
|
|
|
</ion-segment>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="header"></div>
|
|
|
|
|
<div class="bottom"></div>
|
|
|
|
|
|
|
|
|
|
<div class="sales-items" *ngIf="segment =='1'">
|
|
|
|
|
<div class="fab-button">
|
|
|
|
|
<ion-fab-button class="flaot-button" (click)="openSale()"><ion-icon name="add"></ion-icon></ion-fab-button>
|
|
|
|
|
</div>
|
|
|
|
|
<ion-grid>
|
|
|
|
|
<ion-row>
|
|
|
|
|
|
|
|
|
|
<ion-col size="12">
|
|
|
|
|
<ion-item lines="none" class="SearchtextBox">
|
|
|
|
|
<ion-input [placeholder]="'itemforsale,search-items'| translate"></ion-input>
|
|
|
|
|
</ion-item>
|
|
|
|
|
</ion-col>
|
|
|
|
|
</ion-row>
|
|
|
|
|
<ion-row>
|
|
|
|
|
<ion-col size="10">
|
|
|
|
|
<p class="filterText"> {{ts.trPK('itemforsale','browse-categories')}} </p>
|
|
|
|
|
</ion-col>
|
|
|
|
|
<ion-col size="2">
|
|
|
|
|
<img src="assets/imgs/itemsforsale/filter.svg">
|
|
|
|
|
</ion-col>
|
|
|
|
|
</ion-row>
|
|
|
|
|
</ion-grid>
|
|
|
|
|
|
|
|
|
|
<div class="container-icon">
|
|
|
|
|
<div class="box-icon">
|
|
|
|
|
<div class="sale-icon">
|
|
|
|
|
<div class="top">
|
|
|
|
|
<ion-icon name="images"></ion-icon>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="bottom-icon">
|
|
|
|
|
<p>Mobile & Tablets</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="box-icon">
|
|
|
|
|
<div class="sale-icon">
|
|
|
|
|
<div class="top">
|
|
|
|
|
<ion-icon name="images"></ion-icon>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="bottom-icon">
|
|
|
|
|
<p>Mobile & Tablets</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="box-icon">
|
|
|
|
|
<div class="sale-icon">
|
|
|
|
|
<div class="top">
|
|
|
|
|
<ion-icon name="images"></ion-icon>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="bottom-icon">
|
|
|
|
|
<p>Mobile & Tablets</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="box-icon">
|
|
|
|
|
<div class="sale-icon">
|
|
|
|
|
<div class="top">
|
|
|
|
|
<ion-icon name="images"></ion-icon>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="bottom-icon">
|
|
|
|
|
<p>Mobile & Tablets</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="box-icon">
|
|
|
|
|
<div class="sale-icon">
|
|
|
|
|
<div class="top">
|
|
|
|
|
<ion-icon name="images"></ion-icon>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="bottom-icon">
|
|
|
|
|
<p>Mobile & Tablets</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<ion-row>
|
|
|
|
|
<ion-col size="6" (click)="openDetails()">
|
|
|
|
|
<ion-card>
|
|
|
|
|
<ion-card-header>
|
|
|
|
|
<img src="assets/imgs/itemsforsale/furniture.svg" />
|
|
|
|
|
|
|
|
|
|
<ion-card-title>Card Title</ion-card-title>
|
|
|
|
|
</ion-card-header>
|
|
|
|
|
|
|
|
|
|
<ion-card-content>
|
|
|
|
|
Keep close to Nature's heart... and break
|
|
|
|
|
<p class="orange">
|
|
|
|
|
Used
|
|
|
|
|
</p>
|
|
|
|
|
<ion-row>
|
|
|
|
|
<ion-col size="10">
|
|
|
|
|
<strong>
|
|
|
|
|
500 SAR
|
|
|
|
|
</strong>
|
|
|
|
|
</ion-col>
|
|
|
|
|
<ion-col size="2">
|
|
|
|
|
<ion-icon name="arrow-round-forward"></ion-icon>
|
|
|
|
|
</ion-col>
|
|
|
|
|
</ion-row>
|
|
|
|
|
|
|
|
|
|
</ion-card-content>
|
|
|
|
|
</ion-card>
|
|
|
|
|
</ion-col>
|
|
|
|
|
<ion-col size="6">
|
|
|
|
|
<ion-card>
|
|
|
|
|
<ion-card-header>
|
|
|
|
|
<img src="assets/imgs/itemsforsale/furniture.svg" />
|
|
|
|
|
|
|
|
|
|
<ion-card-title>Card Title</ion-card-title>
|
|
|
|
|
</ion-card-header>
|
|
|
|
|
|
|
|
|
|
<ion-card-content>
|
|
|
|
|
Keep close to Nature's heart... and break
|
|
|
|
|
<p class="green">
|
|
|
|
|
New
|
|
|
|
|
</p>
|
|
|
|
|
<ion-row>
|
|
|
|
|
<ion-col size="10">
|
|
|
|
|
<strong>
|
|
|
|
|
500 SAR
|
|
|
|
|
</strong>
|
|
|
|
|
</ion-col>
|
|
|
|
|
<ion-col size="2">
|
|
|
|
|
<ion-icon name="arrow-round-forward"></ion-icon>
|
|
|
|
|
</ion-col>
|
|
|
|
|
</ion-row>
|
|
|
|
|
|
|
|
|
|
</ion-card-content>
|
|
|
|
|
</ion-card>
|
|
|
|
|
</ion-col>
|
|
|
|
|
</ion-row>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="my-ads" *ngIf="segment =='2'">
|
|
|
|
|
<ion-row>
|
|
|
|
|
<ion-item button (click)="testClick()">
|
|
|
|
|
<ion-thumbnail slot="start">
|
|
|
|
|
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
|
|
|
|
|
</ion-thumbnail>
|
|
|
|
|
<ion-label>
|
|
|
|
|
<h3>Furniture Table</h3>
|
|
|
|
|
<p>good condition only 6th month used with bed and mattress</p>
|
|
|
|
|
<ion-row>
|
|
|
|
|
<ion-col size="8">
|
|
|
|
|
<p class="yellow">Pending Review</p>
|
|
|
|
|
</ion-col>
|
|
|
|
|
<ion-col>
|
|
|
|
|
<img class="icon" src="assets/imgs/itemsforsale/delete.svg" />
|
|
|
|
|
<img class="icon edit" src="assets/imgs/itemsforsale/edit.svg" />
|
|
|
|
|
</ion-col>
|
|
|
|
|
</ion-row>
|
|
|
|
|
</ion-label>
|
|
|
|
|
|
|
|
|
|
</ion-item>
|
|
|
|
|
</ion-row>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<ion-footer *ngIf="segment=='2'" >
|
|
|
|
|
<div class="centerDiv">
|
|
|
|
|
<ion-button class="footer-button" ion-button (click)="openSale()">
|
|
|
|
|
{{ts.trPK('itemforsale','create-new-ad')}} </ion-button>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</ion-footer>
|
|
|
|
|
|
|
|
|
|
</ion-content>
|
|
|
|
|
|