@extends('layouts.app')
@section('content')
<div class="app-content">
    <div class="container-fluid">
        <div class="card mt-3">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h3 class="card-title">Districts</h3>
                <a href="{{ route('admin.districts.create') }}" class="btn btn-primary btn-sm ms-auto">Add New</a>
            </div>
            <div class="card-body">
                @if(session('success')) <div class="alert alert-success">{{ session('success') }}</div> @endif
                @if(session('error')) <div class="alert alert-danger">{{ session('error') }}</div> @endif
                <table class="table table-bordered table-striped">
                    <thead><tr><th>ID</th><th>Province id</th><th>Name</th><th>Actions</th></tr></thead>
                    <tbody>
                        @forelse($items ?? [] as $item)
                        <tr>
                            <td>{{ $item->id }}</td><td>{{ $item->province_id }}</td><td>{{ $item->name }}</td>                            <td>
                                <a href="{{ route('admin.districts.edit', $item->id) }}" class="btn btn-sm btn-info">Edit</a>
                                <form action="{{ route('admin.districts.destroy', $item->id) }}" method="POST" class="d-inline" onsubmit="return confirm('Are you sure?');">
                                    @csrf @method('DELETE')
                                    <button type="submit" class="btn btn-sm btn-danger">Delete</button>
                                </form>
                            </td>
                        </tr>
                        @empty
                        <tr><td colspan="10" class="text-center">No records found.</td></tr>
                        @endforelse
                    </tbody>
                </table>
                <div class="mt-3">
                    {{ method_exists($items, 'links') ? $items->links() : '' }}
                </div>
            </div>
        </div>
    </div>
</div>
@endsection