@extends('layouts.app')

@section('content')
<link rel="stylesheet" href="css/device-attentions.css?k5m8o4f">
<style>
    .not-approved-permission {
        cursor: pointer;
        text-decoration: underline;
        color: #34548A;
    }

    #tableContainer {
        display: none;
        width: 60%;
        margin: 1px auto;
        padding: 40px;
        background: #fefefe;
        border-radius: 5px;
    }

    .common-modal {
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        padding: 20px;
        border-radius: 5px;
        box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3);
        border: 1px solid #e2e2e2;
        text-align: center;
        background-color: #f8f8f8;
        box-shadow: 0px 1px 15px rgba(0, 0, 0, 0.2);
        -moz-box-shadow: 0px 1px 15px rgba(0, 0, 0, 0.2);
        -webkit-box-shadow: 0px 1px 15px rgba(0, 0, 0, 0.2);
        z-index: 999;
        -webkit-box-shadow: 0px 0px 0px 9999px rgba(0, 0, 0, 0.5);
        -moz-box-shadow: 0px 0px 0px 9999px rgba(0, 0, 0, 0.5);
        box-shadow: 0px 0px 0px 9999px rgba(0, 0, 0, 0.5);
    }

    .permissions-table {
        margin-top: 20px;
    }

    .pop-up-heading {
        text-align: left;
        text-transform: uppercase;
        font-size: 17px;
    }

    .close {
        color: #aaaaaa;
        font-size: 28px;
        font-weight: bold;
        text-align: right;
        margin: -50px -15px 0px 0px;
    }

    .close-btn {
        margin-top: 30px;
        margin-bottom: -10px;
    }

    .throttle-div {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .throttle-input {
        width: 17%;
        height: 30px;
        padding: 10px;
        border-color: #d7d7d7;
    }

    .common-modal {
        position: fixed;
        top: 52%;
        left: 50%;
        transform: translate(-50%, -50%);
        padding: 20px;
        border-radius: 5px;
        box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3);
        border: 1px solid #e2e2e2;
        text-align: center;
        background-color: #ffffff;
        box-shadow: 0px 1px 15px rgba(0, 0, 0, 0.2);
        -moz-box-shadow: 0px 1px 15px rgba(0, 0, 0, 0.2);
        -webkit-box-shadow: 0px 1px 15px rgba(0, 0, 0, 0.2);
        z-index: 999;
        -webkit-box-shadow: 0px 0px 0px 9999px rgba(0, 0, 0, 0.5);
        -moz-box-shadow: 0px 0px 0px 9999px rgba(0, 0, 0, 0.5);
        box-shadow: 0px 0px 0px 9999px rgba(0, 0, 0, 0.5);
        display: none;
    }

    .are-you-sure-close {
        top: -10px;
    }

    .are-you-sure-close {
        position: relative;
        margin-left: 78.7%;
        margin-top: -30px;
        font-size: 35px;
        color: #000;
        cursor: pointer;
        color: #34548a;
        background: transparent;
        border: none;
        box-shadow: none;
    }

    .are-you-sure-btns-div {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 4%;
    }

    .are-you-sure-para {
        margin-bottom: -5px !important;
        font-weight: 600;
    }

    .are-you-sure-popup {
        color: #34548a !important;
    }

    .are-you-sure-cancel,
    .are-you-sure-confirm {
        &:hover {
            cursor: pointer;
        }
    }

    button,
    button:focus {
        outline: none;
    }

    .status-summary {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 30px;
        flex-wrap: wrap;
    }

    .status-item {
        font-weight: 600;
    }

    .status-item label {
        margin-right: 3px;
    }

    .status-item.pending {
        color: #f0ad4e;
    }

    .status-item.success {
        color: #28a745;
    }

    .status-item.failed {
        color: #dc3545;
    }

    .status-item.retries {
        color: #6f42c1;
    }

    .status-item.initiated {
        color: #007bff;
    }

    .select-date-btn:focus,
    .select-date-btn:active {
        outline: none !important;
    }
</style>
<div class="container" id="home_device_attention_block">
    <div class="device-need-attention-box" style="display:none;">
        <i class="fa fa-circle text-danger-glow blink"></i>
        <h5>Device Attention</h5>
    </div>
    {{-- START Test call status block  --}}
    @can('test call status')
    <div class="textlabel">
        <h2 class="test-call-status-heading">Test Call Status</h2>
    </div>
    <div class="">
        <div class="calender-container">
            <form action="" id="filter_result_by_date" method="POST">
                @csrf
                <p>
                <div class="radio-container">
                    <label class="select-date-lbl">Calling Type: &nbsp;</label>
                    <input type="radio" id="all" class="type" name="type" value="all" checked> All
                    <input type="radio" id="calling" class="type" name="type" value="calling_queue"> Calling Queue
                    <input type="radio" id="warmup" class="type" name="type" value="warm_up_queue"> Warmup Queue
                    <input type="radio" id="dynamic_daily" class="type" name="type" value="dynamic_daily"> Dynamic Daily
                    <input type="radio" id="dynamic_gtad" class="type" name="type" value="dynamic_gtad"> Dynamic GTAD
                </div>
                <div>
                    <div class="radio-container">
                        <label class="select-date-lbl">Call Execution Status: &nbsp;</label>
                        <input type="radio" id="all_calls" class="call_execution_status" name="call_execution_status" value="all"> All
                        <input type="radio" id="live_calls" class="call_execution_status" name="call_execution_status" value="1" checked> Live Calls
                        <input type="radio" id="skipped_calls" class="call_execution_status" name="call_execution_status" value="0"> Skipped Calls
                    </div>
                </div>
                <label class="select-date-lbl">Select Date: &nbsp;</label><input type="text" class="input-date datepicker" id="date-input" name="date-input" placeholder="yyyy/mm/dd" value={{$date_input}} autocomplete="off" />
                <button class="select-date-btn">Submit</button>
                </p>
            </form>
        </div>
       
        <div class="margin-top-bottom textlabel status-summary">
            <div class="status-item pending">
                <label>Pending:</label>
                <span id="total_pending">0</span>
            </div>

            <div class="status-item success">
                <label>Success:</label>
                <span id="total_success">0</span>
            </div>

            <div class="status-item failed">
                <label>Failed:</label>
                <span id="total_failed">0</span>
            </div>

            <div class="status-item retries">
                <label>Retries:</label>
                <span id="total_retries">0.00 % (0)</span>
            </div>

            <div class="status-item initiated">
                <label>Initiated:</label>
                <span id="total_initiated">0</span>
            </div>
        </div>
    </div>
    @endcan
    {{-- END Test call status block  --}}

    {{-- START Devices Need Attention block  --}}
    @can('devices need attention')
    <div class="margin-top-bottom">
        <div class="heading-box">
            <h4>Devices Need Attention</h4>
        </div>
        <div class="container daily-calling-status-table-container device-attention-pg">
            <div class="ack-refresh-btn-block">
                <button class="acknowledge-all-button">Ack All</button>
                <button class="refresh-table-button ml-2"><i class="fas fa-sync-alt fa-fw"></i>&nbsp;Refresh</button>
                <button class="show-detail-btn mb-3"><a href="javascript:void(0);" target="_blank" id="display-device-detail">Show Details</a></button>
            </div>
            <table id="device-attention-table" class="mt-3">
                <thead>
                    <tr>
                        <th>Device Name</th>
                        <th>Device Number</th>
                        <th>Attention Type</th>
                        <th>Time</th>
                        <th>Action</th>
                    </tr>
                </thead>
            </table>
            <div class="jump-to-page-wrapper">
                <label>Jump to page: </label>
                <input type="number" onkeyup="if(/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')" name="jump_to_page" id="jump_to_page_num">
                <a href="javascript:void(0);" id="go_to_page">GO</a>
            </div>
        </div>
    </div>
    @endcan
    {{-- END Devices Need Attention block  --}}
</div>
<br>
<hr>
<br>

{{-- START device in maintenance mode block  --}}
@can('device in maintenance mode')
<div class="margin-top-bottom textlabel" style="text-align: center;">
    <h2>Device(s) In Maintenance Mode</h2>
</div>
<div class="container column-container">
    <br />
    <hr>
    <br />
    <div class="col-one-half-left-content">
        <div class="margin-top-bottom">
            <h3>Count of Device(s) in Maintenance Mode: <span id="deviceCunt">0</span></h3>
            <!-- <h3>Do you want to move these devices to Active status?</h3> -->
            <input class="Stop-awesome" type="button" id="removeMaintanance" name="removeMaintanance" value="Move To Active Status" onclick="removeMaintanance()" style="padding: 0 20px;">
            <input class="refresh_maintainence" type="button" id="refresh_maintainence" name="refresh_maintainence" value="Refresh" onclick="GetMaintenanceModeDevices()" style="padding: 0 20px;">
            <div class="blink-me blink-text" id="removeMaintananceProgress" style="padding: 0 20px;margin-bottom: 12px;">
                Loading ...
            </div>
            <div class="maintenance-device-list-cont">
                <table>
                    <thead>
                        <tr>
                            <th>
                                <label class="check-box-container">
                                    <input id="select-all-devices" type="checkbox">
                                    <span class="checkmark"></span>
                                </label>
                            </th>
                            <th>Device</th>
                            <th>Maintenance Mode Reason</th>
                            <th>Date Time</th>
                            <th>Permission Status</th>
                        </tr>
                    </thead>
                    <tbody class="maintenance-device-list-tbody">

                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <div class="col-one-half-right-content">
        <div class="margin-top-bottom demo">
            <div class="reboot-device-dropdown-control control-group">
                <select class="reboot-device-select demo-default" placeholder="Search for a Device to Reboot">

                </select>
            </div>
            <input class="Stop-awesome reboot-device-btn" type="button" id="reboot-device" name="reboot-device" value="Reboot Device" style="padding: 0 20px;">
        </div>
        <div class="margin-top-bottom demo">
            <div class="maintenance-device-dropdown-control-cont">
                <div class="maintenance-device-dropdown-control">
                    <select class="maintenance-device-select" placeholder="Search Device" multiple="multiple">

                    </select>
                </div>
                <div class="blink-me blink-text" id="maintenance-device-progress" style="padding: 0 20px;">
                    Loading ...
                </div>
                <input class="Stop-awesome maintenance-device-btn" type="button" id="maintenance-device" name="maintenance-device" value="Move Device(s) to Maintenance" onclick="moveDevicesToMaintenance()" style="padding: 0 20px;">
            </div>
        </div>
    </div>
</div>
<br />
<hr>
<br />

<div class="container">
    <div class="margin-top-bottom">
        <input class="Stop-awesome" type="button" id="StartCallBTN" name="StartCallBTN" value="Move Device(s) Maintenance to Free Mode" onclick="StartStopCallFunctionMain(1)" style="padding: 0 20px;">
    </div>
    <div class="margin-top-bottom">
        <input type="button" id="StopCallBTN" name="StopCallBTN" value="Move all Device(s) Free to Maintenance Mode " onclick="StartStopCallFunctionMain(3)" style="padding: 0 20px;">
    </div>
</div>
<br />
<hr>
<br />
@endcan
{{-- END device in maintenance mode block  --}}

{{-- START Cancel Scheduled Carriers Calls block  --}}
@can('cancel scheduled carriers calls')
<div class="margin-top-bottom textlabel" style="text-align: center;">
    <h2>Cancel Scheduled Carriers Calls</h2>
</div>
<div class="row col-md-12">
    <div class="col-md-12">
        <div class="margin-top-bottom demo" style="padding-top:0px;margin-left: 60px;">
            <div class="test-call-device-dropdown-control-cont">
                <div class="margin-top-bottom demo">
                    <div class="blink-me blink-text" id="cancelSheduledModeProgress" style="padding: 0 20px;">
                        Loading ...
                    </div>
                    <div class="test-call-dropdown-control control-group" style="width: 250px;margin: 0px auto;">
                        <select class="parent_carrier_name demo-default" placeholder="Search for Carrier To Cancel Call">

                        </select>
                    </div>
                    <br>
                    <input class="Stop-awesome test-call-mode-btn" type="button" id="parent_carrier_button" name="parent_carrier_button" value="Cancel Scheduled Calls" style="padding: 0 20px;">
                </div>
            </div>
        </div>
    </div>
</div>
<br />
<hr>
<br />
@endcan
{{-- END Cancel Scheduled Carriers Calls block  --}}

{{-- START Throttle setting  --}}
@can('throttle setting')
<div class="margin-top-bottom textlabel" style="text-align: center;">
    <h2>Throttle Delay Time</h2>
</div>
<div class="row col-md-12">
    <div class="col-md-12">
        <div class="margin-top-bottom demo" style="padding-top:0px;margin-left: 60px;">
            <div class="test-call-device-dropdown-control-cont">
                <div class="throttle-div">
                    <label style="font-size: 16px;font-weight: 500;" for="sleep_time">Throttle Delay Time (milliseconds):</label>
                    <input class="throttle-input" type="number" name="sleep_time" id="sleep_time" required>
                </div>
                <button style="margin-top: 25px; outline:none;" class="Stop-awesome test-call-mode-btn" id="throttle_setting_update" name="throttle_setting_btn">Update</button>
            </div>
        </div>
    </div>
</div>
<br />
<hr>
<br />
@endcan
{{-- END Throttle setting --}}

{{-- START Test Call Queue Management block  --}}
@can('test call queue management')
<div class="margin-top-bottom textlabel" style="text-align: center;">
    <h2>Test Call Queue Management</h2>
</div>
<div class="row col-md-12">
    <div class="container">

    </div>
    <div class="container text-calling-queue-buttons-section">
        <div class="col-one-half col-left-section-one-half">
            <div class="margin-top-bottom">
                <input type="button" id="StartCallQueueBTN" name="StartCallQueueBTN" value="Start All Number Sentry Call" onclick="StartCallQueueFunction()" style="padding: 0 20px;">
                <label id="startCallButton"><b>Inactive</b></label>
            </div>
            <div class="margin-top-bottom">
                <input type="button" id="StopCallQueueBTN" name="StopCallQueueBTN" value="Stop All Number Sentry Call" onclick="StopCallQueueFunction()" style="padding: 0 20px;">
                <label id="stopCallButton"><b>Inactive</b></label>
            </div>
        </div>
        <div class="col-one-half col-right-section-one-half">
            <div class="margin-top-bottom">
                <input type="button" id="startObnRetryBtn" name="startObnRetryBtn" value="Start OBN Retry Counts" onclick="StartStopObnRetry(true)" style="padding: 0 20px;">
                <label id="startButton"><b>Inactive</b></label>
            </div>

            <div class="margin-top-bottom">
                <input type="button" id="stopObnRetryBtn" name="stopObnRetryBtn" value="Stop OBN Retry Counts" onclick="StartStopObnRetry(false)" style="padding: 0 20px;">
                <label id="stopButton"><b>Active</b></label>
            </div>
        </div>
    </div>
</div>
@endcan
{{-- END Test Call Queue Management block  --}}

<!-- The Modal -->
<div id="myModal" class="modal">
    <!-- Modal content -->
    <div class="modal-content">
        <span class="close">&times;</span>
        <p id="model_msg">Are you sure to start number sentry calling system?</p>
        <div class="margin-top-bottom">
            <input type="button" id="YesBTN" name="YesBTN" value="Yes" onclick="StartStopCallFunction(1)">
        </div>
        <div class="margin-top-bottom">
            <input type="button" id="NoBTN" name="NoBTN" value="No">
        </div>
    </div>
</div>
<!-- The Enter PW Modal -->
<div id="myPWModal" class="modal">
    <!-- Modal content -->
    <div class="modal-content">
        <span class="close">&times;</span>
        <p id="model_msg"> <span>Are you sure to test call.</span> <input type="hidden" id="password" name="pass" placeholder="Enter Key"></p>
        <div class="margin-top-bottom">
            <input type="button" id="PwYesBTN" name="PwYesBTN" value="Ok" onclick="">
        </div>
        <div class="margin-top-bottom">
            <input type="button" id="PWNoBTN" name="PWNoBTN" value="Cancel">
        </div>
    </div>
</div>
<div id="reboot-device-confirmation-modal" class="modal">
    <!-- Modal content -->
    <div class="modal-content">
        <span class="close">&times;</span>
        <p id="model_msg"> <span>Are you sure you want to reboot the device.</span></p>
        <input id="selected-device" type="hidden" value="" />
        <div class="margin-top-bottom">
            <input type="button" id="reboot-device-ok" name="reboot-device-ok" value="Yes">
        </div>
        <div class="margin-top-bottom">
            <input type="button" id="reboot-device-cancel" name="reboot-device-cancel" class="reboot-device-cancel" value="No">
        </div>
    </div>
</div>
<div id="cancel-call-confirmation-modal" class="modal">
    <!-- Modal content -->
    <div class="modal-content">
        <span class="close">&times;</span>
        <p id="model_msg"> <span>Are you sure you want to stop scheduled call on selected device.</span></p>
        <div class="margin-top-bottom">
            <input type="button" id="cancel-call-device-ok" name="cancel-call-device-ok" onclick="cancelScheduledCalls('Yes')" value="Yes">
        </div>
        <div class="margin-top-bottom">
            <input type="button" id="cancel-call-device-cancel" name="cancel-call-device-cancel" class="cancel-call-device-cancel" value="No" onclick="cancelScheduledCalls('No')">
        </div>
    </div>
</div>
<div id="dynamic-reboot-off-confirmation-modal" class="modal">
    <!-- Modal content -->
    <div class="modal-content">
        <span class="close dynamic-reboot-popup-close">&times;</span>
        <p id="model_msg"> <span>Dynamic Rebooting is OFF, Reboot Device anyway?</span></p>
        <div class="margin-top-bottom">
            <input type="button" id="dynamic-reboot-off-ok" name="dynamic-reboot-off-ok" value="Yes">
        </div>
        <div class="margin-top-bottom">
            <input type="button" id="dynamic-reboot-off-cancel" name="dynamic-reboot-off-cancel" class="dynamic-reboot-off-cancel" value="No">
        </div>
    </div>
</div>

<div id="show_device_reboot_type" class="modal" style="display:none">
    <div class="modal-content">
        <span class="close close-popup">&times;</span>
        <div class="modal-body" id="reboot_type_data"></div>
        <div class="row">
            <div class="margin-top-bottom col">
                <button class="close-popup">Close</button>
            </div>
        </div>
    </div>
</div>

<div id="confirm_modal_popup" class="modal" style="display:none">
    <div class="modal-content">
        <span class="close close-confirm-modal">&times;</span>
        <p id="model_msg"><span class="popup-txt">Are you sure want to acknowledge for this device?</span></p>
        <div class="row">
            <form id="device-attention-confirm-from">
                <input type="hidden" id="device_pk_id" name="device_pk_id" value="">
                <input type="hidden" id="device_mob_number" name="device_mob_number" value="">

            </form>
            <div class="margin-top-bottom col">
                <button class="close-confirm-modal">Close</button>
            </div>
            <div class="margin-top-bottom col">
                <button class="yes-confirm">Yes</button>
            </div>
        </div>
    </div>
</div>

<div id="downloadDIDReportFile" class="modal" style="display:none">
    <form>
        <input type="hidden" id="kyc_close_userid" class="form-control" value="">
        <div class="su-lightbox-content su-u-trim " id="download-prior-template-files-popup" style="width:58%;min-width:none;max-width:800px;margin-top:40px;margin-bottom:40px;margin: 1px auto;;padding:40px;background:#FFFFFF;color:#333333;box-shadow:0px 0px 15px #333333;text-align:center;">
            <div class="download-template-files-container">
                <span class="close" id="DIDpopupclosebtn">&times;</span>
                <h4 class="download-template-popup-heading" style="text-align: left;">Download DID Tested By Plan files</h4>
                <table id="listTemplateFilesTable" class="table">
                    <thead>
                        <tr class="table-heading">
                            <th style="width: 70%;">
                                <div class="label-text" id="">
                                    <span>File Name</span>
                                </div>
                            </th>
                            <th>
                                Action
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                    </tbody>
                </table>
            </div>
        </div>
    </form>
</div>
<div class="common-modal are-you-sure-popup" style="display: none;">
    <p class="are-you-sure-para">ARE YOU SURE?</p>
    <button title="Close (Esc)" type="button" class="are-you-sure-close">×</button>
    <div class="are-you-sure-div">
        <p class="confirmation-message"></p>
        <div class="are-you-sure-btns-div">
            <span class="are-you-sure-cancel">CANCEL</span>
            <span class="are-you-sure-confirm">CONFIRM</span>
        </div>
    </div>
</div>

<div id="tableContainer" class="common-modal">

</div>

<div id="loaderModal" class="modal">
    <img class="loader-img" src="../images/ajax-spinner.gif">
    <span class="loader-text">Please wait ...</span>
</div>
<div id="daily-calling-status-count-table_processing" class="dataTables_processing" style="display: none;">Loading...</div>

<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.11.1/js/jquery.dataTables.js"></script>

<script>
    var getCallingResultCarrierWiseUrl = "{{ route('CallingResultCarrierWise') }}";
    var getRebootTypeUrl = "{{ route('getRebootTypes') }}";
    var devicesTestCallDetailUrl = "{{ route('DailyCallingStatusNew') }}";
    var baseURL = "{{ URL::to('/') }}" + "/";
    var selectedDateForFilter = '{{$date_input}}';
    var loaderHtml = '<div class="loading_overlay"><div class="loading_overlay_inner"><img class="spinner-image" src="../images/ajax-spinner.gif" alt=""><p>Please wait...</p></div></div>';
    /*************************added by 1206 *******************/
    $(function() {
        $(".datepicker").datepicker({
            dateFormat: 'yy-mm-dd',
            maxDate: 0,
            minDate: '-3M',
            showOn: "button",
            buttonImage: "{{env('WP_URL')}}/wp-content/uploads/2022/07/Calender-blue-1.png",
            buttonImageOnly: true
        });
        $(".datepicker").val('{{$date_input}}');
    });
    //on click of not-approved link the device permission pop up will show with dynamic content 

    $(document).ready(function() {
        getThrottleSetting();
        $(document).on('click', '.not-approved-permission', function() {
            var NAPermission = $(this).data('permission_req_cnt');
            var htmlContent = '<h2 class="pop-up-heading">These following permission(s) are required to set permission status approved</h2><span class="close close-popup">×</span><table class="permissions-table">';
            htmlContent += '<tr><th>Permission Type</th><th>Permissions</th></tr>';
            for (var key in NAPermission) {
                if (NAPermission.hasOwnProperty(key)) {
                    htmlContent += '<tr>';
                    htmlContent += '<td>' + key + '</td>';
                    htmlContent += '<td>' + NAPermission[key].join(', ') + '</td>';
                    htmlContent += '</tr>';
                }
            }
            htmlContent += '</table><button class="close-btn">Close</button>';
            $("#tableContainer").html(htmlContent);
            $("#tableContainer").css("display", "block");
        });

        $('#throttle_setting_update').on('click', function(e) {
            e.preventDefault();

            let sleepTime = $('#sleep_time').val();

            if (sleepTime === '' || sleepTime === null) {
                alert('❌ Error: Sleep time cannot be empty.');
                return;
            }

            // Set global value
            sleepTimeToUpdate = sleepTime;

            // Set message inside the popup
            $('.confirmation-message').html(
                'Are you sure you want to update the throttle delay time to <strong>' +
                $('<div>').text(sleepTime).html() +
                ' ms</strong>?<br>This will have a direct impact on the platform CPS capacity.'
            );

            // Show the popup
            $('.are-you-sure-popup').show();
        });

        // Handle CANCEL
        $('.are-you-sure-cancel, .are-you-sure-close').on('click', function() {
            $('.are-you-sure-popup').hide();
            sleepTimeToUpdate = null;
        });

        // Handle CONFIRM
        $('.are-you-sure-confirm').on('click', function() {
            $('.are-you-sure-popup').hide();
            jQuery("#loaderModal").show();
            if (sleepTimeToUpdate !== null) {
                $.ajax({
                    type: 'POST',
                    url: baseURL + 'update-throttle-time',
                    data: {
                        sleep_time: sleepTimeToUpdate
                    },
                    success: function(response) {
                        jQuery("#loaderModal").hide();
                        toastr.success('Throttle time updated successfully!');
                        getThrottleSetting();
                    },
                    error: function() {
                        jQuery("#loaderModal").hide();
                        toastr.error('An error occurred while updating.');

                    },
                    complete: function() {
                        jQuery("#loaderModal").hide();
                        sleepTimeToUpdate = null;
                    }
                });
            }
        });

        $(document).on('click', '.close, .close-btn', function() {
            $("#tableContainer").css("display", "none");
        });

        $(document).on('click', '.show_all_reboot_type', function(e) {
            e.preventDefault();
            var selectedDate = $('#date-input').val();
            var get_type = $('input[name="type"]:checked').val();
            var device_number = $(this).data('device_number');
            console.log(device_number);
            jQuery("#loaderModal").show();

            $.ajax({
                type: "GET",
                url: getRebootTypeUrl,
                dataType: 'json',
                data: {
                    "date": selectedDate,
                    "type": get_type,
                    "device_number": device_number
                },
                success: function(res) {
                    jQuery("#loaderModal").hide();
                    if (res.success) {
                        $('#reboot_type_data').html(res.reboot_html);
                        $("#show_device_reboot_type").fadeToggle();
                        $("#show_device_reboot_type").css({
                            "visibility": "visible",
                            "display": "block"
                        });
                    }
                },
                error: function(res) {
                    jQuery("#loaderModal").hide();
                },
            });

        });

        // Device attention type

        $('.close-popup').on('click', function(e) {
            $("#show_device_reboot_type").fadeToggle();
            $("#show_device_reboot_type").css({
                "visibility": "hidden",
                "display": "none"
            });
        });

        $(document).on('click', '.device_acknowledge, .acknowledge-all-button', function(e) {
            $('#device-attention-confirm-from #ack_all_devices').remove();
            if ($(this).hasClass('acknowledge-all-button')) {
                $('#device-attention-confirm-from').append('<input type="hidden" id="ack_all_devices" name="ack_all_devices" value="yes">');
                $('#confirm_modal_popup .popup-txt').text('Are you sure want to acknowledge for all devices?');
            } else {
                var device_id = $(this).data('id');
                var device_number = $(this).data('device_number');
                $('#device_pk_id').val(device_id);
                $('#device_mob_number').val(device_number);
                $('#confirm_modal_popup .popup-txt').text('Are you sure want to acknowledge for this device?');
            }
            $("#confirm_modal_popup").fadeToggle();
            $("#confirm_modal_popup").css({
                "visibility": "visible",
                "display": "block"
            });
        });

        $('.close-confirm-modal').on('click', function(e) {
            $("#confirm_modal_popup").fadeToggle();
            $("#confirm_modal_popup").css({
                "visibility": "hidden",
                "display": "none"
            });
        });

        $(document).on('click', '#display-device-detail', function(e) {
            var srchDate = $('#date-input').val();
            var targetUrl = devicesTestCallDetailUrl + "?selected_date=" + srchDate;
            window.open(targetUrl, '_blank');
        });

        jQuery(".jump-to-page-wrapper").on('click', '#go_to_page', function(event) {
            jumpToDataTablePage();
        });

        jQuery(".jump-to-page-wrapper").on('keyup', '#jump_to_page_num', function(event) {
            if (event.which === 13) {
                jumpToDataTablePage();
            }
        });

        function jumpToDataTablePage() {
            jQuery('.jump-to-page-wrapper').addClass('searching');
            jQuery('#go_to_page').html('<i class="fa fa-spinner fa-spin"></i>');
            var pageNum = jQuery('#jump_to_page_num').val() - 1;
            if (jQuery('#jump_to_page_num').val() == '' || jQuery('#jump_to_page_num').val() == 0) {
                pageNum = 0;
            }
            var jumpToDataTableObj = jQuery('#device-attention-table').DataTable();
            jumpToDataTableObj.page(pageNum).draw('page');
        }

    });


    var allDevicesArr = [];
    var animationInterval;
    jQuery(".col-one-half-right-content").on('click', '#reboot-device', function(event) {
        jQuery("#selected-device").val('');
        jQuery("#selected-device").attr('data-device-name', '');
        var seletedOption = jQuery('.reboot-device-select option:selected').val();
        var seletedDeviceName = jQuery('.reboot-device-select option:selected').text();
        //var seletedDeviceDynamicReboot = jQuery('.reboot-device-select option:selected').attr('dynamic-reboot');
        jQuery("#selected-device").val(seletedOption);
        jQuery("#selected-device").attr('data-device-name', seletedDeviceName);

        jQuery('#reboot-device-confirmation-modal').show();
        var s = jQuery(".reboot-device-select")[0].selectize; //get select
        var data = s.options[s.items[0]]; //get current data() for the active option.
        jQuery("#selected-device").attr('data-device-dynamic-reboot', data.dynamicreboot);
    });
    jQuery("#reboot-device-confirmation-modal").on('click', '.close,.reboot-device-cancel', function(event) {
        event.stopPropagation();
        jQuery('#reboot-device-confirmation-modal').hide();
    });
    jQuery("#dynamic-reboot-off-confirmation-modal").on('click', '.dynamic-reboot-popup-close,.dynamic-reboot-off-cancel', function(event) {
        event.preventDefault();
        jQuery('#dynamic-reboot-off-confirmation-modal').hide();
    });
    jQuery("#reboot-device-confirmation-modal").on('click', '#reboot-device-ok', function(event) {
        var checkDynamicReboot = jQuery("#reboot-device-confirmation-modal #selected-device").attr('data-device-dynamic-reboot');
        var selectedDeviceID = jQuery("#reboot-device-confirmation-modal #selected-device").val();
        var selectedDeviceName = jQuery("#reboot-device-confirmation-modal #selected-device").attr('data-device-name');
        var isForceReboot = 0;
        jQuery('#reboot-device-confirmation-modal').hide();
        jQuery('#dynamic-reboot-off-confirmation-modal').hide();
        jQuery('#reboot-device-confirmation-modal').hide();
        dynamicRebootDeviceAPIFunctionCall(selectedDeviceID, isForceReboot);
    });
    jQuery("#dynamic-reboot-off-confirmation-modal").on('click', '#dynamic-reboot-off-ok', function(event) {
        var selectedDeviceID = jQuery('#dynamic-reboot-off-ok').attr('data-dynamic-reboot-id');
        var isForceReboot = 1;
        dynamicRebootDeviceAPIFunctionCall(selectedDeviceID, isForceReboot);
        jQuery('#reboot-device-confirmation-modal').hide();
        jQuery('#dynamic-reboot-off-confirmation-modal').hide();
    });
    jQuery(document).ready(function() {
        jQuery("#loaderModal").show();
        var ajaxApiUrl = baseURL + "GetAllDevices";
        jQuery.ajax({
            type: "GET",
            url: ajaxApiUrl,
            success: function(res) {
                if (res.success) {
                    if (res.data.all_devices.length > 0) {
                        var all_device_names = res.data.all_devices;
                        allDevicesArr = res.data.all_devices;
                        var deviceNameOptions = "<option value=''></option>";
                        var deviceMaintenanceNameOptions = "";
                        for (var k = 0; k < all_device_names.length; k++) {
                            deviceNameOptions = deviceNameOptions + "<option value='" + all_device_names[k].mobile_number + "' data-dynamicreboot='" + all_device_names[k].dynamic_reboot + "'>" + all_device_names[k].device_name + "</option>";
                            if (parseInt(all_device_names[k].device_status) != 3) {
                                deviceMaintenanceNameOptions = deviceMaintenanceNameOptions + "<option value='" + all_device_names[k].ID + "'>" + all_device_names[k].device_name + "</option>";
                            }
                        }
                    }
                    jQuery(".reboot-device-select").html('');
                    jQuery(".reboot-device-select").append(deviceNameOptions);
                    jQuery(".reboot-device-select").selectize({
                        onInitialize: function() {
                            var s = this;
                            this.revertSettings.$children.each(function() {
                                jQuery.extend(s.options[this.value], jQuery(this).data());
                            });
                        }
                    });
                    jQuery("#reboot-device").show();

                    jQuery(".maintenance-device-select").html('');
                    jQuery(".maintenance-device-select").append(deviceMaintenanceNameOptions);
                    jQuery(".maintenance-device-select").fSelect({
                        placeholder: 'Select some device(s)',
                        numDisplayed: 4,
                        overflowText: '{n} device(s) selected',
                        noResultsText: 'No device(s) found',
                        searchText: 'Search device(s)',
                        showSearch: true
                    });
                    jQuery(".maintenance-device-dropdown-control-cont").show();

                    jQuery(".test-call-device-select").html('');
                    jQuery(".test-call-device-select").append(deviceNameOptions);
                    jQuery(".test-call-device-select").selectize({
                        onInitialize: function() {
                            var s = this;
                            this.revertSettings.$children.each(function() {
                                jQuery.extend(s.options[this.value], jQuery(this).data());
                            });
                        }
                    });
                    jQuery("#reboot-device").show();

                    jQuery("#loaderModal").hide();
                } else {
                    jQuery(".reboot-device-select").html('');
                    jQuery(".reboot-device-select").append(deviceNameOptions);
                    jQuery(".reboot-device-select").selectize();
                    jQuery("#reboot-device").show();
                    jQuery("#loaderModal").hide();
                }
            },
            error: function(jqXHR, error, errorThrown) {
                if (jqXHR.status && jqXHR.status == 400) {
                    var res_json = JSON.parse(jqXHR.responseText);
                }
            }
        });
        //for get parent devices
        var ajaxApiUrl1 = baseURL + "GetAllParentDevices";
        jQuery.ajax({
            type: "GET",
            url: ajaxApiUrl1,
            success: function(res) {
                if (res.success) {
                    if (res.data.all_devices.length > 0) {
                        var all_device_names = res.data.all_devices;
                        allDevicesArr = res.data.all_devices;
                        var deviceNameOptions = "<option value=''></option>";
                        var deviceMaintenanceNameOptions = "";
                        for (var k = 0; k < all_device_names.length; k++) {
                            deviceNameOptions = deviceNameOptions + "<option value='" + all_device_names[k].ID + "'>" + all_device_names[k].carrier_name + "</option>";
                        }
                    }

                    jQuery(".parent_carrier_name").html('');
                    jQuery(".parent_carrier_name").append(deviceNameOptions);
                    jQuery(".parent_carrier_name").selectize({
                        onInitialize: function() {
                            var s = this;
                            this.revertSettings.$children.each(function() {
                                jQuery.extend(s.options[this.value], jQuery(this).data());
                            });
                        }
                    });
                    jQuery("#reboot-device").show();

                    jQuery("#loaderModal").hide();
                } else {
                    jQuery(".reboot-device-select").html('');
                    jQuery(".reboot-device-select").append(deviceNameOptions);
                    jQuery(".reboot-device-select").selectize();
                    jQuery("#reboot-device").show();
                    jQuery("#loaderModal").hide();
                }
            },
            error: function(jqXHR, error, errorThrown) {
                if (jqXHR.status && jqXHR.status == 400) {
                    var res_json = JSON.parse(jqXHR.responseText);
                }
            }
        });

        $('#parent_carrier_button').click(function() {
            jQuery('#cancel-call-confirmation-modal').show();
        });
    });


    function dynamicRebootDeviceAPIFunctionCall(selectedDeviceID, isForceReboot) {
        var ajaxPostApiUrl = baseURL + "DynamicRebootDevice";
        console.log("selectedDeviceID===>", selectedDeviceID);
        jQuery.ajax({
            type: "POST",
            data: {
                'dynamic_reboot_device_id': selectedDeviceID,
                'is_force_to_reboot': isForceReboot
            },
            url: ajaxPostApiUrl,
            success: function(res) {
                if (res.success) {
                    jQuery('#reboot-device-confirmation-modal').hide();
                    jQuery('#dynamic-reboot-off-confirmation-modal').hide();
                    jQuery('.addnumber-success-popup').fadeIn(500);
                    jQuery('.addnumber-error-message').html(res.message);
                    setTimeout(function() {
                        jQuery('.addnumber-success-popup').fadeOut(300);
                    }, 2000);
                    location.reload();
                } else if (res.status == 201) {
                    jQuery('#dynamic-reboot-off-confirmation-modal').fadeIn(300);
                    jQuery('#dynamic-reboot-off-confirmation-modal #dynamic-reboot-off-ok').attr('data-dynamic-reboot-id', selectedDeviceID);
                    jQuery('#dynamic-reboot-off-confirmation-modal #dynamic-reboot-off-ok').attr('data-dynamic-reboot-device-name', selectedDeviceName);
                } else {
                    jQuery('#reboot-device-confirmation-modal').hide();
                    jQuery('#dynamic-reboot-off-confirmation-modal').hide();
                    jQuery('.addnumber-success-popup').addClass('.addnumber-error-popup');
                    jQuery('.addnumber-success-popup').fadeIn(500);
                    jQuery('.addnumber-error-message').html(res.message);
                    setTimeout(function() {
                        jQuery('.addnumber-success-popup').fadeOut(300);
                    }, 2000);
                }
            },
            error: function(jqXHR, error, errorThrown) {
                if (jqXHR.status && jqXHR.status == 400) {
                    var res_json = JSON.parse(jqXHR.responseText);
                    jQuery('.addnumber-success-popup').addClass('.addnumber-error-popup');
                    jQuery('.addnumber-success-popup').fadeIn(500);
                    jQuery('.addnumber-error-message').html("Something went wrong...");
                    setTimeout(function() {
                        jQuery('.addnumber-success-popup').fadeOut(300);
                    }, 2000);
                }
            }
        });
    }
    // Get the modal
    var modal = document.getElementById("myModal");
    var pwmodal = document.getElementById("myPWModal");
    // Get the <span> element that closes the modal
    var span = document.getElementsByClassName("close")[0];
    $('#NoBTN').click(function() {
        modal.style.display = "none";
        // ^-- missing #
    });
    // When the user clicks the button, open the modal
    function StartStopCallFunctionMain(value) {
        modal.style.display = "block";
        if (value == 3) {
            $("#model_msg").html('Are you sure to stop number sentry calling system?');
        } else {
            $("#model_msg").html('Are you sure to start number sentry calling system?');
        }
        pwmodal.style.display = "none";
        $("#YesBTN").attr('onclick', 'StartStopCallFunction(' + value + ')');
    }

    function verifyFunction(callFor) {
        pwmodal.style.display = "block";
        $("#PwYesBTN").attr('onclick', callFor);
    }
    // Get the <span> element that closes the modal
    var span1 = document.getElementsByClassName("close")[1];
    $('#PWNoBTN').click(function() {
        pwmodal.style.display = "none";
        // ^-- missing #
    });
    // When the user clicks on <span> (x), close the modal
    span1.onclick = function() {
        pwmodal.style.display = "none";
    }
    // When the user clicks on <span> (x), close the modal
    span.onclick = function() {
        modal.style.display = "none";
    }
    // When the user clicks anywhere outside of the modal, close it
    window.onclick = function(event) {
        if (event.target == modal) {
            modal.style.display = "none";
        }
    }
    var baseURL = "{{ URL::to('/') }}" + "/";

    function TestCallFunction() {
        //alert(baseURL);
        var CalledFrom = $("#CalledFrom").val();
        var CalledTo = $("#CalledTo").val();
        var Pass = $("#password").val();
        var CallType = $(".CallType:checked").val();
        /*if(Pass == ''){
            alert('Please enter password');
            return false;
        }*/
        var filter = /^\d*(?:\.\d{1,2})?$/;
        if (CallType == 1) {
            $("#mobile-valid").removeClass("hidden");
            $("#folio-invalid").addClass("hidden");
        } else {
            if (filter.test(CalledTo)) {
                if (CalledTo.length == 10) {
                    $("#mobile-valid").removeClass("hidden");
                    $("#folio-invalid").addClass("hidden");
                } else {
                    alert('Please put 10  digit mobile number');
                    $("#folio-invalid").removeClass("hidden");
                    $("#mobile-valid").addClass("hidden");
                    return false;
                }
            } else {
                alert('Not a valid number');
                $("#folio-invalid").removeClass("hidden");
                $("#mobile-valid").addClass("hidden");
                return false;
            }
        }
        if (CalledFrom && CalledTo) {
            if (CallType == 1) {
                var urlLink = baseURL + "TestCallForCallingAPI"
            } else {
                var urlLink = baseURL + "AddTestCallInCallingQueue"
            }
            pwmodal.style.display = "none";
            //alert(urlLink);
            $.ajax({
                type: "POST",
                url: urlLink,
                data: {
                    called_from: CalledFrom,
                    called_to: CalledTo,
                    pw: Pass
                },
                success: function(response) {
                    //console.log("response =>"+response.message);
                    if (response.message) {

                        if (CallType != 1) {
                            setTimeout(function() {
                                ConnectTestCallFunction();
                            }, 4000);
                        }
                        pwmodal.style.display = "none";
                        alert(response.message);
                        $("#CalledFrom").val('');
                        $("#CalledTo").val('');
                        $("#password").val('');
                    } else {
                        alert(response.message);
                    }
                }
            });
        } else {
            alert("Called From & Called To Required");
        }
    }

    function ConnectTestCallFunction() {
        $("#StartCallQueueBTN").prop('disabled', true);
        var urlLink = baseURL + "UpdateDataForTelephonyAPI"
        $.ajax({
            type: "GET",
            url: urlLink,
            data: '',
            success: function(response) {
                // $("#StartCallQueueBTN").prop('disabled', false);
            }
        });
        // $("#StartCallQueueBTN").prop('disabled', false);
    }

    function StartStopCallFunction(val) {
        //debugger;
        /*var Pass = $("#password").val();
        if(Pass == ''){
            alert('Please enter password');
            return false;
        }*/
        modal.style.display = "none";
        if (val != '') {
            $(':input[type="button"]').prop('disabled', true);
            var urlLink = baseURL + "StopTestCall";
            $.ajax({
                type: "POST",
                url: urlLink,
                data: {
                    status: val
                },
                success: function(response) {
                    //pwmodal.style.display = "none";
                    alert(response.message);
                    $(':input[type="button"]').prop('disabled', false);
                    //$("#password").val('');
                },
                error: function(error) {
                    $(':input[type="button"]').prop('disabled', false);
                }
            });
        }
    }

    function moveDevicesToMaintenance() {
        var selectedDevices = $(".maintenance-device-select").val();
        if (!selectedDevices) {
            alert("Please select at least one device to move in maintenance status");
            return;
        }
        selectedDevices = selectedDevices ? selectedDevices.join() : '';
        $(':input[type="button"]').prop('disabled', true);
        startAnimation($("#maintenance-device"), $("#maintenance-device-progress"), "Wait ...");
        var urlLink = baseURL + "UpdateFreeDevicesToMaintenance";
        $.ajax({
            type: "POST",
            url: urlLink,
            data: {
                selected_devices: selectedDevices
            },
            success: function(response) {
                alert(response.message);
                $(':input[type="button"]').prop('disabled', false);
                if (response.success) {
                    $('.maintenance-device-select :selected').remove();
                    $('.maintenance-device-select').fSelect('reload');
                    stopAnimation($("#maintenance-device"), $("#maintenance-device-progress"), "Wait ...");
                    GetMaintenanceModeDevices();
                }
            },
            error: function(error) {
                $(':input[type="button"]').prop('disabled', false);
            }
        });
    }

    function moveDevicesToTestCall() {
        var selectedDevices = $(".test-call-device-select").val();
        if (!selectedDevices) {
            alert("Please select at least one device to move in test call status");
            return;
        }

        $(':input[type="button"]').prop('disabled', true);
        startAnimation($("#removeTestCallMode"), $("#removeTestCallModeProgress"), "Wait ...");
        var urlLink = baseURL + "UpdateFreeDevicesToTestCall";
        $.ajax({
            type: "POST",
            url: urlLink,
            data: {
                selected_devices: selectedDevices
            },
            success: function(response) {
                alert(response.message);
                $(':input[type="button"]').prop('disabled', false);
                if (response.success) {
                    //$('.maintenance-device-select :selected').remove();
                    //$('.maintenance-device-select').fSelect('reload');
                    stopAnimation($("#removeTestCallMode"), $("#removeTestCallModeProgress"), "Wait ...");
                    GetTestCallModeDevices();
                }
            },
            error: function(error) {
                $(':input[type="button"]').prop('disabled', false);
            }
        });
    }

    function removeMaintanance() {
        if ($('.select-device').length <= 0) {
            alert("No devices to move in active status");
            return;
        }
        let selected_devices = [];
        $('.select-device:checked').each(function() {
            selected_devices.push(this.value);
        });
        if (!selected_devices.length) {
            alert("Please select at least one device to move in active status");
            return;
        }
        $(':input[type="button"]').prop('disabled', true);
        startAnimation($("#removeMaintanance"), $("#removeMaintananceProgress"), "Wait ...");
        var urlLink = baseURL + "UpdateMaintenanceModeDeviceToFree";
        $.ajax({
            type: "POST",
            url: urlLink,
            data: {
                selected_devices: selected_devices.join()
            },
            success: function(response) {
                alert(response.message);
                $(':input[type="button"]').prop('disabled', false);
                $('#refresh_maintainence').trigger('click');
                stopAnimation($("#removeMaintanance"), $("#removeMaintananceProgress"));
                if (response.success) {
                    $('.select-device:checked').each(function() {
                        $(this).closest('tr').remove();
                    });
                    $("#select-all-devices").prop('checked', false);
                    var current_device_count = parseInt($("#deviceCunt").text());
                    var updated_device_count = current_device_count - selected_devices.length;
                    $("#deviceCunt").text((updated_device_count > 0 ? updated_device_count : 0));
                    stopAnimation($("#removeMaintanance"), $("#removeMaintananceProgress"));
                    addUpdatedDevicesToAllDevices(selected_devices);
                    $('#refresh_maintainence').trigger('click');
                }
            },
            error: function(error) {
                $(':input[type="button"]').prop('disabled', false);
                $('#refresh_maintainence').trigger('click');
            }
        });
    }

    function removeTestCallMode() {
        if ($('.select-device-test-call').length <= 0) {
            alert("No devices to move in active status");
            return;
        }
        let selected_devices = [];
        $('.select-device-test-call:checked').each(function() {
            selected_devices.push(this.value);
        });
        if (!selected_devices.length) {
            alert("Please select at least one device to move in active status");
            return;
        }
        $(':input[type="button"]').prop('disabled', true);
        startAnimation($("#removeTestCallMode"), $("#removeTestCallModeProgress"), "Wait ...");
        //console.log(selected_devices);return;
        var urlLink = baseURL + "UpdateTestCallModeDeviceToFree";
        $.ajax({
            type: "POST",
            url: urlLink,
            data: {
                selected_devices: selected_devices.join()
            },
            success: function(response) {
                alert(response.message);
                $(':input[type="button"]').prop('disabled', false);
                if (response.success) {
                    $('.select-device-test-call:checked').each(function() {
                        $(this).closest('tr').remove();
                    });
                    stopAnimation($("#removeTestCallMode"), $("#removeTestCallModeProgress"));
                    $("#select-all-devices-test").prop('checked', false);
                    /*$("#select-all-devices").prop('checked', false);
                    var current_device_count = parseInt($("#deviceCunt").text());
                    var updated_device_count = current_device_count - selected_devices.length;
                    $("#deviceCunt").text((updated_device_count > 0 ? updated_device_count : 0));
                    addUpdatedDevicesToAllDevices(selected_devices);*/
                }
            },
            error: function(error) {
                $(':input[type="button"]').prop('disabled', false);
            }
        });
    }

    function addUpdatedDevicesToAllDevices(devices_arr) {
        startAnimation($("#maintenance-device"), $("#maintenance-device-progress"), "Loading ...");
        var res_devices_arr = allDevicesArr.filter(({
            ID: all_device_id
        }) => devices_arr.some((device_arr_id) => all_device_id == device_arr_id));
        var deviceMaintenanceNameOptions = '';
        for (var i = 0; i < res_devices_arr.length; i++) {
            deviceMaintenanceNameOptions = deviceMaintenanceNameOptions + "<option value='" + res_devices_arr[i].ID + "'>" + res_devices_arr[i].device_name + "</option>";
        }
        jQuery(".maintenance-device-select").append(deviceMaintenanceNameOptions);
        var maintenance_device_select = $('.maintenance-device-select');
        maintenance_device_select.html(maintenance_device_select.find('option').sort(function(x, y) {
            return $(x).text() > $(y).text() ? 1 : -1;
        }));
        $('.maintenance-device-select').fSelect('reload');
        setTimeout(() => {
            stopAnimation($("#maintenance-device"), $("#maintenance-device-progress"));
        }, 1000);
    }

    function GetTestCallModeDevices() {
        startAnimation($("#removeTestCallMode"), $("#removeTestCallModeProgress"), "Loading ...");
        var urlLink = baseURL + "GetTestCallModeDevices";
        $.ajax({
            type: "GET",
            url: urlLink,
            data: {},
            success: function(response) {
                let response_devices_arr = response.data.length ? response.data : [];
                $("#deviceTestCunt").text(response_devices_arr.length);
                let tbody_str = '';
                for (let i = 0; i < response_devices_arr.length; i++) {
                    tbody_str = tbody_str + '<tr>' +
                        '<td>' +
                        '<label class="check-box-container">' +
                        '<input class="select-device-test-call" type="checkbox" value="' + response_devices_arr[i].device_id + '" />' +
                        '<span class="checkmark"></span>' +
                        '</label>' +
                        '</td>' +
                        '<td>' + response_devices_arr[i].device_name + '</td>' +
                        '<td>' + response_devices_arr[i].maintenance_date_time + '</td>';
                }
                $(".test-call-device-list-tbody").html(tbody_str);
                stopAnimation($("#removeTestCallMode"), $("#removeTestCallModeProgress"));
            }
        });
    }

    function GetMaintenanceModeDevices() {
        startAnimation($("#removeMaintanance"), $("#removeMaintananceProgress"), "Loading ...");
        var urlLink = baseURL + "GetMaintenanceModeDevices";
        $.ajax({
            type: "GET",
            url: urlLink,
            data: {},
            success: function(response) {
                let response_devices_arr = response.data.length ? response.data : [];
                $("#deviceCunt").text(response_devices_arr.length);
                let tbody_str = '';
                for (let i = 0; i < response_devices_arr.length; i++) {

                    tbody_str = tbody_str + '<tr>' +
                        '<td>' +
                        '<label class="check-box-container">' +
                        '<input class="select-device" type="checkbox" value="' + response_devices_arr[i].device_id + '" />' +
                        '<span class="checkmark"></span>' +
                        '</label>' +
                        '</td>' +
                        '<td>' + response_devices_arr[i].device_name + '</td>' +
                        '<td>' + response_devices_arr[i].maintenance_reason + '</td>' +
                        '<td>' + response_devices_arr[i].maintenance_date_time + '<br>' + response_devices_arr[i].time_ago + '</td>';
                    //if the response.permission status is not approved then only add the class and attribute inn which we store the permisiion required value
                    if (response_devices_arr[i].permission_status != 'Approved') {
                        tbody_str += "<td class='not-approved-permission' data-permission_req_cnt=" + JSON.stringify(response_devices_arr[i].required_permissions) + ">" + response_devices_arr[i].permission_status + '</td>';
                    } else {
                        tbody_str += '<td>' + response_devices_arr[i].permission_status + '</td>';
                    }

                }
                $(".maintenance-device-list-tbody").html(tbody_str);
                stopAnimation($("#removeMaintanance"), $("#removeMaintananceProgress"));
            }
        });
    }

    function GetAllParentDevices() {
        startAnimation($("#removeTestCallMode"), $("#removeTestCallModeProgress"), "Loading ...");
        var urlLink = baseURL + "GetTestCallModeDevices";
        $.ajax({
            type: "GET",
            url: urlLink,
            data: {},
            success: function(response) {
                let response_devices_arr = response.data.length ? response.data : [];
                let tbody_str = '';
                for (let i = 0; i < response_devices_arr.length; i++) {
                    tbody_str = tbody_str + '<tr>' +
                        '<td>' +
                        '<label class="check-box-container">' +
                        '<input class="select-device-test-call" type="checkbox" value="' + response_devices_arr[i].device_id + '" />' +
                        '<span class="checkmark"></span>' +
                        '</label>' +
                        '</td>' +
                        '<td>' + response_devices_arr[i].device_name + '</td>' +
                        '<td>' + response_devices_arr[i].maintenance_date_time + '</td>';
                }
                $(".test-call-device-list-tbody").html(tbody_str);
                stopAnimation($("#removeTestCallMode"), $("#removeTestCallModeProgress"));
            }
        });
    }

    function cancelScheduledCalls(data) {
        jQuery('#cancel-call-confirmation-modal').hide();
        if (data == 'No') {
            return;
        }
        var selectedDevices = $(".parent_carrier_name").val();
        if (!selectedDevices) {
            alert("Please select at least one device to cancel scheduled calls");
            return;
        }
        $(':input[type="button"]').prop('disabled', true);
        startAnimation($("#cancel-call-confirmation-modal"), $("#cancelSheduledModeProgress"), "Wait ...");
        var urlLink = baseURL + "CancelSchduledCallsOnCarrier";
        $.ajax({
            type: "POST",
            url: urlLink,
            data: {
                selected_devices: selectedDevices
            },
            success: function(response) {
                alert(response.message);
                $(':input[type="button"]').prop('disabled', false);
                if (response.success) {
                    $("#cancelSheduledModeProgress").hide();
                }
            },
            error: function(error) {
                $(':input[type="button"]').prop('disabled', false);
            }
        });
    }

    function startAnimation(currEle, progressEle, progressEleText) {
        currEle.hide();
        progressEle.html(progressEleText);
        progressEle.show();
    }

    function stopAnimation(currEle, progressEle) {
        currEle.show();
        progressEle.hide();
    }

    $(document).ready(function() {
        $("#select-all-devices").prop('checked', false);
        $("#select-all-devices-test").prop('checked', false);
        GetMaintenanceModeDevices();
        //GetTestCallModeDevices();
        $("#select-all-devices").on('click', function() {
            if ($(this).is(':checked')) {
                $(".select-device").each(function() {
                    $(this).prop('checked', true);
                });
            } else {
                $(".select-device").each(function() {
                    $(this).prop('checked', false);
                });
            }
        });

        $("#select-all-devices-test").on('click', function() {
            if ($(this).is(':checked')) {
                $(".select-device-test-call").each(function() {
                    $(this).prop('checked', true);
                });
            } else {
                $(".select-device-test-call").each(function() {
                    $(this).prop('checked', false);
                });
            }
        });
    });

    function StartCallQueueFunction() {
        jQuery("#loaderModal").show();
        var urlLink = baseURL + "updateStopCallSettingsAPI/false"
        $.ajax({
            type: "GET",
            url: urlLink,
            data: '',
            success: function(response) {
                jQuery("#loaderModal").hide();
                checkCallingCountStatus();
                ConnectTestCallFunction();
                alert('Calling was started');
            },
            error: () => {
                jQuery("#loaderModal").hide();
                alert('Facing some technical error');
            }
        });
    }

    function StopCallQueueFunction() {
        jQuery("#loaderModal").show();
        var urlLink = baseURL + "updateStopCallSettingsAPI/true"
        $.ajax({
            type: "GET",
            url: urlLink,
            data: '',
            success: function(response) {
                jQuery("#loaderModal").hide();
                alert('Calling was stoped');
                checkCallingCountStatus();
            }
        });
    }

    function StartStopObnRetry(type) {
        jQuery("#loaderModal").show();
        let url = baseURL + 'startStopObnRetry/' + type;
        $.ajax({
            type: "GET",
            url: url,
            data: '',
            success: function(response) {
                jQuery("#loaderModal").hide();
                alert(response.msg);
                checkRetryCountStatus();
            }
        });
    }

    $(document).ready(() => {
        checkRetryCountStatus();
        checkCallingCountStatus();
    })

    function checkRetryCountStatus() {
        let url = baseURL + 'checkRetryCountStatus';
        $.ajax({
            type: "GET",
            url: url,
            data: '',
            success: function(response) {
                if (response.code === 200) {
                    if (response.data.setting_value == 0) {
                        $('#stopObnRetryBtn').prop('disabled', true);
                        $('#startObnRetryBtn').prop('disabled', false);
                        $('#startButton').html('<b>Inactive</b>');
                        $('#stopButton').html('<b>Active</b>');
                    } else {
                        $('#startObnRetryBtn').prop('disabled', true);
                        $('#stopObnRetryBtn').prop('disabled', false);
                        $('#startButton').html('<b>Active</b>');
                        $('#stopButton').html('<b>Inactive</b>');
                    }
                }
            }
        });
    }

    function checkCallingCountStatus() {
        let url = baseURL + 'checkCallingStatus';
        $.ajax({
            type: "GET",
            url: url,
            data: '',
            success: function(response) {
                if (response.code === 200) {
                    if (response.data.setting_value == 'true') {
                        $('#StopCallQueueBTN').prop('disabled', true);
                        $('#StartCallQueueBTN').prop('disabled', false);
                        $('#startCallButton').html('<b>Inactive</b>');
                        $('#stopCallButton').html('<b>Active</b>');
                    } else {
                        $('#StartCallQueueBTN').prop('disabled', true);
                        $('#StopCallQueueBTN').prop('disabled', false);
                        $('#startCallButton').html('<b>Active</b>');
                        $('#stopCallButton').html('<b>Inactive</b>');
                    }
                }
            }
        });
    }

    function getThrottleSetting() {
        let url = baseURL + 'throttle-settings';
        $.ajax({
            type: "GET",
            url: url,
            success: function(response) {
                if (response.code === 200) {
                    $('#sleep_time').val(response.sleep_time);
                }
            }
        });
    }
</script>

@canany(['test call status','devices need attention'])
<script>
    var getPSRICountUrl = "{{ route('CallingTotalCounts') }}";
    var getDeviceAttentionUrl = "{{ route('getDeviceAttentions') }}";
    var isDeviceAlarmUrl = "{{ route('isDeviceAlarm') }}";
    var deviceAcknowledgeUrl = "{{ route('deviceAcknowledge') }}";

    $(document).ready(function() {

        var srchDate = $('#date-input').val();
        var type = $('input[name="type"]:checked').val();
        var triggered_source = $('input[name="call_execution_status"]:checked').val();
        var tabledata = [];

        function getPSRICount(showLoader) {
            // jQuery("#loaderModal").show();
            triggered_source = $('input[name="call_execution_status"]:checked').val();
            if (showLoader) {
                jQuery('#home_device_attention_block').prepend(loaderHtml);
            }
            $.ajax({
                type: "GET",
                url: getPSRICountUrl,
                dataType: 'json',
                data: {
                    "date": srchDate,
                    "type": type,
                    "triggered_source": triggered_source
                },
                success: function(res) {
                    jQuery('#home_device_attention_block .loading_overlay').remove();
                    if (res.success) {
                        $('#total_pending').text(res.data.pending);
                        $('#total_success').text(res.data.successResult);
                        $('#total_failed').text(res.data.failed);
                        $('#total_retries').text(res.data.retryPercent);
                        $('#total_initiated').text(res.data.initiated);
                    }
                },
                error: function(res) {
                    jQuery("#loaderModal").hide();
                    jQuery('#home_device_attention_block .loading_overlay').remove();
                },
                finally: function() {
                    jQuery('#home_device_attention_block .loading_overlay').remove();
                }
            });
        }

        $('#filter_result_by_date').on('submit', function(e) {
            e.preventDefault();
            srchDate = $('#date-input').val();
            selectedDateForFilter = $('#date-input').val();
            type = $('input[name="type"]:checked').val();
            triggered_source = $('input[name="call_execution_status"]:checked').val();
            getPSRICount(true);
            // getDeviceAttentionsData(false);
        });

        getPSRICount(false);

        $('.refresh-table-button').on('click', function(e) {
            $(this).prop('disabled', true);
            $(this).find('i').removeClass('fa-fw').addClass('fa-spin');
            getDeviceAttentionsData(true);
        });

        getDeviceAttentionsData(false);

        function getDeviceAttentionsData(showTableLoader) {
            // var srchDate = $('#date-input').val();
            var type = $('input[name="type"]:checked').val();
            // jQuery('#daily-calling-status-count-table_processing').css('display','block');
            if (showTableLoader) {
                jQuery('.daily-calling-status-table-container').prepend(loaderHtml);
            }

            $.ajax({
                type: "GET",
                url: getDeviceAttentionUrl,
                data: {
                    "filter_date": selectedDateForFilter,
                    "filter_type": type
                },
                dataType: 'json',
                success: function(res) {
                    // jQuery('#daily-calling-status-count-table_processing').css('display','none');
                    jQuery('.daily-calling-status-table-container .loading_overlay').remove();
                    $('.refresh-table-button').prop('disabled', false);
                    $('.refresh-table-button i').removeClass('fa-spin').addClass('fa-fw');
                    if (res.success) {
                        var deviceAttentionDataTableArr = [];
                        if (res.data.length) {
                            var dAttentionData = res.data;
                            for (i = 0; i < dAttentionData.length; i++) {
                                var ackButton = "";
                                if (dAttentionData[i].is_acknowledge == 0) {
                                    ackButton = '<a href="javascript:void(0);" class="device_acknowledge" data-device_number="' + dAttentionData[i].device_number + '" data-id="' + dAttentionData[i].id + '">Ack</a>';
                                } else if (dAttentionData[i].is_acknowledge == 1) {
                                    ackButton = "Admin Cleared";
                                } else if (dAttentionData[i].is_acknowledge == 2) {
                                    ackButton = "System Cleared";
                                }

                                var alarmTypeMsg = '';
                                if (dAttentionData[i].alarm_type == 1) {
                                    alarmTypeMsg = "No Daily Static Reboot";
                                } else if (dAttentionData[i].alarm_type == 2) {
                                    alarmTypeMsg = '<a href="#" data-title="Average: ' + dAttentionData[i].average_count + ', Current: ' + dAttentionData[i].today_count + '">High Reboot Count</a>';
                                } else if (dAttentionData[i].alarm_type == 3) {
                                    alarmTypeMsg = '<a href="#" data-title="Average: ' + dAttentionData[i].average_count + ', Current: ' + dAttentionData[i].today_count + '">High Retry Rate</a>';
                                } else if (dAttentionData[i].alarm_type == 4) {
                                    alarmTypeMsg = "Maintenance Mode > 15 mins";
                                } else if (dAttentionData[i].alarm_type == 5) {
                                    alarmTypeMsg = '<a href="#" data-title="Average: ' + dAttentionData[i].average_count + ', Current: ' + dAttentionData[i].today_count + '">High No CNAME Count</a>';
                                } else if (dAttentionData[i].alarm_type == 6) {
                                    alarmTypeMsg = "No Success calls > 10 mins";
                                } else if (dAttentionData[i].alarm_type == 7) {
                                    alarmTypeMsg = '<a href="#" data-title="Average: ' + dAttentionData[i].average_count + ', Current: ' + dAttentionData[i].today_count + '">Label Count Alert</a>';
                                } else if (dAttentionData[i].alarm_type == 8) {
                                    alarmTypeMsg = '<a href="#" data-title="Average: ' + dAttentionData[i].average_count + ', Current: ' + dAttentionData[i].today_count + '">Block Count Alert</a>';
                                } else if (dAttentionData[i].alarm_type == 9) {
                                    alarmTypeMsg = 'Memory at Critical Low';
                                } else if (dAttentionData[i].alarm_type == 10) {
                                    alarmTypeMsg = "Low Battery";
                                } else if (dAttentionData[i].alarm_type == 11) {
                                    alarmTypeMsg = 'Memory at Low level';
                                } else if (dAttentionData[i].alarm_type == 12) {
                                    alarmTypeMsg = "Maintenance Mode > 3 times in one hour";
                                } else if (dAttentionData[i].alarm_type == 13) {
                                    alarmTypeMsg = "Device rebooted > 3 times in one hour";
                                }

                                var DAdata = {
                                    device_name: dAttentionData[i].device_name,
                                    device_number: dAttentionData[i].device_number,
                                    attention_type: alarmTypeMsg,
                                    attention_date: dAttentionData[i].notify_time,
                                    action: ackButton
                                }
                                deviceAttentionDataTableArr.push(DAdata);
                            }
                        } else {
                            jQuery('#device-attention-table tbody').html("<tr><td>No matching records found.</td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>");
                            jQuery('#device-attention-table_paginate').hide();
                            jQuery('#device-attention-table_info').hide();
                            jQuery('#device-attention-table-table').css('width', '100%');
                        }
                    }
                    deviceAttentionDataTable(deviceAttentionDataTableArr);
                    jQuery('.dataTables_filter input').attr('placeholder', 'Search');
                },
                error: function(jqXhr, textStatus, errorThrown) {
                    jQuery("#loaderModal").hide();
                }
            });
        }

        function deviceAttentionDataTable(attentionData) {
            $('#device-attention-table').DataTable({
                data: attentionData,
                "bDestroy": true,
                columns: [{
                        data: 'device_name'
                    },
                    {
                        data: 'device_number'
                    }, //or { data: 'MONTH', title: 'Month' }`
                    {
                        data: 'attention_type'
                    },
                    {
                        data: 'attention_date'
                    },
                    {
                        data: 'action'
                    },
                ],
                "bLengthChange": false,
                "bFilter": true,
                "bInfo": true,
                "bAutoWidth": false,
                "responsive": {
                    "breakpoints": [{
                            name: 'desktop',
                            width: Infinity
                        },
                        {
                            name: 'tablet',
                            width: 1024
                        },
                        {
                            name: 'fablet',
                            width: 768
                        },
                        {
                            name: 'phone',
                            width: 480
                        }
                    ]
                },
                "pagingType": "full_numbers",
                "pageLength": 50,
                "language": {
                    "search": ""
                },
                "order": [
                    [4, "asc"]
                ],
                "aoColumnDefs": [{
                    "bSortable": false,
                    "aTargets": [4]
                }, {
                    "bSearchable": false,
                    "aTargets": []
                }],
                "fnDrawCallback": function(oSettings) {
                    var deviceAttentionDataTableObj = jQuery('#device-attention-table').DataTable();
                    clearOverlaySpinner(deviceAttentionDataTableObj);
                }
            });
        }

        checkIsAlarm();

        function checkIsAlarm() {
            $.ajax({
                type: "GET",
                url: isDeviceAlarmUrl,
                dataType: 'json',
                success: function(res) {
                    if (res.success) {
                        if (res.data.is_alarm) {
                            $('.device-need-attention-box').show();
                        } else {
                            $('.device-need-attention-box').hide();
                        }
                    }
                },
                error: function(res) {

                },
            });

        }

        $(document).on('click', '.yes-confirm', function(e) {
            var from_data = $('#device-attention-confirm-from').serialize();
            from_data += "&attn_date=" + selectedDateForFilter;
            $.ajax({
                type: "GET",
                url: deviceAcknowledgeUrl,
                dataType: 'json',
                data: from_data,
                success: function(res) {
                    $('#device-attention-confirm-from #ack_all_devices').remove();
                    if (res.success) {
                        $("#confirm_modal_popup").fadeToggle();
                        $("#confirm_modal_popup").css({
                            "visibility": "hidden",
                            "display": "none"
                        });
                        getDeviceAttentionsData(true);
                    }
                },
                error: function(res) {

                },
            });
        });

        function clearOverlaySpinner(tableObj) {
            jQuery('.jump-to-page-wrapper').removeClass('searching');
            jQuery('#go_to_page').html('GO');
            if ((tableObj.page.info().page + 1) != parseInt(jQuery('#jump_to_page_num').val())) {
                jQuery('#jump_to_page_num').val('');
            }
            if (tableObj.page.info().pages > 0) {
                jQuery('.jump-to-page-wrapper').show();
            } else {
                jQuery('.jump-to-page-wrapper').hide();
            }
        }

        setInterval(function() {
            selectedDateForFilter = $('#date-input').val();
            getPSRICount(true);
            checkIsAlarm();
            getDeviceAttentionsData(false);
        }, (1000 * 60) * 5);

    });
</script>
@endcanany
@endsection