Merge pull request #9 from Mueller-Patrick/BETTERZON-33

Betterzon 33
This commit is contained in:
Patrick 2020-12-02 19:03:14 +01:00 committed by GitHub
commit bbf6a39cb8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
23 changed files with 1201 additions and 5880 deletions

View File

@ -4,7 +4,7 @@ root = true
[*] [*]
charset = utf-8 charset = utf-8
indent_style = space indent_style = space
indent_size = 2 indent_size = 4
insert_final_newline = true insert_final_newline = true
trim_trailing_whitespace = true trim_trailing_whitespace = true

File diff suppressed because it is too large Load Diff

View File

@ -12,6 +12,7 @@
"private": true, "private": true,
"dependencies": { "dependencies": {
"@angular/animations": "^10.2.3", "@angular/animations": "^10.2.3",
"@angular/cli": "^10.2.0",
"@angular/common": "^10.2.3", "@angular/common": "^10.2.3",
"@angular/compiler": "^10.2.3", "@angular/compiler": "^10.2.3",
"@angular/core": "^10.2.3", "@angular/core": "^10.2.3",
@ -19,19 +20,18 @@
"@angular/platform-browser": "^10.2.3", "@angular/platform-browser": "^10.2.3",
"@angular/platform-browser-dynamic": "^10.2.3", "@angular/platform-browser-dynamic": "^10.2.3",
"@angular/router": "^10.2.3", "@angular/router": "^10.2.3",
"angular-cli": "^1.0.0-beta.28.3",
"ng": "0.0.0", "ng": "0.0.0",
"rxjs": "~6.6.0", "rxjs": "~6.6.0",
"tslib": "^2.0.3", "tslib": "^2.0.3",
"zone.js": "~0.10.2" "zone.js": "~0.10.2"
}, },
"devDependencies": { "devDependencies": {
"@angular-devkit/build-angular": "^0.1100.1", "@angular-devkit/build-angular": "^0.1100.2",
"@angular/cli": "^10.2.0", "@angular/cli": "^10.2.0",
"@angular/compiler-cli": "^10.2.3", "@angular/compiler-cli": "^10.2.3",
"@types/jasmine": "~3.5.0", "@types/jasmine": "~3.5.0",
"@types/jasminewd2": "~2.0.3", "@types/jasminewd2": "~2.0.3",
"@types/node": "^12.19.4", "@types/node": "^12.19.8",
"codelyzer": "^6.0.0", "codelyzer": "^6.0.0",
"jasmine-core": "~3.6.0", "jasmine-core": "~3.6.0",
"jasmine-spec-reporter": "~5.0.0", "jasmine-spec-reporter": "~5.0.0",
@ -43,6 +43,6 @@
"protractor": "~7.0.0", "protractor": "~7.0.0",
"ts-node": "~8.3.0", "ts-node": "~8.3.0",
"tslint": "~6.1.0", "tslint": "~6.1.0",
"typescript": "^4.0.5" "typescript": "<4.1.0"
} }
} }

View File

@ -0,0 +1,16 @@
import { TestBed } from '@angular/core/testing';
import { ApiService } from './api.service';
describe('ApiService', () => {
let service: ApiService;
beforeEach(() => {
TestBed.configureTestingModule({});
service = TestBed.inject(ApiService);
});
it('should be created', () => {
expect(service).toBeTruthy();
});
});

View File

@ -0,0 +1,27 @@
import {Injectable} from '@angular/core';
import {HttpClient, HttpHeaders} from '@angular/common/http';
import process from 'process';
import {Product} from './models/product';
import {Observable, of} from 'rxjs';
@Injectable({
providedIn: 'root'
})
export class ApiService {
apiUrl = 'https://backend.betterzon.xyz';
constructor(
private http: HttpClient
) {
}
getProducts(): Observable<Product[]> {
try {
const prods = this.http.get<Product[]>((this.apiUrl + '/products'));
console.log(prods);
return prods;
} catch (exception) {
process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
}
}
}

View File

@ -1 +1 @@
<app-hello-world></app-hello-world> <router-outlet></router-outlet>

View File

@ -1,18 +1,27 @@
import { BrowserModule } from '@angular/platform-browser'; import {BrowserModule} from '@angular/platform-browser';
import { NgModule } from '@angular/core'; import {HttpClientModule} from '@angular/common/http';
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 {ProductListComponent} from './product-list/product-list.component';
import { LandingpageComponent } from './landingpage/landingpage.component';
import { ProductDetailPageComponent } from './product-detail-page/product-detail-page.component';
@NgModule({ @NgModule({
declarations: [ declarations: [
AppComponent, AppComponent,
HelloWorldComponent ProductListComponent,
LandingpageComponent,
ProductDetailPageComponent
], ],
imports: [ imports: [
BrowserModule BrowserModule,
AppRouting,
HttpClientModule
], ],
providers: [], providers: [],
bootstrap: [AppComponent] bootstrap: [AppComponent]
}) })
export class AppModule { } export class AppModule {
}

View File

@ -0,0 +1,24 @@
import {NgModule} from '@angular/core';
import {CommonModule} from '@angular/common';
import {RouterModule, Routes} from '@angular/router';
import {AppComponent} from './app.component';
import {ProductListComponent} from './product-list/product-list.component';
import {LandingpageComponent} from './landingpage/landingpage.component';
import {ProductDetailPageComponent} from './product-detail-page/product-detail-page.component';
const routes: Routes = [
{path: '', component: LandingpageComponent},
{path: 'product', component: ProductDetailPageComponent}
];
@NgModule({
declarations: [],
imports: [
RouterModule.forRoot(routes)
],
exports: [
RouterModule
]
})
export class AppRouting {
}

View File

@ -1,2 +0,0 @@
<p>hello-world works! Title: </p>
<a href="https://blog.betterzon.xyz">Blog</a>

View File

@ -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 {
}
}

View File

@ -0,0 +1 @@
<app-product-list numberOfProducts="20" showProductPicture="true"></app-product-list>

View File

@ -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();
}); });

View 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 {
}
}

View File

@ -0,0 +1,14 @@
export interface Product {
product_id: number;
asin: string;
is_active: boolean;
name: string;
short_description: string;
long_description: string;
image_guid: string;
date_added: Date;
last_modified: Date;
manufacturer_id: number;
selling_rank: string;
category_id: number;
}

View File

@ -0,0 +1 @@
<p>product-detail-page works!</p>

View File

@ -0,0 +1,25 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ProductDetailPageComponent } from './product-detail-page.component';
describe('ProductDetailPageComponent', () => {
let component: ProductDetailPageComponent;
let fixture: ComponentFixture<ProductDetailPageComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ProductDetailPageComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(ProductDetailPageComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,15 @@
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-product-detail-page',
templateUrl: './product-detail-page.component.html',
styleUrls: ['./product-detail-page.component.css']
})
export class ProductDetailPageComponent implements OnInit {
constructor() { }
ngOnInit(): void {
}
}

View File

@ -0,0 +1,6 @@
.productItem {
border-style: solid;
border-color: dimgrey;
border-radius: .5em;
padding: .25em;
}

View File

@ -0,0 +1,7 @@
<meta charset="UTF-8">
<p class="productItem" *ngFor="let product of products" (click)="clickedProduct(product)">
{{product.name}}
</p>
<div *ngIf="showProductPicture">
Test
</div>

View File

@ -0,0 +1,25 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ProductListComponent } from './product-list.component';
describe('ProductListComponent', () => {
let component: ProductListComponent;
let fixture: ComponentFixture<ProductListComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ProductListComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(ProductListComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,41 @@
import {Component, Input, OnInit} from '@angular/core';
import {ApiService} from '../api.service';
import {Product} from '../models/product';
import {Router} from '@angular/router';
@Component({
selector: 'app-product-list',
templateUrl: './product-list.component.html',
styleUrls: ['./product-list.component.css']
})
export class ProductListComponent implements OnInit {
products: Product[];
@Input() numberOfProducts: number;
@Input() showProductPicture: boolean;
constructor(
private apiService: ApiService,
private router: Router
) {
}
ngOnInit(): void {
this.getProducts();
if (!this.numberOfProducts) {
this.numberOfProducts = 10;
}
if (!this.showProductPicture) {
this.showProductPicture = false;
}
}
getProducts(): void {
this.apiService.getProducts().subscribe(products => this.products = products);
}
clickedProduct(product: Product): void {
this.router.navigate([('/helloworld/' + product.product_id)]);
}
}