Default page

Viewing : parse.php

<style type="text/css">
    .dtfc-fixed-left {
        background-color: white !important; /* Atau warna latar belakang tabel Anda */
    }
</style>
<div class="d-non">
    <input type="text" id="csrf_token_name_input" value="<?= csrf_token() ?>">
    <input type="text" id="csrf_token_hash_input" value="<?= csrf_hash() ?>">
    <input type="text" id="berubah" value="Changeme">
</div>
<div class="page-content">
    <!-- start page title -->
    <div class="row">
        <div class="col-12">
            <div class="page-title-box d-flex align-items-center justify-content-between">
                <h4 class="page-title mb-0 font-size-18"><?= $title ?></h4>

                <div class="page-title-right">
                    <ol class="breadcrumb m-0">
                        <li class="breadcrumb-item"><a href="javascript: void(0);"><?= $li_1 ?></a></li>
                        <?php if(isset($li_2)):  ?>
                            <li class="breadcrumb-item active"><?= $li_2 ?></li>
                        <?php endif ?>
                    </ol>
                </div>

            </div>
        </div>
    </div>
    <!-- end page title -->
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <a onclick="run()" class="btn btn-sm btn-primary float-end">Run</a>
                </div>
                <div class="card-body">
                    <table id="datatable-buttons"
                        class="table table-striped table-bordered"
                        style="border-collapse: collapse; border-spacing: 0; width: 100%;">
                        <thead>
                            <tr>
                                <th>Parsing</th>
                                <th>Awal</th>
                                <th>Akhir</th>
                                <th>Jumlah</th>
                                <th>Status Input</th>
                            </tr>
                        </thead>
                        <tbody>
                            
                            <?php 
                                $no =1;
                                for ($i=0; $i < count($d); $i++) {
                            ?>
                            <tr>
                                <td>Parse ke-<?=$no++?></td>
                                <td><?=$d[$i]['awal']?></td>
                                <td><?=$d[$i]['akhir']?></td>
                                <td><?=$d[$i]['jumlah']?></td>
                                <td id="row<?=$i?>"></td>
                            </tr>
                            <div class="d-none">
                                <input type="text" id="awal<?=$i?>" value="<?=$d[$i]['awal']?>">
                                <input type="text" id="akhir<?=$i?>" value="<?=$d[$i]['akhir']?>">
                                <input type="text" id="jumlah<?=$i?>" value="<?=$d[$i]['jumlah']?>">
                                <input type="text" id="op<?=$i?>" value="<?=$d[$i]['op']?>">
                                
                            </div>

                            <?php } ?>
                            
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <!-- end col -->
    </div>
    <!-- end row -->
</div>

<div class="modal fade bs-example-modal-lg" tabindex="-1" aria-labelledby="myLargeModalLabel" style="display: none;" aria-hidden="true" id="add">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-body" align="center">
                <div class="spinner-container">
                    <div class="spinner-border text-primary" role="status">
                      <span class="visually-hidden">Loading...</span>
                    </div>
                    <p class="mt-3">Sedang memproses data Anda...</p>
                  </div>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>

<script type="text/javascript">
$(document).ready(function() {
    //Buttons examples
    var table = $('#datatable-buttons').DataTable({
        scrollX: true,
        fixedColumns: {
            leftColumns: 2 // Contoh: membekukan 1 kolom dari kiri
            // rightColumns: 1 // Contoh: membekukan 1 kolom dari kanan (opsional)
        },
        lengthChange: false,
        dom: 'Blfrtip', // 'B' untuk Buttons, dan sisa elemen default     
        buttons: ['copy', 'excel', 'pdf'],
        paging:   false, // Menonaktifkan paging
        scrollY:  "60vh", // Mengatur tinggi area data tabel (sesuaikan nilai pixelnya)
        scrollCollapse: true // Opsional: mengecilkan tinggi container saat data tidak cukup mengisi
    });

    table.buttons().container()
        .appendTo('#datatable-buttons_wrapper .col-md-6:eq(0)');
    $("#datatable_length select").addClass('form-select form-select-sm');
} );

function run(){
    var dt = JSON.parse('<?=json_encode($d)?>');
    var i = 0;
    var interval = setInterval(function(){
        if (i < dt.length) {
            $('#add').modal('show');
            input(dt[i]['awal'], dt[i]['akhir'], dt[i]['jumlah'], i);
            i++;
        } else {
            clearInterval(interval); // Menghentikan interval setelah mencapai akhir array
            $('#add').modal('hide');
            complete();
        }
    }, 1000);
}

function complete(){
    Swal.fire({
        title: 'Selesai',
        text: 'Selesai Mensingkron Data',
        type: 'success',
        confirmButtonColor: '#3b5de7',
    })
}

function input(awal, akhir, jumlah, row){
    $('#berubah').val("hoh");
    const csrfTokenName = $('#csrf_token_name_input').val();
    let csrfTokenHash = $('#csrf_token_hash_input').val(); // Ini yang akan di-update
    $.ajax({
        type: 'POST',
        url: "<?=base_url('db/input')?>",
        dataType : 'JSON',
        data : {
            awal : awal,
            akhir : akhir,
            jumlah : jumlah,
            file : '<?=$file?>',
            [csrfTokenName] : csrfTokenHash
        },
        success: function(r) {
            $('#row' + row).html('OK');
            if (r.csrf_token_hash) {
                csrfTokenHash = r.csrf_token_hash;
                document.getElementById('csrf_token_hash_input').value=csrfTokenHash;
            }
        },
        error: function(xhr, status, error) {
            
        }
    });
}
</script>