@extends('admin.layout.layout')

@section('content')
    <div class="container-fluid">
        <!--  Row 1 -->
        {!! Form::open([
            'url' => '#',
            'name' => 'validateForm',
            'id' => 'validateForm',
            'enctype' => 'multipart/form-data',
        ]) !!}
        <div class="row">
            <div class="col-auto my-auto">
                <h2 class="main_title">Report</h2>
            </div>
            <div class="col-lg-auto col-md-auto col-sm-auto col-auto ms-auto">
                <button type="submit" name="customer_wise_detail_report" value="yes" class="btn btn-primary"> <i
                        class="fa-regular fa-file-lines me-2"></i> Rx Report
                    data</button>
            </div>
            <div class="col-lg-auto col-md-auto col-sm-auto col-auto">
                <button type="submit" name="brandwise_report_export" value="yes" class="btn btn-primary"> <i
                        class="fa-regular fa-file-lines me-2"></i> Month-wise Brand-wise RxBr (>=1)</button>
            </div>
            <div class="col-lg-auto col-md-auto col-sm-auto col-auto">
                <button type="submit" name="brandwise_report_export_3" value="yes" class="btn btn-primary"> <i
                        class="fa-regular fa-file-lines me-2"></i> Month-wise Brand-wise RxBr (>=3)</button>
            </div>
            <div class="col-lg-auto col-md-auto col-sm-auto col-auto">
                <button type="submit" name="rst_report_export" value="yes" class="btn btn-primary"> <i
                        class="fa-regular fa-file-lines me-2"></i>RST Report</button>
            </div>
        </div>
        {!! Form::close() !!}

        <div class="row mb-3">

        </div>

        <div class="row">

            <div class="white_shadow1">
                <div class="col-12">
                    <table id="reportDataTable" class="table table-striped data-table-dr" style="width:100%">
                        <thead>
                            <tr>
                                <th>Sr No</th>
                                <th>Type</th>
                                <th>Status</th>
                                <th>Requested Time</th>
                                <th>Completed Time</th>
                                <th>Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            {{-- <tr>
                                <td>1</td>
                                <td>RX REPORT </td>
                                <td>
                                    <div class="d-flex justify-content-center">
                                        <div class="checker new_pending">
                                            <i class="fa-regular fa-clock me-2"></i>Pending
                                        </div>

                                </td>
                                <td>27-06-2024 09:17:01 </td>
                                <td>27-06-2024 09:34:18
                                </td>

                                <td>

                                    <button class="btn btn-outline-success sm_bt" type="button" data-bs-toggle="modal"
                                        data-bs-target="#download"><i class="fa-solid fa-download"></i></button>

                                </td>

                            </tr>
                            <tr>
                                <td>2</td>
                                <td>RX REPORT </td>
                                <td>
                                    <div class="d-flex justify-content-center">
                                        <div class="checker new_checker">
                                            <i class="fa-regular fa-circle-check me-2"></i>Completed
                                        </div>
                                    </div>

                                </td>
                                <td>-</td>
                                <td>-</td>
                                <td>- </td>
                            </tr>
                            <tr>
                                <td>3</td>
                                <td>RX REPORT </td>
                                <td>

                                    <div class="d-flex justify-content-center">
                                        <div class="checker failed">
                                            <i class="fa-solid fa-circle-exclamation me-2"></i>Failed
                                        </div>
                                    </div>

                                </td>
                                <td>27-06-2024 09:17:01 </td>
                                <td>27-06-2024 09:34:18
                                </td>

                                <td>

                                    <button class="btn btn-outline-success sm_bt" type="button" data-bs-toggle="modal"
                                        data-bs-target="#download"><i class="fa-solid fa-download"></i></button>

                                </td>

                            </tr>
                            <tr>
                                <td>4</td>
                                <td>RX REPORT </td>
                                <td>

                                    <div class="d-flex justify-content-center">
                                        <div class="checker inprogress">
                                            <i class="fa-solid fa-rotate me-2"></i>Inprogress
                                        </div>
                                    </div>
                                </td>
                                <td>27-06-2024 09:17:01 </td>
                                <td>27-06-2024 09:34:18
                                </td>

                                <td>

                                    <button class="btn btn-outline-success sm_bt" type="button" data-bs-toggle="modal"
                                        data-bs-target="#download"><i class="fa-solid fa-download"></i></button>

                                </td>

                            </tr> --}}

                        <tbody>
                    </table>
                </div>
            </div>

        </div>

    </div>

    </div>
    <div class="modal fade" id="download" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content ">
                <div class="modal-header">
                    <h1 class="modal-title fs-5" id="exampleModalLabel">Download</h1>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"><i
                            class="fa-solid fa-xmark"></i></button>
                </div>
                <div class="modal-body">
                    <div class="item_green">
                        <button class="btn"><i class="fa-regular fa-file-excel me-2"></i> Import RST</button>
                    </div>
                    <div class="item_green">
                        <button class="btn"><i class="fa-regular fa-file-excel me-2"></i> Import input
                            utilization/reporting in given format</button>
                    </div>
                    <div class="item_green">
                        <button class="btn"><i class="fa-regular fa-file-excel me-2"></i> Import RST data</button>
                    </div>
                    <div class="item_green">
                        <button class="btn"><i class="fa-regular fa-file-excel me-2"></i> Import visit data - Month
                            selection </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('customJs')
    <script>
        $(document).ready(function() {

            $('#validateForm').validate({
                ignore: ".ignore",
                rules: {},
                messages: {},
                submitHandler: function(form) {
                    // return false;
                    // $("#submit").html('<span> Processing...</span>');
                    // $("#submit").attr('disabled', true);

                    var formData = new FormData($("#validateForm")[0]);
                    $.ajax({
                        url: "{{ route('admin.reports.generate') }}",
                        type: 'POST',
                        data: formData,
                        processData: false,
                        contentType: false,
                        dataType: "json",
                        success: function(response) {
                            var flag = 0;
                            if (response.status == 2) {
                                // $("#submit").html('Login');
                                // $("#submit").attr('disabled', false);
                                $.each(response.errors, function(index, data) {
                                    if (flag == 0) {
                                        $('input[name="' + index + '"]')
                                            .focus();
                                        flag = 1;
                                    }
                                    if (document.getElementsByName(index)[0]
                                        .tagName == "INPUT" && document
                                        .getElementsByName(index)[0].type !=
                                        'radio'
                                    ) {
                                        $('input[name="' + index + '"]').after(
                                            '<label id="' + index +
                                            '-error" class="error" for="' +
                                            index + '">' + data + '</label>'
                                        );
                                    } else if (document.getElementsByName(
                                            index)[0]
                                        .tagName == "SELECT") {
                                        $('select[name="' + index + '"]').after(
                                            '<label id="' + index +
                                            '-error" class="error" for="' +
                                            index + '">' + data + '</label>'
                                        );
                                    } else if (document.getElementsByName(
                                            index)[0]
                                        .tagName == "TEXTAREA") {
                                        $('textarea[name="' + index + '"]')
                                            .after(
                                                '<label id="' + index +
                                                '-error" class="error" for="' +
                                                index + '">' + data + '</label>'
                                            );
                                    } else if (document.getElementsByName(
                                            index)[0]
                                        .tagName == "INPUT" && document
                                        .getElementsByName(index)[0].type ==
                                        'radio'
                                    ) {
                                        $('div .' + index).after('<label id="' +
                                            index +
                                            '-error" class="error" for="' +
                                            index + '">' + data + '</label>'
                                        );
                                    }
                                });
                            } else if (response.status == 0) {
                                // $("#submit").html('Login');
                                // $("#submit").attr('disabled', false);
                                $.notify(response.message, "error");
                            } else {
                                $.notify(response.message, "success");
                                // $("#submit").html('Redirecting...');
                                setTimeout(function() {
                                    location.reload();
                                }, 1000);
                            }
                        },
                        error: function(jqXHR, textStatus, errorThrown) {
                            if (jqXHR.status == 419 || jqXHR.status == 422) {
                                var flag = 0;
                                // $("#submit").html('Login');
                                // $("#submit").attr('disabled', false);
                                $.each(jqXHR.responseJSON.errors, function(index,
                                    data) {
                                    if (flag == 0) {
                                        $('input[name="' + index + '"]')
                                            .focus();
                                        flag = 1;
                                    }
                                    if ($('#' + index + '-error').length != 0) {
                                        $('#' + index + '-error').html(data)
                                            .show();
                                    } else {
                                        if (document.getElementsByName(index)[0]
                                            .tagName == "INPUT" && document
                                            .getElementsByName(index)[0].type !=
                                            'radio'
                                        ) {
                                            $('input[name="' + index + '"]')
                                                .after(
                                                    '<label id="' + index +
                                                    '-error" class="error" for="' +
                                                    index + '">' + data +
                                                    '</label>');
                                        } else if (document.getElementsByName(
                                                index)[0].tagName == "SELECT") {
                                            $('select[name="' + index + '"]')
                                                .after(
                                                    '<label id="' + index +
                                                    '-error" class="error" for="' +
                                                    index + '">' + data +
                                                    '</label>');
                                        } else if (document.getElementsByName(
                                                index)[0].tagName ==
                                            "TEXTAREA") {
                                            $('textarea[name="' + index + '"]')
                                                .after('<label id="' + index +
                                                    '-error" class="error" for="' +
                                                    index + '">' + data +
                                                    '</label>');
                                        } else if (document.getElementsByName(
                                                index)[0].tagName == "INPUT" &&
                                            document.getElementsByName(index)[0]
                                            .type == 'radio'
                                        ) {
                                            $('input[name="' + index + '"]')
                                                .after(
                                                    '<label id="' + index +
                                                    '-error" class="error" for="' +
                                                    index + '">' + data +
                                                    '</label>');
                                        }
                                    }
                                });
                            } else {
                                // $("#submit").html('Login');
                                // $("#submit").attr('disabled', false);
                                $.notify(jqXHR.responseJSON.message, "error");
                            }
                        }
                    }); //ajax
                }
            });

            var i = 1;
            var table = $('#reportDataTable').DataTable({
                scrollX: true,
                destroy: true,
                processing: true,
                serverSide: true,
                responsive: false,
                autoWidth: false,
                ajax: {
                    url: "{{ route('admin.reports.paginate') }}",
                    data: function(d) {
                        d._token = "{{ csrf_token() }}"
                    },
                    error: function(jqxhr, textStatus, errorThrown) {
                        window.location.reload();
                    }
                },
                "drawCallback": function(settings) {

                },
                dom: 'lrtip',
                columns: [{
                        data: 'DT_RowIndex',
                        name: 'DT_RowIndex',
                        orderable: false,
                        searchable: false
                    },
                    {
                        data: 'type',
                        searchable: true,
                        orderable: false
                    },
                    {
                        data: 'status',
                        searchable: true,
                        orderable: false
                    },
                    {
                        data: 'requestedAt',
                        searchable: true,
                        orderable: false
                    },
                    {
                        data: 'completedAt',
                        searchable: true,
                        orderable: false
                    },
                    {
                        data: 'action',
                        searchable: true,
                        orderable: false
                    }

                ],
                columnDefs: [{
                    "aTargets": [1, 2, 3, 4, 5], // Column to target
                    "mRender": function(data, type, full) {
                        if (data != null) {
                            return data;
                        } else {
                            return '-';
                        }
                    }
                }, ],

            });
        });
    </script>
@endsection