<?php $__env->startSection('css'); ?>
    <?php echo $__env->make('layouts.datatables_css', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?>
<?php $__env->stopSection(); ?>
<div class="row mb-3">
<form class="row gx-3 gy-2 align-items-center">
  <div class="col-sm-3">    
    <?php echo Form::select('unit', $unitItems, null, ['class' => 'form-control select2', 'data-placeholder' => 'Pilih Unit', 'onchange' => 'setBankUnit(this)']); ?>    
  </div>
  <div class="col-sm-3">
    <?php echo Form::text('transaction_date','', ['class' => 'form-control datetime', 'placeholder' => 'Tanggal Transaksi']); ?>    
  </div>  
  <div class="col-sm-3">    
    <?php echo Form::select('bank_code', $bankItems, null, ['class' => 'form-control select2', 'required' => 'required']); ?>

  </div>
  
  <div class="col-auto">
    <?php echo Form::button('Cari',['class' => 'btn btn-primary', 'onclick' => 'searchKU(this)']); ?>

    <?php echo Form::button('Approve',['class' => 'btn btn-danger', 'data-url' => route('transaction.receiveMoneyApprove.update', 1),'onclick' => 'approveKU(this)']); ?>

  </div>
</form>
</div>
<?php echo $dataTable->table(['width' => '100%', 'class' => 'table table-striped table-bordered']); ?>


<?php $__env->startPush('scripts'); ?>
    <?php echo $__env->make('layouts.datatables_js', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?>
    <script>
      $(function(){
        disableListBank()
      })      
      let dataTableObj
        function searchKU(elm){
          const _bank = $('select[name=bank_code]').val()
          if(_.isEmpty(_bank)) {
            main.alertDialog('Error', 'Pilih bank terlebih dahulu')
            return
          }

          if(dataTableObj == undefined){
            dataTableObj = $('#dataTableBuilder').DataTable(<?php echo $dataTable->generateJson(); ?>)
          }
          
          dataTableObj.column(0).search(main.getValueDateSQL($('input[name=transaction_date]')))
          dataTableObj.column(4).search($('select[name=bank_code]').val())
          dataTableObj.column(5).search($('select[name=unit]').val())
          
          dataTableObj.draw()
        }

        function setBankUnit(elm){
            let _val = $(elm).val()
            disableListBank()
            $('select[name=bank_code]').find('optgroup[label='+_val+']').prop('disabled',false)
        }

        function disableListBank(){
          $('select[name=bank_code]').val('')
          $('select[name=bank_code]').trigger('change')
          $('select[name=bank_code]').find('optgroup').prop('disabled',true)
        }
        function approveKU(elm){
          if(dataTableObj == undefined) return
          const checked = $('#dataTableBuilder tbody').find(':checked')
          if(checked.length){
            $.ajax({            
              url: $(elm).data('url'),
              beforeSend: function(){
                $(elm).html('<i class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></i>')            
              },
              type: 'PUT',
              dataType: 'json',
              data: checked.serialize(),
              success: function(data){
                if(!data.status){
                  main.alertDialog('Error', data.message)
                  $(elm).html('Approve')
                }else{
                  $(elm).html('Approve')
                  dataTableObj.draw()
                }              
            }
          })            
          }
        }
    </script>
        
<?php $__env->stopPush(); ?>

<?php /**PATH /data/docker/wjc/portal/resources/views/transaction/receive_moneys_approve/table.blade.php ENDPATH**/ ?>