Skip to content

C
Callmycab-Userapp
Commit 45361de6 by amal
Options

firstpull

parent 54e25060
Showing with 1247 additions and 154 deletions
ionic.config.json
{ {
"name": "cmc_v2", "name": "cmc_v2",
"app_id": "", "app_id": "b8b89996",
"type": "ionic-angular" "type": "ionic-angular",
"integrations": {}
} }
src.zip 0 → 100644
File added
src/app/app.component.ts
...@@ -3,42 +3,26 @@ import { Nav, Platform } from 'ionic-angular'; ...@@ -3,42 +3,26 @@ import { Nav, Platform } 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 { HomePage } from '../pages/home/home';
import { ListPage } from '../pages/list/list';
@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}>;
constructor(public platform: Platform, public statusBar: StatusBar, public splashScreen: SplashScreen) { constructor(public platform: Platform, public statusBar: StatusBar, public splashScreen: SplashScreen) {
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.statusBar.styleDefault();
// Here you can do any higher level native things you might need. this.splashScreen.hide();
this.statusBar.styleDefault();
this.splashScreen.hide();
}); });
} }
openPage(page) { open_page(page){
// Reset the content nav to have just this page this.nav.setRoot(page);
// we wouldn't want the back button to show in this scenario }
this.nav.setRoot(page.component);
}
} }
src/app/app.html
<ion-menu [content]="content"> <ion-menu [content]="content">
<ion-header> <ion-content class="cab_sidemenu_bg">
<ion-toolbar> <div class="cab_sidemenu_wrapper">
<ion-title>Menu</ion-title> <div menuClose class="cab_profile_banner" (click)="open_page('ProfilePage')">
</ion-toolbar> <div class="cab_profile_picture">
</ion-header> </div>
<h6>Catharine Morgan</h6>
<ion-content> <p>+0966-26539</p>
<ion-list> </div>
<button menuClose ion-item *ngFor="let p of pages" (click)="openPage(p)"> <div class="cab_sidemenu_list">
{{p.title}} <ul>
</button> <li menuClose class="book" (click)="open_page('HomePage')">Book Ride</li>
</ion-list> <li menuClose class="trip" (click)="open_page('MytripsPage')">My Trips</li>
<li menuClose class="settings" (click)="open_page('SettingsPage')">Settings</li>
<li menuClose class="logout" (click)="open_page('LoginPage')">Logout</li>
</ul>
</div>
</div>
</ion-content> </ion-content>
</ion-menu> </ion-menu>
<!-- Disable swipe-to-go-back because it's poor UX to combine STGB with side menus --> <!-- 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> <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 { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core'; 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';
@NgModule({ @NgModule({
declarations: [ declarations: [
MyApp, MyApp
HomePage,
ListPage
], ],
imports: [ imports: [
BrowserModule, BrowserModule,
...@@ -21,9 +15,7 @@ import { SplashScreen } from '@ionic-native/splash-screen'; ...@@ -21,9 +15,7 @@ import { SplashScreen } from '@ionic-native/splash-screen';
], ],
bootstrap: [IonicApp], bootstrap: [IonicApp],
entryComponents: [ entryComponents: [
MyApp, MyApp
HomePage,
ListPage
], ],
providers: [ providers: [
StatusBar, StatusBar,
......
src/app/app.scss
// http://ionicframework.com/docs/theming/ //Global SCSS//
// App Global Sass
// -------------------------------------------------- //Themening SCSS//
// Put style rules here that you want to apply globally. These
// styles are for the entire app and not just one component. @import "../assets/css/theme.scss";
// Additionally, this file can be also used as an entry point
// to import other Sass files to be included in the output CSS. //Essentail SCSS//
//
// Shared Sass variables, which can be used to adjust Ionic's @import "../assets/css/essential.scss";
// default Sass variables, belong in "theme/variables.scss".
//
// 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.
src/assets/css/theme.scss 0 → 100644
/*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: 15px;margin-bottom: 20px;border: 1px solid transparent;font-weight: 600;transition: all 0.5s ease;position: fixed;border-bottom:0px;left:0px;right: 0px;}
.warning{color: #fff;background-color: #8a6d3b;}
.success{color: #fff;background-color: #3c763d;}
.error{color: #fff;background-color: #a94442;}
src/index.html
...@@ -10,23 +10,15 @@ ...@@ -10,23 +10,15 @@
<link rel="icon" type="image/x-icon" href="assets/icon/favicon.ico"> <link rel="icon" type="image/x-icon" href="assets/icon/favicon.ico">
<link rel="manifest" href="manifest.json"> <link rel="manifest" href="manifest.json">
<meta name="theme-color" content="#4e8ef7"> <meta name="theme-color" content="#4e8ef7">
<!-- add to homescreen for ios --> <!-- add to homescreen for ios -->
<meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="apple-mobile-web-app-status-bar-style" content="black">
<!-- cordova.js required for cordova apps --> <!-- cordova.js required for cordova apps -->
<script src="http://maps.google.com/maps/api/js?key=AIzaSyCIs0lfeIa7zWX0SU4oE6irYsXkUEWe1aU"></script>
<script src="cordova.js"></script> <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"> <link href="build/main.css" rel="stylesheet">
</head> </head>
......
src/pages/addcoupon/addcoupon.html 0 → 100644
<ion-header class="theme_dark_bg">
<button ion-button class="nav_btn theme_color floatLeft" (click)="goBack()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">Add Coupons</div>
<div class="clear"></div>
</ion-header>
<ion-content padding class="cab_coupon_bg">
<div class="cab_coupon_wrapper">
<div class="cab_coupon_box">
<input class="cab_coupon_input" placeholder="Enter Coupon Code">
</div>
<p>You don’t seem to have any valid coupons.<br>
Invite your friends. Unlock free ride coupons</p>
<div class="cab_coupon_box">
<button ion-button class="cab_coupon_apply">Apply</button>
</div>
<div class="cab_coupon_content">
<p>Payment Details</p>
<li>
<div class="child textLeft">Total</div>
<div class="child textRight">$ 150</div>
<div class="clear"></div>
</li>
<li>
<div class="child textLeft">Discount</div>
<div class="child textRight">$ 25</div>
<div class="clear"></div>
</li>
<li>
<div class="child textLeft">Due after service</div>
<div class="child textRight">$ 125</div>
<div class="clear"></div>
</li>
</div>
</div>
</ion-content>
<ion-footer>
<div class="cab_footer_btn_bay">
<button ion-button class="cab_footer_btn floatRight"(click)="pay()">PAY</button>
<button ion-button class="cab_footer_btn floatLeft" (click)="goBack()">CANCEL</button>
<div class="clear"></div>
</div>
</ion-footer>
src/pages/addcoupon/addcoupon.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { AddcouponPage } from './addcoupon';
@NgModule({
declarations: [
AddcouponPage,
],
imports: [
IonicPageModule.forChild(AddcouponPage),
],
})
export class AddcouponPageModule {}
src/pages/addcoupon/addcoupon.ts 0 → 100644
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,ModalController } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-addcoupon',
templateUrl: 'addcoupon.html',
})
export class AddcouponPage {
constructor(public navCtrl: NavController, public navParams: NavParams,public modalCtrl: ModalController) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad AddcouponPage');
}
goBack(){
this.navCtrl.pop();
}
pay() {
let modal = this.modalCtrl.create('ConfirmridePage');
modal.present();
}
}
src/pages/confirmride/confirmride.html 0 → 100644
<ion-header class="theme_dark_bg">
<button ion-button class="nav_btn theme_color floatLeft"(click)="dismiss()">
<ion-icon name="close"></ion-icon>
</button>
<div class="nav_header_title floatLeft">Success</div>
<div class="clear"></div>
</ion-header>
<ion-content padding class="theme_dark_bg">
<div class="cab_logo" style="padding-bottom: 20%;">
<img src="assets/img/booking.png">
</div>
<p class="text_white textCenter cab_confirm_p">Your booking has been confirmed.<br>
Driver will pick you in 5 minute(s)</p>
</ion-content>
<ion-footer>
<button ion-button class="cab_footer_btn width100 theme_bgcolor text_white" (click)="payment()">OKAY</button>
</ion-footer>
src/pages/confirmride/confirmride.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { ConfirmridePage } from './confirmride';
@NgModule({
declarations: [
ConfirmridePage,
],
imports: [
IonicPageModule.forChild(ConfirmridePage),
],
})
export class ConfirmridePageModule {}
src/pages/confirmride/confirmride.ts 0 → 100644
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,ViewController,ModalController } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-confirmride',
templateUrl: 'confirmride.html',
})
export class ConfirmridePage {
constructor(public navCtrl: NavController, public navParams: NavParams,public viewCtrl: ViewController,public modalCtrl: ModalController) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad ConfirmridePage');
}
dismiss()
{
this.viewCtrl.dismiss();
}
payment() {
let modal = this.modalCtrl.create('PaymentPage');
modal.present();
this.viewCtrl.dismiss()
}
}
src/pages/home/home.html
<ion-header> <ion-content>
<ion-navbar> <div class="theme_transparent_bg cab_home_custom_header">
<button ion-button menuToggle> <button ion-button class="nav_btn theme_color floatLeft" menuToggle>
<ion-icon name="menu"></ion-icon> <ion-icon name="ios-menu"></ion-icon>
</button> </button>
<ion-title>Home</ion-title> <div class="clear"></div>
</ion-navbar> </div>
</ion-header> <div class="cab_map">
<div #map id="map">
<ion-content padding> </div>
<h3>Ionic Menu Starter</h3> </div>
<button ion-button class="cab_button_search theme_bgcolor" (click)="searchride()"><ion-icon name="search"></ion-icon></button>
<p>
If you get lost, the <a href="http://ionicframework.com/docs/v2">docs</a> will show you the way.
</p>
<button ion-button secondary menuToggle>Toggle Menu</button>
</ion-content> </ion-content>
<ion-footer>
<div class="cab_footer_location theme_bgcolor">
<input class="cab_location_input cab_current" placeholder="Pickup Location">
<input class="cab_location_input cab_destination" placeholder="Drop Location">
</div>
<div class="cab_footer_btn_bay">
<button ion-button class="cab_footer_btn floatRight" (click)="ridenow()">RIDE NOW</button>
<button ion-button class="cab_footer_btn floatLeft" (click)="ridemore()">RIDE LATER</button>
<div class="clear"></div>
</div>
</ion-footer>
src/pages/home/home.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { HomePage } from './home';
@NgModule({
declarations: [
HomePage,
],
imports: [
IonicPageModule.forChild(HomePage),
],
})
export class HomePageModule {}
src/pages/home/home.ts
import { Component } from '@angular/core'; import { Component,ViewChild, ElementRef} from '@angular/core';
import { NavController } from 'ionic-angular'; import { IonicPage, NavController, NavParams,ModalController } from 'ionic-angular';
declare var google;
@IonicPage()
@Component({ @Component({
selector: 'page-home', selector: 'page-home',
templateUrl: 'home.html' templateUrl: 'home.html',
}) })
export class HomePage { export class HomePage {
constructor(public navCtrl: NavController) { @ViewChild('map') mapElement: ElementRef;
map: any;
constructor(public navCtrl: NavController, public navParams: NavParams,public modalCtrl: ModalController) {
}
ionViewDidLoad() {
this.loadMap();
} }
loadMap(){
let latLng = new google.maps.LatLng(-34.9290, 138.6010);
let mapOptions = {
center: latLng,
zoom: 15,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
this.map = new google.maps.Map(this.mapElement.nativeElement, mapOptions);
}
ridemore() {
let modal = this.modalCtrl.create('RidepopPage');
modal.present();
}
ridenow() {
let modal = this.modalCtrl.create('RidenowPage');
modal.present();
}
searchride(){
let modal = this.modalCtrl.create('SearchridePage');
modal.present();
}
} }
src/pages/landing/landing.html 0 → 100644
<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('LoginPage')">Sign In</button>
</div>
<div class="cab_form_row textCenter">
<p>Forgot Password</p>
</div>
</div>
</div>
</ion-content>
<ion-footer>
<div class="cab_footer">
<p>Or Sign in with</p>
<li><img src="assets/img/fb.png"></li>
<li><img src="assets/img/linked.png"></li>
<div class="clear"></div>
</div>
</ion-footer>
src/pages/landing/landing.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { LandingPage } from './landing';
@NgModule({
declarations: [
LandingPage,
],
imports: [
IonicPageModule.forChild(LandingPage),
],
})
export class LandingPageModule {}
src/pages/landing/landing.ts 0 → 100644
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) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad LandingPage');
}
open_page(page){
this.navCtrl.push(page);
}
}
src/pages/list/list.html deleted 100644 → 0
<ion-header>
<ion-navbar>
<button ion-button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>List</ion-title>
</ion-navbar>
</ion-header>
<ion-content>
<ion-list>
<button ion-item *ngFor="let item of items" (click)="itemTapped($event, item)">
<ion-icon [name]="item.icon" item-left></ion-icon>
{{item.title}}
<div class="item-note" item-right>
{{item.note}}
</div>
</button>
</ion-list>
<div *ngIf="selectedItem" padding>
You navigated here from <b>{{selectedItem.title}}</b>
</div>
</ion-content>
src/pages/list/list.ts deleted 100644 → 0
import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
@Component({
selector: 'page-list',
templateUrl: 'list.html'
})
export class ListPage {
selectedItem: any;
icons: string[];
items: Array<{title: string, note: string, icon: string}>;
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) {
// That's right, we're pushing to ourselves!
this.navCtrl.push(ListPage, {
item: item
});
}
}
src/pages/login/login.html 0 → 100644
<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">
<div class="cab_form_row">
<div class="cab_phone_number">
<select class="cab_phone_code floatLeft">
<option>+91</option>
</select>
<input class="cab_phone_input floatRight cab_call" placeholder="Mobile Number">
<div class="clear"></div>
</div>
</div>
<br>
<div class="cab_form_row">
<div class="cab_phone_number">
<input class="cab_phone_input cab_pass width100" placeholder="Password">
<div class="clear"></div>
</div>
</div>
<br>
<div class="cab_form_row textCenter">
<ion-item>
<ion-label><p>Remember me</p></ion-label>
<ion-checkbox></ion-checkbox>
</ion-item>
</div>
<br>
<div class="cab_form_row">
<button ion-button class="cab_sign_btn" (click)="open_page('HomePage')">Sign In</button>
</div>
<br>
<div class="cab_form_row textCenter">
<p>Forgot Password</p>
</div>
</div>
</div>
</ion-content>
src/pages/login/login.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { LoginPage } from './login';
@NgModule({
declarations: [
LoginPage,
],
imports: [
IonicPageModule.forChild(LoginPage),
],
})
export class LoginPageModule {}
src/pages/login/login.ts 0 → 100644
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-login',
templateUrl: 'login.html',
})
export class LoginPage {
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad LoginPage');
}
open_page(page){
this.navCtrl.push(page);
}
goBack(){
this.navCtrl.pop();
}
}
src/pages/mytrips/mytrips.html 0 → 100644
<ion-header class="theme_dark_bg">
<button ion-button class="nav_btn theme_color floatLeft" menuToggle>
<ion-icon name="ios-menu"></ion-icon>
</button>
<div class="nav_header_title floatLeft">My Trips</div>
<button class="nav_btn floatRight"></button>
<div class="clear"></div>
</ion-header>
<ion-content class="themelogin_background">
<div class="cab_mytrips_wrapper">
<div class="cab_trip_tabs_bay">
<ul>
<li ion-button [ngClass]="{'active' : slidertab == 0}" (click)="goToSlide(0)">All Rides</li>
<li ion-button [ngClass]="{'active' : slidertab == 1}" (click)="goToSlide(1)">Upcoming</li>
<li ion-button [ngClass]="{'active' : slidertab == 2}" (click)="goToSlide(2)">Completed</li>
<div class="clear"></div>
</ul>
</div>
<div class="cab_trip_content">
<ion-slides pager="false" #mySlider class="hm_service_slide" (ionSlideDidChange)="slideChanged()">
<ion-slide>
<ul>
<li (click)="open_page('TripdetailsPage')">
<h6>11 AM from taana to Mumbai Airport Domestic Terminal</h6>
<p>Today<span>11:30pm</span></p>
<ion-icon name="ios-arrow-forward-outline"></ion-icon>
<div class="clear"></div>
</li>
<li>
<h6>11 AM from taana to Mumbai Airport Domestic Terminal</h6>
<p>Today</p>
<ion-icon name="ios-arrow-forward-outline"></ion-icon>
<div class="clear"></div>
</li>
<li>
<h6>11 AM from taana to Mumbai Airport Domestic Terminal</h6>
<p>Today</p>
<ion-icon name="ios-arrow-forward-outline"></ion-icon>
<div class="clear"></div>
</li>
<li>
<h6>11 AM from taana to Mumbai Airport Domestic Terminal</h6>
<p>Today</p>
<ion-icon name="ios-arrow-forward-outline"></ion-icon>
<div class="clear"></div>
</li>
<li>
<h6>11 AM from taana to Mumbai Airport Domestic Terminal</h6>
<p>Today</p>
<ion-icon name="ios-arrow-forward-outline"></ion-icon>
<div class="clear"></div>
</li>
<li>
<h6>11 AM from taana to Mumbai Airport Domestic Terminal</h6>
<p>Today</p>
<ion-icon name="ios-arrow-forward-outline"></ion-icon>
<div class="clear"></div>
</li>
</ul>
</ion-slide>
<ion-slide>
<ul>
<li>
<h6>11 AM from taana to Mumbai Airport Domestic Terminal</h6>
<p>Today</p>
<ion-icon name="ios-arrow-forward-outline"></ion-icon>
<div class="clear"></div>
</li>
<li>
<h6>11 AM from taana to Mumbai Airport Domestic Terminal</h6>
<p>Today</p>
<ion-icon name="ios-arrow-forward-outline"></ion-icon>
<div class="clear"></div>
</li>
<li>
<h6>11 AM from taana to Mumbai Airport Domestic Terminal</h6>
<p>Today</p>
<ion-icon name="ios-arrow-forward-outline"></ion-icon>
<div class="clear"></div>
</li>
</ul>
</ion-slide>
<ion-slide>
<ul>
<li>
<h6>11 AM from taana to Mumbai Airport Domestic Terminal</h6>
<p>Today</p>
<ion-icon name="ios-arrow-forward-outline"></ion-icon>
<div class="clear"></div>
</li>
<li>
<h6>11 AM from taana to Mumbai Airport Domestic Terminal</h6>
<p>Today</p>
<ion-icon name="ios-arrow-forward-outline"></ion-icon>
<div class="clear"></div>
</li>
</ul>
</ion-slide>
</ion-slides>
</div>
</div>
</ion-content>
src/pages/mytrips/mytrips.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { MytripsPage } from './mytrips';
@NgModule({
declarations: [
MytripsPage,
],
imports: [
IonicPageModule.forChild(MytripsPage),
],
})
export class MytripsPageModule {}
src/pages/mytrips/mytrips.ts 0 → 100644
import { Component,ViewChild } from '@angular/core';
import { IonicPage, NavController, NavParams,Content,Slides } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-mytrips',
templateUrl: 'mytrips.html',
})
export class MytripsPage {
showPrev:any;
showNext:any;
currentIndex:any;
slidertab:any;
@ViewChild(Content) content: Content;
@ViewChild('mySlider') slider: Slides;
constructor(public navCtrl: NavController, public navParams: NavParams) {
let id = this.navParams.get("id");
this.slidertab = id;
console.log("id", id);
setTimeout(() => {
this.goToSlide(id);
}, 500)
this.slidertab = 0;
}
ionViewDidLoad() {
console.log('ionViewDidLoad MytripsPage');
}
goToSlide(id) {
this.slider.slideTo(id, 500);
}
slideChanged() {
let currentIndex = this.slider.getActiveIndex();
this.slidertab = currentIndex;
console.log("Current index is", currentIndex);
}
open_page(page){
this.navCtrl.push(page);
}
}
src/pages/payment/payment.html 0 → 100644
<ion-header class="theme_dark_bg">
<button ion-button class="nav_btn theme_color floatLeft"(click)="dismiss()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">Payment Details</div>
<div class="clear"></div>
</ion-header>
<ion-content padding class="cab_coupon_bg">
<div class="cab_trip_detail_wrapper">
<h4 class="text_white">Pickup Point</h4>
<p class="floatLeft textLeft width50">North Sarovar Road,E City</p>
<p class="floatRight textRight width50">11 :23 am, 02-08-2017</p>
<div class="clear"></div>
<br>
<h4 class="text_white">Drop Point</h4>
<p class="floatLeft textLeft width50">Majestic Junction 3rd Street</p>
<p class="floatRight textRight width50">12 :00 am, 02-08-2017</p>
<div class="clear"></div>
<br>
<br>
</div>
<div class="cab_coupon_content">
<p style="padding-top: 0px;margin-top: 0px;margin-bottom: 0px;">Payment Details</p>
<li>
<div class="child textLeft">Total</div>
<div class="child textRight">$ 150</div>
<div class="clear"></div>
</li>
<li>
<div class="child textLeft">Discount</div>
<div class="child textRight">$ 25</div>
<div class="clear"></div>
</li>
<li>
<div class="child textLeft">Due after service</div>
<div class="child textRight">$ 125</div>
<div class="clear"></div>
</li>
</div>
</ion-content>
<ion-footer>
<div class="theme_bgcolor p10 text_white">
<p class="floatLeft text_size_18">Total</p>
<p class="floatRight text_size_18">$ 125</p>
<div class="clear"></div>
</div>
<button ion-button class="cab_footer_btn width100 text_white" (click)="open_page('HomePage')">OKAY</button>
</ion-footer>
src/pages/payment/payment.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { PaymentPage } from './payment';
@NgModule({
declarations: [
PaymentPage,
],
imports: [
IonicPageModule.forChild(PaymentPage),
],
})
export class PaymentPageModule {}
src/pages/payment/payment.ts 0 → 100644
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,ViewController } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-payment',
templateUrl: 'payment.html',
})
export class PaymentPage {
constructor(public navCtrl: NavController, public navParams: NavParams,public viewCtrl: ViewController) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad PaymentPage');
}
dismiss()
{
this.viewCtrl.dismiss();
}
open_page(page){
this.navCtrl.push(page);
this.viewCtrl.dismiss();
}
}
src/pages/profile/profile.html 0 → 100644
<ion-header class="theme_dark_bg">
<button ion-button class="nav_btn theme_color floatLeft" menuToggle>
<ion-icon name="ios-menu"></ion-icon>
</button>
<div class="nav_header_title floatLeft">Edit Profile</div>
<div class="clear"></div>
</ion-header>
<ion-content padding class="themelogin_background">
<div class="cab_edit_profile_wrapper">
<div class="cab_edit_profilepic_edit">
</div>
<div class="cab_edit_profile_edit_form">
<div class="cab_form">
<div class="cab_form_row cab_edit_profile_edit_row">
<div class="cab_phone_number">
<select class="cab_phone_code floatLeft">
<option>+91</option>
</select>
<input class="cab_phone_input floatRight cab_call" placeholder="Mobile Number">
<div class="clear"></div>
</div>
</div>
<div class="cab_form_row cab_edit_profile_edit_row">
<div class="cab_phone_number">
<input class="cab_phone_input cab_user width100" placeholder="Username">
<div class="clear"></div>
</div>
</div>
<div class="cab_form_row cab_edit_profile_edit_row">
<div class="cab_phone_number">
<input class="cab_phone_input cab_pass width100" placeholder="Password" type="password">
<div class="clear"></div>
</div>
</div>
<div class="cab_form_row cab_edit_profile_edit_row">
<div class="cab_phone_number">
<input class="cab_phone_input cab_pass width100" placeholder="Confirm Password" type="password">
<div class="clear"></div>
</div>
</div>
</div>
</div>
</div>
</ion-content>
<ion-footer>
<button ion-button class="cab_footer_btn width100 text_white">UPDATE</button>
</ion-footer>
src/pages/profile/profile.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { ProfilePage } from './profile';
@NgModule({
declarations: [
ProfilePage,
],
imports: [
IonicPageModule.forChild(ProfilePage),
],
})
export class ProfilePageModule {}
src/pages/profile/profile.ts 0 → 100644
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
/**
* Generated class for the ProfilePage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/
@IonicPage()
@Component({
selector: 'page-profile',
templateUrl: 'profile.html',
})
export class ProfilePage {
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad ProfilePage');
}
}
src/pages/ratecard/ratecard.html 0 → 100644
<ion-content class="bg_transparent">
<div class="cab_ride_pop">
<div class="cab_ride_inner theme_bgcolor">
<div class="cab_ride_down_arrow theme_bgcolor">
<ion-icon name="ios-arrow-down-outline"(click)="dismiss()"></ion-icon>
</div>
<p>Sedan</p>
<h6>Toyota Etios, Ford Fiesta</h6>
<div class="cab_ride_fare_break">Fare Breakup</div>
<ion-grid>
<ion-row class="textCenter">
<ion-col col-4>
<strong>₹ 100</strong>
<h5>First 4km</h5>
</ion-col>
<ion-col col-4>
<strong>₹ 12/km</strong>
<h5>After 4km</h5>
</ion-col>
<ion-col col-4>
<strong>₹ 1/min</strong>
<h5>Ride time Rate</h5>
</ion-col>
</ion-row>
</ion-grid>
<h6 class="bottom0">Peak time charges may apply.</h6>
<div class="cab_trip_detail_wrapper">
<h4 class="text_white">Pickup Point</h4>
<p class="floatLeft textLeft width50">North Sarovar Road,E City</p>
<p class="floatRight textRight width50">11 :23 am, 02-08-2017</p>
<div class="clear"></div>
<br>
<h4 class="text_white">Drop Point</h4>
<p class="floatLeft textLeft width50">Majestic Junction 3rd Street</p>
<p class="floatRight textRight width50">12 :00 am, 02-08-2017</p>
<div class="clear"></div>
<br>
<br>
</div>
</div>
</div>
</ion-content>
<ion-footer>
<button ion-button class="cab_footer_btn width100" (click)="dismiss()">OKAY</button>
</ion-footer>
\ No newline at end of file
src/pages/ratecard/ratecard.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { RatecardPage } from './ratecard';
@NgModule({
declarations: [
RatecardPage,
],
imports: [
IonicPageModule.forChild(RatecardPage),
],
})
export class RatecardPageModule {}
src/pages/ratecard/ratecard.ts 0 → 100644
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,ViewController } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-ratecard',
templateUrl: 'ratecard.html',
})
export class RatecardPage {
constructor(public navCtrl: NavController, public navParams: NavParams,public viewCtrl: ViewController) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad RatecardPage');
}
dismiss()
{
this.viewCtrl.dismiss();
}
}
src/pages/ridenow/ridenow.html 0 → 100644
<ion-content class="bg_transparent">
<div class="cab_ride_pop">
<div class="cab_ride_inner theme_bgcolor" style="padding-top: 15px;">
<div class="cab_ride_down_arrow theme_bgcolor">
<ion-icon name="ios-arrow-down-outline"(click)="dismiss()"></ion-icon>
</div>
<ion-grid>
<ion-row>
<ion-col col-6 style="border-right: 1px solid #fff;">
<div class="cab_pop_detail_left floatLeft c1"></div>
<div class="cab_pop_details floatLeft textLeft">
<strong>Cab Type</strong>
<h5>Sedan</h5>
</div>
<div class="clear"></div>
</ion-col>
<ion-col col-6>
<div class="cab_pop_detail_left floatLeft c6"></div>
<div class="cab_pop_details floatLeft textLeft">
<strong>Pickup Time</strong>
<h5>02 Min from now</h5>
</div>
<div class="clear"></div>
</ion-col>
</ion-row>
</ion-grid>
<div class="cab_ride_offer">
<li (click)="ratecard()">Rate Card</li>
<li>Rate Estimate</li>
<div class="clear"></div>
</div>
</div>
</div>
</ion-content>
<ion-footer>
<div class="cab_footer_btn_bay">
<button ion-button class="cab_footer_btn floatRight" (click)="addcoupon()">CONFIRM RIDE</button>
<button ion-button class="cab_footer_btn floatLeft" (click)="dismiss()">CANCEL RIDE</button>
<div class="clear"></div>
</div>
</ion-footer>
src/pages/ridenow/ridenow.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { RidenowPage } from './ridenow';
@NgModule({
declarations: [
RidenowPage,
],
imports: [
IonicPageModule.forChild(RidenowPage),
],
})
export class RidenowPageModule {}
src/pages/ridenow/ridenow.ts 0 → 100644
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,ViewController,ModalController } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-ridenow',
templateUrl: 'ridenow.html',
})
export class RidenowPage {
constructor(public navCtrl: NavController, public navParams: NavParams,public viewCtrl: ViewController,public modalCtrl: ModalController) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad RidenowPage');
}
confirm() {
let modal = this.modalCtrl.create('ConfirmridePage');
modal.present();
}
dismiss()
{
this.viewCtrl.dismiss();
}
addcoupon() {
let modal = this.modalCtrl.create('AddcouponPage');
modal.present();
}
ratecard() {
let modal = this.modalCtrl.create('RatecardPage');
modal.present();
}
}
src/pages/ridepop/ridepop.html 0 → 100644
<ion-content class="bg_transparent">
<div class="cab_ride_pop">
<div class="cab_ride_inner theme_bgcolor">
<div class="cab_ride_down_arrow theme_bgcolor">
<ion-icon name="ios-arrow-down-outline"(click)="dismiss()"></ion-icon>
</div>
<p>Sedan</p>
<h6>Toyota Etios, Ford Fiesta</h6>
<div class="cab_ride_fare_break">Fare Breakup</div>
<ion-grid>
<ion-row class="textCenter">
<ion-col col-4>
<strong>₹ 100</strong>
<h5>First 4km</h5>
</ion-col>
<ion-col col-4>
<strong>₹ 12/km</strong>
<h5>After 4km</h5>
</ion-col>
<ion-col col-4>
<strong>₹ 1/min</strong>
<h5>Ride time Rate</h5>
</ion-col>
</ion-row>
</ion-grid>
<h6 class="bottom0">Peak time charges may apply.</h6>
<div class="cab_ride_bottom_section">
<li class="c1">
<p>1 min</p>
</li>
<li class="c2">
<p>5 min</p>
</li>
<li class="c3">
<p>3 min</p>
</li>
<li class="c4">
<p>Arriving</p>
</li>
<li class="c5">
<p>Out</p>
</li>
<div class="clear"></div>
</div>
</div>
</div>
</ion-content>
<ion-footer>
<div class="cab_footer_btn_bay">
<button ion-button class="cab_footer_btn floatRight" (click)="dismiss()">RIDE NOW</button>
<button ion-button class="cab_footer_btn floatLeft" (click)="dismiss()">RIDE LATER</button>
<div class="clear"></div>
</div>
</ion-footer>
src/pages/ridepop/ridepop.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { RidepopPage } from './ridepop';
@NgModule({
declarations: [
RidepopPage,
],
imports: [
IonicPageModule.forChild(RidepopPage),
],
})
export class RidepopPageModule {}
src/pages/ridepop/ridepop.ts 0 → 100644
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,ViewController} from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-ridepop',
templateUrl: 'ridepop.html',
})
export class RidepopPage {
constructor(public navCtrl: NavController, public navParams: NavParams,public viewCtrl: ViewController) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad RidepopPage');
}
dismiss()
{
this.viewCtrl.dismiss();
}
}
src/pages/searchride/searchride.html 0 → 100644
<ion-header class="theme_dark_bg">
<button ion-button class="nav_btn theme_color floatLeft" (click)="dismiss()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">Search Results</div>
<button class="nav_btn floatRight"></button>
<div class="clear"></div>
<div class="cab_footer_location theme_dark_bg">
<input class="cab_location_input cab_search" placeholder="Search for rides">
</div>
</ion-header>
<ion-content class="themedark_theme">
<div class="cab_search_result_page">
<p>Popular Search</p>
<ul>
<li>
<h5>Mumbai International Airport Terminal</h5>
<h6>Santacruz Bay,Mumbai,India</h6>
</li>
<li>
<h5>Mumbai International Airport Terminal</h5>
<h6>Santacruz Bay,Mumbai,India</h6>
</li>
<li>
<h5>Mumbai International Airport Terminal</h5>
<h6>Santacruz Bay,Mumbai,India</h6>
</li>
<li>
<h5>Mumbai International Airport Terminal</h5>
<h6>Santacruz Bay,Mumbai,India</h6>
</li>
<li>
<h5>Mumbai International Airport Terminal</h5>
<h6>Santacruz Bay,Mumbai,India</h6>
</li>
<li>
<h5>Mumbai International Airport Terminal</h5>
<h6>Santacruz Bay,Mumbai,India</h6>
</li>
<li>
<h5>Mumbai International Airport Terminal</h5>
<h6>Santacruz Bay,Mumbai,India</h6>
</li>
</ul>
</div>
</ion-content>
src/pages/searchride/searchride.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { SearchridePage } from './searchride';
@NgModule({
declarations: [
SearchridePage,
],
imports: [
IonicPageModule.forChild(SearchridePage),
],
})
export class SearchridePageModule {}
src/pages/searchride/searchride.ts 0 → 100644
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,ViewController } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-searchride',
templateUrl: 'searchride.html',
})
export class SearchridePage {
constructor(public navCtrl: NavController, public navParams: NavParams,public viewCtrl: ViewController) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad SearchridePage');
}
dismiss()
{
this.viewCtrl.dismiss();
}
}
src/pages/settings/settings.html 0 → 100644
<ion-header class="theme_dark_bg">
<button ion-button class="nav_btn theme_color floatLeft" menuToggle>
<ion-icon name="ios-menu"></ion-icon>
</button>
<div class="nav_header_title floatLeft">Settings</div>
<div class="clear"></div>
</ion-header>
<ion-content padding class="themelogin_background">
</ion-content>
<ion-footer>
<button ion-button class="cab_footer_btn width100 text_white">SAVE</button>
</ion-footer>
src/pages/settings/settings.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { SettingsPage } from './settings';
@NgModule({
declarations: [
SettingsPage,
],
imports: [
IonicPageModule.forChild(SettingsPage),
],
})
export class SettingsPageModule {}
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