diff --git a/.angular-cli.json b/.angular-cli.json index aa9e39c..1290020 100644 --- a/.angular-cli.json +++ b/.angular-cli.json @@ -16,6 +16,9 @@ "tsconfig": "tsconfig.app.json", "testTsconfig": "tsconfig.spec.json", "prefix": "app", + "scripts": [ + "../node_modules/moment/min/moment.min.js" + ], "styles": [ "scss/style.scss" ], diff --git a/package-lock.json b/package-lock.json index ae3c233..a213fb6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -777,6 +777,14 @@ "@types/jasmine": "2.5.54" } }, + "@types/moment": { + "version": "2.13.0", + "resolved": "https://registry.npmjs.org/@types/moment/-/moment-2.13.0.tgz", + "integrity": "sha1-YE69GJvDvDShVIaJQE5hoqSqyJY=", + "requires": { + "moment": "2.18.1" + } + }, "@types/node": { "version": "8.0.24", "resolved": "https://registry.npmjs.org/@types/node/-/node-8.0.24.tgz", diff --git a/package.json b/package.json index 1ff97cf..b50de08 100644 --- a/package.json +++ b/package.json @@ -25,10 +25,11 @@ "@angular/platform-browser-dynamic": "4.0.3", "@angular/router": "4.0.3", "@angular/upgrade": "4.0.3", + "@types/moment": "^2.13.0", "angular-in-memory-web-api": "^0.3.1", "chart.js": "2.5.0", "core-js": "2.4.1", - "moment": "2.18.1", + "moment": "^2.18.1", "ng2-charts": "1.6.0", "ng2-validation-manager": "^0.3.1", "ngx-bootstrap": "1.6.6", diff --git a/src/app/dashboard/add-data.component.html b/src/app/dashboard/add-data.component.html index 2cc8700..b05dda8 100644 --- a/src/app/dashboard/add-data.component.html +++ b/src/app/dashboard/add-data.component.html @@ -1,6 +1,77 @@
+
+
+ Submit Supplier Transaction + Required Data marked in bold. +
+
+
+ +
+ + This is a help text +
+
+
+ +
+
+ + +
+ This is a help text +
+
+
+ +
+ + This is a help text +
+ +
+
+
+ +
+ + This is a help text +
+
+
+ +
+ + This is a help text +
+
+
+ +
+ + This is a help text +
+
+
+
+
+
+ + +
+
+
+
+ +
Profile & Payroll Data @@ -105,7 +176,7 @@ - +
diff --git a/src/app/dashboard/add-data.component.ts b/src/app/dashboard/add-data.component.ts index b4fba15..335227e 100644 --- a/src/app/dashboard/add-data.component.ts +++ b/src/app/dashboard/add-data.component.ts @@ -2,6 +2,8 @@ import { Component, OnInit } from '@angular/core'; import { Validators, FormBuilder, FormGroup } from '@angular/forms'; import { Http, Response } from '@angular/http'; import { ApiService } from '../providers/api-service'; +import { OrgResultComponent } from '../shared/org-result.component'; +import * as moment from 'moment'; import 'rxjs/add/operator/map'; @Component({ @@ -13,17 +15,38 @@ export class AddDataComponent { suppliersForm: FormGroup; singleSupplierForm: FormGroup; employeeForm: FormGroup; + transactionForm: FormGroup; payrollFormStatus: any; suppliersFormStatus: any; singleSupplierFormStatus: any; employeeFormStatus: any; + transactionFormStatus: any; + transactionFormStatusError: string = 'Error received, please try again.'; + + submitOrg = { + name: '', + street_name: '', + town: '', + postcode: '', + }; + organisationId: number; + organisationTown: string; + organisationPostcode: string; + amount: number; + transactionAdditionType = 1; + storeList; + showAddStore = false; + submitReceipt = false; + transactionFormInvalid = true; + myDate: any; + minDate: any; constructor( private http: Http, private formBuilder: FormBuilder, private api: ApiService, ) { - this.payrollForm = this.formBuilder.group({ + this.payrollForm = this.formBuilder.group({ entryperiod: ['', [Validators.required]], employeeamount: ['', [Validators.required]], localemployeeamount: ['', [Validators.required]], @@ -55,6 +78,178 @@ export class AddDataComponent { employeepension: [''], employeeotherbenefit: [''], }); + this.myDate = moment().format('YYYY-MM-DD[T]HH:mm'); + // this.myDate = new Date().toISOString().slice(0, 16); + } + + ngOnInit(): void { + this.getMinDate(); + } + + getMinDate(){ + // gets the April 1st date of the current year + let aprilDate = moment().month(3).date(1); + let now = moment(); + // Checks if current time is before April 1st, if so returns true + let beforeApril = now.isBefore(aprilDate); + if ( beforeApril == true ) { + this.minDate = aprilDate.subtract(2, 'years').format('YYYY-MM-DD'); + } else { + this.minDate = aprilDate.subtract(1, 'years').format('YYYY-MM-DD'); + } + } + + initializeItems() { + // Dont bother searching for an empty or undefined string + if ( this.submitOrg.name == '' ) { + return; + } + var searchData = { + search_name: this.submitOrg.name, + }; + + this.api.search(searchData).subscribe( + data => { + if(data.validated.length > 0) { + this.storeList = data.validated; + this.showAddStore = false; + this.transactionAdditionType = 1; + } else { + this.storeList = data.unvalidated; + this.showAddStore = false; + this.transactionAdditionType = 2; + } + // handle the case when the storelist is empty + if(this.storeList.length < 1 ) { + this.storeList = null; + this.showAddStore = true; + this.transactionAdditionType = 3; + } + }, + error => { + console.log(error); + } + ); + } + + // if user select a item from the list + addStore(store){ + this.submitOrg = store; + this.transactionFormValidate(); + this.organisationId = store.id; + } + + // search for store + organisationSearch(ev) { + // Reset items back to all of the items + this.initializeItems(); + + // set val to the value of the searchbar + let val = ev.target.value; + + // Filter the store list so search seems quicker + if (val && val.trim() != '' && this.storeList != null) { + this.storeList = this.storeList.filter( + (item) => { + return ( item.name.toLowerCase().indexOf( val.toLowerCase() ) > -1 ); + } + ) + } + + // if nothing is found + if(!this.storeList === null){ + // display add new store button + this.showAddStore = true; + } + } + + transactionFormValidate() { + if( this.submitOrg.name.length == 0 || + this.amount == 0 ) { + this.transactionFormInvalid = true; + }else{ + this.transactionFormInvalid = false; + } + } + + public postTransaction() { + + var myParams: any; + let purchaseTime: string; + purchaseTime = moment(this.myDate, 'YYYY-MM-DD[T]HH:mm').local().format('YYYY-MM-DD[T]HH:mm:ss.SSSZ'); + switch(this.transactionAdditionType){ + case 1: + myParams = { + transaction_type : this.transactionAdditionType, + transaction_value : this.amount, + purchase_time : purchaseTime, + organisation_id : this.organisationId, + }; + break; + case 2: + myParams = { + transaction_type : this.transactionAdditionType, + transaction_value : this.amount, + purchase_time : purchaseTime, + organisation_id : this.organisationId, + }; + break; + case 3: + myParams = { + transaction_type : this.transactionAdditionType, + transaction_value : this.amount, + purchase_time : purchaseTime, + organisation_name : this.submitOrg.name, + street_name : this.submitOrg.street_name, + town : this.submitOrg.town, + postcode : this.submitOrg.postcode, + }; + break; + } + /******************************/ + + this.api + .upload(myParams) + .subscribe( + result => { + if ( result.success == true ) { + console.log('Successful Upload'); + console.log(result); + this.transactionFormStatus = "success"; + console.log(this.transactionFormStatus); + this.resetForm(); + } else { + console.log('Upload Error'); + this.transactionFormStatusError = JSON.stringify(result.status) + 'Error, ' + JSON.stringify(result.message); + this.transactionFormStatus = "send_failed"; + console.log(this.transactionFormStatus); + } + }, + error => { + console.log('Upload Error'); + console.log(error); + try { + let jsonError = JSON.parse(error.body); + this.transactionFormStatusError = JSON.stringify(jsonError.status) + 'Error, ' + JSON.stringify(jsonError.message); + } catch(e) { + this.transactionFormStatusError = 'There was a server error, please try again later.'; + } + this.transactionFormStatus = "send_failed"; + console.log(this.transactionFormStatus); + } + ); + } + + private resetForm() { + this.submitOrg = { + name: '', + street_name: '', + town: '', + postcode: '', + }; + this.storeList = null; + this.amount = null; + this.transactionFormInvalid = true; } onSubmitPayroll() { diff --git a/src/app/dashboard/dashboard.module.ts b/src/app/dashboard/dashboard.module.ts index a365b86..8e52b2c 100644 --- a/src/app/dashboard/dashboard.module.ts +++ b/src/app/dashboard/dashboard.module.ts @@ -10,6 +10,7 @@ import { AccountEditComponent } from './account-edit.component'; import { AddDataComponent } from './add-data.component'; import { DashboardRoutingModule } from './dashboard.routing'; +import { OrgResultComponent } from '../shared/org-result.component'; @NgModule({ imports: [ @@ -26,6 +27,7 @@ import { DashboardRoutingModule } from './dashboard.routing'; LeaderboardsComponent, AccountEditComponent, AddDataComponent, + OrgResultComponent, ] }) export class DashboardModule { } diff --git a/src/app/providers/api-service.ts b/src/app/providers/api-service.ts index 73bb013..beaf9e1 100644 --- a/src/app/providers/api-service.ts +++ b/src/app/providers/api-service.ts @@ -20,18 +20,18 @@ export class ApiService { // Login API - private getSessionKey() { + public getSessionKey() { console.log('get key'); return this.sessionKey; } - private setSessionKey(key) { + public setSessionKey(key) { console.log('set key'); this.sessionKey = key; localStorage.setItem('sessionKey', this.sessionKey); } - private removeSessionKey() { + public removeSessionKey() { console.log('remove key'); this.sessionKey = null; localStorage.removeItem('sessionKey'); @@ -71,6 +71,8 @@ export class ApiService { ).map( response => { this.removeSessionKey(); return response.json() } ); } + // Searches organisations used for transaction submission + public search(data) { data.session_key = this.sessionKey; return this.http.post( @@ -78,6 +80,16 @@ export class ApiService { data ).map( response => response.json() ); } + + // Uploads a transaction + + public upload(data) { + data.session_key = this.sessionKey; + return this.http.post( + this.apiUrl + '/upload', + data + ).map( response => response.json() ) + } // Handles user data interaction diff --git a/src/app/shared/org-result.component.ts b/src/app/shared/org-result.component.ts new file mode 100644 index 0000000..eccc092 --- /dev/null +++ b/src/app/shared/org-result.component.ts @@ -0,0 +1,10 @@ +import { Component, Input } from '@angular/core'; + +@Component({ + selector: 'org-result', + template:'banana {{ organisation }}', +}) +export class OrgResultComponent { + @Input() organisation: any; + +} \ No newline at end of file