@extends('layouts.main')
@section('title', 'Uninitiated Invoices')
@section('content')
    <!-- push external head elements to head -->
    @push('head')
        <link rel="stylesheet" href="{{ asset('plugins/DataTables/datatables.min.css') }}">
        <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
             {{-- date --}}
             <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css"
             integrity="sha512-aOG0c6nPNzGk+5zjwyJaoRUgCdOrfSDhmMID2u4+OIslr0GjpLKo7Xm0Ao3xmpM4T8AmIouRkqwj1nrdVsLKEQ=="
             crossorigin="anonymous" referrerpolicy="no-referrer" />
             <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ=="
             crossorigin="anonymous" referrerpolicy="no-referrer"></script>
             <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js" integrity="sha512-uto9mlQzrs59VwILcLiRYeLKPPbS/bT71da/OEBYEwcdNUk8jYIy+D176RYoop1Da+f9mvkYrmj5MCLZWEtQuA=="
             crossorigin="anonymous" referrerpolicy="no-referrer"></script>
             {{--  --}}
    @endpush

    <x-loader/>


    <div class="container-fluid">
        <x-breadcrumb :pageTitle="$pageTitle" :desc="$desc"  :iconName="$iconName"  />
        <div class="row">
            {{--  --}}
            <div class="col-xl-4">
                <div class="card card-blue text-white">
                    <div class="card-block">
                        <div class="row align-items-center">
                            <div class="col-8">
                                <p style="font-size:16px;" class="mb-3">Uninitiated Invoices<br/>
                                    <sub style="font-size:18px; font-weight:bold;" class="mb-0" id='totalInvAmount'>0</sub>
                                </p>
                            </div>
                            <div class="col-4 text-right py-5">
                                <i class="fas fa-cube f-30"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        {{-- page title ends here --}}
        {{-- Fitlering --}}
       <h6>Filter Results</h6>

        <div class="row">
            <!-- fromDate -->
            <div class="col-lg-2 col-md-2 col-sm-6 col-xs-12 form-group">
                <div class="form-group">
                    <label>From Date</label>
                    <input type="text" value="{{$fromDate}}"  class="form-control" id="fromDate"/>
                </div>
            </div>
            <!-- toDate -->
            <div class="col-lg-2 col-md-2 col-sm-6 col-xs-12 form-group">
                <div class="form-group">
                    <label>to Date</label>
                    <input type="text" class="form-control" id="toDate"  value="{{$toDate}}"/>
                </div>
            </div>


            <!-- search -->
            <div class="col-lg-1 col-md-1 col-sm-6 col-xs-6 form-group">
                <label> --</label>
                <button id="submit" class="btn btn-md btn-primary btn-block searchList pull-right" onclick="search()">
                    <i class="fa fa-search" aria-hidden="true"></i>
                </button>
            </div>

        </div>
    </div>

    <!-- push external js -->
    <div class="col-md-12">
        <div class="card">
            <div class="card-body">
                 <div id="UnitiatedInvTableWrapper">

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



    {{--  --}}
    @push('script')
     <script>
        document.body.classList.add("sidebar-mini");
     </script>
    <script src="{{ asset('plugins/DataTables/datatables.min.js') }}"></script>
    <script src="{{ asset('plugins/datedropper/datedropper.min.js') }}"></script>
    <script src="{{ asset('plugins/select2/dist/js/select2.min.js') }}"></script>
    <script src="{{ asset('js/_assets/general_js.js') }}"></script>
    <script>
        var resultData = []
        let rowsExported = [0,1,2,3,4,5]
        let name = `