@extends('admin.layouts.master')

@section('title', 'Add Memorial Photos')

@section('content')
    @include('admin.partials.page-header', [
        'title' => 'Add Images — '.$funeral->f_name,
        'crumbs' => [
            ['label' => 'Memorials', 'url' => route('admin.funeral.index')],
            ['label' => 'Photos', 'url' => route('admin.funeral.images', $funeral->f_id)],
            ['label' => 'Add'],
        ],
    ])

    <div class="card mt-3">
        <div class="card-body">
            <form method="POST" action="{{ route('admin.funeral.store-images') }}" enctype="multipart/form-data" id="addImagesForm">
                @csrf
                <input type="hidden" name="f_id" value="{{ $funeral->f_id }}">
                <div class="mb-3">
                    <label class="form-label">Select Image <span class="text-danger">*</span></label>
                    <input type="file" name="file" class="form-control" accept=".jpg,.jpeg,.png,.gif,image/*">
                </div>
                <button type="submit" class="btn btn-primary btn-sm">Upload</button>
            </form>
        </div>
    </div>
@endsection

@push('scripts')
<script>
    $(function () {
        $('#addImagesForm').validate({
            rules: {
                file: { required: true, extension: 'jpg,jpeg,png,gif' }
            },
            messages: {
                file: { extension: 'Only jpg, jpeg, png, gif allowed' }
            }
        });
    });
</script>
@endpush