@extends('frontend.master')

@section('title', $infoCat->seo_title != null ? $infoCat->seo_title : $infoCat->title)
@section('description', $infoCat->seo_description)
@section('keywords', $infoCat->keywords)

@section('content')

<div class="c-breadcrumb-outer">
  <div class="container">
    {{ Breadcrumbs::render('cat-post', $infoCat) }}
  </div><!-- container -->
</div>
<div class="container">
    <div class="l-content clearfix">
        <div class="l-main">
            <div class="c-bigtitle">
                <h1>{{ $nameCat }}</h1>
            </div>
            <div id="list-posts">
                @if ( count($listPostByCategories) > 0 )
                <div class="c-news-list">
                    @foreach ( $listPostByCategories as $value )
                    <div class="b-grid">
                        <div class="b-grid__img"><a href="{{ route('post', ['cat' => $value->slug ]) }}"><img src="{{ url('/images/'.$value->image) }}" alt="{{ $value->title }}"></a></div>
                        <div class="b-grid__content">
                            <div class="b-grid__row"><a class="b-grid__title" href="{{ route('post', ['cat' => $value->slug ]) }}">{{ $value->title }}</a></div>
                            <div class="b-grid__row"><span class="b-grid__time"><i class="far fa-calendar-alt"></i><span class="updated">{{ GeoHelper::formatDate('Y-m-d H:i:s',$value->created_at,'d-m-Y') }}</span></span></div>
                            <div class="b-grid__row b-grid__desc">
                                {!! $value->sub_description !!}
                            </div>
                            <div class="b-grid__row b-grid__btn">
                                <a class="btn btn-outline-secondary is-circle" href="{{ route('post', ['cat' => $value->slug ]) }}">Xem chi tiết</a>
                            </div>
                        </div>
                    </div>
                    @endforeach
                </div>  
                <div class="b-page">
                    {{ $listPostByCategories->appends(Request::all())->links() }}
                </div>
                @endif
            </div>
        </div>
        <!-- l-main -->
        <div class="l-sidebar">
            @include('frontend.layouts.news.sidebar')
        </div>
        <!-- l-sidebar -->
    </div>
    <!-- l-content -->
</div>

<script type="text/javascript">

    $(document).on('click', 'a.page-link', function (event) {
        event.preventDefault();
        ajaxLoad($(this).attr('href'));
    });

    function ajaxLoad(filename) {
        $.ajax({
            type: "GET",
            url: filename,
            contentType: false,
            success: function (data) {
                $("#list-posts").html(data);
                // $('.loading').hide();
                $('html, body').animate({
                    scrollTop:  + 180
                });
            },
            error: function (xhr, status, error) {
                alert(xhr.responseText);
            }
        });
    }

</script>
@endsection