@extends('layouts.app')

@section('content')
<section class="padding_btm" >
    <!-- 导航 Start -->
    <div class="key_logo">
        <img src="/assets/home/img/nav_logo.jpg">
        <div class="key_location text-nowrap" data-href="{{ route('index.getlocation',['arae'=>session('area'),'callback'=>route('lessons.category',['category_id'=>Request::input('category_id')])]) }}"><i class="icon-map-marker" style="color: #999"></i>&nbsp;@if(!empty(session('area','')))  {{ session('area')->name }}  @else 哈尔滨 @endif&nbsp;<i class="icon-angle-down"></i></div>
    </div>
    <div class="key_describe">按以下关键词筛选您喜欢的内容</div>
    <ul class="key_list">
        <li  data-href="{{ route('lessons.category',['category_id'=>$search_id]) }}" class="@if($search_id == Request::input('category_id')) key_active @endif " ><span>全部</span></li>
        @foreach($categorys as $key => $category)
        <li data-href="{{ route('lessons.category',['category_id'=>$category->id]) }}" class="@if(Request::input('category_id')==$category->id) key_active @endif"  ><span>{{ $category->title }}</span></li>
        @endforeach
    </ul>
    <!-- 导航 End -->
    <!-- 导航 Start -->
    <!-- <div class="wrapper wrapper03" id="wrapper03">
        <div class="scroller">

            <ul class="clearfix" data-display="" data-selector="li" data-show-single="true" data-active-class="active" data-animate="false">
                <li data-number='0' data-href="{{ route('index.lesson',['category_id'=>$search_id]) }}" class=""  id="{{ $search_id }}"><span>全部</span></li>
                @foreach($categorys as $key => $category)
                <li data-number="{{$key+1}}" data-href="{{ route('index.lesson',['category_id'=>$category->id]) }}" class="" id="{{ $category->id }}" ><span>{{ $category->title }}</span></li>
                @endforeach
            </ul>
        </div>
    </div> -->
    <!-- 导航 End -->
    <!-- 列表 Start -->
    <div class="key_result">
        @if(!$lists->isEmpty())
        <ul  class="cn_recommend_list">
            @foreach($lists as $lesson)
            <li >
                <div class="cn_recommend_list_img img-bg" data-href="{{ route('lessons.show',$lesson) }}">
                    <span style="background-image:url({{ $lesson->storage->path  }})"></span>
                    @if($lesson->end_at->timestamp < time())
                    <div class="lesson_overdue" style="background-image:url(/assets/home/img/overdue.png)"></div><!-- 说明：课程已过期时显示 -->
                    @endif
                </div>
                <div class="cn_recommend_btm" >
                    <div class="cn_recommend_left" data-href="{{ route('lessons.show',$lesson) }}">
                        <div class="cn_recommend_left_block" style="padding-top: .5rem;">
                            <div class="cn_recommend_name text-nowrap">{{ $lesson->title }}</div>
                            <div class="cn_recommend_price text-nowrap">价值：￥{{ $lesson->price }}</div>
                        </div>
                        <div class="cn_recommend_left_block">
                            <div class="cn_recommend_company text-nowrap ">{{ $lesson->organ->name }}</div>
                            <div class="cn_recommend_distance text-nowrap">{{ $lesson->organ->distance }}km</div>
                        </div>
                    </div>

                    @if($lesson->button_value!==0)
                    <div class="cn_recommend_btn" style="background-color: #ccc;color: #fff">{{ $lesson->button_text }}</div>
                    @else
                    <div class="cn_recommend_btn ajax-get refresh" data-href="{{ route('cart.store',$lesson) }}">立即报名</div>
                    @endif

                </div>
            </li>
            @endforeach
        </ul>
        @else
        <!-- 暂无课程信息 Start-->
        <div class="classify_null" style="padding-top:6rem;background:none">
            <img src="/assets/home/img/lesson_null2.png" alt="" class="lesson_null_img">
            <div class="lesson_null_text">还没有课程~</div>
        </div>
        <!-- 暂无课程信息 End -->
        @endif
        <!-- 列表 End -->
    </div>
</section>
@endsection