@extends('layouts.admin.app')

@section('title', 'Daftar Rekam Medis')

@section('content')
<div class="d-flex justify-content-between align-items-center mb-3">
    <h4>Daftar Rekam Medis</h4>
</div>

@if(session('success'))
<div class="alert alert-success">{{ session('success') }}</div>
@endif

<table id="dtMedicalRecords" class="table table-hover align-middle mb-0">
    <thead class="table-light">
        <tr>
            <th>#</th>
            <th>Nama Pasien</th>
            <th>Tanggal</th>
            <th>Bidan</th>
            <th>Keluhan</th>
            <th class="text-end">Aksi</th>
        </tr>
    </thead>
    <tbody>
        @forelse($records as $record)
        <tr>
            <td>{{ $loop->iteration }}</td>

            <td>
                <strong>
                    {{ $record->appointment->familyMember
                        ? $record->appointment->familyMember->name
                        : $record->appointment->patient->name }}
                </strong><br>

                @if($record->appointment->familyMember)
                    <small class="text-muted">
                        Reservasi oleh: {{ $record->appointment->patient->name }}
                    </small><br>
                @endif

                <small class="text-muted">
                    No. HP: {{ $record->appointment->patient->phone ?? '-' }}
                </small>
            </td>

            <td>
                {{ $record->created_at->format('d M Y') }}<br>
                <small class="text-muted">
                    {{ $record->created_at->format('H:i') }}
                </small>
            </td>

            <td>
                {{ $record->appointment->midwife->name ?? '-' }}
            </td>

            <td style="max-width:300px">
                {{ \Illuminate\Support\Str::limit($record->complaint, 80) }}
            </td>

            <td class="text-end">
                <a href="{{ route('medical-records.show', $record->id) }}"
                    class="btn btn-sm btn-outline-primary">
                    Detail
                </a>
            </td>
        </tr>
        @empty
        <tr>
            <td colspan="6" class="text-center text-muted py-4">
                Belum ada rekam medis
            </td>
        </tr>
        @endforelse
    </tbody>
</table>

{{-- SORT BY TANGGAL TERBARU --}}
@push('scripts')
<script>
$(document).ready(function () {
    $('#dtMedicalRecords').DataTable({
        order: [[2, 'desc']], // kolom tanggal
        pageLength: 10
    });
});
</script>
@endpush

@endsection