Commit caf8614e authored by Cédric Moreau's avatar Cédric Moreau

[enh] Crowdfunding : affichage du % de financement

parent aed9d769
......@@ -29,6 +29,7 @@ import {AccountPage} from "../pages/account/account";
import {ConnectPage} from "../pages/connect/connect";
import {CryptoService} from "../services/crypo-service";
import {SafeUrlPipe} from "../directives/safe-url.pipe";
import {CrowdfundingService} from "../services/crowdfunding-service";
const appRoutes: Routes = [
{
......@@ -125,6 +126,7 @@ const appRoutes: Routes = [
ImageService,
AuthService,
CryptoService,
CrowdfundingService,
{provide: APP_BASE_HREF, useValue: '/#/'},
{provide: ErrorHandler, useClass: IonicErrorHandler}
]
......
......@@ -99,3 +99,45 @@ input.pubkey {
display: none;
}
}
.success {
color: green;
.range-bar {
background: #00b200 !important;
}
.range-knob {
background: #00b200 !important;
}
}
.successing {
color: orange;
.range-bar {
background: #fe6e11 !important;
}
.range-knob {
background: #fe6e11 !important;
}
}
.starting {
color: #aeae00;
.range-bar {
background: #dfdf00 !important;
}
.range-knob {
background: #dfdf00 !important;
}
}
.nothing {
color: gray;
}
......@@ -21,10 +21,26 @@
<p class="fees" *ngIf="announceService.ann.feesFloat">
+{{ announceService.ann.fees }} Ğ1 (frais de transport)
</p>
<ng-container *ngIf="announceService.ann.type == 'Crowdfunding'">
<h3>Financement (crowdfunding)</h3>
<ion-col item-right class="range-col" text-center [ngClass]="{ 'nothing': !announceService.ann.pctFunded, 'success': announceService.ann.pctFunded >= 100, 'successing': announceService.ann.pctFunded >= 50 && announceService.ann.pctFunded < 100, 'starting': announceService.ann.pctFunded >= 10 && announceService.ann.pctFunded < 50 }">
<h4 class="financed">Financé à {{ announceService.ann.pctFunded }} %</h4>
<ion-range [(ngModel)]="announceService.ann.pctFunded" disabled>
</ion-range>
</ion-col>
<ul>
<li *ngFor="let p of announceService.ann.montants">
Paiement de {{ (p.amount / 100).toFixed(2) }} Ğ1 par {{ p.issuer }}
</li>
</ul>
</ng-container>
<h3>Paiement à</h3>
<input class="pubkey" type="text" disabled value="{{ announceService.ann.pub }}">
<h3>Stock</h3>
<p>
<p *ngIf="announceService.ann.stock == 1">
1 unité disponible.
</p>
<p *ngIf="announceService.ann.stock > 1">
{{ announceService.ann.stock }} unités disponibles.
</p>
......
......@@ -8,4 +8,22 @@ announce {
font-size: 25px;
color: coral;
}
.financed {
margin: 0;
}
ion-range {
padding: 0 !important;
}
ul {
margin-top: 0;
padding-top: 0;
padding-left: 30px;
}
li {
padding: 5px;
}
}
......@@ -3,6 +3,7 @@ import {AccountService} from "../../services/account-service";
import {LoginService} from "../../services/login-service";
import {ActivatedRoute} from "@angular/router";
import {AnnounceService} from "../../services/announce-service";
import {CrowdfundingService} from "../../services/crowdfunding-service";
@Component({
selector: 'announce',
......@@ -14,6 +15,7 @@ export class AnnouncePage implements OnInit {
constructor(
private route: ActivatedRoute,
private crowdfundingService: CrowdfundingService,
public loginService:LoginService,
public accountService:AccountService,
public announceService:AnnounceService) {
......@@ -29,6 +31,10 @@ export class AnnouncePage implements OnInit {
this.route.params.subscribe(params => {
if (params['uuid']) {
return this.announceService.getAnnounce(params['uuid'])
.then(() => {
this.announceService.ann.pctFunded = this.crowdfundingService.getFundingAmount(this.announceService.ann)
this.announceService.ann.montants = this.crowdfundingService.getAmountsPaid(this.announceService.ann)
})
}
});
}
......
......@@ -41,9 +41,9 @@
</ion-item>
<ion-item>
<ion-label>Crowdfunding (fonctionnalité à venir)</ion-label>
<ion-label>Crowdfunding</ion-label>
<ion-radio
value="Crowdfunding" disabled></ion-radio>
value="Crowdfunding"></ion-radio>
</ion-item>
</ion-list>
......
......@@ -9,15 +9,22 @@
Dernières annonces
</ion-list-header>
<ion-list id="home-list" *ngIf="announces.length > 0">
<button ion-item *ngFor="let a of announces" routerLink="/announce/{{ a.uuid }}">
<button ion-item class="ligne" *ngFor="let a of announces" routerLink="/announce/{{ a.uuid }}">
<ion-avatar item-left>
<img *ngIf="a.thumbnail" src="{{ a.thumbnail }}">
<div class="nophoto" *ngIf="!a.thumbnail">
<ion-icon name="photos"></ion-icon>
</div>
</ion-avatar>
<h2>{{ a.title }} • <span class="author">{{ a.account.title }}</span></h2>
<p>{{ a.descLigne }}</p>
<ion-col item-right>
<h2>{{ a.title }} • <span class="author">{{ a.account.title }}</span></h2>
<p>{{ a.descLigne }}</p>
</ion-col>
<ion-col item-right class="range-col" *ngIf="a.type == 'Crowdfunding'" text-center [ngClass]="{ 'nothing': !a.pctFunded, 'success': a.pctFunded >= 100, 'successing': a.pctFunded >= 50 && a.pctFunded < 100, 'starting': a.pctFunded >= 10 && a.pctFunded < 50 }">
<span>Financé à {{ a.pctFunded }} %</span>
<ion-range [(ngModel)]="a.pctFunded" disabled>
</ion-range>
</ion-col>
<h3 clear item-right>{{ a.price }} Ğ1</h3>
</button>
</ion-list>
......
......@@ -13,4 +13,36 @@ home {
font-size: 13px;
color: #588fee;
}
.ligne > .item-inner > .input-wrapper {
flex: 0;
}
.col {
height: 50px;
text-overflow: ellipsis;
p {
height: 16px;
overflow: hidden;
}
}
ion-range {
width: 90px !important;
}
ion-range.range-md {
padding: 0;
height: 24px;
}
.range-col {
width: 300px;
flex: 0;
}
.range-col > span {
font-size: 12px;
}
}
import { Component } from '@angular/core';
import {AnnounceService} from "../../services/announce-service";
import {CrowdfundingService} from "../../services/crowdfunding-service";
@Component({
selector: 'home',
......@@ -10,11 +11,12 @@ export class HomePage {
titre:string = "Toutes les annonces"
announces:Array<any>
constructor(private announceService:AnnounceService) {
constructor(private announceService:AnnounceService, private crowdfundingService:CrowdfundingService) {
this.announces = []
this.announceService.listAllAnnounces().then(announces => this.announces = announces.map(a => {
a.thumbnail = a.images[0]
a.descLigne = a.desc.replace(/\\n/g, ' ')
a.pctFunded = this.crowdfundingService.getFundingAmount(a)
return a
}))
}
......
import {Injectable} from "@angular/core";
@Injectable()
export class CrowdfundingService {
constructor() {
}
getFundingAmount(a) {
// Calcul du montant financé
const montants = this.getAmountsPaid(a)
let montant = 0
for (const mt of montants) {
montant += mt.amount
}
const prixSansVirgule = parseFloat(a.price) * 100
const pctFunded = (montant / prixSansVirgule) * 100
return parseInt(String(pctFunded))
}
getAmountsPaid(a) {
const montants = []
for (const tx of (a.payments || [])) {
for(const output of tx.outputs) {
if (output.match(new RegExp(":SIG\\(" + a.pub + "\\)"))) {
const sp = output.split(':')
const amount = parseInt(sp[0])
const base = parseInt(sp[1])
montants.push({
amount: amount * Math.pow(10, base),
issuer: tx.issuers[0]
})
}
}
}
return montants
}
}
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