@extends('layouts.app')
@section('title','Nova ordem')
@section('content')
<div class="row between">
    <div><h1>Nova ordem de serviço</h1><p class="muted">Vincule cliente, receita e medidas usadas na confecção dos óculos.</p></div>
    <a class="btn secondary" href="{{ route('orders.index') }}">Voltar</a>
</div>
<div class="card">
    <form method="POST" action="{{ route('orders.store') }}">
        @csrf
        <div class="grid grid-2">
            <div class="field"><label>Cliente *</label><select id="orderCustomer" name="customer_id" required><option value="">Selecione</option>@foreach($customers as $customer)<option value="{{ $customer->id }}" @selected(old('customer_id')==$customer->id)>{{ $customer->name }}{{ $customer->cpf ? ' · '.$customer->cpf : '' }}</option>@endforeach</select></div>
            <div class="field"><label>Receita óptica</label><select id="orderPrescription" name="optical_prescription_id"><option value="">Sem receita vinculada</option>@foreach($prescriptions as $rx)<option value="{{ $rx->id }}" data-customer-id="{{ $rx->customer_id }}" @selected(old('optical_prescription_id')==$rx->id)>{{ $rx->customer->name }} · {{ $rx->issued_at->format('d/m/Y') }}{{ $rx->is_current ? ' · atual' : '' }}</option>@endforeach</select></div>
            <div class="field"><label>Medidas pupilares</label><select id="orderMeasurement" name="pupil_measurement_id"><option value="">Sem medição vinculada</option>@foreach($pupilMeasurements as $measurement)<option value="{{ $measurement->id }}" data-customer-id="{{ $measurement->customer_id }}" @selected(old('pupil_measurement_id')==$measurement->id)>{{ $measurement->customer->name }} · {{ $measurement->measured_at->format('d/m/Y') }} · {{ $measurement->measurement_type === 'near' ? 'perto' : 'longe' }} · DP {{ number_format((float)$measurement->binocular_pd,2,',','.') }} mm</option>@endforeach</select><div class="small muted">São exibidas somente medições do cliente selecionado.</div></div>
            <div class="field"><label>Data do pedido *</label><input type="date" name="ordered_at" value="{{ old('ordered_at',now()->toDateString()) }}" required></div>
            <div class="field"><label>Previsão de entrega</label><input type="date" name="promised_at" value="{{ old('promised_at') }}"></div>
        </div>
        <div class="field"><label>Observações</label><textarea name="notes">{{ old('notes') }}</textarea></div>
        <button class="btn" type="submit">Criar ordem e adicionar itens</button>
    </form>
</div>
<script>
(function () {
    const customer = document.getElementById('orderCustomer');
    const dependentSelects = [document.getElementById('orderPrescription'), document.getElementById('orderMeasurement')];

    function filterOptions() {
        const customerId = customer.value;
        dependentSelects.forEach(select => {
            [...select.options].forEach((option, index) => {
                if (index === 0) return;
                const visible = customerId !== '' && option.dataset.customerId === customerId;
                option.hidden = !visible;
                option.disabled = !visible;
                if (!visible && option.selected) select.value = '';
            });
        });
    }

    customer.addEventListener('change', filterOptions);
    filterOptions();
})();
</script>
@endsection