dc

src/app/home/index/index.component.scss

@@ -883,6 +883,7 @@
                                 }
                             }
                             .book_now {
+                                float:right;
                                 border: 1px solid #2655bf;
                                 color: #2655bf;
                                 background: transparent;
@@ -897,6 +898,7 @@
                                 }
                             }
                             .book_now_disabled{
+                                float:right;
                                 border: 1px solid #808080;
                                 color: #808080;
                                 background: transparent;
@@ -915,6 +917,48 @@
                             }
                         }
                     }
+                    .offer{
+                                    
+                        color: #a8a8a8;
+                        text-align: justify;
+                        font-size: 12px;
+                        .panel-heading{
+                            padding: 10px;
+                            margin-bottom: 5px;
+                            padding-left: 15px;
+                            padding-right: 15px;
+                            background-color: #2655bf;
+                            background-image: url("/assets/images/asset_double_right.png");
+                            background-position: right 10px top 8px;
+                            background-repeat: no-repeat;
+                            .panel-title{  
+                                padding: 0px;
+                                margin:0px;
+                            a{
+                                color: #fff;
+                                font-weight: 300;
+                                    font-size: 15px;
+                            }  
+                        }
+                        }
+                        .panel-collapse{
+                            background-color: #f5f5f5;
+                            
+                            .panel-body{
+                                font-size: 15px;
+                                font-weight: 400;
+                                .row{
+                                    padding:10px;
+                                    border-bottom: 1px solid #fff;
+                                }
+                            }
+                        }
+                        
+
+                    
+
+
+                }
                 }
                 .scheduletiming_listing {
                     width: calc(100% - 80px);

src/app/home/index/index.component.ts

@@ -34,10 +34,12 @@ export class IndexComponent implements OnInit {
   //Basic Location Search: TAB 1
   autocomplete: any;
   searchLocError: boolean;
+
+  @ViewChild("goTostep0") public goTostep0Ref: ElementRef;
   @ViewChild("goTostep1") public goTostep1Ref: ElementRef;
+  @ViewChild("goTostep2") public goTostep2Ref: ElementRef;
+  
   @ViewChild("closeWizard") public closeWizardRef: ElementRef;
-  @ViewChild("step2nextBtn") public step2nextRef: ElementRef;
-  @ViewChild("step3nextBtn") public step3nextRef: ElementRef;
   @ViewChild("googleLocSearch") public searchElementRef: ElementRef;
   @ViewChild("indexLoginModal") loginModalRef: ElementRef;
   @ViewChild("closeQuoteWizard") closeQuoteWizardRef: ElementRef;
@@ -52,6 +54,7 @@ export class IndexComponent implements OnInit {
   selectedIssues: any[] = new Array();
 
   //Quote Page
+  step: number;
   today: any = new Date();
   currDate: any;
   nextDate: any;
@@ -60,6 +63,7 @@ export class IndexComponent implements OnInit {
   imageServer: string;
   mechanicData: any;
   autoSchedule: boolean;
+  estimatedPrice: number;
   scheduleDateInit: boolean;
 
   carModel: any;
@@ -72,6 +76,7 @@ export class IndexComponent implements OnInit {
     public webService     : WebService,
     public mapsAPILoader  : MapsAPILoader,
     public subjectService : SubjectService) { 
+      this.step             = 0;
       this.autoSchedule     = false;
       this.imageServer      = ImageStorage;
       this.currDate         = new Date();
@@ -123,46 +128,6 @@ export class IndexComponent implements OnInit {
     this.carModel = this.carSearchJsonData[event].models;
   }
 
-  setIssueSelected(event){
-    let issue_id = event.target.attributes.issue_id.value;
-    let sub_issue_id = event.target.attributes.sub_issue_id.value;
-
-    let index = this.selectedIssues.findIndex(x => x.sub_issue_id == sub_issue_id);
-    if(index > -1){
-      this.selectedIssues.splice(index, 1);
-    } else {
-      const thisObj = this;
-      this.issuesData.forEach(function (issData) {
-        if(issData.issue_id == issue_id){
-          issData.sub_categories.forEach(function (subIssData) {
-            if(subIssData.issue_cat_id == sub_issue_id){
-              let issue = issData.issue, 
-                  issue_image = issData.issue_image,
-                  issue_category = subIssData.issue_category,
-                  issue_cat_image = subIssData.issue_cat_image,
-                  default_service_fee = subIssData.default_service_fee,
-                  default_description = subIssData.default_description;
-
-              thisObj.selectedIssues.push({issue_id,sub_issue_id,issue,issue_image,issue_category,issue_cat_image,default_service_fee,default_description});
-            }
-          });
-        }
-      }); 
-    }
-  }
-
-  removeSelectedItem(issue_id,sub_issue_id){
-    let index = this.selectedIssues.findIndex(x => x.sub_issue_id == sub_issue_id);
-    if(index > -1){
-      this.selectedIssues.splice(index, 1);
-
-      $('[id="issue_'+issue_id+'_'+sub_issue_id+'"]').prop('checked', false);
-    }
-    if(this.selectedIssues.length == 0){
-      this.goTostep1Ref.nativeElement.click();
-    }
-  }
-
   getVehicleLoc(lastLoc){
     if(lastLoc == ''){
       this.searchLocError = true;
@@ -188,6 +153,8 @@ export class IndexComponent implements OnInit {
       this.lat = place.geometry.location.lat();
       this.lng = place.geometry.location.lng();
       this.wizardModalTrrigerInput.nativeElement.click();
+      
+      this.getIssueData();
     });
   }
 
@@ -200,42 +167,96 @@ export class IndexComponent implements OnInit {
                                        'milage':vehicleData['milage'],'emgine':vehicleData['emgine'],
                                        'modelName':vehicleData['modelName'],'modelYear':vehicleData['modelYear']
                                       }
-    this.getIssueData();
     this.vehicleDataFormSubmit = false;
-    this.step2nextRef.nativeElement.click();
   }
 
   getIssueData(){
     const This = this;
     this.loader = true;
     this.webService.get_data('getGeneralIssues').subscribe(response => {
-      this.loader = false;
       if(response.status == '1'){
         this.issuesData = response.issue_data;
+        this.loader = false;
       } else {
         return false;
       }
+      this.loader = false;
     },error => {
+      this.loader = false;
       return false;
     });
   }
+  
+  setIssueSelected(event){
+    let issue_id = event.target.attributes.issue_id.value;
+    let sub_issue_id = event.target.attributes.sub_issue_id.value;
 
-  resetWizard(){
-    this.vehicleDataForm.reset();
-    this.searchElementRef.nativeElement.value = '';
+    const thisObj = this;
+    let index = thisObj.selectedIssues.findIndex(x => x.sub_issue_id == sub_issue_id);
+    if(index > -1){
+      thisObj.selectedIssues.splice(index, 1);
+    } else {
+      thisObj.issuesData.forEach(function (issData) {
+        if(issData.issue_id == issue_id){
+          issData.sub_categories.forEach(function (subIssData) {
+            if(subIssData.issue_cat_id == sub_issue_id){
+              let issue = issData.issue, 
+                  issue_image = issData.issue_image,
+                  issue_category = subIssData.issue_category,
+                  issue_cat_image = subIssData.issue_cat_image,
+                  default_service_fee = subIssData.default_service_fee,
+                  default_description = subIssData.default_description;
+
+              thisObj.selectedIssues.push({issue_id,sub_issue_id,issue,issue_image,issue_category,issue_cat_image,default_service_fee,default_description});
+            }
+          });
+        }
+      }); 
+    }
+    this.calculateEstimate();
+  }
+
+  calculateEstimate(){
+    const thisObj = this;
+    thisObj.estimatedPrice = 0;
+    thisObj.selectedIssues.forEach(function (selIssues) {
+      thisObj.estimatedPrice = thisObj.estimatedPrice + Number(selIssues.default_service_fee);
+    });
   }
 
-  jumpToStep3(){
-    if(this.selectedIssues.length != 0){
-      this.step3nextRef.nativeElement.click();
+  removeSelectedItem(issue_id,sub_issue_id){
+    let index = this.selectedIssues.findIndex(x => x.sub_issue_id == sub_issue_id);
+    if(index > -1){
+      this.selectedIssues.splice(index, 1);
+
+      $('[id="issue_'+issue_id+'_'+sub_issue_id+'"]').prop('checked', false);
     }
+    if(this.selectedIssues.length == 0){
+      this.jumpToStep1();
+    }
+    this.calculateEstimate();
+  }
+
+  resetQuoteWizard(){
+    this.jumpToStep0();
+    this.vehicleDataForm.reset();
+    this.searchElementRef.nativeElement.value = '';
+    
+    this.selectedIssues = [];
+    this.scheduleDateInit = false;
   }
 
   getQuote(){
-    const This = this;
+    const thisObj = this;
     this.loader = true;
 
-    this.webService.post_data('getNearByMechanics',this.wizardData.pickup_data).subscribe(response => {
+    let selSubIssues: any[] = new Array();
+    thisObj.selectedIssues.forEach(function (selIssues) {
+      selSubIssues.push(selIssues.sub_issue_id);
+    });
+
+    let searchData = {'pickup_data':this.wizardData.pickup_data,'sub_issues':selSubIssues}
+    this.webService.post_data('getNearByMechanics',searchData).subscribe(response => {
       this.loader = false;
       if(response.status == '1'){
         this.mechanicData = response.mechanic_data;
@@ -270,13 +291,10 @@ export class IndexComponent implements OnInit {
       return false;
     }
     this.dateSection = new Array();
-
     this.nextDate.setDate(this.nextDate.getDate() + 1);
     this.currDate.setDate(this.currDate.getDate() + 1);
-
     this.dateSection[0] = new Date(this.currDate);
     this.dateSection[1] = new Date(this.nextDate);
-
     this.dateStep += 1;
   }
 
@@ -285,13 +303,10 @@ export class IndexComponent implements OnInit {
       return false;
     }
     this.dateSection = new Array();
-
     this.nextDate.setDate(this.nextDate.getDate() - 1);
     this.currDate.setDate(this.currDate.getDate() - 1);
-
     this.dateSection[0] = new Date(this.currDate);
     this.dateSection[1] = new Date(this.nextDate);
-
     this.dateStep -= 1;
   }
 
@@ -324,6 +339,7 @@ export class IndexComponent implements OnInit {
 
   confirmBooking(){
     this.wizardData['customer_id'] = this.loginDetails.customer_id;
+    this.wizardData['selected_issues'] = this.selectedIssues;
 
     this.webService.post_data('scheduleNow',this.wizardData).subscribe(response => {
       this.loader = false;
@@ -340,6 +356,24 @@ export class IndexComponent implements OnInit {
     });
   }
 
+  jumpToStep0(){
+    this.goTostepRef.nativeElement.click();
+  }
+
+  jumpToStep1(){
+    if(!this.vehicleDataForm.invalid){
+      this.goTostepRef.nativeElement.click();
+    }
+  }
+
+  jumpToStep2(){
+    if(this.selectedIssues.length > 0){
+      this.goTostepRef.nativeElement.click();
+    }
+  }
+
+  
+
   featuredOnLoad() {return ''; }
   carouselTileLoad(){ return ''; }
 }

src/app/navbar/navbar.component.html

@@ -5,7 +5,7 @@
 
         <!-- Brand -->
 
-        <a class="navbar-brand" href="#">
+        <a class="navbar-brand" (click)="goToPage('index')">
             <img src="assets/images/asset_logo.png">
         </a>
 

src/app/provider/web.service.ts

@@ -17,6 +17,14 @@ const httplive = {
   })
 };
 
+const multipartHeader = {
+  headers: new HttpHeaders({
+    'enctype': 'multipart/form-data',
+    'Accept': 'application/json',
+    'Auth': 'my_key'
+  })
+};
+
 @Injectable({
   providedIn: 'root'
 })
@@ -27,6 +35,9 @@ export class WebService {
   post_data(url: string, data) {
     return this.http.post(`${apiConfig + url}`, data, httpOptions).pipe(map((response: any) => response));
   }
+  multipart_post(url: string, data) {
+    return this.http.post(`${apiConfig + url}`, data, multipartHeader).pipe(map((response: any) => response));
+  }
   get_data(url) {
     return this.http.get(`${apiConfig + url}`, httpOptions).pipe(map((response: any) => response));
   }

src/styles.scss

@@ -51,8 +51,18 @@ button {
     }
 }
 
+.pac-container {
+    z-index: 10000 !important;
+}
+
 a {
     text-decoration: none !important;
+    cursor: pointer;
+}
+.text_truncate{
+    white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis
 }
 
 html,