Commit 94229b82 by Alen Jose

Merge branch 'alen' into 'master'

Alen See merge request alen/CMC-driver!1
parents 8b60225d f3408bcd
...@@ -81,4 +81,10 @@ ...@@ -81,4 +81,10 @@
<plugin name="cordova-plugin-splashscreen" spec="5.0.2" /> <plugin name="cordova-plugin-splashscreen" spec="5.0.2" />
<plugin name="cordova-plugin-ionic-webview" spec="1.1.19" /> <plugin name="cordova-plugin-ionic-webview" spec="1.1.19" />
<plugin name="cordova-plugin-ionic-keyboard" spec="2.0.5" /> <plugin name="cordova-plugin-ionic-keyboard" spec="2.0.5" />
<plugin name="cordova-plugin-network-information" spec="^2.0.1" />
<plugin name="onesignal-cordova-plugin" spec="^2.4.1" />
<plugin name="cordova-plugin-request-location-accuracy" spec="^2.2.3" />
<plugin name="cordova-plugin-geolocation" spec="^4.0.1">
<variable name="GEOLOCATION_USAGE_DESCRIPTION" value="To locate you" />
</plugin>
</widget> </widget>
...@@ -22,11 +22,22 @@ ...@@ -22,11 +22,22 @@
"@angular/platform-browser": "5.2.11", "@angular/platform-browser": "5.2.11",
"@angular/platform-browser-dynamic": "5.2.11", "@angular/platform-browser-dynamic": "5.2.11",
"@ionic-native/core": "4.7.0", "@ionic-native/core": "4.7.0",
"@ionic-native/geolocation": "^4.8.0",
"@ionic-native/location-accuracy": "^4.8.0",
"@ionic-native/network": "^4.8.0",
"@ionic-native/onesignal": "^4.8.0",
"@ionic-native/splash-screen": "4.7.0", "@ionic-native/splash-screen": "4.7.0",
"@ionic-native/status-bar": "4.7.0", "@ionic-native/status-bar": "4.7.0",
"@ionic/storage": "2.1.3", "@ionic/storage": "2.1.3",
"angularfire2": "^5.0.0-rc.11",
"cordova-plugin-geolocation": "^4.0.1",
"cordova-plugin-network-information": "^2.0.1",
"cordova-plugin-request-location-accuracy": "^2.2.3",
"firebase": "^5.1.0",
"ionic-angular": "3.9.2", "ionic-angular": "3.9.2",
"ionicons": "3.0.0", "ionicons": "3.0.0",
"onesignal-cordova-plugin": "^2.4.1",
"promise-polyfill": "^8.0.0",
"rxjs": "5.5.11", "rxjs": "5.5.11",
"sw-toolbox": "3.6.0", "sw-toolbox": "3.6.0",
"zone.js": "0.8.26" "zone.js": "0.8.26"
...@@ -35,5 +46,15 @@ ...@@ -35,5 +46,15 @@
"@ionic/app-scripts": "3.1.10", "@ionic/app-scripts": "3.1.10",
"typescript": "~2.6.2" "typescript": "~2.6.2"
}, },
"description": "An Ionic project" "description": "An Ionic project",
"cordova": {
"plugins": {
"cordova-plugin-network-information": {},
"onesignal-cordova-plugin": {},
"cordova-plugin-request-location-accuracy": {},
"cordova-plugin-geolocation": {
"GEOLOCATION_USAGE_DESCRIPTION": "To locate you"
}
}
}
} }
import { Component, ViewChild } from '@angular/core'; import { Component, ViewChild } from '@angular/core';
import { Nav, Platform } from 'ionic-angular'; import { Nav, Platform,AlertController,Events } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar'; import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen'; import { SplashScreen } from '@ionic-native/splash-screen';
import { Network } from '@ionic-native/network';
import { HomePage } from '../pages/home/home'; import { OneSignal } from '@ionic-native/onesignal';
import { ListPage } from '../pages/list/list'; import { LocationAccuracy } from '@ionic-native/location-accuracy';
import { Storage } from "@ionic/storage";
import { Myservice } from "../providers/myservice";
import { driver } from "../models/mymodel";
@Component({ @Component({
templateUrl: 'app.html' templateUrl: 'app.html'
}) })
export class MyApp { export class MyApp {
@ViewChild(Nav) nav: Nav; @ViewChild(Nav) nav: Nav;
rootPage: any = HomePage; rootPage: any = "LandingPage";
pages: Array<{title: string, component: any}>; pages: Array<{title: string, component: any}>;
local:driver
constructor(public platform: Platform, public statusBar: StatusBar, public splashScreen: SplashScreen) { constructor(public platform: Platform, public statusBar: StatusBar, public splashScreen: SplashScreen, private network: Network, private alertCtrl: AlertController, private oneSignal: OneSignal, private locationAccuracy: LocationAccuracy, private storage: Storage, private myservice: Myservice, public events: Events) {
this.initializeApp(); this.initializeApp();
// used for an example of ngFor and navigation
this.pages = [
{ title: 'Home', component: HomePage },
{ title: 'List', component: ListPage }
];
} }
initializeApp() { initializeApp() {
this.platform.ready().then(() => { this.platform.ready().then(() => {
// Okay, so the platform is ready and our plugins are available. // this.initOnesignal();
// Here you can do any higher level native things you might need.
this.statusBar.styleDefault(); this.statusBar.styleDefault();
this.splashScreen.hide(); this.splashScreen.hide();
let disconnectSubscription = this.network.onDisconnect().subscribe(() => {
const alert = this.alertCtrl.create({
title: 'Network Error',
message: 'No Internet Connection',
buttons: [
{
text: 'Quit',
handler: data => {
this.platform.exitApp();
}
}, {
text: 'Cancel',
role: 'cancel'
}
]
});
alert.present();
});
// this.enableLoc()
this.events.subscribe('driver:profile', data => {
this.local = data
if (this.local) {
this.local.image = this.local.image.startsWith("http") ? this.local.image : this.myservice.base_url + this.local.image;
}
})
this.storage.get('driver_data').then(data=>{
if(data!=null){
this.local = data
this.rootPage = 'HomePage'
// this.oneSignal.getIds().then((id) => {
// this.myservice.load_post({deviceid:id.userId,driverid:this.local.id},'updateDeviceid')
// })
}
else{
this.rootPage = 'LandingPage'
}
})
}); });
} }
openPage(page) { openPage(page) {
// Reset the content nav to have just this page if (page == 'LandingPage'){
// we wouldn't want the back button to show in this scenario this.storage.clear()
this.nav.setRoot(page.component); }
this.nav.setRoot(page);
} }
initOnesignal() {
this.oneSignal.startInit('ec007986-ae84-45fb-a770-f5be1e203acd', '151146703576');
this.oneSignal.inFocusDisplaying(this.oneSignal.OSInFocusDisplayOption.InAppAlert);
this.oneSignal.handleNotificationReceived().subscribe(() => {
// do something when notification is received
});
this.oneSignal.handleNotificationOpened().subscribe(() => {
// do something when a notification is opened
});
this.oneSignal.endInit();
}
enableLoc() {
this.locationAccuracy.canRequest().then((canRequest: boolean) => {
if (canRequest) {
// the accuracy option will be ignored by iOS
this.locationAccuracy.request(this.locationAccuracy.REQUEST_PRIORITY_HIGH_ACCURACY).then(
() => console.log('Request successful'),
error => console.log('Error requesting location permissions', error)
);
}
});
}
} }
<ion-menu [content]="content"> <ion-menu [content]="content">
<ion-header> <ion-content class="theme_bgcolor">
<ion-toolbar> <div class="cab_sidemenu_wrapper">
<ion-title>Menu</ion-title> <div menuClose class="cab_profile_banner" (click)="openPage('ProfilePage')">
</ion-toolbar> <div class="cab_profile_picture">
</ion-header> <img [src]="local?.image">
</div>
<ion-content> <p>{{local?.name}}</p>
<ion-list> <h6>{{local?.dial_code}} {{local?.phone}}</h6>
<button menuClose ion-item *ngFor="let p of pages" (click)="openPage(p)"> </div>
{{p.title}} <div class="cab_sidemenu_list">
</button> <ul>
</ion-list> <li menuClose>Book Ride</li>
<li menuClose>My Trips</li>
<li menuClose>Settings</li>
<li menuClose (click)="openPage('LandingPage')">Logout</li>
</ul>
</div>
</div>
</ion-content> </ion-content>
</ion-menu> </ion-menu>
......
...@@ -3,32 +3,57 @@ import { ErrorHandler, NgModule } from '@angular/core'; ...@@ -3,32 +3,57 @@ import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular'; import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { MyApp } from './app.component'; import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { ListPage } from '../pages/list/list';
import { StatusBar } from '@ionic-native/status-bar'; import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen'; import { SplashScreen } from '@ionic-native/splash-screen';
import { Network } from '@ionic-native/network';
import { OneSignal } from '@ionic-native/onesignal';
import { LocationAccuracy } from '@ionic-native/location-accuracy';
import { Myservice } from "../providers/myservice";
import { HttpModule } from "@angular/http";
import { IonicStorageModule } from '@ionic/storage';
import { OrderbyPipe } from '../providers/sort-pipe';
import { Geolocation } from '@ionic-native/geolocation';
import { fireService } from "../providers/firebase.service";
import { AngularFireDatabase } from 'angularfire2/database';
import { AngularFireModule } from 'angularfire2';
export const firebaseConfig = {
apiKey: "AIzaSyDLrbLd4RCCh86xuTVu7-cfJ28We_cG1sU",
authDomain: "callmycab-205809.firebaseapp.com",
databaseURL: "https://callmycab-205809.firebaseio.com",
projectId: "callmycab-205809",
storageBucket: "callmycab-205809.appspot.com",
messagingSenderId: "151146703576"
};
@NgModule({ @NgModule({
declarations: [ declarations: [
MyApp, MyApp
HomePage,
ListPage
], ],
imports: [ imports: [
BrowserModule, BrowserModule,
IonicModule.forRoot(MyApp), IonicModule.forRoot(MyApp),
HttpModule,
IonicStorageModule.forRoot(),
AngularFireModule.initializeApp(firebaseConfig),
], ],
bootstrap: [IonicApp], bootstrap: [IonicApp],
entryComponents: [ entryComponents: [
MyApp, MyApp
HomePage,
ListPage
], ],
providers: [ providers: [
StatusBar, StatusBar,
SplashScreen, SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler} {provide: ErrorHandler, useClass: IonicErrorHandler},
Network,
OneSignal,
LocationAccuracy,
Myservice,
OrderbyPipe,
Geolocation,
fireService,
AngularFireDatabase,
] ]
}) })
export class AppModule {} export class AppModule {}
// http://ionicframework.com/docs/theming/
// App Global Sass
// --------------------------------------------------
// Put style rules here that you want to apply globally. These .cab_sidemenu_bg{background:#4d4d4d;background-size: cover !important;background-position: center !important;}
// styles are for the entire app and not just one component. .cab_sidemenu_wrapper{width:100%;height:100%;
// Additionally, this file can be also used as an entry point align-content: center;
// to import other Sass files to be included in the output CSS. display: flex;
// flex-direction: column;
// Shared Sass variables, which can be used to adjust Ionic's justify-content: center;
// default Sass variables, belong in "theme/variables.scss". text-align: center;
// padding-left: 30px;
// To declare rules for a specific mode, create a child rule }
// for the .md, .ios, or .wp mode classes. The mode class is
// automatically applied to the <body> element in the app. .cab_sidemenu_wrapper hr{
border: 2px solid #f7941e;
height: 0px;
width: 30px;
border-radius: 20px;
margin-left: 0;
margin-top:20px;
margin-bottom:20px;
}
.cab_profile_banner{width:100%;}
.cab_profile_picture{width:100px;height:100px;border:2px solid #f7941e;background-size: 25px !important;border-radius:50%;background: url("../assets/img/avatar.png");background-position: center;background-repeat: no-repeat;}
.cab_profile_banner h6{color:#fff;margin:0px;font-size:16px;font-weight: 300;text-align:left;}
.cab_profile_banner p{color:#fff;margin:0px;font-size:24px;font-weight:300;text-align:left;padding-bottom: 7px;padding-top: 20px;}
.cab_profile_picture img{width:100%;height:100%;border-radius:50%;}
.cab_sidemenu_list{width:100%;}
.cab_sidemenu_list ul{width:100%;padding:0px;margin:0px;}
.cab_sidemenu_list ul li{list-style: none;color: #fff;font-size:16px;font-weight:300;text-align:left;padding-top:10px;padding-bottom:10px;background-position: left !important;background-repeat: no-repeat !important;padding-left: 35px;background-size:23px !important;}
.cab_sidemenu_list ul .book{background: url("../assets/img/book.png");}
.cab_sidemenu_list ul .trip{background: url("../assets/img/trip.png");}
.cab_sidemenu_list ul .rate{background: url("../assets/img/rate.png");}
.cab_sidemenu_list ul .payment{background: url("../assets/img/payment.png");}
.cab_sidemenu_list ul .offer{background: url("../assets/img/offer.png");}
.cab_sidemenu_list ul .settings{background: url("../assets/img/settings.png");}
.cab_sidemenu_list ul .logout{background: url("../assets/img/logout.png");}
.picker-wrapper{background: #ff9000 !important;}
.picker-toolbar{background: #ff9000 !important;}
.single_btn{width: 100% !important}
.txt_cntr{text-align: center}
.clr_wht{color: #fff}
.rate_est{font-size: 15px;padding-top: 5px}
.estim_li{padding-top: 5px !important;}
.button-md:hover:not(.disable-hover) {
background: #f7941e;
}
.loader {
border: 7px solid #fff;
border-radius: 50%;
border-top: 10px solid #ff9000;
width: 50px;
height: 50px;
-webkit-animation: spin 2s linear infinite; /* Safari */
animation: spin 2s linear infinite;
}
@-webkit-keyframes spin {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
/*FONT*/
@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i');
*{font-family: 'Roboto', sans-serif;}
.fontweight400{font-weight: 400 !important;}
.width75{width:75% !important;}
.width50{width:50% !important;}
/*COLORS*/
/*THEMES & BACKGROUND*/
.themelogin_background{background: url("../assets/img/cab_login_bg.png");background-position:bottom;background-repeat: no-repeat;}
.themedark_theme{background: url("../assets/img/theme_dark_bg.png");background-position:bottom;background-repeat: no-repeat;}
.bg_none{background: none !important;}
.theme_bgcolor{background:#ff9000 !important;}
.theme_dark_bg{background:#404041 !important;}
.bg_transparent{background: transparent !important;}
/*BODY-STRUCTURE*/
.nav_header{width:100%;height: 45px;}
.nav_btn{width:45px;height:45px;background: transparent;margin: 0px;font-size: 25px;}
.nav_header_title{height:100%;font-size: 17px;color: #fff;font-weight:400;padding: 12px;width:calc(100% - 110px);font-weight: 300;letter-spacing: 3px;}
.clear{clear:both !important;}
.theme_color{color: #f7941e;}
.text_white{color:#fff !important;}
.text_size_18{font-size:18px !important;}
/*OVERWRITTEN*/
.header-md::after, .tabs-md[tabsPlacement="top"] > .tabbar::after, .footer-md::before, .tabs-md[tabsPlacement="bottom"] > .tabbar::before {background-image:none !important}
.picker-wrapper{background:#165b93 !important;color: #fff !important;}
.picker-toolbar{background:#165b93 !important;color: #fff !important;border:none !important;}
.picker-button{color: #fff !important;}
.picker-opt{color: #fff !important;}
.picker-below-highlight{background:#165b93 !important;border:none !important;}
.picker-above-highlight{background:#165b93 !important;border:none !important;}
.popover-content{border-radius: 10px !important;width: 150px !important;min-width: 0;min-height: 0;max-height: 90%;color: #000;background:transparent !important;}
.popover-content ion-content, .popover-content .scroll-content {background: #fafafa !important;}
ion-popover{background: rgba(0,0,0,0.6) !important;}
.popover-md .popover-content{top:50px !important;}
.swiper-slide{overflow: scroll !important;}
.slide-zoom{height:100% !important;}
.menu-inner{width:220px;}
.button-md{box-shadow: none !important;}
.activated{background: transparent !important;}
.button-default{background: transparent;}
/*SPACING & POSITION*/
.width100{width:100% !important;}
.p0{padding:0px !important;}
.pl0{padding-left: 0px !important;}
.pr0{padding-right:0px !important;}
.pt0{padding-top:0px !important;}
.pb0{padding-bottom: 0px !important;}
.p10{padding:10px !important;}
.m0{margin:0px !important;}
.ml0{margin-left: 0px !important;}
.mr0{margin-right: 0px !important;}
.mt0{margin-top: 0px !important;}
.mb0{margin-bottom: 0px !important;}
.top10{top:6px;}
.bottom10{bottom:10px;}
.left10{left:10px;}
.right10{right:10px;}
.bottom0{bottom:0px !important;padding:0px !important;font-size: 13px !important;}
.absolute{position: absolute !important;}
.relative{position: relative !important;}
.fixed{position: fixed !important;}
/*ALIGNMENT*/
.floatLeft{float:left !important;}
.floatRight{float:right !important;}
.textLeft{text-align: left !important;}
.textRight{text-align: right !important;}
.textCenter{text-align: center !important;}
/*ALERT*/
.alert{padding:4px;font-size:12px;border: 1px solid transparent;font-weight:300;transition: all 0.5s ease;border-bottom:0px;left:0px;right: 0px;opacity: .8;position: relative;top: 3px;}
.warning{color: #fff;background-color: #8a6d3b;}
.success{color: #fff;background-color: #3c763d;}
.error{color: #fff;background-color: #a94442;}
.cab_sidemenu_bg{background:#4d4d4d;background-size: cover !important;background-position: center !important;}
.cab_sidemenu_wrapper{width:100%;height:100%;}
.cab_profile_banner{width:100%;text-align:left;}
.cab_profile_picture{width:100px;height:100px;margin-left:0px;border:2px solid #fff;background-size: 25px !important;border-radius:50%;background: url("../assets/img/avatar.png");background-position: center;background-repeat: no-repeat;}
.cab_profile_banner h6{color:#fff;margin:0px;font-size:16px;font-weight: 400;padding-bottom: 7px;padding-top:0px;padding-left:0px;padding-right:10px;text-align: left;}
.cab_profile_banner p{color:#fff;margin:0px;font-size:20px;font-weight:300;padding-left:0px;padding-right:10px;text-align: left;}
.cab_profile_picture img{width:100%;height:100%;border-radius:50%;}
.cab_sidemenu_list{width:100%;padding-left:0px;padding-top:0px;}
.cab_sidemenu_list ul{width:100%;padding:0px;margin:0px;}
.cab_sidemenu_list ul li{list-style: none;color: #fff;font-size:16px;font-weight:300;padding-top:15px;padding-bottom:15px;background-position: left !important;background-repeat: no-repeat !important;padding-left:0px;background-size:23px !important;}
...@@ -45,5 +45,7 @@ ...@@ -45,5 +45,7 @@
<!-- The main bundle js is generated during the build process --> <!-- The main bundle js is generated during the build process -->
<script src="build/main.js"></script> <script src="build/main.js"></script>
<script src="http://maps.google.com/maps/api/js?libraries=places&key=AIzaSyCk1_NXO6fDntAzKEl7sO-z6Ut5evHLsKQ"></script>
</body> </body>
</html> </html>
export class dialcode{
country:string;
dialCode:number;
}
export class user{
email:string
id: string
mobile: string
name: string
image: string
dial_code: string
token:string
}
export class driver{
email:string
id: string
mobile: string
name: string
username: string
image: string
dial_code: string
token:string
}
export class cartype{
car_type:string
intialkm: string
intailrate: string
standardrate: string
extrahour: string
id: string
car_image: string
}
export class search{
id:string
userid: string
keyword: string
location: string
date: Date
}
\ No newline at end of file
<ion-header class="theme_dark_bg">
<button class="nav_btn theme_color" (click)="back()">
<ion-icon name="ios-arrow-back-outline"></ion-icon>
</button>
</ion-header>
<ion-content padding class="themelogin_background">
<div class="cab_login_wrapper">
<h4>Forgot Password</h4>
<hr>
<br>
<div class="cab_form">
<form [formGroup]="forgotForm">
<div class="cab_form_row">
<div class="cab_phone_number">
<input class="cab_phone_input floatRight cab_mail" type="email" placeholder="Email" formControlName="email">
<div class="clear"></div>
<div class="er_req textCenter" *ngIf="forgotForm.controls.email.invalid && (forgotForm.get('email').dirty || forgotForm.get('email').touched)">
Enter a valid Email
</div>
</div>
</div>
</form>
<br>
<br>
<div class="cab_form_row">
<button ion-button class="cab_sign_btn" (click)="forgot()" [disabled]="forgotForm.invalid">Sent recovery password</button>
</div>
</div>
</div>
</ion-content>
\ No newline at end of file
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { ForgotPage } from './forgot';
@NgModule({
declarations: [
ForgotPage,
],
imports: [
IonicPageModule.forChild(ForgotPage),
],
})
export class ForgotPageModule {}
page-forgot {
.scroll-content{
background: rgba(0,0,0,0.8);
}
.cab_logo{width:100%;text-align: center; padding-bottom: 30px;}
.cab_logo img{width:200px;}
.cab_login_wrapper{width:100%;}
.cab_login_wrapper h4{color: #fff;
font-size: 40px;
font-weight: 300;
text-align: left;
text-transform:capitalize;}
.cab_login_wrapper hr{border:2px solid #f7941e;height:0px;border-radius:20px;width:35px;margin-left:0px;}
.cab_phone_number{width:100%;height:50px;border-bottom:2px solid #ff9c00;}
.cab_phone_code{width:50px;height:100%;-webkit-appearance: none;-moz-appearance: none;background: transparent !important;text-align: center;border:none;padding-left: 10px;color: #fff;font-size: 18px;}
.cab_phone_code option{text-align: center;}
.cab_phone_input{width:100%;height:100%;border:none;color:#fff;font-size: 18px;padding-left: 10px;padding-right: 20px;}
.cab_phone_input::-webkit-input-placeholder {color:#fff;}
.cab_phone_input::-moz-placeholder {color:#fff;}
.cab_phone_input:-ms-input-placeholder {color:#fff;}
.cab_phone_input:-moz-placeholder {color:#fff;}
.cab_login_wrapper{width:100%;}
.cab_call{background: url("../assets/img/number.png");background-position: right;background-repeat: no-repeat;}
.cab_pass{background: url("../assets/img/password.png");background-position: right;background-repeat: no-repeat;}
.cab_user{background: url("../assets/img/user.png");background-position: right;background-repeat: no-repeat;}
.cab_mail{background: url("../assets/img/email.png");background-position: right;background-repeat: no-repeat;}
.cab_search{background: url("../assets/img/search.png") !important;background-position: right;background-repeat: no-repeat;}
.cab_currentlocation{background: url("../assets/img/currentlocation.png");background-position: right;background-repeat: no-repeat;}
.cab_location{background: url("../assets/img/location.png");background-position: right;background-repeat: no-repeat;}
.cab_confirmpass{background: url("../assets/img/confirmpass.png");background-position: right;background-repeat: no-repeat;}
.cab_form_row .item-block{background: transparent;padding-left:0px;border:none !important;margin:0 auto !important;width:200px !important;}
.cab_form_row .item-inner{border:none !important;}
.cab_form_row .checkbox-checked{background:#ff9c00 !important;border:1px solid #ff9c00 !important;}
.item .item-ios .checkbox-ios{margin-left:0px !important;margin-right:10px !important;}
.item .item-md .checkbox-md{margin-left:0px !important;margin-right:10px !important;}
.cab_sign_btn{height:45px;width:100%;background:#ff9c00;color: #fff;text-transform: capitalize !important;font-size: 18px;font-weight: 300;}
.cab_sign_btn1{height:45px;width:100%;border:1px solid #ff9c00;color: #ff9c00;background:transparent;text-transform: capitalize !important;font-size: 18px;font-weight: 300;}
.cab_form p{color: #fff;font-weight: 500;font-size: 18px;}
.er_req{color:#ff6060;padding-top: 10px;font-size: 15px}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { FormGroup, Validators, FormBuilder } from '@angular/forms'
import { Myservice } from '../../providers/myservice'
@IonicPage()
@Component({
selector: 'page-forgot',
templateUrl: 'forgot.html',
})
export class ForgotPage {
forgotForm: FormGroup
constructor(public navCtrl: NavController, public navParams: NavParams, private formbuilder: FormBuilder, private myservice: Myservice) {
this.forgotForm = this.formbuilder.group({
email: ['', Validators.compose([Validators.required, Validators.pattern("[a-zA-Z0-9.-_]{1,}@[a-zA-Z.-]{2,}[.]{1}[a-zA-Z]{2,}")])],
from:['doctor']
})
}
forgot() {
this.myservice.show_loader()
this.myservice.load_post(this.forgotForm.value, 'Forget_password').subscribe(response => {
this.myservice.hide_loader()
if (response.status == 'success') {
this.myservice.show_alert('', response.message)
this.navCtrl.pop();
}
else {
this.myservice.show_alert('', response.message)
}
})
}
back()
{
this.navCtrl.pop();
}
}
<ion-header> <ion-header class="theme_dark_bg">
<ion-navbar> <button class="nav_btn theme_color floatLeft" menuToggle>
<button ion-button menuToggle>
<ion-icon name="menu"></ion-icon> <ion-icon name="menu"></ion-icon>
</button> </button>
<ion-title>Home</ion-title> <div class="nav_header_title floatLeft">
</ion-navbar> Rides
</div>
<div class="clear"></div>
<div class="rides_tab">
<li [class.active]="tab=='active'" (click)="tab_swap('active')">Upcoming
<div class="arrow-up"></div>
</li>
<!-- <li [class.active]="tab=='inactive'" (click)="tab_swap('inactive')">Ongoing
<div class="arrow-up"></div>
</li> -->
<li [class.active]="tab=='inactive1'" (click)="tab_swap('inactive1')">Completed
<div class="arrow-up"></div>
</li>
</div>
</ion-header> </ion-header>
<ion-content padding class="home_background">
<ion-content padding> <div class="home_content_tab" [hidden]="tab != 'active'">
<h3>Ionic Menu Starter</h3> <ul>
<li *ngFor="let up of upcoming" (click)="rideDetails(up)">
<p> <div class="home_content_circle">
If you get lost, the <a href="http://ionicframework.com/docs/v2">docs</a> will show you the way. <img [src]=baseurl+up.image />
</p> </div>
<div class="home_content_detail">
<button ion-button secondary menuToggle>Toggle Menu</button> <h5>{{up.username}}</h5>
<p class="yellow">{{up.pickup_area}}</p>
<p class="grey">{{up.drop_area}}</p>
</div>
<div class="home_content_right">
<p>{{up.pickup_date | date:'dd/MM/yy'}}</p>
<p>{{up.pickup_time}}</p>
</div>
<div class="clear"></div>
</li>
</ul>
<p *ngIf="upcoming?.length==0" class="blank">No rides found</p>
</div>
<!-- <div class="home_content_tab" [hidden]="tab != 'inactive'">
3
</div> -->
<div class="home_content_tab" [hidden]="tab != 'inactive1'">
<ul>
<li *ngFor="let comp of completed" (click)="rideDetails(comp)">
<div class="home_content_circle">
<img [src]=baseurl+comp.image />
</div>
<div class="home_content_detail">
<h5>{{comp.username}}</h5>
<p class="yellow">{{comp.pickup_area}}</p>
<p class="grey">{{comp.drop_area}}</p>
</div>
<div class="home_content_right">
<p>{{comp.pickup_date | date:'dd/MM/yy'}}</p>
<p>{{comp.pickup_time}}</p>
</div>
<div class="clear"></div>
</li>
</ul>
<p *ngIf="completed?.length==0" class="blank">No rides found</p>
</div>
</ion-content> </ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { HomePage } from './home';
@NgModule({
declarations: [
HomePage,
],
imports: [
IonicPageModule.forChild(HomePage),
],
})
export class HomePageModule {}
page-home { page-home {
.home_background{
background: #f6f6f6;
}
.rides_tab{
li{
padding:0px;
list-style: none;
float: left;
width:50%;
text-align: center;
padding: 15px;
font-size: 18px;
color: #acacac;
font-weight: 300;
position: relative;
.arrow-up {
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid #404041;
position: absolute;
bottom: 0px;
left: 40%;
}
}
.active{
color: #fff;
.arrow-up {
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid #f6f6f6;
position: absolute;
}
}
}
.home_content_tab{
width: 100%;
ul{
padding: 0px;
margin:0px;
li{
background: #fff;
list-style: none;
padding: 15px;
margin-bottom: 10px;
.home_content_circle{
width:60px;
height:60px;
border-radius: 50%;
background: #ec820d;
float: left;
img{
width:100%;
height:100%;
object-fit:cover;
object-position:center;
border-radius: 50%;
}
}
.home_content_detail{
width:calc(100% - 150px);
float: left;
padding-left: 20px;
h5{
margin: 0px;
padding:0px;
color: #585858;
text-transform: uppercase;
padding-bottom:4px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
p{
padding:0px;
margin:0px;
color: #525252;
padding-top: 2px;
padding-bottom: 2px;
background-repeat: no-repeat !important;
padding-left: 20px;
background-size: 10px !important;
background-position: 0px !important;
font-size: 12px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.yellow{
background: url("../assets/img/yellowdot.png");
}
.grey{
background: url("../assets/img/greydot.png");
}
}
.home_content_right{
float: right;
width: 80px;
border-left:1px solid #acacac;
padding: 15px;
padding-right: 0px;
p{
color: #545454;
padding:0px;
margin:0px;
text-align: right;
font-size: 12px;
}
}
}
}
}
.blank{ padding-top: 50%;
text-align: center;
font-size: 20px;
font-weight: 500;
color: #ccb59a;}
} }
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { NavController } from 'ionic-angular'; import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Storage } from "@ionic/storage";
import { Myservice } from "../../providers/myservice";
@IonicPage()
@Component({ @Component({
selector: 'page-home', selector: 'page-home',
templateUrl: 'home.html' templateUrl: 'home.html',
}) })
export class HomePage { export class HomePage {
tab:any;
upcoming:any;
completed:any;
baseurl = this.myservice.base_url
constructor(public navCtrl: NavController) { constructor(public navCtrl: NavController, public navParams: NavParams, private storage:Storage, private myservice:Myservice) {
}
ionViewDidEnter(){
this.storage.get('driver_data').then(data=>{
if(data){
this.myservice.load_post({id:data.id},'getMyRides').subscribe(response=>{
if(response.status == 'success'){
this.upcoming = response.data.upcoming
this.completed = response.data.completed
console.log(this.upcoming)
}
})
}
})
}
ionViewDidLoad() {
console.log('ionViewDidLoad HomePage');
this.tab = "active";
} }
tab_swap(type) {
this.tab = type;
}
rideDetails(data){
this.navCtrl.push('RidedetailsPage',{data:data})
}
} }
<ion-content class="themelogin_background">
<div class="cab_landing_wrapper">
<div class="cab_logo">
<img src="assets/img/logo.png">
</div>
<div class="cab_form">
<div class="cab_form_row">
<button ion-button class="cab_sign_btn" (click)="open_page('SignupPage')">New User ? Sign up now!</button>
</div>
<div class="cab_form_row">
<button ion-button class="cab_sign_btn1" (click)="open_page('SigninPage')">Sign in</button>
</div>
<!-- <div class="cab_form_row textCenter">
<p (click)="forgot()">Forgot Password</p>
</div> -->
</div>
</div>
</ion-content>
\ No newline at end of file
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { LandingPage } from './landing';
@NgModule({
declarations: [
LandingPage,
],
imports: [
IonicPageModule.forChild(LandingPage),
],
})
export class LandingPageModule {}
page-landing {
.scroll-content{
align-content: center;
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
background: rgba(0,0,0,0.8);
}
.cab_landing_wrapper{width:80%;margin:0 auto;}
.cab_logo{width:100%;text-align: center;}
.cab_logo img{width:200px;}
.cab_footer{width:100%;text-align: center;}
.cab_footer p{color: #3d3a3b;font-weight: 500;font-size: 18px;}
.cab_footer li{list-style: none;display: inline-block;color: #3d3a3b;font-size: 35px;margin:10px;}
.cab_sign_btn{height:45px;width:100%;background:#ff9c00;color: #fff;text-transform: capitalize !important;font-size: 18px;font-weight: 300;}
.cab_sign_btn1{height:45px;width:100%;border:1px solid #ff9c00;color: #ff9c00;background:transparent;text-transform: capitalize !important;font-size: 18px;font-weight: 300;}
.cab_form p{color: #3d3a3b;font-weight: 500;font-size: 18px;}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-landing',
templateUrl: 'landing.html',
})
export class LandingPage {
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
open_page(page){
this.navCtrl.push(page);
}
ionViewDidLoad() {
console.log('ionViewDidLoad LandingPage');
}
}
<!--
Generated template for the ListPage page.
See http://ionicframework.com/docs/components/#navigation for more info on
Ionic pages and navigation.
-->
<ion-header> <ion-header>
<ion-navbar> <ion-navbar>
<button ion-button menuToggle> <ion-title>list</ion-title>
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>List</ion-title>
</ion-navbar> </ion-navbar>
</ion-header> </ion-header>
<ion-content>
<ion-list> <ion-content padding>
<button ion-item *ngFor="let item of items" (click)="itemTapped($event, item)">
<ion-icon [name]="item.icon" item-start></ion-icon>
{{item.title}}
<div class="item-note" item-end>
{{item.note}}
</div>
</button>
</ion-list>
<div *ngIf="selectedItem" padding>
You navigated here from <b>{{selectedItem.title}}</b>
</div>
</ion-content> </ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { ListPage } from './list';
@NgModule({
declarations: [
ListPage,
],
imports: [
IonicPageModule.forChild(ListPage),
],
})
export class ListPageModule {}
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular'; import { IonicPage, NavController, NavParams } from 'ionic-angular';
/**
* Generated class for the ListPage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/
@IonicPage()
@Component({ @Component({
selector: 'page-list', selector: 'page-list',
templateUrl: 'list.html' templateUrl: 'list.html',
}) })
export class ListPage { export class ListPage {
selectedItem: any;
icons: string[];
items: Array<{title: string, note: string, icon: string}>;
constructor(public navCtrl: NavController, public navParams: NavParams) { constructor(public navCtrl: NavController, public navParams: NavParams) {
// If we navigated to this page, we will have an item available as a nav param
this.selectedItem = navParams.get('item');
// Let's populate this page with some filler content for funzies
this.icons = ['flask', 'wifi', 'beer', 'football', 'basketball', 'paper-plane',
'american-football', 'boat', 'bluetooth', 'build'];
this.items = [];
for (let i = 1; i < 11; i++) {
this.items.push({
title: 'Item ' + i,
note: 'This is item #' + i,
icon: this.icons[Math.floor(Math.random() * this.icons.length)]
});
}
} }
itemTapped(event, item) { ionViewDidLoad() {
// That's right, we're pushing to ourselves! console.log('ionViewDidLoad ListPage');
this.navCtrl.push(ListPage, {
item: item
});
} }
} }
<!--
Generated template for the ProfilePage page.
See http://ionicframework.com/docs/components/#navigation for more info on
Ionic pages and navigation.
-->
<ion-header>
<ion-navbar>
<ion-title>profile</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
</ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { ProfilePage } from './profile';
@NgModule({
declarations: [
ProfilePage,
],
imports: [
IonicPageModule.forChild(ProfilePage),
],
})
export class ProfilePageModule {}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-profile',
templateUrl: 'profile.html',
})
export class ProfilePage {
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad ProfilePage');
}
}
<ion-header class="theme_dark_bg">
<button class="nav_btn theme_color floatLeft">
<ion-icon name="ios-arrow-back" (click)="back()"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Quick Ride
</div>
<div class="clear"></div>
</ion-header>
<ion-content padding>
<div class="jr_profile_content1">
<div class="jr_search_bottom_bay jr_padding0" >
<h5>You have a ride request</h5>
<hr>
<div class="jr_search_profile">
<img >
</div>
<div class="jr_search_profile_detail">
<br>
<h6>Lina Rhodes</h6>
</div>
<div class="jr_clear"></div>
</div>
<br>
<hr>
<br>
<div class="jr_from_to">
<li>
<div class="child1 from"><div class="jr_box1"></div></div>
<div class="child2 yellow"><strong>Electronic City</strong>
<p>fdgsdgsdg</p></div>
<div class="jr_clear"></div>
</li>
<li>
<div class="child1 to"></div>
<div class="child2 grey"><strong>HSR Layout</strong>
<p>gfhdfgthj</p></div>
<div class="jr_clear"></div>
</li>
</div>
<div class="jr_bottom_button_bay">
<button ion-button class="cab_footer_btn floatLeft accept">Accept</button>
<button ion-button class="cab_footer_btn floatRight reject">Remove</button>
</div>
</div>
</ion-content>
\ No newline at end of file
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { QuickridePage } from './quickride';
@NgModule({
declarations: [
QuickridePage,
],
imports: [
IonicPageModule.forChild(QuickridePage),
],
})
export class QuickridePageModule {}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-quickride',
templateUrl: 'quickride.html',
})
export class QuickridePage {
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad QuickridePage');
}
back(){
this.navCtrl.pop()
}
}
<ion-header class="theme_dark_bg">
<button class="nav_btn theme_color floatLeft">
<ion-icon name="ios-arrow-back" (click)="back()"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Ride Details
</div>
<div class="clear"></div>
</ion-header>
<ion-content padding>
<div class="jr_profile_content1">
<div class="jr_from_to">
<li>
<div class="child1 from"><div class="jr_box1"></div></div>
<div class="child2 yellow"><strong>{{details.from}}</strong>
<p>{{details.fromAd}}</p></div>
<div class="jr_clear"></div>
</li>
<li>
<div class="child1 to"></div>
<div class="child2 grey"><strong>{{details.to}}</strong>
<p>{{details.toAd}}</p></div>
<div class="jr_clear"></div>
</li>
</div>
<hr>
<br>
<div class="jr_search_bottom_bay jr_padding0" >
<div class="jr_search_profile">
<img [src]=baseurl+details.image>
</div>
<div class="jr_search_profile_detail">
<br>
<h6>{{details.username}}</h6>
<span class="jr_star_ratting">
<strong>{{details.pickup_date|date:'dd/MM/yy'}}&nbsp;&nbsp;&nbsp;{{details.pickup_time}}
</strong></span>
<br>
</div>
<div class="jr_clear"></div>
</div>
<div class="jr_bottom_button_bay" *ngIf="details.status=='Booking'">
<button ion-button class="cab_footer_btn" (click)="pick()">Pick Up</button>
</div>
</div>
</ion-content>
\ No newline at end of file
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { RidedetailsPage } from './ridedetails';
@NgModule({
declarations: [
RidedetailsPage,
],
imports: [
IonicPageModule.forChild(RidedetailsPage),
],
})
export class RidedetailsPageModule {}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Myservice } from "../../providers/myservice";
import { dateDataSortValue } from 'ionic-angular/umd/util/datetime-util';
@IonicPage()
@Component({
selector: 'page-ridedetails',
templateUrl: 'ridedetails.html',
})
export class RidedetailsPage {
details = this.navParams.get('data')
baseurl = this.myservice.base_url
constructor(public navCtrl: NavController, public navParams: NavParams, private myservice: Myservice) {
}
ionViewDidLoad() {
var tempf = this.details.pickup_area.split(',')
this.details.from = tempf[0]
this.details.fromAd = this.details.pickup_area
this.details.timestamp = new Date(this.details.pickup_date + ' ' + this.details.pickup_time).getTime()
var temp = this.details.drop_area.split(',')
this.details.to = temp[0]
this.details.toAd = this.details.drop_area
console.log(this.details)
}
back(){
this.navCtrl.pop();
}
pick(){
this.navCtrl.push('UserlocationPage',{ data: this.details})
}
}
<ion-content padding class="themelogin_background">
<div class="cab_login_wrapper">
<div class="cab_logo">
<img src="assets/img/cab_logo.png" style="width: 120px;">
</div>
<h4>Login</h4>
<hr>
<br>
<div class="cab_form">
<form [formGroup]="signinForm">
<div class="cab_form_row">
<div class="cab_phone_number">
<select class="cab_phone_code floatLeft" formControlName="dial_code">
<option *ngFor="let code of codes" value=+{{code.dialCode}}>+{{code.dialCode}}</option>
</select>
<input class="cab_phone_input floatRight cab_call" placeholder="Mobile Number" formControlName="mobile" type="number">
<div class="clear"></div>
<div class="er_req textCenter" *ngIf="signinForm.controls.mobile.invalid && (signinForm.get('mobile').dirty || signinForm.get('mobile').touched)">
Enter a valid Mobile
</div>
</div>
</div>
<br>
<div class="cab_form_row">
<div class="cab_phone_number">
<input class="cab_phone_input cab_pass width100" placeholder="Password" type="password" formControlName="password">
<div class="clear"></div>
<div class="er_req textCenter" *ngIf="signinForm.controls.password.invalid && (signinForm.get('password').dirty || signinForm.get('password').touched)">
Minimum 6 characters
</div>
</div>
</div>
</form>
<br>
<br>
<div class="cab_form_row">
<button ion-button class="cab_sign_btn" (click)="login()">Sign In</button>
</div>
<br>
<div class="cab_form_row textCenter">
<p (click)="forgot()">Forgot Password</p>
</div>
</div>
</div>
</ion-content>
\ No newline at end of file
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { SigninPage } from './signin';
@NgModule({
declarations: [
SigninPage,
],
imports: [
IonicPageModule.forChild(SigninPage),
],
})
export class SigninPageModule {}
page-signin {
.scroll-content{
align-content: center;
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
background: rgba(0,0,0,0.8);
}
.nav_btn{color: #fff;}
.cab_logo{width:100%;text-align: center; padding-bottom: 30px;}
.cab_logo img{width:200px;}
.cab_login_wrapper{width:100%;}
.cab_login_wrapper h4{color: #fff;
font-size: 40px;
font-weight: 300;
text-align: left;
text-transform:capitalize;}
.cab_login_wrapper hr{border:2px solid #f7941e;height:0px;border-radius:20px;width:35px;margin-left:0px;}
.cab_phone_number{width:100%;height:50px;border-bottom:2px solid #ff9c00;}
.cab_phone_code{width:50px;height:100%;-webkit-appearance: none;-moz-appearance: none;background: transparent !important;text-align: center;border:none;padding-left: 10px;color: #fff;font-size: 18px;}
.cab_phone_code option{text-align: center;}
.cab_phone_input{width:calc(100% - 50px);height:100%;border:none;color:#fff;font-size: 18px;padding-left: 10px;padding-right: 20px;}
.cab_phone_input::-webkit-input-placeholder {color:#fff;}
.cab_phone_input::-moz-placeholder {color:#fff;}
.cab_phone_input:-ms-input-placeholder {color:#fff;}
.cab_phone_input:-moz-placeholder {color:#fff;}
.cab_login_wrapper{width:100%;}
.cab_call{background: url("../assets/img/number.png");background-position: right;background-repeat: no-repeat;}
.cab_pass{background: url("../assets/img/password.png");background-position: right;background-repeat: no-repeat;}
.cab_user{background: url("../assets/img/user.png");background-position: right;background-repeat: no-repeat;}
.cab_mail{background: url("../assets/img/email.png");background-position: right;background-repeat: no-repeat;}
.cab_search{background: url("../assets/img/search.png") !important;background-position: right;background-repeat: no-repeat;}
.cab_currentlocation{background: url("../assets/img/currentlocation.png");background-position: right;background-repeat: no-repeat;}
.cab_location{background: url("../assets/img/location.png");background-position: right;background-repeat: no-repeat;}
.cab_confirmpass{background: url("../assets/img/confirmpass.png");background-position: right;background-repeat: no-repeat;}
.cab_form_row .item-block{background: transparent;padding-left:0px;border:none !important;margin:0 auto !important;width:200px !important;}
.cab_form_row .item-inner{border:none !important;}
.cab_form_row .checkbox-checked{background:#ff9c00 !important;border:1px solid #ff9c00 !important;}
.item .item-ios .checkbox-ios{margin-left:0px !important;margin-right:10px !important;}
.item .item-md .checkbox-md{margin-left:0px !important;margin-right:10px !important;}
.cab_sign_btn{height:45px;width:100%;background:#ff9c00;color: #fff;text-transform: capitalize !important;font-size: 18px;font-weight: 300;}
.cab_sign_btn1{height:45px;width:100%;border:1px solid #ff9c00;color: #ff9c00;background:transparent;text-transform: capitalize !important;font-size: 18px;font-weight: 300;}
.cab_form p{color: #fff;font-weight: 300;font-size: 18px;}
.er_req{color:#ff6060;padding-top: 10px;font-size: 15px}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,Events } from 'ionic-angular';
import { Validators, FormBuilder, FormGroup } from "@angular/forms";
import { Http } from '@angular/http'
import { dialcode } from "../../models/mymodel";
import { OrderbyPipe } from '../../providers/sort-pipe';
import { Myservice } from "../../providers/myservice";
import { Storage } from "@ionic/storage";
@IonicPage()
@Component({
selector: 'page-signin',
templateUrl: 'signin.html',
})
export class SigninPage {
codes: Array<dialcode>;
signinForm: FormGroup
constructor(public navCtrl: NavController, public navParams: NavParams, private formBuilder: FormBuilder, private http: Http, private orderbyPipe: OrderbyPipe, private myservice: Myservice, private storage: Storage, public events: Events) {
this.signinForm = this.formBuilder.group({
mobile: ['', Validators.compose([Validators.required, this.myservice.checkLimit(10000000, 999999999999999)])],
dial_code: ['+91', Validators.required],
password: ['', Validators.compose([Validators.required, Validators.minLength(6)])]
})
this.http.get('dial-codes.json')
.subscribe(response => {
this.codes = response.json().dialCodes
this.codes = this.orderbyPipe.transform(this.codes, 'dialCode');
})
}
login(){
this.myservice.show_loader()
this.myservice.load_post(this.signinForm.value,'driver_login').subscribe(response=>{
if(response[0].status == 'success'){
response[0].data.image = response[0].data.image.startsWith("http") ? response[0].data.image : this.myservice.base_url + response[0].data.image;
this.storage.set('driver_data',response[0].data)
var This = this;
setTimeout(() => {
This.myservice.hide_loader();
This.events.publish('driver:profile', response[0].data);
This.navCtrl.setRoot('HomePage')
}, 500);
}
else
this.myservice.show_alert('', response.message)
})
}
forgot(){
this.navCtrl.push("ForgotPage");
}
}
<ion-header class="theme_dark_bg">
<button class="nav_btn theme_color" (click)="back()">
<ion-icon name="ios-arrow-back-outline"></ion-icon>
</button>
</ion-header>
<ion-content padding class="themelogin_background">
<div class="cab_login_wrapper">
<h4>Sign Up</h4>
<hr>
<br>
<div class="cab_form">
<form [formGroup]="signupForm">
<div class="cab_form_row">
<div class="cab_phone_number">
<input class="cab_phone_input cab_user width100" placeholder="Name" formControlName="name">
<div class="clear"></div>
<div class="er_req textCenter" *ngIf="signupForm.controls.name.invalid && (signupForm.get('name').dirty || signupForm.get('name').touched)">
Enter a valid Name
</div>
</div>
</div>
<br>
<div class="cab_form_row">
<div class="cab_phone_number">
<input class="cab_phone_input cab_user width100" placeholder="Username" formControlName="username">
<div class="clear"></div>
<div class="er_req textCenter" *ngIf="signupForm.controls.username.invalid && (signupForm.get('username').dirty || signupForm.get('username').touched)">
Enter a valid Username
</div>
</div>
</div>
<br>
<div class="cab_form_row">
<div class="cab_phone_number">
<select class="cab_phone_code floatLeft" formControlName="dial_code">
<option *ngFor="let code of codes" value=+{{code.dialCode}}>+{{code.dialCode}}</option>
</select>
<input class="cab_phone_input floatRight cab_call" placeholder="Mobile Number" formControlName="phone" type="number">
<div class="clear"></div>
<div class="er_req textCenter" *ngIf="signupForm.controls.phone.invalid && (signupForm.get('phone').dirty || signupForm.get('phone').touched)">
Enter a valid Mobile
</div>
</div>
</div>
<br>
<div class="cab_form_row">
<div class="cab_phone_number">
<input class="cab_phone_input cab_mail width100" placeholder="Email" formControlName="email" type="email">
<div class="clear"></div>
<div class="er_req textCenter" *ngIf="signupForm.controls.email.invalid && (signupForm.get('email').dirty || signupForm.get('email').touched)">
Enter a valid Email
</div>
</div>
</div>
<br>
<div class="cab_form_row">
<div class="cab_phone_number">
<input class="cab_phone_input cab_pass width100" placeholder="Password" formControlName="password" type="password">
<div class="clear"></div>
<div class="er_req textCenter" *ngIf="signupForm.controls.password.invalid && (signupForm.get('password').dirty || signupForm.get('password').touched)">
Minimum 6 characters
</div>
</div>
</div>
<br>
<div class="cab_form_row">
<div class="cab_phone_number">
<input class="cab_phone_input cab_confirmpass width100" placeholder="Confirm Password" type="password" formControlName="confirm">
<div class="clear"></div>
<div class="er_req textCenter" *ngIf="signupForm.controls.confirm.invalid && (signupForm.get('confirm').dirty || signupForm.get('confirm').touched)">
Password mismatches
</div>
</div>
</div>
<br>
<div class="cab_form_row textCenter">
<ion-item style="width:100% !important;">
<ion-label>
<p>I accept terms & condition</p>
</ion-label>
<ion-checkbox formControlName="terms"></ion-checkbox>
</ion-item>
<div class="er_req textCenter" *ngIf="signupForm.controls.terms.invalid && (signupForm.get('terms').dirty || signupForm.get('terms').touched)">
Please accept terms & conditions
</div>
</div>
</form>
<br>
<div class="cab_form_row">
<button ion-button class="cab_sign_btn" (click)="register()" [disabled]="signupForm.invalid">Sign Up</button>
</div>
<br>
</div>
</div>
</ion-content>
\ No newline at end of file
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { SignupPage } from './signup';
@NgModule({
declarations: [
SignupPage,
],
imports: [
IonicPageModule.forChild(SignupPage),
],
})
export class SignupPageModule {}
page-signup {
.scroll-content{
background: rgba(0,0,0,0.8);
}
.cab_logo{width:100%;text-align: center; padding-bottom: 30px;}
.cab_logo img{width:200px;}
.cab_login_wrapper{width:100%;height:100%;}
.cab_login_wrapper h4{color: #fff;
font-size: 40px;
font-weight: 300;
text-align: left;
text-transform:capitalize;}
.cab_login_wrapper hr{border:2px solid #f7941e;height:0px;border-radius:20px;width:35px;margin-left:0px;}
.cab_phone_number{width:100%;height:50px;border-bottom:2px solid #ff9c00;}
.cab_phone_code{width:50px;height:100%;-webkit-appearance: none;-moz-appearance: none;background: transparent !important;text-align: center;border:none;padding-left: 10px;color: #fff;font-size: 18px;}
.cab_phone_code option{text-align: center;}
.cab_phone_input{width:calc(100% - 50px);height:100%;border:none;color:#fff;font-size: 18px;padding-left: 10px;padding-right: 20px;}
.cab_phone_input::-webkit-input-placeholder {color:#fff;}
.cab_phone_input::-moz-placeholder {color:#fff;}
.cab_phone_input:-ms-input-placeholder {color:#fff;}
.cab_phone_input:-moz-placeholder {color:#fff;}
.cab_login_wrapper{width:100%;}
.cab_call{background: url("../assets/img/number.png");background-position: right;background-repeat: no-repeat;}
.cab_pass{background: url("../assets/img/password.png");background-position: right;background-repeat: no-repeat;}
.cab_user{background: url("../assets/img/user.png");background-position: right;background-repeat: no-repeat;}
.cab_mail{background: url("../assets/img/email.png");background-position: right;background-repeat: no-repeat;}
.cab_search{background: url("../assets/img/search.png") !important;background-position: right;background-repeat: no-repeat;}
.cab_currentlocation{background: url("../assets/img/currentlocation.png");background-position: right;background-repeat: no-repeat;}
.cab_location{background: url("../assets/img/location.png");background-position: right;background-repeat: no-repeat;}
.cab_confirmpass{background: url("../assets/img/confirmpass.png");background-position: right;background-repeat: no-repeat;}
.cab_form_row .item-block{background: transparent;padding-left:0px;border:none !important;margin:0 auto !important;width:200px !important;}
.cab_form_row .item-inner{border:none !important;}
.cab_form_row .checkbox-checked{background:#ff9c00 !important;border:1px solid #ff9c00 !important;}
.item .item-ios .checkbox-ios{margin-left:0px !important;margin-right:10px !important;}
.item .item-md .checkbox-md{margin-left:0px !important;margin-right:10px !important;}
.cab_sign_btn{height:45px;width:100%;background:#ff9c00;color: #fff;text-transform: capitalize !important;font-size: 18px;font-weight: 300;}
.cab_sign_btn1{height:45px;width:100%;border:1px solid #ff9c00;color: #ff9c00;background:transparent;text-transform: capitalize !important;font-size: 18px;font-weight: 300;}
.cab_form p{color: #fff;font-weight: 500;font-size: 18px;}
.er_req{color:#ff6060;padding-top: 10px;font-size: 15px}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Validators, FormBuilder, FormGroup } from "@angular/forms";
import { Http } from '@angular/http'
import { dialcode } from "../../models/mymodel";
import { OrderbyPipe } from '../../providers/sort-pipe';
import { Myservice } from "../../providers/myservice";
import { OneSignal } from "@ionic-native/onesignal";
import { fireService } from "../../providers/firebase.service";
import { Geolocation } from '@ionic-native/geolocation';
@IonicPage()
@Component({
selector: 'page-signup',
templateUrl: 'signup.html',
})
export class SignupPage {
signupForm: FormGroup
codes: Array<dialcode>;
constructor(public navCtrl: NavController, public navParams: NavParams, private formBuilder: FormBuilder, private http: Http, private orderbyPipe: OrderbyPipe, private myservice: Myservice, private onesignal: OneSignal, private firebase: fireService, private geolocation: Geolocation) {
this.signupForm = this.formBuilder.group({
name: ['', Validators.compose([Validators.required, Validators.minLength(3)])],
username: ['', Validators.compose([Validators.required, Validators.minLength(3)])],
email: ['', Validators.compose([Validators.required, Validators.pattern("[a-zA-Z0-9.-_]{1,}@[a-zA-Z.-]{2,}[.]{1}[a-zA-Z]{2,}")])],
dial_code: ['+91', Validators.required],
password: ['', Validators.compose([Validators.required, Validators.minLength(6)])],
confirm: ['', Validators.compose([Validators.required]), this.MatchPassword.bind(this)],
terms: [null, Validators.compose([Validators.required, Validators.pattern('true')])],
phone: ['', Validators.compose([Validators.required, this.myservice.checkLimit(10000000, 999999999999999)])],
deviceid: ['']
})
this.http.get('dial-codes.json')
.subscribe(response => {
this.codes = response.json().dialCodes
this.codes = this.orderbyPipe.transform(this.codes, 'dialCode');
})
}
ionViewDidLoad() {
console.log('ionViewDidLoad SignupPage');
}
back() {
this.navCtrl.pop();
}
register() {
this.myservice.show_loader()
this.geolocation.getCurrentPosition().then((resp) => {
// this.onesignal.getIds().then((id) => {
this.signupForm.controls['deviceid'].setValue(0/*id.userId*/)
this.myservice.load_post(this.signupForm.value, 'driver_sign_up').subscribe(response => {
this.myservice.hide_loader()
if (response.status == 'success') {
response.data.lat = resp.coords.latitude
response.data.lng = resp.coords.longitude
response.data.started = false
response.data.status = 'offline'
this.firebase.pushItem('drivers/', response.data)
this.navCtrl.setRoot("SigninPage");
}
else {
this.myservice.show_alert('', response.message)
}
})
// })
}).catch((error) => {
console.log('Error getting location', error);
});
}
MatchPassword(val) {
return new Promise(resolve => {
if (val.value == this.signupForm.value.password) {
resolve(null);
}
else {
resolve({ 'match': false });
}
})
}
}
<ion-header class="theme_dark_bg">
<button ion-button class="nav_btn theme_color floatLeft" (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">User Location</div>
<div class="clear"></div>
</ion-header>
<ion-content>
<div #map id="map"></div>
<div class="jr_bottom_distance_card" *ngIf="temp">
<div class="jr_bottom_inside">
<input class="jr_dest_input from" placeholder="From" [(ngModel)]="loc.from">
<input class="jr_dest_input to" placeholder="To" [(ngModel)]="loc.to">
</div>
</div>
</ion-content>
<ion-footer>
<div class="jr_bottom_button_bay" *ngIf="temp">
<button ion-button class="cab_footer_btn">Start Ride</button>
</div>
</ion-footer>
\ No newline at end of file
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { UserlocationPage } from './userlocation';
@NgModule({
declarations: [
UserlocationPage,
],
imports: [
IonicPageModule.forChild(UserlocationPage),
],
})
export class UserlocationPageModule {}
import { Component, ViewChild, ElementRef } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Geolocation } from '@ionic-native/geolocation';
declare var google;
@IonicPage()
@Component({
selector: 'page-userlocation',
templateUrl: 'userlocation.html',
})
export class UserlocationPage {
@ViewChild('map') mapElement: ElementRef;
map: any;
directionsDisplay:any;
geocoder:any;
details = this.navParams.get('data')
locSubs:any;
temp:boolean = false;
loc = {'from':'','to':''}
i:number = 0;
constructor(public navCtrl: NavController, public navParams: NavParams, private geolocation: Geolocation) {
this.geolocation.getCurrentPosition().then((resp) => {
this.loadMap(resp.coords.latitude, resp.coords.longitude);
})
}
ionViewDidEnter() {
var This = this
var drop = This.details.drop_latlng.split(',')
This.geocoder = new google.maps.Geocoder();
This.locSubs = This.geolocation.watchPosition()
.filter((p) => p.coords !== undefined) //Filter Out Errors
.subscribe(position => {
This.i++;
var directionsService = new google.maps.DirectionsService;
This.directionsDisplay.setMap(This.map);
This.directionsDisplay.setOptions({ suppressMarkers: true });
var pickLoc = new google.maps.LatLng(Number(drop[0]), Number(drop[1]));
var driverLoc = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
var dimage = {
url: 'assets/img/map_label.png',
scaledSize: new google.maps.Size(50, 22),
origin: new google.maps.Point(0, 0),
anchor: new google.maps.Point(25, 12)
};
var marker = new google.maps.Marker({
position: driverLoc,
map: This.map,
icon: dimage
});
if (This.i == 5) {
// if (google.maps.geometry.spherical.computeDistanceBetween(pickLoc, driverLoc) < 100) {
This.temp = true
}
This.calculateAndDisplayRoute(directionsService, This.directionsDisplay, pickLoc, driverLoc);
})
}
loadMap(lat, lng) {
let latLng = new google.maps.LatLng(lat, lng);
let mapOptions = {
center: latLng,
zoom: 15,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
this.map = new google.maps.Map(this.mapElement.nativeElement, mapOptions);
this.directionsDisplay = new google.maps.DirectionsRenderer({
map: this.map,
preserveViewport: true
});
}
back(){
this.navCtrl.pop();
}
calculateAndDisplayRoute(directionsService, directionsDisplay, start, dest) {
var This = this
directionsService.route({
origin: start,
destination: dest,
travelMode: 'DRIVING'
}, function (response, status) {
if (status === 'OK') {
directionsDisplay.setDirections(response);
var bounds = response.routes[0].bounds;
This.map.fitBounds(bounds);
This.map.setCenter(bounds.getCenter());
} else {
window.alert('Directions request failed due to ' + status);
}
});
}
ionViewWillLeave() {
this.locSubs.unsubscribe();
}
}
import { Injectable } from '@angular/core';
@Injectable()
export class dataService {
bookingData:any;
rateData:any;
driverData:any;
constructor() { }
public setbookingData(val){
this.bookingData = val;
}
public getbookingData(){
return this.bookingData;
}
public setrateData(val){
this.rateData = val;
}
public getrateData(){
return this.rateData;
}
public setdriverData(val){
this.driverData = val;
}
public getdriverData(){
return this.driverData;
}
}
\ No newline at end of file
import { Injectable } from '@angular/core';
import { AngularFireDatabase } from 'angularfire2/database';
import { FirebaseListObservable } from 'angularfire2/database-deprecated';
import * as firebase from 'firebase';
import 'rxjs/add/operator/toPromise';
// import { Router } from '@angular/router';
@Injectable()
export class fireService {
items: FirebaseListObservable<any[]>;
//data: FirebaseObjectObservable<any[]>;
data:any;
currentUser: any;
userData: any;
// private basePath: string = 'users';
constructor(
private db: AngularFireDatabase,) {
// console.log(this.currentUser);
// console.log('hhhh');
}
pushItem(url,data){
var key = firebase.database().ref(url).push().key;
var new_node = url + "/" + key;
data.push_id = key;
this.updateItem(new_node, data)
return 'success';
}
updateItem(url,data){
// return this.db.object(url).update(data);
var promise = new Promise((resolve, reject) => {
if (this.db.object(url).update(data)) {
// console.log("Updated");
resolve({ 'status': 'success' });
} else {
reject();
}
});
return promise;
}
removeItem(url){
return this.db.object(url).remove();
}
listItem(url){
return this.db.list(url);
}
listItemQuery(url,query){
return this.db.list(url,query);
}
checkItem(url){
return this.db.list(url);
}
}
import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
import { LoadingController, AlertController, Events } from 'ionic-angular';
import { AbstractControl, ValidatorFn } from '@angular/forms'
@Injectable()
export class Myservice {
// base_url = 'http://techlabz.in/bmd_new/'
base_url = 'http://192.168.140.20/CMC/'
webservice_url = this.base_url + 'web_service/'
loader: any;
alert: any;
post_url: any;
data: any;
result: any;
msg_push: any;
constructor(public http: Http, public loadingCtrl: LoadingController, public alertCtrl: AlertController, public events: Events) { }
show_loader() {
this.loader = this.loadingCtrl.create({
content: ""
});
this.loader.present();
}
show_alert(title, message) {
this.alert = this.alertCtrl.create({
title: title,
subTitle: message,
// message: message,
buttons: ['OK']
});
this.alert.present();
}
hide_loader() {
this.loader.dismissAll();
}
load_post(post_data, fn_name) {
post_data.secret_key = 'My_key';
post_data = JSON.stringify(post_data);
this.post_url = this.webservice_url + fn_name;
return this.http.post(`${this.post_url}`, `${post_data}`).map(res => res.json());
}
get_data(fn_name) {
return this.http.get(this.webservice_url + fn_name)
.map(res => res.json());
}
get_dataById(fn_name, id) {
return this.http.get(this.webservice_url + fn_name + id)
.map(res => res.json());
}
fileUpload(data, fn_name) {
var post_url = this.webservice_url + fn_name;
return this.http.post(post_url, data)
.map(res => res.json());
}
get_baseurl() {
return this.base_url;
}
checkLimit(min: number, max: number): ValidatorFn {
return (c: AbstractControl): { [key: string]: boolean } | null => {
if (c.value && (isNaN(c.value) || c.value < min || c.value > max)) {
return { 'range': true };
}
return null;
};
}
}
\ No newline at end of file
import { Pipe, PipeTransform } from '@angular/core';
/**
* Generated class for the OrderbyPipe pipe.
*
* See https://angular.io/api/core/Pipe for more info on Angular Pipes.
*/
@Pipe({
name: 'orderby',
pure: false
})
export class OrderbyPipe implements PipeTransform {
/**
* Takes a value and makes it lowercase.
*/
transform(array, orderBy, asc = true){
if (!orderBy || orderBy.trim() == ""){
return array;
}
//ascending
if (asc){
return Array.from(array).sort((item1: any, item2: any) => {
return this.orderByComparator(item1[orderBy], item2[orderBy]);
});
}
else{
//not asc
return Array.from(array).sort((item1: any, item2: any) => {
return this.orderByComparator(item2[orderBy], item1[orderBy]);
});
}
}
orderByComparator(a:any, b:any):number{
if((isNaN(parseFloat(a)) || !isFinite(a)) || (isNaN(parseFloat(b)) || !isFinite(b))){
//Isn't a number so lowercase the string to properly compare
if(a.toLowerCase() < b.toLowerCase()) return -1;
if(a.toLowerCase() > b.toLowerCase()) return 1;
}
else{
//Parse strings as numbers to compare properly
if(parseFloat(a) < parseFloat(b)) return -1;
if(parseFloat(a) > parseFloat(b)) return 1;
}
return 0; //equal each other
}
}
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';
@Injectable()
export class SubjectService {
private locSubject = new BehaviorSubject<any>(null);
private docSubjects = new BehaviorSubject<any>(null);
private querySubjects = new BehaviorSubject<any>(null);
sendLocData(searchData: any) {
this.locSubject.next(searchData);
}
getLocData(): Observable<any> {
return this.locSubject.asObservable();
}
sendDocData(docData: any) {
this.docSubjects.next(docData);
}
getDocData(): Observable<any> {
return this.docSubjects.asObservable();
}
sendQueryData(queryData: any) {
this.querySubjects.next(queryData);
}
getQueryData(): Observable<any> {
return this.querySubjects.asObservable();
}
}
\ No newline at end of file
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