@extends("newDashboard.index")

@section("css")
    <link rel="stylesheet" href="{{asset('metronic/css/data-table.css')}}">
@endsection

@section("main-content")
    <div class="content-wrapper">
        <div class="page-header">
            <h3 class="page-title">
      <span class="page-title-icon bg-gradient-primary text-white me-2">
        <i class="mdi mdi-cards-variant menu-icon"></i>
      </span> {{__('messages.Item Expiry Report')}}
            </h3>
        </div>
        <div class="row">
            <div id="success_message"></div>
            <div id="date_error" style="color: red;"></div>

            <div class="col-12">
                <form  id="searchInExpiryReport" method="POST"  class="row justify-content-center align-items-center">
                    @csrf
                    <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3 col-xl-4">
                        <label >{{ __('validation.Select', ['attribute' => __('messages.Item')]) }}</label>
                        <select id="itemsList" name="item_id" class="js-example-disabled-results select2 form-control">
                            <option value="">{{ __('validation.Select', ['attribute' => __('messages.Item')]) }}</option>
                            @foreach($items as $item)
                                <option value="{{$item->id}}">{{$item->name}}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3 col-xl-4">
                        <label >{{ __('messages.From') }}</label>
                        <input id="from_date" type="date" class="form-control" name="date_from" >
                    </div>
                    <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3 col-xl-4">
                        <label >{{ __('messages.To') }}</label>
                        <input id="to_date" type="date" class="form-control" name="date_to" >
                    </div>
                    <div class="col-12 col-sm-12 col-md-4 col-lg-3 col-xl-2 mt-3 mt-md-0">
                        <button class="btn btn-primary btn-block">{{__('messages.Submit')}}</button>
                    </div>
                </form>
                <br/>
                <br/>
            </div>
            <div class="table-responsive customscroll ">

                <table class="table datatable text-center" id="table">
                    <thead>
                    <tr>
                        <th>{{__('messages.ID')}}</th>
                        <th>{{__('messages.Items')}}</th>
<!--                         <th>{{__('messages.Inventories')}}</th> -->
                        <th></th>
                    </tr>
                    </thead>
                    <tbody></tbody>
                </table>
            </div>
        </div>
    </div>

@endsection

@section("scripts")
    <script>
        var translations = {
            'ID': '{{ __("messages.ID") }}',
            'Permit ID': '{{ __("messages.Permit ID") }}',
            'Status': '{{ __("messages.Status") }}',
            'Driver Name': '{{ __("messages.Driver Name") }}',
            'Rejected Orders': '{{ __("messages.Rejected Orders") }}',
            'Inventories Items': '{{ __("messages.Inventories Items") }}',
            'From Date': '{{ __("messages.From Date") }}',
            'To Date': '{{ __("messages.To Date") }}',
            'Items': '{{ __("messages.Items") }}',
            'Inventories': '{{ __("messages.Inventories") }}',
            'expire date': '{{ __("messages.expire date") }}',
            

        };
    </script>
    <script src="{{asset('metronic/js/pages/item-expiry-report.js?v=').uniqId()}}"></script>
@endsection