@extends('layouts.app')

@section('title', 'Добавить соглашение')

@section('content')
<style>
.form-section {
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
}
.form-section h3 {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #dee2e6;
}
</style>

<div class="container">
    <div class="d-flex justify-content-between align-items-center mb-3">
        <h1>Добавление соглашения</h1>
        <a href="{{ route('agreements.index') }}" class="btn btn-secondary">Назад к списку</a>
    </div>
    
    {{-- Выбор клиента --}}
    <div class="card mb-4">
        <div class="card-header bg-light">
            <h5 class="mb-0">Выбор клиента</h5>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-md-6">
                    <label for="account_search" class="form-label">Поиск по лицевому счету или ФИО</label>
                    <input type="text" id="account_search" class="form-control" placeholder="Введите номер счета или ФИО...">
                </div>
                <div class="col-md-6">
                    <div id="client_info" class="alert alert-secondary mt-2" style="display: none;">
                        <div id="client_details"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <form method="POST" action="{{ route('agreements.store') }}" id="agreementForm">
        @csrf
        <input type="hidden" name="account_number" id="account_number">
        
        {{-- Основная информация --}}
        <div class="form-section">
            <h3>Основные сведения</h3>
            
            <div class="row">
                <div class="col-md-6 mb-3">
                    <label for="agreement_type" class="form-label">Тип соглашения <span class="text-danger">*</span></label>
                    <select class="form-control @error('agreement_type') is-invalid @enderror" id="agreement_type" name="agreement_type" required>
                        <option value="">Выберите тип</option>
                        <option value="deferment">Отсрочка платежа</option>
                        <option value="installment">Рассрочка платежа</option>
                        <option value="settlement">Мировое соглашение</option>
                        <option value="restructuring">Реструктуризация долга</option>
                    </select>
                    @error('agreement_type')<div class="invalid-feedback">{{ $message }}</div>@enderror
                </div>
                
                <div class="col-md-6 mb-3">
                    <label for="agreement_number" class="form-label">Номер соглашения</label>
                    <input type="text" class="form-control @error('agreement_number') is-invalid @enderror" 
                           id="agreement_number" name="agreement_number" value="{{ old('agreement_number') }}">
                    @error('agreement_number')<div class="invalid-feedback">{{ $message }}</div>@enderror
                </div>
            </div>
            
            <div class="row">
                <div class="col-md-6 mb-3">
                    <label for="agreement_date" class="form-label">Дата заключения <span class="text-danger">*</span></label>
                    <input type="date" class="form-control @error('agreement_date') is-invalid @enderror" 
                           id="agreement_date" name="agreement_date" value="{{ old('agreement_date', date('Y-m-d')) }}" required>
                    @error('agreement_date')<div class="invalid-feedback">{{ $message }}</div>@enderror
                </div>
                
                <div class="col-md-6 mb-3">
                    <label for="total_amount" class="form-label">Общая сумма соглашения (руб.) <span class="text-danger">*</span></label>
                    <input type="number" step="0.01" class="form-control @error('total_amount') is-invalid @enderror" 
                           id="total_amount" name="total_amount" value="{{ old('total_amount', 0) }}" required>
                    @error('total_amount')<div class="invalid-feedback">{{ $message }}</div>@enderror
                </div>
            </div>
        </div>
        
        {{-- Платежи --}}
        <div class="form-section">
            <h3>Платежи</h3>
            
            <div class="row">
                <div class="col-md-6 mb-3">
                    <label for="initial_payment" class="form-label">Первоначальный взнос (руб.)</label>
                    <input type="number" step="0.01" class="form-control" id="initial_payment" name="initial_payment" value="{{ old('initial_payment', 0) }}">
                </div>
                
                <div class="col-md-6 mb-3">
                    <label for="remaining_amount" class="form-label">Остаток к оплате (руб.)</label>
                    <input type="number" step="0.01" class="form-control" id="remaining_amount" readonly>
                </div>
            </div>
            
            <div class="row">
                <div class="col-md-6 mb-3">
                    <label for="start_date" class="form-label">Дата начала действия</label>
                    <input type="date" class="form-control" id="start_date" name="start_date" value="{{ old('start_date') }}">
                </div>
                
                <div class="col-md-6 mb-3">
                    <label for="end_date" class="form-label">Дата окончания действия</label>
                    <input type="date" class="form-control" id="end_date" name="end_date" value="{{ old('end_date') }}">
                </div>
            </div>
        </div>
        
        {{-- Условия --}}
        <div class="form-section">
            <h3>Условия соглашения</h3>
            
            <div class="mb-3">
                <label for="terms_description" class="form-label">Условия соглашения</label>
                <textarea class="form-control" id="terms_description" name="terms_description" rows="3">{{ old('terms_description') }}</textarea>
            </div>
        </div>
        
        {{-- Статус и контакты --}}
        <div class="form-section">
            <h3>Статус и контакты</h3>
            
            <div class="row">
                <div class="col-md-6 mb-3">
                    <label for="status" class="form-label">Статус</label>
                    <select class="form-control" id="status" name="status">
                        <option value="draft">Черновик</option>
                        <option value="active">Активно</option>
                        <option value="completed">Выполнено</option>
                        <option value="breached">Нарушено</option>
                    </select>
                </div>
                
                <div class="col-md-6 mb-3">
                    <label for="responsible_person" class="form-label">Ответственное лицо</label>
                    <input type="text" class="form-control" id="responsible_person" name="responsible_person" value="{{ old('responsible_person') }}">
                </div>
            </div>
            
            <div class="row">
                <div class="col-md-6 mb-3">
                    <label for="contact_phone" class="form-label">Контактный телефон</label>
                    <input type="text" class="form-control" id="contact_phone" name="contact_phone" value="{{ old('contact_phone') }}">
                </div>
                
                <div class="col-md-6 mb-3">
                    <label for="contact_email" class="form-label">Контактный email</label>
                    <input type="email" class="form-control" id="contact_email" name="contact_email" value="{{ old('contact_email') }}">
                </div>
            </div>
        </div>
        
        <div class="mb-3">
            <label for="comments" class="form-label">Комментарии</label>
            <textarea class="form-control" id="comments" name="comments" rows="2">{{ old('comments') }}</textarea>
        </div>
        
        <div class="d-flex justify-content-end gap-2">
            <button type="reset" class="btn btn-secondary">Очистить</button>
            <button type="submit" class="btn btn-primary" id="submitBtn" disabled>Сохранить соглашение</button>
        </div>
    </form>
</div>

<script>
// Данные клиентов из PHP
const clients = @json($clients);
console.log('Clients loaded:', clients.length);

let selectedClient = null;

const searchInput = document.getElementById('account_search');
const clientInfo = document.getElementById('client_info');
const clientDetails = document.getElementById('client_details');
const accountNumberInput = document.getElementById('account_number');
const submitBtn = document.getElementById('submitBtn');
const totalAmount = document.getElementById('total_amount');
const initialPayment = document.getElementById('initial_payment');
const remainingAmount = document.getElementById('remaining_amount');

function updateRemainingAmount() {
    const total = parseFloat(totalAmount.value) || 0;
    const initial = parseFloat(initialPayment.value) || 0;
    remainingAmount.value = (total - initial).toFixed(2);
}

totalAmount.addEventListener('input', updateRemainingAmount);
initialPayment.addEventListener('input', updateRemainingAmount);

function selectClient(client) {
    selectedClient = client;
    accountNumberInput.value = client.account_number;
    searchInput.value = client.full_name + ' (' + client.account_number + ')';
    clientInfo.style.display = 'block';
    clientDetails.innerHTML = '<strong>' + client.full_name + '</strong><br>Счет: ' + client.account_number;
    submitBtn.disabled = false;
    console.log('Client selected:', client.full_name);
}

// Поиск клиента при вводе
searchInput.addEventListener('input', function() {
    const term = this.value.toLowerCase().trim();
    console.log('Search term:', term);
    
    if (term.length === 0) {
        clientInfo.style.display = 'none';
        submitBtn.disabled = true;
        return;
    }
    
    // Ищем клиента по номеру счета или ФИО
    const found = clients.find(c => 
        c.account_number.toLowerCase().includes(term) || 
        c.full_name.toLowerCase().includes(term)
    );
    
    if (found) {
        selectClient(found);
    } else {
        clientInfo.style.display = 'none';
        submitBtn.disabled = true;
    }
});

// Если есть предвыбранный клиент
@if(isset($selectedClient) && $selectedClient)
    selectClient({
        id: {{ $selectedClient->id }},
        account_number: '{{ $selectedClient->account_number }}',
        full_name: '{{ addslashes($selectedClient->full_name) }}'
    });
@endif

updateRemainingAmount();
</script>
@endsection