prout

Transactions, Contact, Search, Home

config.xml

@@ -82,4 +82,5 @@
     <plugin name="cordova-plugin-splashscreen" spec="5.0.2" />
     <plugin name="cordova-plugin-ionic-webview" spec="^2.0.0" />
     <plugin name="cordova-plugin-ionic-keyboard" spec="^2.0.5" />
+    <plugin name="cordova-plugin-advanced-http" spec="2.0.1" />
 </widget>

package.json

@@ -21,9 +21,11 @@
     "@angular/platform-browser": "5.2.11",
     "@angular/platform-browser-dynamic": "5.2.11",
     "@ionic-native/core": "~4.15.0",
+    "@ionic-native/http": "^4.17.0",
     "@ionic-native/splash-screen": "~4.15.0",
     "@ionic-native/status-bar": "~4.15.0",
     "@ionic/storage": "2.2.0",
+    "cordova-plugin-advanced-http": "2.0.1",
     "ionic-angular": "3.9.2",
     "ionicons": "3.0.0",
     "rxjs": "5.5.11",
@@ -35,5 +37,10 @@
     "@ionic/lab": "1.0.11",
     "typescript": "~2.6.2"
   },
-  "description": "An Ionic project"
+  "description": "An Ionic project",
+  "cordova": {
+    "plugins": {
+      "cordova-plugin-advanced-http": {}
+    }
+  }
 }

resources/raw/config.json

@@ -0,0 +1,55 @@
+{
+  "users":[
+    {
+      "name": "Test",
+      "firstName":"Toto",
+      "email": "toto@mail.com",
+      "password": "totopwd",
+      "balance": 500.0,
+      "lastTransactions": [
+        {
+          "from":"toto@mail.com",
+          "to": "bic@mail.com",
+          "amount": 10.0,
+          "timestamp": 1539861600
+        }
+      ]
+    },
+    {
+      "name": "lePen",
+      "firstName":"Bic",
+      "email": "bic@mail.com",
+      "password": "bicpwd",
+      "balance": 10.0,
+      "lastTransactions": [
+        {
+          "from": "toto@mail.com",
+          "to": "bic@mail.com",
+          "amount": 10.0,
+          "timestamp": 1539861900
+        },
+        {
+          "from":"bic@mail.com",
+          "to":"tata@mail.com",
+          "amount": 200.0,
+          "timestamp": 1539600000
+        }
+      ]
+    },
+    {
+      "name": "tata",
+      "firstName":"",
+      "email": "tata@mail.com",
+      "password": "tataPwd",
+      "balance": 235.0,
+      "lastTransactions": [
+        {
+          "from":"bic@mail.com",
+          "to": "tata@mail.com",
+          "amount": 200,
+          "timestamp": 1539601200
+        }
+      ]
+    }
+  ]
+}

src/app/app.component.ts

@@ -3,12 +3,12 @@ import { Platform } from 'ionic-angular';
 import { StatusBar } from '@ionic-native/status-bar';
 import { SplashScreen } from '@ionic-native/splash-screen';
 
-import { HomePage } from '../pages/home/home';
+import { LoginPage } from '../pages/login/login';
 @Component({
   templateUrl: 'app.html'
 })
 export class MyApp {
-  rootPage:any = HomePage;
+  rootPage:any = LoginPage;
 
   constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen) {
     platform.ready().then(() => {

src/app/app.module.ts

@@ -3,28 +3,50 @@ import { ErrorHandler, NgModule } from '@angular/core';
 import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
 import { SplashScreen } from '@ionic-native/splash-screen';
 import { StatusBar } from '@ionic-native/status-bar';
+import { HttpClientModule} from "@angular/common/http";
 
 import { MyApp } from './app.component';
 import { HomePage } from '../pages/home/home';
+import { LoginPage } from '../pages/login/login';
+import { BuyPage } from '../pages/buy/buy';
+import { ContactsPage } from "../pages/contacts/contacts";
+import { SendPage} from "../pages/send/send";
+import { TransactionsPage} from "../pages/transactions/transactions";
+import { SearchPage } from "../pages/search/search";
+import { GitsonProvider } from '../providers/gitson/gitson';
 
 @NgModule({
   declarations: [
     MyApp,
-    HomePage
+    HomePage,
+    LoginPage,
+    BuyPage,
+    ContactsPage,
+    SendPage,
+    TransactionsPage,
+    SearchPage
   ],
   imports: [
     BrowserModule,
+    HttpClientModule,
     IonicModule.forRoot(MyApp)
   ],
   bootstrap: [IonicApp],
   entryComponents: [
     MyApp,
-    HomePage
+    HomePage,
+    LoginPage,
+    BuyPage,
+    ContactsPage,
+    SendPage,
+    TransactionsPage,
+    SearchPage
   ],
   providers: [
     StatusBar,
     SplashScreen,
-    {provide: ErrorHandler, useClass: IonicErrorHandler}
+    {provide: ErrorHandler, useClass: IonicErrorHandler},
+    GitsonProvider,
   ]
 })
 export class AppModule {}

src/app/models/Transaction.ts

@@ -0,0 +1,7 @@
+export class Transaction {
+  from: string
+  to: string
+  amount: number
+  timestamp: number
+  date: string
+}

src/app/models/User.ts

@@ -0,0 +1,9 @@
+import { Transaction } from "./Transaction";
+
+export class User {
+  name: string
+  firstName: string
+  email: string
+  balance: number
+  lastTransactions: Array<Transaction>
+}

src/pages/buy/buy.html

@@ -0,0 +1,68 @@
+<!--
+  Generated template for the BuyPage page.
+
+  See http://ionicframework.com/docs/components/#navigation for more info on
+  Ionic pages and navigation.
+-->
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Échange de monnaie</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
+
+<ion-content padding>
+  <ion-list>
+
+    <ion-item>
+      <ion-label stacked>Montant</ion-label>
+      <ion-input [(ngModel)]="amount" name="amount" type="number" value="10"></ion-input>
+    </ion-item>
+
+    <ion-item>
+      <ion-label stacked>N° de carte</ion-label>
+      <ion-input [(ngModel)]="cardnumber" name="cardnumber" type="number" min="0000000000000000" max="9999999999999999"></ion-input>
+    </ion-item>
+
+    <ion-item>
+      <ion-label stacked>Titulaire de la carte</ion-label>
+      <ion-input type="text"></ion-input>
+    </ion-item>
+
+
+
+      <ion-grid>
+        <ion-row class="cb-date">
+          <ion-col col-5>
+            <ion-item>
+              <ion-label stacked>Date d'expiration</ion-label>
+            <ion-input [(ngModel)]="mounth" name="mounth" type="number" min="1" max="12"></ion-input>
+            </ion-item>
+          </ion-col>
+        </ion-row>
+        <ion-row>
+          <ion-col col-2> / </ion-col>
+        </ion-row>
+        <ion-row>
+          <ion-col col-5>
+            <ion-item>
+              <ion-input [(ngModel)]="year" name="year" type="number"></ion-input>
+            </ion-item>
+          </ion-col>
+        </ion-row>
+      </ion-grid>
+
+
+    <ion-item>
+      <ion-label stacked>Cryptogramme</ion-label>
+      <ion-input [(ngModel)]="cryp" name="cryp" type="number" min="000" max="999"></ion-input>
+    </ion-item>
+
+    <button ion-button (click)="sendTransaction(cardnumber, mounth, year, cryp, amount)">Payer {{amount}} €</button>
+
+
+  </ion-list>
+
+</ion-content>

src/pages/buy/buy.module.ts

@@ -0,0 +1,13 @@
+import { NgModule } from '@angular/core';
+import { IonicPageModule } from 'ionic-angular';
+import { BuyPage } from './buy';
+
+@NgModule({
+  declarations: [
+    BuyPage,
+  ],
+  imports: [
+    IonicPageModule.forChild(BuyPage),
+  ],
+})
+export class BuyPageModule {}

src/pages/buy/buy.scss

@@ -0,0 +1,3 @@
+page-buy {
+
+}

src/pages/buy/buy.ts

@@ -0,0 +1,97 @@
+import { Component } from '@angular/core';
+import { IonicPage, NavController, NavParams } from 'ionic-angular';
+import { AlertController } from 'ionic-angular';
+
+/**
+ * Generated class for the BuyPage page.
+ *
+ * See https://ionicframework.com/docs/components/#navigation for more info on
+ * Ionic pages and navigation.
+ */
+
+@IonicPage()
+@Component({
+  selector: 'page-buy',
+  templateUrl: 'buy.html',
+})
+export class BuyPage {
+
+  constructor(public navCtrl: NavController, public navParams: NavParams, public alertCtrl: AlertController) {
+  }
+
+  ionViewDidLoad() {
+    console.log('ionViewDidLoad BuyPage');
+  }
+
+  sendTransaction($cardnumber, $month, $year, $cryp, $amount) {
+    if (typeof $cardnumber !== 'undefined' && typeof $month !== 'undefined' && typeof $year !== 'undefined' && typeof $cryp !== 'undefined' && typeof $amount !== 'undefined' ) {
+      if (this.checkFields($cardnumber, $month, $year, $cryp)) {
+        //TODO : Contacter l'API et proposer la transaction. L'API répondra true ou False
+        if (true === true) {
+          this.navCtrl.popToRoot();
+        }
+        else {
+          const alert = this.alertCtrl.create({
+            title: 'Erreur',
+            subTitle: 'La transaction a échoué. Vérifiez les données saisies et réessayez.',
+            buttons: ['OK']
+          });
+          alert.present();
+        }
+      }
+    }
+    else {
+      const alert = this.alertCtrl.create({
+        title: 'Champs vides',
+        subTitle: 'Merci de remplir tous les champs',
+        buttons: ['OK']
+      });
+      alert.present();
+    }
+  }
+
+  //Vérification des champs
+  checkFields(cardnumber, month, year, cryp) {
+    if (!this.checkCardInfoIntegrity(12, 19, cardnumber) || !this.checkCardInfoIntegrity(3, 4, cryp) || !this.checkCardInfoValue(0, 9999, cryp)) {
+      const alert = this.alertCtrl.create({
+        title: 'Erreur',
+        subTitle: 'Le numéro de carte bancaire est erroné. Vérifiez les données et recommencez.',
+        buttons: ['OK']
+      });
+      alert.present();
+      return false;
+    }
+    else if (!this.checkCardInfoIntegrity(1, 2, month) || !this.checkCardInfoValue(1, 12, month) || !this.checkCardInfoIntegrity(4, 4, year) || !this.checkCardInfoValue(2018, 2050, year)) {
+      const alert = this.alertCtrl.create({
+        title: 'Erreur',
+        subTitle: 'La date est erronée. Vérifiez les données et recommencez.',
+        buttons: ['OK']
+      });
+      alert.present();
+      return false;
+    }
+    else {
+      return true;
+    }
+  }
+  checkCardInfoIntegrity($min, $max, $number) {
+    $number = parseInt($number);
+    if ($number.length < $min || $number.length > $max) {
+      return false;
+    }
+    else {
+      return true;
+    }
+  }
+
+  checkCardInfoValue($min, $max, $number) {
+    $number = parseInt($number);
+    if ($number < $min || $number > $max) {
+      return false;
+    }
+    else {
+      return true;
+    }
+  }
+
+}

src/pages/contacts/contacts.html

@@ -0,0 +1,39 @@
+<!--
+  Generated template for the ContactsPage page.
+
+  See http://ionicframework.com/docs/components/#navigation for more info on
+  Ionic pages and navigation.
+-->
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>contacts</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
+
+<ion-content padding>
+  <ion-card (click)="selectContact('tata')">
+    <ion-card-content>
+      Name : tata
+      <br>
+      Address : 75438973HJFBSDFZ989024
+    </ion-card-content>
+  </ion-card>
+  <ion-card (click)="selectContact('test')">
+    <ion-card-content>
+      Name : test
+      <br>
+      Address : 754389IHGOERG989324JIJ
+    </ion-card-content>
+  </ion-card>
+  <ion-card (click)="selectContact('toaster')">
+    <ion-card-content>
+      Name : toaster
+      <br>
+      Address : 780U8GEOKNOKSQDU974328
+    </ion-card-content>
+  </ion-card>
+
+</ion-content>

src/pages/contacts/contacts.module.ts

@@ -0,0 +1,13 @@
+import { NgModule } from '@angular/core';
+import { IonicPageModule } from 'ionic-angular';
+import { ContactsPage } from './contacts';
+
+@NgModule({
+  declarations: [
+    ContactsPage,
+  ],
+  imports: [
+    IonicPageModule.forChild(ContactsPage),
+  ],
+})
+export class ContactsPageModule {}

src/pages/contacts/contacts.scss

@@ -0,0 +1,3 @@
+page-contacts {
+
+}

src/pages/contacts/contacts.ts

@@ -0,0 +1,29 @@
+import { Component } from '@angular/core';
+import { IonicPage, NavController, NavParams } from 'ionic-angular';
+
+/**
+ * Generated class for the ContactsPage page.
+ *
+ * See https://ionicframework.com/docs/components/#navigation for more info on
+ * Ionic pages and navigation.
+ */
+
+@IonicPage()
+@Component({
+  selector: 'page-contacts',
+  templateUrl: 'contacts.html',
+})
+export class ContactsPage {
+
+  constructor(public navCtrl: NavController, public navParams: NavParams) {
+  }
+
+  ionViewDidLoad() {
+    console.log('ionViewDidLoad ContactsPage');
+  }
+
+  selectContact(contact) {
+    console.log('toto - '+contact)
+  }
+
+}

src/pages/home/home.html

@@ -1,14 +1,35 @@
+<!--
+  Generated template for the HomePage page.
+
+  See http://ionicframework.com/docs/components/#navigation for more info on
+  Ionic pages and navigation.
+-->
 <ion-header>
+
   <ion-navbar>
-    <ion-title>
+    <ion-title>Mon compte</ion-title>
-      Ionic Blank
-    </ion-title>
   </ion-navbar>
+
 </ion-header>
 
 <ion-content padding>
-  The world is your oyster.
+  <p class="welcome-text">Bonjour, François Pignon</p>
-  <p>
+  <ion-card>
-    If you get lost, the <a href="http://ionicframework.com/docs/v2">docs</a> will be your guide.
+    <ion-card-header>
-  </p>
+      Solde actuel
+    </ion-card-header>
+    <ion-card-content>
+      <p class="balance">567,38</p>
+      <p>Gonettes</p>
+    </ion-card-content>
+  </ion-card>
+
+  <ion-buttons>
+    <button ion-item (click)="changePage('contact')">Contacts</button>
+    <button ion-item (click)="changePage('buy')">Acheter de la monnaie locale</button>
+    <button ion-item (click)="changePage('send')">Faire un virement</button>
+    <button ion-item (click)="changePage('history')">Historique des transactions</button>
+    <button ion-item (click)="closeConnexion()">Se déconnecter</button>
+  </ion-buttons>
+
 </ion-content>

src/pages/home/home.module.ts

@@ -0,0 +1,13 @@
+import { NgModule } from '@angular/core';
+import { IonicPageModule } from 'ionic-angular';
+import { HomePage } from './home';
+
+@NgModule({
+  declarations: [
+    HomePage,
+  ],
+  imports: [
+    IonicPageModule.forChild(HomePage),
+  ],
+})
+export class HomePageModule {}

src/pages/home/home.ts

@@ -1,14 +1,55 @@
 import { Component } from '@angular/core';
-import { NavController } from 'ionic-angular';
+import { IonicPage, NavController, NavParams } from 'ionic-angular';
+import { BuyPage } from '../buy/buy';
+import { ContactsPage } from '../contacts/contacts';
+import {SendPage} from "../send/send";
+import {TransactionsPage} from "../transactions/transactions";
+import {LoginPage} from "../login/login";
 
+/**
+ * Generated class for the HomePage page.
+ *
+ * See https://ionicframework.com/docs/components/#navigation for more info on
+ * Ionic pages and navigation.
+ */
+
+@IonicPage()
 @Component({
   selector: 'page-home',
-  templateUrl: 'home.html'
+  templateUrl: 'home.html',
 })
 export class HomePage {
 
-  constructor(public navCtrl: NavController) {
+  constructor(public navCtrl: NavController, public navParams: NavParams) {
+  }
 
+  ionViewDidLoad() {
+    console.log('ionViewDidLoad HomePage');
+  }
+
+  changePage(params) {
+    switch (params) {
+      case 'buy': {
+        this.navCtrl.push(BuyPage);
+        break;
+      }
+      case 'contact':{
+        this.navCtrl.push(ContactsPage);
+        break;
+      }
+      case 'send':{
+        this.navCtrl.push(SendPage);
+        break;
+      }
+      case 'history':{
+        this.navCtrl.push(TransactionsPage);
+        break;
+      }
+    }
+  }
+
+  closeConnexion(){
+    this.navCtrl.setRoot(LoginPage);
   }
 
 }

src/pages/login/login.html

@@ -0,0 +1,34 @@
+<!--
+  Generated template for the LoginPage page.
+
+  See http://ionicframework.com/docs/components/#navigation for more info on
+  Ionic pages and navigation.
+-->
+
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>login</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
+
+<ion-content padding>
+  <ion-list>
+
+    <ion-item>
+      <ion-label stacked>Identifiant</ion-label>
+      <ion-input [(ngModel)]="username" name="username" type="text"></ion-input>
+    </ion-item>
+
+    <ion-item>
+      <ion-label stacked>Mot de passe</ion-label>
+      <ion-input [(ngModel)]="password" name="password" type="password"></ion-input>
+    </ion-item>
+
+  </ion-list>
+
+    <button ion-button (click)="validLogin(username, password)">Connexion</button>
+
+</ion-content>

src/pages/login/login.module.ts

@@ -0,0 +1,13 @@
+import { NgModule } from '@angular/core';
+import { IonicPageModule } from 'ionic-angular';
+import { LoginPage } from './login';
+
+@NgModule({
+  declarations: [
+    LoginPage,
+  ],
+  imports: [
+    IonicPageModule.forChild(LoginPage),
+  ],
+})
+export class LoginPageModule {}

src/pages/login/login.scss

@@ -0,0 +1,3 @@
+page-login {
+
+}

src/pages/login/login.ts

@@ -0,0 +1,44 @@
+import { Component } from '@angular/core';
+import { IonicPage, NavController, NavParams } from 'ionic-angular';
+import { HomePage } from '../home/home';
+import { AlertController } from 'ionic-angular';
+import { GitsonProvider } from '../../providers/gitson/gitson';
+
+/**
+ * Generated class for the LoginPage page.
+ *
+ * See https://ionicframework.com/docs/components/#navigation for more info on
+ * Ionic pages and navigation.
+ */
+
+@IonicPage()
+@Component({
+  selector: 'page-login',
+  templateUrl: 'login.html',
+})
+export class LoginPage {
+
+  constructor(public navCtrl: NavController, public navParams: NavParams, public alertCtrl: AlertController, private gitsonService: GitsonProvider) {
+  }
+
+
+  ionViewDidLoad() {
+    console.log('ionViewDidLoad LoginPage');
+  }
+
+  validLogin($username, $password) {
+    if ($username === "test" && $password === "test") {
+
+      this.navCtrl.setRoot(HomePage);
+    }
+    else {
+      const alert = this.alertCtrl.create({
+        title: 'Erreur',
+        subTitle: 'Identifiant ou mot de passe erroné. Veuillez réessayer.',
+        buttons: ['OK']
+      });
+      alert.present();
+    }
+  }
+
+}

src/pages/search/search.html

@@ -0,0 +1,26 @@
+<!--
+  Generated template for the SearchPage page.
+
+  See http://ionicframework.com/docs/components/#navigation for more info on
+  Ionic pages and navigation.
+-->
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>search</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
+
+<ion-content padding>
+  <ion-list>
+    <ion-item>
+      <ion-label stacked>Recipient</ion-label>
+      <ion-input [(ngModel)]="user" name="recipient" type="text"></ion-input>
+    </ion-item>
+    <br>
+    <button ion-button (click)="searchUser(user)">Rechercher</button>
+  </ion-list>
+
+</ion-content>

src/pages/search/search.module.ts

@@ -0,0 +1,13 @@
+import { NgModule } from '@angular/core';
+import { IonicPageModule } from 'ionic-angular';
+import { SearchPage } from './search';
+
+@NgModule({
+  declarations: [
+    SearchPage,
+  ],
+  imports: [
+    IonicPageModule.forChild(SearchPage),
+  ],
+})
+export class SearchPageModule {}

src/pages/search/search.scss

@@ -0,0 +1,3 @@
+page-search {
+
+}

src/pages/search/search.ts

@@ -0,0 +1,39 @@
+import { Component } from '@angular/core';
+import { IonicPage, NavController, NavParams } from 'ionic-angular';
+import { GitsonProvider} from "../../providers/gitson/gitson";
+
+
+/**
+ * Generated class for the SearchPage page.
+ *
+ * See https://ionicframework.com/docs/components/#navigation for more info on
+ * Ionic pages and navigation.
+ */
+
+@IonicPage()
+@Component({
+  selector: 'page-search',
+  templateUrl: 'search.html',
+})
+export class SearchPage {
+
+  constructor(public navCtrl: NavController, public navParams: NavParams, public gitsonProvider : GitsonProvider) {
+  }
+
+  ionViewDidLoad() {
+    console.log('ionViewDidLoad SearchPage');
+  }
+
+  searchUser($user){
+
+    console.log('prout')
+    //TEMPORARY, TO TEST GET HTTP
+    this.gitsonProvider.getUrl()
+      .then(data => {
+
+        console.log(data['users'][0]);
+      })
+
+  }
+
+}

src/pages/send/send.html

@@ -0,0 +1,34 @@
+<!--
+  Generated template for the SendPage page.
+
+  See http://ionicframework.com/docs/components/#navigation for more info on
+  Ionic pages and navigation.
+-->
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Effectuer un virement</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
+
+<ion-content padding>
+  <ion-list>
+    <button ion-button (click)="changePage('contact')">Contacts</button>
+    <button ion-button (click)="changePage('search')">Chercher un contact</button>
+
+    <ion-item>
+      <ion-label stacked>Recipient</ion-label>
+      <ion-input [(ngModel)]="recipient" name="recipient" type="text"></ion-input>
+    </ion-item>
+
+    <ion-item>
+      <ion-label stacked>Montant</ion-label>
+      <ion-input [(ngModel)]="amount" name="amount" type="number" value="10"></ion-input>
+    </ion-item>
+
+    <button ion-button (click)="t">Envoyer</button>
+
+  </ion-list>
+</ion-content>

src/pages/send/send.module.ts

@@ -0,0 +1,13 @@
+import { NgModule } from '@angular/core';
+import { IonicPageModule } from 'ionic-angular';
+import { SendPage } from './send';
+
+@NgModule({
+  declarations: [
+    SendPage,
+  ],
+  imports: [
+    IonicPageModule.forChild(SendPage),
+  ],
+})
+export class SendPageModule {}

src/pages/send/send.scss

@@ -0,0 +1,3 @@
+page-send {
+
+}

src/pages/send/send.ts

@@ -0,0 +1,40 @@
+import { Component } from '@angular/core';
+import { IonicPage, NavController, NavParams } from 'ionic-angular';
+import {SearchPage} from "../search/search";
+import {ContactsPage} from "../contacts/contacts";
+
+/**
+ * Generated class for the SendPage page.
+ *
+ * See https://ionicframework.com/docs/components/#navigation for more info on
+ * Ionic pages and navigation.
+ */
+
+@IonicPage()
+@Component({
+  selector: 'page-send',
+  templateUrl: 'send.html',
+})
+export class SendPage {
+
+  constructor(public navCtrl: NavController, public navParams: NavParams) {
+  }
+
+  ionViewDidLoad() {
+    console.log('ionViewDidLoad SendPage');
+  }
+
+  changePage(params) {
+    switch (params) {
+      case 'search':{
+        this.navCtrl.push(SearchPage);
+        break;
+      }
+      case 'contact':{
+        this.navCtrl.push(ContactsPage);
+        break;
+      }
+    }
+  }
+
+}

src/pages/transactions/transactions.html

@@ -0,0 +1,97 @@
+<!--
+  Generated template for the TransactionsPage page.
+
+  See http://ionicframework.com/docs/components/#navigation for more info on
+  Ionic pages and navigation.
+-->
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Dernières transactions</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
+
+<ion-content padding>
+  <ion-list>
+      <ion-item *ngFor="let transactionTest of listTransactions">
+        <ion-card>
+          <ion-card-content>
+            From : {{transactionTest.from}}
+            <br>
+            Amount : {{transactionTest.amount}}
+            <br>
+            Date : {{transactionTest.date}}
+          </ion-card-content>
+        </ion-card>
+      </ion-item>
+  </ion-list>
+
+  <ion-card>
+
+    <ion-item>
+      <h2>Virement reçu</h2>
+    </ion-item>
+    <ion-card-content>
+      <p>Date : 2 novembre 2018</p>
+      <p>De : Jean-Charles DUTROU</p>
+      <p>Montant :  45 G</p>
+    </ion-card-content>
+
+  </ion-card>
+
+  <ion-card>
+
+    <ion-item>
+      <h2>Virement émis</h2>
+    </ion-item>
+    <ion-card-content>
+      <p>Date : 31 octobre 2018 13:30:03</p>
+      <p>À : Docteur FREUD</p>
+      <p>Montant :  150 G</p>
+    </ion-card-content>
+
+  </ion-card>
+
+  <ion-card>
+
+    <ion-item>
+      <h2>Paiement</h2>
+    </ion-item>
+    <ion-card-content>
+      <p>Date : 30 novembre 2018 22:12:35</p>
+      <p>À : Bar de la CUITTHE</p>
+      <p>Montant :  5 G</p>
+    </ion-card-content>
+
+  </ion-card>
+
+  <ion-card>
+
+    <ion-item>
+      <h2>Paiement</h2>
+    </ion-item>
+    <ion-card-content>
+      <p>Date : 30 novembre 2018 21:23:35</p>
+      <p>À : Bar de la CUITTHE</p>
+      <p>Montant :  5 G</p>
+    </ion-card-content>
+
+  </ion-card>
+
+  <ion-card>
+
+    <ion-item>
+      <h2>Paiement</h2>
+    </ion-item>
+    <ion-card-content>
+      <p>Date : 30 novembre 2018 20:45:35</p>
+      <p>À : Bar de la CUITTHE</p>
+      <p>Montant :  5 G</p>
+    </ion-card-content>
+
+  </ion-card>
+
+
+</ion-content>

src/pages/transactions/transactions.module.ts

@@ -0,0 +1,13 @@
+import { NgModule } from '@angular/core';
+import { IonicPageModule } from 'ionic-angular';
+import { TransactionsPage } from './transactions';
+
+@NgModule({
+  declarations: [
+    TransactionsPage,
+  ],
+  imports: [
+    IonicPageModule.forChild(TransactionsPage),
+  ],
+})
+export class TransactionsPageModule {}

src/pages/transactions/transactions.scss

@@ -0,0 +1,3 @@
+page-transactions {
+
+}

src/pages/transactions/transactions.ts

@@ -0,0 +1,51 @@
+import { Component } from '@angular/core';
+import { IonicPage, NavController, NavParams } from 'ionic-angular';
+import {Transaction} from "../../app/models/Transaction";
+
+/**
+ * Generated class for the TransactionsPage page.
+ *
+ * See https://ionicframework.com/docs/components/#navigation for more info on
+ * Ionic pages and navigation.
+ */
+
+@IonicPage()
+@Component({
+  selector: 'page-transactions',
+  templateUrl: 'transactions.html',
+})
+export class TransactionsPage {
+  listTransactions = [];
+  transactionTest = new Transaction();
+  transactionTest2 = new Transaction();
+
+  constructor(public navCtrl: NavController, public navParams: NavParams) {
+
+  }
+
+  ionViewDidLoad() {
+    console.log('ionViewDidLoad TransactionsPage');
+    this.init();
+  }
+
+  init(){
+
+    this.transactionTest.from="toto";
+    this.transactionTest.to="tata";
+    this.transactionTest.amount=200;
+    this.transactionTest.timestamp=1539600000;
+    this.transactionTest.date= new Date(this.transactionTest.timestamp*1000).toDateString()
+
+    this.listTransactions.push(this.transactionTest);
+
+    this.transactionTest2.from="tata";
+    this.transactionTest2.to="toto";
+    this.transactionTest2.amount=40;
+    this.transactionTest2.timestamp=1539900000;
+    this.transactionTest2.date= new Date(this.transactionTest2.timestamp*1000).toDateString()
+
+    this.listTransactions.push(this.transactionTest2);
+
+  }
+
+}

src/providers/gitson/gitson.ts

@@ -0,0 +1,30 @@
+import { HttpClient } from '@angular/common/http';
+import { Injectable } from '@angular/core';
+import 'rxjs/add/operator/map';
+
+/*
+  Generated class for the GitsonProvider provider.
+
+  See https://angular.io/guide/dependency-injection for more info on providers
+  and Angular DI.
+*/
+@Injectable()
+export class GitsonProvider {
+
+  apiUrl ="https://raw.githubusercontent.com/Aveias/mobilapp/dev/resources/raw/config.json";
+
+  constructor(public http: HttpClient) {
+    console.log('Hello GitsonProvider Provider');
+  }
+
+  getUrl(){
+    return new Promise(resolve => {
+      this.http.get(this.apiUrl).subscribe(data => {
+        resolve(data);
+      }, err => {
+        console.log(err);
+      })
+    })
+  }
+
+}