@extends('layouts.admin') @section('content')
<!-- Content Header (Page header) -->
<style>
   .lazur-bg {
   background-color: #3498db ;
   color: #ffffff;
   }
   .widget {
   border-radius: 5px;
   padding: 15px 20px;
   margin-bottom: 10px;
   margin-top: 10px;
   }

  .to_form_div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: absolute;
    left: 50%;
    z-index: 10;
    transform: translate(-50%);
  } 
  .serch_form_inr label {
      margin-bottom: 0;
      margin-right: 5px;
  }
  .serch_form_inr {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    justify-content: center;
  }
  .serch_form_inr select{
    border: 1px solid #ced4da;
    width: 150px !important;
    height: 31px;
  }
  .pos_rel{
    position: relative;
  }
  .player_outer{
    display: flex;
    
  }
  .player_outer .player{
    margin-right: 10px
  }
  .img {
  margin-left: auto;
  margin-right: auto;
}
#row-select_wrapper .row:nth-child(2) .col-sm-12{
  overflow-x: scroll;
}
#row-select_wrapper .row:nth-child(2) .col-sm-12 table.table-bordered{
    min-width: 1600px;
}
</style>
<meta id="ddd" name="csrf_token" content="{{ csrf_token() }}">
<div class="breadcrumbs">
   <div class="col-sm-8">
      <div class="page-header float-left">
         <div class="page-title">
            <h4>Scan <strong>{{$inventoriesname->name}}</strong></h4>
         </div>
      </div>
   </div>
   <div class="col-sm-4">
      <div class="page-header float-right">
         <div class="page-title">
            <ol class="breadcrumb text-right">
               <!--<li><a href="{{url('/admin/dashboard')}}">Dashboard</a></li>-->
               <!--<li><a href="#">Table</a></li>-->
               <li><a href="{{url('/admin/inventories/lists')}}">Inventories</a></li>
               <li class="active">Scan</li>
            </ol>
         </div>
      </div>
   </div>
</div>
@if (session('success'))
         <div class="col-sm-12">
        <div class="alert  alert-success alert-dismissible fade show" role="alert">
                    <span class="badge badge-pill badge-success">Success</span> {{session('success')}}
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                        <span aria-hidden="true">×</span>
                    </button>
                </div>
       </div>  
       @endif  
<div class="content mt-3">



   <div class="animated fadeIn">
      <div class="row">
         <div class="col-md-12">
            <p class="alert alert-success" id="msg" style="display: none">Quantity Updated Successfully</p>
            <div class="card">
               <div class="card-header">
                  <div class="col-lg-4">
                     <div class="widget style1 lazur-bg">
                        <div class="row">
                           <div class="col-sm-8">
                              <h6 class="font-bold">Total Units
                              </h6>
                           </div>
                           <div class="col-sm-4">
                              <h5 class="font-bold" id="total_units">
                                 <span id="total-quantity">{{$totalunitquantity}}
                                 </span>
                              </h5>
                           </div>
                        </div>
                     </div>
                  </div>
                  <div class="col-lg-4">
                     <div class="widget style1 lazur-bg">
                        <div class="row">
                           <div class="col-sm-8">
                              <h6 class="font-bold">Total Cases
                              </h6>
                           </div>
                           <div class="col-sm-4">
                              <h5 class="font-bold" id="total_units">
                              <span id="total-casequantity">{{$totalcasequantity}}</span>

                              </h5>
                           </div>
                        </div>
                     </div>
                  </div>
                  <div class="col-lg-4">
                     <div class="widget style1 lazur-bg">
                        <div class="row">
                           <div class="col-sm-6">
                              <h6 class="font-bold">Total Value
                              </h6>
                           </div>
                           <div class="col-sm-6">
                              <h5 class="font-bold" id="total_units">
                              <span id="total-value">  
                              ${{number_format($totalpricevalue,2)}}
                              </span>
                              </h5>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
               <div class="card-header">
                  <!--<strong class="card-title">Recently Scanned</strong>-->
                  <div class="col-lg-8">
                     <strong class="card-title">Recently Scanned
                     </strong>
                  </div>
                  <div class="col-lg-2">
                     <a href="{{url('/admin/inventories/exportUserData/'.$inventoriesname->id)}}" type="button" class="btn btn-primary" data-toggle="tooltip" title="Export">Inventory Export
                     </a> 
                   </div>  
                   <div class="col-lg-2">  
                     <a href="{{url('/admin/inventories/delete/'.$id)}}" class="btn btn-primary remove-record" data-toggle="modal" data-url="{{url('/admin/inventories/delete/'.$id)}}" data-id="{{$id}}" data-target="#custom-width-modal-inventory" title="Delete">Delete Inventory</a>

                  </div>
               </div>
               <div class="card-body pos_rel">
                 
                  
                  <div id="replace">
                  <table id="row-select" class="table table-striped table-bordered">
                     <thead>
                        <tr>
                          @if(isset($fields)) 
                             <th>Sr.No</th>
                             <th>Image</th>
                             <th>Location</th>
                             <th>Input Code</th>
                             <th>Scan By</th>
                             @foreach($fields as $key => $value)
                              @if($value->field_name!="image")
                                
                                <th>{{$value->field_name}}</th>
                                @endif
                             @endforeach
                                <th>Action</th> 
                          @endif 
                        </tr>
                     </thead>
                     <tbody class="itemdata">
                      @if(isset($Itemdata)) 
                                                            @foreach($Itemdata as $key => $ItemdataValue)
                                
                              <tr id="{{$useridentification[$i]['useridentification']}}">
                                <td>{{$i+1}}</td>
                                @if(isset($itemImage) && count($itemImage[$i]) > 0)
                                  <td  title="Image" style="cursor: pointer;" class="details-control imageview" data-id="{{$useridentification[$i]['useridentification']}}"><img src="{{url('/img/iPad-icon.png')}}"  height="30" width="30"></td>
                                @else
                                  <td>No Image</td>
                                @endif
                                
                                @if(isset($Inventory_location[$i]['location']))
                                <td>{{$Inventory_location[$i]['location']->name}}</td>
                                @endif
                                <td>{{$scanbarcode[$i]['scanbarcode']}}</td>
                                <td>{{$useridentification[$i]['useridentification']}}</td>
                                @foreach($ItemdataValue as $key => $ItemdataValue)
                                    <td>{{ $ItemdataValue }}</td>
                                @endforeach
                               
                                <td> 
                                <a href="" class="btn btn-sm fa fa-list-alt view-record"  onClick="reply_click({{$inventoriesname->id}}, '{{$ItemId[$i]['item_id']}}', '{{$LocationId[$i]['location_id']}}');"  data-toggle="modal" data-id="" data-target="#myview"></a>  
                                <a href="{{url('/admin/inventories/inventoryItem/'.$ItemId[$i]['item_id'].'/'.$LocationId[$i]['location_id'].'/'.$InventoryId[$i]['inventory_id'].'/'.$slug[$i]['itemslug'])}}" class="btn btn-sm fa fa-pencil" data-toggle="tooltip" title="Edit"></a>
                                </td>
                                
                              </tr>
                                                            @endforeach
                        @endif
                        
                     </tbody>
                       
                  </table>
                  </div>
               </div>
            </div>
         </div>
      </div>
   </div>
   <!-- .animated -->
</div>


  
<div id="imageLink">
	<div class="player_outer"> 
    <div class="result-data"></div>
    <img id="imgloader" style="display:none" src="{{url('/img/loading.gif')}}">
  </div>
   
</div>




<!-- .content -->
<div class="modal fade" id="myview" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" >
   <div class="modal-dialog">
      <div class="modal-content">
         <div class="modal-header" style="background-color: #007bff";>
            <span class="modal-title" style="color: #fff;">Inventory Item Information</span>
            <button type="button" class="close" data-dismiss="modal">&times;</button>
         </div>
         <div class="modal-body viewdone">
         </div>
         <div class="modal-footer">
            <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
         </div>
      </div>
   </div>
</div>
<!-- /.modal -->

 <div id="custom-width-modal-inventory"  class="modal fade" tabindex="-1" role="dialog" aria-labelledby="custom-width-modalLabel" aria-hidden="true" style="display: none;">
          <div class="modal-dialog" style="width:55%;">
            <form action="" method="POST" class="remove-record-model">
                 {{ csrf_field() }}
               <div class="modal-content">
                  <div class="modal-header">
                     <div>Delete Inventory</div>
                     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                  </div>
                  <div class="modal-body">
                     <h4>Are you sure want to delete this inventory?</h4>
                  </div>
                  <div class="modal-footer">
                     <button type="button" class="btn btn-default waves-effect remove-data-from-delete-form" data-dismiss="modal">Close</button>
                     <button data-token="{{ csrf_token() }}" type="submit" class="btn btn-primary">Delete</button>
                  </div>
               </div>
            </form>
          </div>
       </div>
<script>

$(function() {

    // for fancybox library
    $('.fancybox').fancybox({
      padding: [5,5,5,5],
    });
   }); 


   function reply_click(id,item_id,location_id) {
     var id = id;
     var item_id = item_id;
     var location_id = location_id;
    // alert(location_id);
     var csrf = $('meta[name="csrf_token"]').attr('content');
      var url ="{{url('admin/inventories/viewitem/')}}"+'/'+id+'/'+item_id+'/'+location_id;
          $.ajax({
         url:url,
         type: 'POST',
         data: {'_token': csrf},
         dataType: 'json',
        success: function( response ){
             console.log( response.html );
             $(".viewdone").html(response.html);
            },
            error: function( e ) {
                console.log(e);
            }
   });
   }

jQuery(document).ready(function($) {

    $("#location_search").on('change', function() {
        var location_id = $(this).val();
        var inventory_id = "{{$id}}";
        var csrf = $('meta[name="csrf_token"]').attr('content');
        if(location_id){
               $.ajax ({
                type: 'POST',
                url: "{{url('admin/inventories/inventorydetail')}}"+'/'+inventory_id,
                data: {'_token': csrf,location: '' + location_id + '',inventory:inventory_id},
                success : function(response) {
                    $(".itemdata").html(response.html);
                    //alert(response.html);
                },error:function(e){
                alert("error");}
            });
        }
    });
});
</script>


<script>

  function format () {
    var html=document.getElementById('imageLink').innerHTML;
    return html;
  }

  $('.imageview').click(function(){
	var csrf = $('meta[name="csrf_token"]').attr('content');
     var userIdentification = $(this).attr('data-id');   
               $(".result-data").html(''); 
               $('#imgloader').show();
               $.ajax ({
                type: 'POST',
                url: "{{url('admin/inventories/getImage')}}"+'/'+userIdentification,
                data: {'_token': csrf},
                success : function(response) {
                    //console.log(response);
                    $('#imgloader').hide();
                    $(".result-data").html(response.html);
                    
                },error:function(e){
                  $('#imgloader').hide();
                  $(".result-data").html("Unable to process right now");
                 }
            });
          
	  
	  });
var old_count = 0;
var i = 0; 
setInterval(function(){
    jQuery(document).ready(function($) {
            var inventory_id = "{{$id}}";
            //var i = 0;
            $.ajax ({
                    type: 'get',
                    url: "{{url('admin/inventories/inventorydetail')}}"+'/'+inventory_id,
                    success : function(response) {
                      
                        $("#replace").html(response.html);
                        $("#total-quantity").html(response.totalunitquantity)
                        $("#total-casequantity").html(response.totalcasequantity)
                        $("#total-value").html(response.totalvalue)
                       if (response.itemCount > old_count) {
                          if (i == 0){
                            old_count = response.itemCount;
                          } 
                          else
                          {
                            $('.notify').css("background-color","red").show().delay(2000).removeAttr("background-color");
                            old_count = response.itemCount;
                          }
                        } 
                        i=1; 
                       
                    },error:function(e){
                    //alert("error");
                    }
                });
    });
},30000);
//setInterval(getData, 10000);
</script>


@endsection