
<style>
    .input-group-addon.complete {
        background-color:#4c0870;
        color: #ffffff;
    }
    .HideStatus,.hide{
        display: none !important;    
    }
    #InputFile{
        /*        margin-left:128px;
                margin-top:10px;*/
        background-color:#4c0870 !important;
        color:#fff;
    }
    #InputFile > input{
        position:absolute;
        left:0px;
        top:0px;
        width:100%;
        height:100%;
        opacity:0.01;
        cursor:pointer;
    }
    /*    .datepicker{z-index:0 !important;}*/
</style>
<div class="modal fade stick-up " id="AssignAcruedLeave" tabindex="-1" role="dialog" aria-hidden="true" >
    <div class="modal-dialog modal-md">
        <?php echo Forms::ModalLoader('AssignAcruedLeaveIsBusy'); ?>
        <div class="modal-content">
            <div class="modal-header clearfix text-left">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="pg-close fs-14"></i></button>
                <h5><span class="semi-bold"> <?php print $title; ?> </span></h5>
            </div>
            <div class="modal-body">
                <div id="AssignAcruedLeaveValidationAlert"></div>
                    <!--                <input type="text" id="LeaveID"/>-->
                <form id="AssignAcruedLeavePostForm" method="POST" onsubmit="return false">
                    <div class="row">
                        <div class="col-md-12 <?php echo $permissions->hasPermission('ApproveLeave') ? '' : 'hidden' ?>" style="margin-left:-8px;margin-bottom:10px;padding:8px">
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label><?php echo CommonLanguage::getMessage('employee') ?></label>
                                    <select name="Employee_ID"  id="Employee_AssignAcruedLeave" class="full-width" data-init-plugin="select2">
                                        <?php foreach ($absence_employees as $employee): ?>
                                            <option value="<?php echo $employee['Employee_ID']; ?>" <?php echo $emp_id <> 0 ? ($employee['Employee_ID'] == $emp_id ? 'selected' : '') :  ($permissions->hasPermission('ApproveLeave') ? '' : ($employee['Employee_ID'] == smc_session()['user_details']['Employee_ID'] ? 'selected' : '')) ?>><?php echo $employee['Employee_Name']; ?></option>
                                        <?php endforeach; ?>
                                    </select>
                                </div>
                            </div>

                        </div>
                        <div class="col-md-12 form-group" style="margin-left:-8px;margin-bottom:10px;">
                            <label><?php echo CommonLanguage::getMessage('Date') ?></label><span class="red-star">*</span>
                            <div class="input-group  col-md-12 " >
                                <input id="From_To_Date" type="text" autocomplete="off" class="form-control" name="From_To_Date" >
                            </div> 
                        </div>
                        <div class="col-md-12 <?php echo $is_holiday ? 'hidden' : ''?>">
                            <div class="checkbox check-success">
                                <input type="checkbox" disabled="disabled" value='1' name="is_half_day"  id="is_half_day">
                                <label for="is_half_day"><?php print CommonLanguage::getMessage('half_day_number'); ?> </label><br/>
                            </div>
                             <div class="checkbox check-success">
                                <input type="checkbox"  value='1' name="trs_dys"  id="trs_dys">
                                <label for="trs_dys"><?php print CommonLanguage::getMessage('delete_trs_dys'); ?> </label><br/>
                            </div>
                        </div>

                        <br>
                        <div class="col-md-12 " style="margin-top:10px">
                            <div class='col-md-2 pull-left'>
                                <button class="btn btn-default" id="InputFile"><i class="fa fa-upload"></i> <?php print CommonLanguage::getMessage('Upload'); ?> <span class='inputcheck fa fa-check hidden'></span> <input type="file" data-target="#CurDocument" onchange="window.NewCurrentFileUploadadd = event.target.files;ValidateForNewFile(this, 'Picture')" name="Document_File_Name" value="Upload"></button>

                            </div>
                            <div class="col-md-6 pull-right">
                                <button class="btn btn-default" id="CloseAssignAcruedLeave"   > <?php print CommonLanguage::getMessage('Close'); ?> </button>
                                <button class="btn btn-success " id="SubmitAssignAcruedLeave"  > <?php print CommonLanguage::getMessage('Save'); ?>   </button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<script>
    var Submitted_Successfully = <?php echo json_encode(CommonLanguage::getMessage('Submitted_Successfully')); ?>,
            Failed_Submit = <?php echo json_encode(CommonLanguage::getMessage('Failed_Submit')); ?>,
            Required_Fields = <?php echo json_encode(CommonLanguage::getMessage('Required_Fields')); ?>;
    var today = <?php echo json_encode($today) ?>;
    $(function () {
        $("input[name=From_To_Date]").daterangepicker({
        }, function (start, end, label) {
            window.startDate = start.format("YYYY-MM-DD"),
                    window.endDate = end.format("YYYY-MM-DD")
        });
        $('#From_To_Date').on('change', function () {
            if (window.startDate == window.endDate) {
                $('#is_half_day').removeAttr('disabled')
            } else {
                $('#is_half_day').attr('disabled', true)
                 $('#is_half_day').attr('checked', false)
            }
        });
        $("#SubmitAssignAcruedLeave").on("click", function (e) {

            if ($("input[name=From_To_Date]").val() == '') {
                $("#AssignAcruedLeaveValidationAlert").attr("class", "alert alert-danger").empty().html(Required_Fields);
                return;
            }
            $("#AssignAcruedLeaveIsBusy").removeClass('hidden');
            var Data = new FormData(document.getElementById("AssignAcruedLeavePostForm"));
            Data.append("Employee_ID", $("#Employee_AssignAcruedLeave").val())
            Data.append("Date_From", (window.startDate ? window.startDate : today))
            Data.append("Date_To", (window.endDate ? window.endDate : today))
            Data.append("is_half_day", ($('#is_half_day').is(':checked') ? 1 : 0))
            Data.append("trs_dys", ($('#trs_dys').is(':checked') ? 1 : 0))
            Data.append("is_holiday", is_holiday)
            Data.append("id", id_to_edit)
            Data.append("is_actual", is_actual)



            $.ajax({
                url: is_edit ? "HRMAjax/edit_leave": "HRMAjax/AssignAcruedLeaveRequest",
                processData: false,
                contentType: false,
                method: "POST",
                dataType: "json",
                data: Data,
                complete: function (v1, v2) {
                    if (v2 == 'success' && v1.responseJSON[0] == 'success') {
//                        RebuildDataTable(title, [0, 1, 2], 'HRMAjax/EmployeeAccruedList');
build_table()
                        $("#AssignAcruedLeaveValidationAlert").attr("class", "alert alert-success").empty().html(Submitted_Successfully);
                        setTimeout(function () {
                            $("#AssignAcruedLeave").modal('hide')
                            $("#AssignAcruedLeaveValidationAlert").addClass('hidden')
                        }, 1000)
                        $('#is_half_day').removeAttr('checked');
                        $('#is_half_day').attr('disabled', true)
                    } else {


                        $("#AssignAcruedLeaveValidationAlert").attr("class", "alert alert-danger").empty().html(v1.responseJSON[1]);
                    }
                    $("#AssignAcruedLeaveIsBusy").addClass('hidden');
                }
            });
        });
        $("#AssignAcruedLeave input").val("");
    })
    $("#CloseAssignAcruedLeave").on("click", function () {
        $("#AssignAcruedLeave input").val("");
        $("#AssignAcruedLeave").modal("hide");
        $("#AssignAcruedLeaveValidationAlert").addClass('hidden');
        $('#is_half_day').removeAttr('checked');
        $('#is_half_day').attr('disabled', true)
    });








    function ValidateForNewFile(input) {
        var IsFileOK = false;
        if (input.files && input.files[0]) {
            var FileName = $.trim(input.files[0].name)
            var FileType = FileName.substring(FileName.lastIndexOf("."));
            if (FileType) {
                FileType = FileType.toLowerCase();
                if (FileType == ".txt" || FileType == ".pptx" || FileType == ".png" || FileType == ".jpg" || FileType == ".jpeg" || FileType == ".gif" || FileType == ".docx" || FileType == ".pdf" || FileType == ".xlsx") {
                    IsFileOK = true;
                }
            }
            $("#CurDocument").hide()
            $("#NewFilewarning2").remove()
            if (IsFileOK == false) {
                $("<span id='NewFilewarning2' style='color:#f00;display: block;text-align: center;'> [File not Supported]</span>").insertAfter($(input))
                $("#InputFile").css("margin-left", "85px")
                $("#CurDocument").css('display', '');
                $("#InputFile").append(" <span class='fa fa-times'></span>")
                $("#InputFile > .fa-check").hide()

                $("#document-modal").append('<div id="ModalIsBusy" style="position:absolute;left:0;right:0;top:0px;height:100%;background:rgba(255,255,255,0.9);z-index:9999;opacity:0"><img class="image-responsive-height demo-mw-50" src="img/demo/progress.svg" alt="Progress" style="position: absolute;left: 50%;top: 50%;margin: -25px 0 0 -25px;" /></div>');
                $("#ModalIsBusy").animate({opacity: 1});
                setTimeout(function () {
                    $("#ModalIsBusy").remove()
                }, 800)

                return false;
            } else {
                var reader = new FileReader();
                reader.onload = function () {
                    $("#CurDocument").css('display', '');
                    $("#InputFile").css("margin-left", "")
                    $("#InputFile > .fa-times").hide()
                    $(".inputcheck").removeClass("hidden")
                    //                    $("#CurDocument").attr('src', e.target.result).show();

                    $("#document-modal").append('<div id="ModalIsBusy" style="position:absolute;left:0;right:0;top:0px;height:100%;background:rgba(255,255,255,0.9);z-index:9999;opacity:0"><img class="image-responsive-height demo-mw-50" src="img/demo/progress.svg" alt="Progress" style="position: absolute;left: 50%;top: 50%;margin: -25px 0 0 -25px;" /></div>');
                    $("#ModalIsBusy").animate({opacity: 1});
                    setTimeout(function () {
                        $("#ModalIsBusy").remove()
                    }, 800)
                }
                reader.readAsDataURL(input.files[0]);
                return true;



            }
        }
        return false;
    }
</script>