add products

app/components/hinzufuegen.hbs

@@ -0,0 +1,23 @@
+<div class="kategorie">
+  <label>
+      <h3>Produkttitel</h3>
+      <Input class="light" @value={{this.titel}}/>
+    </label>
+    <label>
+      <h3>Kategorie</h3>
+      <Input class="light"  @value={{this.kategorie}}/>
+    </label>
+    <label>
+      <h3>Menge</h3>
+      <Input class="light"  @value={{this.menge}}/>
+    </label>
+    <label>
+      <h3>Einheit</h3>
+      <Input class="light"  @value={{this.einheit}}/>
+    </label>
+    <label>
+      <h3>Bild</h3>
+      <Input class="light" @value={{this.bild}}/>
+      <button class="button"  {{on "click" this.speichern}}>Produkt hinzufügen</button>
+    </label> 
+  </div>

app/components/hinzufuegen.js

@@ -0,0 +1,42 @@
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { action } from '@ember/object';
+import { inject as service } from '@ember/service';
+
+export default class HinzufuegenController extends Component {
+     
+    @tracked titel;
+    @tracked kategorie;
+    @tracked menge;
+    @tracked einheit;
+    @tracked bild;
+    @tracked id;
+    @tracked isselected;
+
+    @service store;
+
+
+    
+    @action speichern() 
+    {
+        this.store.createRecord('produkt', {
+            type: 'produkt',
+            id: this.titel.split(' ').join(''),
+            attributes: {
+                titel: this.titel,
+                kategorie: this.kategorie,
+                menge: this.menge,
+                einheit: this.einheit,
+                bild: this.bild,
+                isselected: false
+            }
+          }).save();
+
+          this.titel = null;
+          this.kategorie = null;
+          this.menge = null;
+          this.einheit = null;
+          this.bild = null;
+          this.id = null;
+    }
+}

app/components/produkt.hbs

@@ -1,4 +1,4 @@
-<button type="button" class="produkt {{if @produkt.isSelected "selected"}}" {{on "click" (fn this.toggleSelection @produkt.titel)}}>
+<button type="button" class="produkt {{if @produkt.isselected "selected"}}" {{on "click" (fn this.toggleSelection @produkt.titel)}}>
     <img src={{@produkt.bild}} alt="Ein Bild von {{@produkt.titel}}"/>
     <h3>{{@produkt.titel}}</h3>
     <ul class="details">

app/components/produkt.js

@@ -6,7 +6,7 @@ import ApplicationAdapter from '../adapters/application';
 
 export default class ProduktController extends Component {
     @tracked isLarge = false;
-    @tracked isSelected;
+    @tracked isselected;
     
     @service store;
 
@@ -17,8 +17,8 @@ export default class ProduktController extends Component {
 
     @action toggleSelection(produktname)
     {
-        this.isSelected = !this.isSelected;
-        this.setStatus(produktname, this.isSelected);
+        this.isselected = !this.isselected;
+        this.setStatus(produktname, this.isselected);
     }
 
     @action getStatus(produktname)
@@ -30,14 +30,9 @@ export default class ProduktController extends Component {
                 suchergebnis.forEach(element => {
                     if(element.titel==produktname)
                     {
-                        this.isSelected = element.isSelected;                    
+                        this.isselected = element.isselected;                    
                     }                    
                 });
-
-                if(!this.exists)
-                {
-                    this.isSelected = false;
-                }
             });
     }
  
@@ -58,8 +53,8 @@ export default class ProduktController extends Component {
             suchergebnis.forEach(element => {
                 if(element.titel==produktname)
                 {
-                    element.isSelected = selection;
-                    element.save().catch(failure);    
+                    element.isselected = selection;
+                    element.save().catch(failure);
                 }                    
             });
         });

app/components/rezept.hbs

@@ -1,4 +1,4 @@
-<button type="button" class="rezept {{if @rezept.isSelected "selected"}}" {{on "click" (fn this.toggleSelection @rezept.titel)}}>
+<button type="button" class="rezept {{if @rezept.isselected "selected"}}" {{on "click" (fn this.toggleSelection @rezept.titel)}}>
     <span><img src={{@rezept.bild}} alt="Ein Bild von {{@rezept.titel}}"/></span>
     <span>
         <h3>{{@rezept.titel}}</h3>

app/components/rezept.js

@@ -5,7 +5,7 @@ import { inject as service } from '@ember/service';
 
 export default class RezeptController extends Component {
     @tracked isLarge = false;
-    @tracked isSelected;
+    @tracked isselected;
 
     @service store;
 
@@ -16,8 +16,8 @@ export default class RezeptController extends Component {
 
     @action toggleSelection(rezeptname)
     {
-        this.isSelected = !this.isSelected;
-        this.setStatus(rezeptname, this.isSelected);
+        this.isselected = !this.isselected;
+        this.setStatus(rezeptname, this.isselected);
     }
 
     setStatus(rezeptname, selection)
@@ -29,7 +29,7 @@ export default class RezeptController extends Component {
             suchergebnis.forEach(element => {
                 if(element.titel==rezeptname)
                 {
-                    element.isSelected = selection;
+                    element.isselected = selection;
                     element.save().catch(failure);
                     
                     function failure(reason)