fixed styling, changedetails page, 'shoping' spelling

src/app/address/address.page.scss

 .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;
-    .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;
-        border-radius: 5px;
-        outline: none;
-        transition: all .6s ease-in-out;
-    }
-    .address-radio:checked {
-        background-image: url("../../assets/radio-checked.png");
-    }
-    .address-radio:checked+.show-btn {
-        opacity: 1;
-    }
-    h1 {
-        font-size: 18px;
-        margin-top: 6px;
-        padding-left: 10px;
-    }
-    p {
-        margin-top: 20px;
-        padding-left: 10px;
-        color: #B0AEC7;
-    }
-    button {
-        background: none;
-        outline: none;
-    }
-    img {
-        width: 35px;
-    }
+    border-radius: 5px;
+    outline: none;
+    transition: all 0.6s ease-in-out;
+  }
+  .address-radio:checked {
+    background-image: url('../../assets/radio-checked.png');
+  }
+  .address-radio:checked + .show-btn {
+    opacity: 1;
+  }
+  h1 {
+    font-size: 18px;
+    margin-top: 6px;
+    padding-left: 10px;
+  }
+  p {
+    margin-top: 20px;
+    padding-left: 10px;
+    color: #b0aec7;
+  }
+  button {
+    background: none;
+    outline: none;
+  }
+  img {
+    width: 35px;
+  }
 }
 
 .address-btn-wrapper {
-    padding: 15px;
-    position: absolute;
-    bottom: 50px;
-    left: 0;
-    right: 0;
-    button {
-        width: 100%;
-        background-color: #29285b;
-        color: #fff;
-        border-radius: 8px;
-        height: 45px;
-        font-size: 16px;
-        text-transform: uppercase;
-    }
-}
+  padding: 15px;
+  padding-top: 0;
+  padding-bottom: 10px;
+  background-color: #fff;
+  position: fixed;
+  bottom: 0px;
+  left: 0;
+  right: 0;
+  button {
+    width: 100%;
+    background-color: #29285b;
+    color: #fff;
+    border-radius: 8px;
+    height: 45px;
+    font-size: 16px;
\ No newline at end of file
+    text-transform: uppercase;
+  }
+}

src/app/app.component.ts

@@ -114,7 +114,7 @@ export class AppComponent {
     const currentUrl = this.router.url.split('/');
     const index = restrictedUrl.findIndex(x => x === currentUrl[1]);
     // console.log(currentUrl[1], index, this.state);
-    console.log(this.tabData);
+    // console.log(this.tabData);
     if (index > -1 || this.tabData === false) {
       return true;
     } else {

src/app/cart/cart.page.html

@@ -262,7 +262,7 @@
     [hidden]="currentIndex != 0"
   >
     <div class="continue" (click)="goToPage('productlist')">
-      CONTINUE SHOPING
+      CONTINUE SHOPPING
     </div>
     <div class="checkout" (click)="next(1)">CHECKOUT</div>
   </div>

src/app/changedetails/changedetails.page.html

@@ -21,7 +21,7 @@
           class=""
           type="text"
           [(ngModel)]="userData && userData.name"
-          [(placeholder)]="userData && userData.name"
+          placeholder="Change your Name"
           #name="ngModel"
         />
         <div
@@ -39,7 +39,7 @@
           class=""
           name="emailId"
           type="mail"
-          [(placeholder)]="userData && userData.emailId"
+          placeholder="email cannot be changed"
         />
       </div>
 
@@ -53,7 +53,7 @@
           pattern="(\(+61\)|\+61|\(0[1-9]\)|0[1-9])?( ?-?[0-9]){6,9}"
           maxlength="10"
           [(ngModel)]="userData && userData.phone"
-          [(placeholder)]="userData && userData.phone"
+          placeholder="Change your Phone Number"
           #phone="ngModel"
         />
         <div

src/app/changedetails/changedetails.page.ts

@@ -32,10 +32,18 @@ export class ChangedetailsPage implements OnInit {
     private service: ServiceService
   ) {
     // Gets userdata
-    this.service.get('params').then(val => {
-      this.userData = val;
-      console.log(val);
+    this.service.get('userData').then(val => {
+      console.log(JSON.parse(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() {}
@@ -54,17 +62,18 @@ export class ChangedetailsPage implements OnInit {
     console.log(form.value);
     if (form.valid) {
       // Change Password
-      if (
-        form.value.password &&
-        form.value.password != form.value.confirmPassword
-      ) {
-        // this.register.updatePassword(form.value.password);
+      if (form.value.password) {
+        if (form.value.password === form.value.confirmPassword) {
+          // this.register.updateData(form.value, this.userData.uid);
+          // this.register.updatePassword(form.value.password);
+          console.log('Password Changed and profile updated');
+        } else {
+          console.log('Password should match');
+        }
       } else {
-        alert('Password should match');
+        this.register.updateData(form.value, this.userData);
+        console.log('profile updated');
       }
-
-      // Calls update user data fn
-      // this.register.updateData(form.value, this.userData.uid);
       console.log('valid form values', form.value);
     }
   }

src/app/profile/profile.page.html

@@ -71,20 +71,20 @@
         </ion-row>
       </div>
       <hr />
-      <ion-row>
+      <ion-row (click)="goToPage('wishlist')">
         <ion-col class="textLeft p0">
           <p>Wishlist</p>
         </ion-col>
-        <ion-col class="textRight p0" (click)="goToPage('wishlist')">
+        <ion-col class="textRight p0">
           <h6>(0)</h6>
         </ion-col>
       </ion-row>
       <hr />
-      <ion-row>
+      <ion-row (click)="goToPage('address')">
         <ion-col class="textLeft p0">
           <p>Address</p>
         </ion-col>
-        <ion-col class="textRight p0" (click)="goToPage('address')">
+        <ion-col class="textRight p0">
           <h6 *ngIf="addressService.addList">
             ({{addressService.addressList.length}})
           </h6>
@@ -102,11 +102,11 @@
         </ion-col>
       </ion-row>
       <hr /> -->
-      <ion-row>
+      <ion-row (click)="goToPage('myorder')">
         <ion-col class="textLeft p0">
           <p>My Order</p>
         </ion-col>
-        <ion-col class="textRight p0" (click)="goToPage('myorder')">
+        <ion-col class="textRight p0">
           <h6>
             <ion-icon name="arrow-forward"></ion-icon>
           </h6>

src/app/profile/profile.page.ts

@@ -41,6 +41,7 @@ export class ProfilePage implements OnInit {
   downloadURL;
 
   constructor(
+    private route: ActivatedRoute,
     private router: Router,
     private storage: AngularFireStorage,
     private useService: UserService,
@@ -56,10 +57,14 @@ export class ProfilePage implements OnInit {
       }
     });
 
-    this.service.get('userData').then(data => {
-      if (data) {
-        this.loggedUser = JSON.parse(data);
-      }
+    // Listens to url
+    route.params.subscribe(val => {
+      // 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 {
   }
 
   ngOnInit() {
+    console.log('profile page');
     const This = this;
     setTimeout(() => {
       this.user = this.useService.users;

src/app/wishlist/wishlist.page.html

@@ -9,42 +9,42 @@
 </div>
 
 <ion-content>
-  <!-- <div class="wishlist-wrapper">
-        <ul>
-            <li>
-                <div class="wishlist_image">
-                    <img src="../../assets/img-list.png">
-                </div>
-                <div class="wishlist_detail">
-                    <p class="floatLeft">European Style V Neck</p>
-                    <span class="floatRight"><img src="../../assets/heart.png"></span>
-                    <div class="clear"></div>
-                    <p>Green, Small</p>
-                    <h1>AU$88.00</h1>
-                </div>
-                <div class="clear"></div>
-            </li>
-            <li>
-                <div class="wishlist_image">
-                    <img src="../../assets/img-list.png">
-                </div>
-                <div class="wishlist_detail">
-                    <p class="floatLeft">European Style V Neck</p>
-                    <span class="floatRight"><img src="../../assets/heart.png"></span>
-                    <div class="clear"></div>
-                    <p>Green, Small</p>
-                    <h1>AU$88.00</h1>
-                </div>
-                <div class="clear"></div>
-            </li>
-        </ul>
-    </div> -->
-
+  <div class="wishlist-wrapper">
+    <ul>
+      <li>
+        <div class="wishlist_image">
+          <img src="../../assets/img-list.png" />
+        </div>
+        <div class="wishlist_detail">
+          <p class="floatLeft">European Style V Neck</p>
+          <span class="floatRight"><img src="../../assets/heart.png"/></span>
+          <div class="clear"></div>
+          <p>Green, Small</p>
+          <h1>AU$88.00</h1>
+        </div>
+        <div class="clear"></div>
+      </li>
+      <li>
+        <div class="wishlist_image">
+          <img src="../../assets/img-list.png" />
+        </div>
+        <div class="wishlist_detail">
+          <p class="floatLeft">European Style V Neck</p>
+          <span class="floatRight"><img src="../../assets/heart.png"/></span>
+          <div class="clear"></div>
+          <p>Green, Small</p>
+          <h1>AU$88.00</h1>
+        </div>
+        <div class="clear"></div>
+      </li>
+    </ul>
+  </div>
+  <!-- 
   <div class="empty-wishlist-wrapper">
     <img src="../../assets/wishlist.png" />
     <h1>There is no products added</h1>
     <button (click)="goToPage('home')">shop now</button>
-  </div>
+  </div> -->
 
   <div class="footer-btns-wrapper">
     <button class="btn-clear">Clear All</button>

src/config/services/wishlist.ts

+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;
+}

src/config/update.service.ts

@@ -47,22 +47,32 @@ export class UpdateService {
     // });
   }
 
-  updateData(userData: UpdateUserDetails, uid: string) {
+  updateData(userData: UpdateUserDetails, oldData: User) {
     this.type = 2;
 
     const postData: UpdateUserDetails = {
       phone: userData.phone,
       name: userData.name
     };
+    const updateOldData = {
+      ...oldData,
+      phone: userData.phone,
+      name: userData.name
+    };
     this.userPostData = postData;
 
     this.afs
       .collection('customers')
-      .doc(uid)
+      .doc(oldData.uid)
       .update(postData)
       .then(() => {
-        console.log('success');
-        this.router.navigateByUrl('profile');
+        this.service
+          .set('userData', JSON.stringify(updateOldData))
+          .then(res => {
+            console.log('success', updateOldData, res);
+            this.router.navigateByUrl('profile');
+          })
+          .catch(err => console.log(err));
       })
       .catch(error => {
         console.log(error);