@extends('layouts.backend')

@section('extraCss')  
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.25/css/jquery.dataTables.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/fixedheader/3.1.2/css/fixedHeader.dataTables.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/fixedcolumns/3.3.3/css/fixedColumns.dataTables.min.css">
<link href="https://cdn.datatables.net/buttons/1.7.0/css/buttons.dataTables.min.css" rel="stylesheet">

<style type="text/css">
table.dataTable {    
  margin-top: 0px !important; 
  margin-bottom: 0px !important;
}

.fieldset{
    padding: 1rem !important;
    border : 2px dashed #d0d7dd !important;  

}

table.dataTable tr.odd { background-color: rgb(240, 241, 243);  }
table.dataTable tr.even{ background-color: white;  }
</style>
@endsection

@section('mainContentArea')
<div class="card card-default">
        <div class="card-header">
            <h4>Article Sizewise Report</h4>
        </div>       
         
        <div class="alert alert-default">
            <form action="{{ route('pos-stock-report') }}" id="articlereport">
                <h4>Filter  </h4>
                <table class="table filterPosSo">        
                    <tr>  
                         <a class="btn btn-md btn-primary" id="excelR" style="float:right; margin-bottom:10px;" href=" {{  ($warehouseName) ? route('articleSizeexport',[implode(",",$pos_id),$subsectionv,0,$color,0] ) : '#' }} ">Export Excel</a> 
                       <!--  <a class="btn btn-md btn-info" style="float:right; margin-bottom:10px;margin-right:10px;" href=" {{ ($warehouseName) ? route('articleSizegeneratePDF',[implode(",",$pos_id),$subsectionv,0,$color]) : '#' }} ">Export PDF</a> -->
                    </tr>
                    <tr>
                        {{-- <td width="15%">Warehouse</td> --}}
                        {{-- <td width="15%">Store</td> --}}
                        <td width="15%">Category</td>
                        <td width="15%">Article</td>
                        <td width="15%">Color</td>                        
                        <td colspan="2">ACTION</td>
                    </tr>
                    <tr>

                        {{-- <td>
                            <select name="warehouse_id[]" id="warehouse" class="input-md"  multiple="multiple" >
                                <option value="0">Any</option>
                                @foreach($ALL_WAREHOUSES as $warehouse)
                                <option value="{{ $warehouse->id }}" {{ ( !empty(request("warehouse_id")) && in_array($warehouse->id, request("warehouse_id")) ? "selected" : "") }}>{{ $warehouse->warehouse_code . ' ('.$warehouse->name.')' }}</option>
                                @endforeach
                            </select>
                        </td>

                        <td>
                            <select name="warehouse_id[]" id="Pos" class="input-md"  multiple="multiple">                                
                                @foreach($ALL_POS as $warehouse)
                                <option value="{{ $warehouse->id }}" {{ ( !empty(request("warehouse_id")) && in_array($warehouse->id, request("warehouse_id")) ? "selected" : "") }}>{{ $warehouse->warehouse_code . ' ('.$warehouse->name.')' }}</option>
                                @endforeach
                            </select>
                        </td> --}}
                        
                        <td>
                            <select name="subsection" id="subsection" class="input-md" >
                                <option value="">Any</option>
                                 @foreach($subsections as $subsection)
                                <option value="{{ $subsection->subsection }}" {{ request('subsection') == $subsection->subsection ? 'selected' : '' }}>{{ $subsection->subsection  }}</option>
                           
                                 @endforeach
                            </select>
                        </td> 

                        <td> 
                            <input name="article" id="article" class="form-control" value="{{ request('article') }}" >
                            {{-- <select name="article[]" id="article" class="input-md" multiple="multiple">            
                                @foreach($ListArticle as $articles)
                                <option value="{{ $articles->article }}" {{ ( !empty(request("article")) && in_array($articles->article, request("article")) ? "selected" : "") }}>{{ $articles->article  }}</option>
                                @endforeach
                            </select> --}}
                        </td>

                        <td>
                            <input name="color" id="color" class="form-control" value="{{ request('color') }}" >
                        </td>
                       
                        <td><button class="btn btn-block btn-success"><i class="fa fas fa-search" id="submit"></i></button></td>
                        <td><button class="btn btn-block btn-warning" type="button" onclick="window.location.href='{{ route('pos-stock-report') }}';"><i class="fa fas fa-refresh"></i></button></td>
                    </tr>
                </table>
            </form>
        </div>

        <div class="card-body table-responsive">

            <table class="table table-striped table-bordered " id="articleTables">
                <thead>
                   
                    <tr>
                        <th>#</th>
                        <th>store</th>
                        <th>Section</th>
                        <th>Subsection</th>
                        <th>Image</th>
                        <th>Article</th>
                        <th>Color</th>
                        @foreach($sizes as $size)
                        <th>{{$size}}</th>
                        @endforeach
                        <th>Total</th>
                    </tr>
                </thead>
                @php if(count($rows) > 0) { @endphp
                <tbody>

                 @php $totalcountallsize  = 0 ;  @endphp   
                
                @foreach($rows as $key => $row)
                   @php $totalrow = 0 ; @endphp
                    <tr>
                        @php
                        $article = \App\Article::with('category')->with('subcategory')->with('maincategory')->select(['id','image','main_category_id','category_id','sub_category_id','price'])->where('code',$productRows[$row]['article'])
                        ->first(); 
                        if(empty($article))
                        {
                           // dd($article,$productRows[$row]['article']);
                        }
                        $rcolor = str_replace([' ', '-'], "_", $productRows[$row]['color']);
                        if(!empty($article->id))
                        {
                        $aimg = \App\ArticleImg::where('product_id',trim($article->id))->where('color_name','LIKE', '%' .$rcolor. '%')->whereIn('sort_order',[0,1])->first();
                        // dd($aimg);    
                        $images = empty($aimg->imgname) || $aimg->imgname == 'NULL' ? 'https://via.placeholder.com/100x100.png?text=No Photo' : asset('/uploads/articles/photos/full'.$aimg->imgname);
                        }
                        if(empty($images))
                        {
                            $images = 'https://via.placeholder.com/100x100.png?text=No Photo';
                        }
                        @endphp
                        <td>{{ $key + 1 }}</td>
                        <td>{{ $productRows[$row]['store'] }}</td>
                        <td>{{ !empty($article->maincategory) ? $article->maincategory->name : $productRows[$row]['section'] }}</td>
                        <td>{{ !empty($article->category) ? $article->category->name : $productRows[$row]['subsection'] }}</td>
                       
                        <td>
                            <a data-toggle="modal" data-target="#ImageModal" id="gallery" data-image="@php echo $images; @endphp" >
                               <img src="{{ $images }}" style="width:100px;" class="img-fluid center-block img-rounded">
                            </a>
                        </td>
                        <td>{{ $productRows[$row]['article'] }}</td>
                        <td>{{ $productRows[$row]['color'] }}</td>

                        @foreach($sizes as $size)
                        <td>
                            {{ empty($articleProductCombinations[$row][$size]) ? 0 : $articleProductCombinations[$row][$size] }}
                            @php
                                
                            if(empty($productCountSize[$size])) {
                                $productCountSize[$size] = 0;
                            }
                            if(empty($articleProductCombinations[$row][$size])) {
                                $articleProductCombinations[$row][$size] = 0;
                            } 
                             $totalrow +=    (int)$articleProductCombinations[$row][$size] ;
                            $productCountSize[$size]+= (int)$articleProductCombinations[$row][$size];
                            @endphp
                        </td>
                        @endforeach
                                                <td>{{$totalrow}}</td>
                    </tr>

                @endforeach

                </tbody>
                <tfoot>
                <tr>
                        <td colspan="7"></td> 
                        @foreach($sizes as $size)
                         
                         <td> {{ empty($productCountSize[$size]) ? 0 : $productCountSize[$size] }} </td> 
                      
                        @endforeach
                        <td> {{$grandTotal}}</td>
                        
                </tr>
                </tfoot>
               @php } @endphp
            </table>
        </div>
</div>


<div class="modal fade " id="ImageModal" tabindex="-1" role="dialog" aria-hidden="true" >
    <div class="modal-dialog" role="document">
          <div class="modal-content">
              <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true">&times;</span>
                  </button>
              </div>
              <div class="modal-body">
                  <div id="carouselExample" class="carousel slide" data-ride="carousel">
                      <div class="carousel-inner">
                      <div class="carousel-item active " >
                      <img id='articlepop'  src="" alt="First slide" style="max-height:300px;">
                      </div>
                      </div>
                  </div>
              </div>
              <div class="modal-footer">
              <button type="button" class="btn btn-secondary"  data-dismiss="modal">Close</button>
              </div>
          </div>
    </div>
</div>
@endsection

@section('extraJs')

<script src="https://cdn.datatables.net/fixedheader/3.1.2/js/dataTables.fixedHeader.min.js" type="text/javascript"></script>
<script src="https://cdn.datatables.net/fixedcolumns/3.3.3/js/dataTables.fixedColumns.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js" ></script>
<script src="https://cdn.datatables.net/buttons/1.7.0/js/buttons.html5.min.js" ></script>

<script type="text/javascript">  


    $("#submit").click(function () {    

        if (($('#warehouse').val() == '') && ($('#Pos').val() == '')) {

            alert("Please Select Warehouse / Store");
           
            $("#articlereport").attr("disabled", "disabled");

            return false;
        }
        
    });
$(document).ready(function() {
          
$('#articleTables').DataTable( {
     "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],         
    dom: 'Bfrtip',
    buttons: [ 
    'colvis',
    {
    extend: 'excelHtml5',
    autoFilter: true,
    sheetName: 'Exported data',
    exportOptions: {
    columns: ':visible'
    },
    footer: true
    }                     
    ],                   
    colReorder: true,  
    paging: false ,
    scrollX: true,
    scrollY: "800px",
    scrollCollapse: true,
    
    fixedColumns:   {
    leftColumns: 0,

    }
  
} );
});

$(function () {
  $('#ImageModal').on('show.bs.modal', function (event) {
  var button = $(event.relatedTarget); // Button that triggered the modal
  var newSrc = button.data('image'); // Extract info from data-* attributes

  console.log(newSrc);
  $('#articlepop').attr('src', newSrc);
  });
});
</script>

@endsection