@extends('layouts.app')

@section('title', __('pharmacy::messages.stock.receive'))

@section('content')
    <div class="d-flex flex-wrap justify-content-between align-items-start gap-3 mb-4">
        <div>
            <h1 class="px-title">{{ __('pharmacy::messages.stock.receive') }}</h1>
            <p class="px-subtitle">{{ __('pharmacy::messages.stock.receive_subtitle') }}</p>
        </div>

        <a href="{{ route('pharmacy.stock.index') }}" class="btn px-btn-ghost">{{ __('common.back') }}</a>
    </div>

    <div class="px-layout">
        <div class="min-w-0">
            {{-- Step one: which medicine. A formulary of several hundred entries
                 is not a dropdown, so it is searched — now as it is typed. The
                 note that once stood here said a picker script could not survive
                 the content security policy; that was never quite right. The
                 policy forbids *inline* script, and this behaviour lives in the
                 bundle like every other picker in the product. --}}
            <x-px.panel :title="__('pharmacy::messages.stock.which_medicine')" class="mb-4">
                {{--
                    Searched as it is typed.

                    The panel carries the endpoint and the address a chosen
                    medicine leads to; Clinic.stockPicker reads both. The Search
                    button stays in the markup and is hidden once that script
                    binds, so a browser without JavaScript keeps the form it
                    always had rather than a box that does nothing.
                --}}
                <div data-clinic-stock-picker
                     data-source="{{ route('pharmacy.stock.search') }}"
                     data-action="{{ route('pharmacy.stock.create', ['drug' => '__ID__']) }}"
                     data-choose-label="{{ __('common.select') }}">
                    <form method="GET" action="{{ route('pharmacy.stock.create') }}" class="px-filters">
                        <div class="px-filters__field px-filters__field--wide">
                            <label for="q" class="visually-hidden">{{ __('pharmacy::messages.stock.search') }}</label>
                            <div class="px-search">
                                <i class="bi bi-search" aria-hidden="true"></i>
                                <input type="search" id="q" name="q" class="form-control px-input"
                                       value="{{ $term }}" autofocus autocomplete="off"
                                       data-stock-search
                                       placeholder="{{ __('pharmacy::messages.stock.search_placeholder') }}">
                            </div>
                        </div>

                        <div class="px-filters__actions" data-stock-submit>
                            <button type="submit" class="btn px-btn-primary">{{ __('common.search') }}</button>
                        </div>
                    </form>

                    {{-- Where the live results land. The server-rendered list
                         below is untouched and still answers a real submit. --}}
                    <ul class="list-unstyled mt-3 mb-0 d-none" data-stock-results></ul>

                    <p class="px-hint mt-3 mb-0 d-none" data-stock-empty>
                        {{ __('pharmacy::messages.stock.no_medicine') }}
                    </p>
                </div>

                <div data-stock-static>
                @if ($term !== '')
                    @if ($matches === [])
                        <p class="px-hint mt-3 mb-0">{{ __('pharmacy::messages.stock.no_medicine') }}</p>
                    @else
                        <ul class="list-unstyled mt-3 mb-0">
                            @foreach ($matches as $entry)
                                <li class="d-flex justify-content-between align-items-center gap-2 py-2 border-bottom">
                                    <div class="min-w-0">
                                        <span class="fw-medium d-block">{{ $entry->label() }}</span>
                                        <span class="px-hint">
                                            {{ $entry->genericName ?? '—' }}
                                            @if ($entry->manufacturer)
                                                · {{ $entry->manufacturer }}
                                            @endif
                                        </span>
                                    </div>

                                    <a class="btn btn-sm {{ $chosen?->id === $entry->id ? 'px-btn-primary' : 'px-btn-ghost' }} text-nowrap"
                                       href="{{ route('pharmacy.stock.create', ['q' => $term, 'drug' => $entry->id]) }}">
                                        {{ $chosen?->id === $entry->id ? __('pharmacy::messages.stock.chosen') : __('common.select') }}
                                    </a>
                                </li>
                            @endforeach
                        </ul>
                    @endif
                @endif
                </div>
            </x-px.panel>

            {{-- Step two: the batch. Only once there is something to book it
                 against — an empty form above an unanswered question is how a
                 delivery gets recorded against the wrong medicine. --}}
            @if ($chosen !== null)
                <x-px.panel :title="__('pharmacy::messages.stock.batch_details', ['medicine' => $chosen->label()])">
                    <form method="POST" action="{{ route('pharmacy.stock.store') }}" class="row g-3">
                        @csrf
                        <input type="hidden" name="drug_id" value="{{ $chosen->id }}">

                        <div class="col-12 col-md-4">
                            <label for="batch_number" class="px-field-label">{{ __('pharmacy::messages.stock.batch') }}</label>
                            <input type="text" id="batch_number" name="batch_number" maxlength="60" required
                                   class="form-control px-input @error('batch_number') is-invalid @enderror"
                                   value="{{ old('batch_number') }}">
                            @error('batch_number')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        </div>

                        <div class="col-12 col-md-4">
                            <label for="expiry_date" class="px-field-label">{{ __('pharmacy::messages.stock.expiry_date') }}</label>
                            <input type="text" id="expiry_date" name="expiry_date" required
                                   data-clinic-datepicker="date"
                                   class="form-control px-input @error('expiry_date') is-invalid @enderror"
                                   value="{{ old('expiry_date') }}">
                            @error('expiry_date')<div class="invalid-feedback">{{ $message }}</div>@enderror
                            <span class="px-hint">{{ __('pharmacy::messages.stock.expiry_hint') }}</span>
                        </div>

                        <div class="col-12 col-md-4">
                            <label for="quantity" class="px-field-label">{{ __('pharmacy::messages.stock.quantity') }}</label>
                            <input type="number" id="quantity" name="quantity" min="1" required
                                   class="form-control px-input @error('quantity') is-invalid @enderror"
                                   value="{{ old('quantity') }}">
                            @error('quantity')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        </div>

                        <div class="col-12 col-md-4">
                            <label for="purchase_price" class="px-field-label">
                                {{ __('pharmacy::messages.stock.purchase_price', ['currency' => $currency]) }}
                            </label>
                            <input type="number" step="0.01" min="0" id="purchase_price" name="purchase_price"
                                   class="form-control px-input" value="{{ old('purchase_price') }}">
                        </div>

                        <div class="col-12 col-md-4">
                            <label for="selling_price" class="px-field-label">
                                {{ __('pharmacy::messages.stock.selling_price_per_unit', ['currency' => $currency]) }}
                            </label>
                            <input type="number" step="0.01" min="0" id="selling_price" name="selling_price"
                                   class="form-control px-input" value="{{ old('selling_price') }}">
                            {{-- Said plainly, because the consequence is a bill
                                 that silently misses a line. --}}
                            <span class="px-hint">{{ __('pharmacy::messages.stock.selling_price_hint') }}</span>
                        </div>

                        <div class="col-12 col-md-4">
                            <label for="storage_location" class="px-field-label">{{ __('pharmacy::messages.stock.location') }}</label>
                            <input type="text" id="storage_location" name="storage_location" maxlength="60"
                                   class="form-control px-input" value="{{ old('storage_location') }}"
                                   placeholder="{{ __('pharmacy::messages.stock.location_placeholder') }}">
                        </div>

                        <div class="col-12 col-md-4">
                            <label for="supplier" class="px-field-label">{{ __('pharmacy::messages.stock.supplier') }}</label>
                            <input type="text" id="supplier" name="supplier" maxlength="190"
                                   class="form-control px-input" value="{{ old('supplier') }}">
                        </div>

                        <div class="col-12 col-md-4">
                            <label for="invoice_number" class="px-field-label">{{ __('pharmacy::messages.stock.invoice_number') }}</label>
                            <input type="text" id="invoice_number" name="invoice_number" maxlength="60"
                                   class="form-control px-input" value="{{ old('invoice_number') }}">
                        </div>

                        <div class="col-12 col-md-4">
                            <label for="purchase_date" class="px-field-label">{{ __('pharmacy::messages.stock.purchase_date') }}</label>
                            <input type="text" id="purchase_date" name="purchase_date" data-clinic-datepicker="date"
                                   class="form-control px-input" value="{{ old('purchase_date') }}">
                        </div>

                        <div class="col-12">
                            <button type="submit" class="btn px-btn-primary">
                                {{ __('pharmacy::messages.stock.book_in') }}
                            </button>
                        </div>
                    </form>
                </x-px.panel>
            @endif
        </div>
    </div>
@endsection