update

.editorconfig

+# EditorConfig helps developers define and maintain consistent coding styles between different editors and IDEs
+# editorconfig.org
+
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+
+# We recommend you to keep these unchanged
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false
\ No newline at end of file

.gitignore

+# Specifies intentionally untracked files to ignore when using Git
+# http://git-scm.com/docs/gitignore
+
+*~
+*.sw[mnpcod]
+*.log
+*.tmp
+*.tmp.*
+log.txt
+*.sublime-project
+*.sublime-workspace
+.vscode/
+npm-debug.log*
+
+.idea/
+.sourcemaps/
+.sass-cache/
+.tmp/
+.versions/
+coverage/
+dist/
+node_modules/
+tmp/
+temp/
+hooks/
+platforms/
+plugins/
+plugins/android.json
+plugins/ios.json
+www/
+$RECYCLE.BIN/
+
+.DS_Store
+Thumbs.db
+UserInterfaceState.xcuserstate

README.md

+### :point_right: This starter repo has moved to the [ionic-team/starters](https://github.com/ionic-team/starters/tree/master/ionic-angular/official/sidemenu) repo! :point_left:

config.xml

+<?xml version='1.0' encoding='utf-8'?>
+<widget id="com.vmig.in" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
+    <name>Vmig</name>
+    <description>Online Salon Appointment Booking Solution.</description>
+    <author email="[email protected]" href="http://vmig.kz">Vmig</author>
+    <content src="index.html" />
+    <access origin="*" />
+    <allow-intent href="http://*/*" />
+    <allow-intent href="https://*/*" />
+    <allow-intent href="tel:*" />
+    <allow-intent href="sms:*" />
+    <allow-intent href="mailto:*" />
+    <allow-intent href="geo:*" />
+    <preference name="ScrollEnabled" value="false" />
+    <preference name="android-minSdkVersion" value="23" />
+    <preference name="BackupWebStorage" value="none" />
+    <preference name="SplashMaintainAspectRatio" value="true" />
+    <preference name="FadeSplashScreenDuration" value="300" />
+    <preference name="SplashShowOnlyFirstTime" value="false" />
+    <preference name="SplashScreen" value="screen" />
+    <preference name="SplashScreenDelay" value="7000" />
+    <preference name="android-targetSdkVersion" value="26" />
+    <platform name="android">
+        <allow-intent href="market:*" />
+        <icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />
+        <icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png" />
+        <icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png" />
+        <icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png" />
+        <icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png" />
+        <icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
+        <splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png" />
+        <splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png" />
+        <splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png" />
+        <splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png" />
+        <splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png" />
+        <splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png" />
+        <splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png" />
+        <splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png" />
+        <splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png" />
+        <splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png" />
+        <splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png" />
+        <splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png" />
+    </platform>
+    <platform name="ios">
+        <allow-intent href="itms:*" />
+        <allow-intent href="itms-apps:*" />
+        <icon height="57" src="resources/ios/icon/icon.png" width="57" />
+        <icon height="114" src="resources/ios/icon/[email protected]" width="114" />
+        <icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
+        <icon height="80" src="resources/ios/icon/[email protected]" width="80" />
+        <icon height="120" src="resources/ios/icon/[email protected]" width="120" />
+        <icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
+        <icon height="100" src="resources/ios/icon/[email protected]" width="100" />
+        <icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
+        <icon height="120" src="resources/ios/icon/[email protected]" width="120" />
+        <icon height="180" src="resources/ios/icon/[email protected]" width="180" />
+        <icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
+        <icon height="144" src="resources/ios/icon/[email protected]" width="144" />
+        <icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
+        <icon height="152" src="resources/ios/icon/[email protected]" width="152" />
+        <icon height="167" src="resources/ios/icon/[email protected]" width="167" />
+        <icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
+        <icon height="58" src="resources/ios/icon/[email protected]" width="58" />
+        <icon height="87" src="resources/ios/icon/[email protected]" width="87" />
+        <icon height="1024" src="resources/ios/icon/icon-1024.png" width="1024" />
+        <splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
+        <splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
+        <splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
+        <splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208" />
+        <splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
+        <splash height="2048" src="resources/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
+        <splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" />
+        <splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
+        <splash height="2732" src="resources/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
+        <splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768" />
+        <splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
+        <splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
+        <splash height="2732" src="resources/ios/splash/Default@2x~universal~anyany.png" width="2732" />
+    </platform>
+    <plugin name="cordova-plugin-camera" spec="^4.0.3" />
+    <plugin name="cordova-plugin-device" spec="^1.1.4" />
+    <plugin name="cordova-plugin-geolocation" spec="^4.0.1">
+        <variable name="GEOLOCATION_USAGE_DESCRIPTION" value="To locate you" />
+    </plugin>
+    <plugin name="cordova-plugin-inappbrowser" spec="^3.0.0" />
+    <plugin name="cordova-plugin-ionic-webview" spec="^1.2.1" />
+    <plugin name="cordova-plugin-request-location-accuracy" spec="^2.2.3" />
+    <plugin name="cordova-plugin-splashscreen" spec="^4.0.3" />
+    <plugin name="ionic-plugin-keyboard" spec="^2.2.1" />
+    <plugin name="uk.co.workingedge.phonegap.plugin.launchnavigator" spec="^3.2.2" />
+    <plugin name="cordova-android-support-gradle-release" spec="^1.4.4">
+        <variable name="ANDROID_SUPPORT_VERSION" value="23.+" />
+    </plugin>
+    <plugin name="cordova-plugin-whitelist" spec="^1.3.1" />
+    <plugin name="cordova-plugin-nativegeocoder" spec="^3.1.2" />
+    <plugin name="onesignal-cordova-plugin" spec="^2.4.5" />
+    <engine name="android" spec="6.3.0" />
+</widget>

ionic.config.json

+{
+  "name": "haircutbox",
+  "integrations": {
+    "cordova": {}
+  },
+  "type": "ionic-angular"
+}

package.json

+{
+  "name": "haircutbox",
+  "version": "0.0.1",
+  "author": "Ionic Framework",
+  "homepage": "http://ionicframework.com/",
+  "private": true,
+  "scripts": {
+    "clean": "ionic-app-scripts clean",
+    "build": "ionic-app-scripts build",
+    "lint": "ionic-app-scripts lint",
+    "ionic:build": "ionic-app-scripts build",
+    "ionic:serve": "ionic-app-scripts serve"
+  },
+  "dependencies": {
+    "@angular/common": "5.0.0",
+    "@angular/compiler": "5.0.0",
+    "@angular/compiler-cli": "5.0.0",
+    "@angular/core": "^5.0.0",
+    "@angular/forms": "5.0.0",
+    "@angular/http": "5.0.0",
+    "@angular/platform-browser": "5.0.0",
+    "@angular/platform-browser-dynamic": "5.0.0",
+    "@angular/router": "^7.2.14",
+    "@ionic-native/camera": "^4.17.0",
+    "@ionic-native/core": "4.3.2",
+    "@ionic-native/geolocation": "^4.20.0",
+    "@ionic-native/in-app-browser": "^5.3.0",
+    "@ionic-native/launch-navigator": "^5.3.0",
+    "@ionic-native/location-accuracy": "^4.17.0",
+    "@ionic-native/native-geocoder": "^4.20.0",
+    "@ionic-native/onesignal": "^4.17.0",
+    "@ionic-native/splash-screen": "4.3.2",
+    "@ionic-native/status-bar": "4.3.2",
+    "@ionic/storage": "2.1.3",
+    "@ngx-translate/core": "^9.1.1",
+    "@ngx-translate/http-loader": "^2.0.1",
+    "cordova-admobsdk": "^7.37.0",
+    "cordova-android": "6.3.0",
+    "cordova-ios": "4.4.0",
+    "cordova-plugin-actionsheet": "^2.2.2",
+    "cordova-plugin-add-swift-support": "^2.0.2",
+    "cordova-plugin-admobpro-firebase": "^2.37.0",
+    "cordova-plugin-camera": "^4.0.3",
+    "cordova-plugin-device": "^1.1.4",
+    "cordova-plugin-extension": "^1.5.4",
+    "cordova-plugin-geolocation": "^4.0.1",
+    "cordova-plugin-inappbrowser": "^3.0.0",
+    "cordova-plugin-ionic-webview": "^1.2.1",
+    "cordova-plugin-nativegeocoder": "^3.1.2",
+    "cordova-plugin-request-location-accuracy": "^2.2.3",
+    "cordova-plugin-splashscreen": "^4.0.3",
+    "cordova-plugin-whitelist": "^1.3.1",
+    "ionic": "^3.9.2",
+    "ionic-angular": "3.9.2",
+    "ionic-plugin-keyboard": "^2.2.1",
+    "ionic3-star-rating": "^1.1.4",
+    "ionicons": "3.0.0",
+    "jquery": "^3.4.1",
+    "onesignal-cordova-plugin": "^2.4.5",
+    "rxjs": "5.5.2",
+    "sw-toolbox": "3.6.0",
+    "uk.co.workingedge.phonegap.plugin.launchnavigator": "^3.2.2",
+    "zone.js": "0.8.18"
+  },
+  "devDependencies": {
+    "@ionic/app-scripts": "^3.2.3",
+    "@types/googlemaps": "^3.30.19",
+    "typescript": "2.4.2",
+    "ws": "3.3.2",
+    "cordova-android-support-gradle-release": "^1.4.4"
+  },
+  "description": "An Ionic project",
+  "cordova": {
+    "plugins": {
+      "cordova-plugin-camera": {},
+      "ionic-plugin-keyboard": {},
+      "cordova-plugin-whitelist": {},
+      "cordova-plugin-device": {},
+      "cordova-plugin-splashscreen": {},
+      "cordova-plugin-ionic-webview": {},
+      "cordova-plugin-request-location-accuracy": {},
+      "cordova-plugin-geolocation": {
+        "GEOLOCATION_USAGE_DESCRIPTION": "To locate you"
+      },
+      "cordova-plugin-nativegeocoder": {},
+      "onesignal-cordova-plugin": {},
+      "uk.co.workingedge.phonegap.plugin.launchnavigator": {},
+      "cordova-plugin-inappbrowser": {},
+      "cordova-plugin-admobpro-firebase": {
+        "PLAY_SERVICES_VERSION": "16.0.0"
+      },
+      "cordova-android-support-gradle-release": {
+        "ANDROID_SUPPORT_VERSION": "23.+"
+      }
+    },
+    "platforms": [
+      "android"
+    ]
+  }
+}
\ No newline at end of file

resources/README.md

+These are Cordova resources. You can replace icon.png and splash.png and run
+`ionic cordova resources` to generate custom icons and splash screens for your
+app. See `ionic cordova resources --help` for details.
+
+Cordova reference documentation:
+
+- Icons: https://cordova.apache.org/docs/en/latest/config_ref/images.html
+- Splash Screens: https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-splashscreen/

resources/icon.png.md5

+57993656f105732be5f5e4a9b7b797b8
\ No newline at end of file

resources/splash.png.md5

+fec59aa43a02f7aa055f06d923601500
\ No newline at end of file

src/app/app.component.ts

+import { Component, ViewChild, ElementRef } from '@angular/core';
+import { Nav, Platform, Events } from 'ionic-angular';
+import { StatusBar } from '@ionic-native/status-bar';
+import { SplashScreen } from '@ionic-native/splash-screen';
+import { LocationAccuracy } from '@ionic-native/location-accuracy';
+import { Geolocation } from '@ionic-native/geolocation';
+import { Storage } from '@ionic/storage';
+import { NativeGeocoder, NativeGeocoderReverseResult, NativeGeocoderForwardResult, NativeGeocoderOptions } from '@ionic-native/native-geocoder';
+import { OneSignal } from '@ionic-native/onesignal';
+import  { user } from '../providers/model/model';
+import {TranslateService} from '@ngx-translate/core';
+import { SubjectService } from '../providers/subject.service';
+import { WebService_lang } from '../providers/web.service';
+import * as $ from 'jquery';
+
+
+@Component({
+  templateUrl: 'app.html'
+})
+export class MyApp {
+  @ViewChild(Nav) nav: Nav;
+  @ViewChild('language') language: ElementRef;
+
+  rootPage: any = "HomePage";
+  device_id:any;
+  local:user;
+  lang =  'en';
+
+  pages: Array<{title: string, component: any}>;
+
+  constructor(public translate: TranslateService,
+     public subjectService: SubjectService,
+     public service_lang: WebService_lang, 
+     public platform: Platform,
+      public statusBar: StatusBar,
+       public splashScreen: SplashScreen,
+       public storage:Storage,
+       /*private geolocation: Geolocation,
+       private locationAccuracy: LocationAccuracy,
+       private nativeGeocoder: NativeGeocoder, */
+       public oneSignal: OneSignal,
+        public events: Events) {
+
+    this.subjectService.getLangData().subscribe(langData => {
+      console.log(langData);
+      this.lang = this.service_lang.getLocalStorageItem('lang');
+      console.log(this.lang);
+      if (this.lang) {
+        translate.setDefaultLang(this.lang);
+        translate.use(this.lang);
+      }
+    });
+
+    
+
+
+    const lang  = this.service_lang.getLocalStorageItem('lang');
+    console.log(lang);
+
+    if(lang !== undefined){
+      this.lang = lang;
+    }
+
+    if(this.lang === 'ru') {
+      $('body').addClass('ru');
+    } else {
+      $('body').removeClass('ru');
+    }
+
+    this.lang = 'en';
+
+    translate.setDefaultLang(this.lang);
+
+    // the lang to use, if the lang isn't available, it will use the current loader to get them
+
+    translate.use(this.lang);
+
+    // the lang to use, if the lang isn't available, it will use the current loader to get them
+    events.subscribe('user:created', (user, time) => {
+      console.log(user);
+      this.local = user;
+    });
+    this.initializeApp();
+
+    // used for an example of ngFor and navigation
+/*    this.pages = [
+      { title: 'Home', component: HomePage },
+      { title: 'List', component: ListPage }
+    ];*/
+
+  }
+
+  ngOnInit() {
+    this.language.nativeElement.value = this.lang === 'ru' ? 1 : 0;
+  }
+
+  changeLang(val: string) {
+    console.log("selected"+val);
+    if (val == '1') {
+      $('body').addClass('ru');
+      this.lang = 'ru';
+      this.service_lang.setLocalStorageItem('lang', 'ru');
+      this.subjectService.changeLang('ru');
+    } else {
+      $('body').removeClass('ru');
+      this.lang = 'en';
+      this.service_lang.setLocalStorageItem('lang', 'en');
+      this.subjectService.changeLang('en');
+    }
+    
+  }
+
+  initializeApp() {
+    this.platform.ready().then(() => {
+      // Okay, so the platform is ready and our plugins are available.
+      // Here you can do any higher level native things you might need.
+      this.statusBar.styleDefault();
+      this.splashScreen.hide();
+      this.enable_location()
+      this.storage.get('user_data').then(data => {
+        console.log(data)
+        if (data) {
+          this.local = data
+        }
+      })
+      this.triggerNotification();
+    });
+  }
+
+  openPage(page) {
+    // Reset the content nav to have just this page
+    // we wouldn't want the back button to show in this scenario
+    this.nav.setRoot(page);
+  }
+
+  open_page(page){
+   this.nav.push(page);
+  }
+
+  enable_location() {
+
+    var current_loc = 'Infopark, Kakkanad, Ernakulam';
+    var current_lat_lng = {'lat' : 10.0120 ,'lng' :76.3608}
+
+    this.storage.set('current',{'location':current_loc,'lat_lng':current_lat_lng});
+    this.storage.set('lat_lng', {'lat' : current_lat_lng.lat ,'lng' :current_lat_lng.lng} );
+
+    /*let optionss: NativeGeocoderOptions = {
+        useLocale: true,
+        maxResults: 5
+    };
+
+
+
+
+
+
+    this.geolocation.getCurrentPosition().then((resp) => {
+       //console.log(resp);
+       //console.log(resp);
+       this.nativeGeocoder.reverseGeocode(resp.coords.latitude, resp.coords.longitude, optionss).then((result: NativeGeocoderReverseResult[]) => console.log(JSON.stringify(result[0]))).catch((error: any) => console.log(error));
+      }).catch((error) => {
+        console.log('Error getting location', error);
+      });
+
+      let watch = this.geolocation.watchPosition();
+      var This = this;
+      watch.subscribe((data) => {
+        console.log(data);
+         this.nativeGeocoder.reverseGeocode(data.coords.latitude, data.coords.longitude, optionss).then((result: NativeGeocoderReverseResult[]) => {
+           /*This.storage.set('current_loc',result[0].subLocality+", "+result[0].locality+", "+result[0].subAdministrativeArea+", "+result[0].administrativeArea+", "+result[0].countryName);
+            This.storage.set('current_lat_lng', {'lat' : data.coords.latitude ,'lng' :data.coords.longitude} );*/
+
+            /*var current_loc = result[0].subLocality+", "+result[0].locality+", "+result[0].subAdministrativeArea+", "+result[0].administrativeArea+", "+result[0].countryName;
+            var current_lat_lng = {'lat' : data.coords.latitude ,'lng' :data.coords.longitude};
+
+            This.storage.set('current',{'location':current_loc,'lat_lng':current_lat_lng});
+            //This.openPage("HomePage");
+
+           console.log(JSON.stringify(result[0]))
+         }).catch((error: any) => console.log(error));
+
+         //"countryCode":"IN","countryName":"India","postalCode":"682030","administrativeArea":"Kerala","subAdministrativeArea":"Ernakulam","locality":"Kakkanad","subLocality":"Infopark"
+       // data can be a set of coordinates, or an error (if an error occurred).
+       // data.coords.latitude
+       // data.coords.longitude
+      });
+
+
+
+    console.log("map called");
+    let options = {
+      enableHighAccuracy: true
+    };
+    this.locationAccuracy.canRequest().then((res: boolean) => {
+      if (res) {
+        console.log(this.locationAccuracy.REQUEST_PRIORITY_HIGH_ACCURACY);
+        let location_accuracyy = Number(this.locationAccuracy.REQUEST_PRIORITY_HIGH_ACCURACY);
+        let location_accuracy = location_accuracyy.toString();
+        this.locationAccuracy.request(location_accuracyy).then((loc) => {
+          this.geolocation.getCurrentPosition().then(pos => {
+            console.log('lat: ' + pos.coords.latitude + ', lon: ' + pos.coords.longitude);
+            console.log(pos);
+            this.storage.set('lat_lng', {'lat' : pos.coords.latitude ,'lng' :pos.coords.longitude} );
+             
+    
+          }).catch((err) => {
+             alert(err);
+          })
+        }, (error) => {
+              alert(error); 
+          })
+      }
+    },(error)=>{
+      console.log(error);
+    })*/
+  }
+
+  triggerNotification() {
+    var This = this;
+    this.oneSignal.startInit('cd0f950d-2b1c-4c16-949d-bff73a8c1f56', '255038393105');
+
+    this.oneSignal.registerForPushNotifications();
+
+    this.oneSignal.inFocusDisplaying(this.oneSignal.OSInFocusDisplayOption.None);
+
+    this.oneSignal.getIds().then((ids) => {
+      console.log('getIds: ' + JSON.stringify(ids));
+      this.device_id =ids;
+      console.log(this.device_id.userId);
+      This.storage.set('get_deviceId',this.device_id);
+    });
+
+    console.log('here i');
+
+    this.storage.get('get_deviceId').then(data => {
+      console.log("asdasdasdsad");
+      console.log(data);
+      if(data){
+        this.device_id = data.userId;
+        console.log(this.device_id.userId);
+      }
+    })
+
+    this.oneSignal.handleNotificationReceived().subscribe((msg) => {
+      console.log('Notification received');
+      console.dir(msg);
+    }); 
+
+    this.oneSignal.handleNotificationOpened().subscribe((msg) => {
+      console.log('Notification opened');
+       this.nav.push('HomePage');
+     /*console.log(JSON.stringify(msg));
+      var pool_id = msg.notification.payload.additionalData.pool_id;
+      if(pool_id)
+        this.nav.setRoot('QuoteDetailsPage',{'pool_id' : pool_id,'from_push' : false});*/
+     //console.log(this.event_id);
+     //this.detail(this.event_id);
+    });
+     this.oneSignal.endInit();
+   }
+
+   login(){
+    this.storage.remove('user_data');
+    this.storage.remove('token');
+    this.local = undefined;
+    this.nav.setRoot("LoginPage");
+   }
+
+
+   
+ 
+}

src/app/app.html

+<ion-menu [content]="content">
+    <ion-content class="sidemenu_main">
+        <div class="language_change">
+                <ion-row>
+                        <ion-col col-6>
+                            <p>{{'common.Choose_Language' | translate}}</p>
+                        </ion-col>
+                        <ion-col col-6>
+                            <select id="translation" class="translation" #language (change)="changeLang($event.target.value)">
+                                <option value="0" selected>EN</option>
+                                <option value="1">RU</option>
+                            </select>
+                        </ion-col>
+                    </ion-row>
+                </div>
+        <div class="sidemenu_main" *ngIf="local">
+            
+            <div class="sidemnu_profile_circle">
+                <img [src]="local.profile_pic" onError="this.src='assets/imgs/spa.jpg';">
+            </div>
+            <h6>{{'common.Hi' | translate}}</h6>
+            <h4>{{local.firstname}} {{local.lastname}}</h4>
+            <ul>
+                <li (click)="openPage('HomePage')" menuClose>
+                    {{'common.Home' | translate}}</li>
+
+                <li (click)="open_page('ProfilePage')" menuClose>
+                   {{'common.My_Profile' | translate}}</li>
+
+                <li (click)="open_page('MybookingPage')" menuClose>
+                    {{'common.My_Booking' | translate}}</li>
+
+                <!-- <li (click)="open_page('NotificationPage')" menuClose>
+                    <ion-icon name="md-arrow-dropright"></ion-icon>Notifications</li> -->
+
+                <!-- <li (click)="open_page('MessagePage')" menuClose>
+                    <ion-icon name="md-arrow-dropright"></ion-icon>My Chats</li> -->
+
+                <li (click)="login()" menuClose>
+                    {{'common.Logout' | translate}}</li>
+
+            </ul>
+        </div>
+
+        <div class="sidemenu_main" *ngIf="!local">
+            <div class="sidemnu_profile_circle">
+
+            </div>
+            <h6>{{'common.Hi' | translate}} </h6>
+            <h4> {{'common.Guest' | translate}}</h4>
+            <ul>
+                <li (click)="openPage('HomePage')" menuClose>
+                    {{'common.Home' | translate}}</li>
+
+                <li menuClose (click)="openPage('LoginPage')">
+                    {{'common.Sign_in' | translate}}
+                </li>
+                <li menuClose (click)="openPage('SignupPage')">
+                    {{'common.Sign_Up' | translate}}
+                </li>
+                <li menuClose (click)="openPage('ForgotPage')">
+                   {{'common.Forgot_Password' | translate}}
+                </li>
+            </ul>
+        </div>
+
+
+    </ion-content>
+</ion-menu>
+<!-- Disable swipe-to-go-back because it's poor UX to combine STGB with side menus -->
+<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>
\ No newline at end of file

src/app/app.module.ts

+import { BrowserModule } from '@angular/platform-browser';
+import { ErrorHandler, NgModule } from '@angular/core';
+import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
+ import { Camera } from '@ionic-native/camera';
+import { LocationAccuracy } from '@ionic-native/location-accuracy';
+import { Geolocation } from '@ionic-native/geolocation';
+import { NativeGeocoder } from '@ionic-native/native-geocoder';
+import { HttpClientModule,HttpClient } from '@angular/common/http';
+import { HttpModule, Http } from '@angular/http';
+import { IonicStorageModule } from '@ionic/storage';
+import { OneSignal } from '@ionic-native/onesignal';
+import { MyApp } from './app.component';
+import { StatusBar } from '@ionic-native/status-bar';
+import { SplashScreen } from '@ionic-native/splash-screen';
+import { CommonProvider } from '../providers/common/common';
+import { LaunchNavigator, LaunchNavigatorOptions } from '@ionic-native/launch-navigator/ngx';
+import { InAppBrowser } from '@ionic-native/in-app-browser/ngx';
+import { TranslateModule, TranslateLoader} from '@ngx-translate/core';
+import {TranslateHttpLoader} from '@ngx-translate/http-loader';
+import { SubjectService } from './../providers/subject.service';
+import { WebService_lang } from './../providers/web.service';
+
+
+
+export function HttpLoaderFactory(http: HttpClient) {
+  return new TranslateHttpLoader(http, './assets/i18n/', '.json');
+}
+
+@NgModule({
+  declarations: [
+    MyApp
+  ],
+  imports: [
+    BrowserModule,  
+    IonicModule.forRoot(MyApp), 
+    TranslateModule.forRoot(),
+    IonicStorageModule.forRoot(),
+    HttpModule,
+    HttpClientModule,
+    TranslateModule.forRoot({
+      loader: {
+        provide: TranslateLoader,
+        useFactory: HttpLoaderFactory,
+        deps: [HttpClient]
+      }
+    })
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    MyApp
+  ],
+  providers: [
+    StatusBar,
+    SplashScreen,
+    LocationAccuracy,
+    Geolocation,
+    NativeGeocoder,
+    Camera,
+    OneSignal,
+    WebService_lang,
+    SubjectService,
+    {provide: ErrorHandler, useClass: IonicErrorHandler},
+    CommonProvider,
+    LaunchNavigator,
+    InAppBrowser
+  ]
+})
+export class AppModule {}

src/app/main.ts

+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+
+import { AppModule } from './app.module';
+
+platformBrowserDynamic().bootstrapModule(AppModule);

src/assets/i18n/en.json

+{
+    "common":{
+        "Choose_Language":"Choose Language",
+        "User_Credential":"User Credential",
+        "Password":"Password",
+        "Username":"Username",
+        "Email_ID":"Email ID",
+        "Phone_No":"Phone No",
+        "Confirm_Password":"Confirm Password",
+        "enter_your_address":"Enter your address",
+        "Pick_date":"Pick date",
+        "Pick_time":"Pick time",
+        "First_name":"First name",
+        "Last_name":"Last name",
+        "Guest":"Guest",
+        "on":"on",
+        "at":"at",
+        "English":"English",
+        "Russian":"Russian",
+        "Shop_Details":"Shop Details",
+        "Book":"Book",
+        "Working_Hours":"Working Hours",
+        "Services_Available":"Services Available",
+        "Gallery":"Gallery",
+        "Reviews":"Reviews",
+        "Filter":"Filter",
+        "Services":"Services",
+        "Offers":"Offers",
+        "Gender":"Gender",
+        "Location":"Location",
+        "Female":"Female",
+        "Unisex":"Unisex",
+        "Forgot_Password":"ForgotPassword",
+        "Invalid_Email_id,_kindly_retype_the_correct_mail_id":"Invalid Email id, kindly retype the correct mail id",
+        "Submit":"Submit",
+        "to_signup":"to signup",
+        "Home":"Home",
+        "Current_Location":"Current Location",
+        "No_Shops_available_in_this_city":"No Shops available in this city",
+        "List":"List",
+        "You_navigated_here_from":"You navigated here from",
+        "Invalid_Credential":"Invalid Credential",
+        "Login":"Login",
+        "Forgot_Password?":"Forgot Password",
+        "My_Chats":"My Chats",
+        "Tomiris_Abesheva":"Tomiris Abesheva",
+        "Hi,_How_are_you?":"Hi, How are you?",
+        "Aidar_Smagulov":"Aidar Smagulov",
+        "Diana_Smagulova":"Diana Smagulova",
+        "PM":"PM",
+        "Kamilla_Lee":"Kamilla Lee",
+        "My_Booking":"My Booking",
+        "Bookings":"Bookings",
+        "Completed":"Completed",
+        "Date":"Date",
+        "Time":"Time",
+        "Total_Amount":"Total Amount",
+        "Status":"Status",
+        "COLLECT_ITEM":"COLLECT ITEM",
+        "Notifications":"Notifications",
+        "Edit_Profile":"Edit Profile",
+        "First_Name_Required":"First Name Required",
+        "Lastname_Name_Required":"Lastname Name Required",
+        "Please_input_valid_email_ID":"Please input valid email ID",
+        "Male":"Male",
+        "Please_input_valid_Mobile_No":"Please input valid Mobile No",
+        "SAVE":"SAVE",
+        "rate":"rate",
+        "Booking":"Booking",
+        "Choose_your_booking_date":"Choose your booking date",
+        "Choose_your_booking_time":"Choose your booking time",
+        "Choose_your_services":"Choose your services",
+        "Total_Fare":"Total Fare",
+        "Apply":"Apply",
+        "shop":"shop",
+        "Username_is_required":"Username is required",
+        "Enter_a_valid_Email":"Enter a valid Email",
+        "Enter_a_valid_Phone_no":"Enter a valid Phone no",
+        "Password_length_is_6_character":"Password length is 6 character",
+        "Password_Mismatch":"Password Mismatch",
+        "I_accept_terms_&_condition":"I accept terms & condition",
+        "Please_accept_condition":"Please accept condition",
+        "Sign_Up":"Sign Up",
+        "Sign_in":"Sign in",
+        "Already_had_an_account?":"Already had an account?",
+        "Minimum_6_characters_required":"Minimum 6 characters required",
+        "Are_you_new_to_VMig?":"Are you new to VMig?",
+        "Click_here":"Click here",
+        "Success!":"Success!",
+        "Your_booking_has_been_confirmed":"Your booking has been confirmed",
+        "Booking_ID_is":"Booking ID is",
+        "Go_to_Home":"Go to Home",
+        "My_Profile":"My Profile",
+        "Logout":"Logout",
+        "Hi":"Hi"
+    }
+}
\ No newline at end of file

src/assets/i18n/ru.json

+{
+    "common":{
+        "Choose_Language":"Выберите язык",
+        "User_Credential":"Учетные данные пользователя",
+        "Password":"пароль",
+        "Username":"имя пользователя",
+        "Email_ID":"Эл. адрес",
+        "Phone_No":"Номер телефона",
+        "Confirm_Password":"Подтвердите Пароль",
+        "enter_your_address":"Введите свой адрес",
+        "Pick_date":"Выберите дату",
+        "Pick_time":"Выбрать время",
+        "First_name":"Имя",
+        "Last_name":"Фамилия",
+        "Guest":"гость",
+        "on":"на",
+        "at":"в",
+        "English":"английский",
+        "Russian":"русский",
+        "Shop_Details":"О Салоне",
+        "Book":"Запись",
+        "Working_Hours":"Рабочий График",
+        "Services_Available":"Доступные Услуги",
+        "Gallery":"Галерея",
+        "Reviews":"Отзывы",
+        "Filter":"Фильтр",
+        "Services":"Услуги",
+        "Offers":"Акций",
+        "Gender":"Пол",
+        "Location":"Местоположение",
+        "Female":"Женский",
+        "Unisex":"Унисекс",
+        "Forgot_Password":"Забыл пароль",
+        "Invalid_Email_id,_kindly_retype_the_correct_mail_id":"Проверьте правильность email",
+        "Submit":"Отправить",
+        "to_signup":"Для регистраций",
+        "Home":"Главная",
+        "Current_Location":"Нынешнее Местоположение",
+        "No_Shops_available_in_this_city":"Нет доступных салонов в этом городе",
+        "List":"Лист",
+        "You_navigated_here_from":"Вы пришли сюда из",
+        "Invalid_Credential":"Неверные Символы",
+        "Login":"Логин",
+        "My_Chats":"Мой чат",
+        "Tomiris_Abesheva":"Томирис Абашева",
+        "Hi,_How_are_you?":"Привет, как у вас дела?",
+        "Aidar_Smagulov":"Айдар Смагулов",
+        "Diana_Smagulova":"Диана Смагулова",
+        "PM":"ВЕЧЕРА",
+        "Kamilla_Lee":"Камила Ли",
+        "My_Booking":"Мои Заявки",
+        "Bookings":"Заявки",
+        "Completed":"Завершено",
+        "Date":"Дата",
+        "Time":"Время",
+        "Total_Amount":"Общая Сумма",
+        "Status":"Статус",
+        "COLLECT_ITEM":"СОБРАТЬ ПУНКТ",
+        "Notifications":"Напоминания",
+        "Edit_Profile":"Редактировать Профиль",
+        "First_Name_Required":"Имя (Обязательно)",
+        "Lastname_Name_Required":"Фамилия (Обязательно)",
+        "Please_input_valid_email_ID":"Введите свой email",
+        "Male":"Мужчина",
+        "Please_input_valid_Mobile_No":"Введите свой номер телефона",
+        "SAVE":"СОХРАНИТЬ",
+        "rate":"рейтинг",
+        "Booking":"Заявка",
+        "Choose_your_booking_date":"Выберите день записи",
+        "Choose_your_booking_time":"Выберите время записи",
+        "Choose_your_services":"Выберите услугу",
+        "Total_Fare":"Общий Тариф",
+        "Apply":"Подтвердить",
+        "shop":"салон",
+        "Username_is_required":"Требуется логин",
+        "Enter_a_valid_Email":"Введите свой email",
+        "Enter_a_valid_Phone_no":"Введите свой номер телефона",
+        "Password_length_is_6_character":"Пароль минимум из 6 символов",
+        "Password_Mismatch":"Пароли не совпадают",
+        "I_accept_terms_&_condition":"Я принимаю все условия сервиса",
+        "Please_accept_condition":"Пожалуйста, ознакомьтесь с условиями",
+        "Sign_Up":"Регистрация",
+        "Sign_in":"Войти",
+        "Already_had_an_account?":"У вас уже есть аккаунт?",
+        "Minimum_6_characters_required":"Минимум из 6 символов",
+        "Are_you_new_to_VMig?":"Вы у нас впервые?",
+        "Click_here":"Нажать тут",
+        "Forgot_Password?":"Забыли пароль?",
+        "Success!":"Успешно!",
+        "Your_booking_has_been_confirmed":"Ваша заявка успешно принята",
+        "Booking_ID_is":"Номер Брони",
+        "Go_to_Home":"На Главную",
+        "My_Profile":"Мой профайл",
+        "Logout":"Выйти",
+        "Hi":"Привет"
+    }
+}
\ No newline at end of file

src/index.html

+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+<head>
+  <meta charset="UTF-8">
+  <title>VMig</title>
+  <meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
+  <meta name="format-detection" content="telephone=no">
+  <meta name="msapplication-tap-highlight" content="no">
+
+  <link rel="icon" type="image/x-icon" href="assets/icon/favicon.ico">
+  <link rel="manifest" href="manifest.json">
+  <meta name="theme-color" content="#4e8ef7">
+  
+  <!-- add to homescreen for ios -->
+  <meta name="apple-mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-status-bar-style" content="black">
+<script src="https://maps.googleapis.com/maps/api/js?libraries=places&key=AIzaSyBniwyiEPSjS9IUvbhBmS0ampJkzE2cSS0"></script>
+  <!-- cordova.js required for cordova apps -->
+  <script src="cordova.js"></script>
+
+  <!-- un-comment this code to enable service worker
+  <script>
+    if ('serviceWorker' in navigator) {
+      navigator.serviceWorker.register('service-worker.js')
+        .then(() => console.log('service worker installed'))
+        .catch(err => console.error('Error', err));
+    }
+  </script>-->
+
+  <link href="build/main.css" rel="stylesheet">
+
+</head>
+<body>
+
+  <!-- Ionic's root component and where the app will load -->
+  <ion-app></ion-app>
+
+  <!-- The polyfills js is generated during the build process -->
+  <script src="build/polyfills.js"></script>
+
+  <!-- The vendor js is generated during the build process
+       It contains all of the dependencies in node_modules -->
+  <script src="build/vendor.js"></script>
+
+  <!-- The main bundle js is generated during the build process -->
+  <script src="build/main.js"></script>
+  
+
+</body>
+</html>

src/manifest.json

+{
+  "name": "Ionic",
+  "short_name": "Ionic",
+  "start_url": "index.html",
+  "display": "standalone",
+  "icons": [{
+    "src": "assets/imgs/logo.png",
+    "sizes": "512x512",
+    "type": "image/png"
+  }],
+  "background_color": "#4e8ef7",
+  "theme_color": "#4e8ef7"
+}
\ No newline at end of file

src/pages/book/book.html

+<!--
+  Generated template for the BookPage page.
+
+  See http://ionicframework.com/docs/components/#navigation for more info on
+  Ionic pages and navigation.
+-->
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>book</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
+
+<ion-content padding>
+
+</ion-content>

src/pages/book/book.module.ts

+import { NgModule } from '@angular/core';
+import { IonicPageModule } from 'ionic-angular';
+import { BookPage } from './book';
+
+@NgModule({
+  declarations: [
+    BookPage,
+  ],
+  imports: [
+    IonicPageModule.forChild(BookPage),
+  ],
+})
+export class BookPageModule {}

src/pages/book/book.scss

+page-book {
+
+}

src/pages/book/book.ts

+import { Component } from '@angular/core';
+import { IonicPage, NavController, NavParams } from 'ionic-angular';
+
+/**
+ * Generated class for the BookPage page.
+ *
+ * See https://ionicframework.com/docs/components/#navigation for more info on
+ * Ionic pages and navigation.
+ */
+
+@IonicPage()
+@Component({
+  selector: 'page-book',
+  templateUrl: 'book.html',
+})
+export class BookPage {
+
+  constructor(public navCtrl: NavController, public navParams: NavParams) {
+  }
+
+  ionViewDidLoad() {
+    console.log('ionViewDidLoad BookPage');
+  }
+
+}

src/pages/chat/chat.html

+<ion-header class="theme_background">
+    <button ion-button class="nav_btn floatLeft" (click)="back()">
+      <ion-icon name="arrow-back"></ion-icon>
+  </button>
+    <div class="nav_header_title floatLeft">
+        <h5>Sandeep Patnaik</h5>
+    </div>
+    <div class="clear"></div>
+</ion-header>
+<ion-content padding>
+    <div class="chat_chat_wrap">
+        <ul>
+            <li class="chat_received">
+                <div class="chat_message_photo"></div>
+                <div class="chat_message_content">
+                    <p> lorem ipsum content</p>
+                    <span>26 Aug</span><span>02:00pm</span>
+
+                </div>
+                <div class="clear"></div>
+            </li>
+            <li class="chat_sented">
+                <div class="chat_message_photo"></div>
+                <div class="chat_message_content">
+                    <p> lorem ipsum content</p>
+                    <p> lorem ipsum content</p>
+                    <span>26 Aug</span><span>02:00pm</span>
+                </div>
+                <div class="clear"></div>
+            </li>
+            <li class="chat_received">
+                <div class="chat_message_photo"></div>
+                <div class="chat_message_content">
+                    <img src="assets/imgs/ian-avatar.png"><br>
+                    <span>26 Aug</span><span>02:00pm</span>
+
+                </div>
+                <div class="clear"></div>
+            </li>
+        </ul>
+    </div>
+
+</ion-content>
+<ion-footer>
+    <div class="chat_chat_type_wrapper">
+        <input class="chat_type_text floatLeft" type="text" placeholder="Type your message here">
+        <button class="chat_send floatRight"><ion-icon name="md-send"></ion-icon></button>
+        <div class="clear"></div>
+    </div>
+</ion-footer>
\ No newline at end of file

src/pages/chat/chat.module.ts

+import { NgModule } from '@angular/core';
+import { IonicPageModule } from 'ionic-angular';
+import { ChatPage } from './chat';
+
+@NgModule({
+  declarations: [
+    ChatPage,
+  ],
+  imports: [
+    IonicPageModule.forChild(ChatPage),
+  ],
+})
+export class ChatPageModule {}

src/pages/chat/chat.scss

+page-chat {
+    .letter_btn {
+        font-size: 18px;
+        font-weight: 300;
+        width: 60px !important;
+        text-transform: capitalize !important;
+    }
+    .chat_chat_wrap {
+        width: 100%;
+    }
+    .chat_chat_wrap ul {
+        margin: 0px;
+        padding: 0px;
+    }
+    .chat_chat_wrap ul li {
+        list-style: none;
+        padding-bottom: 20px;
+    }
+    .chat_message_photo {
+        width: 40px;
+        height: 40px;
+        border-radius: 50%;
+    }
+    .chat_message_photo img {
+        width: 100%;
+        height: 100%;
+        border-radius: 50%;
+        object-fit: cover;
+        object-position: center;
+    }
+    .chat_message_content {
+        position: relative;
+    }
+    .chat_message_content h6 {
+        margin: 0px;
+        padding-bottom: 10px;
+        font-weight: 400;
+    }
+    .chat_message_content p {
+        margin: 0px;
+        padding: 15px;
+        border-radius: 10px;
+        padding-left: 25px;
+        padding-right: 25px;
+        margin-top: 5px;
+        font-weight: 300;
+    }
+    .chat_message_content img {
+        width: 185px;
+        height: 150px;
+        object-fit: cover;
+        object-position: center;
+        border-radius: 10px;
+    }
+    .chat_message_content span {
+        margin: 0px;
+        color: #a4a1a1;
+        font-size: 10px;
+    }
+    .chat_received {}
+    .chat_sented {}
+    .chat_received .chat_message_photo {
+        float: left;
+        background: #f0525f;
+    }
+    .chat_received .chat_message_content {
+        float: left;
+        text-align: right;
+        padding-left: 15px;
+    }
+    .chat_received .chat_message_content img {
+        border: 3px solid #f0525f;
+    }
+    .chat_received .chat_message_content p {
+        background: #f0525f;
+        color: #fff;
+        border-top-left-radius: 0px;
+        border-bottom-right-radius: 0px;
+    }
+    .chat_received .chat_message_content span {
+        margin-right: 10px;
+    }
+    .chat_received .chat_message_content .chat_arrow {
+        width: 30px;
+        height: 30px;
+        position: absolute;
+        bottom: 25px;
+        left: 0px;
+    }
+    .chat_sented .chat_message_photo {
+        float: right;
+        background: #b9bdbb;
+    }
+    .chat_sented .chat_message_content {
+        float: right;
+        text-align: left;
+        padding-right: 15px;
+    }
+    .chat_sented .chat_message_content img {
+        border: 3px solid #b9b9b9;
+    }
+    .chat_sented .chat_message_content p {
+        background: #b9bdbb;
+        color: #fff;
+        border-top-right-radius: 0px;
+        border-bottom-left-radius: 0px;
+    }
+    .chat_sented .chat_message_content span {
+        margin-left: 10px;
+    }
+    .chat_sented .chat_message_content .chat_arrow {
+        width: 30px;
+        height: 30px;
+        position: absolute;
+        top: 0px;
+        right: 0px;
+    }
+    .chat_chat_type_wrapper {
+        width: 100%;
+        position: relative;
+        padding: 15px;
+    }
+    .chat_chat_type_wrapper input {
+        width: calc(100% - 60px);
+        height: 50px;
+        font-size: 16px;
+        border: none;
+        padding-left: 30px;
+        padding-right: 30px;
+        color: #a2a2a2;
+        font-weight: 400;
+        background: #e7e7e7;
+        border-top-right-radius: 10px;
+        border-bottom-left-radius: 10px;
+    }
+    .chat_chat_type_wrapper input::placeholder {
+        color: #a2a2a2;
+    }
+    .chat_send {
+        width: 50px;
+        height: 50px;
+        color: #fff;
+        background: #f0525f;
+        border-radius: 50%;
+        font-size: 24px;
+    }
+    .chat_smiley {}
+    .chat_attach {}
+    .chat_photo {}
+}
\ No newline at end of file

src/pages/chat/chat.ts

+import { Component } from '@angular/core';
+import { IonicPage, NavController, NavParams } from 'ionic-angular';
+
+
+@IonicPage()
+@Component({
+  selector: 'page-chat',
+  templateUrl: 'chat.html',
+})
+export class ChatPage {
+
+  constructor(public navCtrl: NavController, public navParams: NavParams) {
+  }
+
+  ionViewDidLoad() {
+    console.log('ionViewDidLoad ChatPage');
+  }
+
+  back(){
+    this.navCtrl.pop();
+  }
+
+}

src/pages/detailed/detailed.html

+<ion-header class="theme_background">
+    <button ion-button class="nav_btn floatLeft" (click)="back()">
+        <ion-icon name="arrow-back"></ion-icon>
+    </button>
+    <div class="nav_header_title floatLeft">
+        <h5>{{'common.Shop_Details' | translate}}</h5>
+    </div>
+    <div class="clear"></div>
+</ion-header>
+<ion-content>
+    <div *ngIf="result">
+        <ion-card>
+            <div class="shop_banner">
+                <div class="no_service" *ngIf ="result.shop.status == 0">
+                        Салон временно недоступен
+                </div>
+                <img src="{{result.shop.image}}" onError="this.src='assets/imgs/advance-card-tmntr.jpg';" />
+                <div class="shop_detail">
+
+                    <ion-row>
+                        <ion-col col-9 class="p0">
+                            <h4> {{result.shop.shop_name}}</h4>
+                        </ion-col>
+                        <ion-col   col-3 class="p0">  
+                            <div *ngIf ="result.shop.status == 1">
+                                <button ion-button small class="book_nw" (click)="book()">
+                                    {{'common.Book' | translate}}</button>
+                            </div>
+                        </ion-col>
+                    </ion-row>
+                    <ion-row>
+                        <ion-col col-9 class="p0">
+                            <p>
+                                {{result.shop.location}}, {{result.shop.city}}, {{result.shop.state}}, {{result.shop.country}}
+                            </p>
+                        </ion-col>
+                        <ion-col col-3 class="p0">
+                        </ion-col>
+                    </ion-row>
+                </div>
+            </div>
+            <div class="shop_other_details">
+                <p>
+                    {{result.shop.description}}
+                </p>
+                <p><strong>
+                        {{'common.Working_Hours' | translate}}
+                    &nbsp;:&nbsp;</strong> {{result.shop.working_time}}</p>
+            </div>
+        </ion-card>
+        <ion-card>
+            <div class="services">
+                <h6>{{'common.Services_Available' | translate}}</h6>
+                <ion-list *ngFor="let service of result.services">
+                    <ion-row>
+                        <ion-col col-8 class="p0">
+                            <p>{{service.service_name}}</p>
+                        </ion-col>
+                        <ion-col col-4 class="p0 textRight">
+                            <p><strong> <span item-end>{{service.price}}</span></strong></p>
+                        </ion-col>
+                    </ion-row>
+                </ion-list>
+            </div>
+        </ion-card>
+        <ion-card>
+            <div class="services">
+                <h6> {{'common.Gallery' | translate}}</h6>
+                <div class="gallery">
+                    <ion-slides *ngIf="result.gallery" autoplay="1" loop="1" slidesPerView="1.5">
+                        <ion-slide *ngFor="let images of result.gallery">
+                            <img [src]="images.image_path" onError="this.src='assets/imgs/advance-card-tmntr.jpg';" />
+                        </ion-slide>
+                    </ion-slides>
+                </div>
+            </div>
+        </ion-card><!-- 
+        <span (click)="navv()">view map</span> -->
+        <ion-card (click)="navv()" padding>
+            <div #maps id="maps" style="height:300px;"></div>
+              
+        </ion-card>
+        <ion-card *ngIf="result.review">
+            <div class="services">
+                <h6> {{'common.Reviews' | translate}}</h6>
+                <ul class="reviews">
+                    <li *ngFor="let rev of result.review">
+                        <div class="review_pic">
+                            <img [src]="rev.profile_pic" onError="this.src='assets/imgs/advance-card-tmntr.jpg';">
+                        </div>
+                        <div class="review_detail">
+                            <h2>{{rev.username}}</h2>
+                            <p>{{rev.comments}}</p>
+                        </div>
+                        <div class="clear"></div>
+                    </li>
+                </ul>
+            </div>
+        </ion-card>
+    </div>
+</ion-content>
\ No newline at end of file

src/pages/detailed/detailed.module.ts

+import { NgModule } from '@angular/core';
+import { IonicPageModule } from 'ionic-angular';
+import { DetailedPage } from './detailed';
+import { TranslateModule} from '@ngx-translate/core';
+
+@NgModule({
+  declarations: [
+    DetailedPage,
+  ],
+  imports: [
+    IonicPageModule.forChild(DetailedPage),
+    TranslateModule
+  ],
+})
+export class DetailedPageModule {}