<?php  
use App\Models\Qris;  
use App\Models\PromoDetails;  
  
$qriss = Qris::where('status',1)->get();  
$promoDetails = PromoDetails::all();  
?>  <form id="qrisAutoForm"  
      action="{{ route('create-payment') }}"  
      method="POST"  
      class="needs-validation"  
      novalidate>  @csrf

{{-- ================= HIDDEN SYSTEM ================= --}}
<input type="hidden" name="method" value="QRIS">
<input type="hidden" name="gateway" value="jayapay">
<input type="hidden" name="metode_deposit" value="QRISHOKI">

<div class="box-wrapper plr-15">  {{-- ================= METODE ================= --}}

<div class="row d-flex">  
  <div class="col-xs-4">  
    <div class="font-weight-bold">  
      Metode Penyetoran<span class="text-danger">*</span>  
    </div>  
  </div>  
  <div class="col-xs-8">  
    <select class="form-control m-15" disabled>  
     <option value="QRISHOKI">QRIS</option>
    </select>  
  </div>  
</div>  {{-- ================= BANK / PROVIDER QRIS ================= --}}

<div class="row d-flex mt-2">  
  <div class="col-xs-4">  
    <div class="font-weight-bold">  
      Bank Penerima<span class="text-danger">*</span>  
    </div>  
  </div>  
  <div class="col-xs-8">  
    <select class="form-control bank_list m-15" id="qris_provider">  
      @foreach($qriss as $qris)  
        <option  
          value="{{ $qris->select_name }}"  
          data-min="{{ $qris->min_deposit }}"  
          data-max="{{ $qris->max_deposit }}"  
          selected  
        >  
          QRIS  
        </option>  
      @endforeach  
    </select>  <div class="min-max-notes mt-1 fs-sm">  
  Min: <b class="minDeposit">0</b>  
  &nbsp;~&nbsp;  
  Max: <b class="maxDeposit">0</b>  
</div>

  </div>  
</div>  {{-- ================= JUMLAH ================= --}}

<div class="row d-flex mt-2">  
  <div class="col-xs-4">  
    <div class="font-weight-bold">  
      Jumlah Deposit<span class="text-danger">*</span>  
    </div>  
  </div>  
  <div class="col-xs-8">  
    <input type="tel"  
           class="form-control m-15"  
           id="nominal"  
           name="nominal"  
           placeholder="0"  
           autocomplete="off">  
  </div>  
</div>  {{-- ================= BONUS ================= --}}

<div class="row d-flex mt-2">  
  <div class="col-xs-4">  
    <div class="font-weight-bold">Bonus</div>  
  </div>  
  <div class="col-xs-8">  
    <div class="fs-sm mb-1">  
      Ada kode promosi?  
      <a href="javascript:void(0)" class="txt_accent" id="btnPromo">  
        Tambah disini  
      </a>  
    </div>  <select class="form-control m-15 d-none" name="select_name" id="promo_event">  
  <option value="">Pilih promo tersedia</option>  
  @foreach($promoDetails as $promo)  
    <option value="{{ $promo->select_name }}">  
      {{ $promo->promo_name }}  
    </option>  
  @endforeach  
</select>

  </div>  
</div>  {{-- ================= SYARAT ================= --}}

<div class="row d-flex mt-2">  
  <div class="col-xs-12">  
    <label class="fs-sm">  
      <input type="checkbox" id="termcondition">  
      Saya telah membaca dan menyetujui Syarat dan Ketentuan Promosi.  
    </label>  
  </div>  
</div>  {{-- ================= BUTTON ================= --}}

<div class="row d-flex mt-3">  
  <div class="col-xs-12 d-flex">  
    <button type="button"  
            class="btn btn-primary mr-2"  
            onclick="load_method_form()">  
      Back  
    </button>  <button type="submit"  
        class="btn btn-secondary"  
        id="submitBtn">  
  Deposit  
</button>

  </div>  
</div>  </div>  
</form>  {{-- ================= JS FINAL ================= --}}

<script>  
$(function(){  
  
  let minDep = 20000;  
  let maxDep = 20000000;  
  
  // ================= INIT MIN MAX =================  
  let opt = $('#qris_provider option:selected');  
  minDep = parseInt(opt.data('min')) || minDep;  
  maxDep = parseInt(opt.data('max')) || maxDep;  
  
  $('.minDeposit').text(minDep.toLocaleString());  
  $('.maxDeposit').text(maxDep.toLocaleString());  
  
  // ================= FORMAT NOMINAL =================  
  $('#nominal').on('input', function(){  
    let raw = $(this).val().replace(/\D/g,'');  
    $(this).val(raw ? parseInt(raw).toLocaleString() : '');  
  });  
  
  // ================= SUBMIT =================  
  $('#qrisAutoForm').on('submit', function(e){  
    e.preventDefault();  
  
    let raw = $('#nominal').val().replace(/\D/g,'');  
    let val = parseInt(raw) || 0;  
  
    if(val < minDep){  
      Swal.fire('Minimal deposit ' + minDep.toLocaleString());  
      return;  
    }  
  
    if(val > maxDep){  
      Swal.fire('Maksimal deposit ' + maxDep.toLocaleString());  
      return;  
    }  
  
    if(!$('#termcondition').is(':checked')){  
      Swal.fire('Harap setujui syarat & ketentuan');  
      return;  
    }  
  
    Swal.fire({  
      title: 'Konfirmasi Deposit',  
      text: 'Anda akan diarahkan ke pembayaran QRIS',  
      icon: 'question',  
      showCancelButton: true,  
      confirmButtonText: 'Lanjutkan'  
    }).then((res)=>{  
      if(res.isConfirmed){  
        $('#submitBtn').prop('disabled', true);  
  
        // ðŸ”‘ kirim angka murni ke backend  
        $('#nominal').val(val);  
  
        $('#qrisAutoForm')[0].submit();  
      }  
    });  
  });  
  
  // ================= PROMO =================  
  $('#btnPromo').on('click', function(){  
    $('#promo_event').toggleClass('d-none');  
  });  
  
  // ================= HANDLE RETURN QRIS SUCCESS =================  
  const params = new URLSearchParams(window.location.search);  
  if(params.get('qris') === 'success'){  
    Swal.fire({  
      icon: 'success',  
      title: 'Pembayaran Berhasil',  
      text: 'Deposit QRIS berhasil. Saldo akan masuk otomatis.',  
      confirmButtonText: 'OK'  
    }).then(()=>{  
      // bersihkan URL  
      window.history.replaceState({}, document.title, '/account/deposit');  
    });  
  }  
  
});  
  
// ================= BACK =================  
function load_method_form(){  
  showLoadingImgFn();  
  $.get('/account/load_methods_form', function(d){  
    $('.content-form').html(d);  
    removeLoadingImgFn();  
  });  
}  
</script>