Compare commits

...

3 commits

6 changed files with 277 additions and 91 deletions

View file

@ -39,8 +39,8 @@
"budgets": [ "budgets": [
{ {
"type": "initial", "type": "initial",
"maximumWarning": "500kb", "maximumWarning": "5mb",
"maximumError": "1mb" "maximumError": "10mb"
}, },
{ {
"type": "anyComponentStyle", "type": "anyComponentStyle",

View file

@ -45,4 +45,15 @@
color: dodgerblue; color: dodgerblue;
} }
.small {
font-size: 12px;
background: #dddddd;
}
.heading {
padding-top: 10px;
}
.toolbar {
padding: 12px;
}

View file

@ -77,98 +77,147 @@
<mat-tab *ngIf="proVersion" <mat-tab *ngIf="proVersion"
label="Integrations" label="Integrations"
style="align-items: center;"> style="align-items: center;">
<div class="container" style="margin-bottom: 20px;"> <mat-tab-group mat-tab-align-tabs="start">
<mat-dialog-content [formGroup]="accCodForm"> <mat-tab label="Xero">
<div style="height: 10px; <div class="container" style="margin-bottom: 20px;">
margin-top: 10px;"> <mat-dialog-content [formGroup]="accCodForm">
</div> <div style="height: 10px;
<div class="container" margin-top: 10px;">
style="height: 300;"> </div>
<p style="text-align:center"> <div class="container"
<a mat-raised-button style="height: 300;">
color="primary" <p style="text-align:center">
href="{{this.xeroLink}}"> <a mat-raised-button
{{ linkMsg }} color="primary"
</a> href="{{this.xeroLink}}">
</p> {{ linkMsg }}
</a>
</p>
<table *ngIf="linked2Xero" <table *ngIf="linked2Xero"
[style.width.%]="100" [style.width.%]="100"
style="margin-top: 10px;"> style="margin-top: 10px;">
<thead style="width: 100%;"> <thead style="width: 100%;">
<tr> <tr>
<th class="urlLabel" <th class="urlLabel"
style="text-align: left;" style="text-align: left;"
width="94%">Payment Service URL: width="94%">Payment Service URL:
</th> </th>
<th></th> <th></th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<td class="urlDetail" <td class="urlDetail"
style="text-align: left;" style="text-align: left;"
width="94%"> width="94%">
<div> <div>
<textarea disabled <textarea disabled
style="font-size: 10px !important; style="font-size: 10px !important;
border: none; border: none;
outline: none; outline: none;
min-height: 150px; min-height: 150px;
width: 95%;" width: 95%;"
cdkTextareaAutosize cdkTextareaAutosize
cdkAutosizeMinRows="6" cdkAutosizeMinRows="6"
cdkAutosizeMaxRows="10">{{ pmtServiceURL }} cdkAutosizeMaxRows="10">{{ pmtServiceURL }}
</textarea> </textarea>
</div> </div>
</td> </td>
<td class="urlCopyBtn"> <td class="urlCopyBtn">
<a (click)='copyUrl()' > <a (click)='copyUrl()' >
<fa-icon [icon]="faCopy" <fa-icon [icon]="faCopy"
class="copy-button"> class="copy-button">
</fa-icon> </fa-icon>
</a> </a>
</td> </td>
</tbody> </tbody>
</table> </table>
<div style="height: 10px; <div style="height: 10px;
margin-top: 10px;"> margin-top: 10px;">
</div> </div>
<mat-form-field *ngIf="linked2Xero" <mat-form-field *ngIf="linked2Xero"
class="settings-field" class="settings-field"
[style.width.%]="100"> [style.width.%]="100">
<mat-label>Account Code</mat-label> <mat-label>Account Code</mat-label>
<input matInput <input matInput
width="100%" width="100%"
placeholder="9999999999" placeholder="9999999999"
formControlName="xAcc" formControlName="xAcc"
(keyup)="checkStatus($event)"> (keyup)="checkStatus($event)">
<!-- </mat-form-field>
(change)="xeroAccCodChanged($event)">
--> </div>
</mat-form-field> </mat-dialog-content>
</div> </div>
</mat-dialog-content> <div class="container"
</div> style="display: flex;
<div class="container" justify-content: space-between;
style="display: flex; align-items: center;">
justify-content: space-between; <button mat-raised-button
align-items: center;"> (click)="closeIntegration()">
<button mat-raised-button Close
(click)="closeIntegration()"> </button>
Close <button *ngIf="saveAccOk"
</button> mat-raised-button
<button *ngIf="saveAccOk" color="primary"
mat-raised-button (click)="saveAccCod()">
color="primary" Save Code
(click)="saveAccCod()"> </button>
Save Code </div>
</button> <div style="height: 20px;
</div> margin-top: 10px;">
<div style="height: 20px; </div>
margin-top: 10px;"> </mat-tab>
</div> <mat-tab label="WooCommerce">
<div *ngIf="wooOwner == ''">
<button mat-raised-button color="primary" (click)="generateWooToken()">
Generate Token
</button>
</div>
<table *ngIf="wooOwner != ''">
<tr>
<td class="heading">Owner:</td>
</tr>
<tr>
<td class="small">{{wooOwner}}</td>
<td class="urlCopyBtn">
<a (click)='copyWooOwner()' >
<fa-icon [icon]="faCopy"
class="copy-button">
</fa-icon>
</a>
</td>
</tr>
<tr>
<td class="heading">Token:</td>
</tr>
<tr>
<td class="small">{{wooToken}}</td>
<td class="urlCopyBtn">
<a (click)='copyWooToken()' >
<fa-icon [icon]="faCopy"
class="copy-button">
</fa-icon>
</a>
</td>
</tr>
<tr>
<td class="heading">URL:</td>
</tr>
<tr>
<td class="small">{{wooUrl}}</td>
</tr>
</table>
<div class="toolbar" align="center">
<button mat-raised-button
(click)="close()">
Close
</button>
</div>
</mat-tab>
</mat-tab-group>
</mat-tab> </mat-tab>
</mat-tab-group> </mat-tab-group>
</div> </div>

View file

@ -5,6 +5,7 @@ import { UntypedFormBuilder, Validators, UntypedFormGroup, FormControl } from '@
import { Observable } from 'rxjs'; import { Observable } from 'rxjs';
import { Owner } from '../owner.model'; import { Owner } from '../owner.model';
import { XeroService } from '../xero.service'; import { XeroService } from '../xero.service';
import { WoocommerceService } from '../woocommerce.service';
import { NotifierService } from '../notifier.service'; import { NotifierService } from '../notifier.service';
import { faCopy } from '@fortawesome/free-solid-svg-icons'; import { faCopy } from '@fortawesome/free-solid-svg-icons';
@ -56,6 +57,13 @@ export class SettingsComponent implements OnInit {
xeroLink: string = ''; xeroLink: string = '';
localToken: string = ''; localToken: string = '';
clientId: string = ''; clientId: string = '';
wooOwner: string = '';
wooToken: string = '';
wooUrl: string = '';
wooOwnerUpdate: Observable<string>;
wooTokenUpdate: Observable<string>;
wooUrlUpdate: Observable<string>;
clientIdUpdate: Observable<string>; clientIdUpdate: Observable<string>;
accCodeUpdate: Observable<string>; accCodeUpdate: Observable<string>;
linked2Xero : boolean = false; linked2Xero : boolean = false;
@ -65,6 +73,7 @@ export class SettingsComponent implements OnInit {
private notifierService : NotifierService, private notifierService : NotifierService,
private fb: UntypedFormBuilder, private fb: UntypedFormBuilder,
public xeroService: XeroService, public xeroService: XeroService,
public wooService: WoocommerceService,
private dialogRef: MatDialogRef<SettingsComponent>, private dialogRef: MatDialogRef<SettingsComponent>,
@Inject(MAT_DIALOG_DATA) public data: Owner) { @Inject(MAT_DIALOG_DATA) public data: Owner) {
this.useZats = data.zats; this.useZats = data.zats;
@ -102,6 +111,19 @@ export class SettingsComponent implements OnInit {
console.log("xeroAccCod -> [" + this.xeroAccCod + "]"); console.log("xeroAccCod -> [" + this.xeroAccCod + "]");
this.accCodForm.get('xAcc')!.setValue(this.xeroAccCod); this.accCodForm.get('xAcc')!.setValue(this.xeroAccCod);
}); });
this.wooOwnerUpdate = wooService.ownerUpdate;
this.wooTokenUpdate = wooService.tokenUpdate;
this.wooUrlUpdate = wooService.siteurlUpdate;
wooService.getWooToken(this.owner._id!);
this.wooOwnerUpdate.subscribe(owData => {
this.wooOwner = owData;
});
this.wooTokenUpdate.subscribe(tkData => {
this.wooToken = tkData;
});
this.wooUrlUpdate.subscribe(uData => {
this.wooUrl = uData;
});
} }
ngOnInit() { ngOnInit() {
@ -128,7 +150,7 @@ export class SettingsComponent implements OnInit {
closeIntegration() { closeIntegration() {
if ( (this.xeroAccCod == '') && (this.linked2Xero) ) if ( (this.xeroAccCod == '') && (this.linked2Xero) )
this.notifierService this.notifierService
.showNotification("Payment confirmation disabled!!","Close",'warning'); .showNotification("Xero Payment confirmation disabled!!","Close",'warning');
this.dialogRef.close(); this.dialogRef.close();
} }
@ -179,6 +201,29 @@ export class SettingsComponent implements OnInit {
} }
} }
copyWooOwner(){
try {
navigator.clipboard.writeText(this.wooOwner);
this.notifierService.showNotification("Owner ID copied to clipboard", "Close", "success");
} catch (err) {
this.notifierService.showNotification("Copying not available in your browser", "Close", "error");
}
}
copyWooToken(){
try {
navigator.clipboard.writeText(this.wooToken);
this.notifierService.showNotification("WooCommerce Token copied to clipboard", "Close", "success");
} catch (err) {
this.notifierService.showNotification("Copying not available in your browser", "Close", "error");
}
}
generateWooToken(){
this.wooService.createWooToken(this.owner._id!);
this.wooService.getWooToken(this.owner._id!);
}
saveAccCod() { saveAccCod() {
this.xeroAccCod = this.accCodForm.value.xAcc; this.xeroAccCod = this.accCodForm.value.xAcc;

View file

@ -0,0 +1,16 @@
import { TestBed } from '@angular/core/testing';
import { WoocommerceService } from './woocommerce.service';
describe('WoocommerceService', () => {
let service: WoocommerceService;
beforeEach(() => {
TestBed.configureTestingModule({});
service = TestBed.inject(WoocommerceService);
});
it('should be created', () => {
expect(service).toBeTruthy();
});
});

View file

@ -0,0 +1,65 @@
import { Injectable } from '@angular/core';
import { BehaviorSubject, Observable } from 'rxjs';
import { HttpClient, HttpParams, HttpHeaders } from '@angular/common/http';
import { ConfigData } from './configdata';
var Buffer = require('buffer/').Buffer;
@Injectable({
providedIn: 'root'
})
export class WoocommerceService {
beUrl = ConfigData.Be_URL;
private reqHeaders: HttpHeaders;
private ownerId: string = '';
private token: string = '';
private siteurl: string = '';
private _ownerIdUpdated: BehaviorSubject<string> = new BehaviorSubject(this.ownerId);
private _tokenUpdated: BehaviorSubject<string> = new BehaviorSubject(this.token);
private _siteurlUpdated: BehaviorSubject<string> = new BehaviorSubject(this.siteurl);
public readonly ownerUpdate: Observable<string> = this._ownerIdUpdated.asObservable();
public readonly tokenUpdate: Observable<string> = this._tokenUpdated.asObservable();
public readonly siteurlUpdate: Observable<string> = this._siteurlUpdated.asObservable();
constructor(
private http: HttpClient
) {
var auth = 'Basic ' + Buffer.from(ConfigData.UsrPwd).toString('base64');
this.reqHeaders = new HttpHeaders().set('Authorization', auth);
this._ownerIdUpdated.next(Object.assign({}, this).ownerId);
this._tokenUpdated.next(Object.assign({}, this).token);
this._siteurlUpdated.next(Object.assign({}, this).siteurl);
}
getWooToken(ownerId: string) {
const params = new HttpParams().append('ownerid', ownerId);
let obs = this.http.get<{ownerid: string, token: string, siteurl: string}>(this.beUrl + 'api/wootoken', {headers: this.reqHeaders, params: params, observe: 'response'});
obs.subscribe(tokenResponse => {
if (tokenResponse.status == 200) {
this.ownerId = tokenResponse.body!.ownerid;
this.token = tokenResponse.body!.token;
this.siteurl = tokenResponse.body!.siteurl;
this._ownerIdUpdated.next(Object.assign({}, this).ownerId);
this._tokenUpdated.next(Object.assign({}, this).token);
this._siteurlUpdated.next(Object.assign({}, this).siteurl);
} else {
console.log('No WooCommerce token found');
}
});
return obs;
}
createWooToken(ownerId: string) {
const params = new HttpParams().append('ownerid', ownerId);
let obs = this.http.post(this.beUrl+'api/wootoken', {}, {headers: this.reqHeaders, params: params, observe: 'response'});
obs.subscribe(responseData => {
if (responseData.status == 202) {
console.log('WooToken created.');
} else {
console.log('WooToken creation failed.');
}
});
}
}