Skip to content

D
dcarfixers_angular
Commit 2448c5c8 by Jansa Jose
Options

dc- appontment details and service history

parent fab431ee
Showing with 267 additions and 68 deletions
src/app/home/dashboard/dashboard.component.html
...@@ -197,7 +197,7 @@ ...@@ -197,7 +197,7 @@
<div class="button_bay"> <div class="button_bay">
<div class="btn-group-justified" role="group" aria-label="Basic example"> <div class="btn-group-justified" role="group" aria-label="Basic example">
<button type="button" class="btn book btn-sm" data-toggle="modal" data-target="#wizard" (click)="bookVechile(vehicle.customer_veh_id)">Book Now</button> <button type="button" class="btn book btn-sm" data-toggle="modal" data-target="#wizard" (click)="bookVechile(vehicle.customer_veh_id)">Book Now</button>
<button type="button" class="btn btn-danger btn-sm" (click)="deleteCustomerCar(vehicle.customer_id,vehicle.customer_veh_id)">Delete</button> <button type="button" class="btn btn-danger btn-sm" (click)="cnfdeleteCustomerCar(vehicle.customer_id,vehicle.customer_veh_id)">Delete</button>
</div> </div>
</div> </div>
</li> </li>
...@@ -231,28 +231,26 @@ ...@@ -231,28 +231,26 @@
<tr> <tr>
<th></th> <th></th>
<th>Order Date</th> <th>Order Date</th>
<th>Vehicle Model</th>
<th>Vehicle Make</th> <th>Vehicle Make</th>
<th>Mechanic</th> <th>Mechanic</th>
<!-- <th>Cost</th> -->
<th>Action</th> <th>Action</th>
</tr> </tr>
</thead> </thead>
</table> </table>
<div *ngFor="let bookData of successBookDtls; let i = index"> <div *ngFor="let bookData of successBookDtls; let i = index" id="accordion">
<table> <table>
<tbody> <tbody>
<tr> <tr>
<td>{{i+1}}</td> <td>{{i+1}}</td>
<td>{{bookData.scheduled_date+' '+bookData.scheduled_time}}</td> <td>{{bookData.scheduled_date+' '+bookData.scheduled_time}}</td>
<td>{{bookData.car_name}}</td> <td>{{bookData.car_name}}</td>
<td>{{bookData.car_name}}</td>
<td>{{(bookData.is_multiple ==='0')? bookData.mechanic_data[0].first_name+' '+bookData.mechanic_data[0].last_name : bookData.mechanic_data.length+' Requests'}}</td> <td>{{(bookData.is_multiple ==='0')? bookData.mechanic_data[0].first_name+' '+bookData.mechanic_data[0].last_name : bookData.mechanic_data.length+' Requests'}}</td>
<!-- <td>{{bookData.cost}}</td> --> <!-- <td>{{bookData.cost}}</td> -->
<td> <td>
<div class="floatLeft"> <div class="floatLeft">
<div class="btn-group btn-group-justified"> <div class="btn-group btn-group-justified">
<button (click)="cancelBooking(bookData.booking_id)" class="btn btn-danger btn-sm">Cancel</button> <button class="btn btn-default btn-sm">{{bookData.status === '1' ? 'Accepted' : 'Pending'}}</button>
<button (click)="cnfCancelBook(bookData.booking_id)" class="btn btn-danger btn-sm">Cancel</button>
</div> </div>
</div> </div>
<div class="booking_drop" data-toggle="collapse" [attr.data-target]="'#quote_list_'+bookData.booking_id"></div> <div class="booking_drop" data-toggle="collapse" [attr.data-target]="'#quote_list_'+bookData.booking_id"></div>
...@@ -260,7 +258,7 @@ ...@@ -260,7 +258,7 @@
</tr> </tr>
</tbody> </tbody>
</table> </table>
<table [attr.id]="'quote_list_'+bookData.booking_id" class="collapse"> <table [attr.id]="'quote_list_'+bookData.booking_id" class="collapse quote_list_table" data-parent="#accordion">
<thead> <thead>
<tr> <tr>
<th>Mechanic</th> <th>Mechanic</th>
...@@ -281,8 +279,8 @@ ...@@ -281,8 +279,8 @@
<td> <td>
<div class="btn-group btn-group-justified"> <div class="btn-group btn-group-justified">
<button class="btn btn-default btn-sm" *ngIf="mechdata.status =='0'">Waiting for Approval</button> <button class="btn btn-default btn-sm" *ngIf="mechdata.status =='0'">Waiting for Approval</button>
<button class="btn btn-success btn-sm" *ngIf="mechdata.status =='1'">Accept</button> <button class="btn btn-success btn-sm" *ngIf="mechdata.status =='1' && bookData.status != '1'" (click)="mechanicQuoteAccept(bookData.booking_id,mechdata.mechanic_id)">Accept</button>
<button class="btn btn-info btn-sm" data-toggle="modal" data-target="#failure" *ngIf="mechdata.status =='1'">View Quote</button> <button class="btn btn-info btn-sm" (click)="showCustQuote(bookData.booking_id,mechdata.mechanic_id,1)" data-toggle="modal" data-target="#quote" *ngIf="mechdata.status =='1' && mechdata.custom_service_quote">View Quote</button>
</div> </div>
</td> </td>
</tr> </tr>
...@@ -313,7 +311,7 @@ ...@@ -313,7 +311,7 @@
<p>No Data Found</p> <p>No Data Found</p>
</div> </div>
<ng-template #allBookDtls> <ng-template #allBookDtls>
<table> <!-- <table>
<thead> <thead>
<tr> <tr>
<th>Orders</th> <th>Orders</th>
...@@ -326,20 +324,79 @@ ...@@ -326,20 +324,79 @@
</thead> </thead>
<tbody> <tbody>
<tr *ngFor="let bookData of bookingDetails;let i = index"> <tr *ngFor="let bookData of bookingDetails;let i = index">
<!-- <td>{{bookData.booking_id}}</td> -->
<td>{{i+1}}</td> <td>{{i+1}}</td>
<td>{{bookData.scheduled_date+' '+bookData.scheduled_time}}</td> <td>{{bookData.scheduled_date+' '+bookData.scheduled_time}}</td>
<td>{{bookData.car_name}}</td> <td>{{bookData.car_name}}</td>
<td>{{bookData.mechanic_data.first_name+' '+bookData.mechanic_data.last_name}}</td> <td>{{bookData.mechanic_data[0].first_name+' '+bookData.mechanic_data[0].last_name}}</td>
<td class="service-align-center">{{bookData.cost}}</td> <td class="service-align-center">{{bookData.cost}}</td>
<td [ngSwitch]="bookData.status"> <td [ngSwitch]="bookData.status">
<p *ngSwitchCase="3" class="success_status">Completed</p> <p *ngSwitchCase="3" class="success_status">Completed</p>
<p *ngSwitchCase="4" class="canceled_status">Canceled</p> <p *ngSwitchCase="4" class="canceled_status">Canceled</p>
<p *ngSwitchCase="5" class="canceled_status">Canceled</p> </td>
</tr>
</tbody>
</table> -->
<table>
<thead>
<tr>
<th></th>
<th>Order Date</th>
<th>Vehicle Make</th>
<th>Mechanic</th>
<th>Action</th>
</tr>
</thead>
</table>
<div *ngFor="let bookData of bookingDetails; let i = index" id="accordion">
<table>
<tbody>
<tr>
<td>{{i+1}}</td>
<td>{{bookData.scheduled_date+' '+bookData.scheduled_time}}</td>
<td>{{bookData.car_name}}</td>
<td>{{(bookData.is_multiple ==='0')? bookData.mechanic_data[0].first_name+' '+bookData.mechanic_data[0].last_name : bookData.mechanic_data.length+' Requests'}}</td>
<td [ngSwitch]="bookData.status">
<div class="floatLeft">
<p *ngSwitchCase="3" class="success_status">Completed</p>
<p *ngSwitchCase="4" class="canceled_status">Canceled</p>
</div>
<div *ngIf="bookData.status === '3'" class="booking_drop" data-toggle="collapse" [attr.data-target]="'#quote_list_'+bookData.booking_id"></div>
</td>
</tr>
</tbody>
</table>
<table [attr.id]="'quote_list_'+bookData.booking_id" class="collapse quote_list_table" data-parent="#accordion">
<thead>
<tr>
<th>Mechanic</th>
<th>Contact</th>
<th>Rating</th>
<th>Location</th>
<th>Amount</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let mechdata of bookData.mechanic_data;">
<td>{{mechdata.first_name+' '+mechdata.last_name}}</td>
<td>{{mechdata.phone}}</td>
<td>{{mechdata.rating > 0?mechdata.rating+'/5':''}}</td>
<td>{{mechdata.location}}</td>
<td>{{mechdata.custom_amount > 0 ?mechdata.custom_amount:bookData.cost}}</td>
<td>
<div class="btn-group btn-group-justified">
<button class="btn btn-info btn-sm" (click)="showCustQuote(bookData.booking_id,mechdata.mechanic_id,2)" data-toggle="modal" data-target="#quote" *ngIf="mechdata.status =='1' && mechdata.custom_service_quote">View Quote</button>
</div>
</td> </td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div>
</ng-template> </ng-template>
</div> </div>
</div> </div>
...@@ -861,18 +918,19 @@ ...@@ -861,18 +918,19 @@
</div> </div>
<!-- QUOTES-MODAL-ENDS--> <!-- QUOTES-MODAL-ENDS-->
<!-- <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#confirm">Open Modal</button> -->
<!-- BOOKING-QUOTE-MODAL-STARTS --> <!-- BOOKING-QUOTE-MODAL-STARTS -->
<div class="modal" id="quote"> <div class="modal" id="quote">
<div class="modal-dialog modal-full"> <div class="modal-dialog modal-full">
<div class="loader_overlay" *ngIf="loader"></div>
<div class="modal-content login_modal_wrapper"> <div class="modal-content login_modal_wrapper">
<div class="modal_close" data-dismiss="modal"> × </div> <div class="modal_close" data-dismiss="modal"> × </div>
<div class="modal-body quote_modal"> <div class="modal-body quote_modal">
<div class="login_modal_content"> <div class="login_modal_content">
<div class="login_modal_inner"> <div class="login_modal_inner">
<h3>View quotes</h3> <h3>View quotes</h3>
<table> <table width=100%>
<thead> <thead>
<tr> <tr>
<th width= 20%;>Issues</th> <th width= 20%;>Issues</th>
...@@ -881,32 +939,16 @@ ...@@ -881,32 +939,16 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr> <tr *ngFor="let quote of mechCustQuote">
<td>Oil Change</td> <td>{{quote.issue_category}}</td>
<td> <td>{{quote.description}}</td>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, <td>{{quote.amount}}</td>
</td>
<td>$340</td>
</tr>
<tr>
<td>Oil Change</td>
<td>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
</td>
<td>$340</td>
</tr>
<tr>
<td>Oil Change</td>
<td>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
</td>
<td>$340</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
<div class="row"> <div class="row">
<div class="col-md-12 textCenter" style="padding-top:40px;"> <div class="col-md-12 textCenter" style="padding-top:40px;">
<button class="log_btn">Close</button> <button class="log_btn" data-dismiss="modal">Close</button>
</div> </div>
</div> </div>
</div> </div>
...@@ -915,14 +957,9 @@ ...@@ -915,14 +957,9 @@
</div> </div>
</div> </div>
</div> </div>
<!-- BOOKING-QUOTE-MODAL-ENDS --> <!-- BOOKING-QUOTE-MODAL-ENDS -->
<!-- BOOKING-SUCCESS-MODAL-STARTS --> <!-- BOOKING-SUCCESS-MODAL-STARTS -->
<div class="modal" id="success"> <div class="modal" id="success">
<div class="modal-dialog modal-full"> <div class="modal-dialog modal-full">
<div class="modal-content login_modal_wrapper"> <div class="modal-content login_modal_wrapper">
...@@ -937,7 +974,7 @@ ...@@ -937,7 +974,7 @@
<div class="row"> <div class="row">
<div class="col-md-12 textCenter" style="padding-top:40px;"> <div class="col-md-12 textCenter" style="padding-top:40px;">
<button class="log_btn">Close</button> <button class="log_btn" data-dismiss="modal">Close</button>
</div> </div>
</div> </div>
</div> </div>
...@@ -946,12 +983,9 @@ ...@@ -946,12 +983,9 @@
</div> </div>
</div> </div>
</div> </div>
<!-- BOOKING-SUCCESS-MODAL-ENDS --> <!-- BOOKING-SUCCESS-MODAL-ENDS -->
<!-- BOOKING-FAILURE-MODAL-STARTS --> <!-- BOOKING-FAILURE-MODAL-STARTS -->
<div class="modal" id="failure"> <div class="modal" id="failure">
<div class="modal-dialog modal-full"> <div class="modal-dialog modal-full">
<div class="modal-content login_modal_wrapper"> <div class="modal-content login_modal_wrapper">
...@@ -975,6 +1009,29 @@ ...@@ -975,6 +1009,29 @@
</div> </div>
</div> </div>
</div> </div>
<!-- BOOKING-FAILURE-MODAL-ENDS --> <!-- BOOKING-FAILURE-MODAL-ENDS -->
<!-- BOOKING-CONFIRMATION-MODAL-STARTS -->
<button #confirmModal class="hide" data-toggle="modal" data-target="#confirm">Add Vehicle</button>
<div class="modal" id="confirm" >
<div class="modal-dialog modal-full">
<div class="modal-content background_transparent">
<div class="modal-body quote_modal">
<div class="confirm_modal_content">
<div class="login_modal_inner">
<div class="login_success">
<h4>Do You Want to Confirm ?</h4>
</div>
<div class="row">
<div class="col-md-12 textCenter">
<button class="btn btn-success" data-dismiss="modal" (click)="confirmCallBack(confirmCallBak,confirmParam)">Yes</button>
<button class="btn btn-danger" data-dismiss="modal">No</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- BOOKING-CONFIRMATION-MODAL-ENDS -->
src/app/home/dashboard/dashboard.component.scss
...@@ -95,7 +95,7 @@ ...@@ -95,7 +95,7 @@
.dashboard_tab_content { .dashboard_tab_content {
padding-bottom: 80px; padding-bottom: 80px;
#quote_list{ .quote_list_table{
background: darkgray; background: darkgray;
thead { thead {
...@@ -107,12 +107,51 @@ ...@@ -107,12 +107,51 @@
font-weight: 400; font-weight: 400;
padding: 5px; padding: 5px;
padding-left:20px; padding-left:20px;
&:nth-child(1){
width:20%;
}
&:nth-child(2){
width:20%;
}
&:nth-child(3){
width:10%;
}
&:nth-child(4){
width:20%;
}
&:nth-child(5){
width:10%;
}
&:nth-child(6){
width:20%;
}
} }
} }
} }
tbody { tbody {
tr{
td{
&:nth-child(1){
width:20%;
}
&:nth-child(2){
width:20%;
}
&:nth-child(3){
width:10%;
}
&:nth-child(4){
width:20%;
}
&:nth-child(5){
width:10%;
}
&:nth-child(6){
width:20%;
}
}
}
} }
} }
table { table {
......
src/app/home/dashboard/dashboard.component.ts
...@@ -20,28 +20,31 @@ declare const google: any; ...@@ -20,28 +20,31 @@ declare const google: any;
export class DashboardComponent implements OnInit { export class DashboardComponent implements OnInit {
tab: any; tab: any;
loader: boolean; loader: boolean;
carModel: any;
imageUrl: any; imageUrl: any;
user_name: string; user_name: string;
vehDetails: any; vehDetails: any;
testMilage: any = ''; testMilage: any = '';
errMessage: any; errMessage: any;
modelDates: number[] = new Array();
monthArray: any[] = new Array(12);
editProfile; editProfile;
loginDetails: any; loginDetails: any;
selectedFile: File; selectedFile: File;
profile_image: any; profile_image: any;
mechCustQuote: number[] = new Array();
confirmParam: string = '';
confirmCallBak: string = '';
cfautocomplete: any;
searchLocError: boolean; searchLocError: boolean;
bookingDetails: any; bookingDetails: any;
successBookDtls: any; successBookDtls: any;
profileEditResp: any; profileEditResp: any;
autocompleteVin: any; autocompleteVin: any;
carSearchJsonData: any;
autocompleteDetails: any; autocompleteDetails: any;
editProfileSubmitClick: boolean;
optionalDescription: string; optionalDescription: string;
cfautocomplete: any; editProfileSubmitClick: boolean;
carModel: any;
modelDates: number[] = new Array();
monthArray: any[] = new Array(12);
carSearchJsonData: any;
vehicleVinAddForm; vehicleVinAddForm;
vehicleVinFormSubmitClick; vehicleVinFormSubmitClick;
...@@ -90,6 +93,7 @@ export class DashboardComponent implements OnInit { ...@@ -90,6 +93,7 @@ export class DashboardComponent implements OnInit {
//minRoute:any; //minRoute:any;
@ViewChild("closeWizard") public closeWizardRef: ElementRef; @ViewChild("closeWizard") public closeWizardRef: ElementRef;
@ViewChild("confirmModal") public confirmModalRef: ElementRef;
@ViewChild("googleLocVin") public googleLocVinRef: ElementRef; @ViewChild("googleLocVin") public googleLocVinRef: ElementRef;
@ViewChild("goTostep1") public goTostep1Ref: ElementRef; @ViewChild("goTostep1") public goTostep1Ref: ElementRef;
@ViewChild("step2nextBtn") public step2nextRef: ElementRef; @ViewChild("step2nextBtn") public step2nextRef: ElementRef;
...@@ -206,7 +210,7 @@ export class DashboardComponent implements OnInit { ...@@ -206,7 +210,7 @@ export class DashboardComponent implements OnInit {
this.webService.post_data('getCustBookDetails', {'customer_id':this.loginDetails.customer_id}).subscribe(response => { this.webService.post_data('getCustBookDetails', {'customer_id':this.loginDetails.customer_id}).subscribe(response => {
if ( response.status == '1' && response.bookData != 'undefined' && response.bookData != undefined && response.bookData != 'null' && response.bookData != null ) { if ( response.status == '1' && response.bookData != 'undefined' && response.bookData != undefined && response.bookData != 'null' && response.bookData != null ) {
let bookings = response.bookData; let bookings = response.bookData;
console.log(bookings)
let successBooking: any[] = new Array(); let successBooking: any[] = new Array();
let bookingDetails: any[] = new Array(); let bookingDetails: any[] = new Array();
...@@ -460,19 +464,9 @@ export class DashboardComponent implements OnInit { ...@@ -460,19 +464,9 @@ export class DashboardComponent implements OnInit {
}); });
} }
cancelBooking(bookingId){ deleteCustomerCar(params){
this.loader = true;
this.webService.post_data('cancelBooking', {'customer_id':this.loginDetails.customer_id,'booking_id':bookingId}).subscribe(response => {
if ( response.status == '1' ) {
this.getCustBookDetails();
this.loader = false;
}
});
}
deleteCustomerCar(customer_id,customer_veh_id){
this.loader = true; this.loader = true;
this.webService.post_data('deleteCustomerCar', {'customer_id':customer_id,'customer_veh_id':customer_veh_id}).subscribe(response => { this.webService.post_data('deleteCustomerCar', params).subscribe(response => {
if ( response.status == '1' ) { if ( response.status == '1' ) {
this.getCustVehDetails(); this.getCustVehDetails();
this.loader = false; this.loader = false;
...@@ -791,6 +785,100 @@ export class DashboardComponent implements OnInit { ...@@ -791,6 +785,100 @@ export class DashboardComponent implements OnInit {
this.optionalDescription = ''; this.optionalDescription = '';
} }
showCustQuote(booking_id,mechanic_id,type){
if(!booking_id || !mechanic_id){
return false;
}
this.loader = true;
const thisObj= this;
if(type == '2'){
thisObj.successBookDtls = this.bookingDetails;
}
thisObj.successBookDtls.forEach(function (data,index) {
if(data.booking_id == booking_id){
// let bookdata = data;
data.mechanic_data.forEach(function (mechdata,mechindex) {
if(mechdata.mechanic_id == mechanic_id){
let mechdatadetails = mechdata;
thisObj.mechCustQuote = mechdatadetails.custom_service_quote;
}
})
}
});
this.loader = false;
}
cancelBooking(booking: any){
let bookingId: number;
if(!booking.bookingId){
return false;
}
bookingId = booking.bookingId;
this.loader = true;
this.webService.post_data('cancelBooking', {'customer_id':this.loginDetails.customer_id,'booking_id':bookingId}).subscribe(response => {
if ( response.status == '1' ) {
this.getCustBookDetails();
this.loader = false;
}
});
}
mechanicQuoteAccept(booking_id,mechanic_id){
if(!booking_id || !mechanic_id){
return false;
}
this.showConfirmPopUp('acceptQuote',{bookingId:booking_id,mechanicId:mechanic_id});
}
cnfCancelBook(booking_id){
if(!booking_id){
return false;
}
this.showConfirmPopUp('cancelBooking',{bookingId:booking_id});
}
cnfdeleteCustomerCar(customer_id,vehicle_id){
if(!customer_id || !vehicle_id){
return false;
}
this.showConfirmPopUp('deleteCustomerCar',{'customer_id':customer_id,'customer_veh_id':vehicle_id});
}
showConfirmPopUp(fn_name: string, param: any){
if(fn_name === ''){
return false;
}
if(param){
param = JSON.stringify(param);
}
this.confirmParam = param;
this.confirmCallBak = fn_name;
this.confirmModalRef.nativeElement.click();
}
confirmCallBack(fn_name: string,param: string){
if(fn_name === '' || !this[fn_name]){
return false;
}
if(param !== ''){
param = JSON.parse(param);
this[fn_name](param);
} else {
this[fn_name]();
}
}
acceptQuote(param: any){
this.webService.post_data('acceptMechanicQuote',param).subscribe(response => {
if(response.status == 'success'){
this.getCustBookDetails();
}
})
}
scrollToTop(id){ scrollToTop(id){
$('#'+id).stop().animate({scrollTop: 0}, 800); $('#'+id).stop().animate({scrollTop: 0}, 800);
} }
......
src/styles.scss
...@@ -205,6 +205,10 @@ body { ...@@ -205,6 +205,10 @@ body {
background: #D94350; background: #D94350;
} }
.background_transparent{
background-color: transparent !important;
}
.tile { .tile {
box-shadow: none !important; box-shadow: none !important;
} }
...@@ -601,4 +605,15 @@ bs-datepicker-container{ ...@@ -601,4 +605,15 @@ bs-datepicker-container{
} }
} }
.confirm_modal_content{
width: 300px;
background: #fff;
border-radius: 10px;
margin: 0 auto;
padding: 15px;
button{
margin:5px;
}
}
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