add products

app/adapters/application.js

@@ -7,13 +7,6 @@ export default class ApplicationAdapter extends JSONAPIAdapter {
 
   urlForUpdateRecord(id, modelName, snapshot) {
     return `api/${modelName}s`;
-  }
-
-  createRecord(store, type, snapshot) {
-    let data = this.serialize(snapshot, { includeId: true });
-    //let url = `/${type.modelName}`;
-
-    // ...
-  }
+  }  
 }
 

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) 

app/models/produkt.js

@@ -2,7 +2,7 @@ import Model, { attr } from '@ember-data/model';
 
 export default class ProduktModel extends Model {
     @attr ('string') titel;
-    @attr ('boolean') isSelected;
+    @attr ('boolean') isselected;
     @attr ('string') kategorie;
     @attr ('number') menge;
     @attr ('string') einheit;
@@ -10,6 +10,6 @@ export default class ProduktModel extends Model {
 
     get status()
     {
-        return `${this.titel} ${this.IsSelected}`
+        return `${this.titel} ${this.isselected}`
     }
 }

app/models/rezept.js

@@ -2,7 +2,7 @@ import Model, { attr, hasMany } from '@ember-data/model';
 
 export default class RezeptModel extends Model {
     @attr ('string') titel;
-    @attr ('boolean') isSelected;
+    @attr ('boolean') isselected;
     @attr ('string') beschreibung;
     @attr ('string') kategorie;
     @attr produkte;

app/routes/rezepte.js

@@ -1,20 +1,6 @@
 import Route from '@ember/routing/route';
-import Component from '@glimmer/component';
-import { tracked } from '@glimmer/tracking';
-import { action } from '@ember/object';
 import { inject as service } from '@ember/service';
 
-const REZEPT_KATEGORIEN = [
-    'Pasta',
-    'Schwein',
-    'Soße',
-    'Fleisch',
-    'Geflügel',
-    'Rind',
-    'Nachspeise',
-    'Backen'
-  ];
-
 export default class RezeptRoute extends Route{
     
   @service store;

app/styles/app.css

@@ -563,6 +563,7 @@ p {
   align-content: space-around;
   text-align: center;
   align-items: center;
+  
 }
 
 .produkt h3 {
@@ -687,6 +688,7 @@ p {
   /**align-items: center;*/
   flex-wrap: wrap;
   align-items: flex-start;
+  width: 95%;
 }
 
 .kategorie .details {

app/templates/neues-produkt.hbs

@@ -2,4 +2,10 @@
   <h2>neues Produkte</h2>
   <p>Hier kannst du ein neues Produkte hinzufügen!</p>
   <LinkTo @route="produkte" class="button">Produkte anzeigen</LinkTo>
-</Jumbo>
+</Jumbo>
+
+<Kategorie @titel={{"neues Produkt"}}>
+  <div class="resultsProdukt">
+    <Hinzufuegen class="resultsProdukt" @typ={{'neues Produkt'}}/>
+  </div>
+</Kategorie>