<?php echo view ('common/top_header_backdesk.php') ?>
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<link rel="stylesheet" href="https://cdn.datatables.net/2.0.3/css/dataTables.dataTables.css" />
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/3.0.1/css/buttons.dataTables.css">
<style>
  select.form-control, .form-control{outline: 1px solid #67676b;}
  .dataTables_wrapper label{font-size: auto!important;}
  div.dt-buttons > .dt-button, div.dt-buttons > div.dt-button-split .dt-button{padding:1px 10px}
  #purchase_order_list_filter input{padding: 7px 15px;border-radius: 5px;}
  .buttons-html5{border-radius: 0!important;background: beige!important;}
</style>
</head>

<?php $session = session(); ?>

<body>
   
    <div class="container-scroller">
       
        <!--Top navbar-->
      <?= view('common/top_navbar') ?>
      <!-- partial -->
      <div class="container-fluid page-body-wrapper">
        
        <!--sidenavbar starts-->
        <?= view('common/side_navbar') ?>  
        <!--sidenavbar ends-->
        
 
        <div class="main-panel">
          <div class="content-wrapper">
            <div class="card">
              <div class="card-body">
                 <?php if(session()->getFlashdata('error')): ?>
                <div class="alert alert-danger">
                    <?= session()->getFlashdata('error') ?>
                </div>
                <?php endif; ?>
             
                <div class="row">
                  <div class="col-12">
                    
                    <table id="purchase_order_list" class="table">
                      <thead>
                        <tr>
                          <th>#</th>
                          <th>Category</th>
                          <th>Full Name</th>
                          <th>Email Address</th>
                          <th>Phone Number</th>
                          <th>Feedback Type</th>
                          <th>Subject</th>
                          <th>Detail Feedback</th>
                
                        </tr>
                      </thead>
                      <tbody>
                        <?php
                            if(!empty($form)){
                                $i=0;
                                foreach($form as $row){
                                    $i++;
                                    ?>
                                    <tr>
                                        <td><?php echo $i?></td>
                                        <td><?php echo $row['category']?></td>
                                        <td><?php echo $row['name']?></td>
                                        <td><?php echo $row['email']?></td>
                                        <td><?php echo $row['mobile']?></td>
                                        <td><?php echo $row['feedback_type']?></td>
                                        <td><?php echo $row['subject']?></td>
                                        <td><?php echo $row['description']?></td>
                                 
                                    </tr>
                                    <?php
                                }
                            }
                        ?>
                      </tbody>
                    </table>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <!-- content-wrapper ends -->
          <!-- partial:../../partials/_footer.html -->
          <footer class="footer">
            <div class="d-sm-flex justify-content-center justify-content-sm-between">
              <span class="text-muted text-center text-sm-left d-block d-sm-inline-block">Copyright © <?=date('Y') . ' ' . COMPANY_FULL_NAME?> . All rights reserved.</span>
              <span class="float-none float-sm-right d-block mt-1 mt-sm-0 text-center">With gratitude from <i class="mdi mdi-heart text-danger"></i><a href="<?=CREDIT_LINK?>" target="_blank"><?=CREDIT_TITLE?></a></span>
            </div>
          </footer>
          <!-- partial -->
        </div>
        <!-- main-panel ends -->
      </div>
      <!-- page-body-wrapper ends -->
    </div>
    <!-- container-scroller -->
    <?php echo view ('common/footer_backdesk.php') ?>
    
    <script src="https://cdn.datatables.net/2.0.3/js/dataTables.js"></script>
    <script src="https://cdn.datatables.net/buttons/3.0.1/js/dataTables.buttons.js"></script>
    <script src="https://cdn.datatables.net/buttons/3.0.1/js/buttons.dataTables.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/pdfmake.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/vfs_fonts.js"></script>
    <script src="https://cdn.datatables.net/buttons/3.0.1/js/buttons.html5.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/3.0.1/js/buttons.print.min.js"></script>
    <script>
      (function($) {
        'use strict';
        $(function() {
          $('#purchase_order_list').DataTable({
            // "aLengthMenu": [
            //   [5, 10, 15, -1],
            //   [5, 10, 15, "All"]
            // ],
            "iDisplayLength": 10,
            "language": {
              search: ""
            },
            layout: {
                topStart: {
                  buttons: ['excelHtml5', 'pdfHtml5']
                }
            }
          });
          $('#purchase_order_list').each(function() {
            var datatable = $(this);
            // SEARCH - Add the placeholder for Search and Turn this into in-line form control
            var search_input = datatable.closest('.dataTables_wrapper').find('div[id$=_filter] input');
            search_input.attr('placeholder', 'Search');
            search_input.removeClass('form-control-sm');
            // LENGTH - Inline-Form control
            var length_sel = datatable.closest('.dataTables_wrapper').find('div[id$=_length] select');
            length_sel.removeClass('form-control-sm');
          });
        });
      })(jQuery);

      $(document).on('click','.list-cancel-btn',function(e){

        if(confirm('Are you sure you want to proceed with cancellation? Please review the purchase order details carefully before confirming.')){
          $this = $(this)
          $.ajax({
              type: 'POST', 
              url: '<?=base_url('asset/ajax-cancel-purchase-order')?>', 
              data: { id: $(this).data('id')}, 
              dataType: 'json',
              success: function (data) { 
                  console.log(data)
                  if(data.status == 0){
                    toast('danger',data.msg);
                  } else{ // success
                      $this.closest('tr').remove()
                      toast('success',data.msg);
                  }               
              }, 
              error: function(request, status, error) {
                  console.log(request.responseText);
              }
          });

        }
      });
    </script>    
</body>

</html>