{{-- resources/views/cases/partials/add-payment-modal.blade.php --}}
@php
    $organizations = \App\Models\Organization::orderBy('name')->get();
    $caseDocuments = $case->documents;
@endphp

<div id="addPaymentModal" class="modal-overlay" style="display: none;">
    <div class="modal-content" style="max-width: 700px;">
        <form action="{{ route('cases.payments.store', $case) }}" method="POST">
            @csrf
            <div class="modal-header">
                <h5><i class="bi bi-cash-plus"></i> Добавить платеж</h5>
                <button type="button" class="btn btn-outline btn-sm" onclick="closeModal('addPaymentModal')">
                    <i class="bi bi-x"></i>
                </button>
            </div>
            <div class="modal-body" style="font-size: 13px;">
                @php 
                    $debtSummary = $case->getDebtSummary();
                    $modalRemPrincipal = isset($debtSummary['remaining_principal']) ? $debtSummary['remaining_principal'] : 0;
                    $modalRemPenalty = isset($debtSummary['remaining_penalty']) ? $debtSummary['remaining_penalty'] : 0;
                    $modalRemCourt = isset($debtSummary['remaining_court_costs']) ? $debtSummary['remaining_court_costs'] : 0;
                    $modalTotalRem = isset($debtSummary['total_remaining']) ? $debtSummary['total_remaining'] : 0;
                @endphp
                
                <!-- Остатки -->
                <div style="background: #f9fafb; padding: 12px; border-radius: 6px; margin-bottom: 15px; display: flex; gap: 15px; font-size: 12px; flex-wrap: wrap;">
                    <div><small style="color: var(--gray);">Основной долг:</small> <strong style="color: var(--danger);">{{ number_format($modalRemPrincipal, 0, ',', ' ') }} ₽</strong></div>
                    <div><small style="color: var(--gray);">Пени:</small> <strong style="color: var(--warning);">{{ number_format($modalRemPenalty, 0, ',', ' ') }} ₽</strong></div>
                    <div><small style="color: var(--gray);">Издержки:</small> <strong style="color: var(--info);">{{ number_format($modalRemCourt, 0, ',', ' ') }} ₽</strong></div>
                </div>

                <div class="form-row">
                    <div class="form-group">
                        <label class="form-label">Сумма *</label>
                        <input type="number" step="0.01" class="form-control" name="amount" id="paymentAmount" required oninput="autoAllocate()">
                    </div>
                    <div class="form-group">
                        <label class="form-label">Дата *</label>
                        <input type="date" class="form-control" name="payment_date" value="{{ date('Y-m-d') }}" required>
                    </div>
                </div>

                <!-- Плательщик -->
                <div class="form-row">
                    <div class="form-group">
                        <label class="form-label">Плательщик (организация)</label>
                        <select class="form-control" name="organization_id" id="payerOrg" onchange="togglePayerCustom()">
                            <option value="">-- Выберите или введите свою --</option>
                            @foreach($organizations as $org)
                                <option value="{{ $org->id }}">{{ $org->short_name ?? $org->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="form-group" id="payerCustomGroup" style="display: none;">
                        <label class="form-label">Или укажите плательщика</label>
                        <input type="text" class="form-control" name="organization_custom" id="payerCustom" placeholder="Название организации/банка">
                    </div>
                    <div class="form-group">
                        <button type="button" class="btn btn-outline btn-sm" onclick="togglePayerCustom()" style="margin-top: 24px;">
                            <i class="bi bi-plus-circle"></i> Свой
                        </button>
                    </div>
                </div>

                <!-- Документ-основание -->
                <div class="form-group">
                    <label class="form-label">Платеж по документу (основание)</label>
                    <select class="form-control" name="basis_document_id">
                        <option value="">-- Не указан --</option>
                        @foreach($caseDocuments as $doc)
                            <option value="{{ $doc->id }}">
                                {{ $doc->document_type }} 
                                @if($doc->document_number) №{{ $doc->document_number }} @endif
                                от {{ $doc->document_date ? $doc->document_date->format('d.m.Y') : '' }}
                            </option>
                        @endforeach
                    </select>
                </div>

                <div class="form-row">
                    <div class="form-group">
                        <label class="form-label">Тип платежа</label>
                        <select class="form-control" name="payment_type">
                            <option value="voluntary">Добровольный</option>
                            <option value="enforced">Принудительный</option>
                            <option value="partial">Частичный</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label class="form-label">Способ</label>
                        <select class="form-control" name="payment_method">
                            <option value="">-- Выберите --</option>
                            <option value="bank_transfer">Банковский перевод</option>
                            <option value="cash">Наличные</option>
                            <option value="bailiff">Судебные приставы</option>
                            <option value="terminal">Терминал</option>
                            <option value="online">Онлайн</option>
                            <option value="other">Другое</option>
                        </select>
                    </div>
                </div>

                <!-- Распределение -->
                <div style="margin: 15px 0;">
                    <label class="form-label" style="margin-bottom: 8px;">Распределение платежа</label>
                    <div class="form-row">
                        <div class="form-group">
                            <label style="font-size: 11px;">В счет осн. долга</label>
                            <input type="number" step="0.01" class="form-control" name="principal_portion" id="principalPortion" value="0" onchange="updateAllocInfo()">
                        </div>
                        <div class="form-group">
                            <label style="font-size: 11px;">В счет пени</label>
                            <input type="number" step="0.01" class="form-control" name="penalty_portion" id="penaltyPortion" value="0" onchange="updateAllocInfo()">
                        </div>
                        <div class="form-group">
                            <label style="font-size: 11px;">В счет издержек</label>
                            <input type="number" step="0.01" class="form-control" name="court_cost_portion" id="courtCostPortion" value="0" onchange="updateAllocInfo()">
                        </div>
                    </div>
                    <div style="font-size: 11px; color: var(--gray);" id="allocInfo">Осталось распределить: 0.00 ₽</div>
                </div>

                <div class="form-group">
                    <label class="form-label">Комментарий</label>
                    <textarea class="form-control" name="description" rows="2"></textarea>
                </div>

                <div class="form-group">
                    <label class="form-label">Ссылка на платежный документ</label>
                    <input type="url" class="form-control" name="scan_file" placeholder="https://...">
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-outline" onclick="closeModal('addPaymentModal')">Отмена</button>
                <button type="submit" class="btn btn-success"><i class="bi bi-check-circle"></i> Сохранить</button>
            </div>
        </form>
    </div>
</div>

<script>
var modalDebtData = {
    remPrincipal: {{ $modalRemPrincipal }},
    remPenalty: {{ $modalRemPenalty }},
    remCourt: {{ $modalRemCourt }},
    totalRem: {{ $modalTotalRem }}
};

function togglePayerCustom() {
    var group = document.getElementById('payerCustomGroup');
    var select = document.getElementById('payerOrg');
    if (group.style.display === 'none' || group.style.display === '') {
        group.style.display = 'block';
        select.value = '';
    } else {
        group.style.display = 'none';
        document.getElementById('payerCustom').value = '';
    }
}

function autoAllocate() {
    var amount = parseFloat(document.getElementById('paymentAmount').value) || 0;
    if (modalDebtData.totalRem > 0 && amount > 0) {
        var ratioP = modalDebtData.remPrincipal / modalDebtData.totalRem;
        var ratioPen = modalDebtData.remPenalty / modalDebtData.totalRem;
        document.getElementById('principalPortion').value = Math.round(amount * ratioP * 100) / 100;
        document.getElementById('penaltyPortion').value = Math.round(amount * ratioPen * 100) / 100;
        document.getElementById('courtCostPortion').value = Math.round((amount - amount * ratioP - amount * ratioPen) * 100) / 100;
    }
    updateAllocInfo();
}

function updateAllocInfo() {
    var amount = parseFloat(document.getElementById('paymentAmount').value) || 0;
    var p = parseFloat(document.getElementById('principalPortion').value) || 0;
    var pen = parseFloat(document.getElementById('penaltyPortion').value) || 0;
    var c = parseFloat(document.getElementById('courtCostPortion').value) || 0;
    var allocated = p + pen + c;
    var remaining = amount - allocated;
    var info = document.getElementById('allocInfo');
    if (Math.abs(remaining) < 0.01) {
        info.innerHTML = '<span style="color: var(--success);">✓ Распределено полностью</span>';
    } else if (remaining > 0) {
        info.innerHTML = '<span style="color: var(--warning);">Осталось: ' + remaining.toFixed(2) + ' ₽</span>';
    } else {
        info.innerHTML = '<span style="color: var(--danger);">Превышение: ' + Math.abs(remaining).toFixed(2) + ' ₽</span>';
    }
}
</script>