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

@section('title', 'Ручное сопоставление адресов')

@section('content')
<style>
    .similarity-high { background-color: #d4edda; }
    .similarity-medium { background-color: #fff3cd; }
    .similarity-low { background-color: #f8d7da; }
    .selected-row { background-color: #cce5ff !important; }
    .debt-yes { color: #dc3545; font-weight: bold; }
    .debt-no { color: #28a745; }
    .address-card { border-left: 3px solid #007bff; }
</style>

<div class="container-fluid">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h1>
            <i class="fas fa-hand-pointer me-2"></i>
            Ручное сопоставление адресов
        </h1>
        <div>
            <form action="{{ route('gis.confirm') }}" method="POST" id="confirmForm">
                @csrf
                <button type="submit" class="btn btn-success btn-lg" id="confirmBtn">
                    <i class="fas fa-check-circle me-2"></i>Подтвердить и экспортировать
                </button>
            </form>
            <a href="{{ route('gis.upload') }}" class="btn btn-secondary">
                <i class="fas fa-arrow-left me-2"></i>Назад
            </a>
        </div>
    </div>
    
    <div class="alert alert-info">
        <i class="fas fa-info-circle me-2"></i>
        <strong>Инструкция:</strong> Для каждого запроса выберите соответствующий адрес из базы данных.
        Если подходящего адреса нет, оставьте поле выбора пустым - в ответе будет указано "должник не найден".
    </div>
    
    @foreach($processedRequests as $req)
    <div class="card mb-4 address-card" data-request="{{ $req['request_number'] }}">
        <div class="card-header">
            <div class="d-flex justify-content-between align-items-center">
                <div>
                    <strong>
                        <i class="fas fa-file-alt me-2"></i>
                        Запрос №{{ $req['request_number'] }}
                    </strong>
                    <span class="badge bg-secondary ms-2">Идентификатор: {{ $req['object_identifier'] }}</span>
                </div>
                <div>
                    @if($req['has_debt'])
                        <span class="badge bg-danger">Есть задолженность</span>
                    @elseif($req['selected_consumer'])
                        <span class="badge bg-success">Нет задолженности</span>
                    @else
                        <span class="badge bg-warning">Не выбран</span>
                    @endif
                </div>
            </div>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-md-4">
                    <div class="border rounded p-3 mb-3">
                        <h6 class="text-muted mb-2">
                            <i class="fas fa-map-marker-alt me-1"></i>Адрес из запроса:
                        </h6>
                        <p class="mb-0 fw-bold">{{ $req['address'] }}</p>
                        @if($req['debt_period_start'])
                            <hr class="my-2">
                            <small class="text-muted">
                                Период: {{ $req['debt_period_start'] }} - {{ $req['debt_period_end'] ?? 'н/д' }}
                            </small>
                        @endif
                    </div>
                </div>
                
                <div class="col-md-8">
                    <label class="form-label fw-bold">
                        <i class="fas fa-building me-1"></i>Выберите соответствующий адрес из БД:
                    </label>
                    
                    <select class="form-select address-select mb-3" 
                            data-request="{{ $req['request_number'] }}"
                            data-object-id="">
                        <option value="">-- Не выбран (клиент не найден) --</option>
                        @foreach($req['similar_addresses'] as $addr)
                            <option value="{{ $addr['object_id'] }}" 
                                    data-consumer="{{ json_encode($addr['consumer']) }}"
                                    data-similarity="{{ $addr['similarity'] }}"
                                    {{ $req['selected_consumer'] && $addr['consumer'] && $req['selected_consumer']['id'] == $addr['consumer']['id'] ? 'selected' : '' }}>
                                {{ $addr['address'] }} 
                                (схожесть {{ $addr['similarity'] }}%)
                                @if($addr['consumer'])
                                    - {{ $addr['consumer']['full_name'] }}
                                @else
                                    - НЕТ ВЛАДЕЛЬЦА
                                @endif
                            </option>
                        @endforeach
                    </select>
                    
                    <div class="selected-info mt-2" id="info-{{ $req['request_number'] }}">
                        @if($req['selected_consumer'])
                            @include('gis.partials.consumer-info', ['consumer' => $req['selected_consumer'], 'debt' => $req['has_debt'], 'debt_amount' => $req['debt_amount']])
                        @endif
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endforeach
    
    <div class="mt-4">
        <div class="alert alert-success" id="selectionSummary"></div>
    </div>
</div>

<script>
document.addEventListener('DOMContentLoaded', function() {
    const selects = document.querySelectorAll('.address-select');
    
    function updateSelectionSummary() {
        const total = selects.length;
        let selected = 0;
        let withDebt = 0;
        
        selects.forEach(select => {
            if (select.value) {
                selected++;
                const infoDiv = document.getElementById('info-' + select.dataset.request);
                if (infoDiv && infoDiv.innerHTML.includes('Есть задолженность')) {
                    withDebt++;
                }
            }
        });
        
        const summary = document.getElementById('selectionSummary');
        if (summary) {
            summary.innerHTML = `
                <i class="fas fa-chart-simple me-2"></i>
                <strong>Статистика:</strong> 
                Выбрано адресов: ${selected} из ${total} |
                Из них с задолженностью: ${withDebt}
                ${selected === total ? '<span class="ms-3 badge bg-success">Готово к экспорту!</span>' : ''}
            `;
        }
    }
    
    selects.forEach(select => {
        select.addEventListener('change', function() {
            const requestNumber = this.dataset.request;
            const objectId = this.value;
            const selectedOption = this.options[this.selectedIndex];
            const consumerData = selectedOption.dataset.consumer ? JSON.parse(selectedOption.dataset.consumer) : null;
            
            // Сохраняем выбор через AJAX
            fetch('{{ route("gis.select-match") }}', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    'X-CSRF-TOKEN': '{{ csrf_token() }}'
                },
                body: JSON.stringify({
                    request_number: requestNumber,
                    object_id: objectId
                })
            });
            
            // Обновляем информацию
            const infoDiv = document.getElementById('info-' + requestNumber);
            if (consumerData) {
                // Проверяем долг через AJAX
                fetch('/gis/check-debt/' + consumerData.account_number)
                    .then(response => response.json())
                    .then(data => {
                        infoDiv.innerHTML = `
                            <div class="alert alert-info mt-2">
                                <div class="row">
                                    <div class="col-md-6">
                                        <strong><i class="fas fa-user me-1"></i>Потребитель:</strong><br>
                                        ${consumerData.full_name}<br>
                                        <small>Счет: ${consumerData.account_number}</small>
                                    </div>
                                    <div class="col-md-6">
                                        <strong><i class="fas fa-phone me-1"></i>Телефон:</strong> ${consumerData.phone || 'нет'}<br>
                                        <strong><i class="fas fa-id-card me-1"></i>СНИЛС:</strong> ${consumerData.snils || 'нет'}
                                    </div>
                                </div>
                                <hr class="my-2">
                                <div class="row">
                                    <div class="col-12">
                                        <strong>Задолженность:</strong>
                                        ${data.has_debt ? 
                                            `<span class="debt-yes"><i class="fas fa-exclamation-triangle me-1"></i>Есть - ${data.debt_amount.toLocaleString()} ₽</span>` : 
                                            `<span class="debt-no"><i class="fas fa-check-circle me-1"></i>Нет</span>`
                                        }
                                    </div>
                                </div>
                            </div>
                        `;
                    });
            } else {
                infoDiv.innerHTML = `
                    <div class="alert alert-secondary mt-2">
                        <i class="fas fa-user-slash me-2"></i>
                        Клиент не выбран. В ответе будет указано "должник не найден".
                    </div>
                `;
            }
            
            updateSelectionSummary();
        });
        
        // Триггерим обновление при загрузке
        if (select.value) {
            const event = new Event('change');
            select.dispatchEvent(event);
        }
    });
    
    updateSelectionSummary();
});

// После успешного подтверждения, показываем кнопку скачивания архива
function showDownloadButtons(csvFile, zipFile) {
    const summary = document.getElementById('selectionSummary');
    if (summary && zipFile) {
        summary.innerHTML += `
            <div class="mt-3">
                <a href="/gis/download/${csvFile}" class="btn btn-success me-2">
                    <i class="fas fa-download me-1"></i>Скачать CSV ответ
                </a>
                <a href="/gis/download-archive/${zipFile}" class="btn btn-info">
                    <i class="fas fa-file-archive me-1"></i>Скачать ZIP с документами
                </a>
            </div>
        `;
    }
}

</script>
@endsection