diemarfe64635/einkaufszettel
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

saving data to ember store

Browse Source
This commit is contained in:
diemarfe64635
2020-06-26 18:16:35 +02:00
parent e75e22316e
commit c41cecebd6
17 changed files with 109 additions and 129 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/components/produkt.hbs
+6 -8
View File
@@ -1,11 +1,9 @@
<button type="button" class="produkt {{if this.isSelected "selected"}}" {{on "click" (fn this.toggleSelection @produkt.titel)}}>
<img src={{@produkt.bild}} alt="Ein Bild von {{@produkt.titel}}"/>
<div class="detail">
<h3>{{@produkt.titel}}</h3>
<ul class="details">
<li class="detail"><h4>Menge:</h4> {{@produkt.menge}}{{@produkt.einheit}}</li>
</ul>
</div>
<button type="button" class="produkt {{if @isSelected "selected"}}" {{on "click" (fn this.toggleSelection @titel)}}>
<img src={{@bild}} alt="Ein Bild von {{@titel}}"/>
<h3>{{@titel}}</h3>
<ul class="details">
<li class="detail"><h4>Menge:</h4> {{@menge}}{{@einheit}}</li>
</ul>
</button>
app/components/produkt.js
+18 -14
View File
@@ -5,7 +5,7 @@ import { inject as service } from '@ember/service';
export default class ProduktController extends Component {
@tracked isLarge = false;
@tracked isSelected = false;
@tracked isSelected;
@service store;
@@ -17,18 +17,19 @@ export default class ProduktController extends Component {
@action toggleSelection(produktname)
{
this.isSelected = !this.isSelected;
this.setStatus(produktname);
this.setStatus(produktname, this.isSelected);
}
@action getStatus(produktname)
{
//sucht Produkt im Store
this.store.findAll('produkt')
.then(function(suchergebnis)
{
suchergebnis.forEach(element => {
if(element.titel==produktname)
{
this.isSelected = element.getStatus().isSelected;
this.isSelected = element.isSelected;
}
});
@@ -39,17 +40,20 @@ export default class ProduktController extends Component {
});
}
setStatus(produktname)
setStatus(produktname, selection)
{
//schreibt den aktuellen Zustand in den store
let suchergebnis = this.store.query('produkt', {
filter:
{
titel: produktname
}}).then(function(element)
{
element.isSelected = this.isSelected;
});;
//schreibt den aktuellen Zustand in den Store
this.store.findAll('produkt')
.then(function(suchergebnis)
{
suchergebnis.forEach(element => {
if(element.titel==produktname)
{
element.isSelected = selection;
element.save();
this.store.updateRelationships();
}
});
});
}
}
app/components/rezept.hbs
+21 -27
View File
@@ -1,35 +1,29 @@
{{#if this.isSelected}}
<button type="button" class="rezept selected" {{on "click" this.toggleSelection}}>
<span><img src={{@rezept.bild}} alt="Ein Bild von {{@rezept.titel}}"/></span>
{{#if @isSelected}}
<button type="button" class="rezept selected" {{on "click" (fn this.toggleSelection @titel)}}>
<span><img src={{@bild}} alt="Ein Bild von {{@titel}}"/></span>
<span>
<div class="detail">
<h3>{{@rezept.titel}}</h3>
<ul class="details">
<li class="detail"><h4>Zutaten:</h4>{{#each @rezept.produkte as |produkt|}}
{{produkt.attributes.titel}},
{{/each}}Gewürze</li>
<li class="detail"><h4>Personen:</h4>{{@rezept.personen}}</li>
<li class="detail"><h4>Dauer:</h4>{{@rezept.dauer}} Minuten</li>
</ul>
</div>
<h3>{{@titel}}</h3>
<ul class="details">
<li class="detail"><h4>Zutaten:</h4>{{#each @produkte as |produkt|}}
{{produkt.attributes.titel}},
{{/each}}Gewürze</li>
<li class="detail"><h4>Personen:</h4>{{@personen}}</li>
<li class="detail"><h4>Dauer:</h4>{{@dauer}} Minuten</li>
</ul>
</span>
</button>
{{else}}
<button type="button" class="rezept" {{on "click" this.toggleSelection}}>
<span><img src={{@rezept.bild}} alt="Ein Bild von {{@rezept.titel}}"/></span>
<button type="button" class="rezept" {{on "click" (fn this.toggleSelection @titel)}}>
<span><img src={{@bild}} alt="Ein Bild von {{@titel}}"/></span>
<span>
<div class="detail">
<h3>{{@rezept.titel}}</h3>
<ul class="details">
<li class="detail"><h4>Zutaten:</h4>{{#each @rezept.produkte as |produkt|}}
{{produkt.attributes.titel}},
{{/each}}Gewürze</li>
<li class="detail"><h4>Personen:</h4>{{@rezept.personen}} </li>
<li class="detail"><h4>Dauer:</h4>{{@rezept.dauer}} Minuten</li>
</ul>
</div>
<h3>{{@titel}}</h3>
<ul class="details">
<li class="detail"><h4>Zutaten:</h4>{{#each @produkte as |produkt|}}
{{produkt.attributes.titel}},
{{/each}}Gewürze</li>
<li class="detail"><h4>Personen:</h4>{{@personen}} </li>
<li class="detail"><h4>Dauer:</h4>{{@dauer}} Minuten</li>
</ul>
</span>
</button>
{{/if}}
app/components/rezept.js
+22 -2
View File
@@ -1,18 +1,38 @@
import Component from '@glimmer/component';
import { action } from '@ember/object';
import { tracked } from '@glimmer/tracking';
import { inject as service } from '@ember/service';
export default class RezeptController extends Component {
@tracked isLarge = false;
@tracked isSelected = false;
@tracked isSelected;
@service store;
@action toggleSize()
{
this.isLarge = !this.isLarge;
}
@action toggleSelection()
@action toggleSelection(rezeptname)
{
this.isSelected = !this.isSelected;
this.setStatus(rezeptname, this.isSelected);
}
setStatus(rezeptname, selection)
{
//schreibt den aktuellen Zustand in den Store
this.store.findAll('rezept')
.then(function(suchergebnis)
{
suchergebnis.forEach(element => {
if(element.titel==rezeptname)
{
element.isSelected = selection;
element.save();
}
});
});
}
}
app/components/services/store.js
-4
View File
@@ -1,4 +0,0 @@
import DS from 'ember-data';
export default DS.Store.extend({
});