{{-- resources/views/payments/create.blade.php --}}
@extends('layouts.app')

@section('title', 'Payment Entry')

@section('content')
<div class="d-flex justify-content-between align-items-center mb-3">
    <h3 class="mb-0">Payment Entry</h3>
    <a href="{{ route('payments.index') }}" class="btn btn-secondary btn-sm">Back to List</a>
</div>

<form action="{{ route('payments.store') }}" method="POST" class="card">
    @csrf
    <div class="card-body">
        <div class="row mb-3">
            {{-- Type --}}
            <div class="col-md-3">
                <label class="form-label">Type</label>
                <select name="type"
                        id="typeSelect"
                        class="form-select @error('type') is-invalid @enderror">
                    <option value="to_supplier" {{ old('type') === 'to_supplier' ? 'selected' : '' }}>
                        To Supplier (Pay)
                    </option>
                    <option value="from_customer" {{ old('type') === 'from_customer' ? 'selected' : '' }}>
                        From Customer (Receive)
                    </option>
                </select>
                @error('type')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>

            {{-- Party (Supplier / Customer) --}}
            <div class="col-md-3">
                <label class="form-label">Party</label>

                {{-- Supplier select --}}
                <select id="supplierSelect"
                        class="form-select party-select @error('party_id') is-invalid @enderror"
                        name="party_id">
                    <option value="">-- Select Supplier --</option>
                    @foreach($suppliers as $s)
                        <option value="{{ $s->id }}"
                            data-party-type="supplier"
                            {{ old('party_id') == $s->id && old('party_type','supplier') === 'supplier' ? 'selected' : '' }}>
                            {{ $s->name }}
                            @if(isset($s->current_due))
                                (Due: {{ number_format($s->current_due,2) }})
                            @endif
                        </option>
                    @endforeach
                </select>

                {{-- Customer select --}}
                <select id="customerSelect"
                        class="form-select party-select @error('party_id') is-invalid @enderror"
                        name="party_id"
                        style="display:none;">
                    <option value="">-- Select Customer --</option>
                    @foreach($customers as $c)
                        <option value="{{ $c->id }}"
                            data-party-type="customer"
                            {{ old('party_id') == $c->id && old('party_type') === 'customer' ? 'selected' : '' }}>
                            {{ $c->name }}
                            @if(isset($c->current_due))
                                (Due: {{ number_format($c->current_due,2) }})
                            @endif
                        </option>
                    @endforeach
                </select>

                {{-- Hidden party_type --}}
                <input type="hidden" name="party_type" id="party_type"
                       value="{{ old('party_type','supplier') }}">

                @error('party_id')
                    <div class="invalid-feedback d-block">{{ $message }}</div>
                @enderror
                @error('party_type')
                    <div class="invalid-feedback d-block">{{ $message }}</div>
                @enderror
            </div>

            {{-- Date (auto today) --}}
            <div class="col-md-3">
                <label class="form-label">Date</label>
                <input type="date"
                       name="date"
                       class="form-control @error('date') is-invalid @enderror"
                       value="{{ old('date', now()->format('Y-m-d')) }}">
                @error('date')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>

            {{-- Method dropdown --}}
            <div class="col-md-3">
                <label class="form-label">Method</label>
                <select name="method"
                        class="form-select @error('method') is-invalid @enderror">
                    <option value="">-- Select Method --</option>
                    <option value="cash"   {{ old('method') === 'cash' ? 'selected' : '' }}>Cash</option>
                    <option value="nagad"  {{ old('method') === 'nagad' ? 'selected' : '' }}>Nagad</option>
                    <option value="bkash"  {{ old('method') === 'bkash' ? 'selected' : '' }}>bKash</option>
                    <option value="rocket" {{ old('method') === 'rocket' ? 'selected' : '' }}>Rocket</option>
                    <option value="bank"   {{ old('method') === 'bank' ? 'selected' : '' }}>Bank Transfer</option>
                    <option value="cheque" {{ old('method') === 'cheque' ? 'selected' : '' }}>Cheque</option>
                    <option value="other"  {{ old('method') === 'other' ? 'selected' : '' }}>Others</option>
                </select>
                @error('method')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>
        </div>

        {{-- Amount + Ref --}}
        <div class="row mb-3">
            <div class="col-md-3">
                <label class="form-label">Amount</label>
                <input type="number"
                       step="0.01"
                       name="amount"
                       class="form-control @error('amount') is-invalid @enderror"
                       value="{{ old('amount') }}">
                @error('amount')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>

            <div class="col-md-3">
                <label class="form-label">Ref No</label>
                <input type="text"
                       name="ref_no"
                       class="form-control @error('ref_no') is-invalid @enderror"
                       value="{{ old('ref_no') }}">
                @error('ref_no')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>
        </div>

        {{-- Note --}}
        <div class="mb-3">
            <label class="form-label">Note</label>
            <textarea name="note"
                      rows="3"
                      class="form-control @error('note') is-invalid @enderror">{{ old('note') }}</textarea>
            @error('note')
                <div class="invalid-feedback">{{ $message }}</div>
            @enderror
        </div>
    </div>

    <div class="card-footer text-end">
        <button type="submit" class="btn btn-success">Save</button>
    </div>
</form>
@endsection

@push('scripts')
<script>
document.addEventListener('DOMContentLoaded', function () {
    const typeSelect     = document.getElementById('typeSelect');
    const supplierSelect = document.getElementById('supplierSelect');
    const customerSelect = document.getElementById('customerSelect');
    const partyTypeInput = document.getElementById('party_type');

    function togglePartySelect() {
        const type = typeSelect.value;

        if (type === 'to_supplier') {
            supplierSelect.style.display = '';
            supplierSelect.disabled = false;

            customerSelect.style.display = 'none';
            customerSelect.disabled = true;

            partyTypeInput.value = 'supplier';
        } else {
            customerSelect.style.display = '';
            customerSelect.disabled = false;

            supplierSelect.style.display = 'none';
            supplierSelect.disabled = true;

            partyTypeInput.value = 'customer';
        }
    }

    typeSelect.addEventListener('change', togglePartySelect);

    // প্রথম লোডেই সঠিক field দেখাই
    togglePartySelect();
});
</script>
@endpush