<link href="<?php echo e(asset('plugins/select2/css/select2.css')); ?>" rel="stylesheet">

<div class="card-body">
    <form class="flex flex-row" method="POST" enctype="multipart/form-data" id="formblast">
        <?php echo csrf_field(); ?>
        <input type="hidden" name="type" value="button">
        
            <label for="textmessage" class="form-label">Sender</label>
            <select name="sender" id="sender" class="form-control" style="width: 100%;" required>
               <?php $__currentLoopData = $numbers; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $number): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
               <option value="<?php echo e($number->body); ?>"><?php echo e($number->body); ?></option>
               <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
               
            </select>
        
        <div class="d-flex justify-content-between">

            <div class="col-md-7">
                
                <div>
                    <div class="tagsOption ">
                        <label for="inputEmail4" class="form-label">Tag Lists</label>
                        <select name="tag" id="tag" class="form-control" style="width: 100%; height:200px;" required>
                          <?php $__currentLoopData = $tags; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $tag): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                              
                          <option value="<?php echo e($tag->id); ?>"><?php echo e($tag->name); ?></option>
                          <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                           
                        </select>
                    </div>
                    <div class="d-flex justify-content-around">
                        <div class="col">
                            <label for="delay" class="form-label">Delay</label>
                            <input type="number" id="delay" min="1" max="60" name="delay" class="form-control">
                        </div>
                        <div class="col mx-2">
                            <label for="tipe" class="form-label">Type</label>
                            <select name="tipe" id="tipe" class="form-control" style="width: 100%; height:200px;">
                               <option value="immediately">Immediately</option>
                               <option value="schedule">Schedule</option>
                                 
                              </select>
                        </div>
                        
                    </div>
                    <div class="col d-none" id="datetime">
                
                        <label for="datetime" class="form-label">Date Time</label>
                        <input type="datetime-local" id="datetime2"  name="datetime" class="form-control">
                    </div>
                  

                   
                </div>
              
                
                
                <div class="d-flex justify-content-around">
                    <div class="col">
                        <label for="button1" class="form-label">Button 1</label>
                        <input type="text" name="button1" id="button1" class="form-control">
                       
                    </div>
                    <div class="col mx-2">
                        <label for="button2" class="form-label">Button 2</label>
                        <input type="text" name="button2" id="button2" class="form-control">
        
                    </div>
                </div>
              
              
                <label for="footer" class="form-label">Footer Message</label>
                <input type="text" name="footer" id="footer" class="form-control">
    
            </div>
            <div class="col-md-5 mx-2">
                <label for="inputPassword4" class="form-label">Message</label>
                <textarea name="message" id="message" cols="30" rows="10" class="form-control">This is your message,, use {name} to get a name.</textarea>
            </div>
         
        </div>

        <div class="mt-2" id="buttonblast">
            <button type="submit" id="buttonStartBlast" name="submit" class="btn btn-primary">Start Blast</button>
        </div>
    </form>
</div>

<script src="<?php echo e(asset('js/pages/select2.js')); ?>"></script>
<script src="<?php echo e(asset('plugins/select2/js/select2.full.min.js')); ?>"></script>
<script>
    
    

     
     
    $('#tipe').on('change',function(){
    
    if($(this).val() === 'schedule'){
        $('#datetime').removeClass('d-none')
    } else {
     $('#datetime').addClass('d-none')
    }
 })
     
      $('#buttonStartBlast').click((e)=> {
        e.preventDefault();
          let selected = []
        $('#lists option:selected').each(function() {
            selected.push($(this).val())
        });

        if(!$('#sender').val()    || !$('#message').val() || !$('#button1').val() || !$('#button2').val() || !$('#footer').val() || !$('#tag').val() || !$('#delay').val()){
            return alert('Please fill all field needed!');
        }
     
        if($('#tipe').val() === 'schedule' && !$('#datetime2').val()){
            return alert('Please set datetime if the tipe message is schedule');
        }

        let data;
        let typeReceipt
       
            data = {
                type : 'button',
                typeReceipt : 'tag',
                tag : $('#tag').val(),
                sender : $('#sender').val(),
                message : $('#message').val(),
                button1 : $('#button1').val(),
                button2 : $('#button2').val(),
                footer : $('#footer').val(),
                delay : $('#delay').val(),
                tipe : $('#tipe').val(),
                datetime : $('#datetime2').val(),
                
            }

       
        $('#buttonStartBlast').html(`<span class="spinner-grow spinner-grow-sm" role="status" aria-hidden="true"></span>
                                                Prossess Blasting...`)
       $.ajax({
           method : 'POST',
           headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
           url : '<?php echo e(route('blast')); ?>',
           data : data,
           dataType : 'json',
           success : (result) => {
             //  return console.log(result)
           window.location = ''
           },
           error : (err) => {
                console.log(err);
           }
       })
      })
    
    
</script><?php /**PATH /Users/ilmans/Documents/applications/wamd/resources/views/ajax/blast/formBlastButton.blade.php ENDPATH**/ ?>