{{-- resources/views/admin/lab_requests/create.blade.php --}}

@extends('layouts.app')

@section('content')

<div style="max-width:1100px;margin:auto;">

    <!-- HEADER -->
    <div style="margin-bottom:25px;">

        <h1 style="
            font-size:28px;
            font-weight:600;
            margin-bottom:6px;
        ">

            Laboratory Requests

        </h1>

        <div style="
            color:#666;
            font-size:15px;
        ">

            Request laboratory investigations for this encounter

        </div>

    </div>

    <!-- PATIENT -->
    <div class="panel"
         style="margin-bottom:20px;background:#eff6ff;">

        <div style="
            display:grid;
            grid-template-columns:1fr 1fr 1fr;
            gap:15px;
            font-size:14px;
            color:#1e3a8a;
        ">

            <div>

                <strong>Patient</strong><br>

                {{ $encounter->first_name }}
                {{ $encounter->last_name }}

            </div>

            <div>

                <strong>Patient No</strong><br>

                <span style="font-family:monospace;">

                    {{ $encounter->patient_no }}

                </span>

            </div>

            <div>

                <strong>Visit</strong><br>

                {{ $encounter->visit_no }}

            </div>

        </div>

    </div>

    <!-- FORM -->
    <form method="POST"
          action="{{ route('admin.lab.requests.store', $encounter->id) }}">

        @csrf

        <div class="panel">

            <!-- LAB TEST CHECKLIST -->
            <div style="margin-bottom:25px;">

                <h3 style="
                    margin-bottom:18px;
                    font-size:18px;
                ">

                    Select Laboratory Tests

                </h3>

                <div style="
                    display:grid;
                    grid-template-columns:1fr 1fr;
                    gap:20px;
                ">

                    <!-- HEMATOLOGY -->
                    <div style="
                        border:1px solid #e5e7eb;
                        border-radius:10px;
                        padding:18px;
                    ">

                        <h4 style="
                            margin-top:0;
                            margin-bottom:15px;
                            color:#111827;
                        ">

                            Hematology

                        </h4>

                        <div style="
                            display:flex;
                            flex-direction:column;
                            gap:12px;
                        ">

                            <label>
                                <input type="checkbox"
                                       name="tests[]"
                                       value="Full Blood Count">

                                Full Blood Count (FBC)
                            </label>

                            <label>
                                <input type="checkbox"
                                       name="tests[]"
                                       value="Hemoglobin">

                                Hemoglobin (HB)
                            </label>

                            <label>
                                <input type="checkbox"
                                       name="tests[]"
                                       value="ESR">

                                ESR
                            </label>

                        </div>

                    </div>

                    <!-- CHEMISTRY -->
                    <div style="
                        border:1px solid #e5e7eb;
                        border-radius:10px;
                        padding:18px;
                    ">

                        <h4 style="
                            margin-top:0;
                            margin-bottom:15px;
                            color:#111827;
                        ">

                            Chemistry

                        </h4>

                        <div style="
                            display:flex;
                            flex-direction:column;
                            gap:12px;
                        ">

                            <label>
                                <input type="checkbox"
                                       name="tests[]"
                                       value="Random Blood Sugar">

                                Random Blood Sugar (RBS)
                            </label>

                            <label>
                                <input type="checkbox"
                                       name="tests[]"
                                       value="Fasting Blood Sugar">

                                Fasting Blood Sugar (FBS)
                            </label>

                            <label>
                                <input type="checkbox"
                                       name="tests[]"
                                       value="Liver Function Test">

                                Liver Function Test (LFT)
                            </label>

                            <label>
                                <input type="checkbox"
                                       name="tests[]"
                                       value="Renal Function Test">

                                Renal Function Test (RFT)
                            </label>

                        </div>

                    </div>

                    <!-- MICROBIOLOGY -->
                    <div style="
                        border:1px solid #e5e7eb;
                        border-radius:10px;
                        padding:18px;
                    ">

                        <h4 style="
                            margin-top:0;
                            margin-bottom:15px;
                            color:#111827;
                        ">

                            Microbiology

                        </h4>

                        <div style="
                            display:flex;
                            flex-direction:column;
                            gap:12px;
                        ">

                            <label>
                                <input type="checkbox"
                                       name="tests[]"
                                       value="Malaria Parasite Test">

                                Malaria Parasite Test
                            </label>

                            <label>
                                <input type="checkbox"
                                       name="tests[]"
                                       value="Urinalysis">

                                Urinalysis
                            </label>

                            <label>
                                <input type="checkbox"
                                       name="tests[]"
                                       value="Stool Analysis">

                                Stool Analysis
                            </label>

                        </div>

                    </div>

                    <!-- SEROLOGY -->
                    <div style="
                        border:1px solid #e5e7eb;
                        border-radius:10px;
                        padding:18px;
                    ">

                        <h4 style="
                            margin-top:0;
                            margin-bottom:15px;
                            color:#111827;
                        ">

                            Serology

                        </h4>

                        <div style="
                            display:flex;
                            flex-direction:column;
                            gap:12px;
                        ">

                            <label>
                                <input type="checkbox"
                                       name="tests[]"
                                       value="HIV Test">

                                HIV Test
                            </label>

                            <label>
                                <input type="checkbox"
                                       name="tests[]"
                                       value="Hepatitis B">

                                Hepatitis B
                            </label>

                            <label>
                                <input type="checkbox"
                                       name="tests[]"
                                       value="Syphilis Test">

                                Syphilis Test
                            </label>

                        </div>

                    </div>

                </div>

            </div>

            <!-- PRIORITY + REQUESTED BY -->
            <div style="
                display:grid;
                grid-template-columns:1fr 1fr;
                gap:20px;
            ">

                <!-- PRIORITY -->
                <div>

                    <label style="
                        display:block;
                        margin-bottom:8px;
                        font-weight:600;
                    ">

                        Priority

                    </label>

                    <select name="priority"
                            style="
                                width:100%;
                                padding:12px;
                                border:1px solid #d1d5db;
                                border-radius:8px;
                            ">

                        <option value="routine">
                            Routine
                        </option>

                        <option value="urgent">
                            Urgent
                        </option>

                        <option value="stat">
                            STAT
                        </option>

                    </select>

                </div>

                <!-- REQUESTED BY -->
                <div>

                    <label style="
                        display:block;
                        margin-bottom:8px;
                        font-weight:600;
                    ">

                        Requested By

                    </label>

                    <input type="text"
                           name="requested_by"
                           placeholder="Doctor / clinician"
                           style="
                                width:100%;
                                padding:12px;
                                border:1px solid #d1d5db;
                                border-radius:8px;
                           ">

                </div>

            </div>

            <!-- NOTES -->
            <div style="margin-top:20px;">

                <label style="
                    display:block;
                    margin-bottom:8px;
                    font-weight:600;
                ">

                    Clinical Notes

                </label>

                <textarea name="clinical_notes"
                          rows="5"
                          placeholder="Reason for investigation, provisional diagnosis, instructions..."
                          style="
                                width:100%;
                                padding:12px;
                                border:1px solid #d1d5db;
                                border-radius:8px;
                          "></textarea>

            </div>

            <!-- ACTIONS -->
            <div style="
                margin-top:25px;
                display:flex;
                gap:12px;
            ">

                <a href="{{ route('admin.encounters.show', $encounter->id) }}"
                   style="
                        padding:12px 18px;
                        background:#f3f4f6;
                        color:#333;
                        border-radius:8px;
                        text-decoration:none;
                   ">

                    Cancel

                </a>

                <button type="submit"
                        style="
                            background:#2563eb;
                            color:white;
                            border:none;
                            padding:12px 20px;
                            border-radius:8px;
                            cursor:pointer;
                            font-weight:600;
                        ">

                    Save Lab Request

                </button>

            </div>

        </div>

    </form>

    <!-- EXISTING REQUESTS -->
    <div class="panel" style="margin-top:25px;">

        <h3 style="margin-bottom:18px;">
            Existing Requests
        </h3>

        @if($requests->isEmpty())

            <div style="
                padding:25px;
                text-align:center;
                color:#777;
                border:1px dashed #ddd;
                border-radius:8px;
            ">

                No laboratory requests added

            </div>

        @else

            <table style="
                width:100%;
                border-collapse:collapse;
                font-size:14px;
            ">

                <thead style="background:#f9fafb;">

                    <tr>

                        <th style="padding:12px;text-align:left;">
                            Request No
                        </th>

                        <th style="padding:12px;text-align:left;">
                            Test
                        </th>

                        <th style="padding:12px;text-align:left;">
                            Priority
                        </th>

                        <th style="padding:12px;text-align:left;">
                            Status
                        </th>

                    </tr>

                </thead>

                <tbody>

                    @foreach($requests as $request)

                        <tr style="border-top:1px solid #eee;">

                            <td style="
                                padding:12px;
                                font-family:monospace;
                                font-weight:600;
                            ">

                                {{ $request->request_no }}

                            </td>

                            <td style="padding:12px;">

                                {{ $request->test_name }}

                            </td>

                            <td style="padding:12px;">

                                {{ ucfirst($request->priority) }}

                            </td>

                            <td style="padding:12px;">

                                {{ ucfirst($request->status) }}

                            </td>

                        </tr>

                    @endforeach

                </tbody>

            </table>

        @endif

    </div>

</div>

@endsection