@extends('layouts.app')

@section('title', 'Editar Conciliación Bancaria')

@section('content')
<div class="container-fluid">
    <!-- Page Heading -->
    <div class="d-sm-flex align-items-center justify-content-between mb-4">
        <h1 class="h3 mb-0 text-gray-800 text-gradient-primary">
            <i class="fas fa-balance-scale me-2"></i>Editar Conciliación Bancaria
        </h1>
        <div class="d-flex gap-2">
            <a href="{{ route('admin.bank.reconciliations.show', $reconciliation) }}" class="btn btn-secondary">
                <i class="fas fa-arrow-left me-2"></i>Volver
            </a>
        </div>
    </div>

    <div class="row">
        <div class="col-lg-8">
            <div class="card shadow">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary">
                        <i class="fas fa-edit me-2"></i>Editar Información
                    </h6>
                </div>
                <div class="card-body">
                    <form method="POST" action="{{ route('admin.bank.reconciliations.update', $reconciliation) }}">
                        @csrf
                        @method('PUT')
                        
                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label for="bank_account_id" class="form-label">Cuenta Bancaria <span class="text-danger">*</span></label>
                                <select class="form-select @error('bank_account_id') is-invalid @enderror" 
                                        id="bank_account_id" name="bank_account_id" required>
                                    <option value="">Seleccionar cuenta bancaria</option>
                                    @foreach($bankAccounts as $account)
                                        <option value="{{ $account->id }}" 
                                                {{ old('bank_account_id', $reconciliation->bank_account_id) == $account->id ? 'selected' : '' }}>
                                            {{ $account->bank->name }} - {{ $account->account_number }}
                                        </option>
                                    @endforeach
                                </select>
                                @error('bank_account_id')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>

                            <div class="col-md-6 mb-3">
                                <label for="reconciliation_date" class="form-label">Fecha de Conciliación <span class="text-danger">*</span></label>
                                <input type="date" class="form-control @error('reconciliation_date') is-invalid @enderror" 
                                       id="reconciliation_date" name="reconciliation_date" 
                                       value="{{ old('reconciliation_date', $reconciliation->reconciliation_date ? $reconciliation->reconciliation_date->format('Y-m-d') : '') }}" required>
                                @error('reconciliation_date')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label for="bank_balance" class="form-label">Saldo del Banco <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text">$</span>
                                    <input type="number" step="0.01" class="form-control @error('bank_balance') is-invalid @enderror" 
                                           id="bank_balance" name="bank_balance" 
                                           value="{{ old('bank_balance', $reconciliation->bank_balance) }}" required>
                                </div>
                                @error('bank_balance')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>

                            <div class="col-md-6 mb-3">
                                <label for="book_balance" class="form-label">Saldo del Libro <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text">$</span>
                                    <input type="number" step="0.01" class="form-control @error('book_balance') is-invalid @enderror" 
                                           id="book_balance" name="book_balance" 
                                           value="{{ old('book_balance', $reconciliation->book_balance) }}" required>
                                </div>
                                @error('book_balance')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        <div class="mb-3">
                            <label for="notes" class="form-label">Notas</label>
                            <textarea class="form-control @error('notes') is-invalid @enderror" 
                                      id="notes" name="notes" rows="3">{{ old('notes', $reconciliation->notes) }}</textarea>
                            @error('notes')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="d-flex justify-content-end gap-2">
                            <a href="{{ route('admin.bank.reconciliations.show', $reconciliation) }}" class="btn btn-secondary">
                                <i class="fas fa-times me-2"></i>Cancelar
                            </a>
                            <button type="submit" class="btn btn-primary">
                                <i class="fas fa-save me-2"></i>Actualizar Conciliación
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary">
                        <i class="fas fa-info-circle me-2"></i>Información Actual
                    </h6>
                </div>
                <div class="card-body">
                    <div class="mb-3">
                        <label class="form-label fw-bold">Estado Actual:</label>
                        <p class="form-control-plaintext">
                            @php
                                $statusClasses = [
                                    'pending' => 'badge bg-warning text-white',
                                    'in_progress' => 'badge bg-info text-white',
                                    'completed' => 'badge bg-success text-white'
                                ];
                                $statusTexts = [
                                    'pending' => 'Pendiente',
                                    'in_progress' => 'En Proceso',
                                    'completed' => 'Completada'
                                ];
                            @endphp
                            <span class="{{ $statusClasses[$reconciliation->status] ?? 'badge bg-secondary text-white' }}">
                                {{ $statusTexts[$reconciliation->status] ?? ucfirst($reconciliation->status) }}
                            </span>
                        </p>
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-bold">Diferencia Actual:</label>
                        @php
                            $difference = $reconciliation->bank_balance - $reconciliation->book_balance;
                        @endphp
                        <p class="form-control-plaintext {{ $difference == 0 ? 'text-success' : 'text-danger' }}">
                            ${{ number_format($difference, 2) }}
                        </p>
                    </div>

                    <div class="alert alert-warning">
                        <h6 class="alert-heading">Importante</h6>
                        <p class="mb-0">Solo puedes editar conciliaciones en estado "Pendiente". Una vez iniciada o completada, no se pueden modificar.</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
document.addEventListener('DOMContentLoaded', function() {
    // Calcular diferencia automáticamente
    const bankBalance = document.getElementById('bank_balance');
    const bookBalance = document.getElementById('book_balance');
    
    function calculateDifference() {
        const bank = parseFloat(bankBalance.value) || 0;
        const book = parseFloat(bookBalance.value) || 0;
        const difference = bank - book;
        
        // Mostrar diferencia en algún lugar si es necesario
        console.log('Diferencia:', difference);
    }
    
    bankBalance.addEventListener('input', calculateDifference);
    bookBalance.addEventListener('input', calculateDifference);
});
</script>
@endsection