{{-- @extends('layouts.app')
@section('content')
<div class="card mb-6">
    <h5 class="card-header">Editar Cuenta Bancaria</h5>

    @if ($errors->any())
        <div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative mb-4">
            <strong>¡Error!</strong>
            <ul class="list-disc ml-5">
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif

    <form class="card-body" action="{{ route('bank_accounts.update', $bankAccount) }}" method="POST">
        @csrf
        @method('PUT')

      <div class="row g-6">
        <div class="col-md-6">
            <label class="form-label" for="bank_id">Banco</label>
            <select name="bank_id" class="select2 form-select" data-allow-clear="true" required>
                @foreach ($banks as $bank)
                    <option value="{{ $bank->id }}" @if($bankAccount->bank_id == $bank->id) selected @endif>
                        {{ $bank->name }}
                    </option>
                @endforeach
            </select>
            @error('bank_id')
                <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
            @enderror
        </div>
        <div class="col-md-6">
            <label class="form-label" for="account_number">Número de Cuenta</label>
            <input type="text" name="account_number" value="{{ old('account_number', $bankAccount->account_number) }}" class="form-control" required>
            @error('account_number')
                <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
            @enderror
        </div>
        <div class="col-md-6">
            <label class="form-label" for="clabe">CLABE</label>
            <input type="text" name="clabe" value="{{ old('clabe', $bankAccount->clabe) }}" class="form-control">
            @error('clabe')
                <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
            @enderror
        </div>
        <div class="col-md-6">
            <label class="form-label" for="card_number">Número de Tarjeta</label>
            <input type="text" name="card_number" value="{{ old('card_number', $bankAccount->card_number) }}" class="form-control">
            @error('card_number')
                <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
            @enderror
        </div>  
        <div class="col-md-6">
            <input class="form-check-input" type="checkbox" name="is_primary" id="is_primary" {{ $bankAccount->is_primary ? 'checked' : '' }}>
            <label class="form-check-label" for="defaultCheck3">                 Marcar como cuenta principal
            </label>
        </div>      
      </div>
      
      <div class="pt-6">
        <button type="submit" class="btn btn-primary me-4">Actualizar Cuentas</button>
        <a href="{{ route('bank_accounts.index') }}" class="btn btn-label-secondary">
            <i class="ti tabler-arrow-left me-1"></i> Volver
        </a>
    </div>
    </form>
  </div>
@endsection

 --}}
 @extends('layouts.app')
@section('content')
<div class="card mb-6">
    <h5 class="card-header">{{ __('fields.edit_title') }}</h5>

    <form class="card-body" action="{{ route('bank_accounts.update', $bankAccount) }}" method="POST">
        @csrf
        @method('PUT')

        <div class="row g-6">
            <div class="col-md-6">
                <label class="form-label" for="bank_id">{{ __('fields.bank_accounts.bank') }}<span class="required-asterisk">*</span></label>
                <select name="bank_id" class="form-select @error('bank_id') is-invalid @enderror" data-allow-clear="true">
                    <option value="" disabled>{{ __('fields.select_bank') }}</option>
                    @foreach ($banks as $bank)
                        <option value="{{ $bank->id }}" @selected(old('bank_id', $bankAccount->bank_id) == $bank->id)>
                            {{ $bank->name }}
                        </option>
                    @endforeach
                </select>
                @error('bank_id')
                    <div class="invalid-feedback d-block">{{ $message }}</div>
                @enderror
            </div>

            <div class="col-md-6">
                <label class="form-label" for="account_number">{{ __('fields.bank_accounts.account_number') }}<span class="required-asterisk">*</span></label>
                <input type="text" name="account_number" class="form-control @error('account_number') is-invalid @enderror"
                    maxlength="11" inputmode="numeric" pattern="[0-9]*"
                    value="{{ old('account_number', $bankAccount->account_number) }}"
                    placeholder="{{ __('fields.placeholders.account_number') }}">
                @error('account_number')
                    <div class="invalid-feedback d-block">{{ $message }}</div>
                @enderror
            </div>

            <div class="col-md-6">
                <label class="form-label" for="clabe">{{ __('fields.bank_accounts.clabe') }}<span class="required-asterisk">*</span></label>
                <input type="text" name="clabe" class="form-control @error('clabe') is-invalid @enderror"
                    maxlength="18" inputmode="numeric" pattern="[0-9]*"
                    value="{{ old('clabe', $bankAccount->clabe) }}"
                    placeholder="{{ __('fields.placeholders.clabe') }}">
                @error('clabe')
                    <div class="invalid-feedback d-block">{{ $message }}</div>
                @enderror
            </div>

            <div class="col-md-6">
                <label class="form-label" for="card_number">{{ __('fields.bank_accounts.card_number') }}</label>
                <input type="text" name="card_number" class="form-control @error('card_number') is-invalid @enderror"
                    maxlength="16" inputmode="numeric" pattern="[0-9]*"
                    value="{{ old('card_number', $bankAccount->card_number) }}"
                    placeholder="{{ __('fields.placeholders.card_number') }}">
                @error('card_number')
                    <div class="invalid-feedback d-block">{{ $message }}</div>
                @enderror
            </div>

            <div class="col-md-6">
                <input class="form-check-input" type="checkbox" name="is_primary" id="is_primary" {{ old('is_primary', $bankAccount->is_primary) ? 'checked' : '' }}>
                <label class="form-check-label" for="is_primary">
                    {{ __('fields.bank_accounts.set_primary') }}
                </label>
            </div>
        </div>

        <div class="pt-6">
            <button type="submit" class="btn btn-primary me-4">{{ __('fields.update_button') }}</button>
            <a href="{{ route('bank_accounts.index') }}" class="btn btn-label-secondary">
                <i class="ti tabler-arrow-left me-1"></i> {{ __('fields.bank_accounts.back') }}
            </a>
        </div>
    </form>
</div>

@push('scripts')
<script>
  document.addEventListener('DOMContentLoaded', function () {
    const numericInputs = ['account_number', 'clabe', 'card_number'];

    numericInputs.forEach(id => {
      const input = document.querySelector(`input[name="${id}"]`);

      input.addEventListener('input', function () {
        this.value = this.value.replace(/[^0-9]/g, '');
      });

      input.addEventListener('keypress', function (e) {
        if (!/[0-9]/.test(e.key)) {
          e.preventDefault();
        }
      });
    });
  });
</script>

@if(session('duplicate_error'))
<script>
  Swal.fire({
    icon: 'error',
    title: '{{ __("fields.duplicate_title") }}',
    text: '{{ __("fields.duplicate_text") }}',
    confirmButtonText: '{{ __("fields.ok") }}',
    customClass: {
      confirmButton: 'btn btn-danger'
    },
    buttonsStyling: false
  });
</script>
@endif
@endpush
@endsection