@extends('backend.layouts.app')

@section('content')

<div class="p-3">
    <div class="card">
        <div class="col-12 mb-5">
            <label for="" class="mb-3">Select Featured Items: </label>
            <table class="table table-sm table-hover table-stripped" id="promoTable">
                <thead>
                <tr>
                    <th>Image</th>
                    <th>Product Name</th>
                    <th> <input type="checkbox" class="select-all" name="" id="checkAll"> <label for="checkAll">Select All</label></th>
                </tr>
                </thead>
                <tbody>

                @foreach ($data as $items)
                <tr>
                    <td>
                        <label for="{{$items->id}}">
                            <img height="50" src="{{ asset('uploads/product/' . $items->thumbnail_image)}}" alt="">
                        </label>
                    </td>
                    <td>
                        <label for="{{$items->id}}">
                            <p class="mb-0 font-weight-normal">
                                {{ $items->model }}
                            </p>
                        </label>
                    </td>
                    <td> 
                        <input class="checkbox" type="checkbox" id="{{$items->id}}" value="{{ $items->id }}" name="product_promo[]">
                     </td>
                    
                </tr>
                @endforeach

                

                </tbody>
            </table>
        </div>
    </div>
</div>




@endsection



<script>
    $(document).ready( function () {
        $('#promoTable').DataTable();
    } );
      
      $("#checkAll").change(function () {
          $("input:checkbox").prop('checked', $(this).prop("checked"));
      });
      
      $("#discount").change(function () {
          if ($(this).val() == 'Fixed' || $(this).val() == 'Fixed count') {
              $('#amount').text('Fixed amount:')
          }else{
              $('#amount').text('Percentage amount: %')
          }
          
          if ($(this).val() == 'Percentage count' || $(this).val() == 'Fixed count') {
              $("#countParent").removeClass('d-none')
              $("#countInput").prop('disabled', false);
          }else{
              $("#countInput").prop('disabled', true);
              $("#countParent").addClass('d-none')
          }
      });
      if ($("#discount").val() == 'Fixed' || $("#discount").val() == 'Fixed count') {
          $('#amount').text('Fixed amount:')
      }else{
          $('#amount').text('Percentage amount: %')
      }
      
      if ($("#discount").val() == 'Percentage count' || $("#discount").val() == 'Fixed count') {
          $("#countParent").removeClass('d-none')
          $("#countInput").prop('disabled', false);
      }else{
          $("#countInput").prop('disabled', true);
          $("#countParent").addClass('d-none')
      }
      
      if ($('#discount').val() == 'Fixed') {
          $('#amount').text('Fixed:')
      }else if($('#discount').val() == 'Fixed count'){
          $('#amount').text('Fixed amount:')
      }else{
          $('#amount').text('Percentage amount: %')
      }
      </script>