@extends('layouts.admin')

@section('title', 'Gestión de métodos de pago')
<!-- Header -->
@section('nombre_header', 'Gestión de métodos de pago')
@section('section_header', 'CONTROL')

<!-- Content -->

@section('content')

<div class="container">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header d-flex justify-content-between align-items-center">
                    <h3 class="card-title mb-0">
                        Panel de administración de métodos de pago
                    </h3>
                    <div class="ml-auto">
                        <button type="button" class="btn btn-info btn-sm" data-toggle="modal" data-target="#notasMetodosPagoModal">
                            <i class="fas fa-info-circle"></i> Notas
                        </button>
                    </div>
                </div>
                <div class="card-body">
                    <p class="text-muted">
                        En este panel podrás gestionar los métodos de pago del sistema. Aquí puedes:
                        editar el nombre y la descripción de los métodos de pago.
                    </p>
                <p class="text-muted">
                    <i class="fas fa-info-circle"></i>
                    <small>Próximamente se implementarán las funcionalidades para crear y eliminar métodos de pago.</small>
                </p>

                </div>
            </div>
        </div>
    </div>
</div>

<!-- Modal de Notas Importantes -->
<div class="modal fade" id="notasMetodosPagoModal" tabindex="-1" role="dialog" aria-labelledby="notasMetodosPagoModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="notasMetodosPagoModalLabel">
                    <i class="fas fa-info-circle text-info"></i> Notas Importantes sobre Métodos de Pago
                </h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="alert alert-info">
                    <ul class="mb-0">
                        <li class="mb-2">Nombre: Nombre o abreviatura del método de pago</li>
                        <li class="mb-2">Descripción: Descripción completa del método de pago (opcional)</li>
                    <li class="mb-2">Nota: Los métodos de pago P2P, CASH y GOOGLE no pueden ser editados por seguridad del sistema</li>
                    </ul>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
            </div>
        </div>
    </div>
</div>
<!-- Tabla de métodos de pago -->
@include('modules.payment_methods.components.payment_methods_table',['payment_methods'=> $payment_methods])

@stop







{{-- Push extra CSS --}}
@push('css')
{{-- Add here extra stylesheets --}}
{{--
<link rel="stylesheet" href="/css/admin_custom.css"> --}}
@endpush

{{-- Push extra scripts --}}
@push('js')

@endpush