overflow_cloud/member_webapp
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ing

Browse Source
This commit is contained in:
geek 2018-05-30 14:52:39 +09:00
parent 232d944640
commit 1f16e5f476
9 changed files with 74 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
@overflow/member/component/member-reset-password.component.html
View File

@ -14,8 +14,8 @@
<span class="md-inputfield">
<input type="email" id="email" autocomplete="off" placeholder="Please enter your email" formControlName="email" required class="ui-inputtext ui-corner-all ui-state-default ui-widget">
</span>
<div *ngIf="formErrors.email" class="help is-danger">
{{ formErrors.email }}
<div *ngIf="email.touched && !email.valid" class="ui-message ui-messages-error ui-corner-all">
Invalid email
</div>
</div>

9
@overflow/member/component/member-reset-password.component.ts
View File

@ -1,5 +1,5 @@
import { Component, OnInit, Output, EventEmitter } from '@angular/core';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import {FormGroup, FormBuilder, Validators, AbstractControl} from '@angular/forms';
@Component({
selector: 'of-member-reset-password',
@ -9,14 +9,11 @@ export class MemberResetPasswordComponent implements OnInit {
@Output() resetPassword = new EventEmitter<string>();
resetPasswordForm: FormGroup;
formErrors = {
'email': ''
};
email: AbstractControl;
constructor(
private formBuilder: FormBuilder
) {
}
ngOnInit() {
@ -27,6 +24,8 @@ export class MemberResetPasswordComponent implements OnInit {
]
]
});
this.email = this.resetPasswordForm.controls['email'];
}
resetPasswordFormSubmit() {

30
@overflow/member/component/member-signin.component.html
View File

@ -9,12 +9,32 @@
</div>
<div class="ui-g-12">
<span class="md-inputfield">
<input type="email" id="email" autocomplete="off" placeholder="email" formControlName="email" required class="ui-inputtext ui-corner-all ui-state-default ui-widget">
<input
type="email"
id="email"
autocomplete="off"
placeholder="email"
formControlName="email"
required
class="ui-inputtext ui-corner-all ui-state-default ui-widget">
<div *ngIf="email.touched && !email.valid" class="ui-message ui-messages-error ui-corner-all">
Invalid email
</div>
</span>
</div>
<div class="ui-g-12">
<span class="md-inputfield">
<input type="password" id="password" autocomplete="off" placeholder="password" formControlName="password" required class="ui-inputtext ui-corner-all ui-state-default ui-widget">
<input
type="password"
id="password"
autocomplete="off"
placeholder="password"
formControlName="password"
required
class="ui-inputtext ui-corner-all ui-state-default ui-widget">
<div *ngIf="password.touched && !password.valid" class="ui-message ui-messages-error ui-corner-all">
Required Password
</div>
</span>
</div>
<div class="ui-g-12">
@ -22,13 +42,13 @@
<span class="ui-button-icon-left ui-c fa fa-fw ui-icon-person"></span>
<span class="ui-button-text ui-c">Sign In</span>
</button>
<a href="javascript:void(0)" (click)="resetPassword.emit()">Forgot Password</a>
<a href="#" (click)="onResetPassword()">Forgot Password</a>
|
<a href="javascript:void(0)" (click)="signup.emit()">Sign Up</a>
<a href="#" (click)="onSignup()">Sign Up</a>
</div>
</div>
</div>
</td>
</tr>
</table>
</form>
</form>

25
@overflow/member/component/member-signin.component.ts
View File

@ -1,7 +1,5 @@
import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { Store, select } from '@ngrx/store';
import {FormGroup, FormBuilder, Validators, AbstractControl} from '@angular/forms';
import { Member } from '@overflow/commons-typescript/model/member';
@Component({
@ -11,17 +9,17 @@ import { Member } from '@overflow/commons-typescript/model/member';
export class MemberSigninComponent implements OnInit {
@Input() member: Member;
@Input() signinError: string;
@Output() resetPassword = new EventEmitter();
@Output() signup = new EventEmitter();
@Output() signin = new EventEmitter<{email: string, password: string}>();
errorMessage: string | null;
email: AbstractControl;
password: AbstractControl;
signinForm: FormGroup;
formErrors = {
'email': '',
'password': ''
};
constructor(
private formBuilder: FormBuilder,
@ -44,12 +42,12 @@ export class MemberSigninComponent implements OnInit {
'password': [
'',
[
Validators.pattern('^(?=.*[0-9])(?=.*[a-zA-Z])([a-zA-Z0-9]+)$'),
Validators.minLength(6),
Validators.maxLength(25)
Validators.required
]
],
});
this.email = this.signinForm.controls['email'];
this.password = this.signinForm.controls['password'];
}
signinFormSubmit() {
@ -57,4 +55,11 @@ export class MemberSigninComponent implements OnInit {
this.signin.emit(formValue);
}
onResetPassword() {
this.resetPassword.emit();
}
onSignup() {
this.signup.emit();
}
}

2
@overflow/member/container/member-signin-container.component.html
View File

@ -1,5 +1,7 @@
<of-member-signin
[member]="member$ | async"
(signin)="onSignin($event)"
(signup)="onSignup()"
(resetPassword)="onResetPassword()"
>
</of-member-signin>

14
@overflow/member/container/member-signin-container.component.ts
View File

@ -1,4 +1,4 @@
import { Component, OnInit, Input } from '@angular/core';
import {Component, OnInit, Input, Output, EventEmitter} from '@angular/core';
import { Store, select } from '@ngrx/store';
import { Observable } from 'rxjs';
@ -13,6 +13,10 @@ import { Member } from '@overflow/commons-typescript/model/member';
})
export class MemberSigninContainerComponent implements OnInit {
@Input() returnURL: string;
@Output() resetPassword = new EventEmitter();
@Output() signup = new EventEmitter();
member$: Observable<Member>;
pending$: Observable<boolean>;
error$: Observable<any>;
@ -31,4 +35,12 @@ export class MemberSigninContainerComponent implements OnInit {
onSignin(info: {email: string, password: string}) {
this.store.dispatch(new MemberEntityStore.Signin({...info, returnURL: this.returnURL}));
}
onSignup() {
this.signup.emit();
}
onResetPassword() {
this.resetPassword.emit();
}
}

4
src/app/pages/auth/signin/signin-page.component.html
View File

@ -1,6 +1,6 @@
<div class="ui-g">
<div class="ui-g-12 ui-md-9 ui-lg-7">
<of-member-signin-container></of-member-signin-container>
<of-member-signin-container (signup)="onSignup()" (resetPassword)="onResetPassword()"></of-member-signin-container>
</div>
<div class="ui-g-12 ui-md-3 ui-lg-5 login-descript">
<table class="login-table">
@ -24,4 +24,4 @@
</tr>
</table>
</div>
</div>
</div>

11
src/app/pages/auth/signin/signin-page.component.ts
View File

@ -1,5 +1,5 @@
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { ActivatedRoute, Router } from '@angular/router';
@Component({
@ -11,10 +11,19 @@ export class SigninPageComponent implements OnInit {
returnURL: string;
constructor(
private router: Router,
private activatedRoute: ActivatedRoute,
) { }
ngOnInit() {
this.returnURL = this.activatedRoute.snapshot.queryParams['returnURL'] || '/';
}
onResetPassword() {
this.router.navigate(['/auth/reset-password']);
}
onSignup() {
this.router.navigate(['/auth/signup']);
}
}

2
src/environments/environment.ts
View File

@ -5,7 +5,7 @@
export const environment = {
production: false,
restBaseURL: 'http://192.168.1.101:19080/webapp',
restBaseURL: 'http://192.168.1.103:19080/webapp',
webappRPCConfig: {
url: 'ws://192.168.1.101:19090/webapp',
reconnectInterval: 5000,