Merge branch 'zgo-test' of gitlab.com:pitmutt/zgo into zgo-test
This commit is contained in:
commit
e91a2e86df
15 changed files with 331 additions and 122 deletions
|
@ -25,6 +25,7 @@ import { ViewerComponent } from './viewer/viewer.component';
|
|||
import { LoginComponent } from './login/login.component';
|
||||
import { ItemListComponent } from './items/item-list/item-list.component';
|
||||
import { ItemCreateComponent } from './items/item-create/item-create.component';
|
||||
import { ItemEditComponent } from './items/item-edit/item-edit.component';
|
||||
import { ItemDeleteComponent } from './items/item-delete/item-delete.component';
|
||||
import { ItemAddComponent} from './items/item-add/item-add.component';
|
||||
import { OrderComponent } from './order/order.component';
|
||||
|
@ -54,6 +55,7 @@ import { NotifierComponent } from './notifier/notifier.component';
|
|||
LoginComponent,
|
||||
OrderComponent,
|
||||
ItemCreateComponent,
|
||||
ItemEditComponent,
|
||||
ItemDeleteComponent,
|
||||
ItemAddComponent,
|
||||
CancelComponent,
|
||||
|
|
|
@ -5,3 +5,12 @@
|
|||
input[type=number]{
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.itemDataTitle {
|
||||
font-family: 'Spartan', sans-serif;
|
||||
background: #ff5722;
|
||||
color: white;
|
||||
font-size: 26px;
|
||||
text-align: center;
|
||||
padding: 5px;
|
||||
}
|
|
@ -1,13 +1,21 @@
|
|||
<h2 mat-dialog-title class="text">Add to Order</h2>
|
||||
<div class='itemDataTitle'>Add to Order</div>
|
||||
|
||||
<mat-dialog-content [formGroup]="orderForm">
|
||||
<div class='container'>
|
||||
<mat-dialog-content [formGroup]="orderForm">
|
||||
<p class="text">{{lineItem.name}}</p>
|
||||
<mat-form-field>
|
||||
<mat-form-field [style.width.%]="100">
|
||||
<input matInput type="number" placeholder="Quantity" formControlName="qty">
|
||||
</mat-form-field>
|
||||
</mat-dialog-content>
|
||||
</mat-dialog-content>
|
||||
|
||||
<mat-dialog-actions>
|
||||
<button mat-raised-button class="text" (click)="close()">Cancel</button>
|
||||
<button mat-raised-button class="text" color="primary" (click)="save()">Add</button>
|
||||
</mat-dialog-actions>
|
||||
<div style="display: flex;
|
||||
justify-content: space-between;">
|
||||
<button mat-raised-button
|
||||
class="text"
|
||||
(click)="close()">Cancel</button>
|
||||
<button mat-raised-button
|
||||
class="text"
|
||||
color="primary"
|
||||
(click)="save()">Add</button>
|
||||
</div>
|
||||
</div>
|
|
@ -1,4 +1,4 @@
|
|||
import { Inject, Component, OnInit, OnDestroy, ViewEncapsulation } from '@angular/core';
|
||||
import { Inject, Component, OnInit, OnDestroy, ViewEncapsulation} from '@angular/core';
|
||||
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
|
||||
import { UntypedFormBuilder, Validators, UntypedFormGroup, FormControl } from '@angular/forms';
|
||||
import { LineItem } from '../lineitem.model';
|
||||
|
|
|
@ -5,3 +5,12 @@
|
|||
input[type=number]{
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.itemDataTitle {
|
||||
font-family: 'Spartan', sans-serif;
|
||||
background: #ff5722;
|
||||
color: white;
|
||||
font-size: 26px;
|
||||
text-align: center;
|
||||
padding: 5px;
|
||||
}
|
||||
|
|
|
@ -1,25 +1,39 @@
|
|||
<h2 mat-dialog-title class="text">Add item</h2>
|
||||
|
||||
<mat-dialog-content [formGroup]="form">
|
||||
<mat-form-field class="text" appearance="outline">
|
||||
<div class='itemDataTitle'>Add Item</div>
|
||||
|
||||
<div class='container' style="margin-top: 20px;">
|
||||
<mat-dialog-content [formGroup]="form">
|
||||
<span style="line-height: 10px;"></span>
|
||||
<mat-form-field class="text" [style.width.%]="100">
|
||||
<mat-label>Item</mat-label>
|
||||
<input type="hidden" formControlName="id">
|
||||
<input matInput placeholder="Item" formControlName="name">
|
||||
</mat-form-field>
|
||||
<mat-form-field class="text" appearance="outline">
|
||||
<input matInput
|
||||
placeholder="Item"
|
||||
formControlName="name"
|
||||
maxlength="16">
|
||||
</mat-form-field >
|
||||
<mat-form-field class="text" [style.width.%]="100">
|
||||
<mat-label>Description</mat-label>
|
||||
<textarea matInput placeholder="Description" formControlName="description"></textarea>
|
||||
<textarea matInput
|
||||
placeholder="Description"
|
||||
formControlName="description"
|
||||
maxlength="30"
|
||||
style="line-height:20px;
|
||||
overflow:auto;"></textarea>
|
||||
</mat-form-field>
|
||||
<mat-form-field class="text" appearance="outline">
|
||||
<mat-form-field class="text" [style.width.%]="100">
|
||||
<mat-label>Price</mat-label>
|
||||
<input matInput type="number" placeholder="Price" formControlName="cost">
|
||||
<div *ngIf="!form.controls['cost'].valid && form.controls['cost'].touched">
|
||||
<div *ngIf="form.controls['cost'].errors?.pattern">Use only numbers</div>
|
||||
</div>
|
||||
</mat-form-field>
|
||||
</mat-dialog-content>
|
||||
</mat-dialog-content>
|
||||
|
||||
<mat-dialog-actions>
|
||||
<div style="display: flex;
|
||||
justify-content: space-between;">
|
||||
<button mat-raised-button class="text" (click)="close()">Close</button>
|
||||
<button mat-raised-button class="text" color="primary" (click)="save()">Save</button>
|
||||
</mat-dialog-actions>
|
||||
</div>
|
||||
|
||||
</div>
|
16
src/app/items/item-edit/item-edit.component.css
Normal file
16
src/app/items/item-edit/item-edit.component.css
Normal file
|
@ -0,0 +1,16 @@
|
|||
.text {
|
||||
font-family: 'Spartan', sans-serif;
|
||||
}
|
||||
|
||||
input[type=number]{
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.itemDataTitle {
|
||||
font-family: 'Spartan', sans-serif;
|
||||
background: #ff5722;
|
||||
color: white;
|
||||
font-size: 26px;
|
||||
text-align: center;
|
||||
padding: 5px;
|
||||
}
|
39
src/app/items/item-edit/item-edit.component.html
Normal file
39
src/app/items/item-edit/item-edit.component.html
Normal file
|
@ -0,0 +1,39 @@
|
|||
|
||||
<div class='itemDataTitle'>Edit Item</div>
|
||||
|
||||
<div class='container' style="margin-top: 20px;">
|
||||
<mat-dialog-content [formGroup]="form">
|
||||
<span style="line-height: 10px;"></span>
|
||||
<mat-form-field class="text" [style.width.%]="100">
|
||||
<mat-label>Item</mat-label>
|
||||
<input type="hidden" formControlName="id">
|
||||
<input matInput
|
||||
placeholder="Item"
|
||||
formControlName="name"
|
||||
maxlength="16">
|
||||
</mat-form-field >
|
||||
<mat-form-field class="text" [style.width.%]="100">
|
||||
<mat-label>Description</mat-label>
|
||||
<textarea matInput
|
||||
placeholder="Description"
|
||||
formControlName="description"
|
||||
maxlength="30"
|
||||
style="line-height:20px;
|
||||
overflow:auto;"></textarea>
|
||||
</mat-form-field>
|
||||
<mat-form-field class="text" [style.width.%]="100">
|
||||
<mat-label>Price</mat-label>
|
||||
<input matInput type="number" placeholder="Price" formControlName="cost">
|
||||
<div *ngIf="!form.controls['cost'].valid && form.controls['cost'].touched">
|
||||
<div *ngIf="form.controls['cost'].errors?.pattern">Use only numbers</div>
|
||||
</div>
|
||||
</mat-form-field>
|
||||
</mat-dialog-content>
|
||||
|
||||
<div style="display: flex;
|
||||
justify-content: space-between;">
|
||||
<button mat-raised-button class="text" (click)="close()">Close</button>
|
||||
<button mat-raised-button class="text" color="primary" (click)="save()">Save</button>
|
||||
</div>
|
||||
|
||||
</div>
|
59
src/app/items/item-edit/item-edit.component.ts
Normal file
59
src/app/items/item-edit/item-edit.component.ts
Normal file
|
@ -0,0 +1,59 @@
|
|||
import { Inject, Component, OnInit, OnDestroy, ViewEncapsulation } from '@angular/core';
|
||||
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
|
||||
import { UntypedFormBuilder, Validators, UntypedFormGroup, UntypedFormControl } from '@angular/forms';
|
||||
import { Item } from '../item.model';
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-item-edit',
|
||||
templateUrl: './item-edit.component.html',
|
||||
styleUrls: ['./item-edit.component.css']
|
||||
})
|
||||
|
||||
export class ItemEditComponent implements OnInit {
|
||||
|
||||
form: UntypedFormGroup;
|
||||
id: string | undefined = '';
|
||||
numberRegEx = /\d*\.?\d{1,2}/;
|
||||
|
||||
constructor(
|
||||
private fb: UntypedFormBuilder,
|
||||
private dialogRef: MatDialogRef<ItemEditComponent>,
|
||||
@Inject(MAT_DIALOG_DATA) public data: Item
|
||||
){
|
||||
if (data._id === '') {
|
||||
this.form = fb.group({
|
||||
id: [''],
|
||||
name: [null, Validators.required],
|
||||
description: [null, Validators.required],
|
||||
cost: new UntypedFormControl('', {
|
||||
validators: [Validators.required, Validators.pattern(this.numberRegEx)],
|
||||
updateOn: "blur"
|
||||
})
|
||||
});
|
||||
} else {
|
||||
this.id = data._id;
|
||||
this.form = fb.group({
|
||||
id: [data._id],
|
||||
name: [data.name, Validators.required],
|
||||
description: [data.description, Validators.required],
|
||||
cost: new UntypedFormControl(data.cost, {
|
||||
validators: [Validators.required, Validators.pattern(this.numberRegEx)],
|
||||
updateOn: "blur"
|
||||
})
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
ngOnInit () {
|
||||
}
|
||||
|
||||
save() {
|
||||
// console.log(this.form.value);
|
||||
this.dialogRef.close(this.form.value);
|
||||
}
|
||||
|
||||
close () {
|
||||
this.dialogRef.close();
|
||||
}
|
||||
}
|
|
@ -35,12 +35,26 @@ p.price{
|
|||
text-align: right;
|
||||
}
|
||||
|
||||
.buttons-class {
|
||||
background-color: #ff5722;
|
||||
color: white;
|
||||
font-family: 'Spartan', sans-serif;
|
||||
font-size: 12px !important;
|
||||
font-weight: 700;
|
||||
height: 25px !important;
|
||||
width: 100px !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.buttons-class-cart{
|
||||
background-color: #ff5722;
|
||||
color: white;
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
height: 25px !important;
|
||||
height:30px !important;
|
||||
width: 50px !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
@ -49,10 +63,14 @@ p.price{
|
|||
}
|
||||
|
||||
.availableItems{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
background: lightblue;
|
||||
font-family: Roboto Mono;
|
||||
font-family: 'Spartan', sans-serif !important;
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
text-align: left;
|
||||
margin: 5px;
|
||||
height: 25px;
|
||||
padding: 12px;
|
||||
}
|
||||
|
|
|
@ -1,7 +1,19 @@
|
|||
<div *ngIf="items.length > 0">
|
||||
<div class="availableItems" >
|
||||
Available Items:
|
||||
<button mat-raised-button
|
||||
class="buttons-class"
|
||||
(click)="openDialog()">
|
||||
<mat-icon class="icon">
|
||||
add
|
||||
</mat-icon>
|
||||
Add item
|
||||
</button>
|
||||
|
||||
</div>
|
||||
<div style="display: block;
|
||||
overflow-y: auto;
|
||||
height: 500px;">
|
||||
<div class="card" *ngFor="let item of itemsUpdate | async">
|
||||
<mat-card>
|
||||
<table cellspacing="0" width="100%" >
|
||||
|
@ -63,14 +75,19 @@
|
|||
</mat-card-actions>
|
||||
</mat-card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p *ngIf = "items.length <= 0">No items yet!</p>
|
||||
<br>
|
||||
<button class="text"
|
||||
mat-raised-button
|
||||
<div *ngIf = "items.length <= 0">
|
||||
<div class="availableItems" >
|
||||
No items yet!
|
||||
<button mat-raised-button
|
||||
class="buttons-class"
|
||||
(click)="openDialog()">
|
||||
<mat-icon class="icon">
|
||||
add
|
||||
</mat-icon>
|
||||
Add item
|
||||
</button>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import { Component, OnInit, Input } from '@angular/core';
|
||||
import { Input, Inject, Component, OnInit } from '@angular/core';
|
||||
import { MatDialog, MatDialogConfig} from '@angular/material/dialog';
|
||||
|
||||
import { faCartShopping } from '@fortawesome/free-solid-svg-icons';
|
||||
|
@ -11,9 +11,10 @@ import { UserService } from '../../user.service';
|
|||
import { ItemService } from '../items.service';
|
||||
import { OrderService} from '../../order/order.service';
|
||||
import { ItemCreateComponent } from '../item-create/item-create.component';
|
||||
import { ItemEditComponent } from '../item-edit/item-edit.component';
|
||||
import { ItemDeleteComponent } from '../item-delete/item-delete.component';
|
||||
import { ItemAddComponent } from '../item-add/item-add.component';
|
||||
|
||||
import { NotifierService } from '../../notifier.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-item-list',
|
||||
|
@ -64,8 +65,9 @@ export class ItemListComponent implements OnInit{
|
|||
userService: UserService,
|
||||
public orderService: OrderService,
|
||||
public fullnodeService: FullnodeService,
|
||||
private dialog: MatDialog
|
||||
) {
|
||||
private dialog: MatDialog,
|
||||
private notifierService: NotifierService )
|
||||
{
|
||||
this.ownerUpdate = userService.ownerUpdate;
|
||||
this.itemsUpdate = itemService.itemsUpdated;
|
||||
this.ownerUpdate.subscribe((owner) => {
|
||||
|
@ -97,6 +99,9 @@ export class ItemListComponent implements OnInit{
|
|||
if(val != null) {
|
||||
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");
|
||||
}
|
||||
this.itemService.getItems(this.owner.address);
|
||||
this.itemsUpdate.subscribe((items) => {
|
||||
|
@ -115,7 +120,7 @@ export class ItemListComponent implements OnInit{
|
|||
dialogConfig.autoFocus = true;
|
||||
dialogConfig.data = item;
|
||||
|
||||
const dialogRef = this.dialog.open(ItemCreateComponent, dialogConfig);
|
||||
const dialogRef = this.dialog.open(ItemEditComponent, dialogConfig);
|
||||
dialogRef.afterClosed().subscribe((val) => {
|
||||
if (val != null) {
|
||||
var editItem: Item = {
|
||||
|
@ -128,7 +133,10 @@ export class ItemListComponent implements OnInit{
|
|||
//console.log('Edit:', editItem);
|
||||
this.itemService.addItem(editItem).subscribe((response) => {
|
||||
this.itemService.getItems(this.owner.address);
|
||||
});;
|
||||
});
|
||||
this.notifierService
|
||||
.showNotification("Item information updated!!",
|
||||
"Close","success");
|
||||
}
|
||||
this.itemService.getItems(this.owner.address);
|
||||
});
|
||||
|
|
|
@ -110,6 +110,12 @@ img.icon{
|
|||
|
||||
.minibutton {
|
||||
font-family: 'Spartan', sans-serif;
|
||||
font-size: 12px;
|
||||
background: #ff5722;
|
||||
color: white;
|
||||
height: 24px;
|
||||
line-height: 20px;
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.spacer {
|
||||
|
|
|
@ -122,7 +122,11 @@
|
|||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div align="center">
|
||||
<div style="display: flex;
|
||||
justify-content: space-between;
|
||||
padding-left: 20%;
|
||||
padding-right: 20%;
|
||||
margin-top: 10px;">
|
||||
<span>
|
||||
<button mat-stroked-button class="minibutton" color="primary" (click)="invoice(order)">Invoice</button>
|
||||
</span>
|
||||
|
|
|
@ -12,7 +12,7 @@ img.icon{
|
|||
}
|
||||
|
||||
.noOrderMsg {
|
||||
font-family: Roboto Mono;
|
||||
font-family: 'Roboto Mono';
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
margin: 10px;
|
||||
|
@ -21,7 +21,7 @@ img.icon{
|
|||
}
|
||||
|
||||
.newOrder {
|
||||
font-family: Roboto Mono !important;
|
||||
font-family: 'Roboto Mono' !important;
|
||||
}
|
||||
|
||||
.newOrderTitle1 {
|
||||
|
@ -78,7 +78,7 @@ img.icon{
|
|||
|
||||
.availableItems{
|
||||
background: lightblue;
|
||||
font-family: Roboto Mono;
|
||||
font-family: 'Roboto Mono';
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
text-align: left;
|
||||
|
|
Loading…
Reference in a new issue