overflow_backup_2018_0455/overflow-webapp
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

signup component & page commit

Browse Source
This commit is contained in:
geek 2018-01-31 17:42:46 +09:00
parent 198d9a24c6
commit d939976ce5
3 changed files with 87 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/app/packages/member/component/signup/signup.component.html
View File

@ -1,9 +1,7 @@
<mat-card>
<mat-card-title>Signup
<a class="redirect" [routerLink]="['/auth/sigup']">Register an account</a>
</mat-card-title>
<mat-card-title align="center">Signup</mat-card-title>
<mat-card-content>
<form fxLayout="column" fxLayoutAlign="start stretch" [formGroup]="signupForm" (ngSubmit)="login()">
<form fxLayout="column" fxLayoutAlign="start stretch" [formGroup]="signupForm" (ngSubmit)="signup()">
<mat-form-field class="full-width">
<input type="email" id="email" class="input" placeholder="Please enter your email"
formControlName="email" required matInput>
@ -18,6 +16,36 @@
<div *ngIf="formErrors.password" class="help is-danger">
{{ formErrors.password }}
</div>
<mat-form-field class="full-width">
<input type="password" id="pwConfirm" class="input" placeholder="please enter confirm password"
formControlName="pwConfirm" required matInput>
</mat-form-field>
<div *ngIf="formErrors.pwConfirm" class="help is-danger">
{{ formErrors.pwConfirm }}
</div>
<mat-form-field class="full-width">
<input type="text" id="name" class="input" placeholder="please enter your name"
formControlName="name" required matInput>
</mat-form-field>
<div *ngIf="formErrors.name" class="help is-danger">
{{ formErrors.name }}
</div>
<mat-form-field class="full-width">
<input type="text" id="phone" class="input" placeholder="please enter your phone"
formControlName="phone" required matInput>
</mat-form-field>
<div *ngIf="formErrors.phone" class="help is-danger">
{{ formErrors.phone }}
</div>
<mat-form-field class="full-width">
<input type="text" id="company" class="input" placeholder="please enter your company name"
formControlName="company" required matInput>
</mat-form-field>
<div *ngIf="formErrors.company" class="help is-danger">
{{ formErrors.company }}
</div>
<button mat-raised-button color="primary" type="submit" [disabled]="!signupForm.valid" (click)="signup()">Signup</button>
</form>
</mat-card-content>

37
src/app/packages/member/component/signup/signup.component.scss
View File

@ -0,0 +1,37 @@
$gray-lighter: #eceeef !default;
$image_path: "/assets/images/" !default;
$prefix: 'signup';
.#{$prefix} {
&-conainer {
min-height: 100%;
background-size: cover;
padding: 100px;
}
&-main {
position: relative;
margin: 0 auto;
width: 500px;
}
}
.full-width {
width: 100%;
}
.help {
}
.is-danger {
}
.redirect {
font-size: 14px;
margin-left: 10px;
color: #00AAAA;
}

18
src/app/packages/member/component/signup/signup.component.ts
View File

@ -41,6 +41,24 @@ export class SignupComponent implements OnInit {
Validators.maxLength(25)
]
],
'pwConfirm': ['', [
Validators.pattern('^(?=.*[0-9])(?=.*[a-zA-Z])([a-zA-Z0-9]+)$'),
Validators.minLength(6),
Validators.maxLength(25)
]
],
'name': ['', [
Validators.required
]
],
'phone': ['', [
Validators.required
]
],
'company': ['', [
Validators.required
]
],
});
}