Added proper switch for user form
switch between customer and organisation
This commit is contained in:
parent
53a759a2f9
commit
9dc82fb4fe
2 changed files with 47 additions and 56 deletions
|
@ -8,6 +8,7 @@ import { LoginComponent } from './login.component';
|
||||||
import { RegisterComponent } from './register.component';
|
import { RegisterComponent } from './register.component';
|
||||||
|
|
||||||
import { PagesRoutingModule } from './pages-routing.module';
|
import { PagesRoutingModule } from './pages-routing.module';
|
||||||
|
import { TabsModule } from 'ngx-bootstrap/tabs';
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
imports: [
|
imports: [
|
||||||
|
@ -15,6 +16,7 @@ import { PagesRoutingModule } from './pages-routing.module';
|
||||||
PagesRoutingModule,
|
PagesRoutingModule,
|
||||||
FormsModule,
|
FormsModule,
|
||||||
ReactiveFormsModule,
|
ReactiveFormsModule,
|
||||||
|
TabsModule
|
||||||
],
|
],
|
||||||
declarations: [
|
declarations: [
|
||||||
P404Component,
|
P404Component,
|
||||||
|
|
|
@ -7,47 +7,25 @@
|
||||||
<h1>Register</h1>
|
<h1>Register</h1>
|
||||||
<p class="text-muted">Create your account</p>
|
<p class="text-muted">Create your account</p>
|
||||||
|
|
||||||
<div class="input-group mb-3">
|
<!-- <div class="input-group mb-3">
|
||||||
<span class="input-group-addon"><i class="icon-people"></i></span>
|
<span class="input-group-addon"><i class="icon-people"></i></span>
|
||||||
<select required class="form-control" type="text" formControlName="usertype">
|
<select required class="form-control" type="text" formControlName="usertype">
|
||||||
<option value=''>Please select</option>
|
<option value=''>Please select</option>
|
||||||
<option value='customer'>Customer</option>
|
|
||||||
<option value='organisation'>Organisation</option>
|
<option value='organisation'>Organisation</option>
|
||||||
|
<option value='customer'>Customer</option>
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div> -->
|
||||||
|
<form [formGroup]="signup.getForm()" (ngSubmit)="onSubmit()">
|
||||||
<form *ngIf="showtradersignup" [formGroup]="signup.getForm()" (ngSubmit)="onSubmit()">
|
|
||||||
|
|
||||||
<div class="input-group mb-3">
|
<div class="input-group mb-3">
|
||||||
<span class="input-group-addon"><i class="icon-key"></i></span>
|
<span class="input-group-addon"><i class="icon-key"></i></span>
|
||||||
<input type="text" class="form-control" formControlName="token" placeholder="Token">
|
<input type="text" class="form-control" formControlName="token" placeholder="Token">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="input-group mb-3">
|
|
||||||
<span class="input-group-addon"><i class="icon-user"></i></span>
|
|
||||||
<input type="text" class="form-control" formControlName="name" placeholder="Organisation Name">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="input-group mb-3">
|
<div class="input-group mb-3">
|
||||||
<span class="input-group-addon">@</span>
|
<span class="input-group-addon">@</span>
|
||||||
<input type="text" class="form-control" formControlName="email" placeholder="Email">
|
<input type="text" class="form-control" formControlName="email" placeholder="Email">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="input-group mb-3">
|
|
||||||
<span class="input-group-addon"><i class="icon-user"></i></span>
|
|
||||||
<input type="text" class="form-control" formControlName="street_name" placeholder="Street Name">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="input-group mb-3">
|
|
||||||
<span class="input-group-addon"><i class="icon-user"></i></span>
|
|
||||||
<input type="text" class="form-control" formControlName="town" placeholder="Town">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="input-group mb-3">
|
|
||||||
<span class="input-group-addon"><i class="icon-user"></i></span>
|
|
||||||
<input type="text" class="form-control" formControlName="postcode" placeholder="Postcode">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="input-group mb-3">
|
<div class="input-group mb-3">
|
||||||
<span class="input-group-addon"><i class="icon-lock"></i></span>
|
<span class="input-group-addon"><i class="icon-lock"></i></span>
|
||||||
<input type="password" class="form-control" formControlName="password" placeholder="Password">
|
<input type="password" class="form-control" formControlName="password" placeholder="Password">
|
||||||
|
@ -58,34 +36,27 @@
|
||||||
<input type="password" class="form-control" formControlName="confirmpassword" placeholder="Repeat password">
|
<input type="password" class="form-control" formControlName="confirmpassword" placeholder="Repeat password">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button type="submit" class="btn btn-block btn-success">Create Account</button>
|
<div class="input-group mb-3">
|
||||||
|
<span class="input-group-addon"><i class="icon-people"></i></span>
|
||||||
|
<select required class="form-control" type="text" formControlName="usertype">
|
||||||
|
<option value=''>Please select</option>
|
||||||
|
<option value='organisation'>Organisation</option>
|
||||||
|
<option value='customer'>Customer</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
<form *ngIf="showcustomersignup" [formGroup]="signup.getForm()" (ngSubmit)="onSubmit()">
|
<div [ngSwitch]="signup.getForm().value.usertype">
|
||||||
|
<div *ngSwitchCase="'customer'" >
|
||||||
|
<form [formGroup]="signup.getForm()" (ngSubmit)="onSubmit()">
|
||||||
<div class="input-group mb-3">
|
<div class="input-group mb-3">
|
||||||
<span class="input-group-addon"><i class="icon-key"></i></span>
|
<span class="input-group-addon"><i class="icon-user"></i></span>
|
||||||
<input type="text" class="form-control" formControlName="token" placeholder="Token">
|
<input type="text" class="form-control" formControlName="display_name" placeholder="Display Name">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="input-group mb-3">
|
<div class="input-group mb-3">
|
||||||
<span class="input-group-addon"><i class="icon-user"></i></span>
|
<span class="input-group-addon"><i class="icon-user"></i></span>
|
||||||
<input type="text" class="form-control" formControlName="name" placeholder="Organisation Name">
|
<input type="text" class="form-control" formControlName="full_name" placeholder="Full Name">
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="input-group mb-3">
|
|
||||||
<span class="input-group-addon"><i class="icon-user"></i></span>
|
|
||||||
<input type="text" class="form-control" formControlName="full_name" placeholder="Username">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="input-group mb-3">
|
|
||||||
<span class="input-group-addon"><i class="icon-user"></i></span>
|
|
||||||
<input type="text" class="form-control" formControlName="display_name" placeholder="Full Name">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="input-group mb-3">
|
|
||||||
<span class="input-group-addon">@</span>
|
|
||||||
<input type="text" class="form-control" formControlName="email" placeholder="Email">
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="input-group mb-3">
|
<div class="input-group mb-3">
|
||||||
|
@ -100,19 +71,37 @@
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<button type="submit" class="btn btn-block btn-success">Create Account</button>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
<div *ngSwitchCase="'organisation'">
|
||||||
|
<form [formGroup]="signup.getForm()" (ngSubmit)="onSubmit()">
|
||||||
<div class="input-group mb-3">
|
<div class="input-group mb-3">
|
||||||
<span class="input-group-addon"><i class="icon-lock"></i></span>
|
<span class="input-group-addon"><i class="icon-user"></i></span>
|
||||||
<input type="password" class="form-control" formControlName="password" placeholder="Password">
|
<input type="text" class="form-control" formControlName="street_name" placeholder="Street Name">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="input-group mb-4">
|
<div class="input-group mb-3">
|
||||||
<span class="input-group-addon"><i class="icon-lock"></i></span>
|
<span class="input-group-addon"><i class="icon-user"></i></span>
|
||||||
<input type="password" class="form-control" formControlName="confirmpassword" placeholder="Repeat password">
|
<input type="text" class="form-control" formControlName="name" placeholder="Organisation Name">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="input-group mb-3">
|
||||||
|
<span class="input-group-addon"><i class="icon-user"></i></span>
|
||||||
|
<input type="text" class="form-control" formControlName="town" placeholder="Town">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="input-group mb-3">
|
||||||
|
<span class="input-group-addon"><i class="icon-user"></i></span>
|
||||||
|
<input type="text" class="form-control" formControlName="postcode" placeholder="Postcode">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button type="submit" class="btn btn-block btn-success">Create Account</button>
|
<button type="submit" class="btn btn-block btn-success">Create Account</button>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
<div heading="Pending" *ngSwitchDefault>Please Select a User Type</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Reference in a new issue