1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
<ion-header class="theme_dark_bg">
<button ion-button class="nav_btn theme_color floatLeft" (click)="back()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">Trips Details</div>
<button class="nav_btn floatRight"></button>
<div class="clear"></div>
</ion-header>
<ion-content class="themelogin_background">
<div class="cab_trip_detail_wrapper">
<h4>Pickup Point</h4>
<p class="floatLeft textLeft width50">{{details.pickup_area}}</p>
<p class="floatRight textRight width50">{{details.pickup_time}}, {{details.pickup_date}}</p>
<div class="clear"></div>
<br>
<h4>Drop Point</h4>
<p class="floatLeft textLeft width50">{{details.drop_area}}</p>
<p class="floatRight textRight width50" *ngIf="details.drop_time">{{details.drop_time}}, {{details.drop_date}}</p>
<div class="clear"></div>
<br>
<br>
<hr *ngIf="details.assigned_for">
<ion-grid class="p0" *ngIf="details.assigned_for">
<ion-row>
<ion-col col-6 class="p0">
<h4>CAB DETAILS</h4>
<p>{{details.taxi_type}}</p>
<!-- <p>Ford Fiesta</p> -->
<p>{{details.car_no}}</p>
</ion-col>
<ion-col col-6 class="p0">
<h4>DRIVER DETAILS</h4>
<p>{{details.name}}</p>
<p>{{details.phone}}</p>
<p><strong (click)="call()">Call Now</strong></p>
</ion-col>
</ion-row>
</ion-grid>
<br>
<br>
<hr *ngIf="details.item_status=='Complete'">
<span *ngIf="details.item_status=='Complete'">
<h4>PAYMENT DETAILS</h4>
<p class="floatLeft textLeft">Amount Charged</p>
<p class="floatRight textRight">Rs {{details.amount}}</p>
<div class="clear"></div>
<p class="floatLeft textLeft">Discount Amount</p>
<p class="floatRight textRight">Rs {{details.discount}}</p>
<div class="clear"></div>
<p class="floatLeft textLeft">Amount Payable</p>
<p class="floatRight textRight"><strong>Rs {{details.amount - details.discount}}</strong></p>
<div class="clear"></div>
</span>
<br>
<br>
<span *ngIf="details.status=='Complete' && !details.rating">
<h4 class="textCenter">Kindly Rate us for our service.</h4>
<p class="textCenter">Your ratting is important for our better service.</p>
<div class="cab_ratting" (click)="rating($event)">
<input type="radio" id="star5" name="rating" value="5" /><label for="star5" title="Rocks!">5 stars</label>
<input type="radio" id="star4" name="rating" value="4" /><label for="star4" title="Pretty good">4 stars</label>
<input type="radio" id="star3" name="rating" value="3" /><label for="star3" title="Meh">3 stars</label>
<input type="radio" id="star2" name="rating" value="2" /><label for="star2" title="Kinda bad">2 stars</label>
<input type="radio" id="star1" name="rating" value="1" /><label for="star1" title="Sucks big time">1 star</label>
<div class="clear"></div>
</div>
</span>
</div>
</ion-content>
<ion-footer *ngIf="details.status!='Complete' && details.status!='Started' && details.status!='Cancelled'">
<div class="cab_footer_btn_bay">
<button ion-button class="cab_footer_btn single_btn" (click)="cancel()">CANCEL RIDE</button>
<div class="clear"></div>
</div>
</ion-footer>