@extends('layouts.retail')

@section('salesummary-active', 'active')

@section('contents')
    <div class="content-wrapper" id="content-wrapper" style="min-height: 440px;">
        <section class="container col content p-2 p-xl-4 p-lg-4">
            <section class="content-header">
                <h5 class="font-weight-bold mb-4">
                    <i class="nav-icon fas fa-dollar-sign mr-3" style="color: #F9D339"></i>
                    Sales Summary Report
                </h5>
                <div class="mt-2 bg-white border" style="border-radius: 5px; min-height: 300px;">
                    <div class="pl-4">
                        <form id="form-filter">
                            <div class="row pt-3 mt-2">
                                <div class="col-md-5" style="max-width: 250px;">
                                    <div class="form-group">
                                        <input type="date" id="filter-date" class="form-control" name="date" style="width: 100%;" required>
                                    </div>
                                </div>
                                <div class="col-md-2">
                                    <button type="submit" class="btn text-sm mr-2 border special-button"><span>Filter</span></button>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="mt-2" id="salesTable" style="width: 100%;">
                        <table class="table table-hover text-sm" id="datatable" style="width: 100%"></table>
                    </div>
                </div>
            </section>
        </section>
    </div>
@endsection

@section('scripts')
    <script type="module" src="{{ asset('/js/retail/sale-summary.js') }}"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
@endsection