Settings form in testing mode - read/write is not workng properly
This commit is contained in:
parent
f472096f57
commit
17fb948740
5 changed files with 144 additions and 51 deletions
|
|
@ -1,7 +1,18 @@
|
|||
* {
|
||||
font-family: 'Spartan', sans-serif;
|
||||
@import url('https://fonts.googleapis.com/css?family=Roboto&display=swap');
|
||||
|
||||
.settings-title {
|
||||
font-family: Roboto Mono;
|
||||
background: #ff4700;
|
||||
color: white;
|
||||
font-size: 30px;
|
||||
font-weight: 700;
|
||||
text-align: center;
|
||||
margin-bottom: 15px;
|
||||
height: 40px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.mat-dialog-content {
|
||||
max-width: 300px;
|
||||
.settings_field {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,57 @@
|
|||
<h2 mat-dialog-title class="text">Settings</h2>
|
||||
|
||||
<mat-dialog-content [formGroup]="settingsForm">
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Name</mat-label>
|
||||
<input matInput placeholder="Name" formControlName="name">
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Currency</mat-label>
|
||||
<mat-select formControlName="currency">
|
||||
<mat-option *ngFor="let coin of coins" [value]="coin.symbol">
|
||||
{{coin.label}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-slide-toggle formControlName="useZats" (change)="onChange($event)">
|
||||
Display Zcash amount in zatoshis?
|
||||
</mat-slide-toggle>
|
||||
<mat-slide-toggle formControlName="VkeyOn" (change)="onChangeVKeyOn($event)">
|
||||
Activate payment confirmation?
|
||||
</mat-slide-toggle>
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Viewing key</mat-label>
|
||||
<input matInput placeholder="Viewing Key" formControlName="vKey">
|
||||
</mat-form-field>
|
||||
</mat-dialog-content>
|
||||
<div class="settings-title">Settings</div>
|
||||
|
||||
<mat-dialog-actions>
|
||||
<button mat-raised-button class="text" (click)="close()">Cancel</button>
|
||||
<button mat-raised-button class="text" color="primary" (click)="save()">Save</button>
|
||||
</mat-dialog-actions>
|
||||
<div class="container">
|
||||
<mat-dialog-content [formGroup]="settingsForm">
|
||||
<mat-form-field class="settings-field" [style.width.%]="100">
|
||||
<mat-label>Name</mat-label>
|
||||
<input matInput
|
||||
width="100%"
|
||||
placeholder="Name"
|
||||
formControlName="name">
|
||||
</mat-form-field>
|
||||
<mat-form-field [style.width.%]="100" >
|
||||
<mat-label>Currency</mat-label>
|
||||
<mat-select formControlName="currency">
|
||||
<mat-option *ngFor="let coin of coins"
|
||||
[value]="coin.symbol">
|
||||
{{coin.label}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-slide-toggle formControlName="useZats"
|
||||
(change)="onChange($event)">
|
||||
Use zatoshis?
|
||||
</mat-slide-toggle>
|
||||
|
||||
<pre></pre>
|
||||
<mat-slide-toggle formControlName="VkeyOn"
|
||||
(change)="onChangeVKeyOn($event)">
|
||||
Activate payment confirmation?
|
||||
</mat-slide-toggle>
|
||||
<pre></pre>
|
||||
<mat-form-field [style.width.%]="100">
|
||||
<mat-label>Viewing key</mat-label>
|
||||
<input matInput placeholder="Your wallet viewing key"
|
||||
formControlName="VKey"
|
||||
[formControl]="viewkeyControl">
|
||||
|
||||
</mat-form-field>
|
||||
|
||||
</mat-dialog-content>
|
||||
|
||||
<mat-dialog-actions style="display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-top: 12px;">
|
||||
<button mat-raised-button
|
||||
(click)="close()">
|
||||
Cancel
|
||||
</button>
|
||||
<button mat-raised-button
|
||||
color="primary"
|
||||
(click)="save()">
|
||||
Save
|
||||
</button>
|
||||
</mat-dialog-actions>
|
||||
</div>
|
||||
|
|
@ -16,6 +16,7 @@ export class SettingsComponent implements OnInit {
|
|||
settingsForm: UntypedFormGroup;
|
||||
owner: Owner;
|
||||
useZats: boolean;
|
||||
useVKey: boolean = false;
|
||||
coins = [
|
||||
{
|
||||
label: 'US Dollar',
|
||||
|
|
@ -35,6 +36,8 @@ export class SettingsComponent implements OnInit {
|
|||
}
|
||||
];
|
||||
|
||||
viewkeyControl = new FormControl({ value: null, disabled: true });
|
||||
|
||||
constructor(
|
||||
private fb: UntypedFormBuilder,
|
||||
private dialogRef: MatDialogRef<SettingsComponent>,
|
||||
|
|
@ -44,10 +47,14 @@ export class SettingsComponent implements OnInit {
|
|||
this.settingsForm = fb.group({
|
||||
name: [data.name, Validators.required],
|
||||
currency: [data.currency, Validators.required],
|
||||
useZats: [data.zats, Validators.required],
|
||||
VkeyOn: [data.]
|
||||
useZats: [data.zats, Validators.required],
|
||||
VkeyOn: [data.payconf, Validators.required],
|
||||
VKey: [{value:data.viewkey, disabled: true },
|
||||
Validators.required
|
||||
]
|
||||
});
|
||||
this.owner = data;
|
||||
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
|
|
@ -60,7 +67,13 @@ export class SettingsComponent implements OnInit {
|
|||
save() {
|
||||
this.owner.name = this.settingsForm.value.name;
|
||||
this.owner.currency = this.settingsForm.value.currency;
|
||||
this.owner.zats = this.useZats;
|
||||
this.owner.zats = this.settingsForm.value.useZats;
|
||||
this.owner.payconf = this.useVKey;
|
||||
if ( this.settingsForm.value.VkeyOn ) {
|
||||
this.owner.viewkey = this.settingsForm.value.VKey;
|
||||
}
|
||||
else
|
||||
this.owner.viewkey = '';
|
||||
this.dialogRef.close(this.owner);
|
||||
}
|
||||
|
||||
|
|
@ -69,6 +82,15 @@ export class SettingsComponent implements OnInit {
|
|||
}
|
||||
|
||||
onChangeVKeyOn(ob: MatSlideToggleChange) {
|
||||
console.log("Viewing key switch is " + ( ob.checked ? "[ON]." : "[OFF].") );
|
||||
console.log("Viewing key switch is " +
|
||||
( ob.checked ? "[ON]." : "[OFF]." ) );
|
||||
|
||||
this.useVKey = ob.checked;
|
||||
|
||||
if ( ob.checked )
|
||||
this.viewkeyControl.enable()
|
||||
else
|
||||
this.viewkeyControl.disable();
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,13 +1,26 @@
|
|||
* {
|
||||
font-family: 'Spartan', sans-serif;
|
||||
}
|
||||
|
||||
.icon{
|
||||
font-family: 'Material Icons';
|
||||
}
|
||||
|
||||
|
||||
.shop-menu {
|
||||
font-family: Roboto, sans-serif;
|
||||
}
|
||||
|
||||
.main-buttons {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-top: 12px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.small{
|
||||
font-size: x-small;
|
||||
margin-top: 0px;
|
||||
}
|
||||
h3{
|
||||
margin-bottom: 0px;
|
||||
margin-top: 5px;
|
||||
font-size: 14px !important;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,16 +1,37 @@
|
|||
<app-header></app-header>
|
||||
<div align="center">
|
||||
<h3>{{(ownerUpdate | async)!.name}}</h3>
|
||||
<p class="small">{{ shortenZaddr((ownerUpdate | async)!.address) }}</p>
|
||||
<span align="center">
|
||||
<button mat-raised-button [routerLink]="['/orders']">View Orders</button>
|
||||
<button mat-raised-button class="text" (click)="openSettings()">
|
||||
<div class="shop-menu" align="center">
|
||||
<div style="margin-top: 8px;">
|
||||
<div style="font-size: 24px;
|
||||
font-weight: 700;">
|
||||
{{(ownerUpdate | async)!.name}}
|
||||
</div>
|
||||
<div class="small">
|
||||
{{ shortenZaddr((ownerUpdate | async)!.address) }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="main-buttons">
|
||||
<button mat-raised-button
|
||||
style="background: #ff4700;
|
||||
font-weight: 700;
|
||||
color: white;"
|
||||
[routerLink]="['/orders']">
|
||||
View Orders
|
||||
</button>
|
||||
<button mat-raised-button
|
||||
style="background: #ff4700;
|
||||
color: white;"
|
||||
class="text" (click)="openSettings()">
|
||||
<mat-icon class="icon">manage_accounts</mat-icon>
|
||||
</button>
|
||||
<a href="https://zgo.cash/" mat-raised-button target="_blank" rel="noopener noreferrer">
|
||||
<mat-icon class="icon">help</mat-icon>
|
||||
<a mat-raised-button
|
||||
style="background: #ff4700;
|
||||
color: white;"
|
||||
href="https://zgo.cash/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer">
|
||||
<mat-icon class="icon">help</mat-icon>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="orientation">
|
||||
<app-order></app-order>
|
||||
|
|
|
|||
Loading…
Reference in a new issue