@extends('layouts.app')

@section('appjs')
    <script type="application/javascript" src="{{ asset('js/app.js') }}"></script>
@endsection
@section('content')
@section('page_title') SMS Dashboard @endsection
<style> 
    .form-inline .multiselect-container label.checkbox, .form-inline .multiselect-container label.radio{
        display: unset;
    }

    .dataTables_wrapper .dataTables_filter input {
        margin-right: 0px;
        margin-top: 0px;
    }
    </style>
<script>
   
$(document).ready(function(){

    $('#sms_dashboard').DataTable({"scrollX": true, "bLengthChange": false  });
    $('#start_date,#end_date').datepicker('setDate', 'today');
    $('#start_date,#end_date').datepicker({  maxDate: new Date() });

    $(".export-dashboard-excel").click(function(){
        selecetedColumnArray = [];
        var start_date = $('#start_date').val();
        var end_date = $('#end_date').val();
        var parent_id = $('#langOpt').val();


        $("input:checkbox:checked").each(function(){
            if($(this).data('column-name')){
                selecetedColumnArray.push($(this).data('column-name'));
            }
        });
        $('#from_date_hidden').val(start_date);
        $('#to_date_hidden').val(end_date);
        $('#parent_id_hidden').val(parent_id);
        $('#export_selected_column').val(selecetedColumnArray);
        $(this).submit();
    });
    smsCampaignDatatable();
});
    
</script>

<div class="container-fluid">
    <div class="card">
        <div class="row ml-3  mt-4 mb-n6">
                <div class="form-group col-md-2">@include('sms_trans_menu')</div>
                @can('hasExcelPermission')
                <div class="col-md-10 mt-2">
                    <form class="pull-right" method="post" action="{{ url('export_sms_dashboard') }}">
                    @csrf
                    <button type="submit" class="export-dashboard-excel btn  btn-sm excel-btn border-radius-0"><i class="fa fa-download"></i> Export</button>
                    <input type="hidden" name="fromdate" id="from_date_hidden" />
                    <input type="hidden" name="todate" id="to_date_hidden"/>
                    <input type="hidden" name="parentid[]" id="parent_id_hidden"/>
                    <input type="hidden" name="exportSelectedColumn" id="export_selected_column"/>
                    </form>
                    @endcan
                </div>
        </div>
        <div class="card-body">               
            <form class="flex">
                <div class="form-group col-md-3"> 
                    <label for="start_date">Choose Account &nbsp; </label><br>
                    <select class="form-control" name="langOpt[]" multiple id="langOpt">
                        <optgroup label="ACTIVE">
                            @foreach ($accname as $value)
                            @if($value->status == 1)
                                <option value="{{$value->id}}">{{ $value->account_name }}-({{$value->id}})</option>
                            @endif
                            @endforeach
                        </optgroup>
                        <optgroup label="INACTIVE">
                            @foreach ($accname as $value)
                            @if($value->status == 0)
                                <option value="{{$value->id}}">{{ $value->account_name }}-({{$value->id}})</option>
                            @endif
                            @endforeach
                        </optgroup>
                    </select>
                </div>
                <div class="form-group col-md-2">
                    <label for="period_filter">Choose Time Period</label>
                    <select id="period_filter" class="form-control">
                        <option value=''>Select</option>
                        <option value="1">Today</option>
                        <option value="2">Yesterday</option>
                        <option value="3">This Month</option>
                        <option value="4">Last Month</option>
                        <option value="5">Last 6 Months</option>
                        <option value="6">This Year</option>
                        <option value="7">Last Year</option>
                    </select>
                </div>
                <div class="form-group col-md-2">
                    <label for="start_date">From Date</label>
                    <input type="text" class="form-control" id="start_date" name="start_date">
                </div>

                <div class="form-group col-md-2">
                    <label for="end_date">To Date</label>
                    <input type="text" class="form-control" id="end_date" name="end_date">
                </div>
            </form>
            <div class="table-responsive">
                <table class="table-bordered table-hover " id="sms_dashboard">
                    <thead>
                        <tr>
                        <th>Sr. No</th>
                        <th>Launch ID</th>
                        <th>Account ID</th>
                        <th>Brand Name</th>
                        <th>Category</th>
                        <th>Account Category</th>
                        <th>Client</th>
                        <th>User Name</th>
                        <th>Email</th>
                        <th>Account Type</th>
                        <th>Campaign Group</th>
                        <th>Campaign Sub Group</th>
                        <th>Campaign Data</th>
                        <th>Campaign URL</th>
                        <th>Gateway Name</th>
                        <th>Account Name</th>
                        <th>Language</th>
                        <th>Campaign Date & Time</th>
                        <th>Launched Status</th>

                        <th>Messages Pushed</th>
                        <th>Messages Submitted</th>
                        <th>Total Message Units</th>

                        <th>Invalid Numbers</th>
                        <th>Exclucde Count</th>
                        <th>Blacklisted Numbers</th>
                        <th>Duplicate Numbers</th>
                        <th>Exclude No Activity Numbers</th>
                        <th>Exclude Operator Numbers</th>


                        <th>Sent Count</th>
                        <th>Failed Count</th>
                        <th>Delivered Count</th>
                        <th>Read Count</th>

                        <th>Clicks</th>


                        <th>Unique Clicks</th>
                        <th>Whistle Actions</th>
                        <th>Total Spends</th>
                        <th>CTR % <span data-toggle="tooltip" title="(Total Clicks / SMS Submitted) x 100"><i class="fa fa-info-circle" aria-hidden="true"></i></span></th>
                        <th>UCTR % <span data-toggle="tooltip" title="(Unique Clicks / SMS Submitted) x 100"><i class="fa fa-info-circle" aria-hidden="true"></i></span></th>
                        <th>Lead Ratio <span data-toggle="tooltip" title="(Whistle Actions/ SMS Submitted) x 100"><i class="fa fa-info-circle" aria-hidden="true"></i></span></th>
                        <th>CPC <span data-toggle="tooltip" title="Spends / Clicks"><i class="fa fa-info-circle" aria-hidden="true"></i></span></th>
                        <th>CPUC  <span data-toggle="tooltip" title="Spends/ Unique Clicks"><i class="fa fa-info-circle" aria-hidden="true"></i></span></th>
                        <th>CPL <span data-toggle="tooltip" title="Spends / Whistle Actions"><i class="fa fa-info-circle" aria-hidden="true"></i></span></th>
                        <th>CPM <span data-toggle="tooltip" title="Total Spends / SMS Submitted"><i class="fa fa-info-circle" aria-hidden="true"></i></span></th>
                        <th>Bot Click Ratio % <span data-toggle="tooltip" title=" (Bot Clicks * 100)/(Bot Clicks + Clicks)"><i class="fa fa-info-circle" aria-hidden="true"></i></span></th>

                        <th>CTA % <span data-toggle="tooltip" title=" (Whistle Actions / Clicks) x 100"><i class="fa fa-info-circle" aria-hidden="true"></i></span></th>
                        <th>UCTA % <span data-toggle="tooltip" title=" (Whistle Actions / Unique Clicks) x 100"><i class="fa fa-info-circle" aria-hidden="true"></i></span></th>
                        @if(Gate::allows('hasLogsPermission'))
                        <th>Logs</th>
                        @endif
                        </tr>
                    </thead>
                    <tbody>
                    </tbody>
                    <tfoot>
                        <tr>
                            <th>Total</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            <th>NA</th>
                            @if(Gate::allows('hasLogsPermission'))
                            <th>NA</th>
                            @endif
                        </tr>
                    </tfoot>
                </table>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="logModal" role="dialog">
    <div class="modal-dialog modal-lg">
        <!-- Modal content-->
        <div class="modal-content logmodelcontent">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body logmodalbody">
            <p id="logdata"></p>
            </div>
            <div class="modal-footer logmodalfooter">
            </div>
        </div>
    </div>
</div>


<link rel="stylesheet" href="{{asset('css/jquery-ui.css')}}"/>
<script type="application/javascript" src="{{ asset('js/jquery-ui.js') }}"></script>

<script>
    //multi select for users
    $('#langOpt').multiselect({
        enableFiltering: true,
        selectAllJustVisible: false,
        includeSelectAllOption: true,
        allSelectedText: 'All Accounts selected',
        nonSelectedText: 'No  Account selected',
        selectAllValue: 'all',
        selectAllText: 'Select all',
        unselectAllText: 'Unselect all',
        buttonWidth: '100%',
        templates: {
                filterClearBtn: '<span class="input-group-btn"><button class="btn btn-default multiselect-clear-filter border-radius-0" type="button">Clear</button></span>',
            },
            enableCaseInsensitiveFiltering: true
    });

    var start_date = end_date = '';

        $("#start_date").datepicker({
        dateFormat: 'yy-mm-dd',
        maxDate : 0,
        autoclose: true,
        todayHighlight: true,
        endDate: 'today',
        onSelect: function (selectedDate) {
            var startDate = $('#start_date').datepicker('getDate');
            $('#end_date').datepicker('option', 'minDate', startDate);
            $('#end_date').datepicker('setDate', startDate);
            smsCampaignDatatable();
            $('#period_filter').val('');
        }
    });

    $("#end_date").datepicker({
        dateFormat: 'yy-mm-dd',
        minDate: $("#start_date").datepicker("getDate"),
        maxDate : 0,
        autoclose: true,
        todayHighlight: true,
        onClose: function() {
            var startDate = $('#start_date').datepicker('getDate');
            var endDate = $('#end_date').datepicker('getDate');
            if (endDate < startDate) {
                var minDate = $('#end_date').datepicker('option', 'minDate', startDate);
                $('#end_date').datepicker('setDate', minDate);
            }
            smsCampaignDatatable();
        },
        onSelect: function() {
            $('#period_filter').val('');
        }
    });

    $('#langOpt').change(function(){
        var parent_id = $(this).val();
        smsCampaignDatatable();
    });

    
    $("body").on("change", "#period_filter", function(){
            var periodValue = $(this).val();

            //filter by today
            if(periodValue=='1'){
                var start_date = new Date().toJSON().slice(0,10);
                var end_date = new Date().toJSON().slice(0,10);
                $('#start_date').val(start_date);
                $('#end_date').datepicker('option', 'minDate', start_date);
                $('#end_date').datepicker('setDate', end_date);
                smsCampaignDatatable();
            }

            //filter by yesterday
            else if(periodValue=='2'){
                var start_date =  new Date(Date.now() - 864e5).toJSON().slice(0,10);
                var end_date =  new Date(Date.now() - 864e5).toJSON().slice(0,10);
                $('#start_date').val(start_date);
                $('#end_date').datepicker('option', 'minDate', start_date);
                $('#end_date').datepicker('setDate', end_date);
                smsCampaignDatatable();
            }

            //filter by this month
            else if(periodValue=='3'){
                var start_date = new Date();
                var end_date = new Date().toJSON().slice(0,10);
                start_date = new Date(start_date.setMonth(start_date.getMonth()));
                start_date = new Date(start_date.setDate(1));
                start_date = start_date.toJSON().slice(0,10);
                $('#start_date').val(start_date);
                $('#end_date').datepicker('option', 'minDate', start_date);
                $('#end_date').datepicker('setDate', end_date);
                smsCampaignDatatable();
            }

            //filter by last month
            else if(periodValue=='4'){
                var start_date = new Date();
                var end_date = new Date();
                start_date = new Date(start_date.setDate(1));
                start_date = new Date(start_date.setMonth(start_date.getMonth() - 1));
                start_date = start_date.toJSON().slice(0,10);
                end_date = new Date(end_date.setDate(1)-864e5);
                end_date = end_date.toJSON().slice(0,10);
                $('#start_date').val(start_date);
                $('#end_date').datepicker('option', 'minDate', start_date);
                $('#end_date').datepicker('setDate', end_date);
                smsCampaignDatatable();
            }

            //filter by last 6 month
            else if(periodValue=='5')
            {
                var start_date = new Date();
                var end_date = new Date();
                end_date = new Date(end_date.setDate(1)-864e5);
                end_date = end_date.toJSON().slice(0,10);
                start_date = new Date(start_date.setDate(1));
                start_date = new Date(start_date.setMonth(start_date.getMonth() - 6));
                start_date = start_date.toJSON().slice(0,10);
                $('#start_date').val(start_date);
                $('#end_date').datepicker('option', 'minDate', start_date);
                $('#end_date').datepicker('setDate', end_date);
                smsCampaignDatatable();
            }

            //filter by this year
            else if(periodValue=='6')
            {
                var end_date = new Date().toJSON().slice(0,10);
                var makeDate = new Date(end_date);
                var start_date = new Date(makeDate.setMonth(0));
                start_date = new Date(makeDate.setDate(1));
                start_date = start_date.toJSON().slice(0,10);
                $('#start_date').val(start_date);
                $('#end_date').datepicker('option', 'minDate', start_date);
                $('#end_date').datepicker('setDate', end_date);
                smsCampaignDatatable();
            }

            else if(periodValue=='7'){
                var end_date = new Date();
                var start_date = new Date();
                end_date = new Date(end_date.setMonth(0));
                end_date = new Date(end_date.setDate(1)-864e5).toJSON().slice(0,10);
                start_date = new Date(start_date.setMonth(start_date.getMonth() - 12));
                start_date = new Date(start_date.setMonth(0));
                start_date = new Date(start_date.setDate(1)).toJSON().slice(0,10);
                $('#start_date').val(start_date);
                $('#end_date').datepicker('option', 'minDate', start_date);
                $('#end_date').datepicker('setDate', end_date);
                smsCampaignDatatable();
            }
        });

        $(document).on('click', '.log-modal', function() {
        var logfile_name = $(this).data('info');
        $('.loading').css('display','block');
        $.ajax({
            type: 'post',
            url: 'logfile',
            data: {
                "_token": "{{ csrf_token() }}",
                "logfile": logfile_name
            },
            success: function(data) {
                $('.loading').css('display','none');
                $('#logModal').modal('show');
                $('#logdata').text(data);
            },
            error: function(xhr, status, error) {
            $('.loading').css('display','none');
            // Show an error message to the user
            alert('log file not found.');
            }
        });
    });

    // Download the log file when clicked
    $(document).on('click', '.log-modal-download', function() {
        var logfile_name = $(this).data('info');
        $('.loading').css('display','block');
        $.ajax({
            type: 'post',
            url: 'logfile',
            data: {
                "_token": "{{ csrf_token() }}",
                "logfile": logfile_name
            },
            success: function(data) {
                $('.loading').css('display','none');
                var blob = new Blob([data], { type: 'text/plain' });
                var downloadLink = document.createElement('a');
                downloadLink.href = window.URL.createObjectURL(blob);
                downloadLink.download = logfile_name + '.log';
                document.body.appendChild(downloadLink);
                downloadLink.click();
                document.body.removeChild(downloadLink);
            },
            error: function(xhr, status, error)
            {
                $('.loading').css('display','none');
                alert('log file not found.');
            }
        });
    });


    function smsCampaignDatatable(){
        var start_date = $('#start_date').val();
        var end_date = $('#end_date').val();
        var parent_id = $('#langOpt').val();
        $("#sms_dashboard").DataTable().clear().destroy();
        $('#sms_dashboard').DataTable({
            "autoWidth": false,
            "processing": true,
            "serverSide": true,
            "paging": true,
            "searching": true,
            "scrollX": true,
            "scrollCollapse": true,
            "scrollY":  400,
            "lengthChange": false,
            "pageLength":20,
            "bLengthChange": true,
            "ordering": true,
            "language": {
                search: '',
                searchPlaceholder: "Search..."
            },
            "order": [
                [1, "desc"]
            ],
            "ajax": {
                type: "POST",
                url: 'sms_campaign_dashboard',
                "data": {
                    "_token": "{{ csrf_token() }}",
                    "start_date": start_date,
                    "end_date": end_date,
                    "parent_id": parent_id,
                },
            },
            "columnDefs": [{
                orderable: false,
                targets: 0
            }],
            "columns": [
                {
                    data: null,
                    render: function(data, type, row, meta) {
                    return meta.row + meta.settings._iDisplayStart + 1;
                    }
                },
                {
                    data: 'launch_id',
                    render: function(data, type, row, meta) {
                        return row.launch_id;
                    }
                },
                {
                    data: 'account_id',
                    render: function(data, type, row, meta) {
                        return row.account_id;
                    }
                },
                {
                    data: 'brand_name',
                    render: function(data, type, row, meta) {
                        var start_date = $('#start_date').val();
                        var end_date = $('#end_date').val();
                        url = 'campaigndetails/' + row.account_id + '/' + row.campaign_id + '/' + start_date + '/' + end_date;
                        if (type === 'display') {
                            data = '<a href="' + url + '"  target="_blank">' + (row.brand_name ? row.brand_name : 'NA') + '</a>';
                        }
                        return data;
                    }
                },
                {
                    data: 'industry',
                    render: function(data, type, row, meta) {
                        return row.industry;
                    }
                },
                {
                    data: 'account_category',
                    render: function(data, type, row, meta) {
                        return row.account_category;
                    }
                },
                {
                    data: 'client',
                    render: function(data, type, row, meta) {
                        return row.client;
                    }
                },
                {
                    data: 'username',
                    render: function(data, type, row, meta) {
                        return row.username ? row.username.split(',')[0] : 'NA';
                    }
                },
                {
                    data: 'email',
                    render: function(data, type, row, meta) {
                        return row.username ? row.username.split(',')[1] : 'NA';
                    }
                },
                {
                    data: 'account_type',
                    render: function(data, type, row, meta) {
                        return (row.account_type ? row.account_type : 'NA')
                    }
                },
                {
                    data: 'group_name',
                    render: function(data, type, row, meta) {
                        return (row.group_name ? row.group_name : 'NA')
                    }
                },
                {
                    data: 'sub_group_name',
                    render: function(data, type, row, meta) {
                        return (row.sub_group_name ? row.sub_group_name : 'NA')
                    }
                },
                {
                    data: 'campaign_data',
                    render: function(data, type, row, meta) {
                        return (row.campaign_data ? row.campaign_data : 'NA')
                    }
                },
                {
                    data: 'campaign_url',
                    render: function(data, type, row, meta) {
                        return (row.campaign_url ? row.campaign_url : 'NA')
                    }
                },
                {
                    data: 'gateway',
                    render: function(data, type, row, meta) {
                        return (row.gateway ? row.gateway : 'NA')
                    }
                },
                {
                    data: 'sender_name',
                    render: function(data, type, row, meta) {
                        return (row.sender_name ? row.sender_name : 'NA')
                    }
                },
                {
                    data: 'message_type',
                    render: function(data, type, row, meta) {
                        return (row.message_type ? row.message_type : 'NA')
                    }
                },
                {
                    data: 'datetime',
                    render: function(data, type, row, meta) {
                        return (row.datetime ? row.datetime : 'NA')
                    }
                },
                {
                    data: 'scheduled_status',
                    render: function(data, type, row, meta) {
                        if (data == 'Success') {
                            return ("<p style='color:#28a745'>"+data+"</p>");
                        } 
                        else if(data=='In-Process'){
                            return ("<p style='color:#ff8e01'>"+data+"</p>");
                        }
                        else{
                            return ("<p style='color:#b21111'>"+data+"</p>");
                        }
                    }
                },
                {
                    data: 'pushed_volume',
                    render: function(data, type, row, meta) {
                        return (row.pushed_volume ? row.pushed_volume : '0')
                    }
                },
                {
                    data: 'volume_count',
                    render: function(data, type, row, meta) {
                        return (row.volume_count ? row.volume_count : '0')
                    }
                },
                {
                    data: 'total_message_units',
                    render: function(data, type, row, meta) {
                        return (row.total_message_units ? row.total_message_units : '0')
                    }
                },
                {
                    data: 'invalid_count',
                    render: function(data, type, row, meta) {
                        return (row.invalid_count ? row.invalid_count : '0')
                    }
                },
                {
                    data: 'exclude_count',
                    render: function(data, type, row, meta) {
                        return (row.exclude_count ? row.exclude_count : '0')
                    }
                },
                {
                    data: 'blacklist_count',
                    render: function(data, type, row, meta) {
                        return (row.blacklist_count ? row.blacklist_count : '0')
                    }
                },
                {
                    data: 'duplicate_numbers_count',
                    render: function(data, type, row, meta) {
                        return (row.duplicate_numbers_count ? row.duplicate_numbers_count : '0')
                    }
                },
                {
                    data: 'exclude_no_activity_numbers',
                    render: function(data, type, row, meta) {
                        return (row.exclude_no_activity_numbers ? row.exclude_no_activity_numbers : '0')
                    }
                },
                {
                    data: 'exclude_operator_count',
                    render: function(data, type, row, meta) {
                        return (row.exclude_operator_count ? row.exclude_operator_count : '0')
                    }
                },
                {
                    data:'sent_count',
                    render:function(data,type,row,meta){
                        return (row.sent_count ? row.sent_count : '0')
                    }
                },
                {
                    data:'failed_count',
                    render:function(data,type,row,meta){
                        return (row.failed_count ? row.failed_count : '0')
                    }
                },
                {
                    data:'delivery_count',
                    render:function(data,type,row,meta){
                        return (row.delivery_count ? row.delivery_count : '0')
                    }
                },
                {
                    data:'read_count',
                    render:function(data,type,row,meta){
                        return (row.read_count ? row.read_count : '0')
                    }
                },
                {
                    data: 'clicks',
                    render: function(data, type, row, meta) {
                        return (row.clicks ? row.clicks : '0')
                    }
                },
                {
                    data: 'unique_clicks',
                    render: function(data, type, row, meta) {
                        return (row.unique_clicks ? row.unique_clicks : '0')
                    }
                },
                {
                    data: 'whistle_actions',
                    render: function(data, type, row, meta) {
                        return (row.whistle_actions ? row.whistle_actions : '0')
                    }
                },
                {
                    data: 'total_spends',
                    render: function(data, type, row, meta) {
                        return (row.total_spends ? row.total_spends : '0')
                    }
                },
                {
                    data: 'CTRP',
                    render: function(data, type, row, meta) {
                        return (row.CTRP ? row.CTRP + ' %' : '0.00')
                    }
                },
                {
                    data: 'UCTR',
                    render: function(data, type, row, meta) {
                        return (row.UCTR ? row.UCTR + ' %' : '0.00')
                    }
                },
                {
                    data: 'lead_ratio',
                    render: function(data, type, row, meta) {
                        return (row.lead_ratio ? row.lead_ratio : '0.00')
                    }
                },
                {
                    data: 'CPC',
                    render: function(data, type, row, meta) {
                        return (row.CPC ? row.CPC : '0.00')
                    }
                },
                {
                    data: 'CPUC',
                    render: function(data, type, row, meta) {
                        return (row.CPUC ? row.CPUC : '0.00')
                    }
                },
                {
                    data: 'CPL',
                    render: function(data, type, row, meta) {
                        return (row.CPL ? row.CPL : '0.00')
                    }
                },
                {
                    data: 'CPM',
                    render: function(data, type, row, meta) {
                        return (row.CPM ? row.CPM : '0.00')
                    }
                },
                {
                    data: 'bot_clicks_ratio',
                    render: function(data, type, row, meta) {
                        return (row.bot_clicks_ratio ? row.bot_clicks_ratio : '0.00')
                    }
                },
                {
                    data: 'CTA',
                    render: function(data, type, row, meta) {
                        return (row.CTA ? row.CTA : '0.00')
                    }
                },
                {
                    data: 'UCTA',
                    render: function(data, type, row, meta) {
                        return (row.UCTA ? row.UCTA : '0.00')
                    }
                },
                @if(Gate::allows('hasLogsPermission'))
                {
                    data: 'logfile_name',
                    render: function(data, type, row, meta) {
                        if(row.logfile_name){
                            let data = `<button class='log-modal viewlogbutton' data-toggle='modal' data-info='${row.logfile_name}'><span class='glyphicon glyphicon-edit'></span>View log</button>
                             <button class='log-modal-download' data-info='${row.logfile_name}'><i class='fa fa-download' aria-hidden='true'></i></button>`;
                            return data;
                        }
                        else{
                            let data = `<button class='log-modal' disabled> <span class='glyphicon glyphicon-edit'></span>View log</button>`;
                            return data;
                        }
                    }
                }
                @endif
            ],
            fnRowCallback: function(nRow, aData) {
                return nRow;
            },
            footerCallback: function(footerrow, data, start, end, display) {
                var row = this.api();
                var api = this.api().ajax.json().footer_total;
                const numberFormatter = Intl.NumberFormat('en-IN');
                $(row.column(19).footer()).html(api['message_pushed'] ? numberFormatter.format(Number(api['message_pushed']).toFixed(2)) : 0);
                $(row.column(20).footer()).html(api['message_submitted']? numberFormatter.format(Number(api['message_submitted']).toFixed(2)) : 0);
                $(row.column(21).footer()).html(api['total_message_units'] ? numberFormatter.format(Number(api['total_message_units']).toFixed(2)) : 0);
                $(row.column(22).footer()).html(api['invalid_count'] ? numberFormatter.format(Number(api['invalid_count']).toFixed(2)) : 0);
                $(row.column(23).footer()).html(api['total_exclude_count']? numberFormatter.format(Number(api['total_exclude_count']).toFixed(2)) : 0);
                $(row.column(24).footer()).html(api['blacklist_count'] ? numberFormatter.format(Number(api['blacklist_count']).toFixed(2)) : 0);
                $(row.column(25).footer()).html(api['duplicate_numbers_count'] ? numberFormatter.format(Number(api['duplicate_numbers_count']).toFixed(2)) : 0);
                $(row.column(26).footer()).html(api['exclude_no_activity_numbers'] ? numberFormatter.format(Number(api['exclude_no_activity_numbers']).toFixed(2)) : 0);
                $(row.column(27).footer()).html(api['exclude_operator_count']      ? numberFormatter.format(Number(api['exclude_operator_count']).toFixed(2)) : 0);
                $(row.column(28).footer()).html(api['sent_count']? numberFormatter.format(Number(api['sent_count']).toFixed(2)) : 0);
                $(row.column(39).footer()).html(api['failed_count']? numberFormatter.format(Number(api['failed_count']).toFixed(2)) : 0);
                $(row.column(30).footer()).html(api['delivery_count']? numberFormatter.format(Number(api['delivery_count']).toFixed(2)) : 0);
                $(row.column(31).footer()).html(api['read_count']? numberFormatter.format(Number(api['read_count']).toFixed(2)) : 0);
                $(row.column(32).footer()).html(api['clicks']? numberFormatter.format(Number(api['clicks']).toFixed(2)) : 0);
                $(row.column(33).footer()).html(api['unique_clicks'] ? numberFormatter.format(Number(api['unique_clicks']).toFixed(2)) : 0);
                $(row.column(34).footer()).html(api['whistle_actions']? numberFormatter.format(Number(api['whistle_actions']).toFixed(2)) : 0);
                $(row.column(35).footer()).html(api['total_spends']                ? numberFormatter.format(Number(api['total_spends']).toFixed(2)) : 0);
                $(row.column(36).footer()).html(api['CTRP']? Number(api['CTRP']).toFixed(2) : 0.00);
                $(row.column(37).footer()).html(api['UCTR']? Number(api['UCTR']).toFixed(2) : 0.00);
                $(row.column(38).footer()).html(api['lead_ratio']?Number(api['lead_ratio']).toFixed(2) : 0.00);
                $(row.column(39).footer()).html(api['CPC'] ? Number(api['CPC']).toFixed(2) : 0.00);
                $(row.column(40).footer()).html(api['CPUC'] ? Number(api['CPUC']).toFixed(2) : 0.00);
                $(row.column(41).footer()).html(api['CPL'] ? Number(api['CPL']).toFixed(2) : 0.00);
                $(row.column(42).footer()).html(api['CPM']? Number(api['CPM']).toFixed(2) : 0.00);
                $(row.column(43).footer()).html(api['bot_clicks_ratio']? Number(api['bot_clicks_ratio']).toFixed(2) : 0.00);
                $(row.column(44).footer()).html(api['CTA']? Number(api['CTA']).toFixed(2) : 0.00);
                $(row.column(45).footer()).html(api['UCTA']? Number(api['UCTA']).toFixed(2) : 0.00);
            },
        });
    }

</script>
@endsection