fixed search clear issue

src/app/app.component.html

@@ -4,7 +4,7 @@
       <ion-content>
         <div class="side_menu_wrapper">
           <ion-menu-toggle>
-            <div class="top_banner">
+            <div class="top_banner" (click)="goToPage('profile')">
               <div class="top_image"></div>
               <div class="top_detail">
                 <h4>John Doe</h4>

src/app/app.component.ts

-import { Component } from '@angular/core';
-import { Router, ActivatedRoute } from '@angular/router';
-import { Platform } from '@ionic/angular';
-import { SplashScreen } from '@ionic-native/splash-screen/ngx';
-import { StatusBar } from '@ionic-native/status-bar/ngx';
-import { AngularFirestore, AngularFirestoreDocument, AngularFirestoreCollection } from '@angular/fire/firestore';
-import * as firebase from 'firebase';
-import { ModalController } from '@ionic/angular';
-import { DeliverypopPage } from './deliverypop/deliverypop.page';
-import { AuthService } from './../config/auth.service';
-import { ServiceService } from './../config/service.service';
-import { CategoriesService } from './../config/category.service';
-
-
+import { Component } from "@angular/core";
+import { Router, ActivatedRoute } from "@angular/router";
+import { Platform } from "@ionic/angular";
+import { SplashScreen } from "@ionic-native/splash-screen/ngx";
+import { StatusBar } from "@ionic-native/status-bar/ngx";
+import {
+  AngularFirestore,
+  AngularFirestoreDocument,
+  AngularFirestoreCollection
+} from "@angular/fire/firestore";
+import * as firebase from "firebase";
+import { ModalController } from "@ionic/angular";
+import { DeliverypopPage } from "./deliverypop/deliverypop.page";
+import { AuthService } from "./../config/auth.service";
+import { ServiceService } from "./../config/service.service";
+import { CategoriesService } from "./../config/category.service";
+import { User } from "../config/services/user";
+import { UserService } from "../config/user.service";
 @Component({
   selector: "app-root",
   templateUrl: "app.component.html",
@@ -25,6 +29,9 @@ export class AppComponent {
   sec_active5 = false;
   sec_active6 = false;
 
+  // Customer Info
+  user: User;
+
   menuw: number;
 
   constructor(
@@ -37,10 +44,20 @@ export class AppComponent {
     public authService: AuthService,
     public service: ServiceService,
     public categoryService: CategoriesService,
-    private route: ActivatedRoute
+    private route: ActivatedRoute,
+    private useService: UserService
   ) {
     this.initializeApp();
     this.orderState();
+
+    const userdata = this.service.get("user").then(data => {
+      if (data) {
+        data = JSON.parse(data);
+        console.log(data);
+      }
+    });
+
+    this.useService.getUserData("9cYSZwGvVpgkUHVcz8Dm6oqGX152");
   }
 
   initializeApp() {
@@ -48,7 +65,7 @@ export class AppComponent {
       this.statusBar.styleDefault();
       this.statusBar.overlaysWebView(false);
       this.statusBar.show();
-      this.statusBar.backgroundColorByHexString('#29285b');
+      this.statusBar.backgroundColorByHexString("#29285b");
     });
   }
 
@@ -60,6 +77,13 @@ export class AppComponent {
     return await modal.present();
   }
 
+  ngOnInit() {
+    let This = this;
+    setTimeout(() => {
+      this.user = this.useService.users;
+      console.log("[usersaaa]", this.user);
+    }, 500);
+  }
   goToPage(path, data = null) {
     this.service.set("params", data);
     this.router.navigateByUrl(path, { queryParams: data });

src/app/catstorelist/catstorelist.page.ts

@@ -3,6 +3,7 @@ import { Router } from "@angular/router";
 import { Location } from "@angular/common";
 import { ServiceService } from "./../../config/service.service";
 import { ShoppersService } from "./../../config/shopper.service";
+import { SearchService } from "../../config/search.service";
 import { trigger, transition, animate, style } from "@angular/animations";
 
 @Component({
@@ -28,19 +29,12 @@ export class CatStorelistPage implements OnInit {
   };
   data: any;
 
-  clickSearch() {
-    this.searchShow = true;
-  }
-
-  searchClose() {
-    this.searchShow = false;
-  }
-
   constructor(
     public router: Router,
     public location: Location,
     public service: ServiceService,
-    public shopperService: ShoppersService
+    public shopperService: ShoppersService,
+    private searchService: SearchService
   ) {
     this.service.get("params").then(val => {
       this.data = val;
@@ -48,6 +42,14 @@ export class CatStorelistPage implements OnInit {
     });
   }
 
+  clickSearch() {
+    this.searchShow = true;
+    this.searchService.searchList = [];
+  }
+
+  searchClose() {
+    this.searchShow = false;
+  }
   ngOnInit() {}
 
   goToPage(path, data = null) {

src/app/productlist/productlist.page.ts

-import { Component, OnInit } from '@angular/core';
-import { Location } from '@angular/common';
-import { trigger, transition, animate, style } from '@angular/animations';
-import { Router, ActivatedRoute, NavigationExtras } from '@angular/router';
-import { ProductsService } from './../../config/products.service';
-import { ServiceService } from './../../config/service.service';
-import { SearchService } from './../../config/search.service';
+import { Component, OnInit } from "@angular/core";
+import { Location } from "@angular/common";
+import { trigger, transition, animate, style } from "@angular/animations";
+import { Router, ActivatedRoute, NavigationExtras } from "@angular/router";
+import { ProductsService } from "./../../config/products.service";
+import { ServiceService } from "./../../config/service.service";
+import { SearchService } from "./../../config/search.service";
 
 @Component({
-  selector: 'app-productlist',
-  templateUrl: './productlist.page.html',
-  styleUrls: ['./productlist.page.scss'],
+  selector: "app-productlist",
+  templateUrl: "./productlist.page.html",
+  styleUrls: ["./productlist.page.scss"],
   animations: [
-    trigger('slideInOut', [
-      transition(':enter', [
-        style({ transform: 'translateY(100%)' }),
-        animate('200ms ease-in', style({ transform: 'translateY(0%)' }))
+    trigger("slideInOut", [
+      transition(":enter", [
+        style({ transform: "translateY(100%)" }),
+        animate("200ms ease-in", style({ transform: "translateY(0%)" }))
       ]),
-      transition(':leave', [
-        animate('200ms ease-out', style({ transform: 'translateY(100%)' }))
+      transition(":leave", [
+        animate("200ms ease-out", style({ transform: "translateY(100%)" }))
       ])
     ])
   ]
@@ -37,7 +37,7 @@ export class ProductlistPage implements OnInit {
     public service: ServiceService,
     public searchService: SearchService
   ) {
-    this.service.get('params').then(val => {
+    this.service.get("params").then(val => {
       this.data = val;
       console.log(this.data);
       this.prodService.prodList(this.data.uid);
@@ -66,6 +66,7 @@ export class ProductlistPage implements OnInit {
 
   clickSearch() {
     this.searchShow = true;
+    this.searchService.searchList = [];
   }
 
   searchClose() {
@@ -74,7 +75,7 @@ export class ProductlistPage implements OnInit {
 
   prodDetails(index: number) {
     this.prodService.setProd(this.prodService.product[index]);
-    this.router.navigateByUrl('productdetail');
+    this.router.navigateByUrl("productdetail");
     document.body.scrollTop = document.documentElement.scrollTop = 0;
   }
 
@@ -84,10 +85,10 @@ export class ProductlistPage implements OnInit {
     console.log(this.prodService.fav);
     if (state > -1) {
       this.prodService.fav.splice(state, 1);
-      this.prodService.changeFav(index, 'yes');
+      this.prodService.changeFav(index, "yes");
     } else {
       this.prodService.fav.push(index);
-      this.prodService.changeFav(index, 'no');
+      this.prodService.changeFav(index, "no");
     }
     return;
     console.log(this.prodService.fav);
@@ -105,7 +106,7 @@ export class ProductlistPage implements OnInit {
 
   checkFavStatus(index) {
     const state = this.prodService.fav.findIndex(x => x === index);
-    return state > -1 ? 'fav_fill' : 'fav_icon';
+    return state > -1 ? "fav_fill" : "fav_icon";
   }
 
   searchFun(data: string) {
@@ -116,19 +117,19 @@ export class ProductlistPage implements OnInit {
     console.log(datas);
     let data;
     let url;
-    if (datas.type === 'shopper') {
+    if (datas.type === "shopper") {
       data = datas.data;
-      this.service.set('params', data);
-      url = 'productlist';
-    } else if (datas.type === 'category') {
+      this.service.set("params", data);
+      url = "productlist";
+    } else if (datas.type === "category") {
       data = datas.data;
-      this.service.set('params', data);
-      url = 'catstorelist';
+      this.service.set("params", data);
+      url = "catstorelist";
     } else {
       data = datas.data;
       data.size = this.service.splitSep(data.size);
       data.tag = this.service.splitSep(data.tag);
-      (data.color = this.service.splitSep(data.color)), (url = 'productdetail');
+      (data.color = this.service.splitSep(data.color)), (url = "productdetail");
       this.prodService.setProd(data);
     }
     this.searchClose();

src/app/storelist/storelist.page.ts

@@ -4,7 +4,7 @@ import { Router } from "@angular/router";
 import { Location } from "@angular/common";
 import { ServiceService } from "./../../config/service.service";
 import { ShoppersService } from "./../../config/shopper.service";
-
+import { SearchService } from "../../config/search.service";
 @Component({
   selector: "app-storelist",
   templateUrl: "./storelist.page.html",
@@ -32,7 +32,8 @@ export class StorelistPage implements OnInit {
     public router: Router,
     public location: Location,
     public service: ServiceService,
-    public shopperService: ShoppersService
+    public shopperService: ShoppersService,
+    private searchService: SearchService
   ) {
     this.service.get("params").then(val => {
       this.data = val;
@@ -54,6 +55,7 @@ export class StorelistPage implements OnInit {
 
   clickSearch() {
     this.searchShow = true;
+    this.searchService.searchList = [];
   }
 
   searchClose() {