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({
});
app/models/produkt.js
+1 -1
View File
@@ -2,7 +2,7 @@ import Model, { attr } from '@ember-data/model';
export default class ProduktModel extends Model {
@attr titel;
@attr isSelected;
@attr ('boolean') isSelected;
@attr kategorie;
@attr menge;
@attr einheit;
app/models/rezept.js
+1 -1
View File
@@ -2,7 +2,7 @@ import Model, { attr, hasMany } from '@ember-data/model';
export default class RezeptModel extends Model {
@attr titel;
@attr isSelected;
@attr ('boolean') isSelected;
@attr ('string') beschreibung;
@attr kategorie;
@attr produkte;
app/router.js
+1
View File
@@ -10,4 +10,5 @@ Router.map(function() {
this.route('rezepte');
this.route('zettel');
this.route('produkte');
this.route('neues-produkt');
});
app/routes/produkte.js
+1 -24
View File
@@ -8,27 +8,4 @@ export default class ProduktRoute extends Route {
async model() {
return this.store.findAll('produkt');
}
}
/*async model() {
let response = await fetch('/api/produkte.json');
let { data } = await response.json();
return data.map(model => {
let { attributes } = model;
let kategorie;
if (PRODUKT_KATEGORIEN.includes(attributes.kategorie)) {
kategorie = attributes.kategorie;
}
else
{
kategorie = 'Sonstiges';
}
return { kategorie, ...attributes };
});
}
}*/
}
app/routes/rezepte.js
+1 -22
View File
@@ -22,25 +22,4 @@ export default class RezeptRoute extends Route{
async model() {
return this.store.findAll('rezept');
}
}
/*async model() {
let response = await fetch('/api/rezepte.json');
let { data } = await response.json();
return data.map(model => {
let { attributes } = model;
let kategorie;
if (REZEPT_KATEGORIEN.includes(attributes.kategorie)) {
kategorie = attributes.kategorie;
}
else
{
kategorie = 'Sonstiges';
}
return { kategorie, ...attributes };
});
}
}*/
}
app/templates/neues-produkt.hbs
+5
View File
@@ -0,0 +1,5 @@
<Jumbo>
<h2>neues Produkte</h2>
<p>Hier kannst du ein neues Produkte hinzufügen!</p>
<LinkTo @route="produkte" class="button">Produkte anzeigen</LinkTo>
</Jumbo>
app/templates/produkte.hbs
+9 -9
View File
@@ -1,7 +1,7 @@
<Jumbo>
<h2>deine Produkte</h2>
<p>Hier kannst du aus deinen Produkten wählen oder neue Produkte hinzufügen!</p>
<LinkTo @route="produkte" class="button">Produkte bearbeiten</LinkTo>
<LinkTo @route="neues-produkt" class="button">Produkt hinzufügen</LinkTo>
</Jumbo>
<Kategorie @titel={{"Gemüse"}}>
@@ -9,7 +9,7 @@
<ul class="resultsProdukt">
{{#each @model as |produkt|}}
{{#if (compare produkt.kategorie '===' 'Gemüse')}}
<Produkt @produkt={{produkt}} />
<Produkt @titel={{produkt.titel}} @isSelected={{produkt.isSelected}} @menge={{produkt.menge}} @einheit={{produkt.einheit}} @bild={{produkt.bild}}/>
{{/if}}
{{/each}}
</ul>
@@ -21,31 +21,31 @@
<ul class="resultsProdukt">
{{#each @model as |produkt|}}
{{#if (compare produkt.kategorie '===' 'Milchprodukte')}}
<Produkt @produkt={{produkt}} />
<Produkt @titel={{produkt.titel}} @isSelected={{produkt.isSelected}} @menge={{produkt.menge}} @einheit={{produkt.einheit}} @bild={{produkt.bild}}/>
{{/if}}
{{/each}}
</ul>
</div>
</Kategorie>
</Kategorie>
<Kategorie @titel={{"Fleisch"}}>
<Kategorie @titel={{"Fleisch"}}>
<div class="rentals">
<ul class="resultsProdukt">
{{#each @model as |produkt|}}
{{#if (compare produkt.kategorie '===' 'Fleisch')}}
<span><Produkt @produkt={{produkt}} /></span>
<Produkt @titel={{produkt.titel}} @isSelected={{produkt.isSelected}} @menge={{produkt.menge}} @einheit={{produkt.einheit}} @bild={{produkt.bild}}/>
{{/if}}
{{/each}}
</ul>
</div>
</Kategorie>
</Kategorie>
<Kategorie @titel={{"Pasta"}}>
<Kategorie @titel={{"Pasta"}}>
<div class="rentals">
<ul class="resultsProdukt">
{{#each @model as |produkt|}}
{{#if (compare produkt.kategorie '===' 'Pasta')}}
<Produkt @produkt={{produkt}} />
<Produkt @titel={{produkt.titel}} @isSelected={{produkt.isSelected}} @menge={{produkt.menge}} @einheit={{produkt.einheit}} @bild={{produkt.bild}}/>
{{/if}}
{{/each}}
</ul>
app/templates/rezepte.hbs
+1 -1
View File
@@ -9,7 +9,7 @@
<ul class="resultsRezept">
{{#each @model as |rezept|}}
{{#if (compare rezept.kategorie '===' 'Pasta')}}
<li><Rezept @rezept={{rezept}} /></li>
<li><Rezept @titel={{rezept.titel}} @beschreibung={{rezept.beschreibung}} @kategorie={{rezept.kategorie}} @produkte={{rezept.produkte}} @gewuerze={{rezept.gewuerze}} @personen={{rezept.attributes.personen}} @dauer={{rezept.dauer}} @isSelected={{rezept.isSelected}}/></li>
{{/if}}
{{/each}}
</ul>
app/templates/zettel.hbs
+2 -2
View File
@@ -9,9 +9,9 @@
<ul class="results">
{{#each @model as |produkt|}}
{{#if produkt.isSelected}}
<li><Rezept @zettel={{produkt}} /></li>
<Produkt @titel={{produkt.titel}} @isSelected={{produkt.isSelected}} @menge={{produkt.menge}} @einheit={{produkt.einheit}} @bild={{produkt.bild}}/>
{{/if}}
{{/each}}
</ul>
</div>
</Kategorie>
</Kategorie>