@include('header')
<div class="container-fluid flex-grow-1 container-p-y">
    <h4 class="font-weight-bold py-3 mb-0">OT Scheduled Request</h4>
    <div class="card mb-4">
        <div class="card-body">
            <form id="ot-request-filter-form" method="post" onsubmit="return false;">
                <div class="form-row align-items-end">
                    <div class="form-group col-md-2">
                        <label class="form-label" for="ScheduleDate">Schedule Date</label>
                        <input type="date" name="ScheduleDate" id="ScheduleDate" class="form-control" value="">
                    </div>
                    <div class="form-group col-md-2">
                        <button type="button" class="btn btn-primary" id="filterOtRequest">Search</button>
                        <button type="button" class="btn btn-secondary ml-1" id="clearOtRequest">Show All</button>
                    </div>
                </div>
            </form>
            <div class="table-responsive mt-3" id="otRequestResult"></div>
        </div>
    </div>
</div>
@include('footerscript')
@include('excelscript')
<script type="text/javascript">
function initOtScheduledRequestDataTable() {
    if (!$.fn.DataTable) {
        return;
    }
    if ($.fn.DataTable.isDataTable('#otScheduledRequestTable')) {
        $('#otScheduledRequestTable').DataTable().destroy();
    }
    if (!$('#otScheduledRequestTable').length) {
        return;
    }
    $('#otScheduledRequestTable').DataTable({
        responsive: false,
        scrollX: true,
        autoWidth: false,
        dom: 'Bfrtip',
        pageLength: 50,
        order: [[5, 'desc'], [6, 'asc'], [2, 'desc']],
        buttons: [{
            extend: 'excelHtml5',
            title: 'OT Scheduled Request',
            text: 'Export to Excel',
            exportOptions: {
                columns: ':not(:last-child)'
            }
        }]
    });
}

function loadOtScheduledRequestList(scheduleDate) {
    $.ajax({
        url: "{{ url('viewOtScheduledRequestList') }}",
        method: "POST",
        data: {
            _token: '{{ csrf_token() }}',
            ScheduleDate: scheduleDate || ''
        },
        success: function(html) {
            $('#otRequestResult').html(html);
            initOtScheduledRequestDataTable();
        }
    });
}

$(document).ready(function() {
    loadOtScheduledRequestList('');
    $('#filterOtRequest').on('click', function() {
        loadOtScheduledRequestList($('#ScheduleDate').val());
    });
    $('#clearOtRequest').on('click', function() {
        $('#ScheduleDate').val('');
        loadOtScheduledRequestList('');
    });
});

function openNewWindow(val, height, width, left, top, right, bottom) {
    var targetUrl = '/{{ projectUrl() }}' + val;
    var features = 'height=' + height + ',width=' + width + ',left=' + left + ',top=' + top + ',right=' +
        right + ',bottom=' + bottom +
        ',resizable=yes,scrollbars=yes,toolbar=no,menubar=no,location=no,directories=no,status=no';
    var win = window.open(targetUrl, 'OtScheduledReview', features);
    if (!win) {
        window.location.href = targetUrl;
    }
}

function openOtRequestReview(id, roll) {
    if (!id) {
        return;
    }
    var url = 'OtScheduled?ot_scheduled_id=' + encodeURIComponent(id) + '&roll=' + encodeURIComponent(roll || 1) + '&review=1';
    openNewWindow(url, '600', '1300', '20', '40', '20', '40');
}
</script>