Add AccountCode field in settings component's integration tab

This commit is contained in:
Rene V. Vergara A. 2022-09-02 06:33:24 -05:00
parent 0eb84b8f7c
commit ab11c949eb
2 changed files with 92 additions and 53 deletions

View File

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

View File

@ -28,6 +28,8 @@ export class SettingsComponent implements OnInit {
proVersion: boolean = false;
useVKey: boolean = false;
linkMsg: String = 'Link to Xero';
xeroAccCod: String = '';
saveAccOk: boolean = false;
coins = [
{
@ -103,6 +105,14 @@ export class SettingsComponent implements OnInit {
}
close() {
this.dialogRef.close();
}
closeIntegration() {
if ( this.xeroAccCod == '' )
this.notifierService
.showNotification("Warning: Payment confirmation disabled","Close",'success');
this.dialogRef.close();
}
@ -137,6 +147,10 @@ export class SettingsComponent implements OnInit {
}
saveAccCod() {
}
copyUrl() {
// console.log("Inside copyUrl()");
if (navigator.clipboard) {
@ -152,6 +166,12 @@ export class SettingsComponent implements OnInit {
.showNotification("Functionality not available for your browser. Use send button instead.","Close",'error');
}
}
xeroAccCodChanged( arg: any ) {
// console.log("Account Code changed: " + arg.target.value);
// console.log(arg);
this.saveAccOk = (arg.target.value !== '');
}
}