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-11 17:04:23 -05:00
parent d486eae6e9
commit 1c2bf36cd5
2 changed files with 461 additions and 446 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -9,8 +9,16 @@
<img class="img-responsive" src="../../../assets/image/wood.png" style="position: absolute;margin-top: 90px;z-index: -2;" /> <img class="img-responsive" src="../../../assets/image/wood.png" style="position: absolute;margin-top: 90px;z-index: -2;" />
</div> </div>
<hr style="position: absolute; width:85%; height:6px; background-color: #333; z-index: -1; margin-top: -170px " /> <hr style="position: absolute; width:85%; height:6px; background-color: #333; z-index: -1; margin-top: -170px " />
<div *ngIf="!dataFetched" style="margin-top: 50px;">
<div class="row">
<div class="col-md-2 col-md-offset-5">
<md-spinner></md-spinner>
</div>
</div>
</div>
<div class="row" style="margin-top: 30px;"> <div class="row" style="margin-top: 30px;">
<div class="col-xs-3"></div> <div class="col-xs-3"></div>
<div *ngIf="dataFetched">
<div class="col-xs-9"> <div class="col-xs-9">
<div class="panel-group"> <div class="panel-group">
<div class="panel panel-default panel-faq" style="border: none;"> <div class="panel panel-default panel-faq" style="border: none;">
@@ -70,7 +78,6 @@
<md-tab label="Orders"> <md-tab label="Orders">
<div class="panel-group"> <div class="panel-group">
<div class="panel panel-default panel-faq" style="border: none;"> <div class="panel panel-default panel-faq" style="border: none;">
<div class="panel-body" style="background-color: #ededed; margin-top: 20px;"> <div class="panel-body" style="background-color: #ededed; margin-top: 20px;">
<table class="table table-sm table-inverse"> <table class="table table-sm table-inverse">
<thead> <thead>
@@ -93,7 +100,6 @@
</tr> </tr>
</tbody> </tbody>
</table> </table>
<div *ngIf="displayOrderDetail"> <div *ngIf="displayOrderDetail">
<div class="row"> <div class="row">
<div class="col-xs-12"> <div class="col-xs-12">
@@ -107,11 +113,16 @@
<div class="panel-heading"><strong>Billing Details</strong> <div class="panel-heading"><strong>Billing Details</strong>
</div> </div>
<div class="panel-body"> <div class="panel-body">
<span>{{order.billingAddress.billingAddressName}}</span><br/> <span>{{order.billingAddress.billingAddressName}}</span>
<span>{{order.billingAddress.billingAddressStreet1}} {{order.billingAddress.billingAddressStreet2}}</span><br/> <br/>
<span>{{order.billingAddress.billingAddressCity}}</span><br/> <span>{{order.billingAddress.billingAddressStreet1}} {{order.billingAddress.billingAddressStreet2}}</span>
<span>{{order.billingAddress.billingAddressState}}</span><br/> <br/>
<span>{{order.billingAddress.billingAddressZipcode}}</span><br/> <span>{{order.billingAddress.billingAddressCity}}</span>
<br/>
<span>{{order.billingAddress.billingAddressState}}</span>
<br/>
<span>{{order.billingAddress.billingAddressZipcode}}</span>
<br/>
</div> </div>
</div> </div>
</div> </div>
@@ -120,26 +131,31 @@
<div class="panel-heading"><strong>Payment Information</strong> <div class="panel-heading"><strong>Payment Information</strong>
</div> </div>
<div class="panel-body"> <div class="panel-body">
<span>{{order.payment.holderName}}</span><br/> <span>{{order.payment.holderName}}</span>
Visa<br/> <br/> Visa
<span>{{order.payment.cardNumber}}</span><br/> <br/>
<span>Exp Date:</span> <span <span>{{order.payment.cardNumber}}</span>
>{{order.payment.expiryMonth}}</span>/<span <br/>
>{{order.payment.expiryYear}}</span><br/> <span>Exp Date:</span> <span>{{order.payment.expiryMonth}}</span>/<span>{{order.payment.expiryYear}}</span>
<br/>
</div> </div>
</div> </div>
</div> </div>
<div class="col-xs-4"> <div class="col-xs-4">
<div class="panel panel-default height"> <div class="panel panel-default height">
<div class="panel-heading"><strong>Shipping Address</strong> <div class="panel-heading"><strong>Shipping Address</strong>
</div> </div>
<div class="panel-body"> <div class="panel-body">
<span>{{order.shippingAddress.shippingAddressName}}</span><br/> <span>{{order.shippingAddress.shippingAddressName}}</span>
<span>{{order.shippingAddress.shippingAddressStreet1}}' '{{order.shippingAddress.shippingAddressStreet2}}</span><br/> <br/>
<span>{{order.shippingAddress.shippingAddressCity}}</span><br/> <span>{{order.shippingAddress.shippingAddressStreet1}}' '{{order.shippingAddress.shippingAddressStreet2}}</span>
<span>{{order.shippingAddress.shippingAddressState}}</span><br/> <br/>
<span>{{order.shippingAddress.shippingAddressZipcode}}</span><br/> <span>{{order.shippingAddress.shippingAddressCity}}</span>
<br/>
<span>{{order.shippingAddress.shippingAddressState}}</span>
<br/>
<span>{{order.shippingAddress.shippingAddressZipcode}}</span>
<br/>
</div> </div>
</div> </div>
</div> </div>
@@ -168,14 +184,12 @@
<tr *ngFor="let cartItem of cartItemList"> <tr *ngFor="let cartItem of cartItemList">
<td>{{cartItem.book.title}} <td>{{cartItem.book.title}}
</td> </td>
<td <td class="text-center">{{cartItem.book.ourPrice}}
class="text-center">{{cartItem.book.ourPrice}}
</td> </td>
<td class="text-center"> <td class="text-center">
{{cartItem.qty}} {{cartItem.qty}}
</td> </td>
<td <td class="text-right">{{cartItem.subtotal}}
class="text-right">{{cartItem.subtotal}}
</td> </td>
</tr> </tr>
<tr> <tr>
@@ -183,8 +197,7 @@
<td class="highrow"></td> <td class="highrow"></td>
<td class="highrow text-center"> <td class="highrow text-center">
<strong>Subtotal</strong></td> <strong>Subtotal</strong></td>
<td <td class="highrow text-right">{{order.orderTotal}}
class="highrow text-right">{{order.orderTotal}}
</td> </td>
</tr> </tr>
<tr> <tr>
@@ -192,18 +205,15 @@
<td class="emptyrow"></td> <td class="emptyrow"></td>
<td class="emptyrow text-center"><strong>Tax</strong> <td class="emptyrow text-center"><strong>Tax</strong>
</td> </td>
<td <td class="emptyrow text-right">{{order.orderTotal*0.06}}
class="emptyrow text-right">{{order.orderTotal*0.06}}
</td> </td>
</tr> </tr>
<tr> <tr>
<td class="emptyrow"><i <td class="emptyrow"><i class="fa fa-barcode iconbig"></i></td>
class="fa fa-barcode iconbig"></i></td>
<td class="emptyrow"></td> <td class="emptyrow"></td>
<td class="emptyrow text-center"><strong>Total</strong> <td class="emptyrow text-center"><strong>Total</strong>
</td> </td>
<td <td class="emptyrow text-right">{{order.orderTotal*1.06}}
class="emptyrow text-right">{{order.orderTotal*1.06}}
</td> </td>
</tr> </tr>
</tbody> </tbody>
@@ -216,7 +226,6 @@
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</md-tab> </md-tab>
<md-tab label="Billing"> <md-tab label="Billing">
@@ -488,3 +497,4 @@
</div> </div>
</div> </div>
</div> </div>
</div>

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

@@ -21,6 +21,7 @@ import {Order} from '../../models/order';
export class MyProfileComponent implements OnInit { export class MyProfileComponent implements OnInit {
private serverPath = AppConst.serverPath; private serverPath = AppConst.serverPath;
private dataFetched=false;
private loginError:boolean = false; private loginError:boolean = false;
private loggedIn = false; private loggedIn = false;
private credential = {'username':'', 'password':''}; private credential = {'username':'', 'password':''};
@@ -260,6 +261,8 @@ export class MyProfileComponent implements OnInit {
break; break;
} }
} }
this.dataFetched=true;
}, },
error => { error => {
console.log(error); console.log(error);
@@ -304,5 +307,7 @@ export class MyProfileComponent implements OnInit {
this.userShipping.userShippingState=""; this.userShipping.userShippingState="";
this.defaultShippingSet=false; this.defaultShippingSet=false;
} }
} }