@extends('admin.layouts.app')

@section('title', 'Novo Pagamento')

@section('content')
<div class="content-header">
    <div class="container-fluid">
        <div class="row mb-2">
            <div class="col-sm-6">
                <h1 class="m-0">Novo Pagamento</h1>
            </div>
            <div class="col-sm-6">
                <ol class="breadcrumb float-sm-right">
                    <li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">Dashboard</a></li>
                    <li class="breadcrumb-item"><a href="{{ route('admin.pagamentos.index') }}">Pagamentos</a></li>
                    <li class="breadcrumb-item active">Novo</li>
                </ol>
            </div>
        </div>
    </div>
</div>

<section class="content">
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-8">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">Dados do Pagamento</h3>
                    </div>
                    <form action="{{ route('admin.pagamentos.store') }}" method="POST">
                        @csrf
                        <div class="card-body">
                            <div class="form-group">
                                <label for="pedido_id">Pedido <span class="text-danger">*</span></label>
                                <select name="pedido_id" id="pedido_id" class="form-control @error('pedido_id') is-invalid @enderror" required>
                                    <option value="">Selecione um pedido...</option>
                                    @foreach($pedidos as $pedido)
                                        <option value="{{ $pedido->id }}" {{ old('pedido_id') == $pedido->id ? 'selected' : '' }}>
                                            Pedido #{{ $pedido->id }} - {{ $pedido->usuario->nome }} (R$ {{ number_format($pedido->valor_total, 2, ',', '.') }})
                                        </option>
                                    @endforeach
                                </select>
                                @error('pedido_id')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>

                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="valor">Valor <span class="text-danger">*</span></label>
                                        <div class="input-group">
                                            <div class="input-group-prepend">
                                                <span class="input-group-text">R$</span>
                                            </div>
                                            <input type="number" name="valor" id="valor" step="0.01" min="0" 
                                                   class="form-control @error('valor') is-invalid @enderror" 
                                                   value="{{ old('valor') }}" required>
                                        </div>
                                        @error('valor')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="forma_pagamento">Forma de Pagamento <span class="text-danger">*</span></label>
                                        <select name="forma_pagamento" id="forma_pagamento" class="form-control @error('forma_pagamento') is-invalid @enderror" required>
                                            <option value="">Selecione...</option>
                                            <option value="dinheiro" {{ old('forma_pagamento') == 'dinheiro' ? 'selected' : '' }}>Dinheiro</option>
                                            <option value="cartao_credito" {{ old('forma_pagamento') == 'cartao_credito' ? 'selected' : '' }}>Cartão de Crédito</option>
                                            <option value="cartao_debito" {{ old('forma_pagamento') == 'cartao_debito' ? 'selected' : '' }}>Cartão de Débito</option>
                                            <option value="pix" {{ old('forma_pagamento') == 'pix' ? 'selected' : '' }}>PIX</option>
                                            <option value="mercado_pago" {{ old('forma_pagamento') == 'mercado_pago' ? 'selected' : '' }}>MercadoPago</option>
                                        </select>
                                        @error('forma_pagamento')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>

                            <div class="form-group">
                                <label for="status">Status <span class="text-danger">*</span></label>
                                <select name="status" id="status" class="form-control @error('status') is-invalid @enderror" required>
                                    <option value="pendente" {{ old('status') == 'pendente' ? 'selected' : '' }}>Pendente</option>
                                    <option value="pago" {{ old('status') == 'pago' ? 'selected' : '' }}>Pago</option>
                                    <option value="cancelado" {{ old('status') == 'cancelado' ? 'selected' : '' }}>Cancelado</option>
                                    <option value="reembolsado" {{ old('status') == 'reembolsado' ? 'selected' : '' }}>Reembolsado</option>
                                </select>
                                @error('status')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>

                            <div class="form-check mb-3">
                                <input type="checkbox" name="processar_agora" id="processar_agora" class="form-check-input" 
                                       value="1" {{ old('processar_agora') ? 'checked' : '' }}>
                                <label class="form-check-label" for="processar_agora">
                                    Processar pagamento imediatamente
                                </label>
                            </div>

                            <div class="form-group">
                                <label for="observacoes">Observações</label>
                                <textarea name="observacoes" id="observacoes" class="form-control @error('observacoes') is-invalid @enderror" 
                                          rows="3" placeholder="Observações adicionais...">{{ old('observacoes') }}</textarea>
                                @error('observacoes')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>
                        <div class="card-footer">
                            <div class="row">
                                <div class="col-md-6">
                                    <a href="{{ route('admin.pagamentos.index') }}" class="btn btn-secondary">
                                        <i class="fas fa-arrow-left"></i> Voltar
                                    </a>
                                </div>
                                <div class="col-md-6 text-right">
                                    <button type="reset" class="btn btn-warning">
                                        <i class="fas fa-undo"></i> Limpar
                                    </button>
                                    <button type="submit" class="btn btn-success">
                                        <i class="fas fa-save"></i> Salvar
                                    </button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>

            <div class="col-md-4">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">Informações</h3>
                    </div>
                    <div class="card-body">
                        <p class="text-muted">
                            Selecione um pedido e configure as informações do pagamento.
                        </p>
                        
                        <h6>Formas de Pagamento:</h6>
                        <ul class="text-muted">
                            <li><strong>Dinheiro:</strong> Pagamento em espécie</li>
                            <li><strong>Cartão:</strong> Pagamento presencial</li>
                            <li><strong>PIX:</strong> Transferência instantânea</li>
                            <li><strong>MercadoPago:</strong> Pagamento online</li>
                        </ul>

                        <div class="alert alert-info mt-3">
                            <h6><i class="fas fa-info-circle"></i> Dicas:</h6>
                            <ul class="mb-0">
                                <li>Marque "Processar imediatamente" para pagamentos online</li>
                                <li>Apenas pedidos sem pagamento pago podem ser processados</li>
                                <li>O status do pedido será atualizado automaticamente</li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
@endsection

@push('scripts')
<script>
$(document).ready(function() {
    // Atualizar valor baseado no pedido selecionado
    $('#pedido_id').change(function() {
        const option = $(this).find('option:selected');
        const valorTexto = option.text().match(/R\$ ([\d,]+\.?\d*)/);
        if (valorTexto) {
            const valor = valorTexto[1].replace(',', '.');
            $('#valor').val(parseFloat(valor).toFixed(2));
        }
    });
});
</script>
@endpush