@extends('backend.layouts.app')


@section('content')
<div class="p-3">
    <div class="card">
        <div class="card-header fw-bold">
            <span class="fw-bold">List of FAQs</span>&emsp;
            <a href="{{ url('admin/faqs/create') }}" class="text-decoration-none">
                <button type="button" class="btn btn-success">
                    <i class="fas fa-edit nav-icon"></i>
                    Add FAQ
                </button>
            </a>
        </div>
    </div>
</div>

@foreach ($faqs as $items)
<div class="p-3">
    <div class="card">
        <div class="card-body">

            <div class="row">
                <div class="col-lg-6">
                    <h5>Question:</h5>
                    <div class="mb-3">
                        <label for="question" class="form-label"> {{$items->question}}</label>
                    </div>

                    <h5>Answer:</h5>
                    <div class="mb-3">
                        <label for="name" class="form-label"> {{$items->answer}}</label>
                    </div>

                    <h5>Date Created:</h5>
                    <div class="mb-3">
                        <label for="name" class="form-label"> {{ date('F j, Y', strtotime($items->created_at)) }}</label>
                    </div>
                </div>

                <div class="col-lg-6">
                    <div>
                        <a href="{{ url('admin/faqs/' .$items->id) }}/edit">
                            <button type="button" class="btn btn-block btn-outline-primary mb-1">Edit</button>
                        </a>
                        <form action="{{ url('admin/faqs/' .$items->id) }}" method="POST"> @csrf @method('delete')
                            <button class="btn btn-block btn-danger" type="submit">Delete</button>
                        </form>
                    </div>
                </div>
            </div>

        </div>
    </div>
</div>
@endforeach

@endsection

@section('js')
<script src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.js"></script>
<script>
    $(document).ready(function() {
        $('.table').DataTable();
    });
</script>

<script>
        // Display SweetAlert for success message
        $(document).ready(function() {
            if (session('success')) {
                Swal.fire({
                    icon: 'success',
                    title: 'Success!',
                    text: 'success!',
                    showConfirmButton: false,
                    timer: 2000
                });
            }

        });
    </script>
@endsection