UNOV/mycontrolpanel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

CP #2 S'inscrire, modifier profil et supprimer profil + Notifications service

Browse Source
This commit is contained in:
ThomasFransolet 2019-08-18 15:11:42 +02:00
parent 61f2d867e4
commit 6adeb65a44
17 changed files with 648 additions and 139 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/app/_api/models/user-info.ts
View File

@ -2,7 +2,7 @@
import { ScreenConfiguration } from './screen-configuration';
import { Device } from './device';
export interface UserInfo {
address?: string;
dateCreation?: string;
id?: string;
email?: string;
password?: string;
@ -11,6 +11,7 @@ export interface UserInfo {
token?: string;
birthday?: string;
role?: string;
address?: string;
city?: string;
state?: string;
language?: string;

72
src/app/_api/services/user.service.ts
View File

@ -13,8 +13,10 @@ import { UserInfo } from '../models/user-info';
})
class UserService extends __BaseService {
static readonly GetPath = '/api/user';
static readonly UpdateUserPath = '/api/user';
static readonly CreateUserPath = '/api/user';
static readonly Get_1Path = '/api/user/{id}';
static readonly DeleteUserPath = '/api/user/{id}';
constructor(
config: __Configuration,
@ -56,6 +58,42 @@ class UserService extends __BaseService {
);
}
/**
* @param updatedUser undefined
* @return Success
*/
UpdateUserResponse(updatedUser?: UserInfo): __Observable<__StrictHttpResponse<UserInfo>> {
let __params = this.newParams();
let __headers = new HttpHeaders();
let __body: any = null;
__body = updatedUser;
let req = new HttpRequest<any>(
'PUT',
this.rootUrl + `/api/user`,
__body,
{
headers: __headers,
params: __params,
responseType: 'json'
});
return this.http.request<any>(req).pipe(
__filter(_r => _r instanceof HttpResponse),
__map((_r) => {
return _r as __StrictHttpResponse<UserInfo>;
})
);
}
/**
* @param updatedUser undefined
* @return Success
*/
UpdateUser(updatedUser?: UserInfo): __Observable<UserInfo> {
return this.UpdateUserResponse(updatedUser).pipe(
__map(_r => _r.body as UserInfo)
);
}
/**
* @param newUser undefined
* @return Success
@ -127,6 +165,40 @@ class UserService extends __BaseService {
__map(_r => _r.body as UserInfo)
);
}
/**
* @param id undefined
*/
DeleteUserResponse(id: string): __Observable<__StrictHttpResponse<null>> {
let __params = this.newParams();
let __headers = new HttpHeaders();
let __body: any = null;
let req = new HttpRequest<any>(
'DELETE',
this.rootUrl + `/api/user/${id}`,
__body,
{
headers: __headers,
params: __params,
responseType: 'json'
});
return this.http.request<any>(req).pipe(
__filter(_r => _r instanceof HttpResponse),
__map((_r) => {
return _r as __StrictHttpResponse<null>;
})
);
}
/**
* @param id undefined
*/
DeleteUser(id: string): __Observable<null> {
return this.DeleteUserResponse(id).pipe(
__map(_r => _r.body as null)
);
}
}
module UserService {

13
src/app/_services/app.service.ts
View File

@ -1,7 +1,8 @@
import { Injectable } from '@angular/core';
import { Injectable, EventEmitter } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';
import { BooksService } from '../_api/services/books.service';
import { DatePipe } from '@angular/common';
@Injectable({
@ -14,8 +15,18 @@ export class AppService {
private _bookService: BooksService
) { }
OpenSignInModal = new EventEmitter<boolean>();
public ConnectionTest(): Observable<any> {
return this._bookService.Get();
}
FormatDate(iDate: Date) {
const inputDate = new Date(iDate);
const formattedDate = inputDate.getFullYear() + '-' + (inputDate.getMonth() + 1) + '-' + inputDate.getDate();
const datePipe = new DatePipe('en');
return datePipe.transform(formattedDate, 'yyyy-MM-dd');
}
}

23
src/app/_services/notifications.service.ts Normal file
View File

@ -0,0 +1,23 @@
import { Injectable, EventEmitter, Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';
import { BooksService } from '../_api/services/books.service';
import { DatePipe } from '@angular/common';
import { MessageService } from 'primeng/api';
@Injectable({
providedIn: 'root'
})
export class NotificationsService {
constructor(
private messageService: MessageService
) { }
addMessage(severity, summary, detail) {
console.log('hello from notifications', severity, summary, detail);
this.messageService.add({severity: severity, summary: summary, detail: detail});
}
}

115
src/app/app.component.html
View File

@ -1,126 +1,97 @@
<p-toolbar id="Mytoolbar">
<!-- TOOLBAR -->
<p-toolbar>
<div class="ui-toolbar-group-left">
<img src="../assets/images/home-page/logoNew.png" class="img-rounded img-responsive" alt="MyMirror" (click)="GoHome()">
</div>
<div class="ui-toolbar-group-right">
<button pButton type="button" label="ABOUT"></button>
<button pButton type="button" label="TEAM" ></button>
<button pButton type="button" label="CONTACT" ></button>
<button *ngIf="!Connected" pButton type="button" label="SIGN UP" icon="pi pi-pencil" iconPos="right" (click)="SignUp()"></button>
<button *ngIf="!Connected" pButton type="button" label="LOG IN" icon="pi pi-sign-in" iconPos="right" (click)="DisplayLoginModal = true"></button>
<p-splitButton *ngIf="Connected" class="btnDeMerde" type="button" [label]="ConnectedUser.firstName" [model]="itemsUserDropDown"></p-splitButton>
<button pButton type="button" [label]="LabelHeaderAbout"></button>
<button pButton type="button" [label]="LabelHeaderTeam" ></button>
<button pButton type="button" [label]="LabelHeaderContact" ></button>
<button *ngIf="!Connected" pButton type="button" label="{{LabelHeaderSignIn}}" icon="pi pi-pencil" iconPos="right" (click)="SignUp()"></button>
<button *ngIf="!Connected" pButton type="button" label="{{LabelHeaderLogIn}}" icon="pi pi-sign-in" iconPos="right" (click)="DisplayLoginModal = true"></button>
<p-splitButton *ngIf="Connected" type="button" [label]="ConnectedUser.firstName" [model]="itemsUserDropDown"></p-splitButton>
</div>
</p-toolbar>
<!-- END TOOLBAR -->
<p-dialog id="modalLogIn" [modal]=true [(visible)]="DisplayLoginModal">
<router-outlet></router-outlet>
<!-- LOGIN DIALOG -->
<p-dialog id="modalLogIn" [modal]=true [(visible)]="DisplayLoginModal" [responsive]="true" (onHide)="ResetLogInModal()">
<p-header translate>
App.Home.Login
App.Home.Login.Label
</p-header>
<div class="ui-inputgroup">
<div class="ui-inputgroup" style="width:50%; margin: 0px 40px">
<span class="ui-inputgroup-addon"><i class="fa fa-user"></i></span>
<input type="text" [(ngModel)]="Email" pInputText placeholder="Email" >
<input type="text" [(ngModel)]="Email" pInputText [placeholder]="LabelFormEmail" >
</div>
<div class="ui-inputgroup">
<div class="ui-inputgroup" style="width:50%; margin: 0px 40px">
<span class="ui-inputgroup-addon"><i class="fa fa-lock"></i></span>
<input type="password" [(ngModel)]="Password" pInputText placeholder="Password" >
<input type="password" [(ngModel)]="Password" pInputText [placeholder]="LabelFormPassword" >
</div>
<div class="ui-inputgroup" *ngIf="ErrorTextLogin.trim() != ''">
<label style="color: red">{{ErrorTextLogin}}</label>
</div>
<p-footer>
<button pButton type="button" label="Identify" (click)="LogIn()"></button>
<button pButton type="button" [label]="LabelLoginIdentify" (click)="LogIn(this.Email, this.Password)"></button>
</p-footer>
</p-dialog>
<p-dialog [style]="{'width': '450px'}" [modal]=true id="modalSignIn"[(visible)]="DisplaySignInModal">
<p-header>
Sign In
<!-- END LOGIN DIALOG -->
<!-- SIGN IN DIALOG -->
<p-dialog [style]="{'width': '450px'}" [modal]=true id="modalSignIn" [(visible)]="DisplaySignInModal" (onHide)="ResetSignInModal()">
<p-header translate>
App.Home.SignIn.Label
</p-header>
<div class="ui-inputgroup">
<div>
<span class="ui-inputgroup-addon"><i class="fa fa-user"></i></span>
<input type="text" [(ngModel)]="CreateUser.lastName" pInputText placeholder="Last name">
<input type="text" [(ngModel)]="CreateUser.firstName" pInputText [placeholder]="LabelFormFirstName">
</div>
</div>
<div class="ui-inputgroup">
<div>
<span class="ui-inputgroup-addon"><i class="fa fa-user"></i></span>
<input type="text" [(ngModel)]="CreateUser.firstName" pInputText placeholder="First name">
<input type="text" [(ngModel)]="CreateUser.lastName" pInputText [placeholder]="LabelFormLastName">
</div>
</div>
<div class="ui-inputgroup" *ngIf="Connected">
<div>
<span class="ui-inputgroup-addon"><i class="fas fa-gift"></i></span>
<input type="date" pInputText placeholder="Birthday">
</div>
</div>
<div class="ui-inputgroup">
<div>
<span class="ui-inputgroup-addon"><i class="fas fa-at"></i></span>
<input type="email" [(ngModel)]="CreateUser.email" pInputText placeholder="E-mail">
</div>
</div>
<div class="ui-inputgroup" *ngIf="Connected">
<div>
<span class="ui-inputgroup-addon"><i class="fa fa-home"></i></span>
<input type="text" pInputText placeholder="Address">
</div>
</div>
<div class="ui-inputgroup" *ngIf="Connected">
<div>
<span class="ui-inputgroup-addon"><i class="fa fa-home"></i></span>
<input type="text" pInputText placeholder="City">
</div>
</div>
<div class="ui-inputgroup" *ngIf="Connected">
<div>
<span class="ui-inputgroup-addon"><i class="fa fa-home"></i></span>
<input type="text" pInputText placeholder="State">
</div>
</div>
<div class="ui-inputgroup" *ngIf="Connected">
<div>
<span class="ui-inputgroup-addon"><i class="fa fa-home"></i></span>
<input type="text" pInputText placeholder="Postcode">
</div>
</div>
<div class="ui-inputgroup" *ngIf="Connected">
<div>
<span class="ui-inputgroup-addon"><i class="fas fa-globe-europe"></i></span>
<input type="text" pInputText placeholder="Country">
</div>
</div>
<div class="ui-inputgroup" *ngIf="Connected">
<div>
<span class="ui-inputgroup-addon"><i class="fas fa-globe-europe"></i></span>
<input type="text" pInputText placeholder="Timezone">
<input type="email" [(ngModel)]="CreateUser.email" pInputText [placeholder]="LabelFormEmail">
</div>
</div>
<div class="ui-inputgroup">
<div>
<span class="ui-inputgroup-addon"><i class="fas fa-key"></i></span>
<input type="password" [(ngModel)]="CreateUser.password" pInputText placeholder="Password">
<input type="password" [(ngModel)]="CreateUser.password" pInputText [placeholder]="LabelFormPassword">
</div>
</div>
<div class="ui-inputgroup">
<div>
<span class="ui-inputgroup-addon"><i class="fas fa-key"></i></span>
<!-- TO UPDATE TO CHECK-->
<input type="password" [(ngModel)]="CreateUser.password" pInputText placeholder="Confirm password">
<input type="password" [(ngModel)]="ConfirmPassword" pInputText [placeholder]="LabelFormConfirmPassword">
</div>
</div>
<div style="text-align: center">
<label *ngIf="ErrorTextSignIn.trim() != ''" style="color: red">{{ErrorTextSignIn}}</label>
</div>
<p-footer>
<button pButton type="button" label="Create profile" (click)="CreateProfile()"></button>
<button pButton type="button" [label]="LabelSignInCreateProfile" (click)="CreateProfile()"></button>
</p-footer>
</p-dialog>
<!-- END SIGN IN DIALOG -->
<router-outlet></router-outlet>
<!-- TOAST MESSAGES-->
<p-toast></p-toast>

180
src/app/app.component.ts
View File

@ -4,9 +4,10 @@ import { AppService } from './_services/app.service';
import { TranslateService } from '@ngx-translate/core';
import { AuthenticationService } from './_services/authentication.service';
import { Router } from '@angular/router';
import { first } from 'rxjs/operators';
import { first, catchError } from 'rxjs/operators';
import { UserInfo } from './_api/models';
import { UserService } from './_api/services';
import { throwError } from 'rxjs';
@Component({
@ -29,13 +30,35 @@ export class AppComponent implements OnInit {
// Login
public Email: string = null;
public Password: string = null;
public birthday: Date;
public ErrorTextLogin = '';
public CreateUser: UserInfo = {};
public ConfirmPassword: string;
public UserTryingToLogin: UserInfo = {};
// Label
// Sign in
public ErrorTextSignIn = '';
// Form Label
public LabelFormLastName: string;
public LabelFormFirstName: string;
public LabelFormEmail: string;
public LabelFormPassword: string;
public LabelFormConfirmPassword: string;
public LabelFormCreate: string;
// Labels
// Headers
public LabelHeaderLogIn: string;
public LabelHeaderSignIn: string;
public LabelHeaderAbout: string;
public LabelHeaderTeam: string;
public LabelHeaderContact: string;
// LogIn
public LabelLoginIdentify: string;
// SignIn
public LabelSignInCreateProfile: string;
// DropDown
public LabelDropDownLogout: string;
public LabelDropDownModifyUser: string;
@ -52,13 +75,23 @@ export class AppComponent implements OnInit {
// To Include in a fonction of a dropdown language chose
this._translateService.setDefaultLang('en');
this.InitLabels();
this._appService.OpenSignInModal.subscribe(
value => {
if (value) {
this.DisplaySignInModal = true;
}
}
);
// To test
this._translateService.get('App.Home.UserDropDown.ModifyUser').subscribe(modifyLabel => {
this._translateService.get('App.Home.UserDropDown.Logout').subscribe(logoutLabel => {
this.itemsUserDropDown = [
{label: modifyLabel, icon: 'fa fa-edit', command: () => {
// route get param => navigate vers profile
this._router.navigate(['/profile/01']);
this._router.navigate(['/profile/' + this.ConnectedUser.id + '/edit']);
}},
{label: logoutLabel, icon: 'fa fa-sign-out', command: () => {
this.Logout();
@ -68,7 +101,7 @@ export class AppComponent implements OnInit {
});
const currentUser = this._authService.currentUserValue;
console.log(currentUser);
console.log('currentUser', currentUser);
if (currentUser && currentUser.token) {
this.ConnectedUser = currentUser;
@ -81,23 +114,9 @@ export class AppComponent implements OnInit {
}
public LogIn() {
/*this._appService.GetToken(this.Username, this.Password)
.subscribe(res => {
console.log(res.Token);
this.Connected = true;
this.DisplayLoginModal = false;
this.Username = null;
this.Password = null;
this._authService.IsLoggedIn = true;
this._router.navigate(['/profile/01']);
}, () => {
console.log('ERROR');
});*/
this.UserTryingToLogin.email = this.Email;
this.UserTryingToLogin.password = this.Password;
public LogIn(email, password) {
this.UserTryingToLogin.email = email;
this.UserTryingToLogin.password = password;
this._authService.Login(this.UserTryingToLogin)
.pipe(first())
.subscribe(
@ -109,10 +128,13 @@ export class AppComponent implements OnInit {
this.Email = null;
this.Password = null;
this._authService.IsLoggedIn = true;
this._router.navigate(['/profile/01']);
this._router.navigate(['/profile/' + this.ConnectedUser.id]);
this.ErrorTextLogin = '';
},
error => {
console.log('ERROR');
this._translateService.get('App.Home.Login.ErrorText').subscribe(loginErrorText => {
this.ErrorTextLogin = loginErrorText;
});
});
// change route -> /config view
@ -136,25 +158,111 @@ export class AppComponent implements OnInit {
}
public CreateProfile() {
// ADD FIELDS VERIFICATION
console.log('GHelfoudlkfhj');
if (this.CorrectForm()) {
this.CreateUser.deviceIds = [];
this._userService.CreateUser(this.CreateUser)
.subscribe(
data => {
// TO CHANGE
console.log(data);
this.ConnectedUser = data;
this.Connected = true;
this.DisplayLoginModal = false;
this.Email = null;
this.Password = null;
this._authService.IsLoggedIn = true;
// this._router.navigate(['/profile/01']);
this.ErrorTextSignIn = '';
this.UserTryingToLogin.email = data.email;
this.UserTryingToLogin.password = data.password;
this.DisplaySignInModal = false;
/*this.ConnectedUser = data;
this.Connected = true;*/
this.LogIn(data.email, data.password);
},
error => {
console.log('ERROR');
if (error !== null && error === 'Conflict') {
this._translateService.get('App.Home.SignIn.ErrorAlreadyExist').subscribe(text => {
this.ErrorTextSignIn = text;
});
} else {
this._translateService.get('App.Home.SignIn.ErrorUnknown').subscribe(text => {
this.ErrorTextSignIn = text;
});
}
});
}
}
public CorrectForm(): boolean {
if (this.CreateUser.firstName == null || this.CreateUser.lastName == null ||
this.CreateUser.email == null || this.CreateUser.password == null) {
this._translateService.get('App.Home.SignIn.ErrorFieldsMissing').subscribe(text => {
this.ErrorTextSignIn = text;
});
return false;
}
if (this.ConfirmPassword !== this.CreateUser.password) {
this._translateService.get('App.Home.SignIn.ErrorConfirmPassword').subscribe(text => {
this.ErrorTextSignIn = text;
});
return false;
}
this.ErrorTextSignIn = '';
return true;
}
public ResetLogInModal() {
this.ErrorTextLogin = '';
this.Email = '';
this.Password = '';
}
public ResetSignInModal() {
this.ErrorTextSignIn = '';
this.CreateUser = {};
this.ConfirmPassword = '';
}
public InitLabels() {
// HEADERS
this._translateService.get('App.Home.Login.Header').subscribe(label => {
this.LabelHeaderLogIn = label;
});
this._translateService.get('App.Home.SignIn.Header').subscribe(label => {
this.LabelHeaderSignIn = label;
});
this._translateService.get('App.Home.About.Header').subscribe(label => {
this.LabelHeaderAbout = label;
});
this._translateService.get('App.Home.Team.Header').subscribe(label => {
this.LabelHeaderTeam = label;
});
this._translateService.get('App.Home.Contact.Header').subscribe(label => {
this.LabelHeaderContact = label;
});
// LOGIN
this._translateService.get('App.Home.Login.Identify').subscribe(label => {
this.LabelLoginIdentify = label;
});
// SIGN IN
this._translateService.get('App.Home.SignIn.CreateProfile').subscribe(label => {
this.LabelSignInCreateProfile = label;
});
// FORM
this._translateService.get('App.Common.Form.LastName').subscribe(label => {
this.LabelFormLastName = label;
});
this._translateService.get('App.Common.Form.FirstName').subscribe(label => {
this.LabelFormFirstName = label;
});
this._translateService.get('App.Common.Form.Email').subscribe(label => {
this.LabelFormEmail = label;
});
this._translateService.get('App.Common.Form.Password').subscribe(label => {
this.LabelFormPassword = label;
});
this._translateService.get('App.Common.Form.ConfirmPassword').subscribe(label => {
this.LabelFormConfirmPassword = label;
});
this._translateService.get('App.Common.Form.Create').subscribe(label => {
this.LabelFormCreate = label;
});
}
}

9
src/app/app.module.ts
View File

@ -21,6 +21,8 @@ import { ApiConfiguration } from './_api/api-configuration';
import { AppService } from './_services/app.service';
import { FormsModule } from '@angular/forms';
import { CalendarModule } from 'primeng/calendar';
import { ConfirmDialogModule } from 'primeng/confirmdialog';
import { ConfirmationService, MessageService } from 'primeng/api';
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
@ -31,6 +33,8 @@ import { ProfileComponent } from './control-panel/profile/profile/profile.compon
import { EditProfileComponent } from './control-panel/profile/edit-profile/edit-profile.component';
import { JwtInterceptor } from './_helpers/jwt.interceptor';
import { ErrorInterceptor } from './_helpers/error.interceptor';
import { NotificationsService } from './_services/notifications.service';
import { ToastModule } from 'primeng/toast';
@ -80,6 +84,8 @@ export function HttpLoaderFactory(http: HttpClient) {
HttpClientModule,
FormsModule,
CalendarModule,
ConfirmDialogModule,
ToastModule,
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
@ -92,6 +98,9 @@ export function HttpLoaderFactory(http: HttpClient) {
INIT_API_CONFIGURATION,
AppService,
AuthenticationService,
ConfirmationService,
NotificationsService,
MessageService,
{ provide: HTTP_INTERCEPTORS, useClass: JwtInterceptor, multi: true },
{ provide: HTTP_INTERCEPTORS, useClass: ErrorInterceptor, multi: true },
],

2
src/app/control-panel/home/home.component.html
View File

@ -33,7 +33,7 @@
<alert type="info" style="text-align: center">
<h4 class="alert-heading">Still not registered?</h4>
<p>Sign in now to access to your configuration panel</p>
<button type="button" class="btn btn-primary btn-primary">
<button type="button" class="btn btn-primary btn-primary" (click)="OpenSignInModal()">
Sign in !
<i class="fas fa-pencil-alt"></i>
</button>

14
src/app/control-panel/home/home.component.ts
View File

@ -1,5 +1,6 @@
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router'
import { Component, OnInit, Output, EventEmitter } from '@angular/core';
import { Router } from '@angular/router';
import { AppService } from '../../_services/app.service';
@ -9,11 +10,16 @@ import { Router } from '@angular/router'
styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {
constructor() { }
@Output() someEvent = new EventEmitter<string>();
constructor(
private _appService: AppService) { }
ngOnInit() {
}
public OpenSignInModal() {
this.someEvent.next('someExample');
this._appService.OpenSignInModal.emit(true);
}
}

2
src/app/control-panel/profile/config/config.component.html
View File

@ -1,3 +1,3 @@
<p>
config works!
This is the config page. => Existing one.
</p>

9
src/app/control-panel/profile/edit-profile/edit-profile.component.css
View File

@ -0,0 +1,9 @@
.ui-inputgroup{
padding-top: 10px;
padding-bottom: 10px;
}
.middleOfPage{
width: 45%;
text-align: center;
}

105
src/app/control-panel/profile/edit-profile/edit-profile.component.html
View File

@ -1,3 +1,102 @@
<p>
edit-profile works!
</p>
<!-- THIS NEED TO BE UPDATED PROPERLY -->
<div class="blankSpace">
<br>
<br>
<br>
</div>
<div class="ui-g ui-fluid" style="justify-content: center">
<div class="ui-g-12 middleOfPage">
<div class="ui-inputgroup">
<span class="ui-inputgroup-addon"><i class="fa fa-user"></i></span>
<input type="text" [(ngModel)]="CurrentUser.firstName" pInputText [placeholder]="LabelFormFirstName">
</div>
</div>
<div class="ui-g-12 middleOfPage">
<div class="ui-inputgroup">
<span class="ui-inputgroup-addon"><i class="fa fa-user"></i></span>
<input type="text" [(ngModel)]="CurrentUser.lastName" pInputText [placeholder]="LabelFormLastName">
</div>
</div>
<div class="ui-g-12 middleOfPage">
<div class="ui-inputgroup">
<span class="ui-inputgroup-addon"><i class="fas fa-gift"></i></span>
<input type="date" [(ngModel)]="CurrentUser.birthday" dateFormat="dd/mm/yy" pInputText placeholder="Birthday">
</div>
</div>
<div class="ui-g-12 middleOfPage">
<div class="ui-inputgroup">
<span class="ui-inputgroup-addon"><i class="fas fa-at"></i></span>
<input type="email" [(ngModel)]="CurrentUser.email" pInputText [placeholder]="LabelFormEmail" [disabled]="true">
</div>
</div>
<div class="ui-g-12 middleOfPage">
<div class="ui-inputgroup">
<span class="ui-inputgroup-addon"><i class="fa fa-home"></i></span>
<input type="text" [(ngModel)]="CurrentUser.address" pInputText placeholder="Address">
</div>
</div>
<div class="ui-g-12 middleOfPage">
<div class="ui-inputgroup">
<span class="ui-inputgroup-addon"><i class="fa fa-home"></i></span>
<input type="text" [(ngModel)]="CurrentUser.city" pInputText placeholder="City">
</div>
</div>
<div class="ui-g-12 middleOfPage">
<div class="ui-inputgroup">
<span class="ui-inputgroup-addon"><i class="fa fa-home"></i></span>
<input type="text" [(ngModel)]="CurrentUser.state" pInputText placeholder="State">
</div>
</div>
<div class="ui-g-12 middleOfPage">
<div class="ui-inputgroup">
<span class="ui-inputgroup-addon"><i class="fa fa-home"></i></span>
<input type="number" [(ngModel)]="CurrentUser.postalCode" pInputText placeholder="Postcode">
</div>
</div>
<div class="ui-g-12 middleOfPage">
<div class="ui-inputgroup">
<span class="ui-inputgroup-addon"><i class="fas fa-globe-europe"></i></span>
<input type="text" [(ngModel)]="CurrentUser.country" pInputText placeholder="Country">
</div>
</div>
<div class="ui-g-12 middleOfPage">
<div class="ui-inputgroup">
<span class="ui-inputgroup-addon"><i class="fas fa-globe-europe"></i></span>
<input type="text" [(ngModel)]="CurrentUser.timezone" pInputText placeholder="Timezone">
</div>
</div>
<div class="ui-g-12 middleOfPage">
<div class="ui-inputgroup">
<span class="ui-inputgroup-addon"><i class="fas fa-key"></i></span>
<input type="password" [(ngModel)]="CurrentUser.password" pInputText [placeholder]="LabelFormPassword">
</div>
</div>
<div class="ui-g-12 middleOfPage">
<div class="ui-inputgroup">
<span class="ui-inputgroup-addon"><i class="fas fa-key"></i></span>
<input type="password" [(ngModel)]="ConfirmPassword" pInputText [placeholder]="LabelFormConfirmPassword">
</div>
</div>
<div style="text-align: center">
<label *ngIf="ErrorTextForm.trim() != ''" style="color: red">{{ErrorTextForm}}</label>
</div>
</div>
<div class="buttons pull-right">
<button type="button" class="btn btn-secondary" (click)="CancelChange()" style="margin-right:5px">
Cancel
<i class="fa fa-remove"></i>
</button>
<button type="button" class="btn btn-primary" (click)="SubmitChange()" style="margin-right:5px">
Submit
<i class="fa fa-send"></i>
</button>
</div>
<button type="button" class="btn btn-sm btn-danger" (click)="DeleteProfil()" style="margin-left:5px">
Delete Profile
<i class="fa fa-trash-o"></i>
</button>
<p-confirmDialog header="Confirmation" icon="pi pi-exclamation-triangle"></p-confirmDialog>

159
src/app/control-panel/profile/edit-profile/edit-profile.component.ts
View File

@ -1,4 +1,12 @@
import { Component, OnInit } from '@angular/core';
import { AppService } from '../../../_services/app.service';
import { TranslateService } from '@ngx-translate/core';
import { AuthenticationService } from '../../../_services/authentication.service';
import { UserService } from '../../../_api/services';
import { Router } from '@angular/router';
import { UserInfo } from '../../../_api/models';
import { ConfirmationService } from 'primeng/api';
import { NotificationsService } from '../../../_services/notifications.service';
@Component({
selector: 'app-edit-profile',
@ -7,9 +15,158 @@ import { Component, OnInit } from '@angular/core';
})
export class EditProfileComponent implements OnInit {
constructor() { }
public CurrentUser: UserInfo = {};
public ErrorTextForm = '';
public ConfirmPassword = '';
// Form Label
public LabelFormLastName: string;
public LabelFormFirstName: string;
public LabelFormEmail: string;
public LabelFormPassword: string;
public LabelFormConfirmPassword: string;
public LabelFormCreate: string;
constructor(
private _appService: AppService,
private _translateService: TranslateService,
private _authService: AuthenticationService,
private _userService: UserService,
private _notifications: NotificationsService,
private _confirmationService: ConfirmationService,
private _router: Router) { }
ngOnInit() {
this.LoadUser(this._authService.currentUserValue.id, false);
this.InitLabels();
}
public SubmitChange() {
if (this.CorrectForm()) {
this.CurrentUser.deviceIds = [];
this._userService.UpdateUser(this.CurrentUser)
.subscribe(
data => {
console.log('Update the user profile - success');
this.CurrentUser = data;
const newDate = new Date(this.CurrentUser.birthday);
this.CurrentUser.birthday = this._appService.FormatDate(newDate);
this.ErrorTextForm = '';
this._translateService.get('App.Common.Notifications.Update').subscribe(message => {
this._translateService.get('App.Profile.Edit.Notifications.ChangedSuccess').subscribe(detail => {
this._notifications.addMessage('success', message, detail);
});
});
},
error => {
if (error !== null && error === 'Conflict') {
this._translateService.get('App.Home.SignIn.ErrorAlreadyExist').subscribe(text => {
this.ErrorTextForm = text;
});
} else {
this._translateService.get('App.Home.SignIn.ErrorUnknown').subscribe(text => {
this.ErrorTextForm = text;
});
}
});
}
}
public CorrectForm(): boolean {
if (this.CurrentUser.firstName == null || this.CurrentUser.lastName == null ||
this.CurrentUser.email == null || this.CurrentUser.password == null) {
this._translateService.get('App.Home.SignIn.ErrorFieldsMissing').subscribe(text => {
this.ErrorTextForm = text;
});
return false;
}
if (this.ConfirmPassword !== this.CurrentUser.password) {
this._translateService.get('App.Home.SignIn.ErrorConfirmPassword').subscribe(text => {
this.ErrorTextForm = text;
});
return false;
}
this.ErrorTextForm = '';
return true;
}
public CancelChange() {
this.LoadUser(this._authService.currentUserValue.id, true);
}
public DeleteProfil() {
console.log('delete profil');
this._translateService.get('App.Common.Form.DeleteConfirm').subscribe(confirmMessage => {
this._translateService.get('App.Common.Yes').subscribe(yes => {
this._translateService.get('App.Common.No').subscribe(no => {
this._confirmationService.confirm({
message: confirmMessage,
acceptLabel: yes,
rejectLabel: no,
accept: () => {
this._userService.DeleteUser(this._authService.currentUserValue.id)
.subscribe(
data => {
this._authService.Logout();
this._authService.IsLoggedIn = false;
location.reload();
},
error => {
this._translateService.get('App.Home.SignIn.ErrorUnknown').subscribe(text => {
this.ErrorTextForm = text;
});
});
}
});
});
});
});
}
public LoadUser(id, cancelChange) {
this._userService.Get_1(id)
.subscribe(
data => {
console.log('Loading the user - success');
this.CurrentUser = data;
const newDate = new Date(this.CurrentUser.birthday);
this.CurrentUser.birthday = this._appService.FormatDate(newDate);
if (cancelChange) {
this._translateService.get('App.Common.Notifications.Update').subscribe(message => {
this._translateService.get('App.Profile.Edit.Notifications.CancelModification').subscribe(detail => {
this._notifications.addMessage('success', message, detail);
});
});
}
},
error => {
});
}
public InitLabels() {
// FORM
this._translateService.get('App.Common.Form.LastName').subscribe(label => {
this.LabelFormLastName = label;
});
this._translateService.get('App.Common.Form.FirstName').subscribe(label => {
this.LabelFormFirstName = label;
});
this._translateService.get('App.Common.Form.Email').subscribe(label => {
this.LabelFormEmail = label;
});
this._translateService.get('App.Common.Form.Password').subscribe(label => {
this.LabelFormPassword = label;
});
this._translateService.get('App.Common.Form.ConfirmPassword').subscribe(label => {
this.LabelFormConfirmPassword = label;
});
this._translateService.get('App.Common.Form.Create').subscribe(label => {
this.LabelFormCreate = label;
});
}
}

2
src/app/control-panel/profile/profile/profile.component.html
View File

@ -1,3 +1,3 @@
<p>
profile works!
This is your profile view => You can see all your devices (the availability, params?), all your playlists, and links to create new configuration
</p>

1
src/app/control-panel/profile/profile/profile.component.ts
View File

@ -21,7 +21,6 @@ export class ProfileComponent implements OnInit {
this._appService.ConnectionTest().subscribe(
res => {
console.log(res);
console.log('SUCCESS !!');
}, () => {
console.log('error in test');
}

46
src/assets/i18n/en.json
View File

@ -1,7 +1,30 @@
{
"App":{
"Home": {
"Login":"LOGIN",
"Login": {
"Header": "LOGIN",
"Label": "Login",
"ErrorText": "Wrong email and password combination",
"Identify": "Identify"
},
"SignIn": {
"Header": "SIGN IN",
"Label": "Sign In",
"ErrorAlreadyExist": "This email is already used",
"ErrorConfirmPassword": "The passwords don't match",
"ErrorFieldsMissing": "Please fill all the fields",
"ErrorUnknown": "Unknown error occurred",
"CreateProfile": "Create profile"
},
"About": {
"Header": "ABOUT"
},
"Team": {
"Header": "TEAM"
},
"Contact": {
"Header": "CONTACT"
},
"UserDropDown": {
"Logout": "Logout",
"ModifyUser": "Edit profile"
@ -11,6 +34,27 @@
},
"Profile": {
"Edit": {
"Notifications": {
"ChangedSuccess": "The user profile has been successfully updated",
"CancelModification": "The modifications has been cancelled"
}
}
},
"Common": {
"Ok": "Ok",
"Yes": "Yes",
"No": "No",
"Form": {
"LastName": "Last name",
"FirstName": "First name",
"Email": "Email",
"Password": "Password",
"ConfirmPassword": "Confirm password",
"Create": "Créer",
"DeleteConfirm": "Are you sure to delete this user?"
},
"Notifications": {
"Update": "Updated"
}
}
}

2
swagger.json
View File

File diff suppressed because one or more lines are too long