@extends('layouts.app')
@section('landingTitle', 'KlinikSapi.Go | Riwayat Diagnosa')
@section('content')
<section class="bg-white dark:bg-gray-900 pt-20">
  <div class="py-8 px-4 mx-auto max-w-screen-xl text-center lg:py-16">
    <h1 class="mb-4 text-4xl font-extrabold tracking-tight leading-none text-gray-900 md:text-4xl lg:text-5xl dark:text-white">Riwayat Diagnosa Penyakit Sapi</h1>
    <p class="text-lg font-normal text-gray-500 lg:text-xl sm:px-16 lg:px-48 dark:text-gray-400">Kami menyediakan catatan lengkap dari diagnosa sebelumnya untuk membantu Anda memantau dan mengelola kesehatan ternak dengan lebih efektif.</p>
  </div>
</section>

<section class="flex px-44 pb-24">
    <div class="relative overflow-x-auto shadow-md sm:rounded-lg w-full">
        <table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
            <thead class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
                <tr>
                    <th scope="col" class="px-6 py-6" width="5%">
                        #No
                    </th>
                    <th scope="col" class="px-6 py-6" width="25%">
                        Profil
                    </th>
                    <th scope="col" class="px-6 py-6" width="20%">
                        Kode Diagnosa
                    </th>
                    <th scope="col" class="px-6 py-6" width="35%">
                        Penyakit
                    </th>
                    <th scope="col" class="px-6 py-6">
                        Probabilitas
                    </th>
                    <th scope="col" class="px-6 py-6 text-right">
                        Pengaturan
                    </th>
                </tr>
            </thead>
            <tbody>
                @forelse ($diagnosa as $data)
                <tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 hover:bg-gray-50 dark:hover:bg-gray-600">
                    <td class="px-6 py-4">
                        {{ $numtab++ }}
                    </td>
                    <th scope="row" class="flex items-center px-6 py-4 text-gray-900 whitespace-nowrap dark:text-white">
                        @if (Auth::user()->role == 'administrator')
                        <img class="w-10 h-10 rounded-full" src="{{ asset('assets/server-side/profil/administrator.png') }}" alt="Jese image">
                        @else
                        <img class="w-10 h-10 rounded-full" src="{{ asset('assets/server-side/profil/peternak.png') }}" alt="Jese image">
                        @endif
                        <div class="ps-3">
                            <div class="text-base font-semibold">{{ $data->user->name }}</div>
                            <div class="font-normal text-gray-500">{{ $data->user->email }}</div>
                        </div>
                    </th>
                    <td class="px-6 py-4">
                        <strong class="text-blue-500">{{ $data->diagnosaId }}</strong>
                    </td>
                    <td class="px-6 py-4">
                        {{ $data->penyakit->penyakit }}
                    </td>
                    <td class="px-6 py-4">
                        {{ $data->probabilitas == 1.00 ? '100%' : number_format($data->probabilitas * 100) . '%' }}
                    </td>
                    <td class="px-6 py-4">
                        <a href="{{ route('detail.diagnosa', $data->diagnosaId) }}" class="font-medium text-blue-600 dark:text-blue-500 hover:underline">Detail</a>
                    </td>
                </tr>
                @empty
                <tr>
                    <td colspan="6" class="text-center px-6 py-4">
                        <span class="text-xl text-red-500"> ! - belum ada riwayat diagnosa - ! </span>
                    </td>
                </tr>
                @endforelse
            </tbody>
        </table>
    </div>
</section>
@endsection
