<?php echo View::make('/../include/header'); ?>

<header>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.7/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.7/js/select2.min.js"></script>

</header>
<body>

<section id="main-content">
    <section id="container">
        <section class="wrapper">
            <div class="row mt">
                <div class="col-lg-12">
                <h4>Dashboard <i class="fa fa-angle-right"></i> Add items</h4>
                </div>
            </div>

            <p>
                    <button type="button" class="btn btn-sm btn-success pull-right" data-toggle="modal" data-target="#exampleModalCenter">
                        Add items
                    </button>
                </p>
                @foreach($item2 as $data)
                <h5>Customer Name : {{$data->customerorders -> name}} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;   Phone Number : {{$data->customerorders -> phone}}</h5>
                <h5>Address : {{$data->customerorders -> address}}</h5>
                <h5></h5>
                @break
                @endforeach <br>
                <div class="here" name="here" id="here">
            <table class="table" id="book-table">
                    <thead>
                          <tr>
                            <th style="width:60px" class="text-center">QTY</th>
                            <th class="text-left">DESCRIPTION</th>
                            <th style="width:140px" class="text-right">UNIT PRICE</th>
                            <th style="width:90px" class="text-right">TOTAL</th>
                            <th style="width:90px" class="text-right"></th>
                            <th style="width:90px" class="text-right"></th>
                          </tr>
                    </thead>
                    <tbody>
                    @foreach($item2 as $data)
                                        
                    <tr>
                        <td class="text-center">{{$data->qty}}</td>
     
                        <td>{{$data->orders->name}}
                        @if($data->attribute=="null" or $data->attribute=="")
                        @else
                            @foreach (json_decode($data->attribute) as $key => $val)
                                ({{$key }}:{{$val}})
                            @endforeach
                        @endif
                            </td>
                        <td class="text-right">{{$data->orders->sell_price}}</td>
                        <td class="text-right">
                        {{$data->qty * $data->orders->sell_price}}
                        </td>
                        <td class="text-right">
                                <button type="button" class="btn btn-primary btn-sm btn-edit" data-id="{{$data->id}}" data-delivery="{{$data->delivery}}" data-proname="{{$data->item_id}}" data-qty="{{$data->qty}}" data-toggle="modal" data-target="#editordermodel">Edit</button>
                        </td>
                        <td class="text-right">                
                            <a href="" data-id="{{$data->id}}" class="btn btn-danger btn-sm button" data-url="">Delete </a>
                        </td>
                    </tr>

                    
                    @endforeach 
                        
                            <tr>
                            <td colspan="2" rowspan="4">
                            
                            <td class="text-right"><strong>Delivery Charge</strong></td>
                            <td class="text-right">{{ $deli }}</td>
                        </tr> 
                        <tr>
                            <td class="text-right no-border">
                            <strong>Total</strong>
                            </td>
                            <td class="text-right"><strong>{{ $tot + $deli }}</strong></td>
                        </tr>
                       
                    </tbody>
                </table>
                </div>
                <div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
                    <div class="modal-dialog modal-dialog-centered" role="document">
                        <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title" id="exampleModalLongTitle">Add Items</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <form method="post" action="/editcustomerItems">
                          {{csrf_field()}}
                        <div class="modal-body">
                        <input type="hidden" value="{{ $cus_id }}" name="cus_id">
                            <div class="form-group row">
                                <label for="" class="col-sm-2 col-form-label">Product Name</label>
                                <div class="col-sm-10">

                                <select class="js-example-basic-single" name="nameproduct"  id="nameproduct" style="width:467px;">
                                    <!-- <option selected disabled>Product Name</option> -->
                                    @foreach($item as $data)
                                        <option value="{{$data->id}}">{{$data->name}}</option>
                                    @endforeach 
                                </select>
                                <script>
                                   $(document).ready(function() {
                                        $('.js-example-basic-single').select2();
                                    });
                                </script>

                                </div>
                            </div>
                            <div class="applenddata">

                            </div>

                            <div class="form-group row">
                                <label for="" class="col-sm-2 col-form-label">Quantity</label>
                                <div class="col-sm-10">
                                <input type="number" class="form-control" id="quantity" name="quantity" placeholder="Quantity" required>
                                </div>
                            </div>
                            <div class="form-group row">
                                <label for="" class="col-sm-2 col-form-label">Delivery Charge</label>
                                <div class="col-sm-10">
                                <input type="number" class="form-control" id="Delivery" name="Delivery" placeholder="Delivery Charge" required>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal" onclick="Reset();">Close</button>
                            <button type="submit" class="btn btn-primary">Save changes</button>
                        </div>
                        </form>
                        </div>
                    </div>
                    </div>
                    <div class="modal fade" id="editordermodel" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
                    <div class="modal-dialog modal-dialog-centered" role="document">
                        <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title" id="exampleModalLongTitle">Add Items</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <form method="post" action="/editupdateitem">
                          {{csrf_field()}}
                        <div class="modal-body">
                        <input type="text" value="{{ $cus_id }}" name="cus_id">

                        <div class="form-group row">
                                <label for="" class="col-sm-2 col-form-label">Product Name</label>
                                <div class="col-sm-10">
                                <div class="id_100">
                                <select class="js-example-basic-single" id="nameproduct2" name="nameproduct2" style="width:467px;">
                                    <!-- <option selected disabled>Product Name</option> -->
                                    @foreach($item as $data)
                                        <option id="{{$data->id}}" value="{{$data->id}}">{{$data->name}}</option>
                                        @endforeach 
                                </select>
                                </div>
                                <script>
                                   $(document).ready(function() {
                                        $('.js-example-basic-single').select2();
                                    });
                                </script>

                                </div>
                            </div>
                            <div class="applenddata2">

                            </div>
                            <input type="hidden" class="form-control" id="id" name="id" placeholder="Quantity" required>

                            <div class="form-group row">
                                <label for="" class="col-sm-2 col-form-label">Quantity</label>
                                <div class="col-sm-10">
                                <input type="number" class="form-control" id="quantity" name="quantity" placeholder="Quantity" required>
                                </div>
                            </div>
                            <div class="form-group row">
                                <label for="" class="col-sm-2 col-form-label">Delivery Charge</label>
                                <div class="col-sm-10">
                                <input type="number" class="form-control" id="Delivery" name="Delivery" placeholder="Delivery Charge" required>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                            <button type="submit" class="btn btn-primary">Save changes</button>
                        </div>
                        </form>
                        </div>
                    </div>
                    </div>
                    <div class="delete"><a onclick="return confirmation()"><i class="far fa-trash-alt"></i></a></div>

        </section>
    </section>
</section>

</body>

<script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.29.2/sweetalert2.all.js"></script>



<script>


$(document).on('click', '.btn-danger', function (e) {
    e.preventDefault();
    var id = $(this).data('id');
    let ele = this;
    console.log(id);

                            swal({
                            title: "Are you sure?",
                            text: "Are you Sure to Remove Order Item",
                            icon: "warning",
                            showCancelButton: true,
                confirmButtonColor: '#3085d6',
                cancelButtonColor: '#d33',
                confirmButtonText: 'Yes, delete it!',
                            dangerMode: true,
                        }).then(function(isConfirm) {
                            
                            if (isConfirm.value===true) {

                                    $.ajax({
                                        url: "{{url('/deleteitem')}}/"+id ,
                                        method: "POST",
                                        headers: {
                                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                                        },
                                        cache: false,
                                        contentType: false,
                                        processData: false,
                                        dataType: 'JSON',
                                        data:{
                                            "id":id
                                        },
                                        success: function (result, code, ex) {
                                            swal("Done!", "It was successfully deleted!", "success");
                                            // $(ele).closest('tr').hide();
                                            $("#here").load(location.href + " #here");
                                        },
                                        error: function (jqXHR, textStatus, errorThrown) {
                                            swal("Warning", "Unable to Process your request", "error");
                                        },
                                    });

                            } else {
                                swal("Cancelled", "No Treatment Removed", "error");
                            }
                        })
});



@if (session('success'))
        //swal("Success!","{{session('success')}}","success");

Swal.fire({
  
  type: 'success',
  title: 'Your work has been saved',
  text: "{{session('success')}}",
  showConfirmButton: false,
  timer: 1500
});


@endif
@if (session('error'))
    swal({
            title: "Error!",
            text: "{{session('error')}}",
            icon: "error",
            button: "OK",
        });
@endif

</script>


<script type="text/javascript">
    function Reset() {
    $("#nameproduct").val(1).change();
    }

    
</script>


<script>
$('#editordermodel').on('show.bs.modal', function (event) {
     
  var button = $(event.relatedTarget) // Button that triggered the modal
  var recipient = button.data('delivery') 
  var proname = button.data('proname') 
  var qty = button.data('qty') 
  var id = button.data('id') 
  
  
  var modal = $(this)
//   modal.find('.modal-title').text('New message to ' + recipient)
  modal.find('.modal-body #Delivery').val(recipient)
//   modal.find('.modal-body #nameproduct').val(proname)
  modal.find('.modal-body #quantity').val(qty)
  modal.find('.modal-body #id').val(id)

    $("#nameproduct2").val(proname).change();

  
})
</script>


    <script type="text/javascript">
    jQuery(document).ready(function ()
    {
            jQuery('select[name="nameproduct"]').on('change',function(){
               var countryID = jQuery(this).val();
               if(countryID)
               {
                  jQuery.ajax({
                     url : '/Editdropdownlist/getstates/' +countryID,
                     type : "GET",
                     dataType : "json",
                     success:function(data)
                     {
                      //  alert(data);
                        // console.log(data);
                        $('.att-group').remove()
                        
                        jQuery.each(data, function(key,value){
                            

                          $('.applenddata').append('<div class="form-group row att-group"><label for="'+value.attname+'" class="col-sm-2 col-form-label">Select '+value.attname+'</label><div class="col-sm-10"><select class="form-control" id="'+value.attname+'" name="product_properties['+value.attname+']" style="width:467px;"></select></div></div>')


                        //   $('.applenddata').append('<div class="form-group att-group"><label for="'+value.attname+'">Select '+value.attname+':</label><select id="'+value.attname+'" name="product_properties['+value.attname+']" class="form-control"style="width:250px"></select></div>')
                          word = value.attributes;

                          result = word.split(","); 
                          // console.log(result);
                          var i;
                          for (i = 0; i < result.length; i++) { 
                            $('#'+value.attname).append('<option value="'+ result[i] +'">'+ result[i] +'</option>');
                          }

                           
                        });
                     }
                  });
               }
               else
               {
                  $('select[name="nameproduct"]').empty();
               }
            });
    });
    </script>

    <script type="text/javascript">
    jQuery(document).ready(function ()
    {
            jQuery('select[name="nameproduct2"]').on('change',function(){
               var countryID = jQuery(this).val();
               if(countryID)
               {
                  jQuery.ajax({
                     url : '/Editdropdownlist/getstates2/' +countryID,
                     type : "GET",
                     dataType : "json",
                     success:function(data)
                     {
                      //  alert(data);
                        // console.log(data);
                        $('.att-group').remove()
                        
                        jQuery.each(data, function(key,value){
                            

                          $('.applenddata2').append('<div class="form-group row att-group"><label for="'+value.attname+'" class="col-sm-2 col-form-label">Select '+value.attname+'</label><div class="col-sm-10"><select class="form-control" id="'+value.attname+'" name="product_properties['+value.attname+']" style="width:467px;"></select></div></div>')


                        //   $('.applenddata').append('<div class="form-group att-group"><label for="'+value.attname+'">Select '+value.attname+':</label><select id="'+value.attname+'" name="product_properties['+value.attname+']" class="form-control"style="width:250px"></select></div>')
                          word = value.attributes;

                          result = word.split(","); 
                          // console.log(result);
                          var i;
                          for (i = 0; i < result.length; i++) { 
                            $('#'+value.attname).append('<option value="'+ result[i] +'">'+ result[i] +'</option>');
                          }

                           
                        });
                     }
                  });
               }
               else
               {
                  $('select[name="nameproduct2"]').empty();
               }
            });
    });
    </script>
       

<footer class="site-footer">
      <div class="text-center">
        <p>
          &copy; Copyrights <strong>Dashio</strong>. All Rights Reserved
        </p>
        <div class="credits">
          <!--
            You are NOT allowed to delete the credit link to TemplateMag with free version.
            You can delete the credit link only if you bought the pro version.
            Buy the pro version with working PHP/AJAX contact form: https://templatemag.com/dashio-bootstrap-admin-template/
            Licensing information: https://templatemag.com/license/
          -->
          Created with Dashio template by <a href="https://templatemag.com/">TemplateMag</a>
        </div>
        <a href="index.html#" class="go-top">
          <i class="fa fa-angle-up"></i>
          </a>
      </div>
    </footer>

<style>
    .site-footer {

    position: fixed;
   left: 0;
   z-index: -1;
   bottom: 0;
   width: 100%;
}
</style>
    <!--footer end-->
  </section>
  <!-- js placed at the end of the document so the pages load faster -->
  <!-- <script src="{{ asset('dash/lib/jquery/jquery.min.js') }}"></script>
  <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
  <script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>
   -->


  <script src="{{ asset('dash/lib/bootstrap/js/bootstrap.min.js') }}"></script>
  <script class="include" type="text/javascript" src="{{ asset('dash/lib/jquery.dcjqaccordion.2.7.js') }}"></script>
  <script src="{{ asset('dash/lib/jquery.scrollTo.min.js') }}"></script>
  <script src="{{ asset('dash/lib/jquery.nicescroll.js') }}" type="text/javascript"></script>
  <script src="{{ asset('dash/lib/jquery.sparkline.js') }}"></script>

<!--sweet alert-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.29.2/sweetalert2.all.js"></script>

  <!--common script for all pages-->
  <script src="{{ asset('dash/lib/common-scripts.js') }}"></script>
  <script type="text/javascript" src="{{ asset('dash/lib/gritter/js/jquery.gritter.js') }}"></script>
  <script type="{{ asset('dash/text/javascript" src="lib/gritter-conf.js') }}"></script>
  <!--script for this page-->
  <script src="{{ asset('dash/lib/sparkline-chart.js') }}"></script>
  <script src="{{ asset('dash/lib/zabuto_calendar.js') }}"></script>

</body>

</html>
