@extends('layouts.doctor')
@section('title', 'Consultation')
@section('content')
    @php $cur = config('clinic.currency.symbol'); @endphp
    <x-page-header :title="'Consultation — '.$patient->full_name" :subtitle="$patient->code.' · '.$patient->phone">
        <x-slot:actions>
            <a href="{{ route('doctor.dashboard') }}" class="btn btn-outline-secondary"><i class="bi bi-arrow-left"></i> Dashboard</a>
        </x-slot:actions>
    </x-page-header>

    @if($errors->any())<div class="alert alert-danger">@foreach($errors->all() as $e)<div>{{ $e }}</div>@endforeach</div>@endif

    <div class="row">
        {{-- Left: patient snapshot + history --}}
        <div class="col-lg-4">
            <div class="card p-3 mb-3">
                <h6 class="text-muted">Patient</h6>
                <p class="mb-1"><strong>{{ $patient->full_name }}</strong></p>
                <p class="mb-1"><small>{{ ucfirst($patient->gender ?? '') }} · DOB {{ $patient->dob?->format('d M Y') ?? '—' }}</small></p>
                <p class="mb-1"><small>Allergies:</small>
                    @forelse($patient->allergies ?? [] as $a)<span class="status-pill badge-danger">{{ $a }}</span>@empty <small>None</small>@endforelse
                </p>
                <p class="mb-0"><small>Conditions:</small>
                    @forelse($patient->conditions ?? [] as $c)<span class="status-pill badge-warning">{{ $c }}</span>@empty <small>None</small>@endforelse
                </p>
            </div>

            <div class="card p-3 mb-3">
                <h6 class="text-muted">Previous Consultations</h6>
                @forelse($history['consultations'] as $h)
                    <div class="border-bottom py-2">
                        <small class="text-muted">{{ $h->consulted_at?->format('d M Y') }}</small><br>
                        <strong>{{ $h->diagnosis?->name ?? '—' }}</strong>
                        @if($h->doctor_notes)<div><small>{{ \Illuminate\Support\Str::limit($h->doctor_notes, 120) }}</small></div>@endif
                    </div>
                @empty
                    <small class="text-muted">No previous consultations.</small>
                @endforelse
            </div>

            <div class="card p-3">
                <h6 class="text-muted">Previous Prescriptions</h6>
                @forelse($history['prescriptions'] as $rx)
                    <div class="border-bottom py-2">
                        <small class="text-muted">{{ $rx->code }} · {{ $rx->prescribed_on?->format('d M Y') }}</small>
                        <div><small>{{ $rx->items->pluck('medicine_name')->join(', ') ?: '—' }}</small></div>
                    </div>
                @empty
                    <small class="text-muted">No previous prescriptions.</small>
                @endforelse
            </div>
        </div>

        {{-- Right: consultation form --}}
        <div class="col-lg-8">
            <form method="POST" action="{{ route('doctor.consultations.save', $consultation) }}" class="card p-4" id="consultForm">
                @csrf @method('PUT')
                <input type="hidden" name="finalize" id="finalize" value="0">

                <h6 class="text-muted">Doctor Notes</h6>
                <textarea name="doctor_notes" class="form-control mb-3" rows="3" placeholder="Observations, response to previous treatment, plan...">{{ old('doctor_notes', $consultation->doctor_notes) }}</textarea>

                <h6 class="text-muted">Vitals</h6>
                <div class="row g-3 mb-3">
                    <div class="col-md-3"><label class="form-label">Weight (kg)</label><input type="number" step="0.1" name="weight_kg" class="form-control" value="{{ old('weight_kg', $consultation->weight_kg) }}"></div>
                    <div class="col-md-3"><label class="form-label">Height (cm)</label><input type="number" step="0.1" name="height_cm" class="form-control" value="{{ old('height_cm', $consultation->height_cm) }}"></div>
                    <div class="col-md-3"><label class="form-label">BP (mmHg)</label><input type="text" name="bp" class="form-control" placeholder="120/80" value="{{ old('bp', $consultation->bp) }}"></div>
                    <div class="col-md-3"><label class="form-label">BMI</label><input type="text" class="form-control" value="{{ $consultation->bmi ?? '—' }}" readonly></div>
                </div>

                <div class="row g-3 mb-3">
                    <div class="col-md-6">
                        <h6 class="text-muted">Chief Complaints <small>(one per line)</small></h6>
                        <textarea name="chief_complaints" class="form-control" rows="3" placeholder="Fever with chills (4 days)&#10;Headache (2 days)">{{ old('chief_complaints', $consultation->chief_complaints) }}</textarea>
                    </div>
                    <div class="col-md-6">
                        <h6 class="text-muted">Clinical Findings <small>(one per line)</small></h6>
                        <textarea name="clinical_findings" class="form-control" rows="3">{{ old('clinical_findings', $consultation->clinical_findings) }}</textarea>
                    </div>
                </div>

                <h6 class="text-muted">Diagnosis &amp; Treatment</h6>
                <div class="row g-3">
                    <div class="col-md-7">
                        <label class="form-label">Clinical Disease / Diagnosis</label>
                        <select name="diagnosis_id" id="diagnosis" class="form-select">
                            <option value="">Select</option>
                            @foreach($diagnoses as $dx)
                                <option value="{{ $dx->id }}" data-cost="{{ $dx->cost_per_sitting }}" @selected(old('diagnosis_id', $consultation->diagnosis_id) == $dx->id)>{{ $dx->name }} ({{ $cur }}{{ number_format($dx->cost_per_sitting, 0) }}/sitting)</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-2">
                        <label class="form-label">Sittings</label>
                        <input type="number" min="1" name="sittings" id="sittings" class="form-control" value="{{ old('sittings', $consultation->sittings) }}">
                    </div>
                    <div class="col-md-3">
                        <label class="form-label">Treatment Cost</label>
                        <input type="text" id="treatmentCost" class="form-control" value="{{ $cur }}0" readonly>
                    </div>
                </div>

                <h6 class="text-muted mt-4">Follow-Up</h6>
                <div class="row g-3">
                    <div class="col-md-6">
                        <label class="form-label">Next Appointment Date</label>
                        <input type="date" name="next_appointment_date" class="form-control" min="{{ now()->addDay()->toDateString() }}" value="{{ old('next_appointment_date', $consultation->next_appointment_date?->toDateString()) }}">
                    </div>
                    <div class="col-md-6">
                        <label class="form-label">Appointment Type</label>
                        <select name="next_appointment_type" class="form-select">
                            <option value="follow_up" @selected($consultation->next_appointment_type === 'follow_up')>Follow-up</option>
                            <option value="new" @selected($consultation->next_appointment_type === 'new')>New</option>
                        </select>
                    </div>
                </div>

                <h6 class="text-muted mt-4">Medicines</h6>
                <div id="medRows"></div>
                <button type="button" class="btn btn-sm btn-outline-secondary mt-2" id="addMed"><i class="bi bi-plus"></i> Add Medicine</button>

                <h6 class="text-muted mt-4">Advice / Instructions</h6>
                <textarea name="advice" class="form-control" rows="2">{{ old('advice', $consultation->prescription?->advice) }}</textarea>

                <div class="mt-4 d-flex gap-2">
                    <button type="submit" class="btn btn-outline-secondary" onclick="document.getElementById('finalize').value='0'">Save Draft</button>
                    <button type="submit" class="btn btn-primary" onclick="document.getElementById('finalize').value='1'">Complete &amp; Generate Prescription</button>
                </div>
            </form>
        </div>
    </div>

    @push('scripts')
    <script>
        const CUR = "{{ $cur }}";
        const meds = @json($medicines->map->only(['id','name','default_dosage','default_frequency','default_duration']));
        const existing = @json($consultation->prescription?->items ?? []);

        // treatment cost live calc
        const dx = document.getElementById('diagnosis'), sit = document.getElementById('sittings'), out = document.getElementById('treatmentCost');
        function calc() {
            const cost = parseFloat(dx.selectedOptions[0]?.dataset.cost || 0);
            const n = parseInt(sit.value || 0, 10);
            out.value = CUR + (cost * n).toFixed(2);
        }
        dx.addEventListener('change', calc); sit.addEventListener('input', calc); calc();

        // medicine rows
        const wrap = document.getElementById('medRows'); let mi = 0;
        function opts(sel) { return meds.map(m => `<option value="${m.id}" ${m.id==sel?'selected':''}>${m.name}</option>`).join(''); }
        function medRow(v = {}) {
            const div = document.createElement('div'); div.className = 'row g-2 mb-2';
            div.innerHTML = `
                <div class="col-md-3"><select class="form-select" name="medicines[${mi}][medicine_id]"><option value="">Medicine</option>${opts(v.medicine_id)}</select></div>
                <div class="col-md-2"><input class="form-control" name="medicines[${mi}][dosage]" placeholder="Dosage" value="${v.dosage||''}"></div>
                <div class="col-md-2"><input class="form-control" name="medicines[${mi}][frequency]" placeholder="Frequency" value="${v.frequency||''}"></div>
                <div class="col-md-2"><input class="form-control" name="medicines[${mi}][duration]" placeholder="Duration" value="${v.duration||''}"></div>
                <div class="col-md-2"><input class="form-control" name="medicines[${mi}][instructions]" placeholder="Instructions" value="${v.instructions||''}"></div>
                <div class="col-md-1"><button type="button" class="btn btn-outline-danger" onclick="this.closest('.row').remove()">&times;</button></div>`;
            mi++; return div;
        }
        document.getElementById('addMed').addEventListener('click', () => wrap.appendChild(medRow()));
        if (existing.length) existing.forEach(i => wrap.appendChild(medRow(i))); else wrap.appendChild(medRow());
    </script>
    @endpush
@endsection