@extends('admin.layout')
@section('main')
    <div class="modal fade text-left modal-slide-in event-sidebar fade" data-backdrop="static" data-keyboard="false"
        id="doc_details" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered sidebar-lg" role="document">
            <div class="modal-content">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">×</button>
                <div class="modal-header mb-1">
                    <h5 class="modal-title">User Details</h5>
                </div>
                <div class="modal-body flex-grow-1 pb-sm-0 pb-3">
                    <table class="table table-striped w-100">
                        <tbody>
                            <tr>
                                <th>SC Code:</th>
                                <td id="scCode"></td>
                            </tr>
                            <tr id="possitionCodediv">
                                <th>Position Code:</th>
                                <td id="vPositionCode"></td>
                            </tr>
                            <tr>
                                <th>Mobile:</th>
                                <td id="vMobile"></td>
                            </tr>
                            <tr>
                                <th>Email:</th>
                                <td id="vEmail"></td>
                            </tr>
                            <tr>
                                <th>Place:</th>
                                <td id="vPlace"></td>
                            </tr>
                            <tr>
                                <th>First Name:</th>
                                <td id="vFirstName"></td>
                            </tr>
                            <tr>
                                <th>Middle Name:</th>
                                <td id="vMiddleName"></td>
                            </tr>
                            <tr>
                                <th>Last Name:</th>
                                <td id="vLastName"></td>
                            </tr>
                            <!-- <tr>
                                                <th>FMV:</th>
                                                <td>5000</td>
                                            </tr> -->
                            <tr id="vAddressdiv">
                                <th>Address:</th>
                                <td id="vAddress"></td>
                            </tr>
                            <!-- <tr>
                                                <th>City</th>
                                                <td>Ahmedabad</td>
                                            </tr> -->
                            <!-- <tr>
                                                <th>State</th>
                                                <td>Gujarat</td>
                                            </tr> -->
                            <!-- <tr>
                                                <th>State Code:</th>
                                                <td>456789</td>
                                            </tr> -->
                            <tr id="vPincodediv">
                                <th>Pincode:</th>
                                <td id="vPincode"></td>
                            </tr>


                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade text-left " data-backdrop="static" data-keyboard="false" id="email" tabindex="-1"
        role="dialog" aria-labelledby="myModalLabel1" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5>Email</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body p-2 ">
                    <p>Email content</p>
                </div>

            </div>
        </div>
    </div>
    <div class="content-header row">
    </div>
    <div class="content-body">
        <!-- Dashboard Ecommerce Starts -->
        <section id="dashboard-ecommerce">
            <div class="row match-height justify-content-end mb-1">
                <div class="col-lg-12 mr-auto">
                    <h2>Email Logs<a href="" class="ml-1"><i data-feather="help-circle"></i></a></h2>
                </div>
                <div class="col-lg-2 col-md-6 my-1">
                    <div class="form-group">
                        <select class="select2 select-label form-control w-100" id="emailType" name="emailType">
                            <option value=""> Select Event Type</option>
                            @foreach (@config('custom.emailType') as $key => $value)
                                <option value="{{ $key }}"> {{ $value }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
                <div class="col-lg-auto col-md-6 my-1">
                    <div class="form-group">
                        <div id="reportrange" class="daterange">
                            <i class="fa fa-calendar"></i>&nbsp;
                            <span></span> <i class="fa fa-caret-down"></i>
                            <input type="hidden" name="dtFrom" id="dtFrom">
                            <input type="hidden" name="dtTo" id="dtTo">
                        </div>
                    </div>
                </div>
                <div class="col-lg-auto col-md-6 my-1">
                    <div class="d-lg-flex">
                        <a href="#" class="btn btn-primary" onclick="setFilter()">Apply</a>
                        <a href="#" class="btn btn-light ml-1" onclick="resetFilter()">Clear</a>
                    </div>
                </div>
                <div class="col-lg-auto  col-md-6 my-1 text-right">
                    <div class="form-group">
                        <button class="btn btn-success btn-toggle-sidebar waves-effect waves-float waves-light"
                            onclick="exportData();">
                            <span class=""><i data-feather="download" class="ml-1"></i> Export</span>
                        </button>
                    </div>
                </div>
            </div>
        </section>
        <section id="column-search-datatable">
            <div class="row">
                <div class="col-12">
                    <div class="card">

                        <div class="card-datatable p-1">

                            <table class="dt-column-search table table-striped w-100 text-center display" id="dataTable">
                                <thead>
                                    <tr>
                                        <th>Sr. No.</th>

                                        <th>Email ID</th>
                                        <th>Sent To</th>
                                        <th>Role</th>
                                        <!-- <th style="width:30%">Email</th> -->
                                        <th>Event Type</th>
                                        <th>Status</th>
                                        <th>Date & Time</th>
                                    </tr>
                                </thead>
                                <tbody>

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


    </div>
    </div>
    </div>
@endsection
@section('scripts')
    <script>
        $(".select2").select2();

        function setFilter() {
            $('#dataTable').DataTable().ajax.reload();
        }

        function resetFilter() {
            var start = moment().subtract(29, 'days');
            var end = moment();

            $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format(
                'MMMM D, YYYY'));
            $("#dtFrom").val(start.format('YYYY-MM-DD'));
            $("#dtTo").val(end.format('YYYY-MM-DD'));
            $("#emailType").val('').select2();
            $('#dataTable').DataTable().ajax.reload();
        }



        $(function() {

            var start = moment().subtract(29, 'days');
            var end = moment();

            function cb(start, end) {
                $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format(
                    'MMMM D, YYYY'));
                $("#dtFrom").val(start.format('YYYY-MM-DD'));
                $("#dtTo").val(end.format('YYYY-MM-DD'));
            }

            $('#reportrange').daterangepicker({
                startDate: start,
                endDate: end,
                ranges: {
                    'Today': [moment(), moment()],
                    'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1,
                        'days')],
                    'Last 7 Days': [moment().subtract(6, 'days'), moment()],
                    'Last 30 Days': [moment().subtract(29, 'days'), moment()],
                    'This Month': [moment().startOf('month'), moment().endOf('month')],
                    'Last Month': [moment().subtract(1, 'month').startOf('month'), moment()
                        .subtract(1, 'month').endOf('month')
                    ],
                    'Last FY': [moment().subtract(1, 'year').month(3).startOf('month'),
                        moment().month(2).endOf('month')
                    ],
                    'Current FY': [moment().month(3).startOf('month'),
                        moment().add(1, 'year').month(2).endOf('month')
                    ]
                }
            }, cb);

            cb(start, end);

        });

        // $('#iDivisionIDNav').on('change', function() {
        //     $('#dataTable').DataTable().ajax.reload();
        // })



        dt_filter_table = $('.dt-column-search');
        if (dt_filter_table.length) {


            var dt_filter = dt_filter_table.DataTable({
                'scrollX': true,

            });
        }

        $(function() {
            var columns = [{
                    data: 'DT_RowIndex',
                    name: 'DT_RowIndex',
                    "orderable": false,
                    searchable: false
                },

                {
                    data: 'EmailData',
                    name: 'EmailData',
                },
                {
                    data: 'username',
                    name: 'username',
                },

                {
                    data: 'eRole',
                    name: 'eRole',
                },
                // {
                //     data: 'emailView',
                //     name: 'emailView',
                // },
                {
                    data: 'eventType',
                    name: 'eventType',
                },
                {
                    data: 'cSendStatus',
                    name: 'cSendStatus',
                },
                {
                    data: 'updated_at',
                    name: 'updated_at',
                },
            ];
            var columnDefs = [];
            getdatatable("{{ route('field.emaillog.paginate') }}", columns, columnDefs);
        });

        function getdatatable(url, columns, columnDefs) {
            $('#dataTable').DataTable({
                processing: true,
                serverSide: true,
                bDestroy: true,
                order: [],
                "scrollX": true,
                columns: columns,
                columnDefs: columnDefs,
                ajax: {
                    method: 'post',
                    url: url,
                    data: function(d) {
                        d._token = "{{ csrf_token() }}",
                            d.emailType = $("#emailType").val(),
                            d.iDivisionID = $("#iDivisionIDNav").val(),


                            d.dtFrom = $("#dtFrom").val(),
                            d.dtTo = $("#dtTo").val()


                    }
                },
                "drawCallback": function(settings) {
                    new VenoBox({
                        selector: '.venobox_img',
                    });
                    feather.replace();
                    $('.dt-checkboxes').click(function() {
                        if ($('[name="checkbox[]"]:checked').length > 0) {
                            $('.actionBtn').show();
                        } else {
                            $('.actionBtn').hide();
                        }
                    });

                    $('.unlock_center_code').hide();
                    $('.unlock_center').hide();
                    $('.center_code_div').on('click', function() {
                        $(this).children('.unlock_center').toggle();
                        $(this).children('.lock_center').toggle();
                        $(this).children('.unlock_center_code').toggle();
                    })
                }
            });
        }

        $(document).on("click", ".user_details", function() {
            var iUserID = $(this).data('cid');
            $.ajax({
                url: "{{ url('division/get-doctor-data') }}",
                type: "POST",
                data: {
                    iUserID: iUserID,
                    _token: '{{ csrf_token() }}'
                },
                success: function(result) {
                    if (result.userData.eRole == 'Doctor') {
                        $("#vPositionCode").html('-');
                        $("#scCode").html(result.DoctorData.vSCCode);
                        $("#vPlace").html(result.DoctorData.vPlace);
                        $("#vFirstName").html(result.DoctorData.vFname);

                        $("#vLastName").html(result.DoctorData.vLname);
                        if (result.DoctorData.vAddress == null) {
                            $("#vAddress").html('-');
                        } else {
                            $("#vAddress").html(result.DoctorData.vAddress);
                        }
                        if (result.DoctorData.vMiddleName == null) {
                            $("#vMiddleName").html('-');
                        } else {
                            $("#vMiddleName").html(result.DoctorData.vMname);
                        }


                        $("#vPincode").html(result.DoctorData.vPincode);
                        if (result.DoctorData.vCleanedMobile == null) {
                            $("#vMobile").html(result.DoctorData.vMobile);
                        } else {
                            $("#vMobile").html(result.DoctorData.vCleanedMobile);
                        }

                        if (result.DoctorData.vCleanedEmail == null) {
                            $("#vEmail").html(result.DoctorData.vEmail);
                        } else {
                            $("#vEmail").html(result.DoctorData.vCleanedEmail);
                        }

                    } else {

                        document.getElementById('possitionCodediv').style.display = 'block';
                        $("#vAddress").html('-');
                        $("#vPincode").html('-');
                        $("#vPositionCode").html(result.userData.vPositionCode);
                        $("#vMobile").html(result.userData.vMobile);
                        $("#vEmail").html(result.userData.vEmail);
                        $("#vFirstName").html(result.userData.vFirstName);
                        $("#vMiddleName").html(result.userData.vMiddleName);
                        $("#vLastName").html(result.userData.vLastName);
                        $("#vFirstName").html(result.userData.vFirstName);

                    }



                }
            })
        });




        function exportData() {
            window.open("{{ route('field.emaillog.export') }}?eEmailType=" +
                btoa($("#emailType").val()) + '&dtFrom=' +
                btoa($("#dtFrom").val()) + '&dtTo=' +
                btoa($("#dtTo").val()), '_blank');
        }




        function export_response(response) {

            if (response == 1) {
                $.notify("You will get generated report within 10 minutes in download report section.", "info");
            } else {

                $.notify('Something went wrong !', "error");
            }
        }
    </script>
@endsection