@extends('layouts.content')
@section('body_content')
    <main>
        <header class="page-header page-header-dark bg-gradient-primary-to-secondary pb-10">
            <div class="container-xl px-4">
                <div class="page-header-content pt-4">
                    <div class="row align-items-center justify-content-between">
                        <div class="col-auto mt-4">
                            <h1 class="page-header-title">
                                <div class="page-header-icon me-4">
                                    <i class="fas fa-newspaper fa-fw"></i>
                                </div>
                                Warehouse Stock Reports
                            </h1>
                        </div>
                    </div>
                </div>
            </div>
        </header>
        <div class="container-xl mt-n10 px-4">
            <div class="card mb-4">
                <div class="card-header py-2">
                    <div class="row">
                        <div class="me-auto col-auto my-auto">
                            Warehouse Stock Reports
                        </div>
                        <div class="ms-auto col-auto">
                            <div class="dropdown no-caret">
                                <button class="btn btn-transparent-dark btn-icon dropdown-toggle" id="dropdownMenuButton"
                                    type="button" data-bs-toggle="dropdown">
                                    <i class="fas fa-ellipsis-vertical fa-fw"></i>
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card-body">
                    <div class="container">
                        @include('partials.alert')
                        <div class="row mt-3">
                            <div class="col-12">
                                <div class="row">
                                    <div class="col-lg-6 mt-3 mt-lg-0">
                                        <label>Company</label>
                                        <select class="form-control" id="warehouse_stock_reports_company_uid"></select>
                                    </div>
                                    <div class="col-lg-6 mt-3 mt-lg-0">
                                        <label>Division</label>
                                        <select class="form-control" id="warehouse_stock_reports_division_uid"></select>
                                    </div>

                                    <div class="col-lg-6 mt-3">
                                        <label>Item</label>
                                        <select class="form-control"
                                            id="warehouse_stock_reports_warehouse_item_uid"></select>
                                    </div>
                                    {{-- <div class="col-lg-6 mt-3">
                                        <label>Record Type</label>
                                        <select class="form-control" id="warehouse_stock_reports_record_type_uid"></select>
                                    </div> --}}

                                    <div class="col-lg-6 mt-3">
                                        <label>Report Date</label>
                                        <input type="text" class="form-control daterangepickerinput"
                                            id="warehouse_stock_reports_date">
                                    </div>

                                    <div class="col-12"></div>
                                    <div class="col-lg-auto">
                                        <label class="invisible">Report Date</label>
                                        <button class="form-control btn btn-primary" onclick="initTable()">Search</button>
                                    </div>
                                </div>
                            </div>

                            <div class="col-12 mt-5">
                                <table width="100%" id="warehouse_stock_reports_data_table"></table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </main>

    <script src="/js/selectize.js"></script>
    <script src="/js/ga/stock-reports/functions/currency.js"></script>
    <script src="/js/ga/stock-reports/functions/companies.js"></script>
    <script src="/js/ga/stock-reports/functions/divisions.js"></script>
    <script src="/js/ga/stock-reports/functions/warehouse_items.js"></script>
    {{-- <script src="/js/ga/stock-reports/functions/record_types.js"></script> --}}
    <script src="/js/ga/stock-reports/_init.js"></script>
    <script src="/js/ga/stock-reports/index.js"></script>
    <script src="/js/ga/stock-reports/dt.js"></script>

    <script>
        $(document).ready(() => {
            @if ($errors->isNotEmpty())
                @if (session('validatorError') === 'add')
                    addVendorModal.modal('show');
                @endif
                @if (session('validatorError') === 'edit')
                    editVendorModal.modal('show');
                @endif
            @endif
        })
    </script>
@endsection