@extends('layout.master')
@section('content')
<div class="right_col" role="main">
<div class="">
{{-- <div class="page-title">
<div class="title_left">
<h3>Staff <small>List</small></h3>
</div>
</div> --}}
<div class="clearfix"></div>
<div class="row" style="display: block;">
<div class="col-md-12 col-sm-12">
<div class="x_panel">
<div class="x_title d-flex justify-content-between align-items-center">
<div class="gap-2 d-flex">
<h2>Ride Details</h2>
@switch($ride->status)
@case(0)
<span class="badge badge-warning text-white px-3 py-2 ml-4"
style="font-size: medium">Pending</span>
@break
@case(1)
<span class="badge badge-dark text-white px-3 py-2 ml-4"
style="font-size: medium">Assigned</span>
@break
@case(2)
<span class="badge badge-info text-white px-3 py-2 ml-4"
style="font-size: medium">Ongoing</span>
@break
@case(3)
<span class="badge badge-success text-white px-3 py-2 ml-4"
style="font-size: medium">Completed</span>
@break
@case(4)
<span class="badge badge-danger text-white px-3 py-2 ml-4"
style="font-size: medium">Cancelled</span>
@break
@default
<span class="badge badge-secondary text-white px-3 py-2 ml-4"
style="font-size: medium">Unknown</span>
@endswitch
</div>
</div>
<div class="x_content">
<div class="row">
<div class="col-md-9 col-sm-9">
<ul class="stats-overview">
<li>
<span class="name"><i class="fa fa-calendar"></i> Date </span>
<span
class="value text-success">{{ \Carbon\Carbon::parse($ride->ride_date)->format('d-m-Y') }}</span>
</li>
<li>
<span class="name"><i class="fa fa-road"></i> Distance </span>
<span class="value text-success">{{ $ride->distance_km }}
<small>Km</small></span>
</li>
<li>
<span class="name"><i class="fa fa-money"></i> Transporter Earnings </span>
<span class="value text-success">{{ $ride->fare }} <small>INR</small></span>
</li>
</ul>
<ul class="stats-overview">
<li>
<span class="name"><i class="fa fa-percent"></i> GST Charges </span>
<span class="value text-success">
{{ $ride->gst_on_commission }} <small>INR</small>
</span>
</li>
<li>
<span class="name"><i class="fa fa-briefcase"></i> Platform Fee </span>
<span class="value text-success">
{{ $ride->ride_commission }} <small>INR</small>
</span>
</li>
<li>
<span class="name"><i class="fa fa-money"></i> Total Customer Amount </span>
<span class="value text-success">
{{ $ride->total_customer_amount }} <small>INR</small>
</span>
</li>
</ul>
<br />
<div id="map" style="height: 350px; width: 100%;"></div>
</div>
<!-- Ride Details Sidebar -->
<div class="col-md-3 col-sm-3">
<section class="panel">
<div class="x_title">
<h2>Info</h2>
<div class="clearfix"></div>
</div>
<div class="panel-body">
<h6 class="green"><i class="fa fa-taxi"></i>
Ride Info
</h6>
<div class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Date</p>
<p>{{ \Carbon\Carbon::parse($ride->ride_date)->format('M d, Y') }}</p>
</div>
<div class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Pickup Time</p>
<p>{{ \Carbon\Carbon::parse($ride->pickup_time)->format('h:i A') }}</p>
</div>
@if ($ride->return_time)
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Return Time</p>
<p>{{ \Carbon\Carbon::parse($ride->return_time)->format('h:i A') }}</p>
</div>
@endif
<div class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Pickup Location</p>
<p>{{ $ride->locations['pickup_location'] ?? 'N/A' }}</p>
</div>
<div class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Drop Location</p>
<p>{{ $ride->locations['drop_location'] ?? 'N/A' }}</p>
</div>
</div>
@if ($ride->booking && $ride->booking->transporter)
<hr>
<div class="panel-body">
<h6 class="green"><i class="fa fa-user"></i>
Transporter
</h6>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Name</p>
<p>{{ $ride->booking->transporter->company_name ?? '' }}</p>
</div>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Contact Person</p>
<p>{{ $ride->booking->transporter->contact_person ?? '' }}</p>
</div>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Email</p>
<p>{{ $ride->booking->transporter->email ?? '' }}</p>
</div>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Phone</p>
<p>{{ $ride->booking->transporter->phone ?? '' }}</p>
</div>
</div>
@endif
@if ($ride->booking && $ride->booking->customer)
<hr>
<div class="panel-body">
<div class="d-flex justify-content-between align-items-center">
<h6 class="green mb-0">
<i class="fa fa-user me-1"></i> Customer
</h6>
{{-- Profile image on right side --}}
<img src="{{ asset('images/user.png') }}" alt="Customer Profile"
class="rounded-circle" width="40" height="40">
</div>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Name</p>
<p>{{ $ride->booking->customer->first_name ?? '' }}
{{ $ride->booking->customer->last_name ?? '' }}</p>
</div>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Email</p>
<p>{{ $ride->booking->customer->email ?? '' }}</p>
</div>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Phone</p>
<p>{{ $ride->booking->customer->phone ?? '' }}</p>
</div>
</div>
@endif
@if ($ride->vehicle)
<hr>
<div class="panel-body">
<div class="d-flex justify-content-between align-items-center">
<h6 class="green mb-0">
<i class="fa fa-user me-1"></i> Vehicle
</h6>
{{-- Profile image on right side --}}
<img src="{{ $ride->vehicle->vehicle_image ? asset('storage/' . $ride->vehicle->vehicle_image) : asset('images/texi.jpg') }}"
alt="Customer Profile" class="rounded-circle" width="40"
height="40">
</div>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Registration No</p>
<p>{{ $ride->vehicle->registration_number ?? 'Not Assigned' }}</p>
</div>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Make</p>
<p>{{ $ride->vehicle->make ?? '' }}</p>
</div>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Model</p>
<p>{{ $ride->vehicle->model ?? '' }}</p>
</div>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Year</p>
<p>{{ $ride->vehicle->year ?? '' }}</p>
</div>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Capacity</p>
<p>{{ $ride->vehicle->capacity_kg ?? '' }}</p>
</div>
</div>
@endif
@if ($ride->driver)
<hr>
<div class="panel-body">
<div class="d-flex justify-content-between align-items-center">
<h6 class="green mb-0">
<i class="fa fa-user me-1"></i> Driver
</h6>
{{-- Profile image on right side --}}
<img src="{{ $ride->driver->image ? asset('storage/' . $ride->driver->image) : asset('images/user.png') }}"
alt="Customer Profile" class="rounded-circle" width="40"
height="40">
</div>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Name</p>
<p>{{ $ride->driver->name ?? 'Not Assigned' }}</p>
</div>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Phone</p>
<p>{{ $ride->driver->phone ?? '' }}</p>
</div>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Email</p>
<p>{{ $ride->driver->email ?? '' }}</p>
</div>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">License No</p>
<p>{{ $ride->driver->license_number ?? '' }}</p>
</div>
<div
class="project_detail d-flex justify-content-between align-items-center">
<p class="title">Experience</p>
<p>{{ $ride->driver->experience_years ? $ride->driver->experience_years . ' years' : 'N/A' }}
</p>
</div>
</div>
@endif
</section>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="reasonModal" tabindex="-1" role="dialog" aria-labelledby="reasonModalLabel">
<div class="modal-dialog" role="document">
{{-- <form action="{{ route('ride.request.change', $ride->id) }}" method="POST"> --}}
@csrf
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Request Driver/Vehicle Change</h5>
<button type="button" class="close" data-dismiss="modal"><span>×</span></button>
</div>
<div class="modal-body">
<div class="form-group">
<label for="reason">Reason for Change</label>
<textarea name="reason" class="form-control" required placeholder="Enter reason here"></textarea>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-primary">Submit Request</button>
</div>
</div>
{{-- </form> --}}
</div>
</div>
@endsection
@push('script')
<script>
var pickup = [{{ $ride->locations['pickup_lat'] }}, {{ $ride->locations['pickup_lng'] }}];
var drop = [{{ $ride->locations['drop_lat'] }}, {{ $ride->locations['drop_lng'] }}];
var map = L.map('map').setView(pickup, 13);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap contributors'
}).addTo(map);
L.marker(pickup).addTo(map).bindPopup("Pickup: {{ $ride->locations['pickup_location'] }}").openPopup();
L.marker(drop).addTo(map).bindPopup("Drop: {{ $ride->locations['drop_location'] }}");
var routeLine = L.polyline([pickup, drop], {
color: 'blue',
weight: 5
}).addTo(map);
map.fitBounds(routeLine.getBounds());
</script>
@endpush