<section class="content">
<div class="row">
<div class="col-sm-12">
<div class="tabbable">
<div class="tab-content no-border padding-24">
<div class="tab-pane fade in active" id="faq-tab-1">
<div class="space-8"></div>
                        <div class="panel-group accordion-style1 accordion-style2" id="faq-list-1">
                            <div class="panel panel-default" id="search_div">
                                <div class="panel-headingnew">  <i class="fa fa-filter filter-icon"></i>
                              <h6 class="filter fliter-text"><?php echo $this->translate('Find Booking');?> </h6>
                                </div>
                                <div id="faq-1-1" class="panel-collapse collapse in" aria-expanded="true">
                                    <div class="panel-body">
                                        <!--<form id="user-management">-->
                                        <div>
                                                <div class="portlet portlet-default">
                                                    <div class="portlet-body">
                                                        <ul id="myTab" class="nav nav-tabs">

<li class="<?php if($tab_type=="general") { echo "active";}else { echo "active";} ?> booking-history-tab" value="general"><a href="#general" data-toggle="tab">
<i class="fa fa-list margin5px"></i><span id="general_fiter_head" class="general_filter_head"><?php echo $this->translate('General');?></span></a></li>

<li class="<?php if($tab_type=="client") echo "active"; ?> booking-history-tab" value="client"><a href="#client" data-toggle="tab" id="new_ClientTab" >
<i class="fa fa-user margin5px" ></i><span class="client_filter_head"><?php echo $this->translate('Client');?></span></a></li>

<li class="<?php if($tab_type=="driver") echo "active"; ?> booking-history-tab" value="driver"><a href="#driver" data-toggle="tab" ><i class="fa fa-user margin5px"></i>
        <span class="driver_filter_head"><?php echo $this->translate('Driver');?></span></a></li>

<li class="<?php if($tab_type=="vehicle") echo "active"; ?> booking-history-tab" value="vehicle"><a href="#vehicle-tab" data-toggle="tab" ><i class="fa fa-road margin5px"></i>
        <span class="vehicle_filter_head"><?php echo $this->translate('Vehicle');?></span></a></li>

<li class="<?php if($tab_type=="location") echo "active"; ?> booking-history-tab" value="location"> <a href="#location-tab" data-toggle="tab" ><i class="fa fa-globe margin5px"></i>
 <span class="location_filter_head"><?php echo $this->translate('Location');?></span></a></li>

  <li class="<?php if($tab_type=="status") echo "active"; ?> booking-history-tab" value="status"><a href="#status-tab"  data-toggle="tab" ><i class="fa fa-gear margin5px"></i>
          <span class="state_filter_head"><?php echo $this->translate('Status');?></span></a></li>

<li class="<?php if($tab_type=="payment") echo "active"; ?> booking-history-tab" value="payment"><a href="#payment-tab" data-toggle="tab" ><i class="fa fa-eur margin5px"></i>
        <span class="payment_filter_head"><?php echo $this->translate('Payment');?></span></a></li>
                                                        </ul>

                                                           <div id="myTabContent" class="tab-content">
                                                                <?php echo $this->partial('general-tab.phtml');?>
                                                            </div>


                                                    </div>
                                                    <!-- /.portlet-body -->
                                                </div>
                                                <!-- /.portlet -->
                                            </div>
                                        <!--</form>-->
                                    </div>
                                </div>
                            </div>

                            <div id="page-wrapper ">
                                <div class="row">
                                    <div class="">
                                        <div class="">
                                            <!-- /.panel-heading -->
                                                <?php echo $this->partial('date-time-bookingtype.phtml');?>
                                            <!-- /.panel-body -->
                                        </div>
                                        <!-- /.panel -->
                                    </div>
                                    <!-- /.col-lg-12 -->
                                </div>
                            </div>

                            <div class="panel panel-default">
                                <div class="panel-headingnew"> <?php echo $this->translate('Booking History List');?> </div>
                                <div id="faq-1-3" class="panel-collapse collapse in" aria-expanded="false">
                                    <div class="box">
                                        <div class="box-body table-responsive listing-data booking-data">
                                            <?php  echo $this->partial('booking-history-listing.phtml'); ?>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>



            <!-- /.widget-box -->
        </div>
        <!-- /.col -->
    </div>

    <!-- /.row -->
    <!-- Main row -->
</section>
<script src="<?php echo $google_map_url; ?>?key=<?php echo $google_map_key; ?>"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(function () {
    myAutoList = setInterval(function () {
    myListTimer();
}, 60000);
function myListTimer() {
    var data = {};
    var url = '/bookinghistory/bookingAutoList';
    contentType = 'application/x-www-form-urlencoded; charset=UTF-8';
    //$("body").mLoading('show');
    $.ajax({
        type: 'POST',
        data: data,
        url: url,
        dataType: "html",
        success: function (result) {
            //$("body").mLoading('hide');
            $(".booking-data").html(result).show();
            $('#myTable').DataTable({
                order: [],
                columnDefs: [{orderable: false, targets: [0]}]
            });
        }
    });
}

/* Code for Automatic Booking List Ends Here*/
});
</script>