wip: register api

Frontend/src/app/components/auth/registration/registration.component.html

@@ -9,27 +9,30 @@
                     <h2>Konto erstellen</h2>
                 </div>
                 <div class="row">
-                    <form control="" class="form-group">
+                    <form [formGroup]="form" class="form-group" (ngSubmit)="onSubmit()">
                         <div class="row">
-                            <input type="text" name="username" id="username" class="form__input" placeholder="Nickname">
+                            <input type="text" formControlName="username" id="username" name="username" class="form__input" placeholder="Username">
+                            <div *ngIf="submitted && me.username.errors" class="invalid-feedback">
+                                <div *ngIf="me.username.errors.required">Username is required</div>
+                            </div>
                         </div>
                         <div class="row">
                             <!-- <span class="fa fa-lock"></span> -->
-                            <input type="password" name="password" id="email" class="form__input" placeholder= "E-Mail">
+                            <input type="email" formControlName="email" name="email" id="email" class="form__input" placeholder= "E-Mail">
                         </div>
                         <div class="row">
                             <!-- <span class="fa fa-lock"></span> -->
-                            <input type="password" name="password" id="password" class="form__input" placeholder="Kennwort erstellen">
+                            <input type="password" formControlName="password" name="password" id="password" class="form__input" placeholder="Kennwort">
                         </div>
+                        <!--
                         <div class="row">
-                            <!-- <span class="fa fa-lock"></span> -->
                             <input type="password" name="password" id="password_repeated" class="form__input" placeholder="Kennwort bestätigen">
-                        </div>
+                        </div> -->
                         <div class="row">
                             <input type="submit" value="Erstellen" class="btn_signin">
                         </div>
                         <div class="row">
-                            <p>Haben Sie bereits ein Konto?<a href="/signin">Sich anmelden</a></p>
+                            <a href="/signin">Sich anmelden</a>
                         </div>
                     </form>
                 </div>

Frontend/src/app/components/auth/registration/registration.component.ts

@@ -1,4 +1,7 @@
 import { Component, OnInit } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import {ApiService} from "../../../services/api.service";
+
 
 @Component({
   selector: 'app-registration',
@@ -6,10 +9,30 @@ import { Component, OnInit } from '@angular/core';
   styleUrls: ['./registration.component.css']
 })
 export class RegistrationComponent implements OnInit {
+    form: any;
+    loading = false;
+    submitted = false;
 
-  constructor() { }
+  constructor(
+      private formBuilder: FormBuilder,
+      private api : ApiService
+  ) { }
 
   ngOnInit(): void {
+      this.form = this.formBuilder.group({
+          username: ['', Validators.required],
+          email: ['', Validators.required],
+          password: ['', [
+              Validators.required,
+              Validators.minLength(8)]
+          ],
+      });
   }
 
+  get me() { return this.form.controls; }
+
+  onSubmit() {
+      console.log(this.form.value);
+      this.api.registerUser(this.form.value.username, this.form.value.password, this.form.value.email).subscribe(res=>console.log(res));
+  }
 }

Frontend/src/app/components/auth/signin/signin.component.html

@@ -9,13 +9,13 @@
                     <h2>Anmelden</h2>
                 </div>
                 <div class="row">
-                    <form control="" class="form-group">
+                    <form [formGroup]="form" class="form-group" (ngSubmit)="onSubmit()">
                         <div class="row">
-                            <input type="text" name="username" id="username" class="form__input" placeholder="Username">
+                            <input type="text" formControlName="username" name="username" id="username" class="form__input" placeholder="Username">
                         </div>
                         <div class="row">
                             <!-- <span class="fa fa-lock"></span> -->
-                            <input type="password" name="password" id="password" class="form__input" placeholder="Password">
+                            <input type="password" formControlName="password" name="password" id="password" class="form__input" placeholder="Password">
                         </div>
                         <div class="row">
                             <input type="submit" value="Anmelden" class="btn_signin">
@@ -23,7 +23,7 @@
                     </form>
                 </div>
                 <div class="row">
-                    <p>Noch kein Konto?<a href="/registration">Konto erstellen</a></p>
+                    <a href="/registration">Konto erstellen</a>
                 </div>
             </div>
         </div>

Frontend/src/app/components/auth/signin/signin.component.ts

@@ -1,4 +1,6 @@
 import { Component, OnInit } from '@angular/core';
+import {FormBuilder, Validators} from "@angular/forms";
+import {ApiService} from "../../../services/api.service";
 
 @Component({
     selector: 'app-signin',
@@ -8,12 +10,22 @@ import { Component, OnInit } from '@angular/core';
 
 export class SigninComponent implements OnInit {
 
-  constructor() { }
+    form: any;
 
-  ngOnInit(): void {
+    constructor(
-  }
+        private formBuilder: FormBuilder,
+        private api : ApiService
+    ) { }
 
-    onSubmit() {
+    ngOnInit(): void {
+          this.form = this.formBuilder.group({
+              email: ['', Validators.required],
+              password: ['', Validators.required]
+          });
+      }
 
-    }
+      onSubmit() {
+          console.log(this.form.value);
+          this.api.loginUser(this.form.value.username, this.form.value.password);
+      }
 }

Frontend/src/app/components/hot-deals-widget/hot-deals-widget.component.html

@@ -9,7 +9,7 @@
         <!-- Portfolio Grid Items-->
         <div class="row justify-content-center">
             <!-- Portfolio Item 1-->
-            <div class="col-md-4 mx-auto my-5" *ngFor="let product of products">
+            <div class="col-md-4 mx-auto my-5" *ngFor="let product of products" (click)="clickedProduct(product)">
                 <div class="bbb_deals_wrapper">
                     <div class="bbb_deals_image"><img src="https://www.mueller-patrick.tech/betterzon/images/{{product.image_guid}}.jpg" alt=""></div>
                     <div class="bbb_deals_content">
@@ -17,7 +17,7 @@
                             <div class="bbb_deals_item_name">{{product.name}}</div>
                         </div>
                         <div class="bbb_deals_info_line d-flex flex-row justify-content-start">
-                            <div class="bbb_deals_item_category">Amazon: <span id="bbb_deals_item_price_a"><strike>699.00$</strike></span></div>
+                            <div class="bbb_deals_item_category">Amazon: <span id="bbb_deals_item_price_a"><strike>{{product.price}}$</strike></span></div>
                         </div>
                         <div class="bbb_deals_info_line d-flex flex-row justify-content-start">
                             <div class="bbb_deals_item_category">Plantshub: <span id="bbb_deals_item_price_b">599,00$</span></div>

Frontend/src/app/models/product.ts

@@ -11,4 +11,5 @@ export interface Product {
     manufacturer_id: number;
     selling_rank: string;
     category_id: number;
+    price: number;
 }

Frontend/src/app/pages/product-detail-page/product-detail-page.component.html

@@ -1,7 +1,7 @@
 <app-top-bar></app-top-bar>
-
 <div id="mainComponents">
     <app-product-details [productId]="productId"></app-product-details>
     <app-newest-prices-list [productId]="productId"></app-newest-prices-list>
 </div>
+<app-bottom-bar></app-bottom-bar>
 

Frontend/src/app/services/api.service.ts

@@ -11,6 +11,7 @@ import {ContactPerson} from '../models/contactperson';
 import {Category} from '../models/category';
 import {Manufacturer} from '../models/manufacturer';
 import {CrawlingStatus} from '../models/crawlingstatus';
+import {log} from "util";
 
 @Injectable({
     providedIn: 'root'