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 c41351cfd5
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";
// }
}

22
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,16 +22,18 @@
[zoom]="zoom"
[scaleControl]="true"
(idle)="viewBoundsChanged($event)">
<agm-marker
*ngFor="let m of markers"
[latitude]="m.latitude"
[longitude]="m.longitude"
[label]="m.name[0]">
<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"
[longitude]="m.longitude"
[label]="m.name[0]">
<agm-info-window>
<strong>{{m.name}}</strong>
</agm-info-window>
</agm-marker>
<agm-info-window>
<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 {
}
}