diff --git a/backend/app.js b/backend/app.js index d9f10af..542816d 100644 --- a/backend/app.js +++ b/backend/app.js @@ -208,11 +208,25 @@ app.get('/api/getitems', (req, res, next) => { app.post('/api/item', (req, res, next) => { console.log('Post: /api/item'); - const item = new itemmodel(req.body.item); - item.save(); - res.status(201).json({ - message: 'Item added' - }); + if ( req.body.item._id == '' ) { + const item = new itemmodel(req.body.item); + item.save(); + res.status(201).json({ + message: 'Item added' + }); + } else { + console.log('Editing', req.body.item._id); + itemmodel.findByIdAndUpdate(req.body.item._id, {'name': req.body.item.name, 'description': req.body.item.description, 'cost': req.body.item.cost}, + function(err, docs) { + if (err) { + console.log(err); + } else { + res.status(201).json({ + message: 'Item updated' + }); + } + }); + } }); app.get('/api/price', (req, res, next) => { diff --git a/package-lock.json b/package-lock.json index 87e5d24..e687459 100644 --- a/package-lock.json +++ b/package-lock.json @@ -22,6 +22,7 @@ "angular-local-storage": "^0.7.1", "coingecko-api": "^1.0.10", "easyqrcodejs": "^4.4.6", + "material-design-icons": "^3.0.1", "rxjs": "~6.6.0", "tslib": "^2.3.0", "urlsafe-base64": "^1.0.0", @@ -8816,6 +8817,11 @@ "node": ">=0.10.0" } }, + "node_modules/material-design-icons": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/material-design-icons/-/material-design-icons-3.0.1.tgz", + "integrity": "sha1-mnHEh0chjrylHlGmbaaCA4zct78=" + }, "node_modules/mdn-data": { "version": "2.0.14", "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.14.tgz", @@ -22325,6 +22331,11 @@ "object-visit": "^1.0.0" } }, + "material-design-icons": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/material-design-icons/-/material-design-icons-3.0.1.tgz", + "integrity": "sha1-mnHEh0chjrylHlGmbaaCA4zct78=" + }, "mdn-data": { "version": "2.0.14", "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.14.tgz", diff --git a/package.json b/package.json index 1df6e58..3ff93ef 100644 --- a/package.json +++ b/package.json @@ -24,6 +24,7 @@ "angular-local-storage": "^0.7.1", "coingecko-api": "^1.0.10", "easyqrcodejs": "^4.4.6", + "material-design-icons": "^3.0.1", "rxjs": "~6.6.0", "tslib": "^2.3.0", "urlsafe-base64": "^1.0.0", diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 8292c5e..dae10ef 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -8,6 +8,7 @@ import { MatToolbarModule } from '@angular/material/toolbar'; import { MatExpansionModule } from '@angular/material/expansion'; import { HttpClientModule } from '@angular/common/http'; import { MatDialogModule } from '@angular/material/dialog'; +import { MatIconModule } from '@angular/material/icon'; import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; @@ -36,6 +37,7 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; AppRoutingModule, FormsModule, ReactiveFormsModule, + MatIconModule, HttpClientModule, MatInputModule, MatCardModule, @@ -45,6 +47,9 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; MatDialogModule, BrowserAnimationsModule ], + exports: [ + MatIconModule + ], providers: [], bootstrap: [AppComponent], entryComponents: [ItemCreateComponent] diff --git a/src/app/items/item-create/item-create.component.html b/src/app/items/item-create/item-create.component.html index 318936b..5b59798 100644 --- a/src/app/items/item-create/item-create.component.html +++ b/src/app/items/item-create/item-create.component.html @@ -2,6 +2,7 @@ + diff --git a/src/app/items/item-create/item-create.component.ts b/src/app/items/item-create/item-create.component.ts index 508d017..5d88995 100644 --- a/src/app/items/item-create/item-create.component.ts +++ b/src/app/items/item-create/item-create.component.ts @@ -12,21 +12,36 @@ import { Item } from '../item.model'; export class ItemCreateComponent implements OnInit { form: FormGroup; + id: string | undefined = ''; numberRegEx = /\d*\.?\d{1,2}/; constructor( private fb: FormBuilder, private dialogRef: MatDialogRef, - @Inject(MAT_DIALOG_DATA) {name, description, cost, user}:Item + @Inject(MAT_DIALOG_DATA) public data: Item ){ - this.form = fb.group({ - name: [null, Validators.required], - description: [null, Validators.required], - cost: new FormControl('', { - validators: [Validators.required, Validators.pattern(this.numberRegEx)], - updateOn: "blur" - }) - }); + if (data._id === '') { + this.form = fb.group({ + id: [null], + name: [null, Validators.required], + description: [null, Validators.required], + cost: new FormControl('', { + 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 FormControl(data.cost, { + validators: [Validators.required, Validators.pattern(this.numberRegEx)], + updateOn: "blur" + }) + }); + } } ngOnInit () { diff --git a/src/app/items/item-list/item-list.component.css b/src/app/items/item-list/item-list.component.css index 03c8440..ffdd64b 100644 --- a/src/app/items/item-list/item-list.component.css +++ b/src/app/items/item-list/item-list.component.css @@ -1,7 +1,11 @@ -* { +.card { font-family: 'Roboto-Mono', monospace; } +.icons { + font-family: 'Material Icons'; +} + .spacer{ flex: 1 1 auto; } @@ -15,5 +19,6 @@ div.card{ } p.price{ + font-family: 'Roboto-Mono', monospace; margin: 0px; } diff --git a/src/app/items/item-list/item-list.component.html b/src/app/items/item-list/item-list.component.html index e004b65..3e9f5b4 100644 --- a/src/app/items/item-list/item-list.component.html +++ b/src/app/items/item-list/item-list.component.html @@ -2,7 +2,7 @@
- + @@ -13,12 +13,29 @@
{{item.name}}
- +

{{item.description}}

+ + + + + + +
+ + + +
+

No items yet!


- + diff --git a/src/app/items/item-list/item-list.component.ts b/src/app/items/item-list/item-list.component.ts index c00b6f7..1e118bc 100644 --- a/src/app/items/item-list/item-list.component.ts +++ b/src/app/items/item-list/item-list.component.ts @@ -53,14 +53,44 @@ export class ItemListComponent implements OnInit{ dialogConfig.disableClose = true; dialogConfig.autoFocus = true; - dialogConfig.data = {name: '' , user: '', description: '', cost: 0} + dialogConfig.data = {_id: '', name: '' , user: '', description: '', cost: 0} const dialogRef = this.dialog.open(ItemCreateComponent, dialogConfig); dialogRef.afterClosed().subscribe((val) => { - //TODO connect to Item service - var item:Item = {name: val.name, description: val.description, cost: val.cost, user: this.owner.address}; - this.itemService.addItem(item); + if(val != null) { + var item:Item = {name: val.name, description: val.description, cost: val.cost, user: this.owner.address}; + this.itemService.addItem(item); + } + this.itemService.getItems(this.owner.address); + }); + } + + edit(id: string) { + //console.log('Edit:', id); + const item = this.items.find(element => element._id == id); + //console.log(item); + const dialogConfig = new MatDialogConfig(); + + dialogConfig.disableClose = true; + dialogConfig.autoFocus = true; + dialogConfig.data = item; + + const dialogRef = this.dialog.open(ItemCreateComponent, dialogConfig); + dialogRef.afterClosed().subscribe((val) => { + if (val != null) { + var editItem: Item = { + _id: val.id, + name: val.name, + description: val.description, + cost: val.cost, + user: this.owner.address + }; + //console.log('Edit:', editItem); + this.itemService.addItem(editItem).subscribe((response) => { + this.itemService.getItems(this.owner.address); + });; + } this.itemService.getItems(this.owner.address); }); } diff --git a/src/index.html b/src/index.html index ae9381f..ca1b85f 100644 --- a/src/index.html +++ b/src/index.html @@ -2,7 +2,7 @@ - Sell4zec + Z-Go!