<link rel="stylesheet" type="text/css" href="<?php echo base_url();?>assets-bustracking/css/style-drivers.css">
    <main class="common_margin" id="main"> 
        <div class="row dash-main-row deleted-row">
            <div class="col-md-12 col-lg-12 p-0">
                 <a href="<?php echo base_url('trips'); ?>">
                    <button type="button" class="btn btn-dark deleted-btn btn-sm">Back</button>
                </a>
            <div class="block-head drive-head">
                            <h3 class="driver-tab-head">Trip Details</h3> 
       
            </div>
<?php $bus_number = $driver_name = $mob_no = ''; 
    if (isset($driver_details) && !empty($driver_details)) {
        $bus_number = $driver_details['reg_no'];
        $driver_name = $driver_details['driver_name'];
        $mob_no = $driver_details['contact_number'];
        
    }
?>
            <div class="row dash-main-row">
                <div class="trip-details-box col-md-6 col-lg-6 p-0">
                    <div class="row details-desc">
                        <div class="col-md-6 route-1">
                            <div class="trips-line">
                                <p class="trips-title">Bus Number: <?php echo $bus_number ?></p>
                            </div>
                            <div class="trips-line">
                                <p class="trips-title">Driver Name: <?php echo $driver_name ?></p>
                            </div>
                        </div>

                        <div class="col-md-6 route-1">
                            <div class="trips-line">
                                <p class="trips-title">Driver Mobile: <?php echo $mob_no ?></p>
                            </div>
                            <div class="trips-line">
                                <p class="trips-title">Dropoff Time: 4:30PM</p>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
            <div class="trip-details-head">
                <p>Bus Stop</p>
                <p>Attendance</p>
                <p>Arrival Time</p>
            </div>
            <div class="row-stops">
                <div class="routes-stops ">
                   
                    <div class="stops-left">
                        <?php if (isset($route_history) && !empty($route_history)) {
                        foreach($route_history as $key => $value){ ?>
                        <div class="stops-indicators">
                            <div class="stops-dot"></div>
                            <div class="stops-line"></div>
                        </div>        

                     <?php  }
                    } ?>

                        <?php if (isset($pending_trips) && !empty($pending_trips)) {
                        foreach($pending_trips as $key => $value){ ?>
                        <div class="stops-indicators">
                            <div class="stops-dot dot-pending"></div>
                            <div class="stops-line"></div>
                        </div>      

                     <?php  }
                    } ?>                       
                                                

                    </div>
                </div>

                <div class="trip-places p-0">
                    <?php if (isset($route_history) && !empty($route_history)) {
                        foreach($route_history as $key => $value){
                            $date_converter = date('d-m-Y');
                            $date = $date_converter.' '.$value['time'];
                         ?>
                     <ul>
                        <li class="trip-details"> 
                            <p class="trips-place"><?php echo $value['place_name'] ?></p>
                            <p class="trips-long"><img src="<?php echo base_url();?>assets-bustracking/images/dashboard/user-icon.svg" alt=""><a href="<?php echo base_url() ?>BustrackingAdmin/trip_details_view/<?php echo base64_encode('_hello_ '.$value['trip_id'].' _hello_ '. $value['route_id'].' _hello_ '.$value['stop_id']); ?>"> <?php echo $value['students'] ?> </a> </p>
                            <p class="trips-time"><?php echo date("g:i A", strtotime($date)); ?></p>
                        </li>
                
                    </ul>       

                     <?php  }
                    } ?>        
                    
                    <?php if (isset($pending_trips) && !empty($pending_trips)) {
                        foreach($pending_trips as $key => $value){
                            
                         ?>
                     <ul>
                        <li class="trip-details pending"> 
                            <p class="trips-place"><?php echo $value['place_name'] ?></p>
                            <p class="trips-long"><img src="<?php echo base_url();?>assets-bustracking/images/dashboard/user-icon.svg" alt=""><a href="<?php echo base_url()?>BustrackingAdmin/trip_details_view/<?php echo base64_encode('_hello_ 00 _hello_ '. $value['route_id'].' _hello_ '.$value['stop_id']); ?>"> <?php echo $value['students'] ?> </a> </p>
                            <p class="trips-time"><?php echo $value['time']  ?></p>
                        </li>
                
                    </ul>       

                     <?php  }
                    } ?>
                  
                </div>
            </div>
              
              </div>
        </div>
    </main> 
<!--End right-top side-->   
</div>

    <script src="assets/js/jquery-3.4.1.min.js" ></script>
    <script src="assets/js/popper.min.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
    <script src="https://cdn.datatables.net/1.10.22/js/jquery.dataTables.min.js"></script>
    <script defer src="assets/js/all.js"></script>
    <script defer src="assets/js/main.js"></script> 
    <script src="assets/owl-carousel/js/owl.carousel.min.js"></script>
    <script>
        $(document).ready(function(){
            $('.user-drpdown').click(function(){
                $('.drpdown-items').toggle();
            });
        }); 
        //table js
        $('#tbl').DataTable( {
            "lengthMenu": [[5,10, 25, 50, -1], [5,10, 25, 50, "All"]]
        } );
        //table js end
    </script> 
    <script>
        function goBack() {
          window.history.back();
        }
      </script>
</body>
</html>