mohiit1502/bookstore-angular
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

latest

Browse Source
This commit is contained in:
Le Deng
2017-03-07 14:36:01 -05:00
parent 85e057f1ef
commit edd576cd08
10 changed files with 180 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
store-front/src/app/app.routing.ts
View File

@@ -6,6 +6,7 @@ import {Routes, RouterModule} from '@angular/router';
import {HomeComponent} from './components/home/home.component';
import {MyAccountComponent} from './components/my-account/my-account.component';
import {MyProfileComponent} from './components/my-profile/my-profile.component';
const appRoutes: Routes = [
@@ -21,6 +22,10 @@ const appRoutes: Routes = [
{
path: 'myAccount',
component: MyAccountComponent
},
{
path: 'myProfile',
component: MyProfileComponent
}
];

85
store-front/src/app/components/my-profile/my-profile.component.html
View File

@@ -1,3 +1,82 @@
<p>
my-profile works!
</p>
<div class="container">
<div class="row">
<div class="col-xs-8">
<h2 class="section-headline"><span>My Account</span></h2>
</div>
<div class="col-xs-4">
<img src="../../../assets/image/logo.png" class="img-responsive right" style="width:400px; z-index: 1;" />
</div>
<img class="img-responsive" src="../../../assets/image/wood.png" style="position: absolute;margin-top: 90px;z-index: -2;" />
</div>
<hr style="position: absolute; width:85%; height:6px; background-color: #333; z-index: -1; margin-top: -170px " />
<div class="row" style="margin-top: 30px;">
<div class="col-xs-3"></div>
<div class="col-xs-9">
<div class="panel-group">
<div class="panel panel-default panel-faq" style="border: none;">
<div class="panel-body" style="background-color: #ededed; margin-top: 20px;">
<md-tab-group>
<md-tab label="Edit">
<div style="margin-top:20px;">
<div class="alert alert-danger" *ngIf="incorrectPassword">
<strong>Incorrect Password!</strong> Please enter the correct password for the current user.
</div>
<div class="alert alert-success" *ngIf="updateSuccess">
<strong>Update Success!</strong>
</div>
<form (ngSubmit)="updateUserInfo" method="post">
<input type="hidden" name="id" [(ngModel)]="user.id" />
<div class="bg-info" *ngIf="updateUserInfo">User info updated.</div>
<div class="form-group">
<div class="row">
<div class="col-xs-6">
<label for="firstName">First Name</label>
<input type="text" class="form-control" id="firstName" name="firstName" [(ngModel)]="user.firstName" />
</div>
<div class="col-xs-6">
<label for="lastName">Last Name</label>
<input type="text" class="form-control" id="lastName" name="lastName" [(ngModel)]="user.lastName" />
</div>
</div>
</div>
<div class="form-group">
<label for="username">Username *</label>&nbsp;<span *ngIf="usernameExists" style="color:red;">Username already exists. Choose a different one.</span>
<input required="required" type="text" class="form-control" id="username" name="username" [(ngModel)]="user.username" />
</div>
<div class="form-group">
<label for="currentPassword">Current password</label>
<input type="password" class="form-control" id="currentPassword" name="password" [(ngModel)]="currentPassword" />
<p style="color: #828282;"> Enter your current password to change the E-mail address or Password.</p>
</div>
<div class="form-group">
<label for="email">E-mail Address *</label>&nbsp;<span *ngIf="emailExists" style="color:red;">Email already exists. Choose a different one.</span>
<input required="required" type="text" class="form-control" id="email" name="email" [(ngModel)]="user.email" />
<p style="color: #828282;"> A valid e-mail address. All e-mails from the system will be sent to this address. The e-mail address is not made public and will only be used if you wish to receive a new password or wish to receive certain news or notifications by e-mail.</p>
</div>
<div class="form-group">
<label for="txtNewPassword">Password</label>&nbsp;<span id="checkPasswordMatch" style="color:red;"></span>
<input type="password" class="form-control" id="txtNewPassword" name="newPassword" />
</div>
<div class="form-group">
<label for="txtConfirmPassword">Confirm Password</label>
<input type="password" class="form-control" id="txtConfirmPassword" />
<p style="color: #828282;"> To change the current user password, enter the new password in both fields.</p>
</div>
<button type="submit" class="btn btn-primary" id="updateUserInfoButton">Save
</button>
</form>
</div>
</md-tab>
<md-tab label="Orders">
</md-tab>
<md-tab label="Billing">
</md-tab>
<md-tab label="Shipping">
</md-tab>
</md-tab-group>
</div>
</div>
</div>
</div>
</div>
</div>

14
store-front/src/app/components/my-profile/my-profile.component.ts
View File

@@ -3,6 +3,7 @@ import {AppConst} from '../../constants/app-const';
import {Router} from "@angular/router";
import {LoginService} from "../../services/login.service";
import {UserService} from "../../services/user.service";
import {User} from '../../models/user';
@Component({
selector: 'app-my-profile',
@@ -26,6 +27,8 @@ export class MyProfileComponent implements OnInit {
private forgetPasswordEmailSent: boolean = false;
private recoverEmail:string;
private user: User = new User();
constructor (private loginService: LoginService, private userService: UserService, private router: Router){
}
@@ -91,4 +94,15 @@ export class MyProfileComponent implements OnInit {
}
);
this.userService.getCurrentUser().subscribe(
res => {
console.log(res.json());
this.user=res.json();
},
error => {
console.log(error);
}
);
}
}

1
store-front/src/app/components/nav-bar/nav-bar.component.html
View File

@@ -21,6 +21,7 @@
</li>
<li *ngIf="!loggedIn" ><a md-button routerLink="/myAccount" routerLinkActive="active">MY ACCOUNT</a></li>
<li *ngIf="loggedIn"><a md-button routerLink="/myProfile" routerLinkActive="active">MY PROFILE</a></li>
<li *ngIf="loggedIn"><a md-button (click)="logout()">LOGOUT</a></li>
</ul>
</div>

10
store-front/src/app/services/user.service.ts
View File

@@ -32,4 +32,14 @@ export class UserService {
});
return this.http.post(url, JSON.stringify(userInfo), {headers : tokenHeader});
}
getCurrentUser(){
let url = this.serverPath+"/user/getCurrentUser";
let tokenHeader = new Headers ({
'Content-Type': 'application/json',
'x-auth-token' : localStorage.getItem("xAuthToken")
});
return this.http.get(url, {headers : tokenHeader});
}
}