@extends('front.layouts.app')
@section('css')

@endsection
@section('content')

<div class="page inner-page-layout activities">

    <div class="page-header" style="background-image: url({{url('assets/images/book-cover.jpg')}});">
        <div class="container">
            <div class="row">
                <div class="col-lg-4">
                    <div class="page-thumbnail-wrapper">
                        <img src="/assets/images/thums/thum-03.jpeg" class="page-thumbnail">
                        <div class="text-wrapper">
                            <p class="text m-0"> +{{getCount('news')}} خبر </p>
                        </div><!-- text-wrapper -->
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="page-title-wrapper">
                        <h1 class="page-title"> أخبار وتقارير  </h1>
                    </div>
                </div>
            </div>
        </div>
        <div class="shape"></div>
    </div> <!-- page-header -->

    <div class="page-content">


        <div class="container">

            <div class="d-block mb-5">

                <div class="row mb-0" id="t-body">
                                    </div>

            </div><!-- d-block -->

            <div class="pagination-btn-wrapper">
                <div class="text-center">
                    <input type="hidden" name="page" id="page_no" value="2">
                    <a href="#" id="load_more" class="btn btn-primary w-300px"> عرض المزيد </a>
                </div>
            </div> <!-- pagination-btn-wrapper -->

        </div> <!-- container -->

    </div><!-- page-content -->

</div> <!-- page -->

@endsection
@section('js')

<script>

    $(document).ready(function(){
        $('#load_more').on('click', function(e){
            e.preventDefault();
            var page = $('#page_no').val();
            $.get("{{route('page.news-ajx')}}?page="+page + "&s=" + $('#s_field').val() )
            .done(function(res){
                if (res.next) {
                    $('#page_no').val(res.page);
                    $('#t-body').append(res.view);
                }else{
                    $('#t-body').append(res.view);
                    $('#load_more').remove();

                }
                
            })
        })
    });
</script>
@endsection