Commit 86664af8 by Adarsh K

Merge branch 'muhsin' into 'master'

Muhsin See merge request !54
parents d0836db7 4995603e
.address-wrapper { .address-wrapper {
padding: 15px;
padding-bottom: 11%;
.address-radio {
background-image: url('../../assets/radio.png');
-webkit-appearance: none;
background-repeat: no-repeat;
background-position: center;
background-size: 25px;
height: auto;
padding: 15px; padding: 15px;
.address-radio { border-radius: 5px;
background-image: url("../../assets/radio.png"); outline: none;
-webkit-appearance: none; transition: all 0.6s ease-in-out;
background-repeat: no-repeat; }
background-position: center; .address-radio:checked {
background-size: 25px; background-image: url('../../assets/radio-checked.png');
height: auto; }
padding: 15px; .address-radio:checked + .show-btn {
border-radius: 5px; opacity: 1;
outline: none; }
transition: all .6s ease-in-out; h1 {
} font-size: 18px;
.address-radio:checked { margin-top: 6px;
background-image: url("../../assets/radio-checked.png"); padding-left: 10px;
} }
.address-radio:checked+.show-btn { p {
opacity: 1; margin-top: 20px;
} padding-left: 10px;
h1 { color: #b0aec7;
font-size: 18px; }
margin-top: 6px; button {
padding-left: 10px; background: none;
} outline: none;
p { }
margin-top: 20px; img {
padding-left: 10px; width: 35px;
color: #B0AEC7; }
}
button {
background: none;
outline: none;
}
img {
width: 35px;
}
} }
.address-btn-wrapper { .address-btn-wrapper {
padding: 15px; padding: 15px;
position: absolute; padding-top: 0;
bottom: 50px; padding-bottom: 10px;
left: 0; background-color: #fff;
right: 0; position: fixed;
button { bottom: 0px;
width: 100%; left: 0;
background-color: #29285b; right: 0;
color: #fff; button {
border-radius: 8px; width: 100%;
height: 45px; background-color: #29285b;
font-size: 16px; color: #fff;
text-transform: uppercase; border-radius: 8px;
} height: 45px;
} font-size: 16px;
\ No newline at end of file text-transform: uppercase;
}
}
...@@ -139,34 +139,59 @@ ...@@ -139,34 +139,59 @@
<p>COD</p> <p>COD</p>
</label> </label>
</div> </div>
<!-- <div class="payment_method"> <div class="payment_method">
<input type="radio" name="payments" id="paypal" name="radio-group" checked (click)="getwaypaypal()"> <input
<label for="test1"> type="radio"
<p>PayPal</p> name="payments"
</label> id="paypal"
</div> name="radio-group"
<div class="card_div" [hidden]="gateway !=1"> checked
<input class="card_no borderNone widthFull" placeholder="PayPal ID"> (click)="getwaypaypal()"
</div> />
<div class="payment_method"> <label for="test1">
<input type="radio" name="payments" id="afterpay" name="radio-group" (click)="getwayafterpay()"> <p>PayPal</p>
<label for="test2"> </label>
<p>AfterPay</p> </div>
</label> <div class="card_div" [hidden]="gateway !=1">
</div> <input
<div class="card_div" [hidden]="gateway !=2"> class="card_no borderNone widthFull"
<input class="card_no" placeholder="**** **** **** 1458"> placeholder="PayPal ID"
<input class="cv_number" placeholder="CVV"> />
</div> </div>
<div class="payment_method"> <div class="payment_method">
<input type="radio" name="payments" id="payk" name="radio-group" (click)="getwaypayk()"> <input
<label for="test3"> type="radio"
<p>PayK</p> name="payments"
</label> id="afterpay"
</div> name="radio-group"
<div class="card_div" [hidden]="gateway !=3"> (click)="getwayafterpay()"
<input class="card_no borderNone widthFull" placeholder="PafyK ID"> />
</div> --> <label for="test2">
<p>AfterPay</p>
</label>
</div>
<div class="card_div" [hidden]="gateway !=2">
<input class="card_no" placeholder="**** **** **** 1458" />
<input class="cv_number" placeholder="CVV" />
</div>
<div class="payment_method">
<input
type="radio"
name="payments"
id="payk"
name="radio-group"
(click)="getwaypayk()"
/>
<label for="test3">
<p>PayK</p>
</label>
</div>
<div class="card_div" [hidden]="gateway !=3">
<input
class="card_no borderNone widthFull"
placeholder="PafyK ID"
/>
</div>
<!-- <div class="delivery_time"> <!-- <div class="delivery_time">
<ul> <ul>
<li> <li>
...@@ -262,7 +287,7 @@ ...@@ -262,7 +287,7 @@
[hidden]="currentIndex != 0" [hidden]="currentIndex != 0"
> >
<div class="continue" (click)="goToPage('productlist')"> <div class="continue" (click)="goToPage('productlist')">
CONTINUE SHOPING CONTINUE SHOPPING
</div> </div>
<div class="checkout" (click)="next(1)">CHECKOUT</div> <div class="checkout" (click)="next(1)">CHECKOUT</div>
</div> </div>
......
.home_wrapper { .home_wrapper {
width: 100%;
.home_banner {
width: 100%; width: 100%;
.home_banner { height: 300px;
padding-top: 80px;
position: relative;
background-color: #fff;
.home_banner_title {
padding: 10px;
position: absolute;
top: 0px;
left: 0px;
right: 0px;
img {
width: 100px;
}
p {
margin: 0px;
text-align: right;
background-image: url('../../assets/Path 55_2.png');
background-position: left;
background-repeat: no-repeat;
background-size: 12px;
padding-left: 20px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
ion-slides {
width: 100%;
height: 100%;
ion-slide {
width: 100%; width: 100%;
height: 300px; height: 100%;
padding-top: 80px;
position: relative; position: relative;
background-color: #fff; img {
.home_banner_title { width: 100%;
padding: 10px; height: 100%;
position: absolute; object-fit: cover;
top: 0px;
left: 0px;
right: 0px;
img {
width: 100px;
}
p {
margin: 0px;
text-align: right;
background-image: url("../../assets/Path 55_2.png");
background-position: left;
background-repeat: no-repeat;
background-size: 12px;
padding-left: 20px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
} }
ion-slides { .banner_slide {
width: 100%; position: absolute;
height: 100%; top: 0px;
ion-slide { left: 0px;
width: 100%; right: 0px;
height: 100%; bottom: 0px;
position: relative; -webkit-box-shadow: inset 0px -128px 63px -45px rgba(0, 0, 0, 0.75);
img { -moz-box-shadow: inset 0px -128px 63px -45px rgba(0, 0, 0, 0.75);
width: 100%; box-shadow: inset 0px -128px 63px -45px rgba(0, 0, 0, 0.75);
height: 100%; padding-top: 160px;
object-fit: cover; padding-left: 20px;
} padding-right: 20px;
.banner_slide { h5 {
position: absolute; color: #fff;
top: 0px; margin: 0px;
left: 0px; padding: 0px;
right: 0px; text-align: left;
bottom: 0px; font-weight: bold;
-webkit-box-shadow: inset 0px -128px 63px -45px rgba(0, 0, 0, 0.75); letter-spacing: 2px;
-moz-box-shadow: inset 0px -128px 63px -45px rgba(0, 0, 0, 0.75); padding-bottom: 5px;
box-shadow: inset 0px -128px 63px -45px rgba(0, 0, 0, 0.75); font-size: 14px;
padding-top: 160px; }
padding-left: 20px; p {
padding-right: 20px; color: #fff;
h5 { margin: 0px;
color: #fff; padding: 0px;
margin: 0px; text-align: left;
padding: 0px; font-size: 20px;
text-align: left; font-weight: lighter;
font-weight: bold; }
letter-spacing: 2px;
padding-bottom: 5px;
font-size: 14px;
}
p {
color: #fff;
margin: 0px;
padding: 0px;
text-align: left;
font-size: 20px;
font-weight: lighter;
}
}
}
} }
}
} }
.home_sub_header { }
padding: 10px; .home_sub_header {
padding-top: 20px; padding: 10px;
padding-bottom: 20px; padding-top: 20px;
color: rgba(59, 57, 77, 1); padding-bottom: 20px;
font-weight: 900; color: rgba(59, 57, 77, 1);
font-weight: 900;
}
.featured_slider {
padding-left: 10px;
padding-right: 10px;
.feature_product {
width: 100%;
height: 130px;
position: relative;
background-color: #a8a8a8;
border: 2px solid #fff;
img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.feature_overlay {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
background-color: rgba(0, 0, 0, 0.75);
padding: 15px;
padding-top: 60px;
h5 {
color: #fff;
margin: 0px;
padding: 0px;
text-align: left;
font-weight: bold;
letter-spacing: 2px;
padding-bottom: 2px;
font-size: 14px;
}
p {
color: #fff;
margin: 0px;
padding: 0px;
text-align: left;
font-size: 20px;
font-weight: lighter;
}
}
} }
.featured_slider { }
padding-left: 10px; .nearby_shop_list {
padding-right: 10px; ul {
.feature_product { margin: 0px;
padding-left: 10px;
padding-right: 10px;
li {
list-style: none;
padding-bottom: 10px;
.nearby_image {
width: 120px;
height: 125px;
float: left;
background-color: #a8a8a8;
border-radius: 8px;
img {
width: 100%; width: 100%;
height: 130px; height: 100%;
position: relative; object-fit: cover;
background-color: #a8a8a8; object-position: center;
border: 2px solid #fff; }
img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.feature_overlay {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
background-color: rgba(0, 0, 0, 0.75);
padding: 15px;
padding-top: 60px;
h5 {
color: #fff;
margin: 0px;
padding: 0px;
text-align: left;
font-weight: bold;
letter-spacing: 2px;
padding-bottom: 2px;
font-size: 14px;
}
p {
color: #fff;
margin: 0px;
padding: 0px;
text-align: left;
font-size: 20px;
font-weight: lighter;
}
}
} }
} .nearby_detail {
.nearby_shop_list { width: calc(100% - 120px);
ul { float: left;
padding-left: 20px;
padding-top: 40px;
h5 {
margin: 0px; margin: 0px;
padding-left: 10px; padding: 0px;
padding-right: 10px; color: rgba(59, 57, 77, 1);
li { font-weight: 900;
list-style: none; padding-bottom: 2px;
padding-bottom: 10px; img {
.nearby_image { width: 16px;
width: 120px;
height: 125px;
float: left;
background-color: #a8a8a8;
border-radius: 8px;
img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
}
.nearby_detail {
width: calc(100% - 120px);
float: left;
padding-left: 20px;
padding-top: 40px;
h5 {
margin: 0px;
padding: 0px;
color: rgba(59, 57, 77, 1);
font-weight: 900;
padding-bottom: 2px;
img {
width: 16px;
}
}
p {
margin: 0px;
padding: 0px;
color: rgba(176, 174, 199);
}
}
} }
} }
} p {
.featured_catagory_list {
padding: 10px;
ul {
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
li { color: rgba(176, 174, 199);
list-style: none; }
position: relative;
height: 120px;
width: 100%;
border-radius: 8px;
margin-bottom: 10px;
&:nth-child(odd) {
text-align: left;
}
&:nth-child(even) {
text-align: right;
}
img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.featured_overlay {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
border-radius: 8px;
background-color: rgba(0, 0, 0, 0.75);
color: #fff;
padding: 45px;
padding-left: 20px;
padding-right: 20px;
h4 {
margin: 0px;
font-size: 26px;
font-weight: 900;
}
}
}
} }
}
} }
} }
.featured_catagory_list {
.sort_wrappper { padding: 10px;
height: 100vh; padding-bottom: 14%;
width: 100%; ul {
position: fixed; margin: 0px;
top: 0px; padding: 0px;
left: 0px; li {
right: 0px; list-style: none;
bottom: 0px;
background: rgba(0, 0, 0, 0.6);
z-index: 99;
.sort_inner {
margin: 0 auto;
width: 90%;
padding: 10px;
padding-left: 15px;
padding-right: 15px;
padding-bottom: 15px;
background-color: #fff;
position: relative; position: relative;
-webkit-box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.3); height: 120px;
-moz-box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.3); width: 100%;
box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.3); border-radius: 8px;
top: 25%; margin-bottom: 10px;
border-radius: 0px; &:nth-child(odd) {
h4 { text-align: left;
text-align: center;
color: rgba(59, 57, 77, 1);
margin: 0px;
font-weight: bold;
padding: 10px;
font-size: 18px;
border-bottom: 1px solid rgba(0, 0, 0, 0.16);
padding-bottom: 20px;
margin-bottom: 30px;
} }
.search_box { &:nth-child(even) {
width: calc(100% - 100px); text-align: right;
height: 45px;
border: none;
border-bottom: 1px solid rgba(0, 0, 0, 0.16);
} }
.search_btn { img {
width: 100px; width: 100%;
height: 45px; height: 100%;
background-color: rgba(41, 40, 91, 1); object-fit: cover;
border: none; object-position: center;
color: #fff;
font-size: 16px;
} }
ul { .featured_overlay {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
border-radius: 8px;
background-color: rgba(0, 0, 0, 0.75);
color: #fff;
padding: 45px;
padding-left: 20px;
padding-right: 20px;
h4 {
margin: 0px; margin: 0px;
padding: 0px; font-size: 26px;
li { font-weight: 900;
list-style: none; }
border-bottom: 1px solid rgba(0, 0, 0, 0.16);
padding-top: 10px;
padding-bottom: 10px;
.styled-checkbox {
position: absolute; // take it out of document flow
opacity: 0; // hide it
&+label {
position: relative;
cursor: pointer;
padding: 0;
width: 100%;
}
// Box.
&+label:before {
content: '';
margin-right: 10px;
display: inline-block;
vertical-align: text-top;
width: 20px;
height: 20px;
border-radius: 5px;
background: white;
border: 1px solid rgba(215, 213, 228, 1);
}
&:checked+label:before {
background: #29285b;
}
// Disabled state label.
&:disabled+label {
color: #b8b8b8;
cursor: auto;
}
// Disabled box.
&:disabled+label:before {
box-shadow: none;
background: #ddd;
}
// Checkmark. Could be replaced with an image
&:checked+label:after {
content: '';
position: absolute;
left: 6px;
top: 10px;
background: white;
width: 2px;
height: 2px;
box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white;
transform: rotate(45deg);
}
}
}
} }
.sort_footer { }
padding-top: 10px; }
button { }
border-radius: 8px; }
height: 40px;
width: 48%; .sort_wrappper {
color: #fff; height: 100vh;
font-size: 15px; width: 100%;
font-weight: lighter; position: fixed;
} top: 0px;
.submit { left: 0px;
background-color: rgba(41, 40, 91, 1); right: 0px;
} bottom: 0px;
.cancel { background: rgba(0, 0, 0, 0.6);
background-color: rgba(215, 213, 228, 1); z-index: 99;
} .sort_inner {
margin: 0 auto;
width: 90%;
padding: 10px;
padding-left: 15px;
padding-right: 15px;
padding-bottom: 15px;
background-color: #fff;
position: relative;
-webkit-box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.3);
box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.3);
top: 25%;
border-radius: 0px;
h4 {
text-align: center;
color: rgba(59, 57, 77, 1);
margin: 0px;
font-weight: bold;
padding: 10px;
font-size: 18px;
border-bottom: 1px solid rgba(0, 0, 0, 0.16);
padding-bottom: 20px;
margin-bottom: 30px;
}
.search_box {
width: calc(100% - 100px);
height: 45px;
border: none;
border-bottom: 1px solid rgba(0, 0, 0, 0.16);
}
.search_btn {
width: 100px;
height: 45px;
background-color: rgba(41, 40, 91, 1);
border: none;
color: #fff;
font-size: 16px;
}
ul {
margin: 0px;
padding: 0px;
li {
list-style: none;
border-bottom: 1px solid rgba(0, 0, 0, 0.16);
padding-top: 10px;
padding-bottom: 10px;
.styled-checkbox {
position: absolute; // take it out of document flow
opacity: 0; // hide it
& + label {
position: relative;
cursor: pointer;
padding: 0;
width: 100%;
}
// Box.
& + label:before {
content: '';
margin-right: 10px;
display: inline-block;
vertical-align: text-top;
width: 20px;
height: 20px;
border-radius: 5px;
background: white;
border: 1px solid rgba(215, 213, 228, 1);
}
&:checked + label:before {
background: #29285b;
}
// Disabled state label.
&:disabled + label {
color: #b8b8b8;
cursor: auto;
}
// Disabled box.
&:disabled + label:before {
box-shadow: none;
background: #ddd;
}
// Checkmark. Could be replaced with an image
&:checked + label:after {
content: '';
position: absolute;
left: 6px;
top: 10px;
background: white;
width: 2px;
height: 2px;
box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white,
4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white;
transform: rotate(45deg);
}
} }
}
}
.sort_footer {
padding-top: 10px;
button {
border-radius: 8px;
height: 40px;
width: 48%;
color: #fff;
font-size: 15px;
font-weight: lighter;
}
.submit {
background-color: rgba(41, 40, 91, 1);
}
.cancel {
background-color: rgba(215, 213, 228, 1);
}
} }
} }
\ No newline at end of file }
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
class="" class=""
type="text" type="text"
[(ngModel)]="userData && userData.name" [(ngModel)]="userData && userData.name"
[(placeholder)]="userData && userData.name" placeholder="Change your Name"
#name="ngModel" #name="ngModel"
/> />
<div <div
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
class="" class=""
name="emailId" name="emailId"
type="mail" type="mail"
[(placeholder)]="userData && userData.emailId" placeholder="email cannot be changed"
/> />
</div> </div>
...@@ -53,7 +53,7 @@ ...@@ -53,7 +53,7 @@
pattern="(\(+61\)|\+61|\(0[1-9]\)|0[1-9])?( ?-?[0-9]){6,9}" pattern="(\(+61\)|\+61|\(0[1-9]\)|0[1-9])?( ?-?[0-9]){6,9}"
maxlength="10" maxlength="10"
[(ngModel)]="userData && userData.phone" [(ngModel)]="userData && userData.phone"
[(placeholder)]="userData && userData.phone" placeholder="Change your Phone Number"
#phone="ngModel" #phone="ngModel"
/> />
<div <div
...@@ -72,9 +72,22 @@ ...@@ -72,9 +72,22 @@
<div class="row"> <div class="row">
<h6>Change Password</h6> <h6>Change Password</h6>
</div> </div>
<!-- <div class="row"> <div class="row">
<input class="" type="password" placeholder="Current Password" /> <input
</div> --> class=""
type="password"
minlength="6"
#currentPassword="ngModel"
[(ngModel)]="updatePassword.currentPassword"
name="currentPassword"
placeholder="Current Password"
/>
<div
*ngIf="currentPassword.errors && currentPassword.errors.minlength"
>
Password must be at least 6 characters
</div>
</div>
<div class="row"> <div class="row">
<input <input
class="" class=""
...@@ -83,6 +96,7 @@ ...@@ -83,6 +96,7 @@
type="password" type="password"
placeholder="New Password" placeholder="New Password"
minlength="6" minlength="6"
[required]="currentPassword ? true: false"
#password="ngModel" #password="ngModel"
/> />
<div *ngIf="password.errors && password.errors.minlength"> <div *ngIf="password.errors && password.errors.minlength">
...@@ -96,10 +110,11 @@ ...@@ -96,10 +110,11 @@
[(ngModel)]="updatePassword.confirmPassword" [(ngModel)]="updatePassword.confirmPassword"
name="confirmPassword" name="confirmPassword"
type="password" type="password"
[required]="currentPassword ? true: false"
placeholder="Confirm Password" placeholder="Confirm Password"
/> />
<div *ngIf=""> <div *ngIf="confirmPassword.errors">
Password should match {{confPasswordErr}}
</div> </div>
</div> </div>
</div> </div>
...@@ -112,3 +127,10 @@ ...@@ -112,3 +127,10 @@
</form> </form>
</div> </div>
</ion-content> </ion-content>
<div class="loader" *ngIf="register.loader">
<div class="lds-ripple">
<div></div>
<div></div>
</div>
</div>
...@@ -17,6 +17,7 @@ export class ChangedetailsPage implements OnInit { ...@@ -17,6 +17,7 @@ export class ChangedetailsPage implements OnInit {
name: '', name: '',
phone: '' phone: ''
}; };
confPasswordErr: string;
updatePassword: UpdatePassword = { updatePassword: UpdatePassword = {
password: '', password: '',
...@@ -32,10 +33,18 @@ export class ChangedetailsPage implements OnInit { ...@@ -32,10 +33,18 @@ export class ChangedetailsPage implements OnInit {
private service: ServiceService private service: ServiceService
) { ) {
// Gets userdata // Gets userdata
this.service.get('params').then(val => { this.service.get('userData').then(val => {
this.userData = val; console.log(JSON.parse(val));
console.log(val); this.userData = JSON.parse(val);
console.log(this.userData);
}); });
// this.service.get('user').then(data => {
// if (data) {
// this.userData = JSON.parse(data);
// console.log(this.userData);
// }
// });
} }
ngOnInit() {} ngOnInit() {}
...@@ -54,18 +63,28 @@ export class ChangedetailsPage implements OnInit { ...@@ -54,18 +63,28 @@ export class ChangedetailsPage implements OnInit {
console.log(form.value); console.log(form.value);
if (form.valid) { if (form.valid) {
// Change Password // Change Password
if ( if (form.value.currentPassword && form.value.password) {
form.value.password && if (
form.value.password != form.value.confirmPassword form.value.password &&
) { form.value.password === form.value.confirmPassword
// this.register.updatePassword(form.value.password); ) {
// this.register.updateData(form.value, this.userData.uid);
this.register.updatePassword(
form.value.currentPassword,
form.value.password
);
console.log('Password Changed and profile updated'), form.value;
} else {
console.log('Password should match');
this.confPasswordErr = 'Password should match';
}
} else { } else {
alert('Password should match'); // this.register.updateData(form.value, this.userData);
console.log('profile updated', form.value);
} }
// console.log('valid form values', form.value);
// Calls update user data fn } else {
// this.register.updateData(form.value, this.userData.uid); console.log(form);
console.log('valid form values', form.value);
} }
} }
} }
...@@ -108,7 +108,7 @@ ...@@ -108,7 +108,7 @@
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
object-fit: cover; object-fit: contain;
object-position: center; object-position: center;
} }
} }
......
...@@ -71,20 +71,20 @@ ...@@ -71,20 +71,20 @@
</ion-row> </ion-row>
</div> </div>
<hr /> <hr />
<ion-row> <ion-row (click)="goToPage('wishlist')">
<ion-col class="textLeft p0"> <ion-col class="textLeft p0">
<p>Wishlist</p> <p>Wishlist</p>
</ion-col> </ion-col>
<ion-col class="textRight p0" (click)="goToPage('wishlist')"> <ion-col class="textRight p0">
<h6>(0)</h6> <h6>(0)</h6>
</ion-col> </ion-col>
</ion-row> </ion-row>
<hr /> <hr />
<ion-row> <ion-row (click)="goToPage('address')">
<ion-col class="textLeft p0"> <ion-col class="textLeft p0">
<p>Address</p> <p>Address</p>
</ion-col> </ion-col>
<ion-col class="textRight p0" (click)="goToPage('address')"> <ion-col class="textRight p0">
<h6 *ngIf="addressService.addList"> <h6 *ngIf="addressService.addList">
({{addressService.addressList.length}}) ({{addressService.addressList.length}})
</h6> </h6>
...@@ -102,11 +102,11 @@ ...@@ -102,11 +102,11 @@
</ion-col> </ion-col>
</ion-row> </ion-row>
<hr /> --> <hr /> -->
<ion-row> <ion-row (click)="goToPage('myorder')">
<ion-col class="textLeft p0"> <ion-col class="textLeft p0">
<p>My Order</p> <p>My Order</p>
</ion-col> </ion-col>
<ion-col class="textRight p0" (click)="goToPage('myorder')"> <ion-col class="textRight p0">
<h6> <h6>
<ion-icon name="arrow-forward"></ion-icon> <ion-icon name="arrow-forward"></ion-icon>
</h6> </h6>
......
...@@ -41,6 +41,7 @@ export class ProfilePage implements OnInit { ...@@ -41,6 +41,7 @@ export class ProfilePage implements OnInit {
downloadURL; downloadURL;
constructor( constructor(
private route: ActivatedRoute,
private router: Router, private router: Router,
private storage: AngularFireStorage, private storage: AngularFireStorage,
private useService: UserService, private useService: UserService,
...@@ -56,10 +57,14 @@ export class ProfilePage implements OnInit { ...@@ -56,10 +57,14 @@ export class ProfilePage implements OnInit {
} }
}); });
this.service.get('userData').then(data => { // Listens to url
if (data) { route.params.subscribe(val => {
this.loggedUser = JSON.parse(data); // Get user Data
} this.service.get('userData').then(data => {
if (data) {
this.loggedUser = JSON.parse(data);
}
});
}); });
} }
...@@ -69,6 +74,7 @@ export class ProfilePage implements OnInit { ...@@ -69,6 +74,7 @@ export class ProfilePage implements OnInit {
} }
ngOnInit() { ngOnInit() {
console.log('profile page');
const This = this; const This = this;
setTimeout(() => { setTimeout(() => {
this.user = this.useService.users; this.user = this.useService.users;
......
...@@ -9,42 +9,42 @@ ...@@ -9,42 +9,42 @@
</div> </div>
<ion-content> <ion-content>
<!-- <div class="wishlist-wrapper"> <div class="wishlist-wrapper">
<ul> <ul>
<li> <li>
<div class="wishlist_image"> <div class="wishlist_image">
<img src="../../assets/img-list.png"> <img src="../../assets/img-list.png" />
</div> </div>
<div class="wishlist_detail"> <div class="wishlist_detail">
<p class="floatLeft">European Style V Neck</p> <p class="floatLeft">European Style V Neck</p>
<span class="floatRight"><img src="../../assets/heart.png"></span> <span class="floatRight"><img src="../../assets/heart.png"/></span>
<div class="clear"></div> <div class="clear"></div>
<p>Green, Small</p> <p>Green, Small</p>
<h1>AU$88.00</h1> <h1>AU$88.00</h1>
</div> </div>
<div class="clear"></div> <div class="clear"></div>
</li> </li>
<li> <li>
<div class="wishlist_image"> <div class="wishlist_image">
<img src="../../assets/img-list.png"> <img src="../../assets/img-list.png" />
</div> </div>
<div class="wishlist_detail"> <div class="wishlist_detail">
<p class="floatLeft">European Style V Neck</p> <p class="floatLeft">European Style V Neck</p>
<span class="floatRight"><img src="../../assets/heart.png"></span> <span class="floatRight"><img src="../../assets/heart.png"/></span>
<div class="clear"></div> <div class="clear"></div>
<p>Green, Small</p> <p>Green, Small</p>
<h1>AU$88.00</h1> <h1>AU$88.00</h1>
</div> </div>
<div class="clear"></div> <div class="clear"></div>
</li> </li>
</ul> </ul>
</div> --> </div>
<!--
<div class="empty-wishlist-wrapper"> <div class="empty-wishlist-wrapper">
<img src="../../assets/wishlist.png" /> <img src="../../assets/wishlist.png" />
<h1>There is no products added</h1> <h1>There is no products added</h1>
<button (click)="goToPage('home')">shop now</button> <button (click)="goToPage('home')">shop now</button>
</div> </div> -->
<div class="footer-btns-wrapper"> <div class="footer-btns-wrapper">
<button class="btn-clear">Clear All</button> <button class="btn-clear">Clear All</button>
......
export interface Wishlist {
amount: string;
bookDate: any;
pickupLocation: any;
deliveryLocation: any;
deliveryAddress: any;
status: number;
orderStatus: number;
riderName: string;
orderId: string;
time: string;
product: any;
orderCode: string;
}
...@@ -21,6 +21,7 @@ export class UpdateService { ...@@ -21,6 +21,7 @@ export class UpdateService {
type: number; type: number;
userPostData: any; userPostData: any;
updateStatus: number; updateStatus: number;
loader: boolean;
constructor( constructor(
public afs: AngularFirestore, public afs: AngularFirestore,
...@@ -47,25 +48,88 @@ export class UpdateService { ...@@ -47,25 +48,88 @@ export class UpdateService {
// }); // });
} }
updateData(userData: UpdateUserDetails, uid: string) { // Update User Data
updateData(userData: UpdateUserDetails, oldData: User) {
this.loader = true;
this.type = 2; this.type = 2;
const postData: UpdateUserDetails = { const postData: UpdateUserDetails = {
phone: userData.phone, phone: userData.phone,
name: userData.name name: userData.name
}; };
const updateOldData = {
...oldData,
phone: userData.phone,
name: userData.name
};
this.userPostData = postData; this.userPostData = postData;
this.afs this.afs
.collection('customers') .collection('customers')
.doc(uid) .doc(oldData.uid)
.update(postData) .update(postData)
.then(() => { .then(() => {
console.log('success'); this.service
this.router.navigateByUrl('profile'); .set('userData', JSON.stringify(updateOldData))
.then(res => {
console.log('success', updateOldData, res);
this.service
.showToast('Profile updated!', 'top', 'my-toast', 1000)
.then(res => {
this.router.navigateByUrl('profile');
this.loader = false;
});
})
.catch(err => console.log(err));
})
.catch(error => {
console.log(error);
});
}
// Change user password
updatePassword(currentPassword: string, newPasswd: string) {
this.loader = true;
let currentUser = this.afAuth.auth.currentUser; // Gets current user
// Credential is required for re-authentication
const credential = auth.EmailAuthProvider.credential(
currentUser.email,
currentPassword
);
// Re-authenticate user
currentUser
.reauthenticateWithCredential(credential)
.then(() => {
currentUser
.updatePassword(newPasswd) // Update password
.then(success => {
console.log('password changed');
this.loader = false;
this.service
.showToast('Password Changed!', 'top', 'my-toast', 1000) //success toast
.then(res => {
this.router.navigateByUrl('profile');
this.loader = false;
});
})
.catch(error => {
console.log('something fishy');
this.service
.showToast('Something went wrong', 'top', 'my-toast', 1000) //failure toast
.then(res => {
this.loader = false;
});
});
}) })
.catch(error => { .catch(error => {
console.log(error); console.log(error);
this.service
.showToast(error.message, 'top', 'my-error', 3000) //failure toast
.then(res => {
this.loader = false;
});
}); });
} }
} }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment