Commit 2729467b by Nabil Sadki

Details offre

parent cd027b99
v1.0.8.2
- Add deal detail
- Edit presentation bullets colors
v1.0.8.1
- Add CHANGELOG.md
- Set geolocation param default to true
......
......@@ -6,6 +6,7 @@ const routes: Routes = [
{ path: 'start', loadChildren: './pages/start/start.module#StartPageModule' },
{ path: 'mainslider', loadChildren: './pages/mainslider/mainslider.module#MainsliderPageModule' },
{ path: 'app', loadChildren: './pages/menu/menu.module#MenuPageModule' },
{ path: 'offre-details', loadChildren: './pages/offre-details/offre-details.module#OffreDetailsPageModule' },
];
@NgModule({
......
<ion-header>
<ion-toolbar color="primary">
<ion-buttons slot="start">
<!-- <ion-button menuToggle>
<ion-toolbar color="primary">
<ion-buttons slot="start">
<!-- <ion-button menuToggle>
<ion-icon name="menu" size="large"></ion-icon>
</ion-button> -->
<ion-menu-button>
<!-- <ion-icon name="menu" size="large" color="light"></ion-icon> -->
</ion-menu-button>
</ion-buttons>
<ion-card class="top-card" no-margin>
<ion-card-content no-padding>
<ion-item lines="none">
<ion-label class="text-1x bold text-primary">Catégories</ion-label>
<ion-select cancelText="Fermer" class="text-primary" [(ngModel)]="terms"
(ionChange)="onContextChange($event.id)">
<ion-select-option value="all">- Tout -</ion-select-option>
<ion-select-option *ngFor="let category of _TRIP.cats" [value]="category.id">{{ category.label }}
</ion-select-option>
</ion-select>
</ion-item>
</ion-card-content>
</ion-card>
<ion-buttons slot="end">
<!-- <ion-button (click)="showHideMoreFilters()"> -->
<ion-button>
<!-- <ion-icon name="options"></ion-icon> -->
</ion-button>
</ion-buttons>
<!--<ion-title>-->
<!--<span ion-text>Super promos!</span>-->
<!--<ion-searchbar hidden [(ngModel)]="terms" placeholder="Rechercher"></ion-searchbar>-->
<!--</ion-title>-->
</ion-toolbar>
<ion-grid color="primary" *ngIf="show_more_filters" no-padding>
<!-- <ion-row>
<ion-menu-button>
<!-- <ion-icon name="menu" size="large" color="light"></ion-icon> -->
</ion-menu-button>
</ion-buttons>
<ion-card class="top-card" no-margin>
<ion-card-content no-padding>
<ion-item lines="none">
<ion-label class="text-1x bold text-primary">Catégories</ion-label>
<ion-select cancelText="Fermer" class="text-primary" [(ngModel)]="terms"
(ionChange)="onContextChange($event.id)">
<ion-select-option value="all">- Tout -</ion-select-option>
<ion-select-option *ngFor="let category of _TRIP.cats" [value]="category.id">
{{ category.label }}
</ion-select-option>
</ion-select>
</ion-item>
</ion-card-content>
</ion-card>
<ion-buttons slot="end">
<!-- <ion-button (click)="showHideMoreFilters()"> -->
<ion-button>
<!-- <ion-icon name="options"></ion-icon> -->
</ion-button>
</ion-buttons>
<!--<ion-title>-->
<!--<span ion-text>Super promos!</span>-->
<!--<ion-searchbar hidden [(ngModel)]="terms" placeholder="Rechercher"></ion-searchbar>-->
<!--</ion-title>-->
</ion-toolbar>
<ion-grid color="primary" *ngIf="show_more_filters" no-padding>
<!-- <ion-row>
<ion-col col-12>
<ion-card class="top-card" no-margin>
<ion-card-content no-padding>
......@@ -48,74 +49,75 @@
</ion-card>
</ion-col>
</ion-row>-->
<ion-row no-padding>
<ion-col col-12 no-padding>
<ion-item color="primary">
<ion-label color="light" class="text-1x">Offres Carte Testeur seulement</ion-label>
<ion-toggle checked color="secondary" [(ngModel)]="prm_ctonly" [ngModelOptions]="{standalone: true}"
(ionChange)="_ALLO.setParam('ctonly', 'h')"></ion-toggle>
</ion-item>
</ion-col>
</ion-row>
<ion-row no-padding>
<ion-col col-12 no-padding>
<ion-item color="primary" lines="none">
<ion-label color="light" class="text-1x">Offres populaires</ion-label>
<ion-toggle checked color="secondary" [(ngModel)]="prm_hotdeals" [ngModelOptions]="{standalone: true}"
(ionChange)="_ALLO.setParam('hotdeals', 'j')"></ion-toggle>
</ion-item>
</ion-col>
</ion-row>
</ion-grid>
<ion-row no-padding>
<ion-col col-12 no-padding>
<ion-item color="primary">
<ion-label color="light" class="text-1x">Offres Carte Testeur seulement</ion-label>
<ion-toggle checked color="secondary" [(ngModel)]="prm_ctonly" [ngModelOptions]="{standalone: true}"
(ionChange)="_ALLO.setParam('ctonly', 'h')"></ion-toggle>
</ion-item>
</ion-col>
</ion-row>
<ion-row no-padding>
<ion-col col-12 no-padding>
<ion-item color="primary" lines="none">
<ion-label color="light" class="text-1x">Offres populaires</ion-label>
<ion-toggle checked color="secondary" [(ngModel)]="prm_hotdeals"
[ngModelOptions]="{standalone: true}" (ionChange)="_ALLO.setParam('hotdeals', 'j')">
</ion-toggle>
</ion-item>
</ion-col>
</ion-row>
</ion-grid>
</ion-header>
<ion-content padding class="dashboard">
<ion-refresher (ionRefresh)="doRefresh($event)">
<ion-refresher-content></ion-refresher-content>
</ion-refresher>
<ion-refresher (ionRefresh)="doRefresh($event)">
<ion-refresher-content></ion-refresher-content>
</ion-refresher>
<!--list of trips-->
<ion-card *ngFor="let trip of _TRIP.products | search : terms" (click)="viewDetail(trip.id)" tappable no-margin
margin-bottom>
<div class="img-spinner-wrap ion-text-center">
<ion-spinner name="dots" *ngIf="trip.hidden"></ion-spinner>
</div>
<ion-img [src]="trip.thumb" [class.no-visibility]="trip.hidden" (ionImgDidLoad)="setImgVisible(trip)"></ion-img>
<ion-card-header>
<ion-card-subtitle color="primary">
<ion-icon name="pin"></ion-icon>
<ion-label>{{ trip.location }}</ion-label>
<ion-badge fill="outline" *ngIf="trip.price_adult" color="warning">
-{{ ((trip.price_adult_before - trip.price_adult) * 100) / trip.price_adult_before | number:'1.0-0' }}%
</ion-badge>
</ion-card-subtitle>
<ion-card-title>
{{ trip.name | slice:0:100 }}
</ion-card-title>
</ion-card-header>
<!--list of trips-->
<ion-card *ngFor="let trip of _TRIP.products | search : terms" (click)="viewDetail(trip.id)" tappable no-margin
margin-bottom>
<div class="img-spinner-wrap ion-text-center">
<ion-spinner name="dots" *ngIf="trip.hidden"></ion-spinner>
</div>
<ion-img [src]="trip.thumb" [class.no-visibility]="trip.hidden" (ionImgDidLoad)="setImgVisible(trip)"></ion-img>
<ion-card-header>
<ion-card-subtitle color="primary">
<ion-icon name="pin"></ion-icon>
<ion-label>{{ trip.location }}</ion-label>
<ion-badge fill="outline" *ngIf="trip.price_adult" color="warning">
-{{ ((trip.price_adult_before - trip.price_adult) * 100) / trip.price_adult_before | number:'1.0-0' }}%
</ion-badge>
</ion-card-subtitle>
<ion-card-title>
{{ trip.name | slice:0:100 }}
</ion-card-title>
</ion-card-header>
<!-- <ion-item>
<!-- <ion-item>
<ion-icon name="pin" slot="start"></ion-icon>
<ion-label>{{ trip.location }}</ion-label>
<ion-button fill="outline" slot="end">View</ion-button>
</ion-item> -->
<ion-card-content no-padding padding-horizontal padding-bottom>
{{ trip.description | slice:0:130 }}...
</ion-card-content>
<ion-item *ngIf="trip.price_adult" color="primary" lines="none">
<ion-icon name="cash" slot="start"></ion-icon>
<ion-button slot="end" class="before">
<ion-text color="light">
({{ trip.price_adult_before }} Dh)
</ion-text>
</ion-button>
<ion-button slot="end" color="light">
<ion-text color="primary">
{{ trip.price_adult }} Dh
</ion-text>
</ion-button>
</ion-item>
</ion-card>
<ion-card-content no-padding padding-horizontal padding-bottom>
{{ trip.description | slice:0:130 }}...
</ion-card-content>
<ion-item *ngIf="trip.price_adult" color="primary" lines="none">
<ion-icon name="cash" slot="start"></ion-icon>
<ion-button slot="end" class="before">
<ion-text color="light">
({{ trip.price_adult_before }} Dh)
</ion-text>
</ion-button>
<ion-button slot="end" color="light">
<ion-text color="primary">
{{ trip.price_adult }} Dh
</ion-text>
</ion-button>
</ion-item>
</ion-card>
</ion-content>
\ No newline at end of file
......@@ -2,10 +2,10 @@ import { Component, OnInit } from '@angular/core';
import { NavController, ToastController } from "@ionic/angular";
import { AlloService } from '../../services/allo-service';
import { TripService } from '../../services/trip-service';
// import { TripDetailPage } from "../trip-detail/trip-detail";
import { HTTP } from '@ionic-native/http/ngx';
import { HttpClient, HttpHeaders, HttpErrorResponse } from '@angular/common/http';
import { Storage } from '@ionic/storage';
import { Router } from '@angular/router';
@Component({
selector: 'app-dashboard',
......@@ -26,6 +26,7 @@ export class DashboardPage implements OnInit {
public _TRIP: TripService,
public http: HttpClient,
public toastCtrl: ToastController,
private router: Router,
private storage: Storage
) {
}
......@@ -112,7 +113,6 @@ export class DashboardPage implements OnInit {
// view trip detail
viewDetail(id) {
console.log(id);
// this.nav.push(TripDetailPage, { id: id });
this.router.navigateByUrl('/app/details-offre/' + id);
}
}
......@@ -15,6 +15,10 @@ ion-slides {
right: 20px;
}
}
.swiper-pagination-bullet {
opacity: 0.6 !important;
}
--bullet-background-active: var(--ion-color-light, #ffffff) !important;
}
--bullet-background: #ffffff !important;
--bullet-background-active: var(--ion-color-secondary, #ffffff) !important;
}
\ No newline at end of file
......@@ -36,6 +36,10 @@ const routes: Routes = [
{
path: 'a-propos',
loadChildren: '../a-propos/a-propos.module#AProposPageModule'
},
{
path: 'details-offre/:oid',
loadChildren: '../offre-details/offre-details.module#OffreDetailsPageModule'
}
]
}
......
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';
import { IonicModule } from '@ionic/angular';
import { OffreDetailsPage } from './offre-details.page';
const routes: Routes = [
{
path: '',
component: OffreDetailsPage
}
];
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
RouterModule.forChild(routes)
],
declarations: [OffreDetailsPage]
})
export class OffreDetailsPageModule {}
<ion-header>
<ion-toolbar color="primary">
<ion-buttons slot="start">
<ion-back-button defaultHref="/app/dashboard" text="Retour"></ion-back-button>
</ion-buttons>
<ion-title>
<span ion-text>{{ trip.name }}</span>
</ion-title>
</ion-toolbar>
</ion-header>
<ion-content class="common-bg">
<ion-card *ngIf="trip?.description">
<ion-slides *ngIf="trip?.images" class="to-top" pager>
<ion-slide *ngFor="let image of trip.images">
<img [src]="image" alt="">
</ion-slide>
</ion-slides>
<ion-slides *ngIf="trip?.images?.length < 1" class="to-top" pager>
<img [src]="trip.thumb" alt="">
</ion-slides>
<ion-card-header color="primary">
<ion-card-title>{{ trip.sub_name }}</ion-card-title>
</ion-card-header>
<ion-card-content>
{{ trip.description }}
</ion-card-content>
<ion-list>
<ion-item *ngIf="trip?.brand_adresse">
<ion-icon name="pin" color="primary" slot="start"></ion-icon>
<ion-label>Adresse : {{ trip.brand_adresse }}</ion-label>
</ion-item>
<ion-item href="tel://{{ trip.brand_tel }}" lines="none" *ngIf="trip?.brand_tel">
<ion-icon name="phone-portrait" color="primary" slot="start"></ion-icon>
<ion-label>Tél : {{ trip.brand_tel }}</ion-label>
</ion-item>
</ion-list>
</ion-card>
</ion-content>
\ No newline at end of file
.swiper-wrapper {
max-height: 100vw;
img {
width: 100vw;
}
}
ion-card-header {
font-size: 20px;
}
.deal-title {
margin-top: -50px !important;
position: relative;
z-index: 99999;
}
ul.highlight {
padding-left: 0;
font-size: 1.2rem;
list-style: none;
li {
margin-bottom: 1rem;
}
}
// change text-sm size
.text-sm {
font-size: 1.2rem;
line-height: 2rem;
}
.border-bottom {
p {
text-align: justify;
}
}
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { OffreDetailsPage } from './offre-details.page';
describe('OffreDetailsPage', () => {
let component: OffreDetailsPage;
let fixture: ComponentFixture<OffreDetailsPage>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ OffreDetailsPage ],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(OffreDetailsPage);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
import { Component, OnInit } from '@angular/core';
import { AlloService } from '../../services/allo-service';
import { TripService } from '../../services/trip-service';
import { Storage } from '@ionic/storage';
import { ActivatedRoute } from '@angular/router';
@Component({
selector: 'app-offre-details',
templateUrl: './offre-details.page.html',
styleUrls: ['./offre-details.page.scss'],
})
export class OffreDetailsPage implements OnInit {
// trip info
public trip: any;
// number of adult
public adults = 2;
// number of children
public children = 0;
private oid = null;
constructor(
private activatedRoute: ActivatedRoute,
public _TRIP: TripService,
private _ALLO: AlloService,
private _STOR: Storage) {
this.trip = {};
this._STOR.get('REST_services').then((data) => {
if (data) {
if (null !== data && 'object' === typeof data && data.hasOwnProperty('products')) {
var products = this._ALLO.jsonToArray(data.products);
for (var i = 0; i < products.length; i++) {
if (products[i].id === parseInt(this.oid)) {
this.trip = products[i];
}
}
}
}
});
}
ngOnInit() {
this.oid = this.activatedRoute.snapshot.paramMap.get('oid');
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment