@extends('mentor.layouts.master')
@section('title', 'Books - Resources - Mentor')
@section('pagetitle', 'Books - Resources - Mentor')

@section('content')
    @include('layouts.partials.breadcrumbs', ['breadcrumbs' => [
         ['url' => route('mentor.dashboard'), 'title' => __('Home')],
         ['url' => route('mentor.resources'), 'title' => __('Resources')],
         ['url' => route('mentor.resources.books'), 'title' => __('Book')]
            ]])
    <div class="main">
        @include('layouts.partials.messages')
        <div class="r-heading">
            <h1 class="hd mb-30">{{ __("Books") }}</h1>
            <button class="r-edit">edit</button>
        </div>

        <div class="books-project">
            @foreach($books as $book)

                <div class="book">
                    <a href="{{asset("storage/pdfs/".$book->url)}}"
                       target="_blank">
                        <img width="189px" height="267px"
                             src="{{asset("storage/pdfs/thumbnails/".$book->details['pdf_image'])}}" alt=""/>
                    </a>
                    <div class="row">
                        <div class="col-10"><h2>{{$book->name}}</h2></div>
                        <div class="col-2">
                            <div class="dropdown">
                                <a href="#" id="dropdownMenuButton" data-bs-toggle="dropdown" aria-haspopup="true"
                                   aria-expanded="false">
                                    <i class="fa fa-ellipsis-v" aria-hidden="true"></i>
                                </a>
                                <div class="dropdown-menu float-right" aria-labelledby="dropdownMenuButton">
                                    <a class="dropdown-item"
                                       href="{{asset("storage/pdfs/".$book->url)}}"
                                       target="_blank"
                                    >
                                        <i class="fa fa-eye" aria-hidden="true"></i>
                                        View
                                    </a>
                                    <a class="dropdown-item text-danger js-remove-list-item"
                                       href="{{route('mentor.resources.delete',$book->id)}}"
                                       data-url="{{route('mentor.resources.delete',$book->id)}}"
                                       data-method="DELETE"
                                       data-confirm-title="@lang('Please Confirm')"
                                       data-confirm-text="@lang('Are you sure that you want to delete this resource?')"
                                       data-confirm-delete="@lang('Yes, delete!')"
                                    >
                                        <i class="fa fa-trash" aria-hidden="true"></i>
                                        Delete
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <p>{{$book->description}}</p>

                </div>
            @endforeach
            <div class="book text-center">
                <a href="#" data-modal-target="#addbookModal" class="createModal save">
                    <span class="material-icons-sharp mb-30 modal-view-close">add</span>
                    <p>@forelse($books as $book)@empty
                            No books yet.
                        @endforelse Click to add a new book</p>
                </a>
            </div>
        </div>
    </div>
    <div id="addbookModal" class="modal addnewres-modal">
        <div>
            <div class="reschedule-h1">
                <h1>Add a new book</h1>
            </div>
            <span class="material-icons-sharp modal-view-close" data-bs-dismiss="modal" aria-label="Close">close</span>
        </div>

        <form action="{{route("mentor.resources.books.create")}}" id="resource-form" method="POST"
              enctype="multipart/form-data">
            @csrf
            <div class="menteeInfo form-group">
                <label for="usergender">Book Title</label>
                <input type="text" class="form-control" name="pdf_title" required/>
            </div>
            <div class="menteeInfo form-group">
                <label for="usergender">Book Upload</label>
                <input type="file" class="form-control" name="pdf" required/>
            </div>
            <div class="menteeInfo form-group">
                <label for="usergender">Book Cover Upload</label>
                <input type="file" class="form-control" name="pdf_cover" required/>
            </div>
            <div class="menteeInfo form-group">
                <label for="time">Book Description</label>
                <textarea name="pdf_description" id="time" class="form-control" required cols="30"
                          rows="10"></textarea>
            </div>
            <div class="next">
                <input type="submit" class="btn save">
            </div>
        </form>
    </div>
@endsection


@section('scripts')
    <script src="{{ asset('assets/js/resources.js') }}