Vergara_Tech/zgo
Vergara_Tech/zgo
2
1
Fork 0
Code Issues Pull requests Projects Releases 5 Packages Wiki Activity

UI language management: Global UI revision - Part 1

Browse source
This commit is contained in:
Rene V. Vergara A. 2023-03-02 21:59:33 -05:00
parent 1dddcb74ff
commit 23532f12a2
17 changed files with 209 additions and 61 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
src/app/cancel/cancel.component.html
View file

@ -1,19 +1,32 @@
<div class='cancelTitle'>{{ vE.cancelTitle }}</div>
<div class='cancelTitle'>{{title}}</div>
<div class="container" >
<mat-dialog-content>
<p class="text">{{msg}}</p>
<mat-dialog-content
style="font-family: 'Spartan', sans-serif;
display: flex;
justify-content: space-between;
margin-top: 20px;
padding: 20px;">
{{msg1}}<br>{{msg2}}
</mat-dialog-content>
<div style="display: flex;
<div style="font-family: 'Spartan', sans-serif;
display: flex;
justify-content: space-between;
margin-top: 20px;
padding: 20px;">
<button mat-raised-button
style="background-color: #ff5722;
font-family: 'Spartan', sans-serif;
font-size: 14px;
font-weight: 600;
color : white;"
(click)="confirm()">
{{ vE.cancelConfirmBtn }}
</button>
<button mat-raised-button (click)="close()">
<button mat-raised-button
style="font-family: 'Spartan', sans-serif;
font-size: 14px;
font-weight: 600;"
(click)="close()">
{{ vE.cancelDismissBtn }}
</button>
</div>

8
src/app/cancel/cancel.component.ts
View file

@ -12,7 +12,8 @@ import { LanguageData } from '../language.model';
export class CancelComponent {
title: string;
msg: string;
msg1: string;
msg2: string;
// -------------------------------------
//
// Language Support
@ -27,10 +28,11 @@ export class CancelComponent {
constructor(
private languageService : LanguageService,
private dialogRef: MatDialogRef<CancelComponent>,
@Inject(MAT_DIALOG_DATA) public data: { title: string, msg: string}
@Inject(MAT_DIALOG_DATA) public data: { title: string, msg1: string, msg2: string;}
) {
this.title = data.title;
this.msg = data.msg;
this.msg1 = data.msg1;
this.msg2 = data.msg2;
}
ngOnInit() {

15
src/app/header/header.component.ts
View file

@ -57,7 +57,10 @@ export class HeaderComponent implements OnInit, OnDestroy {
//
vE = {
headerGetCurrency : '',
headerLastBlock : ''
headerLastBlock : '',
headerLogoutLbl : '',
headerLogoutMsg1 : '',
headerLogoutMsg2 : ''
}
//
// ------------------------------------------------------------
@ -92,7 +95,11 @@ export class HeaderComponent implements OnInit, OnDestroy {
dialogConfig.disableClose = true;
dialogConfig.autoFocus = true;
dialogConfig.data = {title: 'Logout?', msg: 'Are you sure you want to disconnect from ZGo? You will have to re-link your wallet via shielded memo.'};
dialogConfig.data = { title: this.vE.headerLogoutLbl,
msg1: this.vE.headerLogoutMsg1,
msg2: this.vE.headerLogoutMsg2 };
console.log(dialogConfig.data);
const dialogRef = this.dialog.open(CancelComponent, dialogConfig);
dialogRef.afterClosed().subscribe(val => {
@ -118,6 +125,10 @@ export class HeaderComponent implements OnInit, OnDestroy {
this.vE.headerLastBlock = response.data.header_last_block;
this.vE.headerGetCurrency = response.data.header_get_currency;
this.vE.headerLogoutLbl = response.data.header_logout_lbl;
this.vE.headerLogoutMsg1 = response.data.header_logout_msg1;
this.vE.headerLogoutMsg2 = response.data.header_logout_msg2;
},
error => { console.log('Error >> ',error); }
);

2
src/app/items/item-add/item-add.component.css
View file

@ -12,5 +12,5 @@ input[type=number]{
color: white;
font-size: 26px;
text-align: center;
padding: 5px;
padding: 10px;
}

30
src/app/items/item-list/item-list.component.ts
View file

@ -69,7 +69,12 @@ export class ItemListComponent implements OnInit{
//
vE = {
itemlistAvailItems : '',
itemlistListEmpty : ''
itemlistListEmpty : '',
itemlistItemAdded : '',
itemlistItemUpdated : '',
itemlistItemDeleted : '',
itemlistNotifClose : '',
itemlistNotifSuccess : ''
}
//
// ------------------------------------------------------------
@ -115,8 +120,10 @@ export class ItemListComponent implements OnInit{
var item:Item = {_id: '', name: val.name, description: val.description, cost: val.cost, owner: this.owner.address};
this.itemService.addItem(item);
this.notifierService
.showNotification("Item successfully created!",
"Close","success");
.showNotification(this.vE.itemlistItemAdded ,
this.vE.itemlistNotifClose,
"success",
this.vE.itemlistNotifSuccess);
}
this.itemService.getItems(this.owner.address);
this.itemsUpdate.subscribe((items) => {
@ -150,8 +157,10 @@ export class ItemListComponent implements OnInit{
this.itemService.getItems(this.owner.address);
});
this.notifierService
.showNotification("Item information updated!!",
"Close","success");
.showNotification(this.vE.itemlistItemUpdated,
this.vE.itemlistNotifClose,
"success",
this.vE.itemlistNotifSuccess);
}
this.itemService.getItems(this.owner.address);
});
@ -174,8 +183,10 @@ export class ItemListComponent implements OnInit{
this.itemService.deleteItem(val);
this.items = [];
this.notifierService
.showNotification("Item deleted!!",
"Close","success");
.showNotification(this.vE.itemlistItemDeleted,
this.vE.itemlistNotifClose,
"success",
this.vE.itemlistNotifSuccess);
}
this.itemService.getItems(this.owner.address);
this.itemsUpdate.subscribe((items) => {
@ -222,6 +233,11 @@ export class ItemListComponent implements OnInit{
this.vE.itemlistListEmpty = response.data.itemlist_list_empty;
this.vE.itemlistAvailItems = response.data.itemlist_avail_items;
this.vE.itemlistItemAdded = response.data.itemlist_item_added;
this.vE.itemlistItemUpdated = response.data.itemlist_item_updated;
this.vE.itemlistItemDeleted = response.data.itemlist_item_deleted;
this.vE.itemlistNotifClose = response.data.itemlist_notif_close;
this.vE.itemlistNotifSuccess = response.data.itemlist_notif_success;
},
error => { console.log('Error >> ',error); }
);

8
src/app/language.service.ts
View file

@ -12,13 +12,13 @@ var Buffer = require('buffer/').Buffer;
export class LanguageService {
//
// URL for test using REST API to local MariaDB database
// private baseURL = 'http://localhost:8080/zgointl';
private baseURL = 'http://localhost:8080/zgointl';
//
// URL for test using REST API to local MongoDB database
// private baseURL = 'http://localhost:5000/zgointl';
//
// URL for access MongoDB database from remote server
private baseURL = ConfigData.Be_URL + 'api/getlang';
// private baseURL = ConfigData.Be_URL + 'api/getlang';
public zgoLanguage: string = '';
@ -48,8 +48,8 @@ export class LanguageService {
return this.http.get<LanguageData>(this.baseURL +
'/?lang=' + this.zgoLanguage +
'&component=' + viewName
,
{ headers : reqHeaders }
// ,
// { headers : reqHeaders }
);
}
}

4
src/app/listorders/listorders.component.css
View file

@ -128,12 +128,12 @@ img.icon{
.minibutton {
font-family: 'Spartan', sans-serif;
font-size: 12px;
font-size: 14px;
background: #ff5722;
color: white;
height: 24px;
line-height: 20px;
padding: 2px;
padding: 10px;
}
.spacer {

6
src/app/order/order.component.css
View file

@ -55,8 +55,8 @@ img.icon{
background-color: #ff5722;
color: white;
font-weight: 500;
height: 25px !important;
width: 105px !important;
height: 30px !important;
width: 115px !important;
display: flex;
align-items: center;
justify-content: center;
@ -67,7 +67,7 @@ img.icon{
.button-cancel-class {
font-family: 'Spartan', sans-serif;
font-weight: 500;
height: 25px !important;
height: 30px !important;
width: 100px !important;
display: flex;
align-items: center;

2
src/app/order/order.component.html
View file

@ -79,7 +79,7 @@
</table>
</div>
<div class="container" style="margin: 2px;
height: 35px;
height: 40px;
background: lightblue;
border-top: 2px solid lightgray;
border-bottom: 2px solid lightgray;

5
src/app/prompt-invoice/prompt-invoice.component.css
View file

@ -1,3 +1,8 @@
::ng-deep .mdc-button__label {
font-family: "Spartan" sans-serif;
font-size: 14px;
font-weight: 600;
}
::ng-deep .invoice {
font-family: "Spartan";

4
src/app/prompt-invoice/prompt-invoice.component.html
View file

@ -15,7 +15,7 @@
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td class="urlDetail"
style="text-align: left;"
width="94%">
@ -39,7 +39,7 @@
</a>
</td>
</tbody>
</tr>
</table>
<mat-dialog-actions>

5
src/app/prompt-receipt/prompt-receipt.component.css
View file

@ -1,3 +1,8 @@
::ng-deep .mdc-button__label {
font-family: "Spartan" sans-serif;
font-size: 14px;
font-weight: 600;
}
::ng-deep .invoice {
font-family: "Spartan";

70
src/app/scan/scan.component.css
View file

@ -1,12 +1,76 @@
.text {
font-family: 'Spartan', sans-serif;
}
.scan_header {
font-family: 'Spartan', sans-serif;
font-size: 24px;
font-weight: 600;
text-align: center;
padding: 10px;
color: white;
background: #ff5722;
}
.scan_message {
font-family: 'Spartan', sans-serif;
font-size: 16px;
font-weight: 600;
text-align: center;
color: black;
padding: 10px;
}
.scan_message2 {
font-family: 'Spartan', sans-serif;
font-size: 16px;
font-weight: 600;
text-align: center;
color: black;
padding-top: 30px;
padding-bottom: 30px;
}
.scan_button_send {
font-family: 'Spartan', sans-serif;
font-size: 12px;
font-weight: 500;
text-align: center;
color: white;
background: #ff5722;
align-items: center;
}
.scan_button_close {
font-family: 'Spartan', sans-serif;
font-size: 12px;
font-weight: 500;
text-align: center;
align-items: center;
}
.scan_button_row1 {
font-family: 'Spartan', sans-serif;
font-size: 12px;
align-items: center;
height: 30px;
}
.scan_button_row2 {
font-family: 'Spartan', sans-serif;
font-size: 20px;
height: 30px;
padding: 20px;
padding-top: 20px;
padding-left: 20px;
padding-right: 20px;
padding-bottom: 20px;
}
.mat-dialog-title{
line-height: 20px;
}
h4.text{
margin: 0px;
}
.small {
font-size: small;
}

52
src/app/scan/scan.component.html
View file

@ -1,32 +1,54 @@
<div align="center" mat-dialog-title>
<h4 class="text">{{ vE.scanScanqrCode }}</h4>
<div class="scan_header">{{ vE.scanScanqrCode }}
</div>
<mat-dialog-content>
<div align="center">
<p class="text">{{ vE.scanTextInfo }}</p>
<p class="scan_message">{{ vE.scanTextInfo }}</p>
<div class="qrcode" id="checkout-qr"></div>
</div>
</mat-dialog-content>
<mat-dialog-actions>
<table cellspacing="0" width="100%">
<table width="100%">
<tr>
<td>
<button mat-raised-button class="text" color="primary" (click)="confirm()">
<td align="center">
<button mat-raised-button class="scan_button_send" (click)="confirm()">
<mat-icon class="icon">verified_user</mat-icon>{{ vE.scanMemoSent }}
</button>
</td>
<td align="right">
<button mat-raised-button class="text" (click)="close()">
<td align="center">
<button mat-raised-button class="scan_button_close" (click)="close()">
<mat-icon class="icon">close</mat-icon>{{ vE.scanCloseBtn }}
</button>
</td>
</tr>
</table>
</mat-dialog-actions>
<div align="center">
<p class="small text">{{ vE.scanUseThis }}<a [href]="zcashUrl">{{vE.scanWalletLink}}</a>, or</p>
<button class="small text" (click)="copyAddress()">{{ vE.scanCopyAddress }}</button>
<button class="small text" (click)="copyAmount()">{{ vE.scanCopyAmount }}</button>
<button class="small text" (click)="copyMemo()">{{ vE.scanCopyMemo }}</button>
<div class='scan_message2'>
{{ vE.scanCantScan }}<br> {{ vE.scanUseThis }}<a [href]="zcashUrl">{{vE.scanWalletLink}}</a>,<br>{{ vE.scanOrButton }}
</div>
<table style="width:100%;
padding-left: 30px;
padding-right: 30px;">
<tr>
<td align="center" style="width: 45%;">
<button style="font-size: 14px;" (click)="copyAddress()">{{ vE.scanCopyAddress }}</button>
</td>
<td style="width: 10%;"></td>
<td align="center" style="width: 45%;">
<button style="font-size: 14px;" (click)="copyAmount()">{{ vE.scanCopyAmount }}</button>
</td>
</tr>
</table>
<table style="width:100%;
padding-top: 10px;
padding-left: 30px;
padding-right: 30px;
padding-bottom: 10px;">
<tr>
<td align="center" >
<button style="font-size: 14px;" (click)="copyMemo()">{{ vE.scanCopyMemo }}</button>
</td>
</tr>
</table>

6
src/app/scan/scan.component.ts
View file

@ -42,7 +42,9 @@ export class ScanComponent implements OnInit{
scanNotservError : '',
scanFuncNotavail : '',
scanCopyError : '',
scanFailPayment : ''
scanFailPayment : '',
scanCantScan : '',
scanOrButton : ''
}
//
constructor(
@ -166,6 +168,8 @@ export class ScanComponent implements OnInit{
this.vE.scanNotservClose = response.data.scan_notserv_close;
this.vE.scanNotservError = response.data.scan_notserv_error;
this.vE.scanFuncNotavail = response.data.scan_func_notavail;
this.vE.scanCantScan = response.data.scan_cant_scan;
this.vE.scanOrButton = response.data.scan_or_button;
},
error => { console.log('Error >> ',error); }

5
src/app/settings/settings.component.css
View file

@ -2,6 +2,11 @@
font-family: 'Spartan', sans-serif;
}
::ng-deep .mdc-tab__text-label {
font-family: 'Spartan', sans-serif;
font-size: 14px;
}
.settings-title {
font-family: 'Spartan', sans-serif;
background: #ff5722;

3
src/app/settings/settings.component.html
View file

@ -7,7 +7,8 @@
margin-left: 10px;
margin-right: 10px;">
<mat-tab-group mat-tab-align-tabs="start">
<mat-tab label="{{ vE.settingsTabMainlbl }}" style="height: 400px;">
<mat-tab label="{{ vE.settingsTabMainlbl }}"
style="height: 400px;">
<div class="container" style="margin-bottom: 20px;">
<mat-dialog-content [formGroup]="settingsForm">
<mat-form-field class="settings-field" [style.width.%]="100">