mirror of
https://github.com/Mueller-Patrick/Betterzon.git
synced 2024-11-22 14:23:57 +00:00
BETTERZON-34: Adding landing page component
- Also removing old stuff
This commit is contained in:
parent
23ae0555e5
commit
4100192f02
|
@ -3,19 +3,19 @@ import {HttpClientModule} from '@angular/common/http';
|
||||||
import {NgModule} from '@angular/core';
|
import {NgModule} from '@angular/core';
|
||||||
|
|
||||||
import {AppComponent} from './app.component';
|
import {AppComponent} from './app.component';
|
||||||
import {HelloWorldComponent} from './hello-world/hello-world.component';
|
import {AppRouting} from './app.routing';
|
||||||
import {AppRoutingModule} from './app-routing.module';
|
|
||||||
import {ProductListComponent} from './product-list/product-list.component';
|
import {ProductListComponent} from './product-list/product-list.component';
|
||||||
|
import { LandingpageComponent } from './landingpage/landingpage.component';
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
declarations: [
|
declarations: [
|
||||||
AppComponent,
|
AppComponent,
|
||||||
HelloWorldComponent,
|
ProductListComponent,
|
||||||
ProductListComponent
|
LandingpageComponent
|
||||||
],
|
],
|
||||||
imports: [
|
imports: [
|
||||||
BrowserModule,
|
BrowserModule,
|
||||||
AppRoutingModule,
|
AppRouting,
|
||||||
HttpClientModule
|
HttpClientModule
|
||||||
],
|
],
|
||||||
providers: [],
|
providers: [],
|
||||||
|
|
|
@ -1,13 +1,12 @@
|
||||||
import {NgModule} from '@angular/core';
|
import {NgModule} from '@angular/core';
|
||||||
import {CommonModule} from '@angular/common';
|
import {CommonModule} from '@angular/common';
|
||||||
import {RouterModule, Routes} from '@angular/router';
|
import {RouterModule, Routes} from '@angular/router';
|
||||||
import {HelloWorldComponent} from './hello-world/hello-world.component';
|
|
||||||
import {AppComponent} from './app.component';
|
import {AppComponent} from './app.component';
|
||||||
import {ProductListComponent} from './product-list/product-list.component';
|
import {ProductListComponent} from './product-list/product-list.component';
|
||||||
|
import {LandingpageComponent} from './landingpage/landingpage.component';
|
||||||
|
|
||||||
const routes: Routes = [
|
const routes: Routes = [
|
||||||
{path: '', component: AppComponent},
|
{path: '', component: LandingpageComponent},
|
||||||
{path: 'helloworld', component: HelloWorldComponent},
|
|
||||||
{path: 'pdp', component: ProductListComponent}
|
{path: 'pdp', component: ProductListComponent}
|
||||||
];
|
];
|
||||||
|
|
||||||
|
@ -20,5 +19,5 @@ const routes: Routes = [
|
||||||
RouterModule
|
RouterModule
|
||||||
]
|
]
|
||||||
})
|
})
|
||||||
export class AppRoutingModule {
|
export class AppRouting {
|
||||||
}
|
}
|
|
@ -1,2 +0,0 @@
|
||||||
<p>hello-world works! Title: </p>
|
|
||||||
<a href="https://blog.betterzon.xyz">Blog</a>
|
|
|
@ -1,15 +0,0 @@
|
||||||
import { Component, OnInit } from '@angular/core';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-hello-world',
|
|
||||||
templateUrl: './hello-world.component.html',
|
|
||||||
styleUrls: ['./hello-world.component.css']
|
|
||||||
})
|
|
||||||
export class HelloWorldComponent implements OnInit {
|
|
||||||
|
|
||||||
constructor() { }
|
|
||||||
|
|
||||||
ngOnInit(): void {
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
1
Frontend/src/app/landingpage/landingpage.component.html
Normal file
1
Frontend/src/app/landingpage/landingpage.component.html
Normal file
|
@ -0,0 +1 @@
|
||||||
|
<app-product-list numberOfProducts="20" showProductPicture="true"></app-product-list>
|
|
@ -1,20 +1,20 @@
|
||||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
import { HelloWorldComponent } from './hello-world.component';
|
import { LandingpageComponent } from './landingpage.component';
|
||||||
|
|
||||||
describe('HelloWorldComponent', () => {
|
describe('LandingpageComponent', () => {
|
||||||
let component: HelloWorldComponent;
|
let component: LandingpageComponent;
|
||||||
let fixture: ComponentFixture<HelloWorldComponent>;
|
let fixture: ComponentFixture<LandingpageComponent>;
|
||||||
|
|
||||||
beforeEach(async () => {
|
beforeEach(async () => {
|
||||||
await TestBed.configureTestingModule({
|
await TestBed.configureTestingModule({
|
||||||
declarations: [ HelloWorldComponent ]
|
declarations: [ LandingpageComponent ]
|
||||||
})
|
})
|
||||||
.compileComponents();
|
.compileComponents();
|
||||||
});
|
});
|
||||||
|
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
fixture = TestBed.createComponent(HelloWorldComponent);
|
fixture = TestBed.createComponent(LandingpageComponent);
|
||||||
component = fixture.componentInstance;
|
component = fixture.componentInstance;
|
||||||
fixture.detectChanges();
|
fixture.detectChanges();
|
||||||
});
|
});
|
15
Frontend/src/app/landingpage/landingpage.component.ts
Normal file
15
Frontend/src/app/landingpage/landingpage.component.ts
Normal file
|
@ -0,0 +1,15 @@
|
||||||
|
import { Component, OnInit } from '@angular/core';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-landingpage',
|
||||||
|
templateUrl: './landingpage.component.html',
|
||||||
|
styleUrls: ['./landingpage.component.css']
|
||||||
|
})
|
||||||
|
export class LandingpageComponent implements OnInit {
|
||||||
|
|
||||||
|
constructor() { }
|
||||||
|
|
||||||
|
ngOnInit(): void {
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
|
@ -2,3 +2,6 @@
|
||||||
<p class="productItem" *ngFor="let product of products" (click)="clickedProduct(product)">
|
<p class="productItem" *ngFor="let product of products" (click)="clickedProduct(product)">
|
||||||
{{product.name}}
|
{{product.name}}
|
||||||
</p>
|
</p>
|
||||||
|
<div *ngIf="showProductPicture">
|
||||||
|
Test
|
||||||
|
</div>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import {Component, OnInit} from '@angular/core';
|
import {Component, Input, OnInit} from '@angular/core';
|
||||||
import {ApiService} from '../api.service';
|
import {ApiService} from '../api.service';
|
||||||
import {Product} from '../models/product';
|
import {Product} from '../models/product';
|
||||||
import {Router} from '@angular/router';
|
import {Router} from '@angular/router';
|
||||||
|
@ -10,6 +10,8 @@ import { Router } from '@angular/router';
|
||||||
})
|
})
|
||||||
export class ProductListComponent implements OnInit {
|
export class ProductListComponent implements OnInit {
|
||||||
products: Product[];
|
products: Product[];
|
||||||
|
@Input() numberOfProducts: number;
|
||||||
|
@Input() showProductPicture: boolean;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private apiService: ApiService,
|
private apiService: ApiService,
|
||||||
|
@ -19,6 +21,13 @@ export class ProductListComponent implements OnInit {
|
||||||
|
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
this.getProducts();
|
this.getProducts();
|
||||||
|
|
||||||
|
if (!this.numberOfProducts) {
|
||||||
|
this.numberOfProducts = 10;
|
||||||
|
}
|
||||||
|
if (!this.showProductPicture) {
|
||||||
|
this.showProductPicture = false;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
getProducts(): void {
|
getProducts(): void {
|
||||||
|
|
Loading…
Reference in New Issue
Block a user