# DataTables Configuration untuk Sistem Tambak

## Install DataTables

### 1. Install Package
```bash
composer require yajra/laravel-datatables-oracle
```

### 2. Publish Provider
```bash
php artisan vendor:publish --provider="Yajra\DataTables\DataTablesServiceProvider"
```

### 3. Publish Assets (Opsional)
```bash
php artisan vendor:publish --tag=datatables
```

## Setup

### 1. Add DataTables Service Provider
Edit `config/app.php`:

```php
'providers' => [
    // ...
    Yajra\DataTables\DataTablesServiceProvider::class,
],
```

### 2. Run Artisan Command
```bash
php artisan datatables:refresh
```

## Usage

### Basic Controller
```php
use Yajra\DataTables\Facades\DataTables;

class KolamController extends Controller
{
    public function index()
    {
        return view('kolam.index');
    }

    public function data(Request $request)
    {
        $kolams = TKolam::query();

        return DataTables::of($kolams)
            ->addColumn('action', function ($kolam) {
                return '
                    <button class="btn btn-sm btn-primary">Edit</button>
                    <button class="btn btn-sm btn-danger">Delete</button>
                ';
            })
            ->rawColumns(['action'])
            ->make(true);
    }
}
```

### View (Blade)
```php
<table id="kolam-table" class="table table-striped">
    <thead>
        <tr>
            <th>Nama</th>
            <th>Luas</th>
            <th>Lokasi</th>
            <th>Status</th>
            <th>Aksi</th>
        </tr>
    </thead>
</table>

@section('scripts')
<script>
$(document).ready(function() {
    $('#kolam-table').DataTable({
        processing: true,
        serverSide: true,
        ajax: '{{ route("kolam.data") }}',
        columns: [
            { data: 'nama', name: 'nama' },
            { data: 'luas', name: 'luas' },
            { data: 'lokasi', name: 'lokasi' },
            { data: 'status', name: 'status' },
            { data: 'action', name: 'action', orderable: false, searchable: false }
        ]
    });
});
</script>
@endsection
```

## Features

- ✅ Serverside processing
- ✅ AJAX data loading
- ✅ Pagination
- ✅ Search/Filter
- ✅ Column sorting
- ✅ Responsive design
- ✅ Export buttons (CSV, Excel, PDF, Print)

## Responsive & Performance

- Database query pagination
- Optimized indexes
- AJAX-based loading
- Caching support

## PWA Integration

DataTables works seamlessly with PWA:
- Offline fallback
- Fast loading
- Mobile-friendly