@php
use App\Models\MetodoPagamento;
use Illuminate\Support\Str;

$configData = Helper::appClasses();
$metodi = MetodoPagamento::where('is_attivo', true)->orderBy('nome')->get();
$ordine = $ordine ?? null;
$subtotaleRighe = $ordine ? $ordine->righe_ordine->sum('prezzo') : 0;
$totaleOrdine = ($ordine && $ordine->totale > 0) ? (float) $ordine->totale : (float) $subtotaleRighe;
$nRighe = $ordine ? $ordine->righe_ordine->count() : 0;
$infoDispositivo = data_get($dispositivo, 'info', []);
if (is_string($infoDispositivo)) {
    $decodedInfo = json_decode($infoDispositivo, true);
    $infoDispositivo = is_array($decodedInfo) ? $decodedInfo : [];
}

$campiOrdine = $infoDispositivo['campiOrdine'] ?? null;
if (!is_array($campiOrdine) || empty($campiOrdine)) {
    $campiOrdine = $infoDispositivo['campi_ordine'] ?? null;
}
if (!is_array($campiOrdine) || empty($campiOrdine)) {
    $campiOrdine = $infoDispositivo['info_cliente'] ?? null;
}
if (!is_array($campiOrdine) || empty($campiOrdine)) {
    $campiOrdine = $infoDispositivo['infoCliente'] ?? null;
}
if (!is_array($campiOrdine)) {
    $campiOrdine = [];
}

if (empty($campiOrdine) || !is_array($campiOrdine)) {
    $campiOrdine = [
        'cliente' => ['label' => 'Cliente', 'type' => 'text', 'mostra' => true, 'required' => true, 'placeholder' => 'Cliente'],
        'tavolo' => ['label' => 'Tavolo', 'type' => 'text', 'mostra' => true, 'required' => true, 'placeholder' => 'Tavolo'],
    ];
}

$tipiSupportati = ['text', 'tel', 'email', 'number', 'checkbox'];
$campiOrdineVisibili = collect($campiOrdine)
    ->filter(function ($campo) {
        if (!is_array($campo)) {
            return false;
        }
        // Se il flag non e` presente, il campo e` considerato visibile.
        if (!array_key_exists('mostra', $campo)) {
            return true;
        }
        return filter_var($campo['mostra'], FILTER_VALIDATE_BOOLEAN);
    });
@endphp
<form action="{{ route('carrello.paga_ordine') }}" method="POST">
        @csrf
        <input type="hidden" name="ordine_id" value="{{ $ordine->id }}">
        <input type="hidden" name="dispositivo_id" value="{{ $dispositivo->id }}">
        <input type="hidden" name="attivita_id" value="{{ $attivita->id }}">
        <input type="hidden" name="tag_id" id="tag_id" value="">

<div class="card px-2 px-sm-3 border-0 shadow-none bg-transparent">
  <div class="row g-0">
    <div class="col-lg-5 card-body border-end border-secondary border-opacity-10 p-md-6 p-3">
      <h4 class="mb-2">Info utente</h4>
      <p class="mb-4 text-muted small">
        Dati ordine raccolti in cassa.
      </p>

      <div class="border rounded p-3 bg-lighter mb-4">
        @if($campiOrdineVisibili->isNotEmpty())
          @foreach($campiOrdineVisibili as $chiave => $campo)
            @php
              $tipo = in_array(($campo['type'] ?? 'text'), $tipiSupportati, true) ? $campo['type'] : 'text';
              $label = $campo['label'] ?? ucfirst(str_replace('_', ' ', $chiave));
              $placeholder = $campo['placeholder'] ?? $label;
              $required = !empty($campo['required']);
              $valore = data_get($ordine, "info.$chiave");
              $inputId = 'checkout-info-'.$chiave;
            @endphp

            @if($tipo === 'checkbox')
              <div class="form-check form-switch mb-3 pb-2 border-bottom border-light-subtle">
                <input type="hidden" name="info[{{ $chiave }}]" value="0">
                <input
                  class="form-check-input"
                  type="checkbox"
                  role="switch"
                  id="{{ $inputId }}"
                  name="info[{{ $chiave }}]"
                  value="1"
                  data-campo-ordine="{{ $chiave }}"
                  {{ filter_var($valore, FILTER_VALIDATE_BOOLEAN) ? 'checked' : '' }}
                  {{ $required ? 'required' : '' }}
                >
                <label class="form-check-label text-body" for="{{ $inputId }}">{{ $label }}</label>
              </div>
            @else
              <div class="mb-3 pb-2 border-bottom border-light-subtle">
                <label class="form-label mb-1 text-capitalize" for="{{ $inputId }}">{{ $label }}</label>
                <input
                  type="{{ $tipo }}"
                  class="form-control form-control-sm"
                  id="{{ $inputId }}"
                  name="info[{{ $chiave }}]"
                  value="{{ $valore ?? '' }}"
                  placeholder="{{ $placeholder }}"
                  data-campo-ordine="{{ $chiave }}"
                  {{ $required ? 'required' : '' }}
                >
              </div>
            @endif
          @endforeach
        @else
          <p class="text-muted small mb-0">Nessun campo utente configurato per questo punto vendita.</p>
        @endif
      </div>

      <h5 class="mb-3">Note</h5>
      <div class="row g-3">
        <div class="col-12">
          <label class="form-label" for="checkout-note-cassa">Annotazioni (opzionale)</label>
          <textarea id="checkout-note-cassa" class="form-control" rows="2" placeholder="Es. scontrino fattura, resto..."></textarea>
        </div>
      </div>
    </div>

    <div class="col-lg-7 card-body p-md-6 p-3 d-flex flex-column">
      <div class="pt-2 border-top">
        <div class="bg-lighter p-3 rounded">
          <p class="mb-1 fw-medium">Totale da incassare</p>
          <div class="d-flex align-items-baseline justify-content-between">
            <p class="small text-muted mb-0">{{ $nRighe }} {{ $nRighe === 1 ? 'articolo' : 'articoli' }}</p>
            <h3 class="text-primary mb-0">€ {{ number_format($totaleOrdine, 2, ',', '.') }}</h3>
          </div>
          @if($ordine && $ordine->totale > 0 && abs((float) $ordine->totale - (float) $subtotaleRighe) > 0.009)
            <div class="d-flex justify-content-between align-items-center mt-2">
              <p class="mb-0 small text-muted">Totale ordine (sistema)</p>
              <h6 class="mb-0">€ {{ number_format((float) $ordine->totale, 2, ',', '.') }}</h6>
            </div>
          @endif
        </div>
      </div>

      <h6 class="mb-1 mt-3">Metodo di pagamento</h6>
      <p class="mb-0 text-muted small">
        Seleziona il metodo e conferma.
      </p>

      @if($metodi->isEmpty())
        <p class="text-warning mt-4 mb-0">Nessun metodo di pagamento attivo.</p>
      @else
        <div class="row g-2 py-4">
          @foreach($metodi as $metodo)
            <div class="col-12">
              <div class="form-check custom-option custom-option-basic {{ $loop->first ? 'checked' : '' }}">
                <label class="form-check-label custom-option-content form-check-input-payment d-flex gap-3 align-items-center py-2" for="metodoPagamento{{ $metodo->id }}">
                  <input
                    name="metodo_pagamento_id"
                    id="metodoPagamento{{ $metodo->id }}"
                    type="radio"
                    value="{{ $metodo->id }}"
                    @if($metodo->tipo == MetodoPagamento::SEGRESTA_WALLET)
                      class="form-check-input segrestaWalletInput"
                      data-tipo="{{ MetodoPagamento::SEGRESTA_WALLET }}"
                    @else
                      class="form-check-input"
                    @endif
                    {{ $loop->first ? 'checked' : '' }}
                  />
                  <span class="custom-option-body d-flex align-items-center">
                    @if(!$metodo->path_img)
                      <span class="d-inline-flex align-items-center justify-content-center rounded bg-label-primary bg-opacity-10 flex-shrink-0" style="width: 46px; height: 46px;">
                        <i class="bx {{ $metodo->getIcona() }} fs-4 text-primary"></i>
                      </span>
                    @endif
                    <span class="ms-2 fw-medium text-heading text-start">
                      {{ $metodo->nome }}
                      @if($metodo->descrizione)
                        <span class="d-block small text-muted fw-normal mt-1">{{ Str::limit($metodo->descrizione, 60) }}</span>
                      @endif
                    </span>
                  </span>
                </label>
                @if($metodo->tipo == MetodoPagamento::SEGRESTA_WALLET)
                  <span class="badge text-wrap small text-muted fw-normal mt-1" id="segrestaWalletAlertToScan" style="display: none;">
                    Scansiona un braccialetto NFC valido per pagare con Segresta Wallet.
                  </span>
                @endif
              </div>
            </div>
          @endforeach
        </div>
      @endif

      <div class="mt-auto pt-3">
        <div class="d-grid">
          <button type="submit" id="btn-conferma-pagamento" class="btn btn-success" {{ $metodi->isEmpty() ? 'disabled' : '' }}>
            <span class="spinner-border spinner-border-sm d-none" id="checkout-submit-spinner" role="status"></span>
            <span class="me-2" id="checkout-submit-label">Conferma pagamento</span>
            <i class="bx bx-right-arrow-alt scaleX-n1-rtl" id="checkout-submit-icon"></i>
          </button>
        </div>

        <p class="mt-3 mb-0 small text-muted" id="segrestaWalletChiE" style="display: none;"></p>
        <p class="mt-3 mb-0 small text-muted">
          Confermando, registri il pagamento secondo il metodo selezionato. Verifica sempre l'importo in cassa.
        </p>
      </div>
    </div>
  </div>
</div>

</form>

<script>
$(document).ready(function(){
  bindCheckoutSpinner();
    $('input[name="metodo_pagamento_id"]').on('change', function(){

      checkUX($(this));

  });
});

function checkUX(input){
  $('input[name="metodo_pagamento_id"]').parents('div.form-check').removeClass('checked');
  input.parents('div.form-check').addClass('checked');
      // 


      if(input.data('tipo') == "{{ MetodoPagamento::SEGRESTA_WALLET }}"){
        $('#segrestaWalletAlertToScan').show();
        $('button[type="submit"]').prop('disabled', true);
        scanningNfcRequest();
      
    }else{
      $('#segrestaWalletAlertToScan').hide();
      $('button[type="submit"]').prop('disabled', false);
      ;
    }
  
}

function chiE(tag_id){
  var response = null;
  $.ajax({
    url: "{{ route('metodo-pagamento.segresta-wallet.chiE') }}",
    type: 'POST',
    data: { 
      tag_id: tag_id,
      _token: "{{ csrf_token() }}"
    },
    success: function(response){
      if(response.success){
        $('#segrestaWalletChiE').show().text(response.message);
      }else{
        $('#segrestaWalletChiE').show().text(response.message);
      }
    }
  });
}

function showCheckoutSpinner() {
  $('#btn-conferma-pagamento').prop('disabled', true);
  $('#checkout-submit-spinner').removeClass('d-none');
  $('#checkout-submit-label').text('Elaborazione pagamento…');
  $('#checkout-submit-icon').addClass('d-none');
}

function hideCheckoutSpinner() {
  $('#checkout-submit-spinner').addClass('d-none');
  $('#checkout-submit-label').text('Conferma pagamento');
  $('#checkout-submit-icon').removeClass('d-none');
  $('#btn-conferma-pagamento').prop('disabled', false);
}

function bindCheckoutSpinner() {
  $('form[action="{{ route('carrello.paga_ordine') }}"]').on('submit', function () {
    if ($('#btn-conferma-pagamento').prop('disabled')) {
      return false;
    }
    showCheckoutSpinner();
    return true;
  });
}

/////////////////////// spostato in INDEX
// let nfcAbortController = null;

// function stopNfcScan() {
//   if (nfcAbortController) {
//     try { nfcAbortController.abort(); } catch (e) {}
//     nfcAbortController = null;
//   }
// }

// function scanningNfcRequest() {
//   const $status = $('#segrestaWalletAlertToScan');
//   const $submit = $('button[type="submit"]');
//   const $tag = $('#tag_id');

//   stopNfcScan();
//   $tag.val('');
//   $submit.prop('disabled', true);

//   if (!('NDEFReader' in window)) {
//     $status
//       .show()
//       .removeClass('alert-warning alert-success')
//       .addClass('alert-danger')
//       .text('NFC non supportato su questo dispositivo/browser.');
//       ///
//     $status
//       .show()
//       .removeClass('alert-warning alert-success')
//       .addClass('alert-danger')
//       .text('NFC non supportato da questo dispositivo/browser. Inserisci manualmente il codice del braccialetto.');

//     // Prompt manuale tramite prompt JS
//     const manualTag = prompt('NFC non disponibile. Inserisci manualmente il codice del braccialetto/tag per pagare con Segresta Wallet:');
//     if (manualTag && manualTag.trim() !== '') {
//       $tag.val(manualTag.trim());
//       $status
//         .removeClass('alert-danger alert-warning')
//         .addClass('alert-success')
//         .text('Codice braccialetto inserito manualmente: ' + manualTag + '. Puoi confermare il pagamento.');
//       $submit.prop('disabled', false);
//     } else {
//       $status
//         .removeClass('alert-success alert-warning')
//         .addClass('alert-danger')
//         .text('Inserimento del codice del braccialetto annullato o non valido.');
//       $submit.prop('disabled', true);
//     }
//     /////
//     return;
//   }

//   nfcAbortController = new AbortController();
//   const reader = new NDEFReader();

//   reader.scan({ signal: nfcAbortController.signal })
//     .then(() => {
//       $status
//         .show()
//         .removeClass('alert-danger alert-success')
//         .addClass('alert-warning')
//         .text('Lettore NFC attivo: avvicina il braccialetto.');

//       reader.onreading = (event) => {
//         const tagId = event.serialNumber || '';

//         if (!tagId) {
//           $status
//             .removeClass('alert-warning alert-success')
//             .addClass('alert-danger')
//             .text('Tag letto ma seriale non disponibile. Riprova.');
//           $submit.prop('disabled', true);
//           return;
//         }

//         $tag.val(tagId);
//         $status
//           .removeClass('alert-warning alert-danger')
//           .addClass('alert-success')
//           .text('Braccialetto letto: ' + tagId + '. Puoi confermare il pagamento.');
//         $submit.prop('disabled', false);

//         // opzionale: una lettura basta
//         stopNfcScan();
//       };

//       reader.onerror = () => {
//         $status
//           .removeClass('alert-warning alert-success')
//           .addClass('alert-danger')
//           .text('Errore durante la lettura NFC. Riprova.');
//         $submit.prop('disabled', true);
//       };
//     })
//     .catch((err) => {
//       if (err?.name === 'AbortError') return;
//       $status
//         .show()
//         .removeClass('alert-warning alert-success')
//         .addClass('alert-danger')
//         .text('Impossibile avviare NFC: ' + (err?.message || 'errore sconosciuto'));
//       $submit.prop('disabled', true);
//     });
// }
</script>