@extends('theme.master')
@section('title', '訓練計畫')

@section('content')

@section('meta_tags')

<meta name="title" content="{{ $gsetting['bundle_title'] }}">
<meta name="description" content="{{ $gsetting['bundle_meta_data_desc'] }} ">
<meta property="og:title" content="{{ $gsetting['bundle_title'] }} ">
<meta property="og:url" content="{{ url()->full() }}">
<meta property="og:description" content="{{ $gsetting['bundle_meta_data_desc'] }}">
<meta property="og:image" content="{{ gc_asset($gsetting['og_image']) }}">
<meta itemprop="image" content="{{ gc_asset($gsetting['og_image']) }}">
<meta property="og:type" content="website">

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="{{ gc_asset($gsetting['og_image']) }}">
<meta property="twitter:title" content="{{ $gsetting['bundle_title'] }} ">
<meta property="twitter:description" content="{{ $gsetting['bundle_meta_data_desc'] }}">
<meta name="twitter:site" content="{{ url()->full() }}" />

@endsection

@include('admin.message')
<!-- categories-tab end-->
<!-- category-title start -->
<section id="business-home" class="business-home-main-block">
    <div class="container">
        <h1 class="">{{ $title }}</h1>
    </div>
    <section id="business-home-slider" class="business-home-slider-main-block">
        @include('front.training_program.popular_trainings_banner')
    </section>
</section>
<!-- category-slider start -->

<!-- categories start -->
<section id="categories-popularity" class="categories-popularity-main-block category-filters ">
    <div class="container">
        <div class="row">
            <div class="col-12 col-md-12" style="display: flex; align-items: center; justify-content: flex-end;">
                <div class="text-right cate-items">
                    共 {{ $trainings->count() }} 個項目 
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-3">
                <div id="accordion">
                    {{-- 訓練計畫分類列表 --}}
                    @include('front.training_program.categories_sidebar')
                </div>
            </div>
            <div class="col-lg-9 my-col-9">
                <div class="students-bought btm-30">
                    @foreach ($trainings as $training)
                        <div class="course-bought-block protip" data-pt-placement="outside" data-pt-interactive="false"
                            data-pt-title="#prime-next-item-description-block{{ $training->id }}">
                            <div class="row">
                                <div class="col-lg-3 col-md-3">
                                    <a href="{{ route( 'training', [ 'id' => $training->id ] ) }}">
                                        <img
                                            src="{{ gc_asset('images/bundle/' . $training->preview_image) }}" alt="training_program"
                                            class="img-fluid">
                                    </a>
                                </div>
                                <div class="col-lg-9 col-md-9">
                                    <div class="categories-popularity-dtl">
                                        <div class="view-heading btm-10 cate-card-title">
                                            <a href="{{ route( 'training', [ 'id' => $training->id ] ) }}">{{ $training->title }}</a>
                                            @if ( \Carbon\Carbon::now()->diffInDays($training->created_at,true) < 3)
                                                <svg xmlns="http://www.w3.org/2000/svg" width="34" height="24" viewBox="0 0 34 24" class="ml-2">
                                                    <g id="icon_new_default" transform="translate(0 0)">
                                                        <path id="Path_180" data-name="Path 180" d="M4.958,0H29.042A4.95,4.95,0,0,1,34,4.941V19.059A4.95,4.95,0,0,1,29.042,24H4.958A4.95,4.95,0,0,1,0,19.059V4.941A4.95,4.95,0,0,1,4.958,0" transform="translate(0 0)" fill="#b42929"/>
                                                        <path id="Path_181" data-name="Path 181" d="M111.624,135.058a.709.709,0,0,1-.567-.282l-2.975-3.953v3.529a.708.708,0,0,1-1.417,0V128.7a.709.709,0,0,1,1.275-.424l2.975,3.953V128.7a.708.708,0,0,1,1.417,0v5.647a.71.71,0,0,1-.708.706" transform="translate(-99.583 -119.528)" fill="#fafafa"/>
                                                        <path id="Path_182" data-name="Path 182" d="M216.875,135.058h-2.833a.707.707,0,0,1-.708-.706V128.7a.707.707,0,0,1,.708-.706h2.833a.706.706,0,1,1,0,1.412H214.75v4.235h2.125a.706.706,0,1,1,0,1.412" transform="translate(-199.166 -119.528)" fill="#fafafa"/>
                                                        <path id="Path_183" data-name="Path 183" d="M216.875,172.078h-2.833a.706.706,0,1,1,0-1.412h2.833a.706.706,0,1,1,0,1.412" transform="translate(-199.166 -159.372)" fill="#fafafa"/>
                                                        <path id="Path_184" data-name="Path 184" d="M303.626,135.05a.708.708,0,0,1-.673-.483l-.744-2.226-.744,2.226a.662.662,0,0,1-.7.481.708.708,0,0,1-.66-.534l-1.417-5.647a.709.709,0,0,1,1.376-.342l.826,3.3.647-1.936a.739.739,0,0,1,1.344,0l.647,1.936.826-3.3a.709.709,0,0,1,1.376.342l-1.417,5.647a.708.708,0,0,1-.66.534Z" transform="translate(-278.834 -119.521)" fill="#fafafa"/>
                                                        <rect id="Rectangle_19" data-name="Rectangle 19" width="34" height="24" fill="none"/>
                                                    </g>
                                                </svg>
                                            @endif
                                        </div>
                                        <p>{{ str_limit($training->short_detail, $limit = 125, $end = '..') }}
                                        </p>
                                    </div>
                                </div>
                                <div class="col-lg-2 col-md-2 display-none">
                                    <div class="rate text-right">
                                        <ul>
                                            
                                        </ul>
                                        <div class="rating">
                                            <ul>
                                                <li>
                                                    
                                            </ul>
                                        </div>
                                        <ul>
                                            <li>
                                                
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <hr>
                    @endforeach

                    <nav aria-label="Page navigation example">
                        <ul class="pagination justify-content-center">
                            <li class="top-20">{!! $trainings->appends(Request::except('page'))->links() !!}</a></li>
                        </ul>
                    </nav>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- categories end -->
@endsection



@section('custom-script')

<script type="text/javascript">
    
</script>


@endsection