
<style>
    .input-group-addon.complete {
        background-color:#4c0870;
        color: #ffffff;
    }
    .hidden{
        display: none;
    }
</style>
<div class="modal fade stick-up " id="CreateAbsenceSetting" tabindex="-1" role="dialog" aria-hidden="true" style="">

    <div class="modal-dialog modal-md">
        <div class="modal-content">
            <?php echo Forms::ModalLoader('AbsenceDisabled'); ?>
            <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 CommonLanguage::getMessage('add_absence_setting'); ?> </span></h5>
                <div id="AbsenceSettingSuccess" class="hidden"></div>
                <input type='text' id="IsEdit" class="hidden" value=0>
            </div>
            <div class="modal-body">
                <form id="AddAbsenceSettingPostForm" method="POST" onsubmit="return false">
                    <div class="row form-group" >
                        <div class="col-md-12" > 
                            <div class="col-md-4">
                                <label><?php print CommonLanguage::getMessage('absence_reason_name'); ?></label>
                            </div>
                            <div class="col-md-2">
                                <label><?php print CommonLanguage::getMessage('days'); ?></label>
                            </div>
                            <div class="col-md-3">
                                <label><?php print CommonLanguage::getMessage('exceed_days') . ' ?'; ?></label>
                            </div>
<!--                            <div class="col-md-2">
                                <label><?php print CommonLanguage::getMessage('holiday') . ' ?'; ?></label>
                            </div>-->

                        </div>

                    </div>
                    <div class="row" id="AbsenceSetting">
                        <div class="col-md-12 Setting m-b-10"  > 
                            <div class="col-md-4">
                                <input type="text"   class='Absence_Reason_Name form-control' name="Absence_Reason_Name"  required />
                            </div>
                            <div class="col-md-2">
                                <input type="number"  min='0' class='Absence_Reason_Days form-control' name="Absence_Reason_Days"  required />
                            </div>
                            <div class="col-md-3">
                                <input type="checkbox"  class='exceed_days' name="exceed_days"   />
                            </div>
<!--                            <div class="col-md-2">
                                <input type="checkbox"   class='is_holiday' name="is_holiday"   />
                            </div>-->

                            <span class="fa fa-plus-circle" style="color: #4c0870;margin-left: 10px;cursor: pointer;font-size: 16px;"></span><span class="fa fa-minus-circle" style="color: #ed9421;margin-left: 5px;cursor: pointer;font-size: 16px;display:none"></span>
                        </div>
                        <div class="col-md-12 " style="margin-left:10px;margin-top:10px">
                            <div class="col-md-4 pull-right">
                                <button class="btn btn-default" id="CloseAbsence"   > <?php print CommonLanguage::getMessage('Close'); ?> </button>
                                <button class="btn btn-success " id="SubmitAbsence"  > <?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')); ?>,
            Required_Fields = <?php echo json_encode(CommonLanguage::getMessage('Required_Fields')); ?>,
            Failed_Submit = <?php echo json_encode(CommonLanguage::getMessage('Failed_Submit')); ?>;
    $(function () {
        $("#AbsenceSetting").on("click", " .Setting >.fa-plus-circle", function (e) {
            $(".Setting >.fa-minus-circle").css("display", "");
            var Parent = $(this).closest(".Setting"), NewItem = Parent.clone(false).insertAfter(Parent);
            NewItem.find("input").val('');
            NewItem.find("input[type=checkbox]").prop("checked", false);
        })
        $("#AbsenceSetting").on("click", ".Setting >.fa-minus-circle", function (e) {
            $(this).closest(".Setting").empty().remove();
            $("#AbsenceSetting .Setting").each(function () {
                $(".Setting>.fa-minus-circle", $(this).parent()).css({"display": $(".Setting", $(this).parent()).length <= 1 ? "none" : "inline-block"})
            })
        })
        $("#SubmitAbsence").on("click", function () {

            var Data = {
                Absence_Reason: [],
                IsEdit: $("#IsEdit").val()
            }
            $("#AbsenceSetting > .Setting").each(function () {
                var me = $(this);
                if (me.find('.Absence_Reason_Name').val() != '' && me.find('.Absence_Reason_Days').val() != '') {
                    Data.Absence_Reason.push({
                        Absence_Reason_Name: me.find('.Absence_Reason_Name').val(),
                        Absence_Reason_Days: me.find('.Absence_Reason_Days').val(),
                        exceed_days: me.find('input.exceed_days').is(":checked") ? 1 : 0,
                        is_holiday:0// me.find('input.is_holiday').is(":checked") ? 1 : 0,
                    })
                }
                if (($("#IsEdit").val() == 1)) {

                    Data.Absence_Reason_ID = CurrentAbsence_ToDelete
                }
            })
            if (Data.Absence_Reason.length == 0) {
                $("#AbsenceSettingSuccess").attr("class", "alert alert-danger").html(Required_Fields)
                return;
            }
            $("#AbsenceDisabled").removeClass('hidden');
            $.ajax({
                url: "HRMAjax/addAbsenceSetting",
                method: "POST",
                data: Data,
                complete: function (v1, v2) {
                    console.log()
                    if (v2 == "success" && v1.responseText == "success") {
                        $("#AbsenceSettingSuccess").attr("class", "alert alert-success").html(Submitted_Successfully)
                        RebuildDataTable(title, [0], 'HRMAjax/AbsenceSettingRequest', '', '#AbsenceSettingList');
                        $(".Setting:gt(0),#AbsenceSetting  .Setting >.fa-minus-circle").remove()
                        setTimeout(function () {
                            $("#CreateAbsenceSetting").modal('hide'), $("#AbsenceSettingSuccess").addClass("hidden")
                        }, 800);


                    } else {
                        $("#AbsenceSettingSuccess").attr("class", "alert alert-danger").html(Failed_Submit)
                    }
                    $(document.body).animate({scrollTop: 0}, 800)
                    $("#AbsenceDisabled").addClass('hidden');
                }
            })
            $("#IsEdit").val(0)
        })

        $("#CloseAbsence").on("click", function () {
            $("#CreateAbsenceSetting").modal('hide')
            $("#IsEdit").val(0)
            $(".Setting:gt(0),#AbsenceSetting  .Setting >.fa-minus-circle").addClass('hidden')
//            $("#AbsenceSetting  .Setting >.fa-plus-circle").css("display", "none")
        });
    });
</script>