BETTERZON-120: wip: auth components created.

This commit is contained in:
Jegor 2021-05-29 11:01:32 +02:00
parent f28dae3272
commit 7f9e6e5197
21 changed files with 6783 additions and 5269 deletions

11790
Frontend/package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -7,7 +7,8 @@
"build": "ng build", "build": "ng build",
"test": "ng test", "test": "ng test",
"lint": "ng lint", "lint": "ng lint",
"e2e": "ng e2e" "e2e": "ng e2e",
"postinstall": "ngcc"
}, },
"private": true, "private": true,
"dependencies": { "dependencies": {

View File

@ -13,7 +13,7 @@ import {NgApexchartsModule} from 'ng-apexcharts';
import {ProductSearchPageComponent} from './pages/product-search-page/product-search-page.component'; import {ProductSearchPageComponent} from './pages/product-search-page/product-search-page.component';
import {HeaderComponent} from './components/header/header.component'; import {HeaderComponent} from './components/header/header.component';
import {NewestPricesListComponent} from './components/newest-prices-list/newest-prices-list.component'; import {NewestPricesListComponent} from './components/newest-prices-list/newest-prices-list.component';
import {FormsModule} from '@angular/forms'; import {FormsModule, ReactiveFormsModule} from '@angular/forms';
import {PageNotFoundPageComponent} from './pages/page-not-found-page/page-not-found-page.component'; import {PageNotFoundPageComponent} from './pages/page-not-found-page/page-not-found-page.component';
import {MatMenuModule} from '@angular/material/menu'; import {MatMenuModule} from '@angular/material/menu';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations'; import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
@ -31,6 +31,10 @@ import {MatListModule} from "@angular/material/list";
import {BottomBarComponent} from './components/bottom-bar/bottom-bar.component'; import {BottomBarComponent} from './components/bottom-bar/bottom-bar.component';
import { HotDealsWidgetComponent } from './components/hot-deals-widget/hot-deals-widget.component'; import { HotDealsWidgetComponent } from './components/hot-deals-widget/hot-deals-widget.component';
import { SliderForProductsComponent } from './components/slider-for-products/slider-for-products.component'; import { SliderForProductsComponent } from './components/slider-for-products/slider-for-products.component';
import { RegistrationComponent } from './components/auth/registration/registration.component';
import { SigninComponent } from './components/auth/signin/signin.component';
import { MatCardModule } from "@angular/material/card";
import {MatFormField} from "@angular/material/form-field";
// For cookie popup // For cookie popup
@ -89,7 +93,9 @@ const cookieConfig: NgcCookieConsentConfig = {
TopBarComponent, TopBarComponent,
BottomBarComponent, BottomBarComponent,
HotDealsWidgetComponent, HotDealsWidgetComponent,
SliderForProductsComponent SliderForProductsComponent,
RegistrationComponent,
SigninComponent,
], ],
imports: [ imports: [
BrowserModule, BrowserModule,
@ -107,9 +113,12 @@ const cookieConfig: NgcCookieConsentConfig = {
MatListModule, MatListModule,
MatButtonModule, MatButtonModule,
MatIconModule, MatIconModule,
MatFormField,
RouterModule.forRoot([ RouterModule.forRoot([
{path: '', component: LandingpageComponent}, {path: '', component: LandingpageComponent},
]), ]),
MatCardModule,
ReactiveFormsModule,
], ],
providers: [], providers: [],
bootstrap: [AppComponent] bootstrap: [AppComponent]

View File

@ -0,0 +1,26 @@
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import {RegistrationComponent} from "./registration/registration.component";
import {SigninComponent} from "./signin/signin.component";
import {ResetpasswortComponent} from "./resetpasswort/resetpasswort.component";
const routes: Routes = [
{
path: 'registration',
component: RegistrationComponent
},
{
path: 'signin',
component: SigninComponent
},
{
path: 'resetpasswort',
component: ResetpasswortComponent
},
];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule]
})
export class AuthRoutingModule { }

View File

@ -0,0 +1,22 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AuthRoutingModule } from './auth-routing.module';
import { SigninComponent } from "./signin/signin.component";
import { RegistrationComponent } from './registration/registration.component';
import { ResetpasswortComponent } from './resetpasswort/resetpasswort.component';
@NgModule({
declarations: [SigninComponent, RegistrationComponent, ResetpasswortComponent],
imports: [
CommonModule,
AuthRoutingModule,
],
exports: [
SigninComponent,
RegistrationComponent,
ResetpasswortComponent,
],
})
export class AuthModule { }

View File

@ -0,0 +1 @@
<p>registration works!</p>

View File

@ -0,0 +1,25 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { RegistrationComponent } from './registration.component';
describe('RegistrationComponent', () => {
let component: RegistrationComponent;
let fixture: ComponentFixture<RegistrationComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ RegistrationComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(RegistrationComponent);
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-registration',
templateUrl: './registration.component.html',
styleUrls: ['./registration.component.css']
})
export class RegistrationComponent implements OnInit {
constructor() { }
ngOnInit(): void {
}
}

View File

@ -0,0 +1 @@
<p>resetpasswort works!</p>

View File

@ -0,0 +1,25 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ResetpasswortComponent } from './resetpasswort.component';
describe('ResetpasswortComponent', () => {
let component: ResetpasswortComponent;
let fixture: ComponentFixture<ResetpasswortComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ResetpasswortComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(ResetpasswortComponent);
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-resetpasswort',
templateUrl: './resetpasswort.component.html',
styleUrls: ['./resetpasswort.component.css']
})
export class ResetpasswortComponent implements OnInit {
constructor() { }
ngOnInit(): void {
}
}

View File

@ -0,0 +1,9 @@
mat-card {
max-width: 400px;
margin: 2em auto;
text-align: center;
}
mat-form-field {
display: block;
}

View File

@ -0,0 +1,23 @@
<mat-card>
<mat-card-content>
<form [formGroup]="form" (ngSubmit)="onSubmit()">
<h2>Log In</h2>
<mat-error *ngIf="loginInvalid">
The username and password were not recognized
</mat-error>
<mat-form-field class="full-width-input">
<input matInput placeholder="Email" formControlName="username" required>
<mat-error>
Please provide a valid email address
</mat-error>
</mat-form-field>
<mat-form-field class="full-width-input">
<input matInput type="password" placeholder="Password" formControlName="password" required>
<mat-error>
Please provide a valid password
</mat-error>
</mat-form-field>
<button mat-raised-button color="primary">Login</button>
</form>
</mat-card-content>
</mat-card>

View File

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

View File

@ -0,0 +1,20 @@
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-signin',
templateUrl: './signin.component.html',
styleUrls: ['./signin.component.css']
})
export class SigninComponent implements OnInit {
form: any;
loginInvalid: any;
constructor() { }
ngOnInit(): void {
}
onSubmit() {
}
}

View File

@ -1,10 +1,10 @@
<div class="top-bar-wrapper"> <div class="top-bar-wrapper">
<div class="<top-logo>"> <div class="<top-logo>" routerLink=''>
<a><span id="better">BETTER</span><span id="zon">ZON</span></a> <a><span id="better">BETTER</span><span id="zon">ZON</span></a>
</div> </div>
<div class="links"> <div class="links">
<nav class="_links"> <nav class="_links">
<a>KONTAKTIERE UNS</a> <a routerLink="signin">KONTAKTIERE UNS</a>
<a>KUNDEN</a> <a>KUNDEN</a>
<a>FAQ</a> <a>FAQ</a>
</nav> </nav>
@ -19,8 +19,8 @@
</div> </div>
<div class="links"> <div class="links">
<nav class="_signing_links"> <nav class="_signing_links">
<a>SIGN UP</a> <a routerLink="signup" routerLinkActive="acitve">SIGN UP</a>
<a><span id="signin">SIGN IN</span></a> <a routerLink="singin" routerLinkActive="acitve"><span id="signin">SIGN IN</span></a>
</nav> </nav>
</div> </div>
</div> </div>

View File

@ -1,5 +1,5 @@
<app-hot-deals-widget></app-hot-deals-widget> <app-hot-deals-widget></app-hot-deals-widget>
<app-signin></app-signin>
<!--<div id="mainComponents"> <!--<div id="mainComponents">
<div id="searchContainer"> <div id="searchContainer">
<input type="text" [(ngModel)]="searchInput" placeholder="Search" (keyup.enter)="startedSearch()"> <input type="text" [(ngModel)]="searchInput" placeholder="Search" (keyup.enter)="startedSearch()">

View File

@ -11,6 +11,6 @@
<script src="node_modules/cookieconsent/build/cookieconsent.min.js"></script> <script src="node_modules/cookieconsent/build/cookieconsent.min.js"></script>
</head> </head>
<body> <body>
<app-root></app-root> <app-root>Loading...</app-root>
</body> </body>
</html> </html>

View File

@ -1,4 +1,5 @@
/* general settings */ /* general settings */
@import "~@angular/material/prebuilt-themes/deeppurple-amber.css";
* { * {
box-sizing: border-box; box-sizing: border-box;