Initial application generated by JHipster-5.8.2
This commit is contained in:
Michael Hoennig
30
src/main/webapp/app/account/account.module.ts
Normal file
30
src/main/webapp/app/account/account.module.ts
Normal file
@ -0,0 +1,30 @@
|
||||
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
||||
import { RouterModule } from '@angular/router';
|
||||
|
||||
import { HsadminNgSharedModule } from 'app/shared';
|
||||
|
||||
import {
|
||||
PasswordStrengthBarComponent,
|
||||
RegisterComponent,
|
||||
ActivateComponent,
|
||||
PasswordComponent,
|
||||
PasswordResetInitComponent,
|
||||
PasswordResetFinishComponent,
|
||||
SettingsComponent,
|
||||
accountState
|
||||
} from './';
|
||||
|
||||
@NgModule({
|
||||
imports: [HsadminNgSharedModule, RouterModule.forChild(accountState)],
|
||||
declarations: [
|
||||
ActivateComponent,
|
||||
RegisterComponent,
|
||||
PasswordComponent,
|
||||
PasswordStrengthBarComponent,
|
||||
PasswordResetInitComponent,
|
||||
PasswordResetFinishComponent,
|
||||
SettingsComponent
|
||||
],
|
||||
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
||||
})
|
||||
export class HsadminNgAccountModule {}
|
||||
12
src/main/webapp/app/account/account.route.ts
Normal file
12
src/main/webapp/app/account/account.route.ts
Normal file
@ -0,0 +1,12 @@
|
||||
import { Routes } from '@angular/router';
|
||||
|
||||
import { activateRoute, passwordRoute, passwordResetFinishRoute, passwordResetInitRoute, registerRoute, settingsRoute } from './';
|
||||
|
||||
const ACCOUNT_ROUTES = [activateRoute, passwordRoute, passwordResetFinishRoute, passwordResetInitRoute, registerRoute, settingsRoute];
|
||||
|
||||
export const accountState: Routes = [
|
||||
{
|
||||
path: '',
|
||||
children: ACCOUNT_ROUTES
|
||||
}
|
||||
];
|
||||
17
src/main/webapp/app/account/activate/activate.component.html
Normal file
17
src/main/webapp/app/account/activate/activate.component.html
Normal file
@ -0,0 +1,17 @@
|
||||
<div>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-8">
|
||||
<h1 jhiTranslate="activate.title">Activation</h1>
|
||||
|
||||
<div class="alert alert-success" *ngIf="success">
|
||||
<span jhiTranslate="activate.messages.success"><strong>Your user account has been activated.</strong> Please </span>
|
||||
<a class="alert-link" (click)="login()" jhiTranslate="global.messages.info.authenticated.link">sign in</a>.
|
||||
</div>
|
||||
|
||||
<div class="alert alert-danger" *ngIf="error" jhiTranslate="activate.messages.error">
|
||||
<strong>Your user could not be activated.</strong> Please use the registration form to sign up.
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
37
src/main/webapp/app/account/activate/activate.component.ts
Normal file
37
src/main/webapp/app/account/activate/activate.component.ts
Normal file
@ -0,0 +1,37 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
|
||||
import { ActivatedRoute } from '@angular/router';
|
||||
|
||||
import { LoginModalService } from 'app/core';
|
||||
import { ActivateService } from './activate.service';
|
||||
|
||||
@Component({
|
||||
selector: 'jhi-activate',
|
||||
templateUrl: './activate.component.html'
|
||||
})
|
||||
export class ActivateComponent implements OnInit {
|
||||
error: string;
|
||||
success: string;
|
||||
modalRef: NgbModalRef;
|
||||
|
||||
constructor(private activateService: ActivateService, private loginModalService: LoginModalService, private route: ActivatedRoute) {}
|
||||
|
||||
ngOnInit() {
|
||||
this.route.queryParams.subscribe(params => {
|
||||
this.activateService.get(params['key']).subscribe(
|
||||
() => {
|
||||
this.error = null;
|
||||
this.success = 'OK';
|
||||
},
|
||||
() => {
|
||||
this.success = null;
|
||||
this.error = 'ERROR';
|
||||
}
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
login() {
|
||||
this.modalRef = this.loginModalService.open();
|
||||
}
|
||||
}
|
||||
12
src/main/webapp/app/account/activate/activate.route.ts
Normal file
12
src/main/webapp/app/account/activate/activate.route.ts
Normal file
@ -0,0 +1,12 @@
|
||||
import { Route } from '@angular/router';
|
||||
|
||||
import { ActivateComponent } from './activate.component';
|
||||
|
||||
export const activateRoute: Route = {
|
||||
path: 'activate',
|
||||
component: ActivateComponent,
|
||||
data: {
|
||||
authorities: [],
|
||||
pageTitle: 'activate.title'
|
||||
}
|
||||
};
|
||||
16
src/main/webapp/app/account/activate/activate.service.ts
Normal file
16
src/main/webapp/app/account/activate/activate.service.ts
Normal file
@ -0,0 +1,16 @@
|
||||
import { Injectable } from '@angular/core';
|
||||
import { HttpClient, HttpParams } from '@angular/common/http';
|
||||
import { Observable } from 'rxjs';
|
||||
|
||||
import { SERVER_API_URL } from 'app/app.constants';
|
||||
|
||||
@Injectable({ providedIn: 'root' })
|
||||
export class ActivateService {
|
||||
constructor(private http: HttpClient) {}
|
||||
|
||||
get(key: string): Observable<any> {
|
||||
return this.http.get(SERVER_API_URL + 'api/activate', {
|
||||
params: new HttpParams().set('key', key)
|
||||
});
|
||||
}
|
||||
}
|
||||
19
src/main/webapp/app/account/index.ts
Normal file
19
src/main/webapp/app/account/index.ts
Normal file
@ -0,0 +1,19 @@
|
||||
export * from './activate/activate.component';
|
||||
export * from './activate/activate.service';
|
||||
export * from './activate/activate.route';
|
||||
export * from './password/password.component';
|
||||
export * from './password/password-strength-bar.component';
|
||||
export * from './password/password.service';
|
||||
export * from './password/password.route';
|
||||
export * from './password-reset/finish/password-reset-finish.component';
|
||||
export * from './password-reset/finish/password-reset-finish.service';
|
||||
export * from './password-reset/finish/password-reset-finish.route';
|
||||
export * from './password-reset/init/password-reset-init.component';
|
||||
export * from './password-reset/init/password-reset-init.service';
|
||||
export * from './password-reset/init/password-reset-init.route';
|
||||
export * from './register/register.component';
|
||||
export * from './register/register.service';
|
||||
export * from './register/register.route';
|
||||
export * from './settings/settings.component';
|
||||
export * from './settings/settings.route';
|
||||
export * from './account.route';
|
||||
@ -0,0 +1,77 @@
|
||||
<div>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-4">
|
||||
<h1 jhiTranslate="reset.finish.title">Reset password</h1>
|
||||
|
||||
<div class="alert alert-danger" jhiTranslate="reset.finish.messages.keymissing" *ngIf="keyMissing">
|
||||
<strong>The password reset key is missing.</strong>
|
||||
</div>
|
||||
|
||||
<div class="alert alert-warning" *ngIf="!success && !keyMissing">
|
||||
<p jhiTranslate="reset.finish.messages.info">Choose a new password</p>
|
||||
</div>
|
||||
|
||||
<div class="alert alert-danger" *ngIf="error">
|
||||
<p jhiTranslate="reset.finish.messages.error">Your password couldn't be reset. Remember a password request is only valid for 24 hours.</p>
|
||||
</div>
|
||||
|
||||
<p class="alert alert-success" *ngIf="success">
|
||||
<span jhiTranslate="reset.finish.messages.success"><strong>Your password has been reset.</strong> Please </span>
|
||||
<a class="alert-link" (click)="login()" jhiTranslate="global.messages.info.authenticated.link">sign in</a>.
|
||||
</p>
|
||||
|
||||
<div class="alert alert-danger" *ngIf="doNotMatch" jhiTranslate="global.messages.error.dontmatch">
|
||||
The password and its confirmation do not match!
|
||||
</div>
|
||||
|
||||
<div *ngIf="!keyMissing">
|
||||
<form *ngIf="!success" name="form" role="form" (ngSubmit)="finishReset()" #passwordForm="ngForm">
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="password" jhiTranslate="global.form.newpassword">New password</label>
|
||||
<input type="password" class="form-control" id="password" name="password" #passwordInput="ngModel"
|
||||
placeholder="{{'global.form.newpassword.placeholder' | translate}}"
|
||||
[(ngModel)]="resetAccount.password" minlength=4 maxlength=50 required>
|
||||
<div *ngIf="passwordInput.dirty && passwordInput.invalid">
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="passwordInput.errors.required" jhiTranslate="global.messages.validate.newpassword.required">
|
||||
Your password is required.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="passwordInput.errors.minlength" jhiTranslate="global.messages.validate.newpassword.minlength">
|
||||
Your password is required to be at least 4 characters.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="passwordInput.errors.maxlength" jhiTranslate="global.messages.validate.newpassword.maxlength">
|
||||
Your password cannot be longer than 50 characters.
|
||||
</small>
|
||||
</div>
|
||||
<jhi-password-strength-bar [passwordToCheck]="resetAccount.password"></jhi-password-strength-bar>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="confirmPassword" jhiTranslate="global.form.confirmpassword">New password confirmation</label>
|
||||
<input type="password" class="form-control" id="confirmPassword" name="confirmPassword" #confirmPasswordInput="ngModel"
|
||||
placeholder="{{'global.form.confirmpassword.placeholder' | translate}}"
|
||||
[(ngModel)]="confirmPassword" minlength=4 maxlength=50 required>
|
||||
<div *ngIf="confirmPasswordInput.dirty && confirmPasswordInput.invalid">
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="confirmPasswordInput.errors.required" jhiTranslate="global.messages.validate.confirmpassword.required">
|
||||
Your password confirmation is required.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="confirmPasswordInput.errors.minlength" jhiTranslate="global.messages.validate.confirmpassword.minlength">
|
||||
Your password confirmation is required to be at least 4 characters.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="confirmPasswordInput.errors.maxlength" jhiTranslate="global.messages.validate.confirmpassword.maxlength">
|
||||
Your password confirmation cannot be longer than 50 characters.
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
<button type="submit" [disabled]="passwordForm.form.invalid" class="btn btn-primary" jhiTranslate="reset.finish.form.button">Reset Password</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,65 @@
|
||||
import { Component, OnInit, AfterViewInit, Renderer, ElementRef } from '@angular/core';
|
||||
import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
|
||||
import { ActivatedRoute } from '@angular/router';
|
||||
|
||||
import { LoginModalService } from 'app/core';
|
||||
import { PasswordResetFinishService } from './password-reset-finish.service';
|
||||
|
||||
@Component({
|
||||
selector: 'jhi-password-reset-finish',
|
||||
templateUrl: './password-reset-finish.component.html'
|
||||
})
|
||||
export class PasswordResetFinishComponent implements OnInit, AfterViewInit {
|
||||
confirmPassword: string;
|
||||
doNotMatch: string;
|
||||
error: string;
|
||||
keyMissing: boolean;
|
||||
resetAccount: any;
|
||||
success: string;
|
||||
modalRef: NgbModalRef;
|
||||
key: string;
|
||||
|
||||
constructor(
|
||||
private passwordResetFinishService: PasswordResetFinishService,
|
||||
private loginModalService: LoginModalService,
|
||||
private route: ActivatedRoute,
|
||||
private elementRef: ElementRef,
|
||||
private renderer: Renderer
|
||||
) {}
|
||||
|
||||
ngOnInit() {
|
||||
this.route.queryParams.subscribe(params => {
|
||||
this.key = params['key'];
|
||||
});
|
||||
this.resetAccount = {};
|
||||
this.keyMissing = !this.key;
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
if (this.elementRef.nativeElement.querySelector('#password') != null) {
|
||||
this.renderer.invokeElementMethod(this.elementRef.nativeElement.querySelector('#password'), 'focus', []);
|
||||
}
|
||||
}
|
||||
|
||||
finishReset() {
|
||||
this.doNotMatch = null;
|
||||
this.error = null;
|
||||
if (this.resetAccount.password !== this.confirmPassword) {
|
||||
this.doNotMatch = 'ERROR';
|
||||
} else {
|
||||
this.passwordResetFinishService.save({ key: this.key, newPassword: this.resetAccount.password }).subscribe(
|
||||
() => {
|
||||
this.success = 'OK';
|
||||
},
|
||||
() => {
|
||||
this.success = null;
|
||||
this.error = 'ERROR';
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
login() {
|
||||
this.modalRef = this.loginModalService.open();
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,12 @@
|
||||
import { Route } from '@angular/router';
|
||||
|
||||
import { PasswordResetFinishComponent } from './password-reset-finish.component';
|
||||
|
||||
export const passwordResetFinishRoute: Route = {
|
||||
path: 'reset/finish',
|
||||
component: PasswordResetFinishComponent,
|
||||
data: {
|
||||
authorities: [],
|
||||
pageTitle: 'global.menu.account.password'
|
||||
}
|
||||
};
|
||||
@ -0,0 +1,14 @@
|
||||
import { Injectable } from '@angular/core';
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { Observable } from 'rxjs';
|
||||
|
||||
import { SERVER_API_URL } from 'app/app.constants';
|
||||
|
||||
@Injectable({ providedIn: 'root' })
|
||||
export class PasswordResetFinishService {
|
||||
constructor(private http: HttpClient) {}
|
||||
|
||||
save(keyAndPassword: any): Observable<any> {
|
||||
return this.http.post(SERVER_API_URL + 'api/account/reset-password/finish', keyAndPassword);
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,46 @@
|
||||
<div>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-8">
|
||||
<h1 jhiTranslate="reset.request.title">Reset your password</h1>
|
||||
|
||||
<div class="alert alert-danger" jhiTranslate="reset.request.messages.notfound" *ngIf="errorEmailNotExists">
|
||||
<strong>Email address isn't registered!</strong> Please check and try again.
|
||||
</div>
|
||||
|
||||
<div class="alert alert-warning" *ngIf="!success">
|
||||
<p jhiTranslate="reset.request.messages.info">Enter the email address you used to register.</p>
|
||||
</div>
|
||||
|
||||
<div class="alert alert-success" *ngIf="success === 'OK'">
|
||||
<p jhiTranslate="reset.request.messages.success">Check your emails for details on how to reset your password.</p>
|
||||
</div>
|
||||
|
||||
<form *ngIf="!success" name="form" role="form" (ngSubmit)="requestReset()" #resetRequestForm="ngForm">
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="email" jhiTranslate="global.form.email">Email</label>
|
||||
<input type="email" class="form-control" id="email" name="email" placeholder="{{'global.form.email.placeholder' | translate}}"
|
||||
[(ngModel)]="resetAccount.email" minlength=5 maxlength=254 #emailInput="ngModel" email required>
|
||||
<div *ngIf="emailInput.dirty && emailInput.invalid">
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="emailInput.errors.required" jhiTranslate="global.messages.validate.email.required">
|
||||
Your email is required.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="emailInput.errors.email" jhiTranslate="global.messages.validate.email.invalid">
|
||||
Your email is invalid.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="emailInput.errors.minlength" jhiTranslate="global.messages.validate.email.minlength">
|
||||
Your email is required to be at least 5 characters.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="emailInput.errors.maxlength" jhiTranslate="global.messages.validate.email.maxlength">
|
||||
Your email cannot be longer than 100 characters.
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
<button type="submit" [disabled]="resetRequestForm.form.invalid" class="btn btn-primary" jhiTranslate="reset.request.form.button">Reset</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,43 @@
|
||||
import { Component, OnInit, AfterViewInit, Renderer, ElementRef } from '@angular/core';
|
||||
import { EMAIL_NOT_FOUND_TYPE } from 'app/shared';
|
||||
import { PasswordResetInitService } from './password-reset-init.service';
|
||||
|
||||
@Component({
|
||||
selector: 'jhi-password-reset-init',
|
||||
templateUrl: './password-reset-init.component.html'
|
||||
})
|
||||
export class PasswordResetInitComponent implements OnInit, AfterViewInit {
|
||||
error: string;
|
||||
errorEmailNotExists: string;
|
||||
resetAccount: any;
|
||||
success: string;
|
||||
|
||||
constructor(private passwordResetInitService: PasswordResetInitService, private elementRef: ElementRef, private renderer: Renderer) {}
|
||||
|
||||
ngOnInit() {
|
||||
this.resetAccount = {};
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
this.renderer.invokeElementMethod(this.elementRef.nativeElement.querySelector('#email'), 'focus', []);
|
||||
}
|
||||
|
||||
requestReset() {
|
||||
this.error = null;
|
||||
this.errorEmailNotExists = null;
|
||||
|
||||
this.passwordResetInitService.save(this.resetAccount.email).subscribe(
|
||||
() => {
|
||||
this.success = 'OK';
|
||||
},
|
||||
response => {
|
||||
this.success = null;
|
||||
if (response.status === 400 && response.error.type === EMAIL_NOT_FOUND_TYPE) {
|
||||
this.errorEmailNotExists = 'ERROR';
|
||||
} else {
|
||||
this.error = 'ERROR';
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,12 @@
|
||||
import { Route } from '@angular/router';
|
||||
|
||||
import { PasswordResetInitComponent } from './password-reset-init.component';
|
||||
|
||||
export const passwordResetInitRoute: Route = {
|
||||
path: 'reset/request',
|
||||
component: PasswordResetInitComponent,
|
||||
data: {
|
||||
authorities: [],
|
||||
pageTitle: 'global.menu.account.password'
|
||||
}
|
||||
};
|
||||
@ -0,0 +1,14 @@
|
||||
import { Injectable } from '@angular/core';
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { Observable } from 'rxjs';
|
||||
|
||||
import { SERVER_API_URL } from 'app/app.constants';
|
||||
|
||||
@Injectable({ providedIn: 'root' })
|
||||
export class PasswordResetInitService {
|
||||
constructor(private http: HttpClient) {}
|
||||
|
||||
save(mail: string): Observable<any> {
|
||||
return this.http.post(SERVER_API_URL + 'api/account/reset-password/init', mail);
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,85 @@
|
||||
import { Component, ElementRef, Input, Renderer } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'jhi-password-strength-bar',
|
||||
template: `
|
||||
<div id="strength">
|
||||
<small jhiTranslate="global.messages.validate.newpassword.strength">Password strength:</small>
|
||||
<ul id="strengthBar">
|
||||
<li class="point"></li>
|
||||
<li class="point"></li>
|
||||
<li class="point"></li>
|
||||
<li class="point"></li>
|
||||
<li class="point"></li>
|
||||
</ul>
|
||||
</div>
|
||||
`,
|
||||
styleUrls: ['password-strength-bar.css']
|
||||
})
|
||||
export class PasswordStrengthBarComponent {
|
||||
colors = ['#F00', '#F90', '#FF0', '#9F0', '#0F0'];
|
||||
|
||||
constructor(private renderer: Renderer, private elementRef: ElementRef) {}
|
||||
|
||||
measureStrength(p: string): number {
|
||||
let force = 0;
|
||||
const regex = /[$-/:-?{-~!"^_`\[\]]/g; // "
|
||||
const lowerLetters = /[a-z]+/.test(p);
|
||||
const upperLetters = /[A-Z]+/.test(p);
|
||||
const numbers = /[0-9]+/.test(p);
|
||||
const symbols = regex.test(p);
|
||||
|
||||
const flags = [lowerLetters, upperLetters, numbers, symbols];
|
||||
const passedMatches = flags.filter((isMatchedFlag: boolean) => {
|
||||
return isMatchedFlag === true;
|
||||
}).length;
|
||||
|
||||
force += 2 * p.length + (p.length >= 10 ? 1 : 0);
|
||||
force += passedMatches * 10;
|
||||
|
||||
// penalty (short password)
|
||||
force = p.length <= 6 ? Math.min(force, 10) : force;
|
||||
|
||||
// penalty (poor variety of characters)
|
||||
force = passedMatches === 1 ? Math.min(force, 10) : force;
|
||||
force = passedMatches === 2 ? Math.min(force, 20) : force;
|
||||
force = passedMatches === 3 ? Math.min(force, 40) : force;
|
||||
|
||||
return force;
|
||||
}
|
||||
|
||||
getColor(s: number): any {
|
||||
let idx = 0;
|
||||
if (s <= 10) {
|
||||
idx = 0;
|
||||
} else if (s <= 20) {
|
||||
idx = 1;
|
||||
} else if (s <= 30) {
|
||||
idx = 2;
|
||||
} else if (s <= 40) {
|
||||
idx = 3;
|
||||
} else {
|
||||
idx = 4;
|
||||
}
|
||||
return { idx: idx + 1, col: this.colors[idx] };
|
||||
}
|
||||
|
||||
@Input()
|
||||
set passwordToCheck(password: string) {
|
||||
if (password) {
|
||||
const c = this.getColor(this.measureStrength(password));
|
||||
const element = this.elementRef.nativeElement;
|
||||
if (element.className) {
|
||||
this.renderer.setElementClass(element, element.className, false);
|
||||
}
|
||||
const lis = element.getElementsByTagName('li');
|
||||
for (let i = 0; i < lis.length; i++) {
|
||||
if (i < c.idx) {
|
||||
this.renderer.setElementStyle(lis[i], 'backgroundColor', c.col);
|
||||
} else {
|
||||
this.renderer.setElementStyle(lis[i], 'backgroundColor', '#DDD');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,24 @@
|
||||
/* ==========================================================================
|
||||
start Password strength bar style
|
||||
========================================================================== */
|
||||
ul#strengthBar {
|
||||
display: inline;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
margin-left: 15px;
|
||||
padding: 0;
|
||||
vertical-align: 2px;
|
||||
}
|
||||
|
||||
.point {
|
||||
background: #ddd;
|
||||
border-radius: 2px;
|
||||
display: inline-block;
|
||||
height: 5px;
|
||||
margin-right: 1px;
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
.point:last-child {
|
||||
margin: 0 !important;
|
||||
}
|
||||
77
src/main/webapp/app/account/password/password.component.html
Normal file
77
src/main/webapp/app/account/password/password.component.html
Normal file
@ -0,0 +1,77 @@
|
||||
<div>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-8">
|
||||
<h2 jhiTranslate="password.title" [translateValues]="{username: account.login}" *ngIf="account">Password for [<b>{{account.login}}</b>]</h2>
|
||||
|
||||
<div class="alert alert-success" *ngIf="success" jhiTranslate="password.messages.success">
|
||||
<strong>Password changed!</strong>
|
||||
</div>
|
||||
<div class="alert alert-danger" *ngIf="error" jhiTranslate="password.messages.error">
|
||||
<strong>An error has occurred!</strong> The password could not be changed.
|
||||
</div>
|
||||
|
||||
<div class="alert alert-danger" *ngIf="doNotMatch" jhiTranslate="global.messages.error.dontmatch">
|
||||
The password and its confirmation do not match!
|
||||
</div>
|
||||
|
||||
<form name="form" role="form" (ngSubmit)="changePassword()" #passwordForm="ngForm">
|
||||
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="currentPassword" jhiTranslate="global.form.currentpassword">Current password</label>
|
||||
<input type="password" class="form-control" id="currentPassword" name="currentPassword" #currentPasswordInput="ngModel"
|
||||
placeholder="{{'global.form.currentpassword.placeholder' | translate}}"
|
||||
[(ngModel)]="currentPassword" required>
|
||||
<div *ngIf="currentPasswordInput.dirty && currentPasswordInput.invalid">
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="currentPasswordInput.errors.required" jhiTranslate="global.messages.validate.newpassword.required">
|
||||
Your password is required.
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="newPassword" jhiTranslate="global.form.newpassword">New password</label>
|
||||
<input type="password" class="form-control" id="newPassword" name="newPassword" #newPasswordInput="ngModel"
|
||||
placeholder="{{'global.form.newpassword.placeholder' | translate}}"
|
||||
[(ngModel)]="newPassword" minlength=4 maxlength=50 required>
|
||||
<div *ngIf="newPasswordInput.dirty && newPasswordInput.invalid">
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="newPasswordInput.errors.required" jhiTranslate="global.messages.validate.newpassword.required">
|
||||
Your password is required.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="newPasswordInput.errors.minlength" jhiTranslate="global.messages.validate.newpassword.minlength">
|
||||
Your password is required to be at least 4 characters.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="newPasswordInput.errors.maxlength" jhiTranslate="global.messages.validate.newpassword.maxlength">
|
||||
Your password cannot be longer than 50 characters.
|
||||
</small>
|
||||
</div>
|
||||
<jhi-password-strength-bar [passwordToCheck]="newPassword"></jhi-password-strength-bar>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="confirmPassword" jhiTranslate="global.form.confirmpassword">New password confirmation</label>
|
||||
<input type="password" class="form-control" id="confirmPassword" name="confirmPassword" #confirmPasswordInput="ngModel"
|
||||
placeholder="{{'global.form.confirmpassword.placeholder' | translate}}"
|
||||
[(ngModel)]="confirmPassword" minlength=4 maxlength=50 required>
|
||||
<div *ngIf="confirmPasswordInput.dirty && confirmPasswordInput.invalid">
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="confirmPasswordInput.errors.required" jhiTranslate="global.messages.validate.confirmpassword.required">
|
||||
Your confirmation password is required.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="confirmPasswordInput.errors.minlength" jhiTranslate="global.messages.validate.confirmpassword.minlength">
|
||||
Your confirmation password is required to be at least 4 characters.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="confirmPasswordInput.errors.maxlength" jhiTranslate="global.messages.validate.confirmpassword.maxlength">
|
||||
Your confirmation password cannot be longer than 50 characters.
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button type="submit" [disabled]="passwordForm.form.invalid" class="btn btn-primary" jhiTranslate="password.form.button">Save</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
46
src/main/webapp/app/account/password/password.component.ts
Normal file
46
src/main/webapp/app/account/password/password.component.ts
Normal file
@ -0,0 +1,46 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
|
||||
import { AccountService } from 'app/core';
|
||||
import { PasswordService } from './password.service';
|
||||
|
||||
@Component({
|
||||
selector: 'jhi-password',
|
||||
templateUrl: './password.component.html'
|
||||
})
|
||||
export class PasswordComponent implements OnInit {
|
||||
doNotMatch: string;
|
||||
error: string;
|
||||
success: string;
|
||||
account: any;
|
||||
currentPassword: string;
|
||||
newPassword: string;
|
||||
confirmPassword: string;
|
||||
|
||||
constructor(private passwordService: PasswordService, private accountService: AccountService) {}
|
||||
|
||||
ngOnInit() {
|
||||
this.accountService.identity().then(account => {
|
||||
this.account = account;
|
||||
});
|
||||
}
|
||||
|
||||
changePassword() {
|
||||
if (this.newPassword !== this.confirmPassword) {
|
||||
this.error = null;
|
||||
this.success = null;
|
||||
this.doNotMatch = 'ERROR';
|
||||
} else {
|
||||
this.doNotMatch = null;
|
||||
this.passwordService.save(this.newPassword, this.currentPassword).subscribe(
|
||||
() => {
|
||||
this.error = null;
|
||||
this.success = 'OK';
|
||||
},
|
||||
() => {
|
||||
this.success = null;
|
||||
this.error = 'ERROR';
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
14
src/main/webapp/app/account/password/password.route.ts
Normal file
14
src/main/webapp/app/account/password/password.route.ts
Normal file
@ -0,0 +1,14 @@
|
||||
import { Route } from '@angular/router';
|
||||
|
||||
import { UserRouteAccessService } from 'app/core';
|
||||
import { PasswordComponent } from './password.component';
|
||||
|
||||
export const passwordRoute: Route = {
|
||||
path: 'password',
|
||||
component: PasswordComponent,
|
||||
data: {
|
||||
authorities: ['ROLE_USER'],
|
||||
pageTitle: 'global.menu.account.password'
|
||||
},
|
||||
canActivate: [UserRouteAccessService]
|
||||
};
|
||||
14
src/main/webapp/app/account/password/password.service.ts
Normal file
14
src/main/webapp/app/account/password/password.service.ts
Normal file
@ -0,0 +1,14 @@
|
||||
import { Injectable } from '@angular/core';
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { Observable } from 'rxjs';
|
||||
|
||||
import { SERVER_API_URL } from 'app/app.constants';
|
||||
|
||||
@Injectable({ providedIn: 'root' })
|
||||
export class PasswordService {
|
||||
constructor(private http: HttpClient) {}
|
||||
|
||||
save(newPassword: string, currentPassword: string): Observable<any> {
|
||||
return this.http.post(SERVER_API_URL + 'api/account/change-password', { currentPassword, newPassword });
|
||||
}
|
||||
}
|
||||
124
src/main/webapp/app/account/register/register.component.html
Normal file
124
src/main/webapp/app/account/register/register.component.html
Normal file
@ -0,0 +1,124 @@
|
||||
<div>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-8">
|
||||
<h1 jhiTranslate="register.title">Registration</h1>
|
||||
|
||||
<div class="alert alert-success" *ngIf="success" jhiTranslate="register.messages.success">
|
||||
<strong>Registration saved!</strong> Please check your email for confirmation.
|
||||
</div>
|
||||
|
||||
<div class="alert alert-danger" *ngIf="error" jhiTranslate="register.messages.error.fail">
|
||||
<strong>Registration failed!</strong> Please try again later.
|
||||
</div>
|
||||
|
||||
<div class="alert alert-danger" *ngIf="errorUserExists" jhiTranslate="register.messages.error.userexists">
|
||||
<strong>Login name already registered!</strong> Please choose another one.
|
||||
</div>
|
||||
|
||||
<div class="alert alert-danger" *ngIf="errorEmailExists" jhiTranslate="register.messages.error.emailexists">
|
||||
<strong>Email is already in use!</strong> Please choose another one.
|
||||
</div>
|
||||
|
||||
<div class="alert alert-danger" *ngIf="doNotMatch" jhiTranslate="global.messages.error.dontmatch">
|
||||
The password and its confirmation do not match!
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-8">
|
||||
<form name="form" role="form" (ngSubmit)="register()" #registerForm="ngForm" *ngIf="!success">
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="login" jhiTranslate="global.form.username">Username</label>
|
||||
<input type="text" class="form-control" [(ngModel)]="registerAccount.login" id="login" name="login" #login="ngModel" placeholder="{{'global.form.username.placeholder' | translate}}"
|
||||
required minlength="1" maxlength="50" pattern="^[_.@A-Za-z0-9-]*$">
|
||||
<div *ngIf="login.dirty && login.invalid">
|
||||
<small class="form-text text-danger" *ngIf="login.errors.required" jhiTranslate="register.messages.validate.login.required">
|
||||
Your username is required.
|
||||
</small>
|
||||
<small class="form-text text-danger" *ngIf="login.errors.minlength"
|
||||
jhiTranslate="register.messages.validate.login.minlength">
|
||||
Your username is required to be at least 1 character.
|
||||
</small>
|
||||
<small class="form-text text-danger" *ngIf="login.errors.maxlength"
|
||||
jhiTranslate="register.messages.validate.login.maxlength">
|
||||
Your username cannot be longer than 50 characters.
|
||||
</small>
|
||||
<small class="form-text text-danger" *ngIf="login.errors.pattern"
|
||||
jhiTranslate="register.messages.validate.login.pattern">
|
||||
Your username can only contain letters and digits.
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="email" jhiTranslate="global.form.email">Email</label>
|
||||
<input type="email" class="form-control" id="email" name="email" #email="ngModel" placeholder="{{'global.form.email.placeholder' | translate}}"
|
||||
[(ngModel)]="registerAccount.email" minlength=5 maxlength=254 email required>
|
||||
<div *ngIf="email.dirty && email.invalid">
|
||||
<small class="form-text text-danger" *ngIf="email.errors.required"
|
||||
jhiTranslate="global.messages.validate.email.required">
|
||||
Your email is required.
|
||||
</small>
|
||||
<small class="form-text text-danger" *ngIf="email.errors.invalid"
|
||||
jhiTranslate="global.messages.validate.email.invalid">
|
||||
Your email is invalid.
|
||||
</small>
|
||||
<small class="form-text text-danger" *ngIf="email.errors.minlength"
|
||||
jhiTranslate="global.messages.validate.email.minlength">
|
||||
Your email is required to be at least 5 characters.
|
||||
</small>
|
||||
<small class="form-text text-danger" *ngIf="email.errors.maxlength"
|
||||
jhiTranslate="global.messages.validate.email.maxlength">
|
||||
Your email cannot be longer than 100 characters.
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="password" jhiTranslate="global.form.newpassword">New password</label>
|
||||
<input type="password" class="form-control" id="password" name="password" #password="ngModel" placeholder="{{'global.form.newpassword.placeholder' | translate}}"
|
||||
[(ngModel)]="registerAccount.password" minlength=4 maxlength=50 required>
|
||||
<div *ngIf="password.dirty && password.invalid">
|
||||
<small class="form-text text-danger" *ngIf="password.errors.required"
|
||||
jhiTranslate="global.messages.validate.newpassword.required">
|
||||
Your password is required.
|
||||
</small>
|
||||
<small class="form-text text-danger" *ngIf="password.errors.minlength"
|
||||
jhiTranslate="global.messages.validate.newpassword.minlength">
|
||||
Your password is required to be at least 4 characters.
|
||||
</small>
|
||||
<small class="form-text text-danger" *ngIf="password.errors.maxlength"
|
||||
jhiTranslate="global.messages.validate.newpassword.maxlength">
|
||||
Your password cannot be longer than 50 characters.
|
||||
</small>
|
||||
</div>
|
||||
<jhi-password-strength-bar [passwordToCheck]="registerAccount.password"></jhi-password-strength-bar>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="confirmPassword" jhiTranslate="global.form.confirmpassword">New password confirmation</label>
|
||||
<input type="password" class="form-control" id="confirmPassword" name="confirmPassword" #confirmPasswordInput="ngModel" placeholder="{{'global.form.confirmpassword.placeholder' | translate}}"
|
||||
[(ngModel)]="confirmPassword" minlength=4 maxlength=50 required>
|
||||
<div *ngIf="confirmPasswordInput.dirty && confirmPasswordInput.invalid">
|
||||
<small class="form-text text-danger" *ngIf="confirmPasswordInput.errors.required"
|
||||
jhiTranslate="global.messages.validate.confirmpassword.required">
|
||||
Your confirmation password is required.
|
||||
</small>
|
||||
<small class="form-text text-danger" *ngIf="confirmPasswordInput.errors.minlength"
|
||||
jhiTranslate="global.messages.validate.confirmpassword.minlength">
|
||||
Your confirmation password is required to be at least 4 characters.
|
||||
</small>
|
||||
<small class="form-text text-danger" *ngIf="confirmPasswordInput.errors.maxlength"
|
||||
jhiTranslate="global.messages.validate.confirmpassword.maxlength">
|
||||
Your confirmation password cannot be longer than 50 characters.
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button type="submit" [disabled]="registerForm.form.invalid" class="btn btn-primary" jhiTranslate="register.form.button">Register</button>
|
||||
</form>
|
||||
<p></p>
|
||||
<div class="alert alert-warning">
|
||||
<span jhiTranslate="global.messages.info.authenticated.prefix">If you want to </span>
|
||||
<a class="alert-link" (click)="openLogin()" jhiTranslate="global.messages.info.authenticated.link">sign in</a><span jhiTranslate="global.messages.info.authenticated.suffix">, you can try the default accounts:<br/>- Administrator (login="admin" and password="admin") <br/>- User (login="user" and password="user").</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
75
src/main/webapp/app/account/register/register.component.ts
Normal file
75
src/main/webapp/app/account/register/register.component.ts
Normal file
@ -0,0 +1,75 @@
|
||||
import { Component, OnInit, AfterViewInit, Renderer, ElementRef } from '@angular/core';
|
||||
import { HttpErrorResponse } from '@angular/common/http';
|
||||
import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
|
||||
import { JhiLanguageService } from 'ng-jhipster';
|
||||
|
||||
import { EMAIL_ALREADY_USED_TYPE, LOGIN_ALREADY_USED_TYPE } from 'app/shared';
|
||||
import { LoginModalService } from 'app/core';
|
||||
import { Register } from './register.service';
|
||||
|
||||
@Component({
|
||||
selector: 'jhi-register',
|
||||
templateUrl: './register.component.html'
|
||||
})
|
||||
export class RegisterComponent implements OnInit, AfterViewInit {
|
||||
confirmPassword: string;
|
||||
doNotMatch: string;
|
||||
error: string;
|
||||
errorEmailExists: string;
|
||||
errorUserExists: string;
|
||||
registerAccount: any;
|
||||
success: boolean;
|
||||
modalRef: NgbModalRef;
|
||||
|
||||
constructor(
|
||||
private languageService: JhiLanguageService,
|
||||
private loginModalService: LoginModalService,
|
||||
private registerService: Register,
|
||||
private elementRef: ElementRef,
|
||||
private renderer: Renderer
|
||||
) {}
|
||||
|
||||
ngOnInit() {
|
||||
this.success = false;
|
||||
this.registerAccount = {};
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
this.renderer.invokeElementMethod(this.elementRef.nativeElement.querySelector('#login'), 'focus', []);
|
||||
}
|
||||
|
||||
register() {
|
||||
if (this.registerAccount.password !== this.confirmPassword) {
|
||||
this.doNotMatch = 'ERROR';
|
||||
} else {
|
||||
this.doNotMatch = null;
|
||||
this.error = null;
|
||||
this.errorUserExists = null;
|
||||
this.errorEmailExists = null;
|
||||
this.languageService.getCurrent().then(key => {
|
||||
this.registerAccount.langKey = key;
|
||||
this.registerService.save(this.registerAccount).subscribe(
|
||||
() => {
|
||||
this.success = true;
|
||||
},
|
||||
response => this.processError(response)
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
openLogin() {
|
||||
this.modalRef = this.loginModalService.open();
|
||||
}
|
||||
|
||||
private processError(response: HttpErrorResponse) {
|
||||
this.success = null;
|
||||
if (response.status === 400 && response.error.type === LOGIN_ALREADY_USED_TYPE) {
|
||||
this.errorUserExists = 'ERROR';
|
||||
} else if (response.status === 400 && response.error.type === EMAIL_ALREADY_USED_TYPE) {
|
||||
this.errorEmailExists = 'ERROR';
|
||||
} else {
|
||||
this.error = 'ERROR';
|
||||
}
|
||||
}
|
||||
}
|
||||
12
src/main/webapp/app/account/register/register.route.ts
Normal file
12
src/main/webapp/app/account/register/register.route.ts
Normal file
@ -0,0 +1,12 @@
|
||||
import { Route } from '@angular/router';
|
||||
|
||||
import { RegisterComponent } from './register.component';
|
||||
|
||||
export const registerRoute: Route = {
|
||||
path: 'register',
|
||||
component: RegisterComponent,
|
||||
data: {
|
||||
authorities: [],
|
||||
pageTitle: 'register.title'
|
||||
}
|
||||
};
|
||||
14
src/main/webapp/app/account/register/register.service.ts
Normal file
14
src/main/webapp/app/account/register/register.service.ts
Normal file
@ -0,0 +1,14 @@
|
||||
import { Injectable } from '@angular/core';
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { Observable } from 'rxjs';
|
||||
|
||||
import { SERVER_API_URL } from 'app/app.constants';
|
||||
|
||||
@Injectable({ providedIn: 'root' })
|
||||
export class Register {
|
||||
constructor(private http: HttpClient) {}
|
||||
|
||||
save(account: any): Observable<any> {
|
||||
return this.http.post(SERVER_API_URL + 'api/register', account);
|
||||
}
|
||||
}
|
||||
86
src/main/webapp/app/account/settings/settings.component.html
Normal file
86
src/main/webapp/app/account/settings/settings.component.html
Normal file
@ -0,0 +1,86 @@
|
||||
<div>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-8">
|
||||
<h2 jhiTranslate="settings.title" [translateValues]="{username: settingsAccount.login}" *ngIf="settingsAccount">User settings for [<b>{{settingsAccount.login}}</b>]</h2>
|
||||
|
||||
<div class="alert alert-success" *ngIf="success" jhiTranslate="settings.messages.success">
|
||||
<strong>Settings saved!</strong>
|
||||
</div>
|
||||
|
||||
<jhi-alert-error></jhi-alert-error>
|
||||
|
||||
<form name="form" role="form" (ngSubmit)="save()" #settingsForm="ngForm" *ngIf="settingsAccount" novalidate>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="firstName" jhiTranslate="settings.form.firstname">First Name</label>
|
||||
<input type="text" class="form-control" id="firstName" name="firstName" placeholder="{{'settings.form.firstname.placeholder' | translate}}"
|
||||
[(ngModel)]="settingsAccount.firstName" minlength=1 maxlength=50 #firstNameInput="ngModel" required>
|
||||
<div *ngIf="firstNameInput.dirty && firstNameInput.invalid">
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="firstNameInput.errors.required" jhiTranslate="settings.messages.validate.firstname.required">
|
||||
Your first name is required.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="firstNameInput.errors.minlength" jhiTranslate="settings.messages.validate.firstname.minlength">
|
||||
Your first name is required to be at least 1 character.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="firstNameInput.errors.maxlength" jhiTranslate="settings.messages.validate.firstname.maxlength">
|
||||
Your first name cannot be longer than 50 characters.
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="lastName" jhiTranslate="settings.form.lastname">Last Name</label>
|
||||
<input type="text" class="form-control" id="lastName" name="lastName" placeholder="{{'settings.form.lastname.placeholder' | translate}}"
|
||||
[(ngModel)]="settingsAccount.lastName" minlength=1 maxlength=50 #lastNameInput="ngModel" required>
|
||||
<div *ngIf="lastNameInput.dirty && lastNameInput.invalid">
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="lastNameInput.errors.required" jhiTranslate="settings.messages.validate.lastname.required">
|
||||
Your last name is required.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="lastNameInput.errors.minlength" jhiTranslate="settings.messages.validate.lastname.minlength">
|
||||
Your last name is required to be at least 1 character.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="lastNameInput.errors.maxlength" jhiTranslate="settings.messages.validate.lastname.maxlength">
|
||||
Your last name cannot be longer than 50 characters.
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="email" jhiTranslate="global.form.email">Email</label>
|
||||
<input type="email" class="form-control" id="email" name="email" placeholder="{{'global.form.email.placeholder' | translate}}"
|
||||
[(ngModel)]="settingsAccount.email" minlength="5" maxlength="254" #emailInput="ngModel" email required>
|
||||
<div *ngIf="emailInput.dirty && emailInput.invalid">
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="emailInput.errors.required" jhiTranslate="global.messages.validate.email.required">
|
||||
Your email is required.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="emailInput.errors.email" jhiTranslate="global.messages.validate.email.invalid">
|
||||
Your email is invalid.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="emailInput.errors.minlength" jhiTranslate="global.messages.validate.email.minlength">
|
||||
Your email is required to be at least 5 characters.
|
||||
</small>
|
||||
<small class="form-text text-danger"
|
||||
*ngIf="emailInput.errors.maxlength" jhiTranslate="global.messages.validate.email.maxlength">
|
||||
Your email cannot be longer than 100 characters.
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group" *ngIf="languages && languages.length > 0">
|
||||
<label for="langKey" jhiTranslate="settings.form.language">Language</label>
|
||||
<select class="form-control" id="langKey" name="langKey" [(ngModel)]="settingsAccount.langKey">
|
||||
<option *ngFor="let language of languages" [value]="language">{{language | findLanguageFromKey}}</option>
|
||||
</select>
|
||||
</div>
|
||||
<button type="submit" [disabled]="settingsForm.form.invalid" class="btn btn-primary" jhiTranslate="settings.form.button">Save</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
63
src/main/webapp/app/account/settings/settings.component.ts
Normal file
63
src/main/webapp/app/account/settings/settings.component.ts
Normal file
@ -0,0 +1,63 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { JhiLanguageService } from 'ng-jhipster';
|
||||
|
||||
import { AccountService, JhiLanguageHelper } from 'app/core';
|
||||
|
||||
@Component({
|
||||
selector: 'jhi-settings',
|
||||
templateUrl: './settings.component.html'
|
||||
})
|
||||
export class SettingsComponent implements OnInit {
|
||||
error: string;
|
||||
success: string;
|
||||
settingsAccount: any;
|
||||
languages: any[];
|
||||
|
||||
constructor(
|
||||
private accountService: AccountService,
|
||||
private languageService: JhiLanguageService,
|
||||
private languageHelper: JhiLanguageHelper
|
||||
) {}
|
||||
|
||||
ngOnInit() {
|
||||
this.accountService.identity().then(account => {
|
||||
this.settingsAccount = this.copyAccount(account);
|
||||
});
|
||||
this.languageHelper.getAll().then(languages => {
|
||||
this.languages = languages;
|
||||
});
|
||||
}
|
||||
|
||||
save() {
|
||||
this.accountService.save(this.settingsAccount).subscribe(
|
||||
() => {
|
||||
this.error = null;
|
||||
this.success = 'OK';
|
||||
this.accountService.identity(true).then(account => {
|
||||
this.settingsAccount = this.copyAccount(account);
|
||||
});
|
||||
this.languageService.getCurrent().then(current => {
|
||||
if (this.settingsAccount.langKey !== current) {
|
||||
this.languageService.changeLanguage(this.settingsAccount.langKey);
|
||||
}
|
||||
});
|
||||
},
|
||||
() => {
|
||||
this.success = null;
|
||||
this.error = 'ERROR';
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
copyAccount(account) {
|
||||
return {
|
||||
activated: account.activated,
|
||||
email: account.email,
|
||||
firstName: account.firstName,
|
||||
langKey: account.langKey,
|
||||
lastName: account.lastName,
|
||||
login: account.login,
|
||||
imageUrl: account.imageUrl
|
||||
};
|
||||
}
|
||||
}
|
||||
14
src/main/webapp/app/account/settings/settings.route.ts
Normal file
14
src/main/webapp/app/account/settings/settings.route.ts
Normal file
@ -0,0 +1,14 @@
|
||||
import { Route } from '@angular/router';
|
||||
|
||||
import { UserRouteAccessService } from 'app/core';
|
||||
import { SettingsComponent } from './settings.component';
|
||||
|
||||
export const settingsRoute: Route = {
|
||||
path: 'settings',
|
||||
component: SettingsComponent,
|
||||
data: {
|
||||
authorities: ['ROLE_USER'],
|
||||
pageTitle: 'global.menu.account.settings'
|
||||
},
|
||||
canActivate: [UserRouteAccessService]
|
||||
};
|
||||
Reference in New Issue
Block a user