$(document).ready(function () {

    var intervaltime = $('#intervaltime').val();
    //LoadData();
    var table = $('#tbl_1').DataTable({
        "ajax": {
            method: 'POST',
            url: '/Home/GetDataPrevious',
            contentType: "application/json; charset=utf-8",
            dataSrc: ''
        },
        "columnDefs": [
            { className: "Title", "targets": [0] }
        ],
        "columns": [
            { "data": "timeZone"}
        ],
        "filter": true,
        "paging": false,
        "info": false,
        "searching": false,
        "ordering": true,

        "createdRow": function (row, data, index) {
            var tr = $(row).closest('tr');
            var thisrow = table.row(tr);
            let list = data.dashboarddetails;
            let html = '<table class="display">';
            html += '<thead>';
            html += '<tr>';
            html += '<th style="background-color: #009879;color: #ffffff;">Branch</th>';
            html += '<th style="background-color: #009879;color: #ffffff;">Total No of Orders</th>';
            html += '<th style="background-color: #009879;color: #ffffff;"># In Kitchen (Ordered)</th>';
            html += '<th style="background-color: #009879;color: #ffffff;"># with Kitchen Delay</th>';
            html += '<th style="background-color: #009879;color: #ffffff;"># Kitchen Ready</th>';
            html += '<th style="background-color: #009879;color: #ffffff;"># with window time</th>';
            html += '<th style="background-color: #009879;color: #ffffff;"># Driver Assigned</th>';
            html += '<th style="background-color: #009879;color: #ffffff;"># Delivered</th>';
            html += '<th style="background-color: #009879;color: #ffffff;">Expected Delivery Time</th>';
            html += '<th style="background-color: #009879;color: #ffffff;"># with Delivery Delay</th>';
            html += '<th style="background-color: #009879;color: #ffffff;">Dispatcher Notifications (Updated from Dispatcher Screen)</th>';

            html += '</tr>';
            html += '</thead>';
            html += '<tbody>';
            for (let i = 0; i < list.length; i++){
                html += '<tr>';
                html += '<td>';
                html += list[i].branch;
                html += '</td>';
                html += '<td>';
                html += list[i].totalOrders;
                html += '</td>';
                html += '<td>';
                html += list[i].ordersInKitchen;
                html += '</td>';
                html += '<td>';
                html += list[i].ordersKitchenDelay;
                html += '</td>';
                html += '<td>';
                html += list[i].ordersKitchenReady;
                html += '</td>';
                html += '<td>';
                html += list[i].ordersWaitingDelay;
                html += '</td>';
                html += '<td>';
                html += list[i].ordersAssigned;
                html += '</td>';
                html += '<td>';
                html += list[i].ordersDelivered;
                html += '</td>';
                html += '<td>';
                html += list[i].expectedDeliveryTime;
                html += '</td>';
                html += '<td>';
                html += list[i].ordersDeliveryDelay;
                html += '</td>';
                html += '<td>';
                html += list[i].memo;
                html += '</td>';
                html += '</tr>';
            }
            html += '</tbody>';
            html += '</table>';

            thisrow.child(html).show();
            tr.addClass('shown');
        }
    });


    var intervalsec = intervaltime * 1000;

    setInterval(function () { table.ajax.reload(); }, intervalsec);
});