@extends('backend.layouts.app')

@section('breadcrumb')
    <li class="breadcrumb-item">{!! link_to_route('admin.dashboard', __('Home')) !!}</li>
    <li class="breadcrumb-item">{!! link_to_route('admin.albums.index', __('Albums')) !!}</li>
@endsection
@section('content')
    <div class="row justify-content-center">
        <div class="col-md-8">
            <div class="card shadow mb-4">
                <div class="card-header">
                    <div class="d-flex justify-content-between">
                        <h6 class="m-0 font-weight-bold text-primary"><i class="fas fa-info-circle"></i>
                            {{ __('Album Details') }}
                        </h6>
                    </div>
                </div>
                <div class="card-body">
                    <div class="d-flex flex-wrap flex-md-nowrap justify-content-center">
                        @if ($media = $album->getFirstMedia(Constant::THUMB_COLLECTION))
                            <div class="img-container align-self-center m-2">
                                {{ $media->img()->conversion(Constant::THUMB)->attributes(['alt' => $album->name, 'class' => 'img-thumbnail']) }}
                            </div>
                        @endif
                        <div class="table-responsive">
                            <table class="table table-bordered text-dark">
                                <tbody>
                                    <tr>
                                        <td>Id:</td>
                                        <td>{{ $album->id }}</td>
                                    </tr>
                                    <tr>
                                        <td>Name:</td>
                                        <td>{{ $album->name }}</td>
                                    </tr>
                                    <tr>
                                        <td>Order:</td>
                                        <td>{{ $album->ord }}</td>

                                    </tr>
                                    <tr>
                                        <td>Status:</td>
                                        <td> {!! $album->status !!}
                                        </td>
                                    </tr>

                                    <tr>
                                        <td>CreatedAt:</td>
                                        <td> {!! $album->created_at !!}
                                        </td>
                                    </tr>

                                    <tr>
                                        <td>UpdatedAt:</td>
                                        <td> {!! $album->updated_at !!}
                                        </td>
                                    </tr>

                                </tbody>
                            </table>
                        </div>
                    </div>

                    @if ($album->description)
                        <div class="show-more text-dark">
                            {!! $album->description !!}
                        </div>
                        <button class="show-more-button btn btn-outline-dark btn-sm" data-more-title="Read More"
                            data-less-title="Read Less"><i class="fas fa-angle-down"></i></button>
                    @endif
                    {!! Form::open(['route' => ['admin.albums.destroy', 'album' => $album], 'id' => 'deleteForm', 'method' => 'DELETE']) !!}
                    {!! Form::close() !!}
                    <div class="d-flex justify-content-between">
                        <a href="{{ url()->previous() }}" class="btn btn-dark"><span class="fas fa-arrow-left"></span>
                            Back</a>
                        @can('album.edit')
                            <a href="{{ route('admin.albums.edit', ['album' => $album]) }}" class="btn btn-success"><span
                                    class="fas fa-edit"></span> Edit</a>
                        @endcan

                        @can('album.delete')
                            <a href="#" class="btn btn-danger submitDelete"><span class="fas fa-trash"></span> Delete</a>
                        @endcan
                    </div>

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