Pear-Trading/FoodLoop-Web
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Merge pull request #30 from Pear-Trading/Release-v0.0.3

Browse source 
Release v0.0.3
This commit is contained in:
Tom Bloor 2017-11-14 11:25:12 +00:00 committed by GitHub
commit 3f5a52d4f4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
18 changed files with 277 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
CHANGELOG.md
View file

@ -2,6 +2,17 @@
# Next Release
# v0.0.3
* Customer Leaderboards added
* Map made available to Customers
* Clustering added to Map
* Map renamed from "Supplier Map" to "Purchase Map" to fall in line with
previous change
* Added placeholder while password reset is not present
* Fixed error on store list during a transaction
# v0.0.2
* Supplier map added to organisation view

9
bin/build-releases
View file

@ -2,19 +2,24 @@
VERSION=`git describe --tags`
if [ ! -d ../WebApp-Releases ]; then
echo "Making new Releases Directory"
mkdir ../WebApp-Releases
fi
echo "Building releases for $VERSION"
echo "Building Prod Release..."
ng build --prod
tar -czf ../LocalLoop-Web-prod-$VERSION.tar.gz dist
tar -czf ../WebApp-Releases/LocalLoop-Web-prod-$VERSION.tar.gz dist
echo "Building Dev Release..."
ng build --dev
tar -cvzf ../LocalLoop-Web-dev-$VERSION.tar.gz dist
tar -czf ../WebApp-Releases/LocalLoop-Web-dev-$VERSION.tar.gz dist
echo "Cleaning up build artefacts..."

4
e2e/login.e2e-spec.ts
View file

@ -12,9 +12,9 @@ describe('Login Page', () => {
expect(page.getLoginHeaderText()).toEqual('Login');
});
it('should have a username box of type text', () => {
it('should have a username box of type email', () => {
expect(page.isUsernameFieldPresent()).toBeTruthy();
expect(page.getUsernameFieldType()).toBe('text');
expect(page.getUsernameFieldType()).toEqual('email');
});
it('should have a password box of type password', () => {

12
package-lock.json generated
View file

@ -1,6 +1,6 @@
{
"name": "localloop-web",
"version": "0.0.1",
"version": "0.0.3",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
@ -9,6 +9,11 @@
"resolved": "https://registry.npmjs.org/@agm/core/-/core-1.0.0-beta.1.tgz",
"integrity": "sha512-IVwQGmcaE42SmYY2e5QwqOC0vrSXZCW8BhATY0Vpy3NjbiydSXi9T81hVqKLvuKaB3ves1sv3W++SB1Wj+5B6A=="
},
"@agm/js-marker-clusterer": {
"version": "1.0.0-beta.2",
"resolved": "https://registry.npmjs.org/@agm/js-marker-clusterer/-/js-marker-clusterer-1.0.0-beta.2.tgz",
"integrity": "sha512-sQzNo+2NwjgVAiy/AU3deYvemoH3CHtYvh+aH/3jq9yIK+2ZiuwhZ2oKmoBsVPEMzLjOqF07FhDLowrAAZfVRw=="
},
"@angular-devkit/build-optimizer": {
"version": "0.0.13",
"resolved": "https://registry.npmjs.org/@angular-devkit/build-optimizer/-/build-optimizer-0.0.13.tgz",
@ -4650,6 +4655,11 @@
"integrity": "sha1-8OgK4DmkvWVLXygfyT8EqRSn/M4=",
"dev": true
},
"js-marker-clusterer": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/js-marker-clusterer/-/js-marker-clusterer-1.0.0.tgz",
"integrity": "sha1-yUvoWuiJaBnlHBMfiR3StVVY3Rc="
},
"js-tokens": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz",

4
package.json
View file

@ -1,6 +1,6 @@
{
"name": "localloop-web",
"version": "0.0.2",
"version": "0.0.3",
"description": "LocalLoop Web - Web interface for LocalLoop app",
"author": "",
"url": "http://www.peartrade.org",
@ -19,6 +19,7 @@
"private": true,
"dependencies": {
"@agm/core": "^1.0.0-beta.1",
"@agm/js-marker-clusterer": "^1.0.0-beta.2",
"@angular/common": "4.0.3",
"@angular/compiler": "4.0.3",
"@angular/core": "4.0.3",
@ -32,6 +33,7 @@
"angular-in-memory-web-api": "^0.3.1",
"chart.js": "2.5.0",
"core-js": "2.4.1",
"js-marker-clusterer": "^1.0.0",
"moment": "^2.18.1",
"ng2-charts": "1.6.0",
"ng2-validation-manager": "^0.3.1",

5
src/app/auth/login.component.html
View file

@ -10,7 +10,7 @@
<form [formGroup]="signin" (ngSubmit)="onSubmit()">
<div class="input-group mb-3">
<span class="input-group-addon">@</span>
<input id="username" type="text" class="form-control" formControlName="email" placeholder="Email">
<input id="username" type="email" class="form-control" formControlName="email" placeholder="Email">
</div>
<div class="input-group mb-4">
<span class="input-group-addon"><i class="icon-lock"></i></span>
@ -31,8 +31,9 @@
<button type="submit" [disabled]="!signin.valid" class="btn btn-primary px-4">Login</button>
</div>
<div class="col-6 text-right">
<button type="button" class="btn btn-link px-0">Forgot password?</button>
<button type="button" class="btn btn-link px-0" disabled>Forgot password?</button>
</div>
<label class="col-12"><strong>Password reset is currently in development and disabled in testing, please contact an administrator to reset your password.</strong></label>
</div>
</form>
</div>

2
src/app/auth/register.component.html
View file

@ -40,7 +40,7 @@
<span class="input-group-addon"><i class="icon-people"></i></span>
<select required class="form-control" type="text" formControlName="usertype">
<option value=''>Please select</option>
<option value='organisation'>Organisation</option>
<option value='organisation'>Business/Organisation</option>
<option value='customer'>Customer</option>
</select>
</div>

2
src/app/dashboard/add-data.component.html
View file

@ -31,7 +31,7 @@
<span class="help-block">Enter the name of the organisation money was spent. Choose existing ones from below or if not found, enter the details below.</span>
</div>
</div>
<org-table *ngIf="storeList != null" [orgList]="storeList" (onClick)="addStore($event)"></org-table>
<org-table *ngIf="storeList.length > 0" [orgList]="storeList" (onClick)="addStore($event)"></org-table>
<div *ngIf="showAddStore">
<div class="form-group row">
<label class="col-md-3 form-control-label" for="text-input"><strong>Organisation Street Name</strong></label>

8
src/app/dashboard/add-data.component.ts
View file

@ -32,7 +32,7 @@ export class AddDataComponent implements OnInit {
organisationPostcode: string;
amount: number;
transactionAdditionType = 1;
storeList;
storeList = [];
showAddStore = false;
submitReceipt = false;
transactionFormInvalid = true;
@ -108,7 +108,7 @@ export class AddDataComponent implements OnInit {
}
// handle the case when the storelist is empty
if (this.storeList.length < 1) {
this.storeList = null;
this.storeList = [];
this.showAddStore = true;
this.transactionAdditionType = 3;
}
@ -135,7 +135,7 @@ export class AddDataComponent implements OnInit {
const val = ev.target.value;
// Filter the store list so search seems quicker
if (val && val.trim() !== '' && this.storeList !== null) {
if (val && val.trim() !== '' && this.storeList.length > 0) {
this.storeList = this.storeList.filter(
(item) => {
return ( item.name.toLowerCase().indexOf( val.toLowerCase() ) > -1 );
@ -237,7 +237,7 @@ export class AddDataComponent implements OnInit {
town: '',
postcode: '',
};
this.storeList = null;
this.storeList = [];
this.amount = null;
this.transactionFormInvalid = true;
this.showAddStore = false;

6
src/app/dashboard/dashboard.module.ts
View file

@ -5,6 +5,7 @@ import { ChartsModule } from 'ng2-charts/ng2-charts';
import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
import { NgxPaginationModule } from 'ngx-pagination';
import { AgmCoreModule, GoogleMapsAPIWrapper } from '@agm/core';
import { AgmJsMarkerClustererModule } from '@agm/js-marker-clusterer';
import { CurrencyPipe } from '@angular/common';
@ -15,6 +16,7 @@ import { AddDataComponent } from './add-data.component';
import { FeedbackComponent } from './feedback.component';
import { TransactionLogComponent } from './transaction-log.component';
import { PayrollLogComponent } from './payroll-log.component';
import { LeaderboardComponent } from './leaderboard.component';
import { MapComponent } from './map.component';
import { GraphWidget } from '../widgets/graph-widget.component';
@ -26,6 +28,7 @@ import { OrgResultComponent } from '../shared/org-result.component';
import { OrgTableComponent } from '../shared/org-table.component';
import { TransactionResultComponent } from '../shared/transaction-result.component';
import { PayrollResultComponent } from '../shared/payroll-result.component';
import { LeaderboardResultComponent } from '../shared/leaderboard-result.component';
// API key env variable import
import { environment } from '../../environments/environment';
@ -40,6 +43,7 @@ import { environment } from '../../environments/environment';
AgmCoreModule.forRoot({
apiKey: environment.mapApiKey
}),
AgmJsMarkerClustererModule,
BsDropdownModule,
NgxPaginationModule,
DashboardRoutingModule,
@ -55,6 +59,8 @@ import { environment } from '../../environments/environment';
TransactionResultComponent,
PayrollLogComponent,
PayrollResultComponent,
LeaderboardComponent,
LeaderboardResultComponent,
MapComponent,
FeedbackComponent,
GraphWidget,

12
src/app/dashboard/dashboard.routing.ts
View file

@ -13,6 +13,7 @@ import { AddDataComponent } from './add-data.component';
import { FeedbackComponent } from './feedback.component';
import { TransactionLogComponent } from './transaction-log.component';
import { PayrollLogComponent } from './payroll-log.component';
import { LeaderboardComponent } from './leaderboard.component';
import { MapComponent } from './map.component';
// Using child path to allow for FullLayout theming
@ -38,13 +39,19 @@ const routes: Routes = [
{
path: 'account-edit',
component: AccountEditComponent,
data: { title: 'Leaderboards' },
data: { title: 'Edit Account' },
},
{
path: 'add-data',
component: AddDataComponent,
data: { title: 'Add Transaction' },
},
{
path: 'leaderboard',
component: LeaderboardComponent,
data: { title: 'Leaderboards' },
canActivate: [CustomerGuard],
},
{
path: 'transaction-log',
component: TransactionLogComponent,
@ -53,8 +60,7 @@ const routes: Routes = [
{
path: 'map',
component: MapComponent,
data: { title: 'Supplier Map' },
canActivate: [OrgGuard],
data: { title: 'Purchase Map' },
},
{
path: 'payroll-log',

61
src/app/dashboard/leaderboard.component.html Normal file
View file

@ -0,0 +1,61 @@
<div class="animated fadeIn">
<div class="row">
<div class="col-lg-12">
<div class="card">
<div class="card-header">
<strong>Leaderboard</strong>
<small>By default this loads the page with your position.</small>
</div>
<div *ngIf="!noLeaderboardList" class="card-block">
<div class="input-group mb-3">
<select type="text" [(ngModel)]="listType" (ngModelChange)="changeLeaderboard($event)">
<option value="daily_total">Yesterday Total</option>
<option value="daily_count">Yesterday Count</option>
<option value="weekly_total" selected>Last Week Total</option>
<option value="weekly_count">Last Week Count</option>
<option value="monthly_total">Last Month Total</option>
<option value="monthly_count">Last Month Count</option>
<option value="all_time_total">All Time Total</option>
<option value="all_time_count">All Time Count</option>
</select>
</div>
<table class="table table-striped table-hover">
<thead>
<tr>
<th>Position</th>
<th>Value</th>
<th>Purchase Time</th>
</tr>
</thead>
<tbody>
<tr leaderboard-result *ngFor="let leaderboard of leaderboardList | paginate: paginateConfig" [leaderboard]="leaderboard" [listType]="listType"></tr>
</tbody>
</table>
<pagination-template #p="paginationApi"
[id]="paginateConfig.id"
(pageChange)="loadLeaderboard($event)">
<ul class="pagination">
<li class="page-item" [class.disabled]="p.isFirstPage()">
<a class="page-link clickable" *ngIf="!p.isFirstPage()" (click)="p.previous()">Prev</a>
</li>
<li *ngFor="let page of p.pages" class="page-item" [class.active]="p.getCurrent() === page.value">
<a class="page-link clickable" (click)="p.setCurrent(page.value)" *ngIf="p.getCurrent() !== page.value">
<span>{{ page.label }}</span>
</a>
<div class="page-link" *ngIf="p.getCurrent() === page.value">
<span>{{ page.label }}</span>
</div>
</li>
<li class="page-item" [class.disabled]="p.isLastPage()">
<a class="page-link clickable" *ngIf="!p.isLastPage()" (click)="p.next()">Next</a>
</li>
</ul>
</pagination-template>
</div>
<div *ngIf="noLeaderboardList" class="card-block">
No Leaderboard available.
</div>
</div>
</div>
</div>
</div>

110
src/app/dashboard/leaderboard.component.ts Normal file
View file

@ -0,0 +1,110 @@
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { Http, Response } from '@angular/http';
import { ApiService } from '../providers/api-service';
// import { PaginatePipe } from 'ngx-pagination';
import {PaginationInstance} from 'ngx-pagination';
// import { PaginationControlsComponent } from 'ngx-pagination';
// import { PaginationControlsDirective } from 'ngx-pagination';
// import { TransactionResultComponent } from '../shared/transaction-result.component';
import 'rxjs/add/operator/map';
@Component({
templateUrl: 'leaderboard.component.html',
})
export class LeaderboardComponent implements OnInit {
leaderboardList;
noLeaderboardList = false;
public p: any;
leaderboardData: Array<any>;
currentPos: number;
listType: any = 'weekly_total';
public paginateConfig: PaginationInstance = {
id: 'leadpaginate',
itemsPerPage: 10,
currentPage: 1,
totalItems: 0
};
constructor(
private http: Http,
private api: ApiService,
) { }
ngOnInit(): void {
this.loadLeaderboard(0);
}
// private fetchLeaderboard() {
// this.peopleService.leaderboard(this.listType)
// .subscribe(
// result => {
// this.leaderboardData = result.leaderboard;
// this.currentPos = result.user_position;
// }
// );
// }
public changeLeaderboard(event) {
this.loadLeaderboard(0);
}
loadLeaderboard(leadPage: number) {
console.log(leadPage, this.listType);
this.api.leaderboard_fetch(this.listType,leadPage).subscribe(
result => {
if (result.leaderboard.length > 0) {
this.leaderboardList = result.leaderboard;
// TODO Rename in server
this.paginateConfig.totalItems = result.count;
this.paginateConfig.currentPage = result.page;
this.noLeaderboardList = false;
} else {
// handle the case when the leaderboardList is empty
this.leaderboardList = null;
this.noLeaderboardList = true;
}
},
error => {
console.log(error);
}
);
}
// // dynamically changes the row style based on player's position
// // for instance, top three player and the player him/herself should
// // be hightlighted
// public getClass(item) {
// if( item.position < 4 ) {
// return "topThree";
// } else if( item.position == this.currentPos ) {
// return "user";
// }
// return "otherUsers";
// }
//
// // show changes by using icon, trending up and trending down or no trend.
// public getTrendIcon(item){
// if( item.trend < 0 ){
// return "md-trending-up";
// } else if( item.trend > 0 ){
// return "md-trending-down";
// }
// return "md-remove";
// }
//
// // need to merge this function with getIcon
// // this function shows different icon color based on the direction of the position shifted
// public getTrendIconColor(item){
// if( item.trend < 0 ) {
// return "secondary";
// } else if( item.trend > 0 ){
// return "danger";
// }
// return "dark";
// }
}

4
src/app/dashboard/map.component.html
View file

@ -3,7 +3,7 @@
<div class="col-lg-12">
<div class="card">
<div class="card-header">
<strong>Supplier Map</strong>
<strong>Purchase Map</strong>
<small>Required Data marked in <strong>bold</strong>.</small>
</div>
<div [ngSwitch]="dataReceived">
@ -22,6 +22,7 @@
[zoom]="zoom"
[scaleControl]="true"
(idle)="viewBoundsChanged($event)">
<agm-marker-cluster maxZoom="13" imagePath="https://raw.githubusercontent.com/googlemaps/v3-utility-library/master/markerclustererplus/images/m">
<agm-marker
*ngFor="let m of markers"
[latitude]="m.latitude"
@ -32,6 +33,7 @@
<strong>{{m.name}}</strong>
</agm-info-window>
</agm-marker>
</agm-marker-cluster>
</agm-map>
</div>
</div>

9
src/app/layouts/full-layout.component.html
View file

@ -40,9 +40,14 @@
<i class="icon-envelope-letter"></i> Enter Feedback
</a>
</li>
<li *ngIf="accountType == 'organisation'" class="nav-item">
<li class="nav-item">
<a class="nav-link" routerLinkActive="active" [routerLink]="['/map']">
<i class="icon-map"></i> Supplier Map
<i class="icon-map"></i> Purchase Map
</a>
</li>
<li *ngIf="accountType == 'customer'" class="nav-item">
<a class="nav-link" routerLinkActive="active" [routerLink]="['/leaderboard']">
<i class="icon-basket"></i> Leaderboard
</a>
</li>
<li class="nav-item">

9
src/app/providers/api-service.ts
View file

@ -253,13 +253,16 @@ export class ApiService {
// Leaderboard Api
public leaderboard_fetch(data) {
public leaderboard_fetch(
type: string,
page: number) {
const key = this.sessionKey;
return this.http.post(
this.apiUrl + '/stats/leaderboard',
this.apiUrl + '/stats/leaderboard/paged',
{
session_key : key,
type : data
type : type,
page: page,
}
).map( response => response.json() );
}

3
src/app/shared/leaderboard-result.component.html Normal file
View file

@ -0,0 +1,3 @@
<td>{{ leaderboard.position }}</td>
<td class="text-truncate">{{ leaderboard.display_name }}</td>
<td>{{ listType.includes('total') ? (leaderboard.value | currency:'GBP':true:'1.2-2') : (leaderboard.value | number:'1.0-0') }}</td>

20
src/app/shared/leaderboard-result.component.ts Normal file
View file

@ -0,0 +1,20 @@
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
interface LeaderboardData {
position: number;
display_name: number,
value: number;
}
@Component({
// tslint:disable-next-line
selector: '[leaderboard-result]',
templateUrl: 'leaderboard-result.component.html',
})
export class LeaderboardResultComponent implements OnInit {
@Input() public leaderboard: LeaderboardData;
@Input() public listType: string;
ngOnInit(): void {
}
}