@extends('layouts.frontend')
@section('content')
<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-12">
            @can('read_create')
                <div style="margin-bottom: 10px;" class="row">
                    <div class="col-lg-12">
                        <a class="btn btn-success" href="{{ route('frontend.reads.create') }}">
                            {{ trans('global.add') }} {{ trans('cruds.read.title_singular') }}
                        </a>
                    </div>
                </div>
            @endcan

            <div class="pt-2 pb-1">
                <h4>{{ trans('cruds.read.title_singular') }} {{ trans('global.list') }}</h4>
            </div>

            <div class="row">
                @forelse($reads as $read)
                <div class="col-xxl-3 col-xl-3 col-lg-3 col-md-4 col-sm-6 col-xs-6 col-6">
                    <div class="card mb-3">
                        <a href="{{ route('guest.book', $read->book->slug) }}"><img src="{{ $read->book->cover_image->getUrl() ?? '/img/placeholder.jpg' }}" alt="{{ $read->book->title }}" width="100%" /></a>
                        <div class="card-body">
                            <div>
                                <h5><a href="{{ route('guest.book', $read->book->slug) }}">{{ $read->book->title }}</a></h5>
                            </div>
                            <div class="pb-2"><i class="fa fa-user"></i> <a href="{{ route('guest.author', $read->book->author->id) }}">{{ $read->book->author->name ?? '' }}</a></div>
                            @foreach($read->book->categories as $category)
                                <a href="{{ route('guest.category', $category->name) }}"><span class="badge badge-info">{{ $category->name }}</span></a>
                            @endforeach
                            <div class="rating pt-2">
                                <span style="color: orange">
                                    {!! $read->book->rating > 0 ? '<i class="fa fa-star"></i>' : '' !!}
                                    {!! $read->book->rating > 1 ? '<i class="fa fa-star"></i>' : '' !!}
                                    {!! $read->book->rating > 2 ? '<i class="fa fa-star"></i>' : '' !!}
                                    {!! $read->book->rating > 3 ? '<i class="fa fa-star"></i>' : '' !!}
                                    {!! $read->book->rating > 4 ? '<i class="fa fa-star"></i>' : '' !!}
                                </span>
                                <small>{{ $read->book->view }} dilihat ({{ $read->book->bookNotes->count() }} review)</small>
                            </div>
                            @if($read->percentage)
                            <div class="progress mt-2" style="height: 6px;">
                                <div class="progress-bar" role="progressbar" style="width: {{ $read->percentage }}%;" aria-valuenow="{{ $read->percentage }}" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                            <small class="text-muted">{{ $read->percentage }}% &mdash; {{ trans('cruds.read.fields.last_page') }}: {{ $read->last_page }}</small>
                            @endif
                            @if($read->is_favorite)
                            <div><small><i class="fa fa-heart text-danger"></i> {{ trans('cruds.read.fields.is_favorite') }}</small></div>
                            @endif
                            <div class="mt-2">
                                @can('read_show')
                                    <a class="btn btn-xs btn-primary" href="{{ route('frontend.reads.show', $read->id) }}">
                                        {{ trans('global.view') }}
                                    </a>
                                @endcan
                                @can('read_edit')
                                    <a class="btn btn-xs btn-info" href="{{ route('frontend.reads.edit', $read->id) }}">
                                        {{ trans('global.edit') }}
                                    </a>
                                @endcan
                                @can('read_delete')
                                    <form action="{{ route('frontend.reads.destroy', $read->id) }}" method="POST" onsubmit="return confirm('{{ trans('global.areYouSure') }}');" style="display: inline-block;">
                                        <input type="hidden" name="_method" value="DELETE">
                                        <input type="hidden" name="_token" value="{{ csrf_token() }}">
                                        <input type="submit" class="btn btn-xs btn-danger" value="{{ trans('global.delete') }}">
                                    </form>
                                @endcan
                            </div>
                        </div>
                    </div>
                </div>
                @empty
                <div class="col-12">
                    <p class="text-muted">{{ trans('global.no_results') }}</p>
                </div>
                @endforelse
            </div>

        </div>
    </div>
</div>
@endsection