Commit bff7d194 by 123bila

fixmyauto garage final

parents
# EditorConfig helps developers define and maintain consistent coding styles between different editors and IDEs
# editorconfig.org
root = true
[*]
indent_style = space
indent_size = 2
# We recommend you to keep these unchanged
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
[*.md]
trim_trailing_whitespace = false
\ No newline at end of file
# Specifies intentionally untracked files to ignore when using Git
# http://git-scm.com/docs/gitignore
*~
*.sw[mnpcod]
*.log
*.tmp
*.tmp.*
log.txt
*.sublime-project
*.sublime-workspace
.vscode/
npm-debug.log*
.idea/
.sourcemaps/
.sass-cache/
.tmp/
.versions/
coverage/
dist/
node_modules/
tmp/
temp/
hooks/
platforms/
plugins/
plugins/android.json
plugins/ios.json
www/
$RECYCLE.BIN/
.DS_Store
Thumbs.db
UserInterfaceState.xcuserstate
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.app.fixmyautogarage" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>Garnedo Garage</name>
<description>An app for garages to add their services.</description>
<author email="[email protected]" href="http://techlabz.in/">Techware Solutions</author>
<content src="index.html" />
<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<preference name="ScrollEnabled" value="false" />
<preference name="android-minSdkVersion" value="16" />
<preference name="BackupWebStorage" value="none" />
<preference name="SplashMaintainAspectRatio" value="true" />
<preference name="FadeSplashScreenDuration" value="300" />
<preference name="SplashShowOnlyFirstTime" value="false" />
<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="3000" />
<platform name="android">
<allow-intent href="market:*" />
<icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />
<icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png" />
<icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png" />
<icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png" />
<icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png" />
<icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
<splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png" />
<splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png" />
<splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png" />
<splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png" />
<splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png" />
<splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png" />
<splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png" />
<splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png" />
<splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png" />
<splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png" />
<splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png" />
<splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png" />
</platform>
<platform name="ios">
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
<icon height="57" src="resources/ios/icon/icon.png" width="57" />
<icon height="114" src="resources/ios/icon/[email protected]" width="114" />
<icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
<icon height="80" src="resources/ios/icon/[email protected]" width="80" />
<icon height="120" src="resources/ios/icon/[email protected]" width="120" />
<icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
<icon height="100" src="resources/ios/icon/[email protected]" width="100" />
<icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
<icon height="120" src="resources/ios/icon/[email protected]" width="120" />
<icon height="180" src="resources/ios/icon/[email protected]" width="180" />
<icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
<icon height="144" src="resources/ios/icon/[email protected]" width="144" />
<icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
<icon height="152" src="resources/ios/icon/[email protected]" width="152" />
<icon height="167" src="resources/ios/icon/[email protected]" width="167" />
<icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
<icon height="58" src="resources/ios/icon/[email protected]" width="58" />
<icon height="87" src="resources/ios/icon/[email protected]" width="87" />
<icon height="1024" src="resources/ios/icon/icon-1024.png" width="1024" />
<splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
<splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
<splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
<splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208" />
<splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
<splash height="2048" src="resources/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
<splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" />
<splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
<splash height="2732" src="resources/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
<splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768" />
<splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
<splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
<splash height="2732" src="resources/ios/splash/Default@2x~universal~anyany.png" width="2732" />
<edit-config file="*-Info.plist" mode="merge" target="UIStatusBarHidden">
<true />
</edit-config>
<edit-config file="*-Info.plist" mode="merge" target="UIViewControllerBasedStatusBarAppearance">
<false />
</edit-config>
</platform>
<edit-config file="*-Info.plist" mode="merge" target="NSLocationWhenInUseUsageDescription">
<string>Allow to access location</string>
</edit-config>
<plugin name="cordova-plugin-whitelist" spec="^1.3.3" />
<plugin name="cordova-plugin-device" spec="^2.0.1" />
<plugin name="cordova-plugin-splashscreen" spec="^5.0.2" />
<plugin name="cordova-plugin-ionic-webview" spec="^1.1.16" />
<plugin name="cordova-plugin-ionic-keyboard" spec="^2.0.5" />
<plugin name="cordova.plugins.diagnostic" spec="~4.0.3" />
<plugin name="onesignal-cordova-plugin" spec="~2.3.3" />
<plugin name="com.synconset.imagepicker" spec="~2.1.10">
<variable name="PHOTO_LIBRARY_USAGE_DESCRIPTION" value="your usage message" />
</plugin>
<plugin name="cordova-plugin-file" spec="~6.0.1" />
<plugin name="cordova-plugin-file-transfer" spec="~1.7.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>
<engine name="android" spec="~6.1.2" />
<plugin name="com-sarriaroman-photoviewer" spec="^1.1.18" />
</widget>
{
"name": "garage",
"app_id": "",
"type": "ionic-angular",
"integrations": {
"cordova": {}
}
}
This source diff could not be displayed because it is too large. You can view the blob instead.
{
"name": "garage",
"version": "0.0.1",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"private": true,
"scripts": {
"clean": "ionic-app-scripts clean",
"build": "ionic-app-scripts build",
"lint": "ionic-app-scripts lint",
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve"
},
"dependencies": {
"@angular/animations": "5.2.9",
"@angular/common": "5.2.9",
"@angular/compiler": "5.2.9",
"@angular/compiler-cli": "5.2.9",
"@angular/core": "5.2.9",
"@angular/forms": "5.2.9",
"@angular/http": "5.2.9",
"@angular/platform-browser": "5.2.9",
"@angular/platform-browser-dynamic": "5.2.9",
"@ionic-native/core": "4.5.3",
"@ionic-native/diagnostic": "^4.6.0",
"@ionic-native/file": "^4.3.2",
"@ionic-native/file-transfer": "^4.7.0",
"@ionic-native/geolocation": "^4.14.0",
"@ionic-native/image-picker": "^4.7.0",
"@ionic-native/location-accuracy": "^4.14.0",
"@ionic-native/onesignal": "^4.7.0",
"@ionic-native/photo-viewer": "^4.18.0",
"@ionic-native/splash-screen": "4.5.3",
"@ionic-native/status-bar": "4.5.3",
"@ionic/storage": "2.1.3",
"com-sarriaroman-photoviewer": "^1.1.18",
"cordova-android": "~6.1.2",
"cordova-plugin-geolocation": "^4.0.1",
"cordova-plugin-request-location-accuracy": "^2.2.3",
"ionic-angular": "3.9.2",
"ionicons": "3.0.0",
"rxjs": "5.5.7",
"sw-toolbox": "3.6.0",
"zone.js": "0.8.20"
},
"devDependencies": {
"@ionic/app-scripts": "3.1.8",
"typescript": "~2.6.2"
},
"description": "An Ionic project",
"cordova": {
"platforms": [
"android"
],
"plugins": {
"cordova-plugin-request-location-accuracy": {},
"cordova-plugin-geolocation": {
"GEOLOCATION_USAGE_DESCRIPTION": "To locate you"
},
"com-sarriaroman-photoviewer": {}
}
}
}
679432675f26c5bf6c6c5e3e4cb34f33
\ No newline at end of file
50b3381a4f0b85d265867b80963724b7
\ No newline at end of file
import { Component, ViewChild } from '@angular/core';
import { Nav,Platform ,Events} from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { Storage } from '@ionic/storage';
import { OneSignal } from '@ionic-native/onesignal';
import {Myservice} from '../providers/myservice';
import { Geolocation } from '@ionic-native/geolocation';
import { LocationAccuracy } from '@ionic-native/location-accuracy';
@Component({
templateUrl: 'app.html'
})
export class MyApp {
@ViewChild(Nav) nav: Nav;
rootPage:any = 'LandingPage';
user_data:any;
open_count:any;
device_id:any;
noti_count:any = 0;
constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen,public events:Events,public storage:Storage,private oneSignal: OneSignal, private myservice: Myservice,private geolocation: Geolocation,private locationAccuracy: LocationAccuracy) {
events.subscribe('user:notifications', userdetails => {
this.get_noti_count();
});
this.storage.get('user_data').then((user_data) => {
if(user_data){
this.user_data=user_data;
this.get_booking();
this.get_noti_count();
}
})
setInterval(() => {
this.storage.get('user_data').then((user_data) => {
if(user_data){
this.user_data=user_data;
this.get_booking();
this.get_noti_count();
}
})
}, 5000);
platform.ready().then(() => {
// Okay, so the platform is ready and our plugins are available.
// Here you can do any higher level native things you might need.
//statusBar.styleDefault();
statusBar.hide();
statusBar.overlaysWebView(true);
splashScreen.hide();
this.enable_location();
this.geolocation.getCurrentPosition().then(pos => {
console.log('lat: ' + pos.coords.latitude + ', lon: ' + pos.coords.longitude);
console.log(pos);
this.storage.set('lat_lng', {'lat': pos.coords.latitude ,'lng':pos.coords.longitude});
});
this.triggerNotification();
platform.registerBackButtonAction(() => {
// get current active page
let view = this.nav.getActive();
if (view.component.name == "ListVehiclePage") {
/* //Double check to exit app
if (new Date().getTime() - lastTimeBackPress < timePeriodToExit) {
this.platform.exitApp(); //Exit from app
} else {
let toast = this.toastCtrl.create({
message: 'Press back again to exit App?',
duration: 3000,
position: 'bottom'
});
toast.present();
lastTimeBackPress = new Date().getTime();
} */
} else {
// go to previous page
this.nav.pop({});
}
});
});
this.storage.get('user_data').then((user_data) => {
if(user_data){
this.user_data=user_data;
this.get_booking();
}
})
events.subscribe('user:update_profile', userdetails => {
console.log("app comp", userdetails);
if(userdetails !== undefined && userdetails !== ""){
this.storage.set('user_data', userdetails);
this.user_data = userdetails;
console.log("profile", this.user_data);
}
else {
console.log("logout");
this.storage.remove('user_data');
this.user_data = '';
}
});
events.subscribe('user:incomp_read_status', userdetails => {
this.get_booking();
});
}
logout() {
this.storage.remove('user_data');
this.events.publish('user:update_profile', '');
this.nav.setRoot('LoginPage');
}
edit_pro(){
this.nav.setRoot('AddcarPage');
}
login(){
this.nav.setRoot('LoginPage');
}
booking(){
this.nav.setRoot('Booking');
}
home(){
this.nav.setRoot('ListVehiclePage');
}
schedule(){
this.nav.setRoot('TimingPage');
}
addoffers(){
this.nav.setRoot('Addoffers');
}
viewoffers(){
this.nav.setRoot('Viewoffers');
}
viewservices(){
this.nav.setRoot('Selected_services');
}
/*location accuracy starts */
enable_location() {
let options = {
enableHighAccuracy: true
};
this.locationAccuracy.canRequest().then((res: boolean) => {
if (res) {
//console.log(this.locationAccuracy.REQUEST_PRIORITY_HIGH_ACCURACY);
let location_accuracyy = Number(this.locationAccuracy.REQUEST_PRIORITY_HIGH_ACCURACY);
let location_accuracy = location_accuracyy.toString();
this.locationAccuracy.request(location_accuracyy).then((loc) => {
this.geolocation.getCurrentPosition().then(pos => {
console.log('lat: ' + pos.coords.latitude + ', lon: ' + pos.coords.longitude);
console.log(pos);
this.storage.set('latitude', pos.coords.latitude);
this.storage.set('longitude', pos.coords.longitude);
}).catch((err) => {
// alert(err);
})
}, (error) => {
// alert(error);
})
}
})
}
/*location accuracy ends */
/*push notification starts*/
triggerNotification()
{
// Define settings for iOS
var iosSettings = {};
iosSettings["kOSSettingsKeyAutoPrompt"] = false;
iosSettings["kOSSettingsKeyInAppLaunchURL"] = false;
// Initialise plugin with OneSignal service
this.oneSignal.startInit('46d0af64-c191-4ec6-9f29-d8b6232dae8a', '912269327554').iOSSettings(iosSettings);
this.oneSignal.registerForPushNotifications();
// Control how OneSignal notifications will be shown when
// one is received while your app is in focus
this.oneSignal.inFocusDisplaying(this.oneSignal.OSInFocusDisplayOption.None);
// Retrieve the OneSignal user id and the device token
this.oneSignal.getIds().then((ids) => {
console.log('getIds: ' + JSON.stringify(ids));
this.device_id =ids;
console.log(this.device_id)
this.storage.set('get_deviceId',this.device_id);
// this.myservice.load_post({ device_id:ids },"store_id").subscribe(response => { })
});
// When a push notification is received handle
// how the application will respond
this.oneSignal.handleNotificationReceived().subscribe((msg) => {
// Log data received from the push notification service
console.log('Notification received');
console.dir(msg);
});
// When a push notification is opened by the user
// handle how the application will respond
this.oneSignal.handleNotificationOpened().subscribe((msg) => {
// Log data received from the push notification service
console.log('Notification opened');
console.log(JSON.stringify(msg));
if(msg.notification.payload.additionalData.pool_id.type == 'request'){
var pool_id = msg.notification.payload.additionalData.pool_id.pool_id;
console.log("pool_id", pool_id);
if(pool_id)
this.nav.setRoot('VehicleDetailPage',{'pool_id': pool_id,'from_push' : false});
}else{
var book_id = msg.notification.payload.additionalData.pool_id.id;
var stat = msg.notification.payload.additionalData.pool_id.stat;
if(book_id)
this.nav.setRoot('BookingDetail',{'id' :book_id,'stat' :stat ,'from_push' : false});
}
//console.log(this.event_id);
//this.detail(this.event_id);
});
// End plugin initialisation
this.oneSignal.endInit();
}
get_booking(){
//this.myservice.show_loader();
this.myservice.load_get('getBookingsopen/id/'+this.user_data.id).subscribe(data => {
//this.myservice.hide_loader();
if(data.status == 'success'){
this.open_count = data.data.open_book;
console.log("comp book",data);
}
});
}
get_noti_count(){
// this.myservice.show_loader();
this.myservice.load_get('getnoticount/id/'+this.user_data.id).subscribe(data => {
//this.myservice.hide_loader();
if(data.status == 'success'){
this.noti_count = data.data;
console.log("noti_count",data);
}
else{
this.noti_count = 0;
}
});
}
legal_notice(){
this.nav.setRoot('LegalnoticePage');
}
/*push notification ends*/
}
<ion-menu [content]="content" [swipeEnabled]="false" fullscreen>
<ion-content padding>
<div class="fm_sidemenu_profile_pic">
<div *ngIf="user_data" class="edit"></div>
<img *ngIf="user_data" [src]="user_data.profile_pic" >
</div>
<h5 *ngIf="user_data" >{{user_data.name}}</h5>
<p *ngIf="user_data" >{{user_data.mobile}} </p>
<h5 *ngIf="!user_data" >Guest User</h5>
<hr>
<ul>
<li *ngIf="!user_data" menuClose (click)="login()" >Login</li>
<li menuClose (click)="home()" >Home</li>
<li menuClose (click)="edit_pro()" >Edit Profile</li>
<li menuClose (click)="schedule()" >Schedule</li>
<li menuClose (click)="booking()" >History <ion-badge color="danger">{{open_count}}</ion-badge></li>
<li menuClose (click)="viewoffers()" >View Offers</li>
<li menuClose (click)="legal_notice()" >Legal Notice</li>
<li menuClose (click)="viewservices()" >View Services</li>
<li *ngIf="user_data" menuClose (click)="logout()" >Logout </li>
</ul>
</ion-content>
</ion-menu>
<ion-fab right bottom *ngIf="user_data" (click)="home()" menuClose>
<ion-badge color="danger">{{noti_count}}</ion-badge>
<button class="theme_primary" ion-fab color="primary">
<ion-icon name="notifications"></ion-icon></button>
</ion-fab>
<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>
\ No newline at end of file
import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';
import { MyApp } from './app.component';
import { Diagnostic } from '@ionic-native/diagnostic';
import { IonicStorageModule } from '@ionic/storage';
import { HttpModule } from '@angular/http';
import { Myservice } from '../providers/myservice';
import {ValidationService} from '../providers/validation_service';
import { OneSignal } from '@ionic-native/onesignal';
import { FileTransfer, FileUploadOptions, FileTransferObject } from '@ionic-native/file-transfer';
import { File } from '@ionic-native/file';
import { ImagePicker } from '@ionic-native/image-picker';
import { LocationAccuracy } from '@ionic-native/location-accuracy';
import { Geolocation } from '@ionic-native/geolocation';
import { PhotoViewer } from '@ionic-native/photo-viewer';
@NgModule({
declarations: [
MyApp
],
imports: [
BrowserModule,
HttpModule,
IonicModule.forRoot(MyApp),
IonicStorageModule.forRoot()
],
bootstrap: [IonicApp],
entryComponents: [
MyApp
],
providers: [
StatusBar,
SplashScreen,
Myservice,
ValidationService,
Diagnostic,
OneSignal,
FileTransfer,
File,
ImagePicker,
LocationAccuracy,
Geolocation,
PhotoViewer ,
{provide: ErrorHandler, useClass: IonicErrorHandler}
]
})
export class AppModule {}
//Global SCSS//
//Themening SCSS//
@import "../assets/css/theme.scss";
//Essentail SCSS//
.menu-inner{
.content{
background: #07426a !important;
.scroll-content {
align-content: center;
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
padding-left: 35px !important;
}
.fm_sidemenu_profile_pic{
width:100px;
height:100px;
background-color: #15b3d5;
border-radius: 50%;
background-image:url('../../assets/imgs/fm_user_avatar.png');
background-repeat: no-repeat;
background-position: center;
background-size: 35px;
position: relative;
img{
width:100%;
height:100%;
border-radius: 50%;
object-fit: cover;
object-position: center;
}
.edit{
position: absolute;
top:35px;
right:-10px;
width:28px;
height:28px;
background-image:url('../../assets/imgs/fm_home_edit.png');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
}
h5{
color: #fff;
font-weight: 400;
text-align: left;
font-size: 19px;
margin:0px;
padding:0px;
padding-top: 20px;
}
p{
color: #fff;
font-weight: 200;
text-align: left;
padding:0px;
margin:0px;
padding-top:5px;
font-size: 14px;
}
hr{
border:2px solid #15b3d5;
height: 0px;
border-radius: 20px;
width:40px;
margin-left:0px;
margin-top:30px;
margin-bottom:30px;
}
ul{
padding:0px;
margin:0px;
li{
padding:0px;
list-style: none;
color: #fff;
text-align: left;
font-weight: 300;
font-size: 17px;
padding-bottom: 10px;
padding-top: 10px;
}
}
}
}
.empty_div_style{
text-align:center;
padding:45px;
color: #8a6d3b !important;
font-size:16px;
font-weight:400;
background-color: #f4f3ee !important;
}
.alert-ios [aria-checked=true] .alert-radio-inner{
background:transparent !important;
}
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';
platformBrowserDynamic().bootstrapModule(AppModule);
/*
Site Name: HomeoCare International
URI: http:
Description: This is the custom css for HomeoCare International
Version: 1.0
Author: Amal-Techware Solution
Author URI:
Tags:
---------------------------
CUSTOM STYLES
---------------------------
TABLE OF CONTENTS
---------------------------
01. LOGIN-PAGE-STYLE
02. SIGNUP-PAGE-STYLE
03. HOME-PAGE-STYLE
04. APPOINTMENTS-PAGE-STYLE
05. MENU-PAGE-STYLE
06. DOCTOR-PROFILE-PAGE-STYLE
07. BOOK-DETAIL-PAGE-STYLE
08. SUCCESS-PAGE-STYLE
09. CONSULT-HISTORY-PAGE-STYLE
10. PAYMENT-HISTORY-PAGE-STYLE
11. CONSULTING-HISTORY-MAIN-PAGE-STYLE
12. WELCOME-PAGE-STYLE
13. DOC-PROFILE-PAGE-STYLE
14. CONSULTATION-HISTORY-PAGE-STYLE
15. CONSULTATION-DETAIL-PAGE-STYLE
16. NOTIFICATION-PAGE-STYLE
17. MESSAGE-PAGE-STYLE
18. CALL-PAGE-STYLE
19. VIDEO-CALL-PAGE-STYLE
20. FORGOT-PAGE-STYLE
21. PROFILE-PAGE-STYLE
22. BRANCH-PAGE-STYLE
*/
/*-------------------------------
/*-------------------------------
02. SIGNUP-PAGE-STYLE
--------------------------------*/
.hc_signup_input{width: 100%;background-color: #ffffff !important;border-radius:5px;border:none;height:50px;padding-left:15px;background-size: 20px !important;background-position: 15px !important;font-size: 16px;}
.hc_social_btn{width:100%;height:35px;font-weight: 400;color: #fff;border-radius:25px;font-size: 18px;text-transform: capitalize;cursor:pointer;}
/*-------------------------------
03. HOME-PAGE-STYLE
--------------------------------*/
.hc_login_select{width: 100%;-webkit-appearance: none;-moz-appearance: none;background-color: #ffffff !important;border-radius:5px;border:none;height:50px;padding-left:10px;background-size: 20px !important;background-position: right 15px top 15px !important;font-size: 16px;background:url("../assets/imgs/hc_drop_down.png");background-repeat: no-repeat;}
.hc_login_upload{width: 100%;-webkit-appearance: none;-moz-appearance: none;background-color: #ffffff !important;border-radius:5px;border:none;height:50px;padding-left:10px;background-size: 20px !important;background-position: right 15px top 15px !important;text-align: left !important;font-size: 16px;background:url("../assets/imgs/hc_text.png");background-repeat: no-repeat;padding: 15px;}
.hc_login_calender{width: 100%;-webkit-appearance: none;-moz-appearance: none;background-color: #ffffff !important;border-radius:5px;border:none;height:50px;padding-left:10px;background-size: 20px !important;background-position: right 15px top 15px !important;text-align: left !important;font-size: 16px;background:url("../assets/imgs/hc_calender.png");background-repeat: no-repeat;}
.hc_login_time{width: 100%;-webkit-appearance: none;-moz-appearance: none;background-color: #ffffff !important;border-radius:5px;border:none;height:50px;padding-left:10px;background-size: 20px !important;background-position: right 15px top 15px !important;text-align: left !important;font-size: 16px;background:url("../assets/imgs/hc_time.png");background-repeat: no-repeat;}
/*-------------------------------
04. APPOINTMENTS-PAGE-STYLE
--------------------------------*/
.hc_list_wrapper{width:100%;}
.hc_list_pic{width:90px;height:90px;float: left;background: #a8a8a8;border-radius: 4px;box-shadow: 0px 0px 5px 0px #888888;}
.hc_list_pic img{width: 100%;height:100%;object-fit: cover;object-position:center;border-radius: 4px;}
.hc_list_detail{width:calc(100% - 90px);float: left;padding-left: 15px;padding-right: 15px;text-align: left;}
.hc_list_wrapper ul{width:100%;padding:0px;margin:0px;}
.hc_list_wrapper ul li{background: #fff;list-style: none;padding: 10px;margin-bottom: 15px;padding-top: 20px;padding-bottom: 20px;}
.hc_list_detail h4{margin:0px;color: #36474e;padding-bottom:10px;font-size: 18px;}
.hc_list_detail h6{margin:0px;padding-bottom:10px;font-size:16px;}
.hc_list_detail p{margin:0px;color: #90a4ab;font-size: 18px;display: inline-block;}
.hc_list_detail p span{margin-right:5px;}
.hc_list_detail p span img{width: 25px;position: relative;top: 4px;}
.hc_view_report{color: #3a3a3a;border-radius: 5px;background:#fff;border:none;padding: 12px;padding-left: 20px;padding-right: 20px;font-size: 18px;box-shadow: 0px -3px 12px -5px #000 inset;}
.hc_footer_btn_bay{width:100%;}
/*-------------------------------
05. MENU-PAGE-STYLE
--------------------------------*/
.hc_main_menu{background:#ffffff;width:250px;float:right;position: relative;top:0px;}
.hc_main_menu h5{margin:0px;padding:10px;background: #064bb1;color:#fff;text-align: center;font-weight: 400;}
.hc_main_menu ul{margin:0px;padding:0px;}
.hc_main_menu ul li{width:100%;list-style:none;color: #36474e;font-weight: 400;padding:15px;font-size: 16px;border-bottom: 1px solid #ebebeb;}
.hc_main_menu_top{width:100%;padding: 10px;}
.hc_menu_circle{width:45px;height:45px;border-radius: 50%;background-color: #ffffff !important;background:url("../assets/imgs/menu_avatar.png");background-repeat: no-repeat;background-size: 20px;background-position: center;}
.hc_menu_detail{color: #fff;padding: 12px;font-size: 16px;}
.hc_version_count{text-align: right;height:50px;position: relative;}
.hc_version_count p{color: #36474e;font-size: 12px;margin:0px;position: absolute;right:0px;bottom: 0px;}
/*-------------------------------
06. DOCTOR-PROFILE-PAGE-STYLE
--------------------------------*/
.hc_stars {width:100%;display: inline-block;margin:0 auto;}
.hc_stars form{float: left;}
.hc_stars p{float: left;bottom:0px;padding: 8px;color: #90a4ab !important;}
.hc_stars input.star { display: none; }
.hc_stars label.star {float: right;padding:1px;font-size:24px;color: #a8a8a8;transition: all .2s;}
.hc_stars input.star:checked ~ label.star:before {content: '★';color: #FD4;transition: all .25s;}
.hc_stars input.star-5:checked ~ label.star:before {color: #FE7;}
.hc_stars input.star-1:checked ~ label.star:before { color: #F62; }
.hc_stars label.star:hover { }
.hc_stars label.star:before {content: '★';}
.hc_rate{position:relative;bottom:6px;}
.hc_description{width:100%;}
.hc_description h5{color: #38474f;font-size: 20px;margin-bottom: 0px;padding-left: 10px;}
.hc_description p{color: #607c8a;text-align: justify;font-size:16px;margin-top:10px;}
.hc_timeschedule{background: #fff;border-radius: 5px;padding: 10px;margin-bottom: 20px;}
.hc_timeschedule h6{text-align: center;margin:0px;font-size: 18px;padding-bottom: 10px;color: #3a3a3a;}
.hc_timeschedule ul{margin:0px;padding:0px;}
.hc_timeschedule ul li{}
#hc_check_button {margin:4px;background-color:#f7f7f7;box-shadow: 1px 0px 1px 0px #888888;overflow:auto;color:#3a3a3a;border:1px solid #e7e7e7;position: relative;width: calc(100% - 71%);outline: none;display: inline-block;height:35px;outline:none;border-radius: 6px;}
#hc_check_button p{margin:0px;position: absolute;left: 0px;right: 0px;top: 0px;bottom: 0px;padding:7px;text-align: center;}
#hc_check_button label {width:100%;}
#hc_check_button label span {text-align:center;display:block;}
#hc_check_button label input {position:absolute;top:-20px;}
#hc_check_button input:checked + p {background-color:#064bb1;color:#fff;margin:0px;border-radius: 6px;}
/*-------------------------------
07. BOOK-DETAIL-PAGE-STYLE
--------------------------------*/
.hc_bookdetails{width:100%;margin-top:10px;}
.hc_bookdetails ul{width:100%;padding:0px;margin:0px;padding-bottom: 30px;}
.hc_bookdetails ul li{width:100%;padding:0px;margin:0px;list-style: none;text-align: center;background: transparent;border-top: 1px solid #ebebeb;padding-top: 15px;padding-bottom: 15px;}
.hc_bookdetails ul li p{color: #3a3a3a;font-size: 18px;margin: 0px;padding-bottom:5px;}
.hc_bookdetails ul li h5{font-size: 22px;margin: 0px;font-weight: 500;}
/*-------------------------------
08. SUCCESS-PAGE-STYLE
--------------------------------*/
.hc_success{background: #fff;text-align: center;padding: 20px;position: relative;top:20%;}
.hc_success img{width:140px;}
.hc_success h5{color: #607c8a;margin:0px;padding: 0px;padding-top: 10px;}
.hc_success p{color: #607c8a;margin:0px;padding:0px;}
/*-------------------------------
09. CONSULT-HISTORY-PAGE-STYLE
--------------------------------*/
.hc_consult_history_wrapper{width: 100%;background: #fff;margin-bottom:15px;}
.hc_consult_history_wrapper h6{color: #36474e;margin:0px;padding:10px;font-size: 17px;}
.hc_consult_history_wrapper_inner{width:100%;background: #fff;}
.hc_consult_history_wrapper_inner .hc_bookdetails ul{padding-bottom: 10px;}
.hc_consult_history_wrapper_inner .hc_bookdetails ul li{border:none !important;padding-top: 5px;padding-bottom: 5px;}
.hc_consult_history_wrapper_inner .hc_bookdetails ul li p{padding: 5px !important;}
.hc_consult_history_wrapper_inner p{color:#607c8a;font-size: 16px;padding: 10px;margin: 0px;padding-bottom: 30px;}
.hc_med_time{background: #f7f7f7;border-radius: 3px;text-align: center;width:100%;padding:5px;color: #36474e;font-size: 18px;box-shadow: 1px 0px 1px 0px #888888;}
.hc_med_quantity{text-align: center;color:#064bb1;width:100%;font-size: 16px;font-weight: 600;}
/*-------------------------------
10. PAYMENT-HISTORY-PAGE-STYLE
--------------------------------*/
.hc_payment_history{width:100%;}
.hc_payment_history ul{width:100%;margin:0px;padding: 0px;}
.hc_payment_history ul li{list-style: none;padding:0px;margin:0px;text-align: center;color: #36474e;border-bottom:1px solid #ebebeb;padding: 20px;}
.hc_list_detail h3{width:100%;color:#36474e;background:url("../assets/imgs/hc_arrow.png");background-repeat: no-repeat;background-position: right 20px top 34px;margin: 0px;padding: 32px;background-size: 20px;}
/*-------------------------------
11. CONSULTING-HISTORY-MAIN-PAGE-STYLE
--------------------------------*/
.hc_history_main_tab{width:100%;}
.hc_history_main_tab ul{padding:0px;margin:0px;}
.hc_history_main_tab ul li{width:33.3%;float: left;background: #064bb1;color: #fff;list-style: none;text-align: center;padding: 15px;font-size: 18px;font-weight: 300;}
.hc_history_main_tab ul li ion-icon{margin-left:5px;}
.hc_slide_wrapper{width:100%;}
.hc_slide_wrapper ul{padding:0px;margin:0px;}
.hc_slide_wrapper ul li{list-style: none;width:100%;margin:0px;}
.hc_utitlity_btn{height:35px;border-radius: 20px;color: #fff;padding-left:30px;padding-right:30px;background: #064bb1;font-size: 16px;}
.hc_slide_wrapper .hc_consult_history_wrapper_inner{padding: 10px;}
/*-------------------------------
12. WELCOME-PAGE-STYLE
--------------------------------*/
.hc_welcome_div{width:100%;}
.hc_welcome_banner{background:#fff;padding: 10px;}
.hc_welcome_detail{width:calc(100% - 90px);float: left;padding: 18px;}
.hc_welcome_detail h4{margin:0px;font-size:22px;font-weight: 700;padding-bottom: 10px;}
.hc_welcome_body{width:70%;margin:0 auto;padding-top:40px;}
/*-------------------------------
13. DOC-PROFILE-PAGE-STYLE
--------------------------------*/
.hc_doc_profile_wrapper{width: 100%;padding-top: 20px;}
.hc_doc_profile_pic{width:100px;height:100px;margin:0 auto;background: #a8a8a8;border-radius: 4px;box-shadow: 0px 0px 5px 0px #888888;}
.hc_doc_profile_pic img{width:100%;height:100%;object-fit: cover;object-position: center;}
/*-------------------------------
14. CONSULTATION-HISTORY-PAGE-STYLE
--------------------------------*/
.hc_search{width: 100%;background-color: #ffffff !important;border-radius: 5px;border: none;height: 50px;padding-left: 20px;background-size: 20px !important;background-position: right 15px top 15px !important;text-align: left !important;font-size: 16px;background: url(../assets/imgs/hc_search.png);background-repeat: no-repeat;}
.hc_list_wrapper h3{margin:0px;background: #fff;text-align: center;color: #064bb1;font-size: 18px;font-weight: 400;padding: 10px;}
/*-------------------------------
15. CONSULTATION-DETAIL-PAGE-STYLE
--------------------------------*/
.hc_time{width: 100%;background-color: #ffffff !important;border-radius: 5px;border: none;height: 50px;padding-left: 20px;background-size: 20px !important;background-position: right 15px top 15px !important;text-align: left !important;font-size: 16px;background: url(../assets/imgs/hc_time.png);background-repeat: no-repeat;}
.h_consultation_inner{width:100%;background: #fff;padding: 10px;margin-bottom: 20px;}
.h_consultation_inner h5{color: #3a3a3a;text-align: center;padding:5px;font-weight: 400;}
.h_consult_textarea{width:100%;border:none;}
.hc_consult_medicine {width: 100%;-webkit-appearance: none;-moz-appearance: none;background-color: #ffffff !important;border-radius: 5px;border: none;height: 50px;padding-left: 10px;background-size: 20px !important;background-position: right 15px top 15px !important;text-align: left !important;font-size: 16px;background: url(../assets/imgs/hc_medicine.png);background-repeat: no-repeat;box-shadow: 0px -11px 25px -13px #000 inset;}
.hc_consult_medicine p{margin:0px;padding: 13px;font-size: 18px;color:#3a3a3a;}
.hc_consult_calender {width: 100%;-webkit-appearance: none;-moz-appearance: none;background-color: #ffffff !important;border-radius: 5px;border: none;height: 50px;padding-left: 10px;background-size: 20px !important;background-position: right 15px top 15px !important;text-align: left !important;font-size: 16px;background: url(../assets/imgs/hc_calender.png);background-repeat: no-repeat;box-shadow: 0px -11px 25px -13px #000 inset;}
.hc_consult_calender p{margin:0px;padding: 13px;font-size: 18px;color:#3a3a3a;}
.hc_consult_schedule {width: 100%;-webkit-appearance: none;-moz-appearance: none;background-color: #ffffff !important;border-radius: 5px;border: none;height: 50px;padding-left: 10px;background-size: 20px !important;background-position: right 15px top 15px !important;text-align: left !important;font-size: 16px;background: url(../assets/imgs/hc_schedule.png);background-repeat: no-repeat;box-shadow: 0px -11px 25px -13px #000 inset;}
.hc_consult_schedule p{margin:0px;padding: 13px;font-size: 18px;color:#3a3a3a;}
.hc_consult_payment {width: 100%;-webkit-appearance: none;-moz-appearance: none;background-color: #ffffff !important;border-radius: 5px;border: none;height: 50px;padding-left: 10px;background-size: 20px !important;background-position: right 15px top 15px !important;text-align: left !important;font-size: 16px;background: url(../assets/imgs/hc_payment.png);background-repeat: no-repeat;box-shadow: 0px -11px 25px -13px #000 inset;}
.hc_consult_payment p{margin:0px;padding: 13px;font-size: 18px;color:#3a3a3a;}
.hc_consult_share {width: 100%;-webkit-appearance: none;-moz-appearance: none;background-color: #ffffff !important;border-radius: 5px;border: none;height: 50px;padding-left: 10px;background-size: 20px !important;background-position: right 15px top 15px !important;text-align: left !important;font-size: 16px;background: url(../assets/imgs/hc_share.png);background-repeat: no-repeat;box-shadow: 0px -11px 25px -13px #000 inset;}
.hc_consult_share p{margin:0px;padding: 13px;font-size: 18px;color:#3a3a3a;}
/*-------------------------------
16. NOTIFICATION-PAGE-STYLE
--------------------------------*/
.hc_notification_wrap{width: 100%;}
.hc_notification_wrap ul{padding:0px;margin:0px;}
.hc_notification_wrap ul li{list-style: none;text-align: center;border-bottom: 1px solid #ebebeb;padding:20px;}
.hc_notification_wrap ul li h5{color:#36474e;margin:0px;padding:0px;}
.hc_notification_wrap ul li p{padding:0px;margin:0px;font-size: 16px;padding-top: 8px;}
.hc_done{text-align: center;color: #6ce679;font-size: 15px;}
.hc_done span img{width:18px;position: relative;top: 3px;margin-right:5px;}
/*-------------------------------
17. MESSAGE-PAGE-STYLE
--------------------------------*/
.hc_message_list{width:100%;height:100%;overflow: scroll;}
.hc_message_list ul{padding:0px;margin:0px;}
.hc_message_list ul li{list-style: none;width:100%;margin-bottom:20px;}
.hc_message{width:100%;}
.hc_message_pic{width:50px;height:50px;background: #a8a8a8;border-radius:5px;}
.hc_message_pic img{width:100%;height:100%;object-fit: cover;object-position: center;border-radius:5px;}
.hc_message_text{width:calc(100% - 60px);border-radius:5px;background:#dffeff;color: #607c8a;padding: 10px;font-size: 14px;}
.hc_send .hc_message_pic{float:right;}
.hc_send .hc_message_text{float:right;margin-right:10px;text-align: right;}
.hc_receive .hc_message_pic{float:left;}
.hc_receive .hc_message_text{float: left;margin-left:10px;text-align:left;}
.hc_message_text .name{color: #064bb1;margin:0px;padding-bottom: 15px;}
.hc_message_text .time{color: #9ea1a2;margin:0px;padding-bottom: 15px;font-weight: 300;font-size: 12px;}
.hc_send .name{float:right;}
.hc_send .time{float: left;}
.hc_receive .name{float:left;}
.hc_receive .time{float:right;}
.hc_message_bottom{width:100%;height:50px;background:#ffffff;}
.hc_message_input{width:calc(100% - 60px);height:100%;float: left;background: transparent;border:none;padding-left: 20px;font-size: 16px;}
.hc_send_btn{float: right;height:100%;width:60px;background:url("../assets/imgs/hc_send.png");background-repeat: no-repeat;background-color: transparent;background-position: center;background-size: 30px;}
/*-------------------------------
18. CALL-PAGE-STYLE
--------------------------------*/
.hc_call_wrapper{width:100px;margin:0 auto;height:100%;padding-top: 30px;}
.hc_footer_end{width:100%;text-align: center;padding:30px;}
.hc_call_end{width:70px;height:70px;background:url("../assets/imgs/hc_call_end.png");background-position: center;background-repeat: no-repeat;margin:0 auto;background-size: contain;}
.hc_caller{width:100px;height:100px;border-radius: 5px;background: #a8a8a8;}
.hc_caller img{width:100%;height:100%;border-radius: 5px;object-fit: cover;object-position: center;}
.hc_connect{width:100px;height:100px;text-align: center;background:url("../assets/imgs/hc_connect.png");background-position: center;background-repeat: no-repeat;background-size: 10px;}
/*-------------------------------
19. VIDEO-CALL-PAGE-STYLE
--------------------------------*/
.hc_video_call_wrapper{width:100%;height:100%;background:url("../assets/imgs/e_pic4.jpg");background-repeat: no-repeat;background-size: cover;position: relative;}
.hc_v_call_end{width:100%;height:60px;background:url("../assets/imgs/hc_v_call_end.png");background-position: center;margin:0 auto;background-size: contain;background-repeat: no-repeat;}
.hc_video_top_bar{width:100%;height:70px;position: absolute;top:0px;}
.hc_recam{width:70px;height: 100%;background:url("../assets/imgs/hc_recam.png");background-position: center;background-repeat: no-repeat;background-size: 35px;}
.hc_msg{width:70px;height: 100%;background:url("../assets/imgs/hc_msg.png");background-position: center;background-repeat: no-repeat;background-size: 35px;}
.hc_video_time{height: 100%;width:calc(100% - 140px);float: left;text-align: center;color: #ffffff;font-weight:400;font-size: 18px;letter-spacing: 2px;padding: 25px;}
.hc_mute{width:70px;height:70px;background:url("../assets/imgs/hc_audio.png");background-position: center;background-repeat: no-repeat;background-size:60px;}
.hc_video{width:70px;height:70px;background:url("../assets/imgs/hc_video.png");background-position: center;background-repeat: no-repeat;background-size:60px;}
.hc_video_self{width:90px;height:100px;background: #a8a8a8;position: absolute;right:10px;bottom:120px;background:url("../assets/imgs/e_pic2.jpg");background-repeat: no-repeat;background-size: cover;}
/*-------------------------------
20. FORGOT-PAGE-STYLE
--------------------------------*/
.hc_forget_pass{position: relative;top:10%;}
.hc_forget_pass p{color: #607c8a;text-decoration: none !important;font-size: 15px;padding-top: 15px;padding-bottom: 15px;}
.hc_forget_pass strong{color: #064bb1 !important;}
.hc_forget_pass .hc_signup_input{background: #f0f0f0 !important;}
.hc_med_input{border:none;height:35px;width:100%;padding-left: 10px;border-bottom: 1px solid #ebebeb;}
/*-------------------------------
21. PROFILE-PAGE-STYLE
--------------------------------*/
.hc_profile_edit_input{width: 100%;-webkit-appearance: none;-moz-appearance: none;background-color: #ffffff !important;border-radius: 5px;border: none;height: 50px;padding-left: 10px;padding-right: 10px;background-size: 20px !important;background-position: right 15px top 15px !important;text-align: left !important;font-size: 16px;background: url(../assets/imgs/hc_edit.png);background-repeat: no-repeat}
.rating{position: relative;bottom: 10px;}
.hc_big_rating{width:190px;margin:0 auto;}
.hc_big_rating label.star{font-size: 40px;}
/*-------------------------------
22. BRANCH-PAGE-STYLE
--------------------------------*/
.hc_area_list{width:100%;}
.hc_area_list ul{width:100%;padding:0px;margin:0px;}
.hc_area_list ul li{width:100%;padding:15px;margin:0px;list-style: none;background:#ffff;border-bottom: 1px solid #c7c7c7;}
.hc_area_detail{width:100%;background: #fff;}
.hc_area_detail h5{margin:0px;padding:10px;color: #38474c;border-bottom: 1px solid #ebebeb;padding-left: 20px;}
.hc_area_detail ul{padding:0px;margin:0px;}
.hc_area_detail ul li{list-style: none;}
.hc_area_detail p{margin:0px;padding: 10px;color: #607c8a;padding-left: 20px;line-height: 20px;}
\ No newline at end of file
/*
Site Name: HomeoCare International
URI: http:
Description: This is the theme css for HomeoCare International
Version: 1.0
Author: Amal-Techware Solution
Author URI:
Tags:
---------------------------
THEME STYLES
---------------------------
TABLE OF CONTENTS
---------------------------
01. FONTS-N-SIZES
02. FONTS-COLOR
03. THEMES-N-BACKGROUNDS
04. SPACING-N-POSITIONS
05. ALIGMENTS
06. ALERTS-N-MESSAGES
07. BODY-STRUCTURE
08. OVERWRITTEN
*/
/*-------------------------------
01. FONTS-N-SIZES
--------------------------------*/
@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;}
*::-webkit-scrollbar {
display: none;
}
a{text-decoration: none !important;}
.font_size_xs{font-size:12px !important;}
.font_size_sm{font-size:14px !important;}
.font_size_md{font-size:16px !important;}
.font_size_lg{font-size:18px !important;}
.font_size_xl{font-size:20px !important;}
.font_size_vl{font-size:35px !important;}
/*-------------------------------
02. FONTS-COLOR
--------------------------------*/
.text_color_primary{color: #064bb1 !important;}
.text_color_white{color:#fff !important;}
.text_dark{color:#3a3a3a !important;}
/*-------------------------------
03. THEMES-N-BACKGROUNDS
--------------------------------*/
.theme_primary{background-color: #1d527f !important;border: 1px solid #1d527f;}
/*-------------------------------
04. SPACING-N-POSITIONS
--------------------------------*/
.width25{width:25% !important;}
.width50{width:50% !important;}
.width75{width:75% !important;}
.widthFull{width:100% !important;}
.height25{height:25% !important;}
.height50{height:50% !important;}
.height75{width:75% !important;}
.heightFull{height: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;}
.p20{padding:20px !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;}
.clear{clear:both !important;}
.top10{top:10px;}
.bottom10{bottom:10px;}
.left10{left:10px;}
.right10{right:10px;}
.bottom10{bottom:10px;}
.absolute{position: absolute !important;}
.relative{position: relative !important;}
.fixed{position: fixed !important;}
/*-------------------------------
05. ALIGMENTS
--------------------------------*/
.floatLeft{float:left !important;}
.floatRight{float:right !important;}
.textLeft{text-align: left !important;}
.textRight{text-align: right !important;}
.textCenter{text-align: center !important;}
/*-------------------------------
06. ALERTS-N-MESSAGES
--------------------------------*/
.error p{ color: #a94442 !important;}
/*-------------------------------
07. BODY-STRUCTURE
--------------------------------*/
.nav_header{width:100%;}
.nav_btn{width:45px !important;height:45px !important;background: transparent;margin: 0px;font-size: 25px;color: #fff;padding: 0px !important;}
.nav_header_title{height:100%;font-weight: 400;text-align:center;font-size:20px;color: #fff;padding:10px;text-transform:capitalize;width:calc(100% - 90px);letter-spacing:1px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;padding-left: 8px;padding-right: 8px;}
.nav_header_title img{height:28px !important;}
.clear{clear:both !important;}
.border{border:1px solid;}
.borderNone{border:none !important;}
/*-------------------------------
08. 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:#1d527f !important;color: #fff !important;}
.picker-toolbar{background:#1d527f !important;color: #fff !important;border:none !important;}
.picker-button{color: #fff !important;}
.picker-opt{color: #fff !important;}
.picker-below-highlight{background:#1d527f !important;border:none !important;}
.picker-above-highlight{background:#1d527f !important;border:none !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;}
.item-md.item-block .item-inner{padding:0px !important;}
.tab-button[aria-selected=true] .tab-button-icon{color: #1d527f !important;}
.tab-button[aria-selected=true] .tab-button-text{color: #1d527f !important;}
.tabbar{background-color: #fff !important;box-shadow: 0px 50px 100px 50px #888888 !important;}
.tab-button-text{margin-top:0px !important;margin-bottom:4px !important;font-size: 12px;}
.tab-button-icon{font-size:30px !important;}
.datetime-placeholder{color: #3a3a3a !important;}
.datetime-md {padding: 13px 8px 13px 0px !important;}
.item{background: transparent !important;border:none;}
.item-inner{border:none !important;}
.alert-head{display:block !important;}
.alert-wrapper{background-size: cover;background-position: center;}
.alert-radio-label{color: #595959 !important;}
[aria-checked=true] .alert-radio-icon{border-color: #1d527f !important;}
[aria-checked=true] .alert-radio-inner{background: #1d527f !important; }
.fm_menu{background:url('../assets/imgs/fm_menu.png');background-size: cover;background-position: center;background-size: 25px;background-repeat: no-repeat
}
.fm_filter{background:url('../assets/imgs/fm_filter.png');background-size: cover;background-position: center;background-size:25px;background-repeat: no-repeat
}
.fm_dots{background:url('../assets/imgs/lock.png');background-size: cover;background-position: center;background-size:25px;background-repeat: no-repeat
}
.fm_back{background:url('../assets/imgs/fm_back.png');background-size: cover;background-position: center;background-size:25px;background-repeat: no-repeat
}
.theme_green{
background-color:#1DB100 !important;
}
.theme_dblue{
background-color:#205373 !important;
}
.theme_lblue{
background-color:#0076ba !important;
}
.theme_grey{
background-color:#929292 !important;
}
.theme_orange{
background-color:#f8b800 !important;
}
.theme_red{
background-color:#ee2203 !important;
}
.login_btn{
width:200px;
color: #fff;
font-weight: 300;
height:40px !important;
border-radius:5px;
font-size:18px;
margin-bottom: 10px;
}
.signup_btn{
width:150px;
color: #fff;
background:transparent;
font-weight: 300;
height:40px;
border-radius:5px;
font-size:18px;
text-transform: capitalize;
}
.login_wizard_head{
color: #0076ba !important;
font-weight: 500;
letter-spacing: 1px;
text-align: left;
font-size: 18px;
text-transform:capitalize;
padding-bottom:15px;
}
.text_green{
color: #1DB100;
}
.no_result_found{
text-align: center;
padding-top: 50px;
img{
width:120px;
margin:0 auto;
}
.no_result_icon{
width: 120px;
margin:0 auto;
}
p{
text-align: center;
color:#205373;
font-size: 25px;
font-weight: 400;
}
}
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<title>Ionic App</title>
<meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<link rel="icon" type="image/x-icon" href="assets/icon/favicon.ico">
<link rel="manifest" href="manifest.json">
<meta name="theme-color" content="#4e8ef7">
<!-- add to homescreen for ios -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<!-- cordova.js required for cordova apps (remove if not needed) -->
<script src="cordova.js"></script>
<!-- un-comment this code to enable service worker
<script>
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('service-worker.js')
.then(() => console.log('service worker installed'))
.catch(err => console.error('Error', err));
}
</script>-->
<link href="build/main.css" rel="stylesheet">
</head>
<body>
<!-- Ionic's root component and where the app will load -->
<ion-app></ion-app>
<!-- The polyfills js is generated during the build process -->
<script src="build/polyfills.js"></script>
<!-- The vendor js is generated during the build process
It contains all of the dependencies in node_modules -->
<script src="build/vendor.js"></script>
<!-- The main bundle js is generated during the build process -->
<script src="build/main.js"></script>
<script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyD7oEUnIkuzKdJUADmNPeKVXKenOMAYUT0&libraries=places" type="text/javascript"></script>
</body>
</html>
{
"name": "Ionic",
"short_name": "Ionic",
"start_url": "index.html",
"display": "standalone",
"icons": [{
"src": "assets/imgs/logo.png",
"sizes": "512x512",
"type": "image/png"
}],
"background_color": "#4e8ef7",
"theme_color": "#4e8ef7"
}
\ No newline at end of file
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" ion-button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Edit Profile
</div>
<button type="button" (click)="Changepsw()"class="nav_btn floatRight" ion-button>
<ion-icon name="lock"></ion-icon>
</button>
</ion-header>
<ion-content padding>
<div class="fm_common_wrapper">
<form [formGroup]="editProform" (ngSubmit)="edit_profile()">
<p class="m0">Add your logo as profile picture & edit your data if necessary</p>
<div class="fm_banner">
<div class="fm_banner_circle" (click)="uploadPicture()">
<img src="assets/imgs/fm_photo.png" *ngIf="!profile_pic">
<img [src]="profile_pic" *ngIf="profile_pic" >
</div>
</div>
<ion-list>
<ion-item>
<ion-input type="text" formControlName="name" placeholder="Garage Name"></ion-input>
<div class="bmd-field error">
<p class="valid-p" *ngIf="editProform.controls.name.hasError('required') && editProform.controls.name.touched">Garage name is required!</p>
<p class="valid-p" *ngIf="editProform.controls.name.hasError('pattern') && editProform.controls.name.touched">Only alphabets are allowed!</p>
<p class="valid-p" *ngIf="editProform.controls.name.hasError('maxlength') && editProform.controls.name.touched">Maximum Garage name length is 30!</p>
</div>
</ion-item>
<ion-item>
<ion-input formControlName="mobile" type="number" placeholder="Phone Number"></ion-input>
<div class="bmd-field error">
<p class="valid-p" *ngIf="editProform.controls.mobile.hasError('required') && editProform.controls.mobile.touched">Sorry, field Phone no is required!</p>
<p class="valid-p" *ngIf="editProform.controls.mobile.hasError('pattern') && editProform.controls.mobile.touched">Sorry, please enter a valid Phone number!</p>
<p class="valid-p" *ngIf="editProform.controls.mobile.hasError('minlength') && editProform.controls.mobile.touched">Sorry, minimum Phone number length is 10!</p>
<p class="valid-p" *ngIf="editProform.controls.mobile.hasError('maxlength') && editProform.controls.mobile.touched">Sorry, maximum Phone number length is 20!</p>
</div>
</ion-item>
<ion-item>
<input type="text" id="address_editpro" (click)="initialize()" formControlName="address" placeholder="Address">
<p class="valid-p" *ngIf="editProform.controls.address.hasError('required') && editProform.controls.address.touched">Address is required!</p>
</ion-item>
<ion-item>
<ion-input type="number" formControlName="postal_code" placeholder="Postal Code"></ion-input>
<div class="bmd-field error">
<p class="valid-p" *ngIf="editProform.controls.postal_code.hasError('required') && editProform.controls.postal_code.touched">Sorry, field postal code is required!</p>
<p class="valid-p" *ngIf="editProform.controls.postal_code.hasError('pattern') && editProform.controls.postal_code.touched">Sorry, please enter a valid postal code!</p>
<p class="valid-p" *ngIf="editProform.controls.postal_code.hasError('minlength') && editProform.controls.postal_code.touched">Sorry, minimum postal code length is 4!</p>
<p class="valid-p" *ngIf="editProform.controls.postal_code.hasError('maxlength') && editProform.controls.postal_code.touched">Sorry, maximum postal code length is 4!</p>
</div>
</ion-item>
<ion-item>
<input type="text" id="locality" formControlName="city" placeholder="City">
</ion-item>
</ion-list>
<!-- <h5>Give your car a nick name</h5>
<hr>
<ion-list>
<ion-item>
</ion-item>
</ion-list> -->
<!-- <h5>Few more details</h5>
<hr> -->
<!-- <ion-list>
<ion-item class="p0">
<ion-row>
<ion-col col-6 class="p0">
<h6>Current number of Kms</h6>
</ion-col>
<ion-col col-6 class="p0">
<input class="fm_input_add" type="number" placeholder="0000">
<div class="clear"></div>
</ion-col>
</ion-row>
</ion-item>
<ion-item class="p0">
<ion-row>
<ion-col col-6 class="p0">
<h6>Last service date</h6>
</ion-col>
<ion-col col-6 class="p0">
<input class="fm_input_add" type="number" placeholder="03-05-2018">
<div class="clear"></div>
</ion-col>
</ion-row>
</ion-item>
</ion-list> -->
<p class="m0">Add some description of you and your garage</p>
<textarea class="description_area" formControlName="description" rows="4" Placeholder="How long does your workshop exist? How long have you been in this business? Are you specialized in some brands? Do you offer some special services? Describe your team..." ></textarea>
<p class="">Add upto 5 pictures of your garage</p>
<div class="garage_gallery">
<ul>
<input type="file" class="image_chooser" (change)="fileChanges($event,'Registration proof')" placeholder="Upload file" >
<!-- <li (click)="uploadPictures('1')" ><span>+</span></li>
<li (click)="uploadPictures('2')" ><span>+</span></li>
<li (click)="uploadPictures('3')" ><span>+</span></li>
<li (click)="uploadPictures('4')" ><span>+</span></li>
<li (click)="uploadPictures('5')" ><span>+</span></li> -->
</ul>
</div>
<BR>
<p class="">Select Catagory</p>
<ion-list>
<ion-item class="p0" *ngFor="let cat of catagories" >
<ion-label>{{cat.service}} </ion-label>
<ion-checkbox [checked]="get_cat(cat.id)" (ionChange)="change_val(cat, $event.checked)" ></ion-checkbox>
</ion-item>
</ion-list>
<div class="textCenter">
<button class="login_btn widthFull theme_lblue" ion-button>Save Profile</button>
<button class="change_pass_btn widthFull" ion-button (click)="Changepsw()">Change Password</button>
</div>
<br>
</form>
</div>
</ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { AddcarPage } from './addcar';
@NgModule({
declarations: [
AddcarPage,
],
imports: [
IonicPageModule.forChild(AddcarPage),
],
})
export class AddcarPageModule {}
page-addcar {
.fm_common_wrapper{
p{
color: #0076ba;
margin-bottom: 0px;
font-weight: 600;
font-size: 16px;
}
.change_pass_btn{
border:1px solid #000;
color: #000;
}
.description_area{
border:1px solid #929292;
margin-top: 20px;
width:100%;
}
.garage_gallery{
width:100%;
ul{
margin:0px;
padding:0px;
text-align: left;
padding-top:20px;
li{
list-style: none;
width:50px;
height:50px;
border:1px solid #929292;
display: inline-block;
text-align: center;
margin-right: 10px;
span{
color: #929292;
font-size: 25px;
position: relative;
top: 8px;
}
img{
width:100%;
height:100%;
object-fit: cover;
object-position: center;
}
}
}
}
.fm_banner{
width: 100%;
padding-top:20px;
padding-bottom: 20px;
text-align: center;
position: relative;
.fm_banner_circle{
width:115px;
height:115px;
margin:0 auto;
position: relative;
border-radius: 50%;
background:#07426a;
z-index:1;
border:2px solid #07426a;
img{
width:100%;
height:100%;
border-radius: 50%;
object-fit:cover;
object-position:center;
}
}
}
h3{
text-align: center;
color: #07426a;
font-size: 18px;
padding-top: 50px;
}
h5{
color: #777777;
text-align: center;
font-weight: 400;
font-size: 15px;
margin-top:0px;
}
h6{
margin:0px;
padding:0px;
color: #777777;
font-size: 15px;
padding-top: 5px;
}
.fm_input_add{
width: 100px;
height: 30px;
border:2px solid #198ba6;
border-radius: 20px;
float: right;
padding-left: 10px;
}
.list {
padding:0px;
margin-bottom:0px;
border-bottom: none !important;
.item {
padding: 0px;
padding-bottom:15px;
border-bottom: none !important;
box-shadow: none !important;
.item-inner{
box-shadow: none !important;
.input-wrapper{
.label {
margin:0px;
}
.text-input{
margin:0px;
height: 35px;
border-bottom:1px solid #b7b7b7;
}
input{
margin:0px;
height: 35px;
border:none;
border-bottom:1px solid #b7b7b7;
width:100%;
}
.select{
min-width: 100%;
border-bottom:1px solid #b7b7b7;
padding: 0px;
height: 35px;
color: #7b7b7b;
font-weight: 300;
.select-text{
padding-top: 5px;
padding-bottom:5px;
}
.select-icon{
width:30px;
height:30px;
background:url('../../assets/imgs/fm_drop_down_circle.png');
background-repeat: no-repeat;
background-size: 25px;
.select-icon-inner{
display: none;
}
}
}
}
}
.checkbox-checked{
background: #225682 !important;
border:1px solid #225682 !important;
border-radius: 6px !important;
}
.checkbox-icon{
width:18px !important;
height:18px !important;
border-radius: 6px;
border:2px solid #225682 !important;
background: transparent;
}
.checkbox-checked .checkbox-inner{
left:5px !important;
top:2px !important;
border-color: #15b3d5 !important;
}
}
}
}
}
import { Component ,ElementRef, ViewChild} from '@angular/core';
import { IonicPage, NavController, NavParams ,Events,ModalController} from 'ionic-angular';
import {Validators, FormBuilder, FormGroup, FormControl, AbstractControl,FormArray } from '@angular/forms';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';
import { FileTransfer, FileUploadOptions, FileTransferObject } from '@ionic-native/file-transfer';
import { File } from '@ionic-native/file';
import { ImagePicker } from '@ionic-native/image-picker';
declare var require: any;
declare var google: any;
@IonicPage()
@Component({
selector: 'page-addcar',
templateUrl: 'addcar.html',
})
export class AddcarPage {
@ViewChild("fileInput") fileInput: ElementRef;
services:any;
location={'lat':'','lng':''};
citie: any;
coun: any;
private editProform : FormGroup;
address: any;
user_data: any;
componentForm: any;
base64Image: any;
garage_imgs: any = [];
garageimgs: any= [];
profile_pic: any;
catagories: any;
cat_vals: any =[];
final_arr: any =[];
constructor(public navCtrl: NavController, public navParams: NavParams, private eleRef:ElementRef,public storage:Storage, private myservice: Myservice, private formBuilder: FormBuilder,private transfer: FileTransfer, private file: File, private imagePicker: ImagePicker, public events: Events,public modalCtrl: ModalController) {
this.editProform = this.formBuilder.group({
name: ['',Validators.compose([Validators.maxLength(30), Validators.pattern('^[A-Za-z]+( [A-Za-z]+)*$'), Validators.required])],
city: ['',],
postal_code: ['',Validators.compose([Validators.required, Validators.minLength(4), Validators.maxLength(4)])],
address: ['', Validators.required],
mobile: ['', Validators.compose([Validators.required, Validators.minLength(10), Validators.maxLength(20)])],
description: ['', Validators.required],
catagory: this.formBuilder.array([])
});
this.getServices()
this.storage.get('user_data').then((user_data) => {
console.log(user_data);
if(user_data){
this.user_data=user_data;
this.get_profile();
}else{
let modal = this.modalCtrl.create('Loginbook');
modal.onDidDismiss(data => {
console.log(data);
if(data.user_data.id) {
this.user_data = data.user_data;
this.get_profile()
}
});
modal.present();
}
})
this.componentForm = {
locality: 'long_name'
};
}
ionViewDidLoad() {
console.log('ionViewDidLoad AddcarPage');
}
back()
{
this.navCtrl.pop();
}
servicehistory()
{
this.navCtrl.push('ServicehistoryPage');
} Changepsw()
{
this.navCtrl.push('Changepsw');
}
edit_profile(){
if(this.editProform.valid)
{
this.myservice.show_loader();
this.editProform.controls['city'].setValue(this.citie);
this.editProform.controls['address'].setValue(this.address);
var user_id ={'id':this.user_data.id}
console.log('on save',this.final_arr)
const emailsFormArray = <FormArray>this.editProform.controls.catagory;
var i
for (i = 0; i < this.final_arr.length; i++) {
console.log('i',this.final_arr[i])
emailsFormArray.push(new FormControl(this.final_arr[i]));
}
var payload = {'img' :
this.garage_imgs
}
var vl = JSON.stringify(payload)
var obj = Object.assign(this.editProform.value, this.location,user_id,payload);
this.fileChange()
/* if(this.base64Image) {
this.load_post_file(this.base64Image, obj, "editProfile");
}else{
this.myservice.load_post(obj, "editProfile").subscribe(response => {
this.myservice.hide_loader();
console.log(response);
if(response.status == "success") {
this.myservice.show_alert("success!", response.message);
this.get_profile();
}
else {
this.myservice.show_alert("Error!", response.message);
}
})
} */
}
else{ // Form is not valid
this.markFormGroupTouched(this.editProform); // function to mark fields as touched
}
}
fileChange() {
//let fileList: FileList = event.target.files;
console.log('garage_imgs', this.garage_imgs)
let fileList: FileList = this.garage_imgs
if(fileList.length > 0) {
console.log('fileList', fileList)
let file = fileList[0];
var ext = (file.name).split(".").pop();
if(ext == 'jpg' ||ext == 'jpeg' || ext == 'png' ){
var formData = new FormData();
//arr =[{'data' : {'name':'olu', 'token' :'olus'}}];
var user_id ={'id':this.user_data.id}
var obj = Object.assign(this.editProform.value, this.location,user_id);
//formData.append('name', names);
formData.append('obj',obj);
formData.append('uploadFile', file,file.name);
//this.medical_report = file.name;
this.myservice.show_loader();
this.myservice.fileUpload(formData, "editProfile").subscribe(response => {
this.myservice.hide_loader();
if(response.status=='success'){
this.myservice.show_alert('Success', response.message);
}
else{
this.myservice.show_alert('Error', response.message);
}
})
}
else{
this.myservice.show_alert('Error','Only JPEG, png or PDF is accepted');
}
}
}
fileChanges(event,names) {
//let fileList: FileList = event.target.files;
console.log('garage_imgs', event.target.files)
let fileList: FileList = event.target.files;
if(fileList.length > 0) {
console.log('fileList', fileList)
let file = fileList[0];
console.log('file', file)
var ext = (file.name).split(".").pop();
if(ext == 'jpg' ||ext == 'jpeg' || ext == 'png' ){
var formData = new FormData();
//arr =[{'data' : {'name':'olu', 'token' :'olus'}}];
var user_id ={'id':this.user_data.id}
var obj = Object.assign(this.editProform.value, this.location,user_id);
//formData.append('name', names);
formData.append('obj',obj);
formData.append('uploadFile', file,file.name);
//this.medical_report = file.name;
this.myservice.show_loader();
this.myservice.fileUpload(formData, "editProfile").subscribe(response => {
this.myservice.hide_loader();
if(response.status=='success'){
this.myservice.show_alert('Success', response.message);
}
else{
this.myservice.show_alert('Error', response.message);
}
})
}
else{
this.myservice.show_alert('Error','Only JPEG, png or PDF is accepted');
}
}
}
openFolder(){
let smallBox = this.eleRef.nativeElement.querySelector('.image_chooser'); smallBox.click();
}
load_post_file(imageURI, post_data, fn_name) {
console.log(imageURI);
let ft = this.transfer.create();
let filename = imageURI.substr(imageURI.lastIndexOf('/')+1);
let options = {
fileKey: 'file',
fileName: filename,
mimeType: 'image/jpeg',
chunkedMode: false,
headers: {
'Content-Type' : undefined
},
params: post_data
};
//ft.onProgress(this.onProgress);
this.myservice.show_loader();
ft.upload(imageURI, this.myservice.webservice_url+fn_name, options, false)
.then((result: any) => {
//this.success(result);
this.myservice.hide_loader();
console.log(result);
var res =JSON.parse(result.response);
if(res.status == "failed") {
this.myservice.show_alert("Error!", result.status);
}
else {
this.myservice.show_alert("Success!", res.status);
console.log("result", JSON.parse(result.response) );
console.log("pro pic", res.result.profile_pic);
this.user_data.profile_pic = res.result.profile_pic;
this.user_data.name = res.result.name;
this.user_data.mobile = res.result.mobile;
console.log(this.user_data);
this.events.publish('user:update_profile', this.user_data);
this.get_profile();
}
}).catch((error: any) => {
//this.failed(error);
console.log(error);
//this.result = error;
this.myservice.hide_loader();
this.myservice.show_alert("Error!", 'Error occured. Please try again');
});
//console.log(this.result);
//return this.result;
}
initialize() {
console.log("initialize")
var addressType='address_editpro';
var input = document.getElementById('address_editpro');
/* var options = {
types: ['(cities)']
}; */
var autocomplete = new google.maps.places.Autocomplete(input);
let thiss = this;
google.maps.event.addListener(autocomplete, 'place_changed', function () {
var place = autocomplete.getPlace();
console.log(place.address_components);
for (var i = 0; i < place.address_components.length; i++) {
addressType = place.address_components[i].types[0];
console.log(addressType);
if (thiss.componentForm[addressType]) {
console.log(thiss.componentForm[addressType]);
var val = place.address_components[i][thiss.componentForm[addressType]];
// document.getElementById(addressType).value = val;
console.log(val);
(document.getElementById(addressType) as HTMLInputElement).value= val;
if(addressType=='locality'){ thiss.citie = place.address_components[i][thiss.componentForm['locality']]; }
}
}
thiss.address = place.formatted_address;
// thiss.signup.controls['address_editpro'].setValue(place.formatted_address);
var latLong = autocomplete.getPlace().geometry.location;
var js=JSON.stringify(latLong);
var par=JSON.parse(js);
thiss.location = {lat : par.lat, lng : par.lng};
/*
thiss.address = place.formatted_address;
console.log(placeA.formatted_address);
var latLong = autocomplete.getPlace().geometry.location;
var js=JSON.stringify(latLong);
var par=JSON.parse(js);
thiss.location = {lat : par.lat, lng : par.lng};
*/
//document.getElementById('driver_lat').value=par.lat;
//document.getElementById('driver_lng').value=par.lng;
// document.getElementById('pickup_lat').value=par.lat;
// document.getElementById('pickup_lng').value=par.lng;
});
}
emailValidator(control: FormControl): {[s: string]: boolean} {
if (!(control.value.toLowerCase().match('^[a-z0-9.]+( \ [_a-z0-9]+)*@[a-z0-9-]+(\.[a-z0-9-]+)\\.(\.[a-z0-9-]{1,15})$'))) {
return {invalidEmail: true};
}
}
getServices(){
this.myservice.show_loader();
this.myservice.load_get("getServices").subscribe(response => {
this.myservice.hide_loader();
console.log(response);
if(response.status == "success") {
this.catagories = response.data;
//this.myservice.show_alert("success!", response.message);
}
else {
}
})
}
get_cat(id){
let index = this.cat_vals.findIndex(x => x == id)
if(index!=-1)
return true;
}
get_profile(){
this.myservice.show_loader();
this.myservice.load_get("get_profiles/id/"+this.user_data.id).subscribe(response => {
this.myservice.hide_loader();
if(response.status="success") {
this.cat_vals = response.result.category.split(",");
this.final_arr = this.cat_vals
console.log('pro',this.editProform.controls.catagory)
this.editProform.patchValue(response.result);
this.location.lat = response.result.lat;
this.location.lng =response.result.lon;
this.profile_pic = response.result.profile_pic
/* if(response.length > 0){
this.filter_hosp.controls['reasons'].setValue(response.reasons[0].id);
} */
}
else {
}
})
}
uploadPicture(){
var options ={ maximumImagesCount:1,
width:400,
height: 400,
quality: 100
}
this.imagePicker.getPictures(options).then((results) => {
for (var i = 0; i < results.length; i++) {
console.log('Image URI: ' + results[i]);
if(results[i]){
this.base64Image = results[i];
this.profile_pic = results[i];
}
}
}, (err) => { });
}
uploadPictures(pic){
console.log(pic);
var options ={ maximumImagesCount:1,
width:400,
height: 400,
quality: 100
}
this.imagePicker.getPictures(options).then((results) => {
console.log(results.length);
console.log(results[0]);
if(results){
this.garage_imgs[pic]= results[0].toString();
this.garageimgs[pic] = results[0];
}
}, (err) => { });
console.log(this.garage_imgs);
}
private markFormGroupTouched(formGroup: FormGroup) {
console.log(formGroup)
if(formGroup.controls){
(<any>Object).values(formGroup.controls).forEach(control => {
control.markAsTouched();
if (control.controls) {
control.controls.forEach(c => this.markFormGroupTouched(c));
}
});
}
}
change_val(val,isChecked){
console.log(val)
console.log(this.cat_vals)
let index = this.final_arr.findIndex(x => x == val.id)
console.log(index)
if(isChecked) {
if(index==-1)
this.final_arr.push(val.id);
} else {
this.final_arr.splice(index, 1);
}
console.log(this.final_arr)
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" ion-button (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Add Offer
</div>
</ion-header>
<ion-content padding>
<div class="f_login_wrapper" *ngIf="services_offered" >
<form [formGroup]="offersForm" (ngSubmit)="addOffers()">
<ion-list>
<div class="login_wizard_head">Add picture of offer</div>
<div class="add_image" (click)="uploadPicture()">
<img [src]="profile_pic" *ngIf="profile_pic" >
</div>
<br>
<br>
<div class="login_wizard_head">Add offer description</div>
<ion-item>
<ion-textarea formControlName="description" placeholder="Describe your offer, what is the name of service, which parts are included, which make and models are limited from this offer, which service or parts are not included" name="description"></ion-textarea>
</ion-item>
<div class="login_wizard_head">Add Regular Price and Discount in %</div>
<div class="login_section">
<ion-row>
<ion-col col-8 class="p0">
<ion-label>Regular Price</ion-label>
</ion-col>
<ion-col col-4 class="p0">
<ion-input formControlName="price" type="number" #priceAdd (keyup)="get_price()" (onblur)="get_total()" ></ion-input>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-8 class="p0">
<ion-label>Discount in %</ion-label>
</ion-col>
<ion-col col-4 class="p0">
<ion-input formControlName="discount" type="number" (keyup)="get_discount()" (onblur)="get_total()" ></ion-input>
</ion-col>
</ion-row>
<hr>
<ion-row>
<ion-col col-10 class="p0">
<ion-label> Mwst</ion-label>
</ion-col>
<ion-col col-2 class="p0">
<ion-label class="textRight"> 20%</ion-label>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-10 class="p0">
<ion-label class="text_green"> Offer Price (inclusive of Mwst)</ion-label>
</ion-col>
<ion-col col-2 class="p0">
<ion-label class="textRight text_green"> {{price_val}} €</ion-label>
</ion-col>
</ion-row>
</div>
<br>
<div class="login_wizard_head">Select Expiry Date</div>
<ion-item>
<ion-datetime displayFormat="YYYY-M-DD" min="{{today_date}}" max="2040" name="expiry_date" formControlName="expiry_date" [(ngModel)]="expiry_date" (ngModelChange)="date_fetch($event)" placeholder="Select Date" > </ion-datetime>
</ion-item>
</ion-list>
<button class="login_btn widthFull theme_green" ion-button full [disabled]="!offersForm.valid" >Release Offer</button>
</form>
</div>
</ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { Addoffers } from './addoffers';
@NgModule({
declarations: [
Addoffers,
],
imports: [
IonicPageModule.forChild(Addoffers),
],
})
export class AddoffersModule {}
page-addoffers {
.f_login_wrapper{
width: 100%;
.list{
.item{
padding:0px;
background: transparent;
border:none !important;
min-height: 40px !important;
border:2px solid #929292 !important;
border-radius:0px;
margin-bottom:10px;
.checkbox {
margin-right:9px !important;
}
.label {
color: #787878 !important;
font-size: 17px !important;
font-weight: 400;
margin: 0px;
}
.checkbox-checked{
background: #225682 !important;
border:1px solid #225682 !important;
border-radius: 6px !important;
}
.checkbox-icon{
width:18px !important;
height:18px !important;
border-radius: 6px;
border:2px solid #225682 !important;
background: transparent;
}
.checkbox-checked .checkbox-inner{
left:5px !important;
top:2px !important;
border-color: #15b3d5 !important;
}
}
.item-inner{
height:35px;
padding-left: 25px !important;
}
}
.fm_signup_btn{
color: #1d527f;
background:transparent;
font-weight: 500;
height:40px;
border-radius: 30px;
font-size:18px;
text-transform: capitalize;
border:2px solid #f6921e;
}
p{
color: #656565;
font-size: 18px;
text-align: center;
}
.fm_spacer{
height:40px;
width:100%;
}
}
.fm_login_btn{
color: #fff;
background: #1d527f;
font-weight: 300;
height:40px;
border-radius: 30px;
font-size:20px;
}
.add_image{
width:80px;
height:80px;
border-radius:0px;
text-align:center;
background:url('../assets/img/fm_photo.png');
background-size:cover;
background-position:center;
margin:0 auto;
img{
width:100%;
height:100%;
object-fit:cover;
object-position:center;
border-radius:50%;
}
}
.datetime {
padding-left:8px !important;
color: #787878 !important;
}
.login_section{
.row{
margin-bottom: 10px;
}
.label{
font-size: 18px;
margin:0px;
padding-top:5px;
}
.input {
border:1px solid #929292;
.text-input{
margin: 0px;
height:30px;
}
}
}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import {Validators, FormBuilder, FormGroup, FormControl,FormArray } from '@angular/forms';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';
import { FileTransfer, FileUploadOptions, FileTransferObject } from '@ionic-native/file-transfer';
import { File } from '@ionic-native/file';
import { ImagePicker } from '@ionic-native/image-picker';
@IonicPage()
@Component({
selector: 'page-addoffers',
templateUrl: 'addoffers.html',
})
export class Addoffers {
todo = {}
services_offered:any;
user_data:any;
base64Image: any;
profile_pic: any;
today_date: any;
price_val:any=0;
private offersForm : FormGroup;
constructor(public navCtrl: NavController, public navParams: NavParams, private formBuilder: FormBuilder, public storage: Storage, private myservice: Myservice, private imagePicker: ImagePicker,private transfer: FileTransfer, private file: File) {
var tdyDate = new Date();
var nextDays = new Date(tdyDate);
nextDays.setDate(tdyDate.getDate());
this.today_date = nextDays.toISOString();
this.storage.get('user_data').then((user_data) => {
if(user_data){
this.user_data=user_data
console.log(this.user_data);
this.get_services()
}
})
this.offersForm = this.formBuilder.group({
//garage_services_id: ['', Validators.compose([Validators.required, Validators.minLength(1), Validators.maxLength(3)])],
discount: ['', Validators.required ],
price: ['', Validators.required ],
description: ['', Validators.required ],
expiry_date: ['', Validators.required ]
});
}
ionViewDidLoad() {
console.log('ionViewDidLoad OfferedPage');
}
back(){
this.navCtrl.pop();
}
get_services(){
this.myservice.show_loader();
this.myservice.load_get('get_selected_services/id/'+this.user_data.id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.services_offered = data.result;
}
});
}
check_discount(val){
console.log(val);
if((val.target.value > 100) || (val.target.value <=0)){
console.log(this.offersForm.value.discount)
this.offersForm.value.discount = 0;
this.offersForm.controls['discount'].patchValue('');
this.myservice.show_alert("Error", "Please enter a valid value");
}
}
addOffers(){
var num = parseInt(this.offersForm.controls['price'].value)
var val = ((num*20)/100)+num;
this.offersForm.controls['price'].patchValue(val)
var obj = Object.assign(this.offersForm.value,{'total_price' : this.price_val,'garage_id' : this.user_data.id})
if(this.base64Image) {
console.log("offer img" ,this.base64Image)
this.load_post_file(this.base64Image, this.offersForm.value, "addOffers");
}
else {
this.myservice.show_loader();
this.myservice.load_post(this.offersForm.value,'addOffers').subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.myservice.show_alert("Release Offer", data.message);
this.navCtrl.push('Viewoffers')
}
else{
this.myservice.show_alert("Error", data.message);
}
});
}
}
load_post_file(imageURI, post_data, fn_name) {
console.log(imageURI);
let ft = this.transfer.create();
let filename = imageURI.substr(imageURI.lastIndexOf('/')+1);
let options = {
fileKey: 'file',
fileName: filename,
mimeType: 'image/jpeg',
chunkedMode: false,
headers: {
'Content-Type' : undefined
},
params: post_data
};
//ft.onProgress(this.onProgress);
this.myservice.show_loader();
ft.upload(imageURI, this.myservice.webservice_url+fn_name, options, false)
.then((result: any) => {
//this.success(result);
this.myservice.hide_loader();
console.log(result);
var res =JSON.parse(result.response);
if(res.status == "failed") {
this.myservice.show_alert("Error!", result.message);
}
else {
this.myservice.show_alert("Release Offer!", res.message);
this.navCtrl.push('Viewoffers')
}
}).catch((error: any) => {
//this.failed(error);
console.log(error);
//this.result = error;
this.myservice.hide_loader();
this.myservice.show_alert("Error!", 'Error occured. Please try again');
});
//console.log(this.result);
//return this.result;
}
uploadPicture(){
var options ={ maximumImagesCount:1,
width:750,
height: 338,
quality: 100
}
this.imagePicker.getPictures(options).then((results) => {
for (var i = 0; i < results.length; i++) {
console.log('Image URI: ' + results[i]);
if(results[i]){
this.base64Image = results[i];
this.profile_pic = results[i];
}
}
}, (err) => { });
}
date_fetch(val){
console.log(val);
}
get_price(){
var labour_price = this.offersForm.controls['price'].value;
var amounts = parseInt(labour_price);
this.price_val = 0;
// if((this.tested > 100) || (this.tested <=0))
// this.price_val = ((amounts*this.tested)/100)+amounts;
if(amounts>0){
console.log(amounts);
this.price_val = amounts+parseInt(this.price_val);
}
this.price_val = ((this.price_val*20)/100)+this.price_val;
}
get_discount(){
if(this.offersForm.controls['price'].value >0){
this.price_val = parseInt(this.offersForm.controls['price'].value)
this.price_val = ((this.price_val*20)/100)+this.price_val;
var discount_price = this.offersForm.controls['discount'].value;
var amounts = parseInt(discount_price);
console.log("price" , this.price_val)
console.log("discount price" , amounts)
if((amounts < 100) || (amounts >0)){
this.price_val = this.price_val - ((this.price_val*amounts)/100)
console.log("discount val" ,this.price_val)
}
}else{
this.offersForm.controls['discount'].patchValue('');
this.myservice.show_alert("Error", "Please enter a valid regular price");
}
}
get_total(){
//this.price_val = 0;
//this.price_val = parseInt(this.price_val)+parseInt(this.tested);
console.log('price_val',this.price_val);
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" ion-button (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Available timing
</div>
<button ion-button class="nav_btn floatRight" (click)="add_services()">
<ion-icon name="add"></ion-icon>
</button>
<div class="clear"></div>
</ion-header>
<ion-content padding class="page_background">
<div class="f_login_wrapper">
<div class="login_wizard_head">Select date & available timings</div>
<br>
<div class="time_div_head">
<div class="nav_btn floatLeft">
<ion-icon name="md-arrow-back"></ion-icon>
</div>
<div class="calender_title">
Mon, 13-04-1993
</div>
<div class="nav_btn floatRight">
<ion-icon name="md-arrow-forward"></ion-icon>
</div>
<div class="clear"></div>
</div>
<div class="time_section">
<ul>
<li [ngClass]="{'selected': id === 1 }" id="1" (click)="select(id=1)">07:30am</li>
<li [ngClass]="{'selected': id === 2 }" id="2" (click)="select(id=2)">07:30am</li>
<li [ngClass]="{'selected': id === 3 }" id="3" (click)="select(id=3)">07:30am</li>
<li [ngClass]="{'selected': id === 4 }" id="4" (click)="select(id=4)">07:30am</li>
<li [ngClass]="{'selected': id === 5 }" id="5" (click)="select(id=5)">07:30am</li>
<li [ngClass]="{'selected': id === 6 }" id="6" (click)="select(id=6)">07:30am</li>
<li [ngClass]="{'selected': id === 7 }" id="7" (click)="select(id=7)">07:30am</li>
<li [ngClass]="{'selected': id === 8 }" id="8" (click)="select(id=8)">07:30am</li>
<li [ngClass]="{'selected': id === 9 }" id="9" (click)="select(id=9)">07:30am</li>
</ul>
</div>
<button class="login_btn widthFull theme_lblue" ion-button full>Save</button>
</div>
</ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { AvailablePage } from './available';
@NgModule({
declarations: [
AvailablePage,
],
imports: [
IonicPageModule.forChild(AvailablePage),
],
})
export class AvailablePageModule {}
page-available {
.f_login_wrapper{
width: 100%;
.time_div_head{
width:100%;
.nav_btn{
color: #205373;
text-align: center;
padding: 5px !important;
}
.calender_title{
width:calc(100% - 90px);
float: left;
text-align:center;
color: #000;
font-size: 18px;
font-weight: 500;
padding: 5px !important;
}
}
.time_section{
padding-bottom: 40px;
ul{
margin:0px;
padding:0px;
width:100%;
li{
display:inline-block;
width:32.5%;
text-align: center;
padding: 10px;
font-size: 16px;
background: #E8ECED;
color: #205373;
margin-bottom:3px;
}
.selected{
background: #205373;
color: #fff;
}
}
}
}
.login_btn{
text-transform: capitalize !important;
}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-available',
templateUrl: 'available.html',
})
export class AvailablePage {
selected = false;
id: any;
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad AvailablePage');
}
back(){
this.navCtrl.pop();
}
select(id: any) {
this.id = id;
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" *ngIf="from_push" ion-button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<button class="nav_btn floatLeft" *ngIf="!from_push" ion-button (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Booking Overview
</div>
</ion-header>
<ion-content padding class="page_background">
<div class="fm_vehicle_detail" *ngIf="request_val" >
<div class="fm_quote_received">
Booked for : <strong>{{request_val.book_date |date:'dd MMM yyyy'}} </strong> at <strong>{{request_val.book_time}} </strong>
</div>
<div class="fm_vehicle_banner">
<div class="fm_vehicle_photo"> <img *ngIf="request_val.profile_pic" [src]="request_val.profile_pic" ></div>
<div class="fm_vehicle_detail">
<h4>{{request_val.first_name}} {{request_val.last_name}}</h4>
<!-- <p>Mustang 2017</p> -->
</div>
<div class="clear"></div>
</div>
<div class="fm_vehicle_bottom">
<p>Repair Type:</p>
<h4 *ngIf="request_val.pool_id!=0" >{{request_val.service_name}}</h4>
<h4 *ngIf="request_val.pool_id==0" >{{request_val.service}}</h4>
<p>User Name:</p>
<h4>{{request_val.first_name}} {{request_val.last_name}}</h4>
<p *ngIf="request_val.discount!=null" >Discount:</p>
<h4 *ngIf="request_val.discount!=null" >{{request_val.discount}}%</h4>
<p>Price:</p>
<h4>€{{request_val.price}}</h4>
<p>Repair status:</p>
<h4 *ngIf="request_val.book_status==1" >Repair Done</h4>
<br>
<!-- <p>Existing quote photos</p>
<div class="fm_gallery">
<li></li>
<li></li>
<div class="clear"></div>
</div>
<p>Details and Images</p>
<div class="fm_gallery">
<li *ngFor="let images of request_val.pool_images" > <img [src]="images.image" ></li>
</div> -->
</div>
<div class="textCenter" *ngIf="request_val">
<button *ngIf="request_val.book_status==1" class="login_btn widthFull theme_lblue" ion-button (click)="repair(3)" >Repair Done</button>
<button class="login_btn widthFull theme_red" ion-button (click)="cancel_booking()" > Cancel Booking</button>
</div> </div>
</ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { BookingDetail } from './booking-detail';
@NgModule({
declarations: [
BookingDetail,
],
imports: [
IonicPageModule.forChild(BookingDetail),
],
})
export class BookingDetailModule {}
page-booking-detail {
.page_background{
background:#fff;
background-size: cover;
background-position: center;
}
.fm_vehicle_detail{
width: 100%;
.fm_quote_received{
color: #0076ba;
padding: 10px;
border-radius: 0px;
padding-left: 0px;
padding-right: 0px;
font-size: 18px;
font-weight:500;
padding-bottom: 20px;
text-align: center;
strong{
color: #1DB100;
padding-left: 10px;
}
}
.fm_vehicle_banner{
width: 100%;
margin-top: 20px;
border-bottom:1px solid #bfbfbf;
padding-bottom: 20px;
.fm_vehicle_photo{
width:80px;
height:80px;
border-radius: 50%;
border-radius: 50%;
background: #f3f3f3;
float: left;
img{
width:100%;
height:100%;
border-radius: 50%;
object-fit: cover;
object-position: center;
}
}
.fm_vehicle_detail{
float: left;
width:calc(100% - 100px);
padding: 25px;
h4{
margin:0px;
padding:0px;
color: #07426a;
font-size: 20px;
}
p{
margin:0px;
padding:0px;
color: #5c5c5c;
}
}
}
.fm_vehicle_bottom{
width: 100%;
p{
color: #0076ba;
margin-bottom: 0px;
font-weight: 600;
font-size: 16px;
}
h4{
color: #7b7b7b;
margin:0px;
font-weight: 400;
font-size: 18px;
padding-top: 8px;
}
.fm_gallery{
width: 100%;
padding-top: 10px;
padding-bottom: 20px;
li{
width: calc(100% - 51%);
height: 100px;
background: #a8a8a8;
list-style: none;
display:inline-block;
img{
width:100%;
height:100%;
object-fit: cover;
object-position: center;
}
}
}
}
}
}
.login_btn{
text-transform: capitalize !important;
}
\ No newline at end of file
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams ,Events} from 'ionic-angular';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';
@IonicPage()
@Component({
selector: 'page-booking-detail',
templateUrl: 'booking-detail.html',
})
export class BookingDetail {
booking_id:any;
request_val:any;
stat:any;
user_data:any;
book_list:any;
from_push:any = false;
constructor(public navCtrl: NavController, public navParams: NavParams,public storage:Storage, private myservice: Myservice,public events:Events) {
this.booking_id = this.navParams.get('id');
this.stat = this.navParams.get('stat');
this.from_push = this.navParams.get('from_push');
if(this.booking_id){
this.getSingleBookings();
this.update_read_status();
this.storage.get('user_data').then((user_data) => {
if(user_data){
this.user_data=user_data
console.log(this.user_data);
}
})
}
}
ionViewDidLoad() {
console.log('ionViewDidLoad VehicleDetailPage');
}
back(){
this.navCtrl.pop();
}
repair(statuss){
this.myservice.show_loader();
this.myservice.load_get('update_book_status/id/'+this.booking_id+'/status/'+statuss).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.myservice.show_alert("Success",data.message);
this.getSingleBookings();
this.update_read_status();
this.events.publish('user:incomp_read_status','');
}
else
this.myservice.show_alert("Error",data.message)
});
}
getSingleBookings(){
this.myservice.show_loader();
this.myservice.load_get('getSingleBookings/id/'+this.booking_id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.request_val = data.data;
}
});
}
get_booking(){
this.myservice.show_loader();
this.myservice.load_get('getBookings/id/'+this.user_data.id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.book_list = data.data;
console.log(this.book_list);
}
});
}
update_read_status(){
this.myservice.show_loader();
this.myservice.load_get('update_bookread_status/id/'+this.booking_id+'/stat/'+this.stat).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.events.publish('user:read_status','');
this.events.publish('user:incomp_read_status','');
console.log(data);
}
});
}
cancel_booking(){
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" ion-button>
<ion-icon name="ios-menu" menuToggle></ion-icon>
</button>
<div class="nav_header_title floatLeft">
My Bookings
</div>
</ion-header>
<ion-content padding class="page_background">
<div class="fm_list">
<div class="fm_list_tab">
<ul>
<li [ngClass]="{'active' : slidertab == 1}" (click)="goToSlide(1)">BOOKED<ion-badge color="danger" *ngIf="book_list" >{{book_list.active_count}}</ion-badge></li>
<li [ngClass]="{'active' : slidertab == 2}" (click)="goToSlide(2)">COMPLETED</li>
<div class="clear"></div>
</ul>
<ion-slides pager="false" #mySlider class="fm_slide" (ionSlideDidChange)="slideChanged()">
<ion-slide class="theme_secondary">
<ion-list *ngIf="book_list">
<ion-item (click)="booking_details(bookings.id,'read_garage_status')" *ngFor="let bookings of book_list.booked" [ngClass]="(bookings.read_garage_status == 0)?'stat':''">
<h5>{{bookings.name}} </h5>
<div class="fill_detail">
<div class="fill_detail_half">
<p>Booked Service:</p>
<h6 *ngIf="bookings.service!=null" >{{bookings.service}}</h6>
<h6 *ngIf="bookings.service_name!=''" >{{bookings.service_name}}</h6>
</div>
<div class="fill_detail_half pl15">
<p>Booked for:</p>
<h6 *ngIf="bookings.book_time!=null" >{{bookings.book_date |date:'EE,dd.MM.yyyy' }},{{bookings.book_time }}</h6>
<p>Total Amount:<strong class="text_green">€{{bookings.price}}</strong></p>
</div>
<div class="clear"></div>
</div>
</ion-item>
<div *ngIf="book_list.booked.length <=0" class="empty_div_style">
No Booking Found
</div>
</ion-list>
</ion-slide>
<ion-slide class="theme_secondary">
<ion-list *ngIf="book_list">
<ion-item (click)="booking_details(bookings.id)" *ngFor="let bookings of book_list.completed" >
<h5>{{bookings.name}} </h5>
<div class="fill_detail">
<div class="fill_detail_half">
<p>Booked Service:</p>
<h6 *ngIf="bookings.service!=null" >{{bookings.service}}</h6>
<h6 *ngIf="bookings.service_name!=''" >{{bookings.service_name}}</h6>
</div>
<div class="fill_detail_half pl15">
<p>Booked for:</p>
<h6 *ngIf="bookings.book_time!=null" >{{bookings.book_date |date:'EE,dd.MM.yyyy' }},{{bookings.book_time }}</h6>
<p>Total Amount:<strong class="text_green">€{{bookings.price}}</strong></p>
</div>
<div class="clear"></div>
</div>
</ion-item>
<div *ngIf="book_list.completed.length <=0" class="empty_div_style">
No Booking Found
</div>
</ion-list >
</ion-slide>
</ion-slides>
<div class="empty_div_style" *ngIf="!book_list">
No Booking Found
</div>
</div>
</div>
</ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { Booking } from './booking';
@NgModule({
declarations: [
Booking,
],
imports: [
IonicPageModule.forChild(Booking),
],
})
export class BookingModule {}
page-booking {
.page_background{
background-size: cover;
background-position: center;
}
.fm_list{
width: 100%;
.fm_list_tab{
ul{
padding:0px;
margin:0px;
border:1px solid #000;
border-radius: 30px;
li{
list-style:none;
float: left;
width:33.33%;
text-align: center;
padding: 10px;
color: #919191;
font-weight:500;
border-radius: 30px;
font-size: 14px;
position:relative;
letter-spacing: 1px;
}
.badge {
position:absolute;
right:8px;
top: 5px;
}
.active{
background: #205373;
color: #fff;
border-radius: 30px;
}
}
}
.fm_slide{
padding-top: 20px;
.list{
margin:0px;
.stat{
}
.item{
border-radius: 0px;
border:none !important;
border-top:1px solid #929292 !important;
background-repeat: no-repeat !important;
background-image:url('../assets/imgs/fm_dot.png') !important;
background-position: top 12px left 10px !important;
background-size: 15px !important;
padding: 15px;
padding-left: 35px;
h5{
color: #000;
font-weight: 600;
padding-bottom: 8px;
}
.fill_detail{
width:100%;
.fill_detail_half{
width:50%;
float: left;
overflow-x: hidden;
p{
color: #0076ba;
margin:0px;
}
h6{
color: #929292;
padding-top: 3px;
}
strong{
padding-left:10px;
}
}
.pl15{
padding-left:15px;
}
}
.label{
padding: 0px;
margin:0px;
}
.fm_list_left{
width: calc(100% - 50px);
float: left;
border-right:1px solid #bfbfbf;
.fm_list_top{
width:100%;
.fm_list_top_circle{
width:30px;
height:30px;
border-radius: 50%;
background: #a8a8a8;
img{
width:100%;
height:100%;
border-radius: 50%;
object-fit: cover;
object-position: center;
}
}
h4{
margin:0px;
padding:0px;
color: #07426a;
font-size: 15px;
padding: 5px;
padding-left: 10px;
strong{
color: #5c5c5c;
font-size: 12px;
font-weight: 400;
padding-left:5px;
}
}
p{
margin:0px;
padding: 0px;
color: #1c8aa4;
font-weight: 300;
padding-top:8px;
padding-bottom:8px;
font-size: 13px;
}
}
.fm_list_bottom{
width: 100%;
ul{
margin:0px;
padding:0px;
border:none;
li{
list-style: none;
background: #e2e2e2;
color:#646464;
border-radius: 20px;
padding: 3px;
font-weight: 300;
margin: 1px;
font-size: 10px;
}
}
}
}
.fm_list_right{
width: 40px;
float: right;
text-align: right;
padding-top: 10px;
img{
width:25px;
}
p{
margin:0px;
padding:0px;
color: #636363;
text-align: right;
font-size: 12px;
}
h6{
margin:0px;
padding:0px;
color: #919191;
text-align: right;
font-size: 10px;
padding-bottom: 10px;
}
}
}
}
}
}
}
import { Component,ViewChild } from '@angular/core';
import { IonicPage, NavController, NavParams,Content,Slides, Events} from 'ionic-angular';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';
@IonicPage()
@Component({
selector: 'page-booking',
templateUrl: 'booking.html',
})
export class Booking {
currentIndex:any;
slidertab:any;
user_data:any;
book_list:any;
@ViewChild(Content) content: Content;
@ViewChild('mySlider') slider: Slides;
constructor(public navCtrl: NavController, public navParams: NavParams,public storage:Storage, private myservice: Myservice,public events:Events) {
let id = this.navParams.get("id");
this.slidertab = id;
console.log("id", id);
setTimeout(() => {
this.goToSlide(id);
}, 500)
this.slidertab = 1;
this.storage.get('user_data').then((user_data) => {
if(user_data){
this.user_data=user_data
console.log(this.user_data);
this.get_booking();
}
})
events.subscribe('user:read_status', userdetails => {
console.log("read");
this.get_booking();
});
}
ionViewDidLoad() {
console.log('ionViewDidLoad ListVehiclePage');
}
goToSlide(id) {
this.slider.slideTo(id, 500);
}
slideChanged() {
let currentIndex = this.slider.getActiveIndex();
this.slidertab = currentIndex;
console.log("Current index is", currentIndex);
}
booking_details(id,stat){
this.navCtrl.push('BookingDetail',{'id' :id,'stat' :stat });
}
get_booking(){
this.myservice.show_loader();
this.myservice.load_get('getBookings/id/'+this.user_data.id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.book_list = data.data;
console.log(this.book_list);
}
});
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" ion-button (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Change Password
</div>
</ion-header>
<ion-content padding class="page_background">
<div class="f_login_wrapper">
<form [formGroup]="changepswform" (ngSubmit)="change_psw()" >
<ion-list>
<h4>Enter Actual Password</h4>
<ion-item>
<ion-input type="password" formControlName="password" placeholder="Password"></ion-input>
</ion-item>
<h4>Create new password</h4>
<ion-item>
<ion-input type="password" formControlName="password" placeholder="Password"></ion-input>
</ion-item>
<ion-item>
<ion-input type="password" formControlName="cpassword" placeholder="Confirm Password"></ion-input>
<span style="color: red" *ngIf="changepswform.controls['cpassword'].hasError('misMatch')">Password doesnot match</span>
</ion-item>
</ion-list>
<button class="login_btn widthFull theme_lblue" ion-button [disabled]="!changepswform.valid" >Save new password</button>
</form>
<!--- <p>Resend</p>
<button class="fm_signup_btn" ion-button (click)="signup()">Signup here</button> --->
</div>
</ion-content>
\ No newline at end of file
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { Changepsw } from './changepsw';
@NgModule({
declarations: [
Changepsw,
],
imports: [
IonicPageModule.forChild(Changepsw),
],
})
export class ChangepswModule {}
page-changepsw {
.page_background{
background:url('../../assets/imgs/fm_login_bg.png');
background-size: cover;
background-position: center;
}
.f_login_wrapper{
width: 100%;
padding-top: 20px;
.f_logo_container{
width:100%;
text-align: left;
img{
width:160px;
}
margin-bottom: 30px;
}
h4{
color: #0076ba;
margin-bottom: 10px;
font-weight: 600;
font-size: 18px;
text-align: left;
}
.item{
padding:0px;
background: transparent;
border:none !important;
height: 40px !important;
margin-bottom:20px;
.item-inner{
border:2px solid #929292 !important;
border-radius:0px;
.input{
.text-input{
color: #989898;
font-size: 18px;
font-weight: 300;
}
}
}
}
.item-input-has-focus{
border:none !important;
}
.input-has-focus{
border:none !important;
}
.fm_login_btn{
width:100%;
color: #fff;
background: #1d527f;
font-weight: 300;
min-height:40px !important;
border-radius: 30px;
font-size:18px;
}
p{
color: #656565;
font-size: 18px;
text-align: center;
}
.fm_spacer{
height:40px;
width:100%;
}
}
.login_btn{
text-transform: capitalize !important;
}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import {Myservice} from '../../providers/myservice'
import { ValidationService } from '../../providers/validation_service';
import {Validators, FormBuilder, FormGroup, FormControl , AbstractControl} from '@angular/forms';
import { Storage } from '@ionic/storage';
@IonicPage()
@Component({
selector: 'page-changepsw',
templateUrl: 'changepsw.html',
})
export class Changepsw {
private changepswform : FormGroup;
user_data:any;
constructor(public navCtrl: NavController, public navParams: NavParams,private myservice: Myservice, public formBuilder : FormBuilder,public storage:Storage) {
this.changepswform = this.formBuilder.group({
password: ['', Validators.required ],
cpassword: ['', Validators.required],
}, {
validator: this.Match('password', 'cpassword')
});
this.storage.get('user_data').then((user_data) => {
console.log(user_data);
if(user_data){
this.user_data=user_data;
}
})
}
ionViewDidLoad() {
console.log('ionViewDidLoad OtpPage');
}
login(){
this.navCtrl.push('LoginPage');
}
change_psw(){
console.log(this.changepswform.value);
this.myservice.show_loader();
var obj = {'cpassword': this.changepswform.value.cpassword,'password': this.changepswform.value.password,'id':this.user_data.id}
this.myservice.load_post(obj,'changepsw').subscribe(data => {
this.myservice.hide_loader();
if(data.status == "success") {
this.myservice.show_alert("Success" , data.message);
this.navCtrl.push('AddcarPage');
}
else {
this.myservice.show_alert("Error" , data.message);
}
})
}
Match(firstControlName, secondControlName) {
return (AC: AbstractControl) => {
let firstControlValue = AC.get(firstControlName).value; // to get value in input tag
let secondControlValue = AC.get(secondControlName).value; // to get value in input tag
if (firstControlValue != secondControlValue) {
AC.get(secondControlName).setErrors({mismatch: true});
console.log(false);
} else {
console.log(true);
return null
}
};
}
emailValidator(control: FormControl): {[s: string]: boolean} {
if (!(control.value.toLowerCase().match('^[a-z0-9.]+( \ [_a-z0-9]+)*@[a-z0-9-]+(\.[a-z0-9-]+)\\.(\.[a-z0-9-]{1,15})$'))) {
return {invalidEmail: true};
}
}
back()
{
this.navCtrl.pop();
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" ion-button (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Edit Offer
</div>
</ion-header>
<ion-content padding>
<div class="f_login_wrapper" *ngIf="services_offered" >
<form [formGroup]="editoffersForm" (ngSubmit)="addOffers()">
<ion-list>
<div class="login_wizard_head">Add picture of offer</div>
<div class="add_image" (click)="uploadPicture()">
<img [src]="profile_pic" *ngIf="profile_pic" >
</div>
<br>
<br>
<div class="login_wizard_head">Add offer description</div>
<ion-item>
<ion-textarea formControlName="description" name="description"></ion-textarea>
</ion-item>
<div class="login_wizard_head">Add Regular Price in Discount</div>
<div class="login_section">
<ion-row>
<ion-col col-8 class="p0">
<ion-label>Regular Price</ion-label>
</ion-col>
<ion-col col-4 class="p0">
<ion-input formControlName="price" type="number" #priceAdd (keyup)="get_price()" (onblur)="get_total()" ></ion-input>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-8 class="p0">
<ion-label>Discount in %</ion-label>
</ion-col>
<ion-col col-4 class="p0">
<ion-input formControlName="discount" type="number" (keyup)="get_discount()" (onblur)="get_total()" ></ion-input>
</ion-col>
</ion-row>
<hr>
<ion-row>
<ion-col col-10 class="p0">
<ion-label> Mwst</ion-label>
</ion-col>
<ion-col col-2 class="p0">
<ion-label class="textRight"> 20%</ion-label>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-10 class="p0">
<ion-label class="text_green"> Offer Price (inclusive of Mwst)</ion-label>
</ion-col>
<ion-col col-2 class="p0">
<ion-label class="textRight text_green"> {{price_val}} €</ion-label>
</ion-col>
</ion-row>
</div>
<br>
<div class="login_wizard_head">Select Expiry Date</div>
<ion-item>
<ion-datetime displayFormat="YYYY-M-DD" min="{{today_date}}" max="2040" name="expiry_date" formControlName="expiry_date" placeholder="Select Date" > </ion-datetime>
</ion-item>
</ion-list>
<button class="login_btn widthFull theme_green" ion-button full [disabled]="!editoffersForm.valid" >Release Offer</button>
<button class="login_btn widthFull theme_red" type="button" ion-button full (click)="delete_offer()">Delete Offer</button>
</form>
</div>
</ion-content>
<ion-footer padding>
</ion-footer>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { Editoffers } from './editoffers';
@NgModule({
declarations: [
Editoffers,
],
imports: [
IonicPageModule.forChild(Editoffers),
],
})
export class EditoffersModule {}
page-editoffers {
.f_login_wrapper{
width: 100%;
.list{
.item{
padding:0px;
background: transparent;
border:none !important;
min-height: 40px !important;
border:2px solid #929292 !important;
border-radius:0px;
margin-bottom:10px;
.checkbox {
margin-right:9px !important;
}
.label {
color: #787878 !important;
font-size: 17px !important;
font-weight: 400;
margin: 0px;
}
.checkbox-checked{
background: #225682 !important;
border:1px solid #225682 !important;
border-radius: 6px !important;
}
.checkbox-icon{
width:18px !important;
height:18px !important;
border-radius: 6px;
border:2px solid #225682 !important;
background: transparent;
}
.checkbox-checked .checkbox-inner{
left:5px !important;
top:2px !important;
border-color: #15b3d5 !important;
}
}
.item-inner{
height:35px;
padding-left: 25px !important;
}
}
.fm_signup_btn{
color: #1d527f;
background:transparent;
font-weight: 500;
height:40px;
border-radius: 30px;
font-size:18px;
text-transform: capitalize;
border:2px solid #f6921e;
}
p{
color: #656565;
font-size: 18px;
text-align: center;
}
.fm_spacer{
height:40px;
width:100%;
}
}
.fm_login_btn{
color: #fff;
background: #1d527f;
font-weight: 300;
height:40px;
border-radius: 30px;
font-size:20px;
}
.add_image{
width:80px;
height:80px;
border-radius:0px;
text-align:center;
background:url('../assets/img/fm_photo.png');
background-size:cover;
background-position:center;
margin:0 auto;
img{
width:100%;
height:100%;
object-fit:cover;
object-position:center;
border-radius:50%;
}
}
.datetime {
padding-left:8px !important;
color: #787878 !important;
}
.login_section{
.row{
margin-bottom: 10px;
}
.label{
font-size: 18px;
margin:0px;
padding-top:5px;
}
.input {
border:1px solid #929292;
.text-input{
margin: 0px;
height:30px;
}
}
}
.login_btn{
text-transform: capitalize !important;
}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,AlertController } from 'ionic-angular';
import {Validators, FormBuilder, FormGroup, FormControl,FormArray } from '@angular/forms';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';
import { FileTransfer, FileUploadOptions, FileTransferObject } from '@ionic-native/file-transfer';
import { File } from '@ionic-native/file';
import { ImagePicker } from '@ionic-native/image-picker';
@IonicPage()
@Component({
selector: 'page-editoffers',
templateUrl: 'editoffers.html',
})
export class Editoffers {
tested:any;
todo = {}
services_offered:any;
user_data:any;
base64Image: any;
profile_pic: any;
single_offers: any;
today_date: any;
offer_id: any;
price_val:any=0;
private editoffersForm : FormGroup;
constructor(public navCtrl: NavController, public navParams: NavParams, private formBuilder: FormBuilder, public storage: Storage, private myservice: Myservice, private imagePicker: ImagePicker,private transfer: FileTransfer, private file: File,private alertCtrl: AlertController) {
this.offer_id= this.navParams.get('id')
var tdyDate = new Date();
var nextDays = new Date(tdyDate);
nextDays.setDate(tdyDate.getDate());
this.today_date = nextDays.toISOString();
this.get_single_offer()
this.storage.get('user_data').then((user_data) => {
if(user_data){
this.user_data=user_data
console.log(this.user_data);
this.get_services()
}
})
this.editoffersForm = this.formBuilder.group({
//garage_services_id: ['', Validators.compose([Validators.required, Validators.minLength(1), Validators.maxLength(3)])],
discount: ['', Validators.required ],
price: ['', Validators.required ],
description: ['', Validators.required ],
expiry_date: ['', Validators.required ]
});
}
ionViewDidLoad() {
console.log('ionViewDidLoad Editoffers');
}
back(){
this.navCtrl.pop();
}
get_services(){
this.myservice.show_loader();
this.myservice.load_get('get_selected_services/id/'+this.user_data.id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.services_offered = data.result;
}
});
}
get_single_offer(){
this.myservice.show_loader();
this.myservice.load_get('get_single_offer/id/'+this.offer_id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.single_offers = data.data;
console.log(this.single_offers)
this.price_val = this.single_offers.total_price;
this.profile_pic = this.single_offers.img;
this.editoffersForm.patchValue(this.single_offers);
}
});
}
check_discount(val){
console.log(val);
if((val.target.value > 100) || (val.target.value <=0)){
console.log(this.editoffersForm.value.discount)
this.editoffersForm.value.discount = 0;
this.editoffersForm.controls['discount'].patchValue('');
this.myservice.show_alert("Error", "Please enter a valid value");
}
}
addOffers(){
var num = parseInt(this.editoffersForm.controls['price'].value)
var val = ((num*20)/100)+num;
this.editoffersForm.controls['price'].patchValue(val)
var obj = Object.assign(this.editoffersForm.value,{'total_price' : this.price_val,'garage_id' : this.user_data.id})
if(this.base64Image) {
console.log("offer img" ,this.base64Image)
this.load_post_file(this.base64Image, this.editoffersForm.value, "addOffers");
}
else {
this.myservice.show_loader();
this.myservice.load_post(this.editoffersForm.value,'addOffers').subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.navCtrl.push('Viewoffers')
}
else{
this.myservice.show_alert("Error", data.message);
}
});
}
}
load_post_file(imageURI, post_data, fn_name) {
console.log(imageURI);
let ft = this.transfer.create();
let filename = imageURI.substr(imageURI.lastIndexOf('/')+1);
let options = {
fileKey: 'file',
fileName: filename,
mimeType: 'image/jpeg',
chunkedMode: false,
headers: {
'Content-Type' : undefined
},
params: post_data
};
//ft.onProgress(this.onProgress);
this.myservice.show_loader();
ft.upload(imageURI, this.myservice.webservice_url+fn_name, options, false)
.then((result: any) => {
//this.success(result);
this.myservice.hide_loader();
console.log(result);
var res =JSON.parse(result.response);
if(res.status == "failed") {
this.myservice.show_alert("Error!", result.message);
}
else {
this.myservice.show_alert("Success!", res.message);
this.navCtrl.push('Viewoffers')
}
}).catch((error: any) => {
//this.failed(error);
console.log(error);
//this.result = error;
this.myservice.hide_loader();
this.myservice.show_alert("Error!", 'Error occured. Please try again');
});
//console.log(this.result);
//return this.result;
}
uploadPicture(){
var options ={ maximumImagesCount:1,
width:750,
height: 338,
quality: 100
}
this.imagePicker.getPictures(options).then((results) => {
for (var i = 0; i < results.length; i++) {
console.log('Image URI: ' + results[i]);
if(results[i]){
this.base64Image = results[i];
this.profile_pic = results[i];
}
}
}, (err) => { });
}
date_fetch(val){
console.log(val);
}
get_price(){
var labour_price = this.editoffersForm.controls['price'].value;
var amounts = parseInt(labour_price);
this.price_val = 0;
// if((this.tested > 100) || (this.tested <=0))
// this.price_val = ((amounts*this.tested)/100)+amounts;
if(amounts>0){
console.log(amounts);
this.price_val = amounts+parseInt(this.price_val);
}
this.price_val = ((this.price_val*20)/100)+this.price_val;
}
get_discount(){
if(this.editoffersForm.controls['price'].value >0){
this.price_val = parseInt(this.editoffersForm.controls['price'].value)
this.price_val = ((this.price_val*20)/100)+this.price_val;
var discount_price = this.editoffersForm.controls['discount'].value;
var amounts = parseInt(discount_price);
console.log("price" , this.price_val)
console.log("discount price" , amounts)
if((amounts < 100) || (amounts >0)){
this.price_val = this.price_val - ((this.price_val*amounts)/100)
console.log("discount val" ,this.price_val)
}
}else{
this.editoffersForm.controls['discount'].patchValue('');
this.myservice.show_alert("Error", "Please enter a valid regular price");
}
}
get_total(){
this.price_val = 0;
this.price_val = parseInt(this.price_val)+parseInt(this.tested);
console.log('price_val',this.price_val);
}
delete_offer(){
let alert = this.alertCtrl.create({
title: 'Delete Offer',
message: 'Sure you want to delete offer?',
buttons: [
{
text: 'Back',
role: 'cancel',
handler: () => {
console.log('Back clicked');
}
},
{
text: 'Delete Offer',
handler: () => {
this.delete_offers()
}
}
]
});
alert.present();
}
delete_offers(){
this.myservice.show_loader();
this.myservice.load_get('delete_offer/id/'+this.offer_id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.navCtrl.setRoot('Viewoffers')
}
});
}
}
<ion-header>
<ion-navbar>
<ion-title>
Ionic Blank
</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
The world is your oyster.
<p>
If you get lost, the <a href="http://ionicframework.com/docs/v2">docs</a> will be your guide.
</p>
</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 {}
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
constructor(public navCtrl: NavController) {
}
}
<!--
Generated template for the HometabsPage page.
See http://ionicframework.com/docs/components/#navigation for more info on
Ionic pages and navigation.
-->
<ion-header>
<ion-navbar>
<ion-title>hometabs</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
</ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { HometabsPage } from './hometabs';
@NgModule({
declarations: [
HometabsPage,
],
imports: [
IonicPageModule.forChild(HometabsPage),
],
})
export class HometabsPageModule {}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
/**
* Generated class for the HometabsPage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/
@IonicPage()
@Component({
selector: 'page-hometabs',
templateUrl: 'hometabs.html',
})
export class HometabsPage {
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad HometabsPage');
}
}
<ion-content>
<div class="landing_wizard">
<div class="logo">
<img src="assets/img/logo1.png">
</div>
<ion-slides (ionSlideDidChange)="slideChanged()" pager="true" padding>
<ion-slide>
<img src="assets/img/icon5.png">
<h3>Kostenloses werben</h3>
<p>Reparatur, Karosseriearbeiten oder Autoreinigung? Erstelle kostenlos ein Konto.
Biete deine Leistungen & Aktionen einfach, professionell & online für Kunden in deiner Nähe an!
</p>
</ion-slide>
<ion-slide>
<img src="assets/img/icon1.png">
<h3>Leerlaufzeiten mindern</h3>
<p>Reparatur, Karosseriearbeiten oder Autoreinigung? Schalte deine verfügbaren Zeiten online frei & plane deine Auslastung mehrere Wochen voraus.</p>
</ion-slide>
<ion-slide>
<img src="assets/img/icon2.png">
<h3>Umsatz steigern</h3>
<p>Reparatur. Karosseriearbeiten oder Autoreinigung? Erhöhe deinen Umsatz durch zusätzliche online Buchungen & erweitere deinen Kundenstamm</p>
</ion-slide>
</ion-slides>
<div class="bottom_btn_bay">
<button ion-button class="next_btn" [hidden]="currentIndex == 2" (click)="goToNextSlide()" >
<ion-icon name="ios-arrow-dropright-circle-outline"></ion-icon>
</button>
<button ion-button class="next_btn" [hidden]="currentIndex != 2" (click)="login()">
<ion-icon name="ios-arrow-dropright-circle-outline"></ion-icon>
</button>
</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 {
.slide-zoom{
height: auto !important;
}
.slides{
padding: 20px;
height:auto !important;
img{
width: 150px;
margin-bottom: 10px;
margin-top: 10px;
}
}
.swiper-pagination{
bottom:0px !important;
.swiper-pagination-bullet{
border:1px solid #0076ba;
width:10px;
height:10px;
opacity:1;
background: transparent;
}
.swiper-pagination-bullet-active{
background: #0076ba;
}
}
.landing_wizard{
.logo{
width: 100%;
padding-top: 60px;
padding-bottom: 20px;
text-align: center;
img{
width:130px;
}
}
width:100%;
height: 80vh;
position: relative;
h3{
color: #0076ba;
text-align:left;
font-weight: 600;
font-size: 25px;
text-align: center;
}
p{
color: #000;
text-align:left;
padding-bottom: 45px;
text-align: center;
}
.bottom_btn_bay{
position: fixed;
bottom:0px;
padding: 10px;
text-align: center;
z-index: 999;
width:100%;
left:0px;
right:0px;
.next_btn{
width:50px;
height:50px;
margin:0 auto;
color:#000;
font-size: 40px;
}
}
}
}
\ No newline at end of file
import { Component,ViewChild } from '@angular/core';
import { IonicPage,NavController,Slides,NavParams} from 'ionic-angular';
import { Storage } from '@ionic/storage';
@IonicPage()
@Component({
selector: 'page-landing',
templateUrl: 'landing.html',
})
export class LandingPage {
@ViewChild(Slides) slides: Slides;
currentIndex:any;
constructor(public navCtrl: NavController, public navParams: NavParams, public storage: Storage) {
this.currentIndex=0;
this.storage.get('landing_pg').then((landing_pg) => {
if(landing_pg){
this.navCtrl.push('LoginPage');
}
})
}
ionViewDidLoad() {
console.log('ionViewDidLoad LandingPage');
}
goToNextSlide() {
this.slides.slideNext();
this.slides.getActiveIndex();
console.log("fsfsf");
}
goToPrevSlide() {
this.slides.slidePrev();
this.slides.getActiveIndex();
}
slideChanged() {
this.currentIndex = this.slides.getActiveIndex();
console.log(this.currentIndex);
}
login(){
this.storage.set('landing_pg',1).then(()=>{
})
this.navCtrl.push("LoginPage");
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" ion-button>
<ion-icon name="ios-menu" menuToggle></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Legal Notice
</div>
</ion-header>
<ion-content padding class="page_background">
<ion-grid>
<ion-row (click)="agree_terms('terms')" >
<ion-col col-10>
T & C
</ion-col>
<ion-col col-2>
<ion-icon name="arrow-forward"></ion-icon>
</ion-col>
</ion-row>
<ion-row (click)="agree_terms('privacy')" >
<ion-col col-10>
Privacy Policy
</ion-col>
<ion-col col-2>
<ion-icon name="arrow-forward"></ion-icon>
</ion-col>
</ion-row>
<ion-row (click)="agree_terms('impressum')" >
<ion-col col-10>
Impressum
</ion-col>
<ion-col col-2>
<ion-icon name="arrow-forward"></ion-icon>
</ion-col>
</ion-row>
</ion-grid>
</ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { LegalnoticePage } from './legalnotice';
@NgModule({
declarations: [
LegalnoticePage,
],
imports: [
IonicPageModule.forChild(LegalnoticePage),
],
})
export class LegalnoticePageModule {}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,ModalController } from 'ionic-angular';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';
/**
* Generated class for the LegalnoticePage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/
@IonicPage()
@Component({
selector: 'page-legalnotice',
templateUrl: 'legalnotice.html',
})
export class LegalnoticePage {
terms_service:any;
constructor(public navCtrl: NavController, public navParams: NavParams,public modalCtrl: ModalController, public storage: Storage, private myservice: Myservice) {
this.get_terms()
}
ionViewDidLoad() {
console.log('ionViewDidLoad LegalnoticePage');
}
agree_terms(pg){
console.log(pg)
let termsModal = this.modalCtrl.create('TermsPage',{'data' :this.terms_service,'page' : pg} );
termsModal.present();
}
get_terms(){
//this.myservice.show_loader();
this.myservice.load_get('get_terms').subscribe(data => {
//this.myservice.hide_loader();
if(data.status == 'success'){
console.log(data.result);
this.terms_service = data.result
}
});
}
}
<!--- <ion-header class="nav_header">
<button class="nav_btn floatLeft fm_menu" menuToggle ion-button>
</button>
<div class="nav_header_title floatLeft">
<img src="assets/imgs/fm_logo.png">
</div>
</ion-header>-->
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft fm_menu" menuToggle ion-button>
<ion-icon name="ios-menu" menuToggle></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Requests
</div>
</ion-header>
<ion-content padding class="">
<div class="fm_list">
<div class="fm_list_tab">
<!--- <ul>
<li [ngClass]="{'active' : slidertab == 0}" (click)="goToSlide(0)">OPEN</li>
<li [ngClass]="{'active' : slidertab == 1}" (click)="goToSlide(1)">ACTIVE</li>
<li [ngClass]="{'active' : slidertab == 2}" (click)="goToSlide(2)">COMPLETED</li>
<div class="clear"></div>
</ul> -->
<ion-slides pager="false" #mySlider class="fm_slide" (ionSlideDidChange)="slideChanged()">
<ion-slide class="theme_secondary">
<ion-list>
<ion-item>
<h5>Max Jeffery</h5>
<div class="fill_detail">
<div class="fill_detail_half">
<p>Booked Service:</p>
<h6>Oil service, battery, Wheel aligment</h6>
</div>
<div class="fill_detail_half pl15">
<p>Booked for:</p>
<h6>12/12/2018, 9.30am</h6>
<p>Total Amount:<strong class="text_green">$452</strong></p>
</div>
<div class="clear"></div>
</div>
</ion-item>
<ion-item>
<h5>Max Jeffery</h5>
<div class="fill_detail">
<div class="fill_detail_half">
<p>Booked Service:</p>
<h6>Oil service, battery, Wheel aligment</h6>
</div>
<div class="fill_detail_half pl15">
<p>Booked for:</p>
<h6>12/12/2018, 9.30am</h6>
<p>Total Amount:<strong class="text_green">$452</strong></p>
</div>
<div class="clear"></div>
</div>
</ion-item>
<ion-item>
<h5>Max Jeffery</h5>
<div class="fill_detail">
<div class="fill_detail_half">
<p>Booked Service:</p>
<h6>Oil service, battery, Wheel aligment</h6>
</div>
<div class="fill_detail_half pl15">
<p>Booked for:</p>
<h6>12/12/2018, 9.30am</h6>
<p>Total Amount:<strong class="text_green">$452</strong></p>
</div>
<div class="clear"></div>
</div>
</ion-item>
</ion-list>
<ion-list>
<ion-item *ngFor="let list_request of request_list" (click)="details(list_request.id)" [ngClass]="(list_request.read_garage_status == 0)?'stat':''">
<div class="fm_list_left">
<div class="fm_list_top">
<div class="fm_list_top_circle floatLeft"><img *ngIf="list_request.profile_pic" [src]="list_request.profile_pic" ></div>
<h4 class="floatLeft">{{list_request.first_name}} {{list_request.last_name}}</h4>
<div class="clear"></div>
<p>Repair Details:</p>
<div class="fm_list_bottom">
<ul>
<li>{{list_request.work_name}}</li>
</ul>
</div>
</div>
</div>
<div class="fm_list_right">
<p> {{list_request.timestamp |date : 'dd'}}</p>
<h6> {{list_request.timestamp |date: 'MMM yyyy'}}</h6>
<img src="assets/imgs/fm_arw.png">
</div>
</ion-item>
<div class="no_result_found" *ngIf="!request_list">
<div class="no_result_icon">
<img src="assets/img/icon4.png">
</div>
<p>
No result found
</p>
</div>
</ion-list>
</ion-slide>
<!--- <ion-slide class="theme_secondary">
ACTIVE
</ion-slide>
<ion-slide class="theme_secondary">
COMPLETED
</ion-slide> --->
</ion-slides>
</div>
</div>
</ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { ListVehiclePage } from './list-vehicle';
@NgModule({
declarations: [
ListVehiclePage,
],
imports: [
IonicPageModule.forChild(ListVehiclePage),
],
})
export class ListVehiclePageModule {}
page-list-vehicle {
.page_background{
background:url('../../assets/imgs/fm_login_bg.png');
background-size: cover;
background-position: center;
}
.fm_list{
width: 100%;
.fm_list_tab{
ul{
padding:0px;
margin:0px;
border:1px solid #1c8aa4;
border-radius: 30px;
li{
list-style:none;
float: left;
width:33.33%;
text-align: center;
padding: 8px;
color: #919191;
font-weight:600;
border-radius: 30px;
font-size: 12px;
}
.active{
background: #1c8aa4;
color: #fff;
border-radius: 30px;
}
}
}
.fm_slide{
padding-top: 20px;
.list{
margin: 0px;
.stat{
background-image:url('../assets/imgs/fm_dot.png') !important;
}
.item{
border-radius: 0px;
border:none !important;
border-top:1px solid #929292 !important;
background-repeat: no-repeat !important;
background-image:url('../assets/imgs/fm_dot.png') !important;
background-position: top 12px left 10px !important;
background-size: 15px !important;
padding: 15px;
padding-left: 35px;
h5{
color: #000;
font-weight: 600;
padding-bottom: 8px;
}
.fill_detail{
width:100%;
.fill_detail_half{
width:50%;
float: left;
overflow-x: hidden;
p{
color: #0076ba;
margin:0px;
}
h6{
color: #929292;
padding-top: 3px;
}
strong{
padding-left:10px;
}
}
.pl15{
padding-left:15px;
}
}
.label{
padding: 0px;
margin:0px;
}
.fm_list_left{
width: calc(100% - 50px);
float: left;
border-right:1px solid #bfbfbf;
.fm_list_top{
width:100%;
.fm_list_top_circle{
width:30px;
height:30px;
border-radius: 50%;
background: #a8a8a8;
img{
width:100%;
height:100%;
border-radius: 50%;
object-fit: cover;
object-position: center;
}
}
h4{
margin:0px;
padding:0px;
color: #07426a;
font-size: 15px;
padding: 5px;
padding-left: 10px;
strong{
color: #5c5c5c;
font-size: 12px;
font-weight: 400;
padding-left:5px;
}
}
p{
margin:0px;
padding: 0px;
color: #1c8aa4;
font-weight: 300;
padding-top:8px;
padding-bottom:8px;
font-size: 13px;
}
}
.fm_list_bottom{
width: 100%;
ul{
margin:0px;
padding:0px;
border:none;
li{
list-style: none;
background: #e2e2e2;
color:#646464;
border-radius: 20px;
padding: 3px;
font-weight: 300;
margin: 1px;
font-size: 10px;
}
}
}
}
.fm_list_right{
width: 40px;
float: right;
text-align: right;
padding-top: 10px;
img{
width:25px;
}
p{
margin:0px;
padding:0px;
color: #636363;
text-align: right;
font-size: 12px;
}
h6{
margin:0px;
padding:0px;
color: #919191;
text-align: right;
font-size: 10px;
padding-bottom: 10px;
}
}
}
}
}
}
}
import { Component,ViewChild } from '@angular/core';
import { IonicPage, NavController, NavParams,Content,Slides , Events,Platform} from 'ionic-angular';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';
@IonicPage()
@Component({
selector: 'page-list-vehicle',
templateUrl: 'list-vehicle.html',
})
export class ListVehiclePage {
currentIndex:any;
slidertab:any;
user_data:any;
request_list:any;
@ViewChild(Content) content: Content;
@ViewChild('mySlider') slider: Slides;
constructor(platform: Platform,public navCtrl: NavController, public navParams: NavParams,public storage:Storage, private myservice: Myservice,public events:Events) {
let backAction = platform.registerBackButtonAction(() => {
console.log("backPressed tabs page");
platform.exitApp();
backAction();
},2)
this.storage.get('user_data').then((user_data) => {
console.log(user_data);
if(user_data){
this.user_data= user_data;
this.get_quote_request()
}else
this.navCtrl.push('LoginPage');
})
let id = this.navParams.get("id");
this.slidertab = id;
console.log("id", id);
setTimeout(() => {
this.goToSlide(id);
}, 500)
this.slidertab = 0;
events.subscribe('user:read_stat', userdetails => {
console.log("read");
this.get_quote_request();
});
}
ionViewDidLoad() {
console.log('ionViewDidLoad ListVehiclePage');
}
goToSlide(id) {
this.slider.slideTo(id, 500);
}
slideChanged() {
let currentIndex = this.slider.getActiveIndex();
this.slidertab = currentIndex;
console.log("Current index is", currentIndex);
}
details(id){
this.navCtrl.push('VehicleDetailPage',{'pool_id': id});
}
get_quote_request(){
this.myservice.show_loader();
this.myservice.load_get('get_quote_request/id/'+this.user_data.id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.request_list = data.result;
console.log(this.request_list);
this.events.publish('user:notifications', this.request_list);
}
});
}
}
<ion-content padding class="page_background">
<div class="f_login_wrapper">
<div class="f_logo_container">
<img src="assets/imgs/fm_logo.png">
</div>
<h4>LOGIN</h4>
<form [formGroup]="LoginForm" (ngSubmit)="OnLogin()">
<ion-list>
<ion-item>
<ion-input formControlName="email" type="text" #emailVal (keyup)="trim_white(emailVal.value)" placeholder="Email"></ion-input>
</ion-item>
<ion-item>
<ion-input formControlName="password" type="password" placeholder="Password"></ion-input>
</ion-item>
</ion-list>
<button class="login_btn theme_lblue" ion-button [disabled]="!LoginForm.valid" >LOGIN</button>
</form>
<br>
<p (click)="forgot_psw()" >Forgot Password?</p>
<hr>
<br>
<button class="signup_btn theme_green" ion-button (click)="signup()">Signup here</button>
</div>
</ion-content>
\ No newline at end of file
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { LoginPage } from './login';
@NgModule({
declarations: [
LoginPage,
],
imports: [
IonicPageModule.forChild(LoginPage),
],
})
export class LoginPageModule {}
page-login {
.page_background{
background:url('../../assets/imgs/fm_login_bg.png');
background-size: cover;
background-position: center;
}
.f_login_wrapper{
width: 100%;
text-align: center;
padding-top: 15%;
.f_logo_container{
width:100%;
text-align: center;
img{
width:160px;
}
margin-bottom: 30px;
}
h4{
color: #0076ba;
font-weight: 600;
letter-spacing: 1px;
font-size:20px;
text-transform: uppercase;
padding-bottom: 25px;
padding-top:20px;
}
.item{
padding:0px;
background: transparent;
border:none !important;
height: 40px !important;
margin-bottom:20px;
.item-inner{
border:2px solid #929292 !important;
border-radius:0px;
box-shadow: none !important;
.input{
.text-input{
text-align: center !important;
color: #989898;
font-size: 18px;
font-weight: 300;
width:100%;
margin:0px;
}
}
}
}
.item-input-has-focus{
border:none !important;
}
.input-has-focus{
border:none !important;
}
p{
color: #656565;
font-size: 18px;
text-align: center;
}
.fm_spacer{
height:40px;
width:100%;
}
}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,Events } from 'ionic-angular';
import {Validators, FormBuilder, FormGroup, FormControl } from '@angular/forms';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';
@IonicPage()
@Component({
selector: 'page-login',
templateUrl: 'login.html',
})
export class LoginPage {
private LoginForm : FormGroup;
device_id:any;
lat_lng:any;
constructor(public navCtrl: NavController, public navParams: NavParams, private formBuilder: FormBuilder, public storage: Storage, private myservice: Myservice, public events: Events) {
this.storage.get('get_deviceId').then((deviceId) => {
console.log(deviceId);
if(deviceId){
this.device_id = deviceId.userId
}
})
this.storage.get('user_data').then((user_data) => {
console.log(user_data);
if(user_data){
this.navCtrl.push('ListVehiclePage');
}
})
this.storage.get('lat_lng').then((lat_lng) => {
if(lat_lng){
this.lat_lng = lat_lng;
}
})
this.LoginForm = this.formBuilder.group({
email: ['', [Validators.required, this.emailValidator.bind(this)]],
password: ['', Validators.required ]
});
/* this.LoginForm.controls['email'].valueChanges.subscribe(value => {
var mails= value.trim();
console.log(mails)
this.LoginForm.controls['email'].patchValue(mails);
});*/
}
trim_white(value){
var mails= value.trim();
console.log(mails);
this.LoginForm.controls['email'].patchValue(mails);
}
ionViewDidLoad() {
console.log('ionViewDidLoad LoginPage');
}
login() {
this.navCtrl.push('HomePage');
}
signup(){
this.navCtrl.push('SignupPage');
}
forgot_psw(){
this.navCtrl.push('OtpPage');
}
OnLogin(){
console.log(this.lat_lng)
console.log(this.LoginForm.value)
this.myservice.show_loader();
var val = Object.assign({}, this.LoginForm.value , {'device_id' :this.device_id,'lat' : this.lat_lng.lat, 'lng' : this.lat_lng.lng})
this.myservice.load_post(val,'login').subscribe(data =>{
console.log(data);
this.myservice.hide_loader();
if(data.status=='success'){
this.storage.set('user_data',data.data).then(()=>{
this.myservice.hide_loader();
this.storage.get('user_data').then((user_data) => {
this.events.publish('user:update_profile', user_data);
if(data.services > 0)
this.navCtrl.setRoot('ListVehiclePage');
else
this.navCtrl.setRoot('OfferedPage');
})
});
}else
this.myservice.show_alert("Error!", data.message);
});
}
emailValidator(control: FormControl): {[s: string]: boolean} {
if (!(control.value.toLowerCase().match('^[a-z0-9.]+( \ [_a-z0-9]+)*@[a-z0-9-]+(\.[a-z0-9-]+)\\.(\.[a-z0-9-]{1,15})$'))) {
return {invalidEmail: true};
}
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" ion-button (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Your Services
</div>
</ion-header>
<ion-content padding class="page_background">
<div class="f_login_wrapper" *ngIf="services_offered" >
<div class="login_wizard_head">Select Fixpriced Services you will Offer<br>
for customers</div>
<form [formGroup]="myForm" (ngSubmit)="logForm(myForm.value)" >
<ion-list>
<ion-item *ngFor="let serv of services_offered; let i=index" >
<ion-label> {{serv.service}} </ion-label>
<ion-checkbox (ionChange)="updateCheckedOptions(serv, $event.checked)" color=""></ion-checkbox>
</ion-item>
</ion-list>
<button class="login_btn widthFull theme_lblue" [disabled]="myForm.value.services.length <= 0" ion-button full >Next</button>
</form>
</div>
</ion-content>
<ion-footer padding>
</ion-footer>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { OfferedPage } from './offered';
@NgModule({
declarations: [
OfferedPage,
],
imports: [
IonicPageModule.forChild(OfferedPage),
],
})
export class OfferedPageModule {}
page-offered {
.page_background{
background:url('../../assets/imgs/fm_login_bg.png');
background-size: cover;
background-position: center;
}
.f_login_wrapper{
width: 100%;
.list{
.item{
padding:0px;
background: transparent;
border:none !important;
min-height: 40px !important;
.checkbox {
margin-right:9px !important;
}
.label {
color: #787878 !important;
font-size: 17px !important;
font-weight: 400;
padding-left: 10px;
}
.checkbox-checked{
background: #225682 !important;
border:1px solid #225682 !important;
border-radius: 6px !important;
}
.checkbox-icon{
width:18px !important;
height:18px !important;
border-radius: 6px;
border:2px solid #225682 !important;
background: transparent;
}
.checkbox-checked .checkbox-inner{
left:5px !important;
top:2px !important;
border-color: #15b3d5 !important;
}
}
}
p{
color: #656565;
font-size: 18px;
text-align: center;
}
.fm_spacer{
height:40px;
width:100%;
}
}
.login_btn{
text-transform: capitalize !important;
}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import {Validators, FormBuilder, FormGroup, FormControl,FormArray } from '@angular/forms';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';
@IonicPage()
@Component({
selector: 'page-offered',
templateUrl: 'offered.html',
})
export class OfferedPage {
todo = {}
services_offered:any;
selected_services:any;
nonselected_services:any;
user_data:any;
myForm: FormGroup;
constructor(public navCtrl: NavController, public navParams: NavParams, private formBuilder: FormBuilder, public storage: Storage, private myservice: Myservice) {
this.storage.get('user_data').then((user_data) => {
if(user_data){
this.user_data=user_data
this.get_selected_services();
}
})
this.get_services()
this.myForm = formBuilder.group({
services: this.formBuilder.array([])
})
}
ionViewDidLoad() {
console.log('ionViewDidLoad OfferedPage');
}
back(){
this.navCtrl.pop();
}
timing(){
this.navCtrl.push('TimingPage')
}
get_services(){
this.myservice.show_loader();
this.myservice.load_get('get_services').subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.services_offered = data.result;
console.log(this.services_offered)
}
});
}
get_selected_services(){
this.myservice.show_loader();
this.myservice.load_get('get_selected_services/id/'+this.user_data.id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.selected_services = data.result;
}
});
}
updateCheckedOptions(serv, isChecked: boolean) {
console.log(serv)
const services = <FormArray>this.myForm.controls.services;
if(isChecked) {
services.push(new FormControl(serv));
} else {
let index = services.controls.findIndex(x => x.value.id == serv.id);
services.removeAt(index);
}
}
logForm(form){
var arr=[];
for (var i = 0; i < form.services.length; i++) {
console.log(form.services[i])
arr[i]={ 'garage_id' :this.user_data.id , 'service_id' : form.services[i].id };
}
this.myservice.show_loader();
this.myservice.load_post({arr},'add_services').subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.navCtrl.push('Services')
}
else{
this.myservice.show_alert("Error", data.message);
}
});
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn" ion-button (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title">
</div>
</ion-header>
<ion-content padding class="page_background">
<div class="f_login_wrapper">
<h4 class="textCenter" >Forgot Password</h4>
<hr>
<p>Please enter your registered email id <br>
to receive temp password</p>
<form [formGroup]="forgot" (ngSubmit)="on_submit()" >
<ion-list>
<ion-item>
<ion-input type="text" formControlName="email" placeholder="Email Id"></ion-input>
</ion-item>
</ion-list>
<button class="fm_login_btn" ion-button [disabled]="!forgot.valid" >SUBMIT</button>
</form>
<!--- <p>Resend</p>
<button class="fm_signup_btn" ion-button (click)="signup()">Signup here</button> --->
</div>
</ion-content>
\ No newline at end of file
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { OtpPage } from './otp';
@NgModule({
declarations: [
OtpPage,
],
imports: [
IonicPageModule.forChild(OtpPage),
],
})
export class OtpPageModule {}
page-otp {
.page_background{
background:url('../../assets/imgs/fm_login_bg.png');
background-size: cover;
background-position: center;
}
.f_login_wrapper{
width: 100%;
padding-top:20%;
.f_logo_container{
width:100%;
text-align: center;
img{
width:160px;
}
margin-bottom: 30px;
}
h4{
color: #07426a;
font-weight: 600;
letter-spacing: 1px;
font-size: 18px;
}
hr{
border:2px solid #f6921e;
width:60px;
height:0px;
margin:0 auto;
margin-bottom:40px;
}
.item{
padding:0px;
background: transparent;
border:none !important;
height: 40px !important;
margin-bottom:20px;
.item-inner{
border:2px solid #15b3d5 !important;
border-radius:30px;
.input{
.text-input{
text-align: center !important;
color: #989898;
font-size: 18px;
font-weight: 300;
}
}
}
}
.item-input-has-focus{
border:none !important;
}
.input-has-focus{
border:none !important;
}
.fm_login_btn{
width:100%;
color: #fff;
background: #1d527f;
font-weight: 300;
min-height:40px !important;
border-radius: 30px;
font-size:18px;
}
p{
color: #656565;
font-size: 18px;
text-align: center;
}
.fm_spacer{
height:40px;
width:100%;
}
}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import {Myservice} from '../../providers/myservice'
import { ValidationService } from '../../providers/validation_service';
import {Validators, FormBuilder, FormGroup, FormControl } from '@angular/forms';
import { Storage } from '@ionic/storage';
@IonicPage()
@Component({
selector: 'page-otp',
templateUrl: 'otp.html',
})
export class OtpPage {
private forgot : FormGroup;
user_data:any;
constructor(public navCtrl: NavController, public navParams: NavParams,private myservice: Myservice, public formBuilder : FormBuilder,public storage:Storage) {
this.forgot = this.formBuilder.group({
email: ['', [Validators.required, this.emailValidator.bind(this)]],
});
}
ionViewDidLoad() {
console.log('ionViewDidLoad OtpPage');
}
login(){
this.navCtrl.push('LoginPage');
}
on_submit(){
console.log(this.forgot.value);
this.myservice.show_loader();
var obj = {'email': this.forgot.value.email}
this.myservice.load_post(obj,'forgotpassword').subscribe(data => {
this.myservice.hide_loader();
if(data.status == "success") {
this.myservice.show_alert("Success" , data.message);
}
else {
this.myservice.show_alert("Error" , data.message);
}
})
}
emailValidator(control: FormControl): {[s: string]: boolean} {
if (!(control.value.toLowerCase().match('^[a-z0-9.]+( \ [_a-z0-9]+)*@[a-z0-9-]+(\.[a-z0-9-]+)\\.(\.[a-z0-9-]{1,15})$'))) {
return {invalidEmail: true};
}
}
back()
{
this.navCtrl.pop();
}
}
<ion-header class="g_header">
<button class="fm_header_btn fm_back_icon fm_float_left" (click)="goBack()"></button>
</ion-header>
<ion-content padding>
<div class="g_quote_wrapper">
<div class="g_received_quote">
Quotes received on : <span><strong>22nd Oct 2017</strong></span>
</div>
<div class="g_car_banner">
<div class="g_car_pic">
<img src="assets/img/fm_edit_profile_pic.png">
</div>
<div class="g_car_detail">
<h4>BMW</h4>
<h5>M5 Extreme</h5>
</div>
<div class="fm_clear"></div>
</div>
<hr>
<div class="g_service">
<h5>Rear Type :</h5>
<h4>Electrical and light</h4>
<h5>Existing quote photos</h5>
<div class="g_service_photo">
<li><img src="assets/img/c1.png"></li>
<li><img src="assets/img/c2.png"></li>
<div class="fm_clear"></div>
</div>
<h5>Details and Images</h5>
<div class="g_service_photo">
<span>Color Wrap</span>
<span>Tint Color</span>
<span>Exhaust</span>
<br>
<br>
<li><img src="assets/img/c3.png"></li>
<li><img src="assets/img/c4.png"></li>
<div class="fm_clear"></div>
</div>
<div class="g_quote_btn_bay">
<button class="g_quote_btn" (click)="sendquote()">Provide Quote
</button>
</div>
</div>
</div>
</ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { ProvidequotePage } from './providequote';
@NgModule({
declarations: [
ProvidequotePage,
],
imports: [
IonicPageModule.forChild(ProvidequotePage),
],
})
export class ProvidequotePageModule {}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-providequote',
templateUrl: 'providequote.html',
})
export class ProvidequotePage {
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad ProvidequotePage');
}
goBack(){
this.navCtrl.pop();
}
sendquote() {
this.navCtrl.push('SendquotePage');
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft fm_menu" *ngIf="from_push" ion-button menuToggle>
</button>
<button class="nav_btn floatLeft" *ngIf="!from_push" ion-button (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Provide Quote
</div>
</ion-header>
<ion-content padding class="page_background">
<div class="fm_vehicle_detail" *ngIf="request_val" >
<div class="fm_vehicle_banner">
<div class="fm_vehicle_photo"><img *ngIf="request_val.profile_pic" [src]="request_val.profile_pic" ></div>
<div class="fm_vehicle_detail">
<h4>{{request_val.first_name}} {{request_val.last_name}}</h4>
</div>
<div class="clear"></div>
</div>
<div class="fm_vehicle_bottom">
<form [formGroup]="quoteForm" (ngSubmit)="save_quote(quoteForm.value)">
<p>Repair Type:</p>
<h4>{{request_val.work_name}}</h4>
<p>Service Charges:</p>
<div class="add_parts_head">
<h5 class="floatLeft">Add Parts</h5>
<div class="add_btn floatRight" (click)="addParts()" >+ Parts</div>
<div class="clear"></div>
</div>
<div formArrayName="parts" >
<ion-row *ngFor="let child of quoteForm.controls.parts.controls; let i = index" [formGroupName]="i" >
<ion-col col-6 class="p0">
<ion-input placeholder="Name of Parts" formControlName="name" ></ion-input>
</ion-col>
<ion-col col-6 class="p0 textRight">
<ion-input placeholder="Price" type="number" formControlName="price" #memSearch (keyup)="get_price(memSearch.value,i)" (onblur)="get_total()"></ion-input>
<div class="s_validation" *ngIf="child.hasError('minlength')">{{vs.errorList.minLength}} 1</div>
<div class="s_validation" *ngIf="child.hasError('maxlength')">{{vs.errorList.maxLength}} 6</div>
</ion-col>
</ion-row>
</div>
<div class="add_parts_head">
<h5 class="floatLeft">Add Labour</h5>
<div class="add_btn floatRight" (click)="addlabour()" >+ Labour</div>
<div class="clear"></div>
</div>
<div formArrayName="labour" >
<ion-row *ngFor="let child of quoteForm.controls.labour.controls; let i = index" [formGroupName]="i" >
<ion-col col-6 class="p0">
<ion-input placeholder="Name of Labour" formControlName="name" ></ion-input>
</ion-col>
<ion-col col-6 class="p0 textRight">
<ion-input placeholder="Price" type="number" formControlName="price" #laborSearch (keyup)="get_labor(laborSearch.value,i)" (onblur)="get_total()"></ion-input>
<div class="s_validation" *ngIf="child.hasError('minlength')">{{vs.errorList.minLength}} 1</div>
<div class="s_validation" *ngIf="child.hasError('maxlength')">{{vs.errorList.maxLength}} 6</div>
</ion-col>
</ion-row>
</div>
<!---<ion-row>
<ion-col col-6 class="p0">
<h6>Labour</h6>
</ion-col>
<ion-col col-6 class="p0 textRight">
<ion-input placeholder="Labour Charge" type="number" formControlName="labour" #laborSearch (keyup)="get_labor(laborSearch.value)" ></ion-input>
<div class="s_validation" *ngIf="quoteForm.controls['labour'].hasError('minlength')">{{vs.errorList.minLength}} 1</div>
<div class="s_validation" *ngIf="quoteForm.controls['labour'].hasError('maxlength')">{{vs.errorList.maxLength}} 6</div>
</ion-col>
</ion-row> -->
<ion-row>
<ion-col col-6 class="p0">
<h6>Mwst</h6>
</ion-col>
<ion-col col-6 class="p0 textRight">
<div class="s_validation" >20%</div>
</ion-col>
</ion-row>
<hr>
<ion-row>
<ion-col col-6 class="p0">
<h6 class="textGreen"><strong>Total amount(incl.Mwst):</strong></h6>
</ion-col>
<ion-col col-6 class="p0 textRight">
<h6 class="textGreen"><strong>€{{price_val}}</strong></h6>
</ion-col>
</ion-row>
<p class="textCenter m0">Please add some information for customer</p>
<br>
<textarea class="customer_textarea" rows="4" formControlName="description" placeholder="what are you going to do? How long would Service last?, Are some services or parts not included?, Would you like to borrow car?, Are there special things the customer should care about?, Do you offer free car wash?" ></textarea>
<div class="textCenter">
<button id="quote_button" [disabled]="!quoteForm.valid" class="login_btn widthFull theme_lblue" ion-button>Send Quote</button>
</div>
</form>
</div>
</div>
</ion-content>
\ No newline at end of file
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { QuotePage } from './quote';
@NgModule({
declarations: [
QuotePage,
],
imports: [
IonicPageModule.forChild(QuotePage),
],
})
export class QuotePageModule {}
page-quote {
.page_background{
background:#fff;
background-size: cover;
background-position: center;
}
.fm_vehicle_detail{
width: 100%;
.fm_quote_received{
background: #f3f3f3;
color: #676767;
padding: 10px;
border-radius: 30px;
padding-left: 25px;
font-size: 14px;
font-weight: 400;
strong{
color: #07426a;
padding-left: 10px;
}
}
.fm_vehicle_banner{
width: 100%;
border-bottom:1px solid #bfbfbf;
padding-bottom: 20px;
.fm_vehicle_photo{
width:90px;
height:90px;
border-radius: 50%;
border-radius: 50%;
background: #f3f3f3;
float: left;
img{
width:100%;
height:100%;
border-radius: 50%;
object-fit: cover;
object-position: center;
}
}
.fm_vehicle_detail{
float: left;
width:calc(100% - 100px);
padding: 25px;
h4{
margin:0px;
padding:0px;
color: #07426a;
font-size: 20px;
}
p{
margin:0px;
padding:0px;
color: #5c5c5c;
}
}
}
.fm_vehicle_bottom{
width: 100%;
p{
color: #0076ba;
margin-bottom: 0px;
font-weight: 600;
font-size: 16px;
}
h4{
color: #7b7b7b;
margin:0px;
font-weight: 400;
font-size: 18px;
padding-top: 8px;
}
h5{
color: #0076ba;
font-weight: 600;
}
h6{
color: #4f4f4f;
font-weight: 400;
margin:0px;
padding:6px;
}
.fm_gallery{
width: 100%;
padding-top: 10px;
padding-bottom: 20px;
li{
width: calc(100% - 51%);
height: 100px;
background: #a8a8a8;
list-style: none;
display:inline-block;
img{
width:100%;
height:100%;
object-fit: cover;
object-position: center;
}
}
}
.row{
padding-bottom:15px;
.col{
.input {
.text-input{
border:1px solid #929292;
border-radius:0px;
margin: 0px;
height: 35px;
padding-left: 15px;
padding-right: 15px;
}
}
}
.textRight{
.input {
.text-input{
border:1px solid #929292;
border-radius:0px;
margin: 0px;
height: 35px;
padding-left: 15px;
padding-right: 15px;
text-align: right;
}
}
}
}
}
.customer_textarea{
border:1px solid #929292;
width:100%;
}
}
}
.textGreen{
color: #1DB100 !important;
}
.add_btn{
border-radius: 5px;
background: #1DB100;
color: #fff;
cursor: pointer;
font-size: 16px;
text-align: center;
padding-left: 15px;
padding-right: 15px;
padding-top:5px;
padding-bottom:5px;
}
.fm_providequote{
background: #f6921e;
color: #fff;
font-weight: 300;
text-transform: capitalize;
font-size: 18px;
border-radius: 20px;
padding-left: 60px;
padding-right: 60px;
min-height: 40px !important;
}
.add_parts_head{
padding-top: 20px;
padding-bottom:10px;
h5{
margin:0px;
padding: 6px !important;
padding-left:0px !important;
}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';
import {ValidationService} from '../../providers/validation_service';
import {Validators, FormBuilder, FormGroup, FormControl, FormArray, FormsModule, ReactiveFormsModule } from '@angular/forms';
@IonicPage()
@Component({
selector: 'page-quote',
templateUrl: 'quote.html',
})
export class QuotePage {
pool_id:any;
request_val:any;
total_price:any=0;
price_val:any=0;
labor_val:any=0;
tested:any[];
private quoteForm : FormGroup;
parts = [{name:"",price:""}]
labour = [{name:"",price:""}]
constructor(public navCtrl: NavController, public navParams: NavParams,public storage:Storage, private vs: ValidationService,private myservice: Myservice, private formBuilder: FormBuilder) {
this.pool_id = this.navParams.get('pool_id');
if(this.pool_id)
this.getSingleQuote();
this.quoteForm = this.formBuilder.group({
parts: this.formBuilder.array([]),
labour: this.formBuilder.array([]),
description: ['', Validators.required],
});
this.patchValues();
this.patchlabours();
/* const Med = <FormArray>this.quoteForm.controls['parts'];
Med.valueChanges.subscribe(value => {
this.price_val = parseInt(value[0].price)+this.price_val;
console.log("changes",this.price_val)
});
const restt = <FormArray>this.quoteForm.controls['labour'];
restt.valueChanges.subscribe(value => {
console.log(value)
this.price_val = parseInt(value)+this.price_val;
console.log("changeslabour",this.price_val)
});
*/
this.tested = [];
}
ionViewDidLoad() {
console.log('ionViewDidLoad QuotePage');
}
get_total(){
this.price_val = 0;
this.tested.forEach(x=>{
this.price_val = parseInt(this.price_val)+parseInt(x);
})
console.log(this.price_val);
}
total_val(){
alert("HH")
console.log("hello");
console.log(this.price_val);
console.log(this.labor_val);
this.price_val = parseInt(this.price_val)+parseInt(this.labor_val);
console.log(this.price_val);
}
get_price(amount,index){
var labour_price = this.quoteForm.controls['labour'].value;
console.log('labour_price' , labour_price);
var amounts = parseInt(labour_price);
this.price_val = 0;
//if(amount!= NaN){
this.tested[index] = amount;
this.tested.forEach(x=>{
console.log(x);
if(parseInt(x)>0)
this.price_val = parseInt(this.price_val)+parseInt(x);
})
if(labour_price.length>0){
labour_price.forEach(x=>{
console.log(x);
if(parseInt(x.price)>0)
this.price_val = parseInt(x.price)+parseInt(this.price_val);
})
}
this.price_val = ((this.price_val*20)/100)+this.price_val;
console.log(this.price_val);
//}
/*if(amount!=''){
this.price_val = this.price_val + amount;
}
console.log(this.price_val);*/
}
get_labor(amount,index){
var parts = this.quoteForm.controls['parts'].value;
console.log('parts' , parts);
this.price_val = 0;
//if(amount!= NaN){
this.tested[index] = amount;
this.tested.forEach(x=>{
console.log(x);
if(parseInt(x)>0)
this.price_val = parseInt(this.price_val)+parseInt(x);
})
if(parts.length>0){
parts.forEach(x=>{
console.log(x);
if(parseInt(x.price)>0)
this.price_val = parseInt(x.price)+parseInt(this.price_val);
})
}
this.price_val = ((this.price_val*20)/100)+this.price_val;
console.log(this.price_val);
//}
/*if(amount!=''){
this.price_val = this.price_val + amount;
}
console.log(this.price_val);*/
}
/*
get_price(amount,index){
var labour_price = this.quoteForm.controls['labour'].value;
console.log('labour_price' , labour_price);
var amounts = parseInt(labour_price);
this.price_val = 0;
//if(amount!= NaN){
this.tested[index] = amount;
this.tested.forEach(x=>{
console.log(x);
if(parseInt(x)>0)
this.price_val = parseInt(this.price_val)+parseInt(x);
})
if(amounts>0){
console.log(amounts);
this.price_val = amounts+parseInt(this.price_val);
}
this.price_val = ((this.price_val*20)/100)+this.price_val;
console.log(this.price_val);
//}
/*if(amount!=''){
this.price_val = this.price_val + amount;
}
console.log(this.price_val);//
} get_labor(amount){
var labour_price = this.quoteForm.controls['labour'].value;
this.+ = 0;
/*var price_vals = this.price_val
console.log("in");
this.price_val = 0;
this.tested[0] = amount
if(amount!= NaN){
this.price_val = parseInt(this.tested[0])+parseInt(price_vals);
} //
this.tested.forEach(x=>{
console.log(x);
if(parseInt(x)>0)
this.price_val = parseInt(this.price_val)+parseInt(x);
})
amount = parseInt(amount);
if(amount>0){
this.price_val = parseInt(amount)+parseInt(this.price_val);
}
this.price_val = ((this.price_val*20)/100)+this.price_val;
console.log(this.price_val);
/*if(amount!=''){
this.price_val = this.price_val + amount;
}
console.log(this.price_val); //
} */
patchValues() {
const Med = <FormArray>this.quoteForm.controls['parts'];
this.parts.forEach(x => {
Med.push(this.patch(x.name))
})
}
patch(name) {
return this.formBuilder.group({
name: ['',Validators.required],
price: ['', Validators.compose([Validators.required, Validators.minLength(1), Validators.maxLength(6)])],
})
}
addParts() {
const control = <FormArray>this.quoteForm.controls['parts'];
control.push(this.initParts())
}
initParts() {
return this.formBuilder.group({
name: ['',Validators.required],
price: ['', Validators.compose([Validators.required, Validators.minLength(1), Validators.maxLength(6)])],
})
}
patchlabours() {
const lab = <FormArray>this.quoteForm.controls['labour'];
this.labour.forEach(x => {
lab.push(this.labpatch(x.name))
})
}
labpatch(name) {
return this.formBuilder.group({
name: ['',Validators.required],
price: ['', Validators.compose([Validators.required, Validators.minLength(1), Validators.maxLength(6)])],
})
}
addlabour() {
const control = <FormArray>this.quoteForm.controls['labour'];
control.push(this.initlabour())
}
initlabour() {
return this.formBuilder.group({
name: ['',Validators.required],
price: ['', Validators.compose([Validators.required, Validators.minLength(1), Validators.maxLength(6)])],
})
}
back(){
this.navCtrl.pop();
}
save_quote(val){
var element = <HTMLInputElement> document.getElementById("quote_button");
element.disabled = true;
var tax = ((parseInt(this.price_val) * 20)/100)
//this.price_val = tax + parseInt(this.price_val);
setTimeout(() => {
Object.assign(val,{'total_price' : this.price_val,'tax' : tax})
var myJSON = JSON.stringify(val);
var objs = Object.assign({}, { 'quote' : myJSON, 'pool_id' : this.pool_id ,'unique_id' : this.request_val.unique_id })
console.log(objs);
this.myservice.show_loader();
this.myservice.load_post(objs,'save_quote').subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.myservice.show_alert("Success", data.message);
this.navCtrl.setRoot('SuccessPage');
}
else{
this.myservice.show_alert("Error", data.message);
}
});
}, 3000)
}
/*get_total(val){
console.log(val);
this.total_price = parseInt(this.total_price)+parseInt(val.target.value)
console.log(this.total_price);
} */
getSingleQuote(){
this.myservice.show_loader();
this.myservice.load_get('getSingleQuote/id/'+this.pool_id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.request_val = data.result;
}
});
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" ion-button (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Your Services
</div>
</ion-header>
<ion-content padding class="page_background">
<div class="f_login_wrapper" *ngIf="services_offered" >
<div class="login_wizard_head">Services Offered
by your Shop</div>
<ion-list>
<ion-item *ngFor="let serv of services_offered; let i=index" >
<ion-label class="floatLeft"> {{serv.service}} </ion-label>
<ion-label class="floatRight textRight"> {{serv.price}} </ion-label>
<div class="clear"></div>
</ion-item>
</ion-list>
<button class="login_btn theme_green widthFull" ion-button full (click)="edit_services()" >Add Further Services</button>
<button class="login_btn theme_lblue widthFull" ion-button full (click)="login()" >Next</button>
</div>
</ion-content>
<ion-footer padding>
</ion-footer>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { Selected_services } from './selected_services';
@NgModule({
declarations: [
Selected_services,
],
imports: [
IonicPageModule.forChild(Selected_services),
],
})
export class Selected_servicesModule {}
page-selected_services {
.page_background{
background:url('../../assets/imgs/fm_login_bg.png');
background-size: cover;
background-position: center;
}
.f_login_wrapper{
width: 100%;
.list{
.item{
padding:0px;
background: transparent;
border:none !important;
min-height: 40px !important;
.checkbox {
margin-right:9px !important;
}
.label {
color: #787878 !important;
font-size: 17px !important;
font-weight: 400;
padding-left: 0px;
}
.checkbox-checked{
background: #225682 !important;
border:1px solid #225682 !important;
border-radius: 6px !important;
}
.checkbox-icon{
width:18px !important;
height:18px !important;
border-radius: 6px;
border:2px solid #225682 !important;
background: transparent;
}
.checkbox-checked .checkbox-inner{
left:5px !important;
top:2px !important;
border-color: #15b3d5 !important;
}
}
}
.fm_signup_btn{
color: #1d527f;
background:transparent;
font-weight: 500;
height:40px;
border-radius: 30px;
font-size:18px;
text-transform: capitalize;
border:2px solid #f6921e;
}
p{
color: #656565;
font-size: 18px;
text-align: center;
}
.fm_spacer{
height:40px;
width:100%;
}
}
.login_btn{
text-transform: capitalize !important;
}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import {Validators, FormBuilder, FormGroup, FormControl,FormArray } from '@angular/forms';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';
@IonicPage()
@Component({
selector: 'page-selected_services',
templateUrl: 'selected_services.html',
})
export class Selected_services {
todo = {}
services_offered:any;
user_data:any;
private priceForm : FormGroup;
constructor(public navCtrl: NavController, public navParams: NavParams, private formBuilder: FormBuilder, public storage: Storage, private myservice: Myservice) {
this.storage.get('user_data').then((user_data) => {
if(user_data){
this.user_data=user_data
console.log(this.user_data);
this.get_services()
}
})
}
ionViewDidLoad() {
console.log('ionViewDidLoad OfferedPage');
}
back(){
this.navCtrl.pop();
}
timing(){
this.navCtrl.push('TimingPage')
}
edit_services(){
this.navCtrl.push('Services')
}
login(){
this.navCtrl.push("AvailablePage");
}
get_services(){
this.myservice.show_loader();
this.myservice.load_get('get_selected_services/id/'+this.user_data.id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.services_offered = data.result;
}
});
}
addPrice(){
this.myservice.show_loader();
this.myservice.load_post(this.services_offered,'addPrice').subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.navCtrl.push('TimingPage')
}
else{
this.myservice.show_alert("Error", data.message);
}
});
}
updateCheckedOptions(serv:Object, evt) {
console.log(serv)
var obj = {'price' : evt.target.value};
Object.assign(serv,obj)
//serv.price =evt.target.value
}
logForm(form){
var arr=[];
for (var i = 0; i < form.services.length; i++) {
console.log(form.services[i])
arr[i]={ 'garage_id' :this.user_data.id , 'service_id' : form.services[i].id };
}
this.myservice.show_loader();
this.myservice.load_post({arr},'add_services').subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.navCtrl.push('Services')
}
else{
this.myservice.show_alert("Error", data.message);
}
});
}
}
<ion-header class="g_header">
<button class="fm_header_btn fm_back_icon fm_float_left" (click)="goBack()"></button>
</ion-header>
<ion-content padding>
<div class="g_quote_wrapper">
<div class="g_car_banner">
<div class="g_car_pic">
<img src="assets/img/fm_edit_profile_pic.png">
</div>
<div class="g_car_detail">
<h4>BMW</h4>
<h5>M5 Extreme</h5>
</div>
<div class="fm_clear"></div>
</div>
<hr>
<div class="g_service">
<h5>Rear Type :</h5>
<h4>Electrical and light</h4>
<h5>Service Charges</h5>
<h6><strong>Parts</strong></h6>
<div class="g_service_photo">
<div class="childli">
<li class="child1">
<div class="g_service_text">
HID Projector
</div>
</li>
<li class="child2">
<input class="g_service_input" placeholder="Price">
</li>
<div class="fm_clear"></div>
</div>
<div class="childli">
<li class="child1">
<div class="g_service_text">
Xenon Lamp
</div>
</li>
<li class="child2">
<input class="g_service_input" placeholder="Price">
</li>
<div class="fm_clear"></div>
</div>
<div class="childli">
<li class="child1">
<h6><strong>Labour</strong></h6>
</li>
<li class="child2">
<input class="g_service_input" placeholder="Price">
</li>
<div class="fm_clear"></div>
</div>
<div class="childli">
<li class="child1">
<h6><strong>Tax</strong></h6>
</li>
<li class="child2">
<input class="g_service_input" placeholder="Price">
</li>
<div class="fm_clear"></div>
</div>
<hr>
<div class="childli">
<li class="child1">
<h6><strong>Total</strong></h6>
</li>
<li class="child2">
<input class="g_service_input" placeholder="Total Price">
</li>
<div class="fm_clear"></div>
</div>
</div>
<div class="g_quote_btn_bay">
<button class="g_quote_btn">Send Quote
</button>
</div>
</div>
</div>
</ion-content>
\ No newline at end of file
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { SendquotePage } from './sendquote';
@NgModule({
declarations: [
SendquotePage,
],
imports: [
IonicPageModule.forChild(SendquotePage),
],
})
export class SendquotePageModule {}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-sendquote',
templateUrl: 'sendquote.html',
})
export class SendquotePage {
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad SendquotePage');
}
goBack(){
this.navCtrl.pop();
}
}
<ion-content class="g_theme">
<div class="g_sign_wrapper">
<button class="g_back" (click)="goBack()"></button>
<div class="g_sign_inner">
<h4>SELECT SERVICES OFFERED <br>
BY YOUR SHOP</h4>
<hr class="g_signup_hr">
<br>
<div class="g_services">
<ul>
<li>
<div class="g_row">
<div class="g_custom">
<input id="check2" type="checkbox" name="check" value="check2">
<label for="check2">Oil Change</label>
</div>
</div>
</li>
<li>
<div class="g_row">
<div class="g_custom">
<input id="check3" type="checkbox" name="check" value="check3">
<label for="check3">Tyre Services</label>
</div>
</div>
</li>
<li>
<div class="g_row">
<div class="g_custom">
<input id="check4" type="checkbox" name="check" value="check4">
<label for="check4">Brake Services</label>
</div>
</div>
</li>
<li>
<div class="g_row">
<div class="g_custom">
<input id="check5" type="checkbox" name="check" value="check5">
<label for="check5">Mechanical Services</label>
</div>
</div>
</li>
<li>
<div class="g_row">
<div class="g_custom">
<input id="check6" type="checkbox" name="check" value="check6">
<label for="check6">E-test</label>
</div>
</div>
</li>
<li>
<div class="g_row">
<div class="g_custom">
<input id="check7" type="checkbox" name="check" value="check7">
<label for="check7">Electrical</label>
</div>
</div>
</li>
<li>
<div class="g_row">
<div class="g_custom">
<input id="check8" type="checkbox" name="check" value="check8">
<label for="check8">Bodywork</label>
</div>
</div>
</li>
<li>
<div class="g_row">
<div class="g_custom">
<input id="check9" type="checkbox" name="check" value="check9">
<label for="check9">Car wrap</label>
</div>
</div>
</li>
<li>
<div class="g_row">
<div class="g_custom">
<input id="check10" type="checkbox" name="check" value="check10">
<label for="check10">Car mods /Training</label>
</div>
</div>
</li>
<li>
<div class="g_row">
<div class="g_custom">
<input id="check11" type="checkbox" name="check" value="check11">
<label for="check11">Window Tinting</label>
</div>
</div>
</li>
</ul>
</div>
<br>
<br>
<br>
<div class="g_row text_center">
<button class="g_login_btn width100" (click)="shoptime()">NEXT</button>
</div>
</div>
</div>
</ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { ServicePage } from './service';
@NgModule({
declarations: [
ServicePage,
],
imports: [
IonicPageModule.forChild(ServicePage),
],
})
export class ServicePageModule {}
page-service {
.page_background{
background:url('../../assets/imgs/fm_login_bg.png');
background-size: cover;
background-position: center;
}
.f_login_wrapper{
width: 100%;
.list{
.item{
padding:0px;
background: transparent;
border:none !important;
min-height: 40px !important;
.checkbox {
margin-right:9px !important;
}
.label {
color: #787878 !important;
font-size: 17px !important;
font-weight: 400;
padding-left: 10px;
}
.checkbox-checked{
background: #225682 !important;
border:1px solid #225682 !important;
border-radius: 6px !important;
}
.checkbox-icon{
width:18px !important;
height:18px !important;
border-radius: 6px;
border:2px solid #225682 !important;
background: transparent;
}
.checkbox-checked .checkbox-inner{
left:5px !important;
top:2px !important;
border-color: #15b3d5 !important;
}
}
}
p{
color: #656565;
font-size: 18px;
text-align: center;
}
.fm_spacer{
height:40px;
width:100%;
}
}
.login_btn{
text-transform: capitalize !important;
}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-service',
templateUrl: 'service.html',
})
export class ServicePage {
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad ServicePage');
}
goBack(){
this.navCtrl.pop();
}
shoptime() {
this.navCtrl.push('ShoptimePage');
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" ion-button (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Your Services
</div>
<div class="clear"></div>
</ion-header>
<ion-content padding class="page_background">
<div class="f_login_wrapper" *ngIf="services_offered" >
<div class="login_wizard_head">Edit Service price</div>
<form (ngSubmit)="updatePrice()" >
<ion-row *ngFor="let serv of services_offered; let i=index" class="edit_list">
<ion-col col-7>
<ion-label> <p>{{serv.service}}</p> </ion-label>
</ion-col>
<ion-col col-4>
<ion-input type="number" (change)="updateCheckedOptions(serv, $event)" id="demo" [value]="serv.price" placeholder="Add Price"></ion-input>
</ion-col>
<ion-col col-1>
<button ion-button type="button" (click)="delete_service(serv.id)" clear item-right> <ion-icon name="ios-trash"></ion-icon></button>
<div class="clear"></div>
</ion-col>
</ion-row>
<br>
<br>
<button class="login_btn widthFull theme_green" (click)="add_services()" type="button" ion-button full>Add further services</button>
<button class="login_btn widthFull theme_lblue" ion-button full>Save</button>
</form>
</div>
</ion-content>
<ion-footer padding>
</ion-footer>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { Services } from './services';
@NgModule({
declarations: [
Services,
],
imports: [
IonicPageModule.forChild(Services),
],
})
export class ServicesModule {}
page-services {
.page_background{
background:url('../../assets/imgs/fm_login_bg.png');
background-size: cover;
background-position: center;
}
.f_login_wrapper{
width: 100%;
.list{
.item{
padding:0px;
background: transparent;
border:none !important;
min-height: 40px !important;
.checkbox {
margin-right:9px !important;
}
.label {
color: #787878 !important;
font-size: 17px !important;
font-weight: 400;
padding-left: 10px;
}
.checkbox-checked{
background: #225682 !important;
border:1px solid #225682 !important;
border-radius: 6px !important;
}
.checkbox-icon{
width:18px !important;
height:18px !important;
border-radius: 6px;
border:2px solid #225682 !important;
background: transparent;
}
.checkbox-checked .checkbox-inner{
left:5px !important;
top:2px !important;
border-color: #15b3d5 !important;
}
}
}
p{
color: #656565;
font-size: 18px;
text-align: center;
}
.fm_spacer{
height:40px;
width:100%;
}
}
.edit_list{
padding-bottom: 5px;
.label{
margin: 0px;
padding-top: 3px;
}
p{
margin: 0px;
padding:0px;
text-align: left;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.input{
border: 1px solid #929292;
border-radius:5px;
box-shadow: none;
.text-input{
margin:0px;
height:30px;
text-align: center;
width: 100%;
}
}
button{
height:25px;
width:25px;
float: right;
font-size: 18px;
color: tomato;
padding: 0px;
}
}
.login_btn{
text-transform: capitalize !important;
}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,AlertController } from 'ionic-angular';
import {Validators, FormBuilder, FormGroup, FormControl,FormArray } from '@angular/forms';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';
@IonicPage()
@Component({
selector: 'page-services',
templateUrl: 'services.html',
})
export class Services {
price_val = [];
services_offered:any;
user_data:any;
private priceForm : FormGroup;
constructor(public navCtrl: NavController, public navParams: NavParams, private formBuilder: FormBuilder, public storage: Storage, private myservice: Myservice,private alertCtrl: AlertController) {
this.storage.get('user_data').then((user_data) => {
if(user_data){
this.user_data=user_data
console.log(this.user_data);
this.get_services()
}
})
}
ionViewDidLoad() {
console.log('ionViewDidLoad OfferedPage');
}
back(){
this.navCtrl.pop();
}
timing(){
this.navCtrl.push('TimingPage')
}
add_services(){
this.navCtrl.push('OfferedPage');
}
get_services(){
this.myservice.show_loader();
this.myservice.load_get('get_selected_services/id/'+this.user_data.id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.services_offered = data.result;
this.price_val=data.result;
}
});
}
updatePrice(){
var test_val =false;
console.log(this.services_offered.length);
console.log(this.price_val.length);
Object.keys(this.price_val).forEach((key) => {
console.log(this.price_val[key].price);
console.log(key);
if((this.price_val[key].price !=undefined) && (this.price_val[key].price !='')) {
test_val = true;
}else
test_val =false;
});
if(test_val){
this.myservice.show_loader();
this.myservice.load_post(this.price_val,'updatePrice').subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.navCtrl.push('Selected_services')
}
else{
this.myservice.show_alert("Error", data.message);
}
});
}
}
delete_service(id){
let alert = this.alertCtrl.create({
title: 'Delete Service!',
message: 'Sure you want to delete service?',
buttons: [
{
text: 'Back',
role: 'cancel',
handler: () => {
console.log('no clicked');
}
},
{
text: 'Delete Service',
handler: () => {
this.myservice.show_loader();
this.myservice.load_get('deleteService/id/'+id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.navCtrl.push('Selected_services')
}
else{
this.myservice.show_alert("Error", data.message);
}
});
}
}
]
});
alert.present();
}
updateCheckedOptions(serv:Object, evt) {
var obj = {'price' : evt.target.value};
Object.assign(serv,obj)
if(this.price_val.length >0){
if(this.contains(this.price_val,serv) == false)
this.price_val.push(serv);
}
else
this.price_val[0] = serv;
}
contains(a, obj) {
for (var i = 0; i < a.length; i++) {
if (JSON.stringify(a[i]) === JSON.stringify(obj)) {
return true;
}
}
return false;
}
logForm(form){
var arr=[];
for (var i = 0; i < form.services.length; i++) {
console.log(form.services[i])
arr[i]={ 'garage_id' :this.user_data.id , 'service_id' : form.services[i].id };
}
this.myservice.show_loader();
this.myservice.load_post({arr},'add_services').subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.navCtrl.push('Services')
}
else{
this.myservice.show_alert("Error", data.message);
}
});
}
}
<ion-content class="g_theme">
<div class="g_sign_wrapper">
<button class="g_back" (click)="goBack()"></button>
<div class="g_sign_inner">
<h4>SHOP TIMINGS</h4>
<hr class="g_signup_hr">
<br>
<div class="g_services">
<br>
<ul>
<li>
<div class="g_timing_left">Sunday</div>
<div class="g_timing_right">
<span class="g_timing_div">
<input class="g_timimg_input" placeholder="00:00">
</span>
<span class="g_timimg_to">to</span>
<span class="g_timing_div">
<input class="g_timimg_input" placeholder="00:00">
</span>
</div>
<div class="fm_clear"></div>
</li>
<li>
<div class="g_timing_left">Monday</div>
<div class="g_timing_right">
<span class="g_timing_div">
<input class="g_timimg_input" placeholder="00:00">
</span>
<span class="g_timimg_to">to</span>
<span class="g_timing_div">
<input class="g_timimg_input" placeholder="00:00">
</span>
</div>
<div class="fm_clear"></div>
</li>
<li>
<div class="g_timing_left">Tuesday</div>
<div class="g_timing_right">
<span class="g_timing_div">
<input class="g_timimg_input" placeholder="00:00">
</span>
<span class="g_timimg_to">to</span>
<span class="g_timing_div">
<input class="g_timimg_input" placeholder="00:00">
</span>
</div>
<div class="fm_clear"></div>
</li>
<li>
<div class="g_timing_left">Wednesday</div>
<div class="g_timing_right">
<span class="g_timing_div">
<input class="g_timimg_input" placeholder="00:00">
</span>
<span class="g_timimg_to">to</span>
<span class="g_timing_div">
<input class="g_timimg_input" placeholder="00:00">
</span>
</div>
<div class="fm_clear"></div>
</li>
<li>
<div class="g_timing_left">Thursday</div>
<div class="g_timing_right">
<span class="g_timing_div">
<input class="g_timimg_input" placeholder="00:00">
</span>
<span class="g_timimg_to">to</span>
<span class="g_timing_div">
<input class="g_timimg_input" placeholder="00:00">
</span>
</div>
<div class="fm_clear"></div>
</li>
<li>
<div class="g_timing_left">Friday</div>
<div class="g_timing_right">
<span class="g_timing_div">
<input class="g_timimg_input" placeholder="00:00">
</span>
<span class="g_timimg_to">to</span>
<span class="g_timing_div">
<input class="g_timimg_input" placeholder="00:00">
</span>
</div>
<div class="fm_clear"></div>
</li>
<li>
<div class="g_timing_left">Saturday</div>
<div class="g_timing_right">
<span class="g_timing_div">
<input class="g_timimg_input" placeholder="00:00">
</span>
<span class="g_timimg_to">to</span>
<span class="g_timing_div">
<input class="g_timimg_input" placeholder="00:00">
</span>
</div>
<div class="fm_clear"></div>
</li>
</ul>
</div>
<br>
<br>
<br>
<div class="g_row text_center">
<button class="g_login_btn width100" (click)="specialization()">NEXT</button>
</div>
</div>
</div>
</ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { ShoptimePage } from './shoptime';
@NgModule({
declarations: [
ShoptimePage,
],
imports: [
IonicPageModule.forChild(ShoptimePage),
],
})
export class ShoptimePageModule {}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-shoptime',
templateUrl: 'shoptime.html',
})
export class ShoptimePage {
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad ShoptimePage');
}
goBack(){
this.navCtrl.pop();
}
specialization() {
this.navCtrl.push('SpecializationPage');
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" ion-button (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Registration
</div>
</ion-header>
<ion-content padding class="page_background">
<div class="f_login_wrapper">
<form [formGroup]="signup" (ngSubmit)="signupForm()">
<hr>
<ion-list>
<ion-item>
<ion-input type="text" formControlName="name" placeholder="Name"></ion-input>
</ion-item>
<div class="bmd-field error">
<p class="valid-p" *ngIf="signup.controls.name.hasError('required') && signup.controls.name.touched">Garage name is required!</p>
<p class="valid-p" *ngIf="signup.controls.name.hasError('pattern') && signup.controls.name.touched">Only alphabets are allowed!</p>
</div>
<ion-item>
<ion-input formControlName="email" type="email" placeholder="Email"></ion-input>
</ion-item>
<div class="bmd-field error">
<p class="valid-p" *ngIf="signup.controls.email.hasError('required') && signup.controls.email.touched">Sorry, field email is required!</p>
<p class="valid-p" *ngIf="signup.controls.email.hasError('pattern') && signup.controls.email.touched">Sorry, please enter a valid email address!</p>
</div>
<ion-item>
<ion-input formControlName="mobile" type="number" placeholder="Phone"></ion-input>
</ion-item>
<div class="bmd-field error">
<p class="valid-p" *ngIf="signup.controls.mobile.hasError('required') && signup.controls.mobile.touched">Sorry, field Phone no is required!</p>
<p class="valid-p" *ngIf="signup.controls.mobile.hasError('pattern') && signup.controls.mobile.touched">Sorry, please enter a valid Phone number!</p>
<p class="valid-p" *ngIf="signup.controls.mobile.hasError('minlength') && signup.controls.mobile.touched">Sorry, minimum Phone number length is 8!</p>
<p class="valid-p" *ngIf="signup.controls.mobile.hasError('maxlength') && signup.controls.mobile.touched">Sorry, maximum Phone number length is 20!</p>
</div>
<ion-item>
<input type="text" id="address_signup" (click)="initialize()" formControlName="address" placeholder="Address">
</ion-item>
<div class="bmd-field error">
<p class="valid-p" *ngIf="signup.controls.address.hasError('required') && signup.controls.address.touched">Address is required!</p>
</div>
<ion-item>
<ion-input type="number" formControlName="postal_code" placeholder="Postal Code"></ion-input>
</ion-item>
<div class="bmd-field error">
<p class="valid-p" *ngIf="signup.controls.postal_code.hasError('required') && signup.controls.postal_code.touched">Sorry, field postal code is required!</p>
<p class="valid-p" *ngIf="signup.controls.postal_code.hasError('pattern') && signup.controls.postal_code.touched">Sorry, please enter a valid postal code!</p>
<p class="valid-p" *ngIf="signup.controls.postal_code.hasError('minlength') && signup.controls.postal_code.touched">Sorry, minimum postal code length is 4!</p>
<p class="valid-p" *ngIf="signup.controls.postal_code.hasError('maxlength') && signup.controls.postal_code.touched">Sorry, maximum postal code length is 4!</p>
</div>
<ion-item>
<input type="text" id="locality" formControlName="city" placeholder="City">
</ion-item>
<ion-item>
<ion-label>Category</ion-label>
<ion-select multiple="true" formControlName="category" >
<ion-option *ngFor="let serv of services" [value]="serv.id">{{serv.service}}</ion-option>
</ion-select>
</ion-item>
</ion-list>
<h4>Create Password</h4>
<hr>
<ion-list>
<ion-item>
<ion-input type="password" formControlName="password" placeholder="Password"></ion-input>
</ion-item>
<div class="bmd-field error">
<p class="valid-p" *ngIf="signup.controls.password.hasError('required') && signup.controls.password.touched">Sorry, field password is required!</p>
<p class="valid-p" *ngIf="signup.controls.password.hasError('minlength') && signup.controls.password.touched">Sorry, minimum password length is 6!</p>
</div>
<ion-item>
<ion-input type="password" formControlName="cpassword" placeholder="Confirm Password"></ion-input>
</ion-item>
<div class="bmd-field error">
<p class="valid-p" *ngIf="signup.controls.cpassword.hasError('required') && signup.controls.cpassword.touched">Sorry, field Confirm password is required!</p>
<p class="valid-p" *ngIf="signup.controls.cpassword.invalid && signup.controls.cpassword.touched">Password Mismatch!</p>
<p class="valid-p" *ngIf="signup.controls.cpassword.hasError('minlength') && signup.controls.cpassword.touched">Sorry, minimum Confirm password length is 6!</p>
</div>
</ion-list>
<ion-item>
<ion-label>I Accept <a (click)="agree_terms('terms',$event)" >T & C </a> and <a (click)="agree_terms('privacy',$event)" >Privacy Policy </a></ion-label>
<ion-checkbox formControlName="terms" color="" ></ion-checkbox>
</ion-item>
<div class="fma-field error">
<p class="valid-p" *ngIf="signup.controls.terms.invalid ">Sorry, field is required!</p>
</div>
<br>
<button class="login_btn theme_lblue" ion-button full >SIGNUP</button>
</form>
</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 {
.page_background{
background:url('../../assets/imgs/fm_login_bg.png');
background-size: cover;
background-position: center;
}
.f_login_wrapper{
width: 100%;
.list{
.item{
padding:0px;
background: transparent;
border:none !important;
min-height: 45px !important;
margin-bottom:20px;
.item-inner{
border:2px solid #929292 !important;
border-radius:0px;
.input{
.text-input{
text-align:left !important;
color: #989898;
font-size: 18px;
font-weight: 300;
padding-left: 25px;
width:100%;
margin:0px;
}
}
}
}
.item-input-has-focus{
border:none !important;
}
.input-has-focus{
border:none !important;
}
input{
width:100%;
height:100%;
background:transparent;
border:none;
padding-left:25px;
color: #989898;
font-size: 18px;
font-weight: 300;
}
}
.item-select .label{
padding-left:25px;
}
.item-select .select-icon{
position: relative;
right:20px;
}
p{
color: #656565;
font-size: 18px;
text-align: center;
}
.fm_spacer{
height:40px;
width:100%;
}
h4{
color: #0076ba;
font-size: 18px;
text-transform: capitalize;
}
}
.login_btn{
width: 100%;
}
.checkbox {
margin-right:9px !important;
}
.label {
color: #989898 !important;
font-size: 18px !important;
font-weight: 300;
margin: 0px;
}
.checkbox-md .checkbox-checked{
background: #1d527f !important;
border:1px solid #1d527f !important;
}
.checkbox-icon{
width:20px !important;
height:20px !important;
}
.checkbox-checked .checkbox-inner{
left:6px !important;
top:3px !important;
}
.item{
padding-left: 0px;
}
.error p{ color: #a94442 !important;}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,Events, ModalController } from 'ionic-angular';
import {Validators, FormBuilder, FormGroup, FormControl, AbstractControl } from '@angular/forms';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';
declare var require: any;
declare var google: any;
@IonicPage()
@Component({
selector: 'page-signup',
templateUrl: 'signup.html',
})
export class SignupPage {
services:any;
location:any;
citie: any;
coun: any;
signup: any;
terms_service: any;
address: any;
componentForm: any;
constructor(public navCtrl: NavController, public navParams: NavParams,public storage:Storage, private myservice: Myservice, private formBuilder: FormBuilder, public events: Events,public modalCtrl: ModalController) {
this.getServices();
this.get_terms()
this.signup = this.formBuilder.group({
email: ['', Validators.compose([Validators.pattern("^[_A-Za-z0-9-\\+]+(\\.[_A-Za-z0-9-]+)*@[A-Za-z0-9-]+(\\.[A-Za-z0-9]+)*(\\.[A-Za-z]{2,})$"), Validators.required])],
password: ['', Validators.compose([Validators.required, Validators.minLength(6)])],
name: ['', Validators.compose([ Validators.pattern('^[A-Za-z]+( [A-Za-z]+)*$'), Validators.required])],
city: ['',],
postal_code: ['',Validators.compose([Validators.required, Validators.minLength(4), Validators.maxLength(4)])],
address: ['', Validators.required],
category: [''],
cpassword: ['', Validators.compose([Validators.required, Validators.minLength(6)])],
mobile: ['', Validators.compose([Validators.required, Validators.minLength(8), Validators.maxLength(20)])],
terms: [ 'false',Validators.requiredTrue],
}, {
validator: this.Match('password', 'cpassword')
});
this.componentForm = {
locality: 'long_name'
};
}
ionViewDidLoad() {
console.log('ionViewDidLoad SignupPg');
}
back(){
this.navCtrl.pop();
}
otp()
{
this.navCtrl.push('OtpPag');
}
getServices(){
this.myservice.show_loader();
this.myservice.load_get("getServices").subscribe(response => {
this.myservice.hide_loader();
console.log(response);
if(response.status == "success") {
this.services = response.data;
//this.myservice.show_alert("success!", response.message);
}
else {
}
})
}
signupForm(){
if(this.signup.valid)
{
this.myservice.show_loader();
this.signup.controls['city'].setValue(this.citie);
this.signup.controls['address'].setValue(this.address);
var obj = Object.assign(this.signup.value, this.location);
this.myservice.load_post(this.signup.value, "signup").subscribe(response => {
this.myservice.hide_loader();
console.log(response);
if(response.status == "success") {
this.myservice.show_alert("success!", response.message);
this.navCtrl.setRoot('LoginPage');
}
else {
this.myservice.show_alert("Error!", response.message);
}
})
}
else{ // Form is not valid
this.markFormGroupTouched(this.signup); // function to mark fields as touched
}
}
emailValidator(control: FormControl): {[s: string]: boolean} {
if (!(control.value.toLowerCase().match('^[a-z0-9.]+( \ [_a-z0-9]+)*@[a-z0-9-]+(\.[a-z0-9-]+)\\.(\.[a-z0-9-]{1,15})$'))) {
return {invalidEmail: true};
}
}
Match(firstControlName, secondControlName) {
return (AC: AbstractControl) => {
let firstControlValue = AC.get(firstControlName).value; // to get value in input tag
let secondControlValue = AC.get(secondControlName).value; // to get value in input tag
if (firstControlValue != secondControlValue) {
AC.get(secondControlName).setErrors({mismatch: true});
console.log(false);
} else {
console.log(true);
return null
}
};
}
initialize() {
console.log("initialize")
var addressType='address_signup';
var input = document.getElementById('address_signup');
/* var options = {
types: ['(cities)']
}; */
var autocomplete = new google.maps.places.Autocomplete(input);
let thiss = this;
google.maps.event.addListener(autocomplete, 'place_changed', function () {
var place = autocomplete.getPlace();
console.log(place.address_components);
for (var i = 0; i < place.address_components.length; i++) {
addressType = place.address_components[i].types[0];
console.log(addressType);
if (thiss.componentForm[addressType]) {
console.log(thiss.componentForm[addressType]);
var val = place.address_components[i][thiss.componentForm[addressType]];
// document.getElementById(addressType).value = val;
console.log(val);
(document.getElementById(addressType) as HTMLInputElement).value= val;
if(addressType=='locality'){ thiss.citie = place.address_components[i][thiss.componentForm['locality']]; }
}
}
thiss.address = place.formatted_address;
// thiss.signup.controls['address_signup'].setValue(place.formatted_address);
var latLong = autocomplete.getPlace().geometry.location;
var js=JSON.stringify(latLong);
var par=JSON.parse(js);
thiss.location = {lat : par.lat, lng : par.lng};
/*
thiss.address = place.formatted_address;
console.log(placeA.formatted_address);
var latLong = autocomplete.getPlace().geometry.location;
var js=JSON.stringify(latLong);
var par=JSON.parse(js);
thiss.location = {lat : par.lat, lng : par.lng};
*/
//document.getElementById('driver_lat').value=par.lat;
//document.getElementById('driver_lng').value=par.lng;
// document.getElementById('pickup_lat').value=par.lat;
// document.getElementById('pickup_lng').value=par.lng;
});
}
private markFormGroupTouched(formGroup: FormGroup) {
(<any>Object).values(formGroup.controls).forEach(control => {
control.markAsTouched();
if (control.controls) {
control.controls.forEach(c => this.markFormGroupTouched(c));
}
});
}
get_terms(){
//this.myservice.show_loader();
this.myservice.load_get('get_terms').subscribe(data => {
//this.myservice.hide_loader();
if(data.status == 'success'){
console.log(data.result);
this.terms_service = data.result
}
});
}
agree_terms(pg,evt){
evt.stopPropagation();
let termsModal = this.modalCtrl.create('TermsPage',{'data' :this.terms_service,'page' : pg} );
termsModal.present();
}
}
<<ion-content class="g_theme">
<div class="g_sign_wrapper">
<button class="g_back" (click)="goBack()"></button>
<div class="g_sign_inner">
<h4>SPECIALIZED IN:</h4>
<hr class="g_signup_hr">
<br>
<div class="g_services">
<br>
<h5>Select make</h5>
<ul>
<br>
<li>
<select class="g_make">
<option>Make</option>
</select>
</li>
<li>
<div class="g_another">
<img src="assets/icon/g_add.png">
<span>Add another</span>
</div>
</li>
</ul>
</div>
<br>
<br>
<br>
<div class="g_row text_center">
<button class="g_login_btn width100" (click)="home()">CONTINUE</button>
</div>
</div>
</div>
</ion-content>
\ No newline at end of file
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { SpecializationPage } from './specialization';
@NgModule({
declarations: [
SpecializationPage,
],
imports: [
IonicPageModule.forChild(SpecializationPage),
],
})
export class SpecializationPageModule {}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-specialization',
templateUrl: 'specialization.html',
})
export class SpecializationPage {
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad SpecializationPage');
}
goBack(){
this.navCtrl.pop();
}
home() {
this.navCtrl.push('HomePage');
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" ion-button (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
</div>
</ion-header>
<ion-content padding class="page_background">
<div class="f_login_wrapper">
<h4>Specialized in</h4>
<hr>
<div class="f_specialized">
<h6>Select Make</h6>
<ion-item>
<ion-select [(ngModel)]="Make">
<ion-option value="Ford">Ford</ion-option>
<ion-option value="Suzuki">Suzuki</ion-option>
<ion-option value="Toyota">Toyota</ion-option>
<ion-option value="Porche">Porche</ion-option>
<ion-option value="Volkwagen">Volkwagen</ion-option>
</ion-select>
</ion-item>
<ion-item>
<button class="f_add_btn floatLeft">+</button>
<p class="floatLeft">Add Another</p>
<div class="clear"></div>
</ion-item>
</div>
</div>
</ion-content>
<ion-footer padding>
<button class="fm_login_btn" ion-button full (click)="list()">CONTINUE</button>
</ion-footer>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { SpecializedPage } from './specialized';
@NgModule({
declarations: [
SpecializedPage,
],
imports: [
IonicPageModule.forChild(SpecializedPage),
],
})
export class SpecializedPageModule {}
page-specialized {
.page_background{
background:url('../../assets/imgs/fm_login_bg.png');
background-size: cover;
background-position: center;
}
.f_login_wrapper{
width: 100%;
padding-top: 30px;
h4{
color: #07426a;
font-weight: 600;
letter-spacing: 1px;
text-align: left;
font-size: 18px;
text-transform: uppercase;
}
hr{
border:2px solid #f6921e;
width:60px;
height:0px;
margin-left:0;
margin-bottom:20px;
}
.f_specialized{
h6{
margin:0px;
padding: 0px;
color: #686868;
padding-bottom: 15px;
padding-top: 10px;
}
.item{
padding:0px;
.select {
padding:0px;
min-width: 100% !important;
border:2px solid #15b3d5 !important;
border-radius:30px;
height: 40px;
padding: 7px;
padding-left: 20px;
background:url('../../assets/imgs/fm_drop_down.png');
background-position: right 15px top 10px;
background-repeat: no-repeat;
background-size: 15px;
color: #7b7b7b;
font-weight: 400;
letter-spacing: 2px;
margin-bottom: 15px;
.select-icon{
display: none;
}
}
}
}
.fm_signup_btn{
color: #1d527f;
background:transparent;
font-weight: 500;
height:40px;
border-radius: 30px;
font-size:18px;
text-transform: capitalize;
border:2px solid #f6921e;
}
p{
color: #656565;
font-size: 18px;
text-align: center;
padding: 8px;
padding-left: 20px;
}
.fm_spacer{
height:40px;
width:100%;
}
}
}
.fm_login_btn{
color: #fff;
background: #1d527f;
font-weight: 300;
height:40px;
border-radius: 30px;
font-size:20px;
}
.alert-head{display:none;}
.alert-button{color:#1d527f !important; }
.f_add_btn{width:40px;height:40px;border-radius: 50%;border:2px solid #164e73;color: #164e73;background: transparent;font-size: 25px;}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-specialized',
templateUrl: 'specialized.html',
})
export class SpecializedPage {
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad SpecializedPage');
}
back(){
this.navCtrl.pop();
}
list(){
this.navCtrl.push('ListVehiclePage')
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" ion-button (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Success
</div>
</ion-header>
<ion-content padding>
<div class="success_div">
<img src="assets/img/succcess.png">
<h5>Quote provided successfully!</h5>
<p>
Please give up some time for customer to decide for a quote. If customer accepts your offer you will see this under, 'My Bookings'.
</p>
<p(click)="go_home()" ><a>Go to home</a></p>
</div>
</ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { SuccessPage } from './success';
@NgModule({
declarations: [
SuccessPage,
],
imports: [
IonicPageModule.forChild(SuccessPage),
],
})
export class SuccessPageModule {}
page-success {
.success_div{
text-align: center;
img{
width: 130px;
margin-top: 30px;
margin-bottom: 30px;
}
h5{
text-align: center;
color: #0076ba;
font-size: 20px;
padding-bottom: 10px;
}
p{
text-align: center;
color: #000;
font-size: 18px;
line-height: 25px;
font-weight: 600;
a{
color: #000;
font-weight: 400;
}
}
}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
/**
* Generated class for the SuccessPage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/
@IonicPage()
@Component({
selector: 'page-success',
templateUrl: 'success.html',
})
export class SuccessPage {
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad SuccessPage');
}
go_home(){
this.navCtrl.setRoot('Booking')
}
}
<!--
Generated template for the TermsPage page.
See http://ionicframework.com/docs/components/#navigation for more info on
Ionic pages and navigation.
-->
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" ion-button (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft" *ngIf="title" >
{{title}}
</div>
</ion-header>
<ion-content padding>
<div [innerHTML]="htmlStr"></div>
</ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { TermsPage } from './terms';
@NgModule({
declarations: [
TermsPage,
],
imports: [
IonicPageModule.forChild(TermsPage),
],
})
export class TermsPageModule {}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
/**
* Generated class for the TermsPage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/
@IonicPage()
@Component({
selector: 'page-terms',
templateUrl: 'terms.html',
})
export class TermsPage {
htmlStr: string;
title: any;
data: any;
constructor(public navCtrl: NavController, public navParams: NavParams) {
this.data = this.navParams.get('data')
var page = this.navParams.get('page')
console.log(this.data)
if(page == 'terms'){
this.title = 'T&C'
this.htmlStr= this.data.terms_conditions;
}
else if(page == 'privacy'){
this.title = 'Privacy Policy'
this.htmlStr= this.data.privacy_policy;
}
else if(page == 'impressum'){
this.title = 'Impressum'
this.htmlStr= this.data.impressum;
}
}
ionViewDidLoad() {
console.log('ionViewDidLoad TermsPag');
}
back(){
this.navCtrl.pop();
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" ion-button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Edit Schedule
</div>
</ion-header>
<ion-content padding class="">
<ion-segment [(ngModel)]="icons" >
<ion-segment-button value="camera">
Shop timing
</ion-segment-button>
<ion-segment-button value="bookmark">
Break timing
</ion-segment-button>
</ion-segment>
<form (ngSubmit)="SaveSchedule()" >
<div [ngSwitch]="icons">
<div class="f_login_wrapper" *ngSwitchCase="'camera'" >
<div class="f_timing" *ngIf="schedule" >
<ion-grid>
<ion-row>
<ion-col col-4>
<p>Sunday</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="start_sun" [(ngModel)]="schedule.start_sun" (ngModelChange)="date_fetch($event,'sun','start','visit')" ></ion-datetime>
</ion-col>
<ion-col col-2>
<p class="textCenter">to</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="end_sun" [(ngModel)]="schedule.end_sun" (ngModelChange)="date_fetch($event,'sun','end','visit')" ></ion-datetime>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-4>
<p>Monday</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="start_mon" [(ngModel)]="schedule.start_mon" (ngModelChange)="date_fetch($event,'mon','start','visit')" ></ion-datetime>
</ion-col>
<ion-col col-2>
<p class="textCenter">to</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="end_mon" [(ngModel)]="schedule.end_mon" (ngModelChange)="date_fetch($event,'mon','end','visit')" ></ion-datetime>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-4>
<p>Tuesday</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="start_tue" [(ngModel)]="schedule.start_tue" (ngModelChange)="date_fetch($event,'tue','start','visit')" ></ion-datetime>
</ion-col>
<ion-col col-2>
<p class="textCenter">to</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="end_tue" [(ngModel)]="schedule.end_tue" (ngModelChange)="date_fetch($event,'tue','end','visit')" ></ion-datetime>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-4>
<p>Wednesday</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="start_wed" [(ngModel)]="schedule.start_wed" (ngModelChange)="date_fetch($event,'wed','start','visit')" ></ion-datetime>
</ion-col>
<ion-col col-2>
<p class="textCenter">to</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="end_wed" [(ngModel)]="schedule.end_wed" (ngModelChange)="date_fetch($event,'wed','end','visit')" ></ion-datetime>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-4>
<p>Thursday</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="start_thu" [(ngModel)]="schedule.start_thu" (ngModelChange)="date_fetch($event,'thu','start','visit')" ></ion-datetime>
</ion-col>
<ion-col col-2>
<p class="textCenter">to</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="end_thu" [(ngModel)]="schedule.end_thu" (ngModelChange)="date_fetch($event,'thu','end','visit')" ></ion-datetime>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-4>
<p>Friday</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="start_fri" [(ngModel)]="schedule.start_fri" (ngModelChange)="date_fetch($event,'fri','start','visit')" ></ion-datetime>
</ion-col>
<ion-col col-2>
<p class="textCenter">to</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="end_fri" [(ngModel)]="schedule.end_fri" (ngModelChange)="date_fetch($event,'fri','end','visit')" ></ion-datetime>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-4>
<p>Saturday</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="start_sat" [(ngModel)]="schedule.start_sat" (ngModelChange)="date_fetch($event,'sat','start','visit')" ></ion-datetime>
</ion-col>
<ion-col col-2>
<p class="textCenter">to</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="end_sat" [(ngModel)]="schedule.end_sat" (ngModelChange)="date_fetch($event,'sat','end','visit')" ></ion-datetime>
</ion-col>
</ion-row>
</ion-grid>
</div>
</div>
</div>
<div [ngSwitch]="icons">
<div class="f_login_wrapper" *ngSwitchCase="'bookmark'" >
<div class="f_timing">
<ion-grid>
<ion-row>
<ion-col col-4>
<p>Sunday</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="start_break_sun" [(ngModel)]="schedule.start_break_sun" (ngModelChange)="date_fetch($event,'sun','start','break')" ></ion-datetime>
</ion-col>
<ion-col col-2>
<p class="textCenter">to</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="end_break_sun" [(ngModel)]="schedule.end_break_sun" (ngModelChange)="date_fetch($event,'sun','end','break')" ></ion-datetime>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-4>
<p>Monday</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="start_break_mon" [(ngModel)]="schedule.start_break_mon" (ngModelChange)="date_fetch($event,'mon','start','break')" ></ion-datetime>
</ion-col>
<ion-col col-2>
<p class="textCenter">to</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="end_break_mon" [(ngModel)]="schedule.end_break_mon" (ngModelChange)="date_fetch($event,'mon','end','break')"></ion-datetime>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-4>
<p>Tuesday</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="start_break_tue" [(ngModel)]="schedule.start_break_tue" (ngModelChange)="date_fetch($event,'tue','start','break')" ></ion-datetime>
</ion-col>
<ion-col col-2>
<p class="textCenter">to</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="end_break_tue" [(ngModel)]="schedule.end_break_tue" (ngModelChange)="date_fetch($event,'tue','end','break')" ></ion-datetime>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-4>
<p>Wednesday</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="start_break_wed" [(ngModel)]="schedule.start_break_wed" (ngModelChange)="date_fetch($event,'wed','start','break')" ></ion-datetime>
</ion-col>
<ion-col col-2>
<p class="textCenter">to</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="end_break_wed" [(ngModel)]="schedule.end_break_wed" (ngModelChange)="date_fetch($event,'wed','end','break')" ></ion-datetime>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-4>
<p>Thursday</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="start_break_thu" [(ngModel)]="schedule.start_break_thu" (ngModelChange)="date_fetch($event,'thu','start','break')" ></ion-datetime>
</ion-col>
<ion-col col-2>
<p class="textCenter">to</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="end_break_thu" [(ngModel)]="schedule.end_break_thu" (ngModelChange)="date_fetch($event,'thu','end','break')" ></ion-datetime>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-4>
<p>Friday</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="start_break_fri" [(ngModel)]="schedule.start_break_fri" (ngModelChange)="date_fetch($event,'fri','start','break')" ></ion-datetime>
</ion-col>
<ion-col col-2>
<p class="textCenter">to</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="end_break_fri" [(ngModel)]="schedule.end_break_fri" (ngModelChange)="date_fetch($event,'fri','end','break')" ></ion-datetime>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-4>
<p>Saturday</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="start_break_sat" [(ngModel)]="schedule.start_break_sat" (ngModelChange)="date_fetch($event,'sat','start','break')" ></ion-datetime>
</ion-col>
<ion-col col-2>
<p class="textCenter">to</p>
</ion-col>
<ion-col col-3>
<ion-datetime displayFormat="HH:mm" name="end_break_sat" [(ngModel)]="schedule.end_break_sat" (ngModelChange)="date_fetch($event,'sat','end','break')" ></ion-datetime>
</ion-col>
</ion-row>
</ion-grid>
</div>
</div>
</div>
<button class="login_btn widthFull theme_lblue" ion-button full>Save</button>
</form>
</ion-content>
<ion-footer padding>
</ion-footer>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { TimingPage } from './timing';
@NgModule({
declarations: [
TimingPage,
],
imports: [
IonicPageModule.forChild(TimingPage),
],
})
export class TimingPageModule {}
page-timing {
.page_background{
background:url('../../assets/imgs/fm_login_bg.png');
background-size: cover;
background-position: center;
}.segment{
width: 70%;
.segment-button{
text-align:left;
color: #787878;
font-weight:400;
font-size: 18px;
padding-left: 0px;
text-transform: capitalize;
border-bottom: 3px solid transparent;
}
.segment-activated{
border-bottom: 3px solid #f6921e !important;
color: #07426a;
font-weight:600;
}
}
.f_login_wrapper{
width: 100%;
padding-top: 30px;
h4{
color: #07426a;
font-weight: 600;
letter-spacing: 1px;
text-align: left;
font-size: 18px;
text-transform: uppercase;
}
hr{
border:2px solid #f6921e;
width:60px;
height:0px;
margin-left:0;
margin-bottom:20px;
}
.f_timing{
padding-top: 30px;
.grid{
padding: 0px;
.row{
padding-bottom: 15px;
.col{
padding: 0px;
p{
margin:0px;
padding: 2px;
color: #787878;
text-align: left;
font-size: 15px;
}
.datetime {
border:1px solid #929292;
border-radius: 0px;
padding: 3px !important;
text-align: center;
color: #7b7b7b;
.datetime-text{
position: relative;
top:2px;
}
}
}
}
}
}
.fm_signup_btn{
color: #1d527f;
background:transparent;
font-weight: 500;
height:40px;
border-radius: 30px;
font-size:18px;
text-transform: capitalize;
border:2px solid #f6921e;
}
p{
color: #656565;
font-size: 18px;
text-align: center;
}
.fm_spacer{
height:40px;
width:100%;
}
}
}
.fm_login_btn{
color: #fff;
background: #1d527f;
font-weight: 300;
height:40px;
border-radius: 30px;
font-size:20px;
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';
@IonicPage()
@Component({
selector: 'page-timing',
templateUrl: 'timing.html',
})
export class TimingPage {
schedule ={'start_sun' :'','start_mon' :'','start_tue' :'','start_wed' :'','start_thu' :'','start_fri' :'','start_sat' :'',
'end_sun' :'','end_mon' :'','end_tue' :'','end_wed' :'','end_thu' :'','end_fri' :'','end_sat' :'',
'start_break_sun' :'','start_break_mon' :'','start_break_tue' :'','start_break_wed' :'','start_break_thu' :'','start_break_fri' :'','start_break_sat' :'',
'end_break_sun' :'','end_break_mon' :'','end_break_tue' :'','end_break_wed' :'','end_break_thu' :'','end_break_fri' :'','end_break_sat' :''
};
break ={};
schedule_value ={};
val_schedule ={};
test_values ={};
obj ={};
visit_array =[];
user_data:any;
icons:any;
constructor(public navCtrl: NavController, public navParams: NavParams,public storage:Storage, private myservice: Myservice) {
this.storage.get('user_data').then((user_data) => {
if(user_data){
this.user_data=user_data
console.log(this.user_data);
this.get_profile();
}
})
this.icons = 'camera';
this.schedule_value={"sun":{"visit":{"start":"" ,"end":"" },"break":{"start":"" , "end":""}}, "mon":{"visit":{
"start":"" , "end":""},"break":{"start":"","end":""}},
"tue":{"visit":{"start":"","end":""},"break":{"start":"","end":""}},
"wed":{"visit":{"start":"","end":""}, "break":{"start":"","end":""}},
"thu":{"visit":{"start":"","end":""},"break":{"start":"","end":""}},
"fri":{"visit":{"start":"","end":""},"break":{"start":"","end":""}},
"sat":{"visit":{"start":"","end":""}, "break":{"start":"","end":""}}};
this.test_values={"sun":{"visit":{"start":"" ,"end":"" },"break":{"start":"" , "end":""}}, "mon":{"visit":{
"start":"" , "end":""},"break":{"start":"","end":""}},
"tue":{"visit":{"start":"","end":""},"break":{"start":"","end":""}},
"wed":{"visit":{"start":"","end":""}, "break":{"start":"","end":""}},
"thu":{"visit":{"start":"","end":""},"break":{"start":"","end":""}},
"fri":{"visit":{"start":"","end":""},"break":{"start":"","end":""}},
"sat":{"visit":{"start":"","end":""}, "break":{"start":"","end":""}}};
}
ionViewDidLoad() {
console.log('ionViewDidLoad TimingPage');
}
back(){
this.navCtrl.pop();
}
specialize()
{
this.navCtrl.push('SpecializedPage');
}
SaveSchedule(){
var test_val =false;
let empty_val = '{"start":"","end":""}';
if(Object.keys(this.val_schedule).length > 0){
Object.keys(this.schedule_value).forEach((key) => {
if(JSON.stringify(this.schedule_value[key].break) == empty_val) {
this.schedule_value[key].break = this.val_schedule[key].break;
}
if(JSON.stringify(this.schedule_value[key].visit) == empty_val) {
this.schedule_value[key].visit = this.val_schedule[key].visit;
}
});
}
Object.keys(this.schedule_value).forEach((key) => {
if(!test_val){
console.log(JSON.stringify(this.schedule_value[key].visit));
console.log(key);
if(JSON.stringify(this.schedule_value[key].visit) == empty_val) {
}else{
test_val = true;
}
}
});
console.log("length" , test_val);
console.log(this.schedule_value);
var myJSON = JSON.stringify(this.schedule_value);
if(test_val){
this.myservice.show_loader();
this.myservice.load_post({'timing' :myJSON , 'id':this.user_data.id},"save_schedule").subscribe(response => {
this.myservice.hide_loader();
if(response.status == "error") {
this.myservice.show_alert("error!", response.message);
}
else {
this.myservice.show_alert("success!", response.message);
this.navCtrl.push('ListVehiclePage');
}
})
}
else{
this.myservice.show_alert("error!", "Please fill atleast one value");
}
}
get_profile(){
this.myservice.show_loader();
this.myservice.load_get('get_profile/id/'+this.user_data.id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
var res = data.data;
console.log(res);
if(res.schedule){
this.val_schedule =res.schedule;
let empty_val = '{"start":"","end":""}';
if(Object.keys(res.schedule).length > 0){
Object.keys(this.schedule_value).forEach((key) => {
if(JSON.stringify(this.schedule_value[key].break) == empty_val) {
this.schedule_value[key].break = res.schedule[key].break;
}
if(JSON.stringify(this.schedule_value[key].visit) == empty_val) {
this.schedule_value[key].visit = res.schedule[key].visit;
}
});
}
this.schedule.start_sun=this.val_schedule['sun'].visit.start;
this.schedule.start_mon=this.val_schedule['mon'].visit.start;
this.schedule.start_tue=this.val_schedule['tue'].visit.start;
this.schedule.start_wed=this.val_schedule['wed'].visit.start;
this.schedule.start_thu=this.val_schedule['thu'].visit.start;
this.schedule.start_fri=this.val_schedule['fri'].visit.start;
this.schedule.start_sat=this.val_schedule['sat'].visit.start;
this.schedule.end_sun=this.val_schedule['sun'].visit.end;
this.schedule.end_mon=this.val_schedule['mon'].visit.end;
this.schedule.end_tue=this.val_schedule['tue'].visit.end;
this.schedule.end_wed=this.val_schedule['wed'].visit.end;
this.schedule.end_thu=this.val_schedule['thu'].visit.end;
this.schedule.end_fri=this.val_schedule['fri'].visit.end;
this.schedule.end_sat=this.val_schedule['sat'].visit.end;
this.schedule.start_break_sun=this.val_schedule['sun'].break.start;
this.schedule.start_break_mon=this.val_schedule['mon'].break.start;
this.schedule.start_break_tue=this.val_schedule['tue'].break.start;
this.schedule.start_break_wed=this.val_schedule['wed'].break.start;
this.schedule.start_break_thu=this.val_schedule['thu'].break.start;
this.schedule.start_break_fri=this.val_schedule['fri'].break.start;
this.schedule.start_break_sat=this.val_schedule['sat'].break.start;
this.schedule.end_break_sun=this.val_schedule['sun'].break.end;
this.schedule.end_break_mon=this.val_schedule['mon'].break.end;
this.schedule.end_break_tue=this.val_schedule['tue'].break.end;
this.schedule.end_break_wed=this.val_schedule['wed'].break.end;
this.schedule.end_break_thu=this.val_schedule['thu'].break.end;
this.schedule.end_break_fri=this.val_schedule['fri'].break.end;
this.schedule.end_break_sat=this.val_schedule['sat'].break.end;
}else{
this.schedule ={'start_sun' :'','start_mon' :'','start_tue' :'','start_wed' :'','start_thu' :'','start_fri' :'','start_sat' :'',
'end_sun' :'','end_mon' :'','end_tue' :'','end_wed' :'','end_thu' :'','end_fri' :'','end_sat' :'',
'start_break_sun' :'','start_break_mon' :'','start_break_tue' :'','start_break_wed' :'','start_break_thu' :'','start_break_fri' :'','start_break_sat' :'',
'end_break_sun' :'','end_break_mon' :'','end_break_tue' :'','end_break_wed' :'','end_break_thu' :'','end_break_fri' :'','end_break_sat' :''
}
}
}
});
}
date_fetch(evt,day,type,types){
console.log("day", day)
console.log("evt", evt)
console.log("type", type)
console.log("types", types)
/* if(Object.keys(this.obj).length >0){
console.log("ffg");
if(type in this.obj[type]){
Object.assign( this.obj ,{ [type]: evt} );
}
}else{
this.obj ={[type]:evt}
}
console.log("obj" ,this.obj)
*/
console.log( this.schedule_value[day][types][type]);
var obj = {};
if(this.schedule_value[day][types][type]!=''){
console.log("in");
obj = this.schedule_value[day][types]
Object.assign( obj ,{ [type] : evt} );
}
else{
console.log("else");
obj = {[type]:evt};
}
if(day in this.schedule_value){
if(types== 'visit' || this.schedule_value[day].visit.start!= '' || this.schedule_value[day].visit.end!= '')
Object.assign( this.schedule_value[day] ,{ [types] : obj} );
else{
var start_val = "start_break_"+day;
var end_val = "end_break_"+day;
this.schedule[start_val]= null
this.schedule[end_val]= null
this.myservice.show_alert("Warning", "Please add Visit Timing First" );
}
}
else {
if(types== 'visit')
Object.assign( this.schedule_value,{ [ day] : {[types] : obj} } );
else{
var start_val = "start_break_"+day;
var end_val = "end_break_"+day;
this.schedule[start_val]= null
this.schedule[end_val]= null
this.myservice.show_alert("Warning", "Please add Visit Timing First" );
}
}
console.log( this.schedule_value);
}
/*
if(day in this.schedule_value){
if(types== 'visit' || this.schedule_value[day].visit.start!= '' || this.schedule_value[day].visit.end!= ''){
if(this.obj)
Object.assign( this.schedule_value[day] ,{ [types] : this.obj} );
}
}
else {
if(types== 'visit'){
Object.assign( this.schedule_value,{ [day] : {[types] : this.obj} } );
}
} */
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" *ngIf="from_push" ion-button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<button class="nav_btn floatLeft" *ngIf="!from_push" ion-button (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Request Overview
</div>
</ion-header>
<ion-content padding>
<div class="fm_vehicle_detail" *ngIf="request_val" >
<div class="fm_quote_received">
Request For : <strong>{{request_val.work_name}}</strong>
</div>
<div class="fm_vehicle_banner">
<div class="fm_vehicle_photo"> <img *ngIf="request_val.profile_pic" [src]="request_val.profile_pic" ></div>
<div class="fm_vehicle_detail">
<h4>{{request_val.first_name}} {{request_val.last_name}}</h4>
<!-- <p>Mustang 2017</p> -->
</div>
<div class="clear"></div>
</div>
<div class="fm_vehicle_bottom">
<p>Customer Request:</p>
<h4>{{request_val.message}}</h4>
<!-- <p>Service Name:</p>
<h4>{{request_val.work_name}}</h4>
<p>Repair Description:</p>
<h4>{{request_val.message}}</h4>
<br>
<p>Existing quote photos</p>
<div class="fm_gallery">
<li></li>
<li></li>
<div class="clear"></div>
</div> -->
<p>Added Picture of 57a-Protocol:</p>
<div class="fm_gallery">
<li *ngFor="let images of request_val.pool_images" (click)="view_img(images.image)" > <img [src]="images.image" ></li>
</div>
</div>
</div>
</ion-content>
<ion-footer class="textCenter" padding>
<button class="login_btn widthFull theme_lblue" ion-button (click)="quote()">Provide Quote</button>
</ion-footer>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { VehicleDetailPage } from './vehicle-detail';
@NgModule({
declarations: [
VehicleDetailPage,
],
imports: [
IonicPageModule.forChild(VehicleDetailPage),
],
})
export class VehicleDetailPageModule {}
page-vehicle-detail {
.fm_vehicle_detail{
width: 100%;
.fm_quote_received{
color: #0076ba;
padding: 10px;
border-radius: 0px;
padding-left: 0px;
padding-right: 0px;
font-size: 18px;
font-weight:500;
padding-bottom: 20px;
text-align: center;
strong{
color: #1DB100;
padding-left: 10px;
}
}
.fm_vehicle_banner{
width: 100%;
padding-top: 10px;
border-top:1px solid #bfbfbf;
border-bottom:1px solid #bfbfbf;
padding-bottom: 10px;
.fm_vehicle_photo{
width:80px;
height:80px;
border-radius: 50%;
border-radius: 50%;
background: #f3f3f3;
float: left;
img{
width:100%;
height:100%;
border-radius: 50%;
object-fit: cover;
object-position: center;
}
}
.fm_vehicle_detail{
float: left;
width:calc(100% - 100px);
padding: 25px;
h4{
margin:0px;
padding:0px;
color: #07426a;
font-size: 20px;
}
p{
margin:0px;
padding:0px;
color: #5c5c5c;
}
}
}
.fm_vehicle_bottom{
width: 100%;
p{
color: #0076ba;
margin-bottom: 0px;
font-weight: 600;
font-size: 16px;
}
h4{
color: #7b7b7b;
margin:0px;
font-weight: 400;
font-size: 18px;
padding-top: 8px;
}
.fm_gallery{
width: 100%;
padding-top: 10px;
padding-bottom: 20px;
li{
width: calc(100% - 51%);
height: 100px;
background: #a8a8a8;
list-style: none;
display:inline-block;
img{
width:100%;
height:100%;
object-fit: cover;
object-position: center;
}
}
}
}
}
.login_btn{
text-transform: capitalize !important;
}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,Events } from 'ionic-angular';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';
import { PhotoViewer } from '@ionic-native/photo-viewer';
@IonicPage()
@Component({
selector: 'page-vehicle-detail',
templateUrl: 'vehicle-detail.html',
})
export class VehicleDetailPage {
pool_id:any;
request_val:any;
from_push:any = false;
constructor(public navCtrl: NavController, public navParams: NavParams,public storage:Storage, private myservice: Myservice,public events:Events,private photoViewer: PhotoViewer) {
this.pool_id = this.navParams.get('pool_id');
this.from_push = this.navParams.get('from_push');
if(this.pool_id){
this.getSingleQuote();
this.update_read_status();
}
}
ionViewDidLoad() {
console.log('ionViewDidLoad VehicleDetailPage');
}
back(){
this.navCtrl.pop();
}
quote(){
this.navCtrl.push('QuotePage',{'pool_id' :this.pool_id});
}
getSingleQuote(){
this.myservice.show_loader();
this.myservice.load_get('getSingleQuote/id/'+this.pool_id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.request_val = data.result;
}
});
}
view_img(url){
this.photoViewer.show(url);
}
update_read_status(){
this.myservice.show_loader();
this.myservice.load_get('update_read_status/id/'+this.pool_id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.events.publish('user:read_stat', '');
//this.events.publish('user:notifications', this.user_data.id);
console.log(data);
}
});
}
}
<ion-header class="nav_header theme_primary">
<button class="nav_btn floatLeft" ion-button>
<ion-icon name="ios-menu" menuToggle></ion-icon>
</button>
<div class="nav_header_title floatLeft">
Offers
</div>
</ion-header>
<ion-content padding class="">
<div class="fm_list">
<div class="fm_list_tab">
<!--- <ul>
<li [ngClass]="{'active' : slidertab == 0}" (click)="goToSlide(0)">OPEN</li>
<li [ngClass]="{'active' : slidertab == 1}" (click)="goToSlide(1)">ACTIVE</li>
<li [ngClass]="{'active' : slidertab == 2}" (click)="goToSlide(2)">COMPLETED</li>
<div class="clear"></div>
</ul> -->
<ion-slides pager="false" #mySlider class="fm_slide" (ionSlideDidChange)="slideChanged()">
<ion-slide class="theme_secondary">
<button ion-button (click)="addOffers()" class="add_offer theme_lblue floatRight">Add Offer</button>
<div class="clear"></div>
<ion-list>
<ion-item *ngFor="let list_request of request_list" (click)="edit_offers(list_request.id)">
<div class="left_image">
<img *ngIf="list_request.img" [src]="list_request.img" >
<img *ngIf="!list_request.img" src="assets/img/offers_dummy.png" >
</div>
<div class="right_details">
<h4>{{list_request.service}}</h4>
<div class="row">
<p><span class="discount">-{{list_request.discount}}%</span></p>
</div>
<div class="row">
<p><span class="strike">€{{list_request.price}}</span><span class="green">€ {{list_request.total_price}}</span></p>
</div>
<div class="row">
<p class="expiry textLeft"><span>expiry date:{{list_request.expiry_date |date: 'd.MM.yy'}}</span></p>
</div>
</div>
</ion-item>
<!-- <ion-item *ngFor="let list_request of request_list" (click)="edit_offers(list_request.id)" >
<div class="fm_list_left">
<div class="fm_list_top">
<h4 class="floatLeft">{{list_request.service}}</h4>
<div class="clear"></div>
<p><strong>Offer Details</strong></p>
<ion-row>
<ion-col col-6>Price </ion-col>
<ion-col col-6>:&nbsp;&nbsp;{{list_request.price}}</ion-col>
</ion-row>
<ion-row>
<ion-col col-6>Discount</ion-col>
<ion-col col-6>:&nbsp;&nbsp;{{list_request.discount}}</ion-col>
</ion-row>
</div>
<p class="floatLeft">Expiry Date&nbsp;:&nbsp;{{list_request.expiry_date |date: 'd MMM yy'}} </p>
<div class="clear"></div>
</div>
<div class="fm_list_right">
<div class="fm_list_img floatRight">
<img *ngIf="list_request.img" [src]="list_request.img" >
<img *ngIf="!list_request.img" src="assets/img/offers_dummy.png" >
</div>
<div class="clear"></div>
<div class="fm_list_bottom floatLeft">
<ul>
<li *ngIf="list_request.status==1" class="decision approved floatRight">Approved</li>
<li *ngIf="list_request.status==0" class="decision pending floatRight">Pending Approval</li>
<div class="clear"></div>
</ul>
</div>
</div>
</ion-item> -->
<div class="no_result_found" *ngIf="!request_list" >
<div class="no_result_icon">
<img src="assets/img/icon4.png">
</div>
<p>
No result found
</p>
</div>
</ion-list>
</ion-slide>
<!--- <ion-slide class="theme_secondary">
ACTIVE
</ion-slide>
<ion-slide class="theme_secondary">
COMPLETED
</ion-slide> -->
</ion-slides>
</div>
</div>
</ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { Viewoffers } from './viewoffers';
@NgModule({
declarations: [
Viewoffers,
],
imports: [
IonicPageModule.forChild(Viewoffers),
],
})
export class ViewoffersModule {}
page-viewoffers {
.page_background{
background:url('../../assets/imgs/fm_login_bg.png');
background-size: cover;
background-position: center;
}
.fm_list{
width: 100%;
.fm_list_tab{
ul{
padding:0px;
margin:0px;
border:1px solid #1c8aa4;
border-radius: 30px;
li{
list-style:none;
float: left;
width:33.33%;
text-align: center;
padding: 8px;
color: #919191;
font-weight:600;
border-radius: 30px;
font-size: 12px;
}
.active{
background: #1c8aa4;
color: #fff;
border-radius: 30px;
}
}
}
.fm_slide{
.list{
.item{
border-radius: 0px;
padding: 0px;
padding-top: 15px;
padding-bottom: 15px;
border-top:1px solid #919191;
margin-bottom: 10px;
.left_image{
width:120px;
height: 120px;
float: left;
background: #a8a8a8;
img{
width:100%;
height:100%;
object-fit: cover;
object-position: center;
}
}
.right_details{
width:calc(100% - 120px) !important;
padding: 10px;
padding-top: 0px;
padding-bottom: 0px;
float: left;
h4{
color: #000;
margin:0px;
font-size: 18px;
font-weight: 500;
}
.row{
padding-bottom:5px;
}
p{
width:100%;
font-size: 18px;
text-align: right;
}
.discount{
color: #ee2203;
font-size: 16px;
font-weight: 700;
}
.strike{
color: #929292;
font-size: 20px;
font-weight: 500;
text-decoration: line-through;
}
.green{
color: #1DB100;
font-size: 20px;
margin-left: 10px;
font-weight: 500;
}
.expiry{
color: #0076ba;
padding-top: 10px;
width:100%;
}
}
.label{
padding: 0px;
margin:0px;
}
.fm_list_left{
width:calc(100% - 120px);
float: left;
.fm_list_top{
width:100%;
.fm_list_top_circle{
width:30px;
height:30px;
border-radius: 50%;
background: #a8a8a8;
img{
width:100%;
height:100%;
border-radius: 50%;
object-fit: cover;
object-position: center;
}
}
h4{
margin:0px;
padding:0px;
color: #07426a;
font-size: 18px;
padding: 5px;
strong{
color: #5c5c5c;
font-size: 12px;
font-weight: 400;
padding-left:5px;
}
}
}
p{
margin:0px;
padding: 0px;
color: #1c8aa4;
font-weight: 300;
padding-top:8px;
padding-bottom:8px;
font-size: 16px;
padding-left: 5px;
strong{
font-size: 16px;
padding-top: 10px;
}
}
}
.fm_list_right{
width:120px;
float: right;
.fm_list_img{
width:113px;
height:113px;
border-radius: 50%;
img{
width:100%;
height:100%;
border-radius: 50%;
object-fit: cover;
object-position: center;
}
}
.fm_list_bottom{
width: 100%;
ul{
margin:0px;
padding:0px;
border:none;
li{
list-style: none;
background: #e2e2e2;
color:#646464;
border-radius: 20px;
padding: 3px;
font-weight: 300;
margin: 1px;
font-size: 10px;
}
.decision{
width:100%;
font-size: 14px;
padding:0px;
margin:0px;
padding: 5px;
margin-top: 16px;
}
.approved{
color: green;
}
.pending{
color: tomato;
}
}
}
}
}
}
}
}
.add_offer{
color: #fff;
text-transform: capitalize;
margin-bottom: 10px;
border-radius: 5px;
padding-left: 30px;
padding-right: 30px;
}
}
import { Component,ViewChild } from '@angular/core';
import { IonicPage, NavController, NavParams,Content,Slides } from 'ionic-angular';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';
@IonicPage()
@Component({
selector: 'page-viewoffers',
templateUrl: 'viewoffers.html',
})
export class Viewoffers {
currentIndex:any;
slidertab:any;
user_data:any;
request_list:any;
@ViewChild(Content) content: Content;
@ViewChild('mySlider') slider: Slides;
constructor(public navCtrl: NavController, public navParams: NavParams,public storage:Storage, private myservice: Myservice) {
this.storage.get('user_data').then((user_data) => {
console.log(user_data);
if(user_data){
this.user_data= user_data;
this.viewoffers()
}else
this.navCtrl.push('LoginPage');
})
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 ListVehiclePage');
}
goToSlide(id) {
this.slider.slideTo(id, 500);
}
slideChanged() {
let currentIndex = this.slider.getActiveIndex();
this.slidertab = currentIndex;
console.log("Current index is", currentIndex);
}
details(id){
this.navCtrl.push('VehicleDetailPage',{'pool_id': id});
}
addOffers(){
this.navCtrl.push('Addoffers');
}
edit_offers(id){
this.navCtrl.push('Editoffers',{'id':id});
}
viewoffers(){
this.myservice.show_loader();
this.myservice.load_get('get_offers/id/'+this.user_data.id).subscribe(data => {
this.myservice.hide_loader();
if(data.status == 'success'){
this.request_list = data.data;
console.log(this.request_list);
}
});
}
}
import { Injectable , NgZone, ViewChild} from '@angular/core';
import { NavParams } from 'ionic-angular';
import { Content } from 'ionic-angular';
import { Storage } from '@ionic/storage';
declare var apiRTC: any;
@Injectable()
export class Chatservice {
@ViewChild(Content) content: Content;
webRTCClient;
myCallId;
reg_data:any;
imClient:any;
allMessages = {messages : '',doctor : ''};
txt_msg:any;
patientId:any;
srcId:any;
conv_id:string;
convHistory=[];
patient_conv_id= [];
convhis= [];
public ionScroll;
obj={};
constructor(private zone: NgZone,public storage:Storage) {
this.storage.get('reg_data').then((reg_data) => {
this.reg_data=reg_data;
apiRTC.jsLoaded = false;
this.srcId=this.reg_data.id+12;
this.InitializeApiRTC();
})
}
InitializeApiRTC() {
//apiRTC initialization
apiRTC.init({
apiKey : "819abef1fde1c833e0601ec6dd4a8226",
apiCCId : this.srcId,
onReady: (e) => {
this.sessionReadyHandler(e);
}
});
}
sessionReadyHandler(e){
this.imClient = apiRTC.session.createIMClient('im68568846015');
this.myCallId = apiRTC.session.apiCCId;
console.log('sessionReady');
apiRTC.session.getConversationList();
apiRTC.addEventListener("receiveIMMessage", e=>{
console.log("new message")
var list=this.imClient.getConversationHistory(this.conv_id);
apiRTC.session.getConversationList();
});
apiRTC.addEventListener("channelEvent", e=>{
//console.log(e)
});
apiRTC.addEventListener("receiveConversationHistory", e=>{
var i;
var len;
var histry= e.detail.convHistory;
//console.log(this.convHistory);
if(this.convHistory != undefined && this.convHistory.length >0 ){
for ( i=0, len=histry.length; i < len; i++ ){
this.obj[histry[i].date] = histry[i];
}
console.log(this.obj)
for ( var key in this.obj )
this.convHistory.push(this.obj[key]);
}else{
this.convHistory = e.detail.convHistory;
}
});
apiRTC.addEventListener("receiveConversationList", e => {
var i;
this.convHistory = [];
for (i=e.detail.convList.length-1;i>-1;i--) {
//console.log(e.detail.convList[i].destId, this.patientId);
//if(parseInt(e.detail.convList[i].destId) == parseInt(this.patientId)){
this.imClient.getConversationHistory(e.detail.convList[i].convId);
//}
}
});
apiRTC.addEventListener("updatePresence", e=>{
//console.log('updatePresenceHandler :' + JSON.stringify(e.detail.connectedUsersList));
});
}
receiveConversationListHandler(e) {
//console.log('e receiveConversationListHandler = ', e);
}
send_msg(msg,patient_id){
patient_id = patient_id+123456789;
console.log(patient_id);
if(msg != '' || msg != null){
var msgg =this.imClient.sendMessage(patient_id,msg);
var d = new Date(); var n = d.getMilliseconds();
var msg_obj = {'date':d, 'dst': patient_id,'message': msg, 'src' : this.srcId,'srcNickname' : this.srcId}
this.convHistory.push(msg_obj);
}
}
receiveIMMessageHandler(e) {
console.log("new message")
//var list=this.imClient.getConversationHistory(this.conv_id);
//apiRTC.session.getConversationList();
}
get_history(patientId){
this.convHistory = [];
this.patientId = patientId;
this.patientId = patientId+123456789;
console.log(this.patientId);
apiRTC.session.getConversationList();
}
}
\ No newline at end of file
import { Injectable } from '@angular/core';
import { Http, Headers, RequestOptions } from '@angular/http';
import { Observable } from 'rxjs/Rx';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/toPromise';
import { Storage } from '@ionic/storage';
import { LoadingController, AlertController, Events } from 'ionic-angular';
import { FileTransfer, FileUploadOptions, FileTransferObject } from '@ionic-native/file-transfer';
import { File } from '@ionic-native/file';
import { ImagePicker } from '@ionic-native/image-picker';
//,private transfer: FileTransfer, private file: File, private imagePicker: ImagePicker
@Injectable()
export class Myservice {
//webservice_url = 'http://localhost/webservices/fixmyauto/webservice/';
//webservice_url = 'http://techlabz.in/fixmyauto/webservice/';
//webservice_url = 'http://www.garnedo.com/fixmyauto/webservice/';
webservice_url = 'http://192.168.140.22/fixmyauto/webservice/';
loader : any;
alert : any;
post_url : any;
data : any;
result:any;
reg_data:any;
constructor(public http: Http, public loadingCtrl: LoadingController, public alertCtrl: AlertController, public events: Events,public storage:Storage,private transfer: FileTransfer, private file: File, private imagePicker: ImagePicker ) {
// const fileTransfer: TransferObject = this.transfer.create();
this.storage.get('reg_data').then((reg_data) => {
this.reg_data=reg_data;
console.log("reg data", this.reg_data)
})
}
show_loader() {
this.loader = this.loadingCtrl.create({
content: ""
});
this.loader.present();
}
presentLoadingCustom() {
let loading = this.loadingCtrl.create({
spinner: 'show',
content: `
<div class="custom-spinner-container">
<div class="custom-spinner-box"></div>
</div>
<h5>Please wait your image is being downloaded</h5>`,
});
loading.onDidDismiss(() => {
console.log('Dismissed loading');
});
loading.present();
}
show_alert(title, message) {
this.alert = this.alertCtrl.create({
title: title,
subTitle: message,
buttons: ['OK']
});
this.alert.present();
}
fileUpload(data,fn_name){
var post_url = this.webservice_url + fn_name;
return this.http.post(post_url, data) .map(res =>res.json());
}
hide_loader() {
this.loader.dismissAll();
}
load_post(post_data, fn_name) {
var post_url = this.webservice_url + fn_name;
post_data = JSON.stringify(post_data);
let headers = new Headers({
'Content-Type' : 'application/json'
});
let options = new RequestOptions({ headers: headers });
return this.http.post(post_url, post_data, options)
.map(res => res.json());
}
load_get(fn_name) {
this.post_url = this.webservice_url + fn_name;
return this.http.get(`${this.post_url}`).map(res => res.json());
}
load_new() {
this.http.get('https://randomuser.me/api/?results=10')
.map(res => res.json())
.subscribe(data => {
this.data = data;
console.log(this.data);
});
}
load_post_file(imageURI, post_data, fn_name) {
console.log(imageURI);
let ft = this.transfer.create();
let filename = imageURI.substr(imageURI.lastIndexOf('/')+1);
let options = {
fileKey: 'file',
fileName: filename,
mimeType: 'image/jpeg',
chunkedMode: false,
headers: {
'Content-Type' : undefined
},
params: post_data
};
//ft.onProgress(this.onProgress);
this.show_loader();
ft.upload(imageURI, this.webservice_url+fn_name, options, false)
.then((result: any) => {
//this.success(result);
this.hide_loader();
console.log(result);
var res =JSON.parse(result.response);
if(res.status == "failed") {
this.show_alert("Error!", result.message);
}
else {
this.show_alert("Success!", res.message);
}
}).catch((error: any) => {
//this.failed(error);
console.log(error);
//this.result = error;
this.hide_loader();
this.show_alert("Error!", 'Error occured. Please try again');
});
//console.log(this.result);
//return this.result;
}
}
import { Injectable } from '@angular/core';
import { Platform } from 'ionic-angular';
import { Diagnostic } from '@ionic-native/diagnostic';
@Injectable()
export class PermissionsService {
constructor(public _platform: Platform, public _Diagnostic: Diagnostic) {
}
isAndroid() {
return this._platform.is('android')
}
isiOS() {
return this._platform.is('ios');
}
checkLocationPermissions(): Promise<boolean> {
return new Promise(resolve => {
if (this.isiOS()) {
this._Diagnostic.getLocationAuthorizationStatus().then(status => {
if (status == this._Diagnostic.permissionStatus.GRANTED) {
resolve(true);
}
else if (status == this._Diagnostic.permissionStatus.DENIED) {
resolve(false);
}
else if (status == this._Diagnostic.permissionStatus.NOT_REQUESTED || status.toLowerCase() == 'not_determined') {
this._Diagnostic.requestLocationAuthorization().then(authorisation => {
resolve(authorisation == this._Diagnostic.permissionStatus.GRANTED);
});
}
});
}
else if (this.isAndroid()) {
this._Diagnostic.isLocationAuthorized().then(authorised => {
if (authorised) {
resolve(true);
}
else {
this._Diagnostic.requestLocationAuthorization().then(authorisation => {
resolve(authorisation == this._Diagnostic.permissionStatus.GRANTED);
});
}
});
}
});
}
checkCameraPermissions(): Promise<boolean> {
return new Promise(resolve => {
if (this.isiOS()) {
this._Diagnostic.getCameraAuthorizationStatus().then(status => {
if (status == this._Diagnostic.permissionStatus.GRANTED) {
resolve(true);
}
else if (status == this._Diagnostic.permissionStatus.DENIED) {
resolve(false);
}
else if (status == this._Diagnostic.permissionStatus.NOT_REQUESTED || status.toLowerCase() == 'not_determined') {
this._Diagnostic.requestCameraAuthorization().then(authorisation => {
resolve(authorisation == this._Diagnostic.permissionStatus.GRANTED);
});
}
});
}
else if (this.isAndroid()) {
this._Diagnostic.isCameraAuthorized().then(authorised => {
if (authorised) {
resolve(true);
}
else {
this._Diagnostic.requestCameraAuthorization().then(authorisation => {
resolve(authorisation == this._Diagnostic.permissionStatus.GRANTED);
});
}
});
}
});
}
checkMicPermissions(): Promise<boolean> {
return new Promise(resolve => {
if (this.isiOS()) {
this._Diagnostic.getMicrophoneAuthorizationStatus().then(status => {
if (status == this._Diagnostic.permissionStatus.GRANTED) {
resolve(true);
}
else if (status == this._Diagnostic.permissionStatus.DENIED) {
resolve(false);
}
else if (status == this._Diagnostic.permissionStatus.NOT_REQUESTED || status.toLowerCase() == 'not_determined') {
this._Diagnostic.requestMicrophoneAuthorization().then(authorisation => {
resolve(authorisation == this._Diagnostic.permissionStatus.GRANTED);
});
}
});
}
else if (this.isAndroid()) {
this._Diagnostic.isMicrophoneAuthorized().then(m_authorised=>{
console.log(m_authorised)
if(m_authorised){
resolve(true);
}
else{
this._Diagnostic.requestMicrophoneAuthorization().then(m_authorisation=>{
resolve(m_authorisation == this._Diagnostic.permissionStatus.GRANTED);
});
}
});
}
});
}
}
\ No newline at end of file
import { Injectable } from '@angular/core';
@Injectable()
export class ValidationService {
// {code: "auth/invalid-email", message: "The email address is badly formatted."}
errorList = {
"auth/invalid-email" : "Invalid Email address",
"auth/email-already-in-use": "This Email id is already taken",
"required" : 'This field is required',
"email": "Please enter a valid email",
"minLength": "Minimum characters length is ",
"maxLength": "Maximum characters length is ",
"match": "Password not match",
"alphabets": "Only alphabets are allowed ",
"numeric": "Only numbers are allowed",
"alphanumeric" : "Only alphanumeric characters are allowed",
"website": "Please enter a valid website address",
"min": "Minimum value is ",
"extension": "Not a valid extension",
"max": "Maximum value is ",
}
constructor( ) {
console.log("ValidationService called")
}
/* Get all error list obj
================================== */
getErrorList(){
return this.errorList;
}
/* check whether the error code having our definition else return firebase definition
================================== */
getError(error:any):string{ // Argument = error object
if(this.errorList.hasOwnProperty(error.code)){ // check whether the error code having our definition
return this.errorList[error.code] // return our definition
}else{
return error.message; //
}
}
}
/**
* Check out https://googlechromelabs.github.io/sw-toolbox/ for
* more info on how to use sw-toolbox to custom configure your service worker.
*/
'use strict';
importScripts('./build/sw-toolbox.js');
self.toolbox.options.cache = {
name: 'ionic-cache'
};
// pre-cache our key assets
self.toolbox.precache(
[
'./build/main.js',
'./build/vendor.js',
'./build/main.css',
'./build/polyfills.js',
'index.html',
'manifest.json'
]
);
// dynamically cache any other local assets
self.toolbox.router.any('/*', self.toolbox.fastest);
// for any other requests go to the network, cache,
// and then only use that cached resource if your user goes offline
self.toolbox.router.default = self.toolbox.networkFirst;
// Ionic Variables and Theming. For more info, please see:
// http://ionicframework.com/docs/theming/
// Font path is used to include ionicons,
// roboto, and noto sans fonts
$font-path: "../assets/fonts";
// The app direction is used to include
// rtl styles in your app. For more info, please see:
// http://ionicframework.com/docs/theming/rtl-support/
$app-direction: ltr;
@import "ionic.globals";
// Shared Variables
// --------------------------------------------------
// To customize the look and feel of this app, you can override
// the Sass variables found in Ionic's source scss files.
// To view all the possible Ionic variables, see:
// http://ionicframework.com/docs/theming/overriding-ionic-variables/
// Named Color Variables
// --------------------------------------------------
// Named colors makes it easy to reuse colors on various components.
// It's highly recommended to change the default colors
// to match your app's branding. Ionic uses a Sass map of
// colors so you can add, rename and remove colors as needed.
// The "primary" color is the only required color in the map.
$colors: (
primary: #488aff,
secondary: #32db64,
danger: #f53d3d,
light: #f4f4f4,
dark: #222
);
// App iOS Variables
// --------------------------------------------------
// iOS only Sass variables can go here
// App Material Design Variables
// --------------------------------------------------
// Material Design only Sass variables can go here
// App Windows Variables
// --------------------------------------------------
// Windows only Sass variables can go here
// App Theme
// --------------------------------------------------
// Ionic apps can have different themes applied, which can
// then be future customized. This import comes last
// so that the above variables are used and Ionic's
// default are overridden.
@import "ionic.theme.default";
// Ionicons
// --------------------------------------------------
// The premium icon font for Ionic. For more info, please see:
// http://ionicframework.com/docs/ionicons/
@import "ionic.ionicons";
// Fonts
// --------------------------------------------------
@import "roboto";
@import "noto-sans";
{
"compilerOptions": {
"allowSyntheticDefaultImports": true,
"declaration": false,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": [
"dom",
"es2015"
],
"module": "es2015",
"moduleResolution": "node",
"sourceMap": true,
"target": "es5"
},
"include": [
"src/**/*.ts"
],
"exclude": [
"node_modules",
"src/**/*.spec.ts",
"src/**/__tests__/*.ts"
],
"compileOnSave": false,
"atom": {
"rewriteTsconfig": false
}
}
{
"rules": {
"no-duplicate-variable": true,
"no-unused-variable": [
true
]
},
"rulesDirectory": [
"node_modules/tslint-eslint-rules/dist/rules"
]
}
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