V0.1h Automatische Bestimmung des image und der Kategorie anhand des Einkaufsortes

V0.1g Erweiterte Einträge für initialEntries
V0.1h Bootstrapeinbindung als CSS für die navbar
2020-06-11 23:59:04 +02:00 · 2020-06-11 23:29:20 +02:00 · 2020-06-11 23:12:52 +02:00
11 changed files with 139 additions and 37 deletions
--- a/package-lock.json
+++ b/package-lock.json
@ -2500,6 +2500,11 @@
      "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24=",
      "dev": true
    },
+    "bootstrap": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.5.0.tgz",
+      "integrity": "sha512-Z93QoXvodoVslA+PWNdk23Hze4RBYIkpb5h8I2HY2Tu2h7A0LpAgLcyrhrSUyo2/Oxm2l1fRZPs1e5hnxnliXA=="
+    },
    "brace-expansion": {
      "version": "1.1.11",
      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
--- a/package.json
+++ b/package.json
@ -19,6 +19,7 @@
    "@angular/platform-browser": "~9.1.7",
    "@angular/platform-browser-dynamic": "~9.1.7",
    "@angular/router": "~9.1.7",
+    "bootstrap": "^4.5.0",
    "rxjs": "~6.5.4",
    "tslib": "^1.10.0",
    "zone.js": "~0.10.2"
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@ -1,5 +1,3 @@
-
-
 <app-header></app-header>
 <app-blog-create></app-blog-create>
 <app-footer></app-footer>
--- a/src/app/app.component.spec.ts
+++ b/src/app/app.component.spec.ts
@ -17,7 +17,7 @@ describe('AppComponent', () => {
  });


-  it('should render title', () => {
+  it('should render einkaufsort', () => {
    const fixture = TestBed.createComponent(AppComponent);
    fixture.detectChanges();
    const compiled = fixture.nativeElement;
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@ -1,9 +1,9 @@
-import {Component, OnInit} from '@angular/core';
+import {Component} from '@angular/core';
@Component({
  selector: 'app-root',
  templateUrl: 'app.component.html'
 })
-export class AppComponent implements OnInit {
+export class AppComponent {

  constructor(){

--- a/src/app/components/blog-create/blog-create.component.html
+++ b/src/app/components/blog-create/blog-create.component.html
@ -4,29 +4,13 @@
 <div>
  <form  (ngSubmit)="saveTask(form.value)" #form="ngForm">
    <div class="form-group">
-      <div><label for="title">Titel* </label></div>
-
+      <div><label >Einkaufsort* </label></div>
      <div>
-        <input type="text" class="form-control" name="title" id="title" #title ngModel required/>
+        <input type="text" class="form-control" name="title" id="title" #einkaufsort ngModel required/>
      </div>

    </div>

-    <div class="form-group">
-      <div><label for="image">Bild-URL* </label></div>
-
-      <div>
-        <input type="text" class="form-control" name="title" id="image" #image ngModel required/>
-      </div>
-    </div>
-
-    <div class="form-group">
-      <div><label>Kategorie* </label></div>
-      <div>
-        <input type="text" class="form-control" id="kategorie" #kategorie ngModel required/>
-      </div>
-    </div>
-
    <div class="form-group">
      <div><label for="menge">Menge* </label></div>
      <div>
@ -41,7 +25,7 @@
    </div>

    <div class="form-group">
-      <button (click)="createBlogEntry(title.value, image.value, kategorie.value,menge.value, kommentar.value)">
+      <button (click)="createBlogEntry(einkaufsort.value,menge.value, kommentar.value)">
        Eintrag anlegen
      </button>
    </div>
--- a/src/app/components/blog-create/blog-create.component.ts
+++ b/src/app/components/blog-create/blog-create.component.ts
@ -32,17 +32,59 @@ export class BlogCreateComponent implements OnInit {
    console.log(value);
  }

-  createBlogEntry(title: string, image: string, kategorie: string, menge: string, kommentar: string, ) {
-    if (title && image && kommentar && kategorie) {
+  createBlogEntry(einkaufsort: string, menge: string, kommentar: string, ) {
+    if (einkaufsort && kommentar) {
      const entry = new BlogEntry();
-      entry.title = title;
-      entry.image = image;
-      entry.kategorie = kategorie;
+      entry.einkaufsort = einkaufsort;
      entry.menge = menge;
      entry.kommentar = kommentar;
+
+      if(einkaufsort === 'Aldi Süd'){
+        entry.image = 'https://www.horizont.net/news/media/20/Logo-Aldi-Sd-2017-198042-detailnp.jpeg';
+        entry.kategorie = 'Lebensmittel';
+      }
+      else if (einkaufsort === 'Edeka') {
+        entry.image = 'https://upload.wikimedia.org/wikipedia/commons/thumb/e/e7/Logo_Edeka.svg/1200px-Logo_Edeka.svg.png';
+        entry.kategorie = 'Lebensmittel';}
+      else if (einkaufsort == 'Lidl') {
+        entry.image = 'https://upload.wikimedia.org/wikipedia/commons/thumb/9/91/Lidl-Logo.svg/1200px-Lidl-Logo.svg.png';
+        entry.kategorie = 'Lebensmittel';}
+      else if (einkaufsort == 'Rewe') {
+        entry.image = 'https://upload.wikimedia.org/wikipedia/commons/thumb/4/4c/Logo_REWE.svg/1200px-Logo_REWE.svg.png';
+        entry.kategorie = 'Lebensmittel';}
+      else if (einkaufsort == 'Netto') {
+        entry.image = 'https://www.netto-online.de/images/favicons/logo_netto.png';
+        entry.kategorie = 'Lebensmittel';}
+      else if (einkaufsort == 'Penny') {
+        entry.image = 'https://upload.wikimedia.org/wikipedia/commons/thumb/c/c9/Penny-Markt.svg/1200px-Penny-Markt.svg.png';
+        entry.kategorie = 'Lebensmittel';}
+      else if (einkaufsort == 'DM') {
+        entry.image = 'https://upload.wikimedia.org/wikipedia/commons/thumb/5/50/Dm_Logo.svg/1200px-Dm_Logo.svg.png';
+        entry.kategorie = 'Drogerie';}
+      else if (einkaufsort == 'Rossmann') {
+        entry.image = 'https://www.einkaufsbahnhof.de/wp-content/uploads/2018/03/rossmann_logo_schreibschrift.png';
+        entry.kategorie = 'Drogerie';}
+      else if (einkaufsort == 'Müller') {
+        entry.image = 'https://www.e-einz.de/wp-content/uploads/2017/02/Mueller.png';
+        entry.kategorie = 'Drogerie';}
+      else if (einkaufsort == 'OBI') {
+        entry.image = 'https://media.aubi-plus.com/files/premiumprofil/logo/35d8961-obi.jpg';
+        entry.kategorie = 'Baumarkt';}
+      else if (einkaufsort == 'Dehner') {
+        entry.image = 'https://upload.wikimedia.org/wikipedia/commons/thumb/a/a9/Dehner.svg/1200px-Dehner.svg.png';
+        entry.kategorie = 'Garten-Center';}
+      else if (einkaufsort == 'Hornbach') {
+        entry.image = 'https://www.luvshopping.de/-/media/images/b2c/germany/lubeck/logo-stores/hornbach.jpg?h=442&la=de-DE&mw=650&w=650&hash=C6C36C2C1536745108FF620D3B9CD7E4864A9308';
+        entry.kategorie = 'Baumarkt';}
+      else if (einkaufsort == 'Anderer') {
+        entry.image = 'https://previews.123rf.com/images/krisdog/krisdog1312/krisdog131200065/24639132-ein-beispiel-f%C3%BCr-ein-einkaufswagen-oder-einkaufswagen-symbol.jpg';
+        entry.kategorie = 'Unbekannt';};
+
      this.entries.push(entry);
    }
  }
+
+
  deleteAllEntries() {
    console.log(this.entries.length);
    const index: number = this.entries.length;
--- a/src/app/components/blog-entry/blog-entry.component.html
+++ b/src/app/components/blog-entry/blog-entry.component.html
@ -1,10 +1,11 @@
 <div class="blog-entry">
    <div class="blog-image">
-        <img [src]="entry.image" [alt]="entry.title"/>
+        <img [src]="entry.image" [alt]="entry.einkaufsort"/>
    </div>
    <div class="blog-summary">
-        <span class="title">{{entry.title}}</span>
+        <span class="einkaufsort">{{entry.einkaufsort}}</span>
      <p> {{entry.kategorie}}</p>
+      <p> {{entry.menge}}</p>
      <p> {{entry.kommentar}}</p>
    </div>
 </div>
--- a/src/app/components/blog-entry/blog-entry.ts
+++ b/src/app/components/blog-entry/blog-entry.ts
@ -1,8 +1,7 @@
 export class BlogEntry {
-  title: string;
+  einkaufsort: string;
  image: string;
  kategorie: string;
  menge: string;
  kommentar: string;
-
 }
--- a/src/app/components/blog-entry/initialEntries.ts
+++ b/src/app/components/blog-entry/initialEntries.ts
@ -1,16 +1,87 @@
 export const initialEntries = [
  {
-    title: 'Edeka',
-    image: 'https://upload.wikimedia.org/wikipedia/commons/thumb/e/e7/Logo_Edeka.svg/1200px-Logo_Edeka.svg.png',
+    einkaufsort: 'Aldi Süd',
+    image: 'https://www.horizont.net/news/media/20/Logo-Aldi-Sd-2017-198042-detailnp.jpeg',
    kategorie: 'Lebensmittel',
    menge: '1',
    kommentar: 'Hier könnten ihre benötigten Einkäufe stehen'
  },
  {
-    title: 'Aldi Süd',
-    image: 'https://www.horizont.net/news/media/20/Logo-Aldi-Sd-2017-198042-detailnp.jpeg',
+    einkaufsort: 'Edeka',
+    image: 'https://upload.wikimedia.org/wikipedia/commons/thumb/e/e7/Logo_Edeka.svg/1200px-Logo_Edeka.svg.png',
    kategorie: 'Lebensmittel',
    menge: '1',
    kommentar: 'Hier könnten ihre benötigten Einkäufe stehen'
+  },
+
+  {
+    einkaufsort: 'Lidl',
+    image: 'https://upload.wikimedia.org/wikipedia/commons/thumb/9/91/Lidl-Logo.svg/1200px-Lidl-Logo.svg.png',
+    kategorie: 'Lebensmittel',
+    menge: '1',
+    kommentar: 'Hier könnten ihre benötigten Einkäufe stehen'
+  },
+  {
+    einkaufsort: 'Rewe',
+    image: 'https://upload.wikimedia.org/wikipedia/commons/thumb/4/4c/Logo_REWE.svg/1200px-Logo_REWE.svg.png',
+    kategorie: 'Lebensmittel',
+    menge: '1',
+    kommentar: 'Hier könnten ihre benötigten Einkäufe stehen'
+  },
+  {
+    einkaufsort: 'Netto',
+    image: 'https://www.netto-online.de/images/favicons/logo_netto.png',
+    kategorie: 'Lebensmittel',
+    menge: '1',
+    kommentar: 'Hier könnten ihre benötigten Einkäufe stehen'
+  },
+  {
+    einkaufsort: 'Penny',
+    image: 'https://upload.wikimedia.org/wikipedia/commons/thumb/c/c9/Penny-Markt.svg/1200px-Penny-Markt.svg.png',
+    kategorie: 'Lebensmittel',
+    menge: '1',
+    kommentar: 'Hier könnten ihre benötigten Einkäufe stehen'
+  },
+  {
+    einkaufsort: 'DM',
+    image: 'https://upload.wikimedia.org/wikipedia/commons/thumb/5/50/Dm_Logo.svg/1200px-Dm_Logo.svg.png',
+    kategorie: 'Drogerie',
+    menge: '1',
+    kommentar: 'Hier könnten ihre benötigten Einkäufe stehen'
+  },
+  {
+    einkaufsort: 'Rossmann',
+    image: 'https://www.einkaufsbahnhof.de/wp-content/uploads/2018/03/rossmann_logo_schreibschrift.png',
+    kategorie: 'Drogerie',
+    menge: '1',
+    kommentar: 'Hier könnten ihre benötigten Einkäufe stehen'
+  },
+  {
+    einkaufsort: 'Müller',
+    image: 'https://www.e-einz.de/wp-content/uploads/2017/02/Mueller.png',
+    kategorie: 'Drogerie',
+    menge: '1',
+    kommentar: 'Hier könnten ihre benötigten Einkäufe stehen'
+  },
+  {
+    einkaufsort: 'OBI',
+    image: 'https://media.aubi-plus.com/files/premiumprofil/logo/35d8961-obi.jpg',
+    kategorie: 'Baumarkt',
+    menge: '1',
+    kommentar: 'Hier könnten ihre benötigten Einkäufe stehen'
+  },
+  {
+    einkaufsort: 'Dehner',
+    image: 'https://upload.wikimedia.org/wikipedia/commons/thumb/a/a9/Dehner.svg/1200px-Dehner.svg.png',
+    kategorie: 'Garten-Center',
+    menge: '1',
+    kommentar: 'Hier könnten ihre benötigten Einkäufe stehen'
+  },
+  {
+    einkaufsort: 'Hornbach',
+    image: 'https://www.luvshopping.de/-/media/images/b2c/germany/lubeck/logo-stores/hornbach.jpg?h=442&la=de-DE&mw=650&w=650&hash=C6C36C2C1536745108FF620D3B9CD7E4864A9308',
+    kategorie: 'Baumarkt',
+    menge: '1',
+    kommentar: 'Hier könnten ihre benötigten Einkäufe stehen'
  }
 ];
--- a/src/styles.css
+++ b/src/styles.css
@ -1,3 +1,4 @@
+@import '~bootstrap/dist/css/bootstrap.css';
 body {
  font-family: Helvetica;
  padding-left: 15px;
Author	SHA1	Message	Date
Christian Greif	4279edffe4	V0.1h Automatische Bestimmung des image und der Kategorie anhand des Einkaufsortes	2020-06-11 23:59:04 +02:00
Christian Greif	fe1c381571	V0.1g Erweiterte Einträge für initialEntries	2020-06-11 23:29:20 +02:00
Christian Greif	0439bcdcef	V0.1h Bootstrapeinbindung als CSS für die navbar	2020-06-11 23:12:52 +02:00