@extends('Dashboard.layouts.main')

@section('title', 'Daftar Layanan')

@section('content')
<div class="content">
    <div class="container-fluid">
        <div class="row">
            <div class="col-12">
                <div class="page-title-box">
                    <div class="page-title-right">
                        <ol class="breadcrumb m-0">
                            <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">Dashboard</a></li>
                            <li class="breadcrumb-item active">Layanan</li>
                        </ol>
                    </div>
                    <h4 class="page-title">Daftar Layanan</h4>
                </div>
            </div>
        </div>
        
        @if(session('success'))
        <div class="row">
            <div class="col-12">
                <div class="alert alert-success alert-dismissible fade show" role="alert">
                    {{ session('success') }}
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
            </div>
        </div>
        @endif

        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-body">
                        <div class="row mb-2">
                            <div class="col-sm-4">
                                @can('customer')
                                <a href="{{ route('services.create') }}" class="btn btn-primary mb-2">
                                    <i class="fe-plus"></i> Tambah Layanan Baru
                                </a>
                                @endcan
                            </div>
                            
                            @can('admin')
                            <div class="col-sm-8">
                                <div class="float-right">
                                    <button type="button" class="btn btn-info mb-2" data-toggle="collapse" data-target="#filterForm">
                                        <i class="fe-filter"></i> Filter
                                    </button>
                                    <button type="button" class="btn btn-danger mb-2 ml-1" onclick="cetakPDF()">
                                        <i class="far fa-file-pdf"></i> Cetak PDF
                                    </button>
                                </div>
                            </div>
                            @endcan
                        </div>
                        
                        @can('admin')
                        <div class="collapse mb-3" id="filterForm">
                            <div class="card card-body">
                                <form action="{{ route('services.index') }}" method="GET" id="filter-form">
                                    <div class="row">
                                        <div class="col-md-3">
                                            <div class="form-group">
                                                <label for="status">Status</label>
                                                <select name="status" id="status" class="form-control">
                                                    <option value="">Semua Status</option>
                                                    <option value="Menunggu" {{ request('status') == 'Menunggu' ? 'selected' : '' }}>Menunggu</option>
                                                    <option value="Diterima" {{ request('status') == 'Diterima' ? 'selected' : '' }}>Diterima</option>
                                                    <option value="Diproses" {{ request('status') == 'Diproses' ? 'selected' : '' }}>Diproses</option>
                                                    <option value="Selesai" {{ request('status') == 'Selesai' ? 'selected' : '' }}>Selesai</option>
                                                    <option value="Ditolak" {{ request('status') == 'Ditolak' ? 'selected' : '' }}>Ditolak</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <div class="form-group">
                                                <label for="tanggal_mulai">Tanggal Mulai</label>
                                                <input type="date" name="tanggal_mulai" id="tanggal_mulai" class="form-control" value="{{ request('tanggal_mulai') }}">
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <div class="form-group">
                                                <label for="tanggal_selesai">Tanggal Selesai</label>
                                                <input type="date" name="tanggal_selesai" id="tanggal_selesai" class="form-control" value="{{ request('tanggal_selesai') }}">
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <div class="form-group">
                                                <label for="parameter">Parameter</label>
                                                <select name="parameter" id="parameter" class="form-control">
                                                    <option value="">Semua Parameter</option>
                                                    <option value="TDS" {{ request('parameter') == 'TDS' ? 'selected' : '' }}>TDS</option>
                                                    <option value="TSS" {{ request('parameter') == 'TSS' ? 'selected' : '' }}>TSS</option>
                                                    <option value="Kekeruhan" {{ request('parameter') == 'Kekeruhan' ? 'selected' : '' }}>Kekeruhan</option>
                                                    <option value="Suhu" {{ request('parameter') == 'Suhu' ? 'selected' : '' }}>Suhu</option>
                                                    <option value="Daya Hantar Listrik" {{ request('parameter') == 'Daya Hantar Listrik' ? 'selected' : '' }}>Daya Hantar Listrik</option>
                                                    <option value="pH" {{ request('parameter') == 'pH' ? 'selected' : '' }}>pH</option>
                                                    <option value="Amonia" {{ request('parameter') == 'Amonia' ? 'selected' : '' }}>Amonia</option>
                                                    <option value="DO" {{ request('parameter') == 'DO' ? 'selected' : '' }}>DO</option>
                                                    <option value="Nitrat" {{ request('parameter') == 'Nitrat' ? 'selected' : '' }}>Nitrat</option>
                                                    <option value="Nitrit" {{ request('parameter') == 'Nitrit' ? 'selected' : '' }}>Nitrit</option>
                                                    <option value="BOD" {{ request('parameter') == 'BOD' ? 'selected' : '' }}>BOD</option>
                                                    <option value="COD" {{ request('parameter') == 'COD' ? 'selected' : '' }}>COD</option>
                                                    <option value="Tembaga" {{ request('parameter') == 'Tembaga' ? 'selected' : '' }}>Tembaga</option>
                                                    <option value="Besi" {{ request('parameter') == 'Besi' ? 'selected' : '' }}>Besi</option>
                                                    <option value="Mangan" {{ request('parameter') == 'Mangan' ? 'selected' : '' }}>Mangan</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12 text-right">
                                            <button type="submit" class="btn btn-primary">
                                                <i class="fe-filter"></i> Terapkan Filter
                                            </button>
                                            <a href="{{ route('services.index') }}" class="btn btn-secondary">
                                                <i class="fe-refresh-cw"></i> Reset Filter
                                            </a>
                                            <button type="button" class="btn btn-danger" onclick="cetakPDF()">
                                                <i class="far fa-file-pdf"></i> Cetak PDF dengan Filter
                                            </button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                        
                        <script>
                            function cetakPDF() {
                                // Salin form filter saat ini
                                const form = document.getElementById('filter-form');
                                const formClone = form.cloneNode(true);
                                
                                // Ubah action dan tambahkan target _blank
                                formClone.action = "{{ route('services.all-pdf') }}";
                                formClone.target = "_blank";
                                formClone.style.display = 'none';
                                
                                // Tambahkan ke body, submit, lalu hapus
                                document.body.appendChild(formClone);
                                formClone.submit();
                                document.body.removeChild(formClone);
                            }
                        </script>
                        @endcan

                        <div class="table-responsive">
                            <table id="datatable" class="table table-centered table-striped table-hover mb-0">
                                <thead>
                                    <tr>
                                        <th>No</th>
                                        {{-- <th>Nama</th>
                                        <th>Email</th>
                                        <th>No HP</th>
                                        <th>Nama Badan Usaha</th> --}}
                                        <th>Jenis Permintaan</th>
                                        <th>Pengujian Air</th>
                                        <th>Parameter</th>
                                        <th>Total Sampel</th>
                                        <th>Jarak Pengambilan</th>
                                        <th>Tanggal Uji</th>
                                        <th>Tanggal Selesai</th>
                                        <th>Biaya Retribusi Parameter</th>
                                        <th>Biaya Retribusi Jarak</th>
                                        <th>Total Biaya</th>
                                        <th>Status</th>
                                        <th>Hasil Uji</th>
                                        <th class="text-center">Aksi</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($services as $key => $service)
                                    <tr>
                                        <td>{{ $key + 1 }}</td>
                                        {{-- <td>{{ $service->user->name }}</td>
                                        <td>{{ $service->user->email }}</td>
                                        <td>{{ $service->user->phone ?? '-' }}</td>
                                        <td>{{ $service->user->business_name ?? '-' }}</td> --}}
                                        <td>{{ Str::limit($service->jenis_permintaan, 25) }}</td>
                                        <td>{{ $service->pengujian_kualitas_air }}</td>
                                        <td>{{ Str::limit($service->parameter, 15) }}</td>
                                        <td>{{ $service->total_sampel }}</td>
                                        <td>{{ $service->jarak_pengambilan_sampel }}</td>
                                        <td>{{ \Carbon\Carbon::parse($service->tanggal_uji)->format('d M Y') }}</td>
                                        <td>
                                            @if($service->tanggal_selesai_uji)
                                                {{ \Carbon\Carbon::parse($service->tanggal_selesai_uji)->format('d M Y') }}
                                            @elseif($service->status == 'Ditolak')
                                                <span class="badge badge-danger">Ditolak</span>
                                            @else
                                                <span class="badge badge-warning">Menunggu</span>
                                            @endif
                                        </td>
                                        <td>
                                            @if($service->biaya_retribusi_parameter)
                                                Rp {{ number_format($service->biaya_retribusi_parameter, 0, ',', '.') }}
                                            @elseif($service->status == 'Ditolak')
                                                <span class="badge badge-danger">Ditolak</span>
                                            @else
                                                <span class="badge badge-warning">Menunggu</span>
                                            @endif
                                        </td>
                                        <td>
                                            @if($service->biaya_retribusi_jarak)
                                                Rp {{ number_format($service->biaya_retribusi_jarak, 0, ',', '.') }}
                                            @elseif($service->status == 'Ditolak')
                                                <span class="badge badge-danger">Ditolak</span>
                                            @else
                                                <span class="badge badge-warning">Menunggu</span>
                                            @endif
                                        </td>
                                        <td>
                                            @if($service->biaya_retribusi)
                                                Rp {{ number_format($service->biaya_retribusi, 0, ',', '.') }}
                                            @elseif($service->status == 'Ditolak')
                                                <span class="badge badge-danger">Ditolak</span>
                                            @else
                                                <span class="badge badge-warning">Menunggu</span>
                                            @endif
                                        </td>
                                        <td>
                                            @php 
                                                $statusClass = [
                                                    'Menunggu' => 'badge-warning',
                                                    'Diterima' => 'badge-info',
                                                    'Diproses' => 'badge-primary',
                                                    'Selesai' => 'badge-success',
                                                    'Ditolak' => 'badge-danger'
                                                ];
                                            @endphp
                                            <span class="badge {{ $statusClass[$service->status] ?? 'badge-secondary' }}">
                                                {{ $service->status }}
                                            </span>
                                            {{-- @if($service->keterangan && ($service->status == 'Diterima' || $service->status == 'Ditolak'))
                                                <a href="#" class="ml-1 btn btn-sm {{ $service->status == 'Diterima' ? 'btn-outline-info' : 'btn-outline-danger' }}" 
                                                   data-toggle="tooltip" 
                                                   data-html="true"
                                                   data-placement="top" 
                                                   title="<strong>Keterangan:</strong><br>{{ $service->keterangan }}"
                                                   style="padding: 1px 5px;">
                                                    <i class="fe-info"></i>
                                                </a>
                                            @endif --}}
                                        </td>
                                        <td>
                                            @if($service->file_hasil_uji)
                                                <a href="{{ asset('uploads/hasil_uji/'.$service->file_hasil_uji) }}" class="btn btn-success btn-sm" target="_blank">
                                                    <i class="far fa-image"></i>
                                                </a>
                                            @elseif($service->status == 'Ditolak')
                                                <span class="badge badge-danger">Ditolak</span>
                                            @else
                                                <span class="badge badge-warning">Menunggu</span>
                                            @endif
                                        </td>
                                        <td class="text-center">
                                            <div class="btn-group">
                                                <a href="{{ route('services.show', $service->id) }}" class="btn btn-info btn-sm" data-toggle="tooltip" title="Lihat Detail">
                                                    <i class="fe-eye"></i>
                                                </a>
                                                <a href="{{ route('services.pdf', $service->id) }}" class="btn btn-danger btn-sm" data-toggle="tooltip" title="Download PDF" target="_blank">
                                                    <i class="far fa-file-pdf"></i>
                                                </a>
                                                @can('admin')
                                                <a href="{{ route('services.edit', $service->id) }}" class="btn btn-primary btn-sm" data-toggle="tooltip" title="Edit">
                                                    <i class="fe-edit"></i>
                                                </a>
                                                <button type="button" class="btn btn-danger btn-sm" data-toggle="tooltip" title="Hapus" onclick="confirmDelete('{{ route('services.destroy', $service->id) }}')">
                                                    <i class="fe-trash-2"></i>
                                                </button>
                                                @endcan
                                            </div>
                                        </td>
                                    </tr>
                                    @empty
                                    <tr>
                                        <td colspan="18" class="text-center">Tidak ada data layanan</td>
                                    </tr>
                                    @endforelse
                                </tbody>
                            </table>
                        </div>
                        
                        <div class="mt-3">
                            {{ $services->links() }}
                        </div>
                    </div> 
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Sertakan Modal Konfirmasi Hapus -->
@include('layouts.delete-modal')
@endsection

@section('scripts')
<script>
    $(function () {
        $('[data-toggle="tooltip"]').tooltip();
    });
</script>
@endsection