Skip to content

A
allo-app
Commit fccfd0f7 by Nabil Sadki
Options

Merge branch 'v1.1.0.0' into v1.1.2.0

parents dcc16b9a 12c49ee4
Showing with 581 additions and 131 deletions
CHANGELOG.md
v1.1.0.0
- Add login form
- Optimise launch time
- Fix presentation slider skip transition
- Optimise offers list loading
v1.0.8.3
- Show main slide
......
config.xml
......@@ -93,17 +93,17 @@
<preference name="DisallowOverscroll" value="true" />
<preference name="android-minSdkVersion" value="19" />
<preference name="BackupWebStorage" value="none" />
<preference name="SplashScreenDelay" value="10000" />
<preference name="fullscreen" value="true" />
<preference name="SplashScreenDelay" value="0" />
<preference name="FadeSplashScreen" value="true" />
<preference name="ShowSplashScreen" value="true" />
<preference name="ShowSplashScreen" value="false" />
<preference name="ShowSplashScreenSpinner" value="false" />
<preference name="FadeSplashScreenDuration" value="600" />
<preference name="SplashScreenBackgroundColor" value="0xFFFFFFFF" />
<preference name="SplashScreen" value="screen" />
<preference name="SplashMaintainAspectRatio" value="true" />
<preference name="fullscreen" value="true" />
<preference name="SplashShowOnlyFirstTime" value="false" />
<feature name="StatusBar">
<param name="ios-package" onload="true" value="CDVStatusBar" />
</feature>
<preference name="SplashShowOnlyFirstTime" value="false" />
</widget>
src/app/app-routing.module.ts
......@@ -4,10 +4,10 @@ import { PreloadAllModules, RouterModule, Routes } from '@angular/router';
const routes: Routes = [
{ path: '', redirectTo: 'mainslider', pathMatch: 'full' },
{ path: 'start', loadChildren: './pages/start/start.module#StartPageModule' },
{ path: 'login', loadChildren: './pages/login/login.module#LoginPageModule' },
{ path: 'login', loadChildren: './pages/compte/login/login.module#LoginPageModule' },
{ 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' },
{ path: 'offre-details', loadChildren: './pages/offres/offre-details/offre-details.module#OffreDetailsPageModule' },
];
@NgModule({
......
src/app/app.component.ts
......@@ -15,6 +15,9 @@ import { TripService } from './services/trip-service';
templateUrl: 'app.component.html'
})
export class AppComponent {
public appStarted = false;
constructor(
public LN: LocalNotifications,
private platform: Platform,
......@@ -29,6 +32,7 @@ export class AppComponent {
initializeApp() {
this.platform.ready().then(() => {
this.appStarted = true;
this.statusBar.styleDefault();
this.splashScreen.hide();
......
src/app/app.scss
......@@ -29,3 +29,19 @@
color: var(--ion-color-light, #ffffff) !important;
}
}
div.start {
background: #f93129;
width: 100vw;
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
transition: .5s;
ion-img {
width: 20vw;
}
ion-spinner {
transform: scale(3);
}
}
\ No newline at end of file
src/app/pages/login/login.page.ts → src/app/pages/compte/login/login.page.ts
import { Component, OnInit } from '@angular/core';
import { Validators, FormBuilder, FormGroup, FormControl } from '@angular/forms';
import { AlloService } from '../../services/allo-service';
import { AlloService } from '../../../services/allo-service';
import { Storage } from '@ionic/storage';
import { Router } from '@angular/router';
import { GooglePlus } from '@ionic-native/google-plus/ngx';
......
src/app/pages/mainslider/mainslider.page.html
<ion-content>
<ion-slides #mainSlider pager="true">
<ion-slide color="primary" padding>
<ion-content color="primary">
<ion-slides #mainSlider [options]="slideOpts" pager="true" [hidden]="hideSlider">
<ion-slide padding>
<ion-item lines="none" color="primary" class="skip">
<ion-button fill="outline" color="light" (click)="skipPresentation($event)">
Passer <ion-icon name="arrow-dropright-circle" slot="end"></ion-icon>
......@@ -9,7 +9,7 @@
<ion-grid>
<ion-row>
<ion-col>
<ion-img src="assets/img/mainslider/0.png"></ion-img>
<img src="assets/img/mainslider/0.png" />
</ion-col>
</ion-row>
<ion-row>
......@@ -67,7 +67,7 @@
<ion-grid>
<ion-row>
<ion-col>
<ion-img src="assets/img/mainslider/1.png"></ion-img>
<img src="assets/img/mainslider/1.png" />
</ion-col>
</ion-row>
<ion-row>
......@@ -100,7 +100,7 @@
<ion-grid>
<ion-row>
<ion-col>
<ion-img src="assets/img/mainslider/2.png"></ion-img>
<img src="assets/img/mainslider/2.png" />
</ion-col>
</ion-row>
<ion-row>
......@@ -133,7 +133,7 @@
<ion-grid>
<ion-row>
<ion-col>
<ion-img src="assets/img/mainslider/3.png"></ion-img>
<img src="assets/img/mainslider/3.png" />
</ion-col>
</ion-row>
<ion-row>
......@@ -182,7 +182,7 @@
<ion-grid>
<ion-row>
<ion-col>
<ion-img src="assets/img/mainslider/4.png"></ion-img>
<img src="assets/img/mainslider/4.png" />
</ion-col>
</ion-row>
<ion-row>
......
src/app/pages/mainslider/mainslider.page.ts
......@@ -18,9 +18,13 @@ export class MainsliderPage implements OnInit {
@ViewChild(IonSlides) mainSlider: IonSlides;
slideOpts = {
effect: 'flip'
effect: 'fade',
fadeEffect: {
crossFade: true
}
};
public prmMainslider: boolean;
public hideSlider = false;
constructor(
public platform: Platform,
......@@ -69,7 +73,9 @@ export class MainsliderPage implements OnInit {
skipPresentation($event) {
this.mainSlider.getActiveIndex().then(index => {
this.mainSlider.slideTo(4);
this.hideSlider = true;
this.mainSlider.slideTo(4, 1000);
this.hideSlider = false;
});
}
......
src/app/pages/menu/menu.module.ts
......@@ -19,11 +19,11 @@ const routes: Routes = [
children: [
{
path: 'dashboard',
loadChildren: '../dashboard/dashboard.module#DashboardPageModule'
loadChildren: '../offres/dashboard/dashboard.module#DashboardPageModule'
},
{
path: 'partenaires',
loadChildren: '../partenaires/partenaires.module#PartenairesPageModule'
loadChildren: '../partenaires/partenaires/partenaires.module#PartenairesPageModule'
},
{
path: 'params',
......@@ -39,11 +39,11 @@ const routes: Routes = [
},
{
path: 'details-offre/:oid',
loadChildren: '../offre-details/offre-details.module#OffreDetailsPageModule'
loadChildren: '../offres/offre-details/offre-details.module#OffreDetailsPageModule'
},
{
path: 'profil',
loadChildren: '../profil/profil.module#ProfilPageModule'
loadChildren: '../compte/profil/profil.module#ProfilPageModule'
},
{
path: 'profil-edit',
......
src/app/pages/offres/dashboard/dashboard.module.ts 0 → 100644
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 { DashboardPage } from './dashboard.page';
const routes: Routes = [
{
path: '',
component: DashboardPage,
children: [
{
path: 'offres-carte',
children: [
{
path: '',
loadChildren: '../offres-carte/offres-carte.module#OffresCartePageModule'
}
]
},
{
path: 'offres-tlm',
children: [
{
path: '',
loadChildren: '../offres-tlm/offres-tlm.module#OffresTlmPageModule'
}
]
},
{
path: '',
redirectTo: '/app/dashboard/offres-carte',
pathMatch: 'full'
}
]
}
];
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
RouterModule.forChild(routes)
],
declarations: [DashboardPage]
})
export class DashboardPageModule {}
src/app/pages/dashboard/dashboard.page.html → src/app/pages/offres/dashboard/dashboard.page.html
......@@ -8,20 +8,7 @@
<!-- <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>
......@@ -71,53 +58,18 @@
</ion-grid>
</ion-header>
<ion-content padding class="dashboard">
<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>
<!-- <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-content>
<ion-tabs>
<ion-tab-bar slot="bottom">
<ion-tab-button tab="offres-carte">
<ion-icon name="card"></ion-icon>
<ion-label>Offres Carte Testeur</ion-label>
</ion-tab-button>
<ion-tab-button tab="offres-tlm">
<ion-icon name="people"></ion-icon>
<ion-label>Pour tout le monde</ion-label>
</ion-tab-button>
</ion-tab-bar>
</ion-tabs>
</ion-content>
\ No newline at end of file
src/app/pages/offres/dashboard/dashboard.page.scss 0 → 100644
ion-header {
ion-card {
margin-top: 4px;
}
}
\ No newline at end of file
src/app/pages/offres/dashboard/dashboard.page.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
import { TripService } from '../../../services/trip-service';
@Component({
selector: 'app-dashboard',
templateUrl: './dashboard.page.html',
styleUrls: ['./dashboard.page.scss'],
})
export class DashboardPage implements OnInit {
// list of products
public products: any;
public terms: any;
public show_more_filters = false;
constructor(
public _TRIP: TripService
) {
}
ngOnInit() {
// console.log('ngOnInit Dashboard');
// this._ALLO.presentLoading();
}
showHideMoreFilters() {
if (this.show_more_filters === false) {
this.show_more_filters = true;
} else {
this.show_more_filters = false;
}
}
}
src/app/pages/offre-details/offre-details.page.ts → src/app/pages/offres/offre-details/offre-details.page.ts
import { Component, OnInit } from '@angular/core';
import { AlloService } from '../../services/allo-service';
import { TripService } from '../../services/trip-service';
import { AlloService } from '../../../services/allo-service';
import { TripService } from '../../../services/trip-service';
import { Storage } from '@ionic/storage';
import { ActivatedRoute } from '@angular/router';
......
src/app/pages/offres/offres-carte/offres-carte.module.ts 0 → 100644
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 { SearchPipe } from '../../../pipes/search/search.pipe';
import { OffresCartePage } from './offres-carte.page';
const routes: Routes = [
{
path: '',
component: OffresCartePage
}
];
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
RouterModule.forChild(routes)
],
declarations: [OffresCartePage, SearchPipe]
})
export class OffresCartePageModule {}
src/app/pages/offres/offres-carte/offres-carte.page.html 0 → 100644
<ion-list-header>Catégories :</ion-list-header>
<div class="app">
<ul class="hs" no-margin margin-bottom>
<li *ngFor="let category of _TRIP.cats" class="item">
<ion-chip (click)="_TRIP.filterList(category.id)">
<ion-label>{{ category.label }}</ion-label>
</ion-chip>
</li>
</ul>
</div>
<ion-content padding-horizontal padding-bottom class="dashboard">
<ion-refresher (ionRefresh)="doRefresh($event)">
<ion-refresher-content></ion-refresher-content>
</ion-refresher>
<div *ngIf="_TRIP.filtredProducts.length <= 0">
<ion-card class="skeleton" tappable no-margin margin-bottom>
<ion-skeleton-text class="img" animated></ion-skeleton-text>
<ion-card-header>
<ion-card-subtitle color="primary">
<ion-skeleton-text style="width: 80%" animated></ion-skeleton-text>
</ion-card-subtitle>
<ion-card-title>
<ion-skeleton-text style="height: 20px" animated></ion-skeleton-text>
</ion-card-title>
</ion-card-header>
<ion-card-content no-padding padding-horizontal padding-bottom>
<ion-skeleton-text style="width: 80%" animated></ion-skeleton-text>
<ion-skeleton-text animated></ion-skeleton-text>
<ion-skeleton-text style="width: 80%" animated></ion-skeleton-text>
<ion-skeleton-text style="width: 50%" animated></ion-skeleton-text>
</ion-card-content>
</ion-card>
<ion-card class="skeleton" tappable no-margin margin-bottom>
<ion-skeleton-text class="img" animated></ion-skeleton-text>
<ion-card-header>
<ion-card-subtitle color="primary">
<ion-skeleton-text style="width: 80%" animated></ion-skeleton-text>
</ion-card-subtitle>
<ion-card-title>
<ion-skeleton-text style="height: 20px" animated></ion-skeleton-text>
</ion-card-title>
</ion-card-header>
<ion-card-content no-padding padding-horizontal padding-bottom>
<ion-skeleton-text style="width: 80%" animated></ion-skeleton-text>
<ion-skeleton-text animated></ion-skeleton-text>
<ion-skeleton-text style="width: 80%" animated></ion-skeleton-text>
<ion-skeleton-text style="width: 50%" animated></ion-skeleton-text>
</ion-card-content>
</ion-card>
</div>
<ion-card *ngFor="let trip of _TRIP.offersCardList" (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-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-infinite-scroll threshold="100px" (ionInfinite)="loadData($event)">
<ion-infinite-scroll-content loadingSpinner="bubbles" loadingText="Chargement...">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</ion-content>
\ No newline at end of file
src/app/pages/dashboard/dashboard.page.scss → src/app/pages/offres/offres-carte/offres-carte.page.scss
ion-header {
ion-card {
margin-top: 4px;
}
}
.dashboard {
ion-card {
ion-skeleton-text.img {
margin: 0 !important;
min-height: 160px;
}
ion-badge {
float: right;
margin-top: -36px;
width: 18vw;
height: 8vw;
font-size: large;
display: flex;
align-items: center;
justify-content: center;
}
ion-img {
min-height: 10rem;
......@@ -38,3 +40,78 @@ ion-header {
min-height: 10rem;
padding-top: 4.5rem;
}
div[scrollx="true"],
div[scrolly="true"] {
position: relative;
overflow: hidden;
::-webkit-scrollbar {
display: none;
}
}
div[scrollx="true"] {
overflow-x: auto;
}
div[scrolly="true"] {
overflow-y: auto;
}
.app {
padding: 0;
display: grid;
grid-gap: 20px 0;
// grid-template-columns: 20px 1fr 20px;
align-content: start;
}
.app > * {
grid-column: 2 / -2;
}
.app > .full {
grid-column: 1 / -1;
}
.hs {
display: grid;
// grid-gap: calc(20px / 2);
grid-template-columns: repeat(9999999, auto);
// grid-template-rows: minmax(150px, 1fr);
overflow-x: scroll;
scroll-snap-type: x proximity;
// padding-bottom: calc(.75 * 20px);
// margin-bottom: calc(-.25 * 20px);
}
/* Demo styles */
ion-content {
display: grid;
place-items: center;
// background: #456173;
}
ul {
list-style: none;
padding: 0;
}
.app {
// background: #DBD0BC;
overflow-y: scroll;
}
.hs > li,
.item {
scroll-snap-align: center;
// padding: calc(20px / 2 * 1.5);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background: #fff;
border-radius: 8px;
}
src/app/pages/offres/offres-carte/offres-carte.page.spec.ts 0 → 100644
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { OffresCartePage } from './offres-carte.page';
describe('OffresCartePage', () => {
let component: OffresCartePage;
let fixture: ComponentFixture<OffresCartePage>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ OffresCartePage ],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(OffresCartePage);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/pages/dashboard/dashboard.page.ts → src/app/pages/offres/offres-carte/offres-carte.page.ts
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 { HTTP } from '@ionic-native/http/ngx';
import { HttpClient, HttpHeaders, HttpErrorResponse } from '@angular/common/http';
import { Component, OnInit, ViewChild } from '@angular/core';
import { ToastController, IonInfiniteScroll } from '@ionic/angular';
import { AlloService } from '../../../services/allo-service';
import { TripService } from '../../../services/trip-service';
import { Storage } from '@ionic/storage';
import { Router } from '@angular/router';
@Component({
selector: 'app-dashboard',
templateUrl: './dashboard.page.html',
styleUrls: ['./dashboard.page.scss'],
selector: 'app-offres-carte',
templateUrl: './offres-carte.page.html',
styleUrls: ['./offres-carte.page.scss'],
})
export class OffresCartePage implements OnInit {
@ViewChild(IonInfiniteScroll) infiniteScroll: IonInfiniteScroll;
export class DashboardPage implements OnInit {
// list of products
public products: any;
public toast: any;
public terms: any;
public show_more_filters = false;
constructor(
public nav: NavController,
public _ALLO: AlloService,
public _TRIP: TripService,
public http: HttpClient,
public toastCtrl: ToastController,
private router: Router,
private storage: Storage
) {
}
private storage: Storage) { }
ngOnInit() { }
ngOnInit() {
// console.log('ngOnInit Dashboard');
// this._ALLO.presentLoading();
loadData(event) {
setTimeout(() => {
++this._TRIP.offersCardListPointer;
let loadedData = this._TRIP.filtredProducts.slice(this._TRIP.offersCardListPointer, this._TRIP.offersCardListPointer + 2);
if (loadedData) {
this._TRIP.offersCardListPointer = this._TRIP.offersCardListPointer + 1;
this._TRIP.offersCardList = this._TRIP.offersCardList.concat(loadedData);
console.log(loadedData, this._TRIP.offersCardList, this._TRIP.offersCardListPointer);
event.target.complete();
} else {
event.target.disabled = true;
}
}, 300);
}
setImgVisible(trip) {
trip.hidden = false;
}
showHideMoreFilters() {
if (this.show_more_filters === false) {
this.show_more_filters = true;
} else {
this.show_more_filters = false;
}
}
async presentToast() {
const toast = await this.toastCtrl.create({
message: 'Liste mise à jour',
......@@ -74,4 +69,5 @@ export class DashboardPage implements OnInit {
viewDetail(id) {
this.router.navigateByUrl('/app/details-offre/' + id);
}
}
src/app/pages/dashboard/dashboard.module.ts → src/app/pages/offres/offres-tlm/offres-tlm.module.ts
......@@ -4,14 +4,13 @@ import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';
import { IonicModule } from '@ionic/angular';
import { SearchPipe } from '../../pipes/search/search.pipe';
import { DashboardPage } from './dashboard.page';
import { OffresTlmPage } from './offres-tlm.page';
const routes: Routes = [
{
path: '',
component: DashboardPage
component: OffresTlmPage
}
];
......@@ -22,6 +21,6 @@ const routes: Routes = [
IonicModule,
RouterModule.forChild(routes)
],
declarations: [DashboardPage, SearchPipe]
declarations: [OffresTlmPage]
})
export class DashboardPageModule {}
export class OffresTlmPageModule {}
src/app/pages/offres/offres-tlm/offres-tlm.page.html 0 → 100644
<ion-content>
<ion-list-header>Meilleures deals</ion-list-header>
<div class="app">
<ul class="hs">
<li class="item">test</li>
<li class="item">test</li>
<li class="item">test</li>
<li class="item">test</li>
<li class="item">test</li>
<li class="item">test</li>
</ul>
</div>
<ion-list>
<ion-item>
Offre
</ion-item>
</ion-list>
</ion-content>
\ No newline at end of file
src/app/pages/offres/offres-tlm/offres-tlm.page.scss 0 → 100644
.app {
// padding: 20px 0;
display: grid;
grid-gap: 20px 0;
grid-template-columns: 10px 1fr 10px;
align-content: start;
}
.app > * {
grid-column: 2 / -2;
}
.app > .full {
grid-column: 1 / -1;
}
.hs {
display: grid;
grid-gap: calc(20px / 2);
grid-template-columns: repeat(6, calc(50% - 20px * 2));
grid-template-rows: minmax(150px, 1fr);
overflow-x: scroll;
scroll-snap-type: x proximity;
padding-bottom: calc(0.75 * 20px);
margin-bottom: calc(-0.25 * 20px);
}
/* Demo styles */
ion-content {
display: grid;
place-items: center;
background: #456173;
}
ul {
list-style: none;
padding: 0;
}
.app {
// width: 375px;
// height: 667px;
background: #dbd0bc;
overflow-y: scroll;
}
.hs > li,
.item {
scroll-snap-align: center;
padding: calc(20px / 2 * 1.5);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background: #fff;
border-radius: 8px;
}
src/app/pages/offres/offres-tlm/offres-tlm.page.spec.ts 0 → 100644
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { OffresTlmPage } from './offres-tlm.page';
describe('OffresTlmPage', () => {
let component: OffresTlmPage;
let fixture: ComponentFixture<OffresTlmPage>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ OffresTlmPage ],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(OffresTlmPage);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/pages/offres/offres-tlm/offres-tlm.page.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-offres-tlm',
templateUrl: './offres-tlm.page.html',
styleUrls: ['./offres-tlm.page.scss'],
})
export class OffresTlmPage implements OnInit {
constructor() { }
ngOnInit() {
}
}
src/app/pages/partenaires-list/partenaires-list.page.ts → src/app/pages/partenaires/partenaires-list/partenaires-list.page.ts
import { Component, OnInit } from '@angular/core';
import { LoadingController } from '@ionic/angular';
// import { ActivatedRoute } from '@angular/router';
import { TripService } from '../../services/trip-service';
import { AlloService } from '../../services/allo-service';
import { TripService } from '../../../services/trip-service';
import { AlloService } from '../../../services/allo-service';
@Component({
selector: 'app-partenaires-list',
......
src/app/pages/partenaires-map/partenaires-map.page.ts → src/app/pages/partenaires/partenaires-map/partenaires-map.page.ts
import { Component, OnInit } from '@angular/core';
import { LoadingController } from '@ionic/angular';
import { AlloService } from "../../services/allo-service";
import { TripService } from "../../services/trip-service";
import { AlloService } from '../../../services/allo-service';
import { TripService } from '../../../services/trip-service';
import L from 'leaflet';
import 'leaflet.markercluster';
......@@ -36,7 +36,7 @@ export class PartenairesMapPage implements OnInit {
}
loadmap() {
this.map = L.map("map", { attributionControl: false });
this.map = L.map('map', { attributionControl: false });
this.map.on('load', () => {
// this.loader.dismiss();
});
......
src/app/pipes/pipes.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { SearchPipe } from './search/search.pipe';
@NgModule({
declarations: [
SearchPipe
],
imports: [],
exports: [
SearchPipe
]
})
export class PipesModule {}
src/app/services/trip-service.ts
......@@ -8,6 +8,9 @@ import { AlloService } from './allo-service';
@Injectable({ providedIn: 'root' })
export class TripService {
public products: Array<any> = [];
public filtredProducts: Array<any> = [];
public offersCardList: Array<any>;
public offersCardListPointer = 1;
public brands: Array<any> = [];
public cats: Array<any> = [];
public request: any;
......@@ -50,7 +53,10 @@ export class TripService {
this.products = this._ALLO.shuffleArray(products);
this.products.forEach((element) => { element.hidden = true; });
// console.log(this.products);
setTimeout(() => {
this.filtredProducts = this.products;
this.offersCardList = this.filtredProducts.slice(0, 2);
}, 2000);
}
if (null !== data && 'object' === typeof data && data.hasOwnProperty('cats')) {
var cats = this._ALLO.jsonToArray(data.cats);
......@@ -97,4 +103,12 @@ export class TripService {
remove(item) {
this.products.splice(this.products.indexOf(item), 1);
}
filterList(categoryId) {
this.filtredProducts = this.products.filter(item => {
return item.categories_ids.includes(categoryId);
});
this.offersCardList = this.filtredProducts.slice(0, 2);
this.offersCardListPointer = 1;
}
}
src/index.html
......@@ -22,6 +22,10 @@
</head>
<body>
<div class="start" *ngIf="!appStarted">
<!-- <ion-img src="./assets/rings.svg"></ion-img> -->
<ion-spinner name="dots"></ion-spinner>
</div>
<app-root></app-root>
<script src="https://unpkg.com/leaflet@1.4.0/dist/leaflet.js" crossorigin=""></script>
</body>
......
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