<script type="text/javascript">
    $(document).ready(function () {
        list_data();
    });

    $(document).on('click','.btn_edit',function(){
        var id = $(this).attr('id');
        $.each($('#form_'+id+' input[type="checkbox"]'), function(index,value){

            var i = $(this).attr("data-i");
            var o = $(this).attr("data-o");
            if (i == 1) {
                $(this).prop("disabled", false);
            }else if(i == 2 && o != 1){
                $(this).prop("disabled", false);
            }else if(i == 3 && (o != 1 && o != 2)){
                $(this).prop("disabled", false);
            }else if (i == 4 && (o != 1 && o != 2 && o != 3)) {
                $(this).prop("disabled", false);
            }else if (i == 5 && (o != 1 && o != 2 && o != 3)) {
                $(this).prop("disabled", false);
            }
        })
        $("#"+ id).hide();
        $("#btn_save_"+id).show();
        $("#btn_batal_"+id).show();
        $("#"+ id).focus();

        $(document).on('click','#btn_batal_'+id,function(){
            document.getElementById("btn_save_"+id).disabled = true;
            document.getElementById("btn_batal_"+id).disabled = true;
            list_data();
            $("#"+ id).focus();
        });

        $("#form_"+id).on('submit', (function(e) {
            e.preventDefault();

            var loading = Ladda.create(document.getElementById("btn_save_"+id));

            loading.start();

            $.ajax({
                url: "<?= route('pengaturan.reimbursement.save') ?>",
                type: "POST",
                data: new FormData(this),
                contentType: false,
                cache: false,
                dataType: 'json',
                processData: false,
                success: function(result) {
                    if(result.success == true){
                        if (result.type == 'update') {
                            loading.stop();
                            $('#message_'+id).show();
                            $('#message_'+id).html(result.message);
                            list_data();
                            $("#"+ id).focus();
                        } else {
                            loading.stop();
                            $('#message_'+id).show();
                            $('#message_'+id).html(result.message);
                            list_data();
                            $("#"+ id).focus();
                        }
                    }else{
                        loading.stop();
                        $('#message_'+id).show();
                        $('#message_'+id).html(result.message);
                    }                  
                },
                error: function() {
                    loading.stop();
                    $('#message_'+id).show();
                    $('#message_'+id).html('<font color="#eb3a28"><i class="fa fa-close(alias)">&nbsp;</i><strong>Gagal : Terjadi Kesalahan</strong></font>');
                }
            });
        }));
    });

    function list_data() {
        $('#view_data').load("<?= route('pengaturan.reimbursement.data') ?>");
    }
</script>
<div class="content-header">
    <div class="row align-items-center">
        <div class="content-header-left col-md-6 col-12 mb-md-0 mb-1">
            <h3 class="content-header-title"><?= $judul ?></h3>
            <div class="row breadcrumbs-top">
                <div class="breadcrumb-wrapper col-12">
                    <ol class="breadcrumb">
                        </li>
                        <li class="breadcrumb-item"><a href="#">Pengaturan</a>
                        </li>
                        <li class="breadcrumb-item active"><?= $judul ?>
                        </li>
                    </ol>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="card card-rounded">
    <div class="card-content">
        <div class="card-body">
            <div class="row">
                <div id="view_data" class="col-md-12 bbna"></div>
            </div>
        </div>
    </div>
</div>




