@extends('dashboard.layouts.master')
@section('title', 'Blogs')
@section('content')
    <div class="row">
        <div class="card">
            <div class="card-body">
                <div class="card-title mb-0">Added Blog will Appear Here</div>
                <div class="row align-items-end">
                    <div class="col-md-8">
                        <form method="GET" action="{{ route('dashboard.blogs.index') }}">
                            <div class="row g-2">
                                <div class="col-md-5">
                                    <input type="text" name="search" class="form-control" 
                                        placeholder="Search by title" value="{{ request('search') }}">
                                </div>

                                
                                <div class="col-md-2">
                                    <select name="blog_status" class="form-select">
                                        <option value="">All Published Status</option>
                                        <option value="published" {{ request('blog_status') == 'published' ? 'selected' : '' }}>Published</option>
                                        <option value="draft" {{ request('blog_status') == 'draft' ? 'selected' : '' }}>Not Published</option>
                                    </select>
                                </div>
                                <div class="col-md-2">
                                    <select name="status" class="form-select">
                                        <option value="">All Blog Status</option>
                                        <option value="1" {{ request('status') == '1' ? 'selected' : '' }}>Active</option>
                                        <option value="0" {{ request('status') == '0' ? 'selected' : '' }}>Inactive</option>
                                    </select>
                                </div>

                                <div class="col-md-3 d-flex">
                                    <button class="btn btn-primary me-2" type="submit">Search</button>
                                    <a href="{{ route('dashboard.blogs.index') }}" class="btn btn-secondary">Reset</a>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="col-md-4 text-end">
                        <a href="{{ route('dashboard.blogs.create') }}" class="btn btn-primary">
                            <i class="bi bi-plus-circle"></i> Add New Blog
                        </a>
                    </div>
                </div>

                <hr/>
                <div class="table-responsive">
                    <table class="table table-striped table-sm">
                        <thead>
                            <tr>
                                <th scope="col">ID</th>
                                <th scope="col">Name</th>
                                <th scope="col">Published Date</th>
                                <th scope="col">Published Status</th>
                                <th scope="col">Status</th>
                                <th scope="col">Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse ($blogs as $key => $blog)
                                <tr>
                                    <td>{{ $blogs->firstItem() + $key }}</td>
                                    <td><a href="{{ route('dashboard.blogs.show', $blog->id) }}">{{ $blog->title }}</a></td>
                                    <td>{{ $blog->published_at ?? 'N/A' }}</td>
                                    <td>
                                        @if ($blog->published_at < now() || $blog->published_at == today())
                                            <span class="badge bg-success">Published</span>
                                        @else
                                            <span class="badge bg-danger">Not Published</span>
                                        @endif
                                    </td>
                                    <td>
                                        @if ($blog->status == 1)
                                            <span class="badge bg-success">Active</span>
                                        @else
                                            <span class="badge bg-danger">Inactive</span>
                                        @endif
                                        <button type="button" class="btn btn-sm btn-outline-secondary ms-2" title="For quick status change"
                                            onclick=" { document.getElementById('status-form-{{ $blog->id }}').submit(); }">
                                            <i data-feather="refresh-cw"></i>
                                        </button>
                                        <form id="status-form-{{ $blog->id }}" action="{{ route('dashboard.blogs.toggleStatus', $blog->id) }}" method="POST" class="d-none">
                                            @csrf
                                            @method('PATCH')
                                        </form>
                                    </td>
                                    <td>
                                        <a href="{{ route('dashboard.blogs.show', $blog->id) }}" class="btn btn-sm btn-info">View</a>
                                        <a href="{{ route('dashboard.blogs.edit', $blog->id) }}" class="btn btn-sm btn-warning">Edit</a>
                                        <form action="{{ route('dashboard.blogs.destroy', $blog->id) }}" method="POST" style="display:inline-block;">
                                            @csrf
                                            @method('DELETE')
                                            <button type="submit" class="btn btn-sm btn-danger delete_confirmation">Delete</button>
                                        </form>
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="6" class="text-center">No blogs found</td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
                <div class="table-pagination">
                    {{ $blogs->withQueryString()->links() }}
                </div>  
            </div>
        </div>
    </div>
    
@endsection