@extends('companyuser::layouts.master')
@section('title', __('inventory::warehouse.transactions_summary.title'))
@section('extra-styles')
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/filter.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/style-svgFont.css') }}">
    <script src="{{ asset('js/app.js') }}" defer></script>
@endsection
@push('extra-styles')
    <link rel="stylesheet" type="text/css" href="{{ url('assets/css/filter.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ url('assets/css/plugins/input-dropdown/input-dropdown.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ url('assets/css/plugins/range/range.css') }}">
@endpush
@push('extra_scripts')
    <script src="{{ url('assets/js/plugins/range/balance-range.js') }}"></script>
    <script src="{{ url('assets/js/plugins/input-dropdown/input-dropdown.js') }}"></script>
@endpush
<style>
    .select2 {
        width: 100% !important;
    }
    a.disabled {
        pointer-events: none;
        cursor: default;
    }
    .table td,
    .table th {
        font-size: 0.8rem !important;
    }
    a.disabled-delete,
    a.disabled-delete:hover {
        background-color: #a7a7a7 !important;
        border-color: #a7a7a7 !important;
    }
    .filter-section-collapse form .input-group .input-group-addon.h-45 {
        height: 45px !important;
    }
</style>
@if (app()->getlocale() == 'en')
    <style>
        div.dataTables_filter {
            display: inline-block;
            width: 50%;
            vertical-align: middle;
            text-align: right;
        }
        #warehouse_value_report_table_filter {
            width: 100%;
        }
    </style>
@endif
@section('breadcrumb')
    <div class="row breadcrumbs-top">
        <div class="breadcrumb-wrapper col-xs-12">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a>@lang('companyuser::sidebar.Inventory')</a></li>
                <li class="breadcrumb-item"><a href="{{ route('company.warehouse.index', ['subdomain' => $subdomain]) }}">@lang('companyuser::sidebar.Warehouse')</a></li>
                <li class="breadcrumb-item"><a href="{{ route('company.warehouse.transactions', ['subdomain' => $subdomain, 'warehouse' => $warehouse->id]) }}">@lang('inventory::warehouse.transactions_summary.title')</a></li>
                <li class="breadcrumb-item active"><a href="{{ route('company.warehouse.show', ['subdomain' => $subdomain, 'warehouse' => $warehouse->id]) }}">{{ $warehouse->title }}</a></li>
            </ol>
        </div>
    </div>
@endsection

@section('content')
    <section>
        <div class="container-fluid">
            <div class="headBtns mx-1 fixed-btns">
                @can('inventory.warehouse.export')
                <div class="mb-1 pull-left">
                    <a href="{{route('company.warehouse.transactions.export', array_merge(['subdomain' => $subdomain, 'warehouse' => $warehouse->id], request()->all()))}}" class="pull-left" title="@lang('reports::reports.download_excel')">
                        <span class="icon-Excel action-icon"></span>
                    </a>
                    <a href="{{route('company.warehouse.transactions.print', array_merge(['subdomain' => $subdomain, 'warehouse' => $warehouse->id], request()->all()))}}" class="pull-left" target="_blank" title="@lang('Print')">
                        <span class="icon-Print action-icon"></span>
                    </a>
                    <a href="{{route('company.warehouse.transactions.download-as-pdf', array_merge(['subdomain' => $subdomain, 'warehouse' => $warehouse->id], request()->all()))}}" class="pull-left" target="_blank" title="@lang('Download')">
                        <span class="icon-Pdf action-icon"></span>
                    </a>
                </div>
                @endcan
            </div>
            <div class="row mt-1">
                <div class="col-md-12 mb-2">
                    <div>
                        <button class="btn btn-primary w-100 filterbtn" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
                            <div class="d-flex justify-content-between">
                                <span>@lang('Filter') </span><i class="fa fa-angle-down"></i>
                            </div>
                        </button>
                    </div>
                    <div class="collapse filter-collapse filter-section-collapse" id="collapseExample">
                        <form action="{{ route('company.warehouse.transactions', ['subdomain' => $subdomain, 'warehouse' => $warehouse->id]) }}" method="GET" class="form form-horizontal striped-rows form-bordered dev-form-validate" novalidate>
                            <div class="card card-body mb-0">
                                <div class="row">
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <div class="row">
                                                <div class="col-md-12 w-100-ipad-portrait">
                                                    <label for="products">@lang('inventory::warehouse.value_report.products')</label>
                                                </div>
                                                <div class="col-md-12 w-100-ipad-portrait mb-1">
                                                    <select name="product_id[]" id="products" multiple class="w-100 py-1 form-control select2-tag h-45" style="width:100%">
                                                        @foreach ($warehouse_products as $product)
                                                            <option value="{{ $product->product->id }}"
                                                                {{ (request('product_id') ?? []) && in_array($product->product->id, request('product_id')) ? 'selected' : '' }}>
                                                                {{ $product->product->name }}</option>
                                                        @endforeach
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <div class="row">
                                                <div class="col-md-12  w-100-ipad-portrait">
                                                    <label for="date_from">@lang('sales::invoices.Date')</label>
                                                </div>
                                                <div class="col-md-6 w-50-ipad-portrait mb-half">
                                                    <x-date-picker 
                                                        name="date_from" 
                                                        :value="request('date_from')"
                                                        input-id="date_from"
                                                        input-class="h-45"
                                                        :is-invalid="$errors->has('date_from')"
                                                    />
                                                    @error('date_from')
                                                    <div class="invalid-feedback text text-danger w-100 d-block" role="alert">
                                                        <p>{{ $message }}</p>
                                                    </div>
                                                    @enderror
                                                </div>

                                                <div class="col-md-6  w-50-ipad-portrait mb-half">
                                                    <x-date-picker 
                                                        name="date_to" 
                                                        :value="request('date_to')"
                                                        input-class="h-45"
                                                        :is-invalid="$errors->has('date_to')"
                                                        :min-date="request('date_from')"
                                                    />

                                                    @error('date_to')
                                                    <div class="invalid-feedback text text-danger w-100 d-block" role="alert">
                                                        <p>{{ $message }}</p>
                                                    </div>
                                                    @enderror
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="text-left mt-2">
                                    <button type="submit" class="btn btn-info mr-1 mb-1 p-5">
                                        <img src="{{ asset('assets/images/Done.png') }}" alt="done" width="35px">
                                    </button>
                                    <button type="reset" id="reset" class="btn btn-warning mb-1 p-5">
                                        <span class="icon-Delete f-32"></span>
                                    </button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
            @include('companyuser::errors.all')
            @include('companyuser::errors.lists')
            <div>
                <section id="configuration">
                    <div class="row">
                        <div class="col-xs-12">
                            <div class="card">
                                <div class="card-body collapse in">
                                    <table class="table table-striped table-responsive" style="width:100%;display: inline-table;border-collapse: collapse !important;" id="warehouse_value_report_table">
                                        <thead>
                                            <tr>
                                                <th style="text-align: center;border: 1px solid #000;">@lang('inventory::warehouse.transactions_summary.product_name')</th>
                                                <th style="text-align: center;border: 1px solid #000;" colspan="5">@lang('inventory::warehouse.transactions_summary.inbound')</th>
                                                <th style="text-align: center;border: 1px solid #000;" colspan="5">@lang('inventory::warehouse.transactions_summary.outbound')</th>
                                                <th style="text-align: center;border: 1px solid #000;">@lang('inventory::warehouse.transactions_summary.total')</th>
                                            </tr>
                                            <tr>
                                                <th>@lang('inventory::warehouse.transactions_summary.product_name')</th>
                                                <th>@lang('inventory::warehouse.transactions_summary.manual_inbound_count')</th>
                                                <th>@lang('inventory::warehouse.transactions_summary.purchase_bill_count')</th>
                                                <th>@lang('inventory::warehouse.transactions_summary.invoice_return_count')</th>
                                                <th>@lang('inventory::warehouse.transactions_summary.inbound_transfer_count')</th>
                                                <th>@lang('inventory::warehouse.transactions_summary.total_inbound_count')</th>
                                                <th>@lang('inventory::warehouse.transactions_summary.invoice_count')</th>
                                                <th>@lang('inventory::warehouse.transactions_summary.bill_return_count')</th>
                                                <th>@lang('inventory::warehouse.transactions_summary.outbound_transfer_count')</th>
                                                <th>@lang('inventory::warehouse.transactions_summary.manual_outbound_count')</th>
                                                <th>@lang('inventory::warehouse.transactions_summary.total_outbound_count')</th>
                                                <th>@lang('inventory::warehouse.transactions_summary.total_count')</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </section>
            </div>
        </div>
    </section>
@endsection

@section('extra_scripts')
    <script>
        gtag('event', 'web_inventory_warehouse_value_report');
        const appLang = "{{ app()->getLocale() }}";
        const loggedInUserId = {{ auth()->id() }};

        document.addEventListener('DOMContentLoaded', function () {
            $(function () {
                // Reset filter fields
                $('#reset').on('click', function (e) {
                    e.preventDefault();
                    $('input.form-control').val("");
                    $('.select2-tag').val("").trigger('change');
                });

                // DataTable init
                $('#warehouse_value_report_table').DataTable({
                    processing: true,
                    serverSide: true,
                    searching: false,
                    ajax: {
                        url: "{{ route('company.warehouse.transactions', ['subdomain' => $subdomain, 'warehouse' => $warehouse->id]) }}",
                        data: {!! json_encode(request()->all()) !!},
                        responsive: true,
                        ordering: true,
                        paging: true,
                        dataSrc: function (json) {
                            return json.data;
                        }
                    },
                    columns: [
                        { data: "product_name", className: "border-right" },
                        { data: "manual_inbound_count", orderable: false },
                        { data: "purchase_bill_count", orderable: false },
                        { data: "invoice_return_count", orderable: false },
                        { data: "inbound_transfer_count", orderable: false },
                        { data: "total_inbound_count", className: "border-right" },
                        { data: "invoice_count", orderable: false },
                        { data: "bill_return_count", orderable: false },
                        { data: "outbound_transfer_count", orderable: false },
                        { data: "manual_outbound_count", orderable: false },
                        { data: "total_outbound_count", className: "border-right" },
                        { data: "total_count" }
                    ],
                    @if (App::isLocale('ar'))
                        language: {
                            url: "https://cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Arabic.json"
                        },
                    @endif
                });
            });
        });
    </script>
@endsection