@extends('mobile.module.layouts.content')

@push('meta')

@endpush

@push('css')
    <link rel="stylesheet" href="{{theme_asset('mobile/css/swiper.min.css')}}">
    <link rel="stylesheet" href="{{theme_asset('mobile/css/recuperate.css')}}">
@endpush
<script src="{{theme_asset('mobile/js/swiper.min.js')}}"></script>
@push('js')

@endpush
@section('content')
    @if(!empty($info['img_list']))
        <div class="swiper-container">
            <div class="swiper-wrapper">
                @foreach($info['img_list'] as $k=>$v)
                    <div class="swiper-slide"><img src="{{upload_asset($v)}}" alt=""></div>
                @endforeach
            </div>
            <!--导航组件可以放在container之外-->
            <!--分页器-->
            <div class="swiper-pagination"></div>
        </div>
    @endif

    <div class="recuperate-price">
        {{--<span class="price"><dfn>¥</dfn>{!! $info->price !!}<em>元/人</em></span>--}}
        <span class="number">{!! $info->place !!} {!! $info->visit !!}</span>
    </div>
    <div class="recuperate-title">
        <h2>{!! $info->title !!}</h2>
        <br/>
        <p class="recuperate-title-text">{!! $info->describe !!}</p>
    </div>
    <div class="recuperate-content">
        <div class="eattitle list_height">详情</div>
        <div class="content-box">
            {!! $info->content !!}
        </div>
    </div>
    <div class="refootnav">
        <div class="btns link_gray6">
            <div class="signup downbtn">预报名</div>
        </div>
    </div>
@endsection
@section('script')
    <script>
        var mySwiper = new Swiper('.swiper-container',{
            direction:'horizontal',
            loop:true,
            autoplay:2000,

            pagination:'.swiper-pagination',//分页器
        });
        
        $('.signup').click(function () {
            var id = '{{$info->id}}';
            if (id == 17) {
                qsToast({type: 2, context: '报名人数已满'});
            } else {
                location.href = '{{ route("mobile.recuperate.apply",["id"=> $info->id ]) }}';
            }
        });
    </script>
@endsection