@extends('layouts.app')
@section('landingTitle', 'KlinikSapi.Go | Detail 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">Detail Riwayat Diagnosa</h1>
    <p class="text-lg font-normal text-gray-500 lg:text-xl sm:px-16 lg:px-48 dark:text-gray-400">
        Detail Diagnosa Penyakit dengan Kode Diagnosa <strong class="text-blue-500">{{ $detail[0]->diagnosaId }}</strong>
    </p>
  </div>
</section>

<section class="flex px-44 pb-24">
    <div class="relative overflow-x-auto shadow-md sm:rounded-lg w-full">
        <h2 class="text-2xl text-blue-600 my-8 px-10">> Detail Diagnosa Gejala</h2>
        <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 text-center">
                <tr>
                    <th scope="col" class="px-6 py-6" width="10%">
                        #No
                    </th>
                    <th scope="col" class="px-6 py-6" width="35%">
                        Kode Gejala
                    </th>
                    <th scope="col" class="px-6 py-6" width="35%">
                        Nama Gejala
                    </th>
                    <th scope="col" class="px-6 py-6" width="20%">
                        Nilai Plausability
                    </th>
                </tr>
            </thead>
            <tbody>
                @foreach ($detail 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 text-center">
                    <td class="px-6 py-4">
                        {{ $numtab++ }}
                    </td>
                    <td class="px-6 py-4">
                        <strong class="text-blue-500">{{ $data->gejala->gejalaId }}</strong>
                    </td>
                    <td class="px-6 py-4">
                        {{ $data->gejala->gejala }}
                    </td>
                    <td class="px-6 py-4">
                        {{ $data->nilaiKeyakinan }}
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>
        <h2 class="text-2xl text-blue-600 my-8 px-10">> Hasil Diagnosa Penyakit</h2>
        <p class="px-10 text-xl text-justify">Berdasarkan perhitungan metode Dempster-Shafer, penyakit yang paling mungkin adalah <strong class="text-blue-600">{{ $diagnosa->penyakit->penyakit }}</strong> dengan nilai keyakinan sebesar <strong class="text-blue-600">{{ $diagnosa->probabilitas }}</strong> atau bila dipersentasekan menjadi <strong class="text-blue-600">{{ $diagnosa->probabilitas == 1.00 ? '100%' : number_format($diagnosa->probabilitas * 100) . '%' }}</strong>. Solusi pencegahan dapat dilakukan <strong class="text-red-600 lowercase">{{ \App\Models\Penyakit::find($diagnosa->penyakit->penyakitId)->solusi }}</strong>.</p>
        <table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
            <tfoot>
                <tr>
                    <td colspan="4" class="text-right px-6 py-10">
                        <div class="flex gap-10">
                            <a href="{{ route('riwayat.diagnosa', Auth::user()->id) }}" class="text-white w-1/2 bg-red-500 hover:bg-red-600 focus:ring-4 focus:outline-none focus:ring-red-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-red-600 dark:hover:bg-red-500 dark:focus:ring-red-600">Kembali</a>
                            <a href="{{ route('diagnosa.penyakit') }}" class="text-white w-1/2 bg-blue-600 hover:bg-blue-700 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-blue-700 dark:hover:bg-blue-600 dark:focus:ring-blue-700">Diagnosa Kembali</a>
                        </div>
                    </td>
                </tr>
            </tfoot>
        </table>
    </div>
</section>
@endsection