@extends('layouts.app')

@section('content')
<style type="text/css">.loader.text-center { position: absolute; top: 160%;left: 55%;}
.loader { display: none; z-index: 999999;  }
.disable { opacity: 0.4; }
</style>

    <div class="col-sm-12">
        <form class=""  action="{{route('commissions.report.export')}}" method="GET">
            <input type="text" name="daterange" value=""  placeholder=" Select Date" style="position: relative; margin-left: 680px;">
            <h3 class="panel-title" style="margin-top: -28px;position: absolute; margin-left: 855px;"><button type="submit" class="btn btn-rounded btn-info pull-right"><i class="fa fa-download" aria-hidden="true"></i>{{ translate('Export report') }}</button></h3>
        </form>
       
    </div>
    <hr>
     <div class="loader text-center"><i class="fa fa-spinner fa-pulse fa-3x" aria-hidden="true" style="color: #038ece"></i></div>
    <div class="col-md-12">

    <div class="panel">
    <div class="panel-heading bord-btm clearfix pad-all h-100">
        <h3 class="panel-title pull-left pad-no">{{ translate('Commission bill report') }}</h3>

        <div class="pull-right clearfix">
            <form class="" id="sort_orders" action="" method="GET">
            	<input type="hidden" name="search" value="search">
                <!-- <div class="box-inline pad-rgt pull-left">
                    <div class="select" style="min-width: 200px;">
                        <select class="form-control demo-select2" name="seller_id" id="seller_type" onchange="sort_orders()" >
                            <option value="">{{translate('Filter by Partner Name')}}</option>
                             @foreach (\App\User::where('user_type', 'seller')->get() as $key => $partner)
                            <option value="{{$partner->id}}" @isset($inputs['seller_id']) @if(@$inputs['seller_id'] == $partner->id) selected @endif @endisset>{{$partner->shop->name}}</option>
                            @endforeach
                        </select>
                    </div>
                </div> -->

                <!-- <div class="box-inline pad-rgt pull-left">
                    <div class="select" style="min-width: 200px;">
                        <select class="form-control demo-select2" name="product_id" id="product_type" onchange="sort_orders()">
                            <option value="">{{translate('Filter by Product Name')}}</option>
                            @foreach (\App\Product::where('published', 1)->get() as $key => $product)
                            <option value="{{$product->id}}" @isset($inputs['product_id']) @if(@$inputs['product_id'] == $product->id) selected @endif @endisset>{{$product->name}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="box-inline pad-rgt pull-left">
                    <div class="select" style="min-width: 200px;">
                        <select class="form-control demo-select2" name="order_id" id="order_type" onchange="sort_orders()">
                            <option value="">{{translate('Filter by Order ID')}}</option>
                             @foreach (\App\Order::orderBy('id', 'desc')->get() as $key => $order)
                             <option value="{{$order->id}}" @isset($inputs['order_id']) @if(@$inputs['order_id'] == $order->id) selected @endif @endisset>{{$order->code}}</option>
                             @endforeach
                        </select>
                    </div>
                </div> -->

                <!-- <div class="box-inline pull-left">
                	<a href="{{ route('commissions_bill_report') }}" class="btn btn-warning">Reset</a>
                </div> -->

            </form>
        </div>
    </div>


            <!--Panel body-->
            <div class="panel-body">
                <div class="table-responsive">
                    <table class="table table-striped mar-no demo-dt-basic">
                        <thead>
                            <tr>
                                <th>Sr.N</th>
                                <th>{{ translate('Partner Name') }}</th>
                                <th>{{ translate('product Name') }}</th>
                                <th>{{ translate('Order Code') }}</th>
                                <th>{{ translate('Order Date') }}</th>
                                <th>{{ translate('Invoice No') }}</th>
                                <th>{{ translate('Sku') }}</th>
                                <th>{{ translate('Hsn code') }}</th>
                                <th>{{ translate('Sale price') }}</th>
                                <th>{{ translate('Rate Of Tax') }}</th>
                                <th>{{ translate('GST Amount on Sale') }}</th>
                                <th>{{ translate('Purchase Price') }}</th>
                            </tr>
                        </thead>
                            <tbody>
                                                           
                            </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

@endsection

@section('script')
<script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
<script type="text/javascript">
    $(function() {
      $('input[name="daterange"]').daterangepicker({
          autoUpdateInput: false,
          maxDate: new Date(),
          locale: {
              cancelLabel: 'Clear'
          }
      });

      $('input[name="daterange"]').on('apply.daterangepicker', function(ev, picker) {
          $(this).val(picker.startDate.format('MM/DD/YYYY') + ' - ' + picker.endDate.format('MM/DD/YYYY'));
      });

      $('input[name="daterange"]').on('cancel.daterangepicker', function(ev, picker) {
          $(this).val('');
      });

    });

    function sort_orders(el){
        $('#sort_orders').submit();
    }
    $(".btn-info").click(function(){

        $(".loader").show();
        $(".panel").addClass("disable");
        setTimeout(function()
            { 
                $(".loader").hide();
                $(".panel").removeClass("disable");
        }, 10000);  
    });


</script>
@endsection