@extends('admin.layouts.app')
@section('title', 'پنل مدیریت | گزارشات فروش')
@section('content')
    <div class="content-wrapper">
        <div class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1 class="m-0 text-dark">گزارشات فروش</h1>
                    </div>
                    <div class="col-sm-6">
                        <ol class="breadcrumb float-sm-left">
                            {{ Breadcrumbs::render('report-logs') }}
                        </ol>
                    </div>
                </div>
            </div>
        </div>
        <section class="content">
            <div class="container-fluid bg-white py-3">
                <div class="mb-4 row">
                    <div class="col-lg-3 col-12">
                        <label for="status">وضعیت سفارش</label>
                        <select id="status" name="status[]" multiple class="form-control">
                            @foreach(\App\Enums\OrderStatus::getInstances() as $enum)
                                <option value="{{ $enum->value }}">{{ $enum->description }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-lg-2 col-12">
                        <label for="from">از تاریخ</label>
                        <input type="text" id="from" name="from" class="form-control" autocomplete="off">
                        <input type="hidden" id="from_alt" name="from_alt">
                    </div>
                    <div class="col-lg-2 col-12">
                        <label for="until">تا تاریخ</label>
                        <input type="text" id="until" name="until" class="form-control" autocomplete="off">
                        <input type="hidden" id="until_alt" name="until_alt">
                    </div>
                    <div class="col-lg-2 col-12">
                        <br>
                        <button type="button" id="send-button" class="btn btn-info btn-block mt-lg-2">
                            <span class="fa fa-filter"></span> فیلتر
                        </button>
                    </div>
                </div>
                <div class="table-responsive-sm table-responsive-md">
                    {{ $dataTable->table() }}
                </div>
            </div>
        </section>
    </div>
@endsection
@section('footer')
    {{ $dataTable->scripts() }}
    <script>
        $(document).ready(function () {
            $('#status').select2();
            $('#from').MdPersianDateTimePicker({
                targetTextSelector: '#from',
                targetDateSelector: '#from_alt',
                disableAfterToday: true,
                dateFormat: 'yyyy/MM/dd'
            });
            $('#until').MdPersianDateTimePicker({
                targetTextSelector: '#until',
                targetDateSelector: '#until_alt',
                disableAfterToday: true,
                dateFormat: 'yyyy/MM/dd'
            });

            $('#send-button').on('click', function (e) {
                var status = $('#status').select2("val");
                var from = $('#from_alt').val();
                var until = $('#until_alt').val();

                $("#report-products-table").DataTable().destroy();
                window.LaravelDataTables = window.LaravelDataTables || {};
                window.LaravelDataTables["report-products-table"] = $("#report-products-table").DataTable({
                    "serverSide": true,
                    "processing": true,
                    "ajax": {"data": {'status': status, 'from': from, 'until': until}},
                    "columns": [
                        {
                            "data": "DT_RowIndex",
                            "name": "DT_RowIndex",
                            "title": "#",
                            "orderable": false,
                            "searchable": false
                        },
                        {"data": "code", "name": "code", "title": "کد", "orderable": true, "searchable": true},
                        {"data": "name", "name": "name", "title": "نام", "orderable": true, "searchable": true},
                        {
                            "data": "quantity",
                            "name": "quantity",
                            "title": "تعداد",
                            "orderable": true,
                            "searchable": false
                        },
                        {"data": "price", "name": "price", "title": "قیمت", "orderable": true, "searchable": false},
                        {
                            "data": "discount",
                            "name": "discount",
                            "title": "تخفیف",
                            "orderable": true,
                            "searchable": false
                        }
                    ],
                    "dom": "Bfrtip",
                    "order": [[3, "desc"]],
                    "language": {"url": "{{ asset('vendor/datatables/Persian.json') }}"},
                    "buttons": [{"extend": "excel"}, {"extend": "print"}, {"extend": "reset"}, {"extend": "reload"}]
                });
            });
        });
    </script>
@endsection