@extends('layouts.master')

@section('page_title', 'Reports / Dispatch Report')
@section('title', 'Reports / Dispatch Report')
@section('main_item', 'Reports')
@section('sub_item', 'Reports / Dispatch Report')

@section('content')
 <style>
    th.sort {
        color: white;
    }
    th.sort:hover {
        color: blue;
    }
    th.sort a {
        color: inherit;
        text-decoration: none;
    }
    th.sort a:hover {
        color: blue;
    }
</style>
<div class="col-12">
    <div class="card">
        <div id="accordion">
            <div class="border-bottom card-header" style="background-color: white; cursor: pointer;" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                <h4 class="mb-0 header-title">
                    Filter
                </h4>
            </div>
            <div id="collapseOne" class="collapse show mt-3" aria-labelledby="headingOne" data-parent="#accordion">
                <div class="card-body">
                    <form action="{{ route('dispatch_list') }}" method="GET">
                        <div class="row">
                            <div class="col-md-3" @if ($setting->business_location != '1') style="display: none" @endif>
                                <div class="form-group">
                                    <label class="required" style="font-weight: bold">Business Location</label>
                                    <select class="form-control custom-select" id="business_location_id" name="business_location_id">
                                        <option value="">All</option>
                                        @if (Auth::user()->role_id == '1')
                                            @foreach ($users_access_location as $business_location)
                                                @if ($business_location->is_active == '1')
                                                    <option value="{{ $business_location->id }}" {{ request('business_location_id') == $business_location->id ? 'selected' : '' }}>
                                                        {{ $business_location->name }}
                                                    </option>
                                                @else
                                                @endif
                                            @endforeach
                                        @else
                                            @foreach ($users_access_location as $business_location)
                                                @if ($business_location->is_active == '1')
                                                    <option value="{{ $business_location->business_location_id }}" {{ request('business_location_id') == $business_location->business_location_id ? 'selected' : '' }}>
                                                        {{ $business_location->name }}
                                                    </option>
                                                @else
                                                @endif
                                            @endforeach
                                        @endif
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label style="font-weight: bold" for="reportrange">Date (Dispatched)</label>
                                    <div class="input-group">
                                        <input type="text" class="form-control" name="range" id="reportrange" readonly>
                                        <div class="input-group-append">
                                            <span class="input-group-text"><i class="dripicons-calendar"></i></span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <label style="font-weight: bold" for="product">Product Name</label>
                                <div class="input-group">
                                    <select class="form-control select2" id="product" name="product">
                                        <option value="">All</option>
                                        @foreach ($products as $product)
                                            <option value="{{ $product->id }}" {{ request('product') == $product->id ? 'selected' : '' }}>
                                                {{ $product->product_name }}
                                            </option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <label style="font-weight: bold" for="total_dispatch_quantity">Total Dispatch Quantity</label>
                                <div class="card text-white" style="background:#454d55;">
                                    <div class="card-body">
                                        <p class="card-text" id="total_dispatch_quantity">{{ $total_quantity ?? '0' }}</p>
                                    </div>
                                </div>
                            </div>                                                
                        </div>
                        <div class="row">
                            <div class="col-md-12 text-left">
                                <button type="submit" class="btn btn-primary">Filter</button>
                                <a href="{{ route('dispatch_list') }}" class="btn btn-danger">Reset</a>
                                
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="col-12">
    <div class="card">
        <div class="card-body">
            <div class="table-responsive dash-social">
                <table class="table table-hover">
                    <thead class="thead-dark">
                        <tr>
                            <th class="sort"><a href="{{ route('dispatch_list', array_merge(request()->query(), ['sort' => 'order_id', 'direction' => request('direction') === 'asc' ? 'desc' : 'asc'])) }}">Order Id</a></th>
                            <th class="sort"><a href="{{ route('dispatch_list', array_merge(request()->query(), ['sort' => 'product_name', 'direction' => request('direction') === 'asc' ? 'desc' : 'asc'])) }}">Product Name</a></th>
                            <th class="sort"><a href="{{ route('dispatch_list', array_merge(request()->query(), ['sort' => 'updated_at', 'direction' => request('direction') === 'asc' ? 'desc' : 'asc'])) }}">Dispatch Date</a></th>
                            <th class="sort"><a href="{{ route('dispatch_list', array_merge(request()->query(), ['sort' => 'qty', 'direction' => request('direction') === 'asc' ? 'desc' : 'asc'])) }}">Quantity</a></th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($sales as $sale)
                            <tr>
                                <td>{{ $sale->order_id }}</td>
                                <td>{{ $sale->product_name }}</td>
                                <td>{{ $sale->updated_at }}</td>
                                <td>{{ $sale->qty }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                    <tfoot>
                        <tr>
                            <th colspan="3" style="text-align:right">Total Dispatched Quantity</th>
                            <th style="font-weight: bold">{{ $total_quantity }}</th>
                        </tr>
                    </tfoot>
                </table>
                <div class="d-flex justify-content-end">
                    {{ $sales->appends(request()->query())->links() }}
                </div>
            </div>
        </div>
    </div>
</div>

<div id="payment" class="modal fade"></div>
<input type="hidden" id="enable_today_date" value="{{ $setting->enable_today_date == '1' ? '1' : '0' }}">

@endsection

@section('scripts')
    <script>
        $(document).ready(function() {
            var getUrlParameter = function getUrlParameter(sParam) {
                var sPageURL = decodeURIComponent(window.location.search.substring(1)),
                    sURLVariables = sPageURL.split('&'),
                    sParameterName,
                    i;
                for (i = 0; i < sURLVariables.length; i++) {
                    sParameterName = sURLVariables[i].split('=');

                    if (sParameterName[0] === sParam) {
                        return sParameterName[1] === undefined ? true : sParameterName[1];
                    }
                }
            };
            var report_date = getUrlParameter('range');
            myString = report_date.split('+-+').join('/');
            var result = myString.split('/');

            var enableTodayDateForCallList = document.getElementById('enable_today_date').value;

            let ranges = {};

            if (enableTodayDateForCallList !== '1') {
                ranges['All Data'] = ['2020-01-01', moment()];
            }

            ranges['Today'] = [moment(), moment()];
            ranges['Yesterday'] = [moment().subtract(1, 'days'), moment().subtract(1, 'days')];
            ranges['Day before yesterday'] = [moment().subtract(2, 'days'), moment().subtract(2, 'days')];
            ranges['Last 7 Days'] = [moment().subtract(6, 'days'), moment()];
            ranges['Last 30 Days'] = [moment().subtract(29, 'days'), moment()];
            ranges['This Month'] = [moment().startOf('month'), moment().endOf('month')];
            ranges['Last Month'] = [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')];
            ranges['Last 6 Months'] = [moment().subtract(5, 'month'), moment()];

            $('#reportrange').daterangepicker({
                startDate: result[0],
                endDate: result[1],
                ranges: ranges,
                locale: {
                    format: 'Y-M-DD'
                }
            });
        });
    </script>
@endsection