@extends('frontend.layouts.app')

@section('title') Package - {{ config('app.name') }} @endsection

@section('content')
<!-- Start breadcrumb section -->
<section class="breadcrumb__section breadcrumb__bg">
    <div class="container">
        <div class="row row-cols-1">
            <div class="col">
                <div class="breadcrumb__content text-center">
                    <h1 class="breadcrumb__content--title">Package</h1>
                    <ul class="breadcrumb__content--menu d-flex justify-content-center">
                        <li class="breadcrumb__content--menu__items"><a href="/">Home</a></li>
                        <li class="breadcrumb__content--menu__items"><span>Package</span></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- End breadcrumb section -->
<!-- Start shop section -->
<div class="shop__section section--padding">
    <div class="container">
        <div class="shop__product--wrapper">
            <input type="hidden" name="hidden_page" id="hidden_page" value="1" />
            <input type="hidden" name="hidden_target" id="hidden_target" value="1" />
            <div class="tab_content">
                @include('frontend.packageresult')         
            </div>
            
        </div>
    </div>
</div>
<!-- End shop section -->

<!-- End shipping section -->

@endsection
@push ('after-scripts')
<script>
$(document).ready(function(){
    const fetch_data = (page) => {
    
        $.ajax({ 
            url:"package/?page="+page,
            success:function(data){
                $('.tab_content').html('');
                $('.tab_content').html(data);
            }
        })
    }
    $('body').on('click', '.pager a', function(event){
        event.preventDefault();
        var page = $(this).attr('href').split('page=')[1];
        $('#hidden_page').val(page);
        fetch_data(page);
    });
   
    
});
</script>
@endpush