@extends('layouts.admin')
@section('content')
<div class="container-fluid">

    <!-- Page Heading -->
    <div class="d-sm-flex align-items-center justify-content-between mb-4">
        <h1 class="h3 mb-0 text-gray-800">Manage Sections for {{$topic}}</h1>
        {{-- <a href="javascript:void(0)" onclick="$('.add-books').toggle();" class="d-none d-sm-inline-block btn btn-sm btn-primary shadow-sm"><i class="fas fa-plus fa-sm text-white-50"></i> Add book</a> --}}
    </div>

    <div class="row mt-5">
        <div class="col-sm-4 mb-4">
            <form method="POST" action="{{route('admin.add.section')}}" class="container">
                @csrf
                @if ($errors->any())
                    <div class="border border-danger">
                        <ol>
                            @foreach ($errors->all() as $error)
                            <li class="text-danger">{{$error}}</li>
                            @endforeach
                        </ol>
                    </div>
                @endif
                <h4>Add Section</h4>
                @include('includes.section-form')
                <div class="row mt-2">
                    <div class="col-sm-6">
                        <input type="hidden" name="test_id" value="{{$result['id']}}" id="">
                        {{-- <button type="button" onclick="$('.add-books').toggle();" class="btn btn-default w-100">Cancel</button> --}}
                    </div>
                    <div class="col-sm-6">
                        <button type="submit" class="btn btn-warning w-100">Create</button>
                    </div>
                </div>
            </form>
        </div>
        <div class="col-sm-8" style="background:#eeeeee">
            <div class="row py-2">
                <div class="col-sm-12 text-black text-center text-uppercase font-weight-bold p-4">Sections</div>
                @if ($sections->total() == 0)
                    <div class="col-sm-4"></div>
                    <div class="col-sm-4">
                        <div class="card shadow">
                            <div class="card-body">
                                <h3 class="text-center font-italic">No section found</h3>
                            </div>
                        </div>
                    </div>
                @endif
                @foreach ($sections as $section)
                <div class="col-sm-4">
                    <div class="card shadow">
                        <div class="card-body">
                            <h6 class="text-black">{{$section->name}}</h6>
                            <p><small>@php echo$section->description @endphp</small></p>
                            <hr>
                            <p><small>@php echo$section->instructions @endphp</small></p>
                            <hr>
                            <span class="d-block float-right">
                                <a href="javascript:void(0)" onclick="editSection({{$section}})" class="btn btn-success btn-sm"><i class="fa fa-edit"></i></a>
                                <a href="javascript:void(0)" onclick="deleteSection({{$section}})" class="btn btn-danger btn-sm"><i class="fa fa-trash"></i></a>
                            </span>
                        </div>
                    </div>
                </div>
                @endforeach
            </div>
        </div>
    </div>

</div>
@endsection