<main id="main" class="main">

    <div class="pagetitle">
        <h1><i class="bi bi-box-seam"></i>&nbsp;SPB</h1>
        <nav>
            <ol class="breadcrumb">

            </ol>
        </nav>
    </div><!-- End Page Title -->
    <section class="section">
        <div class="row">
            <div class="col-lg-12">
                <div class="card">
                    <div class="card-body">
                        <br>
                        <!-- Table with stripped rows -->
                        <div class="datatable-wrapper datatable-loading no-footer sortable searchable fixed-columns">
                            <div class="row g-3">
                                <div class="col-md-2">
                                    <input type="date" class="form-control" id="mulai" value="<?= date('Y-m-01'); ?>">
                                </div>
                                <div class="col-md-2">
                                    <input type="date" class="form-control" id="hingga" value="<?= date('Y-m-d'); ?>" onchange="get_so(this.value)">
                                </div>
                                <div class="col-md-4">
                                    <select id="no_so" name="no_so[]" multiple="multiple" class="form-control">
                                    </select>
                                </div>
                                <div class="col-md-4">
                                    <button onclick="tampildatakirim()" type="button" class="btn btn-primary">
                                        <i class="bi bi-search"></i>&nbsp;Lihat
                                    </button>
                                    <button type="button" class="btn btn-danger" onclick="cetakspb()">
                                        <i class="bi bi-printer"></i>&nbsp;Cetak
                                    </button>
                                    <button type="button" data-bs-toggle="modal" data-bs-target="#f_add_upload" onclick="add_kirim()" class="btn btn-warning">
                                        <i class="bi bi-cloud-upload"></i>&nbsp;Upload
                                    </button>
                                </div>

                            </div>
                            <br>
                            <div class="datatable-container">
                                <div id="tbretur"></div>
                            </div>
                        </div>
                        <!-- End Table with stripped rows -->
                    </div>
                </div>
            </div>
        </div>
    </section>
</main>

<div class="modal fade" id="f_add_upload" tabindex="-1" aria-hidden="true" style="display: none;">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Upload SPB</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form id="f_upload" name="f_upload" method="" action="" enctype="multipart/form-data">
                <div class="modal-body">
                    <div class="row mb-6">
                        <div class="col-sm-10">
                            <input type="file" id="file_xls" name="file_xls" class="form-control" accept=".xlsx">
                        </div>
                        <div class="col-sm-2">
                            <div class="btn-group" role="group" aria-label="Basic outlined example">
                                <button type="button" onclick="preview_doc()" class="btn btn-outline-primary">Preview</button>
                                <button type="button" onclick="upload_doc()" class="btn btn-outline-primary">Upload</button>
                            </div>
                        </div>
                        <div class="col-sm-12">
                            <div id="tbl_preiew"></div>
                        </div>
                    </div>

                </div>

            </form>
        </div>
    </div>
</div>


<div class="modal fade" id="f_add_qty" tabindex="-1" aria-hidden="true" style="display: none;">
    <div class="modal-dialog modal-sm modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Qty SPB</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <div class="row mb-6">
                    <input type="hidden" id="id_spb">
                    <input type="hidden" id="qty_order">
                    <div class="col-sm-12">
                        <input type="number" id="qty_spb" name="qty_spb" class="form-control">
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Batal</button>
                <button type="button" class="btn btn-primary" onclick="simpan_qty()">Simpan</button>
            </div>
        </div>
    </div>
</div>

<script src="<?= base_url('assets/js') ?>/jquery-3.6.0.min.js"></script>

<script>
    function add_qty(id, qty) {
        $("#id_spb").val(id);
        $("#qty_order").val(qty);
    }

    function tampildatakirim() {
        var mulai = $("#mulai").val();
        var hingga = $("#hingga").val();
        var no_so = $("#no_so").val();
        $.get("<?= base_url('Logistik/tb_spb?s='); ?>" + mulai + "&e=" + hingga + "&noso=" + no_so, function(data, status) {
            $("#tbretur").html(data);
        });
    }


    function pesan(txt, jenis) {
        const Toast = Swal.mixin({
            toast: true,
            position: "top-end",
            showConfirmButton: false,
            timer: 2000,
            timerProgressBar: false,
            didOpen: (toast) => {
                toast.onmouseenter = Swal.stopTimer;
                toast.onmouseleave = Swal.resumeTimer;
            }
        });
        Toast.fire({
            icon: jenis,
            title: txt
        });
    }

    /*
    $(document).ready(function() {
        $('form[name="f_upload"]').on('submit', function(event) {
            event.preventDefault();
            var formData = new FormData(this);
            $.ajax({
                url: '<?= base_url('Logistik/preview_spb'); ?>',
                type: 'POST',
                data: formData,
                processData: false,
                contentType: false,
                success: function(response) {
                    $("#tbl_preiew").html(response);
                    //$('#f_add_upload').modal('hide');
                                  
                    //log
                    var kd_brg = $("#kd_brg").val();
                    var strTable = 'lpbj_d';
                    var keterangan = 'Telah menambahkan detail lpbj <?= $nmrlpbj; ?> dengan kode barang ' + kd_brg;
                    $.ajax({
                        url: "<?= base_url('Pengaturan/log'); ?>",
                        type: 'POST',
                        cache: false,
                        data: {
                            strTable: strTable,
                            keterangan: keterangan
                        },
                        success: function() {}
                    });
                    
                },
                error: function(xhr, status, error) {
                    alert('Terjadi kesalahan: ' + error);
                }
            });
        });
    });
*/

    function preview_doc() {
        var formData = new FormData();
        var fileInput = $('#file_xls')[0];
        if (fileInput.files.length === 0) {
            pesan("Silakan pilih file terlebih dahulu.", "info");
            return;
        }
        formData.append('file_xls', fileInput.files[0]);
        $.ajax({
            url: '<?= base_url('Logistik/preview_spb'); ?>',
            type: 'POST',
            data: formData,
            contentType: false,
            processData: false,
            success: function(response) {
                $("#tbl_preiew").html(response);
            },
            error: function(xhr, status, error) {
                $('#response').html("Terjadi kesalahan: " + error);
                //pesan("Terjadi kesalahan: " + error, "error");
            }
        });
    }

    function upload_doc() {
        var formData = new FormData();
        var fileInput = $('#file_xls')[0];
        if (fileInput.files.length === 0) {
            pesan("Tidak ada file untuk upload.", "info");
            return;
        }
        formData.append('file_xls', fileInput.files[0]);
        $.ajax({
            url: '<?= base_url('Logistik/upload_spb'); ?>',
            type: 'POST',
            data: formData,
            contentType: false,
            processData: false,
            success: function(response) {
                pesan("Upload sukses", "success");
                document.getElementById('file_xls').value = "";
                $("#tbl_preiew").html('');
                $('#f_add_upload').modal('hide');
            },
            error: function(xhr, status, error) {
                $('#response').html("Terjadi kesalahan: " + error);
            }
        });
    }



    function simpan_qty() {
        var id_spb = $("#id_spb").val();
        var qty_order = $("#qty_order").val();
        var qty_spb = $("#qty_spb").val();
        if (qty_spb == '') {
            pesan("Qty mohon diisi", 'error');
        } else {
            if (parseInt(qty_spb) > parseInt(qty_order)) {
                pesan("Qty SPB tidak sesuai dengan Qty Order", "error");
            } else {
                $.ajax({
                    url: "<?= base_url('Logistik/simpan_spb'); ?>",
                    type: 'POST',
                    cache: false,
                    data: {
                        id_spb: id_spb,
                        qty_spb: qty_spb
                    },
                    success: function() {
                        $('#f_add_qty').modal('hide');
                        tampildatakirim();
                        //log                    
                        var strTable = 'tb_spb';
                        var keterangan = 'Telah menambahkan Qty SPB sebanyak' + qty_spb + ' dengan Id_spb : ' + id_spb;
                        $.ajax({
                            url: "<?= base_url('Pengaturan/log'); ?>",
                            type: 'POST',
                            cache: false,
                            data: {
                                strTable: strTable,
                                keterangan: keterangan
                            },
                            success: function() {}
                        });
                    },
                    error: function(xhr, status, error) {
                        //$('#response').html("Terjadi kesalahan: " + error);
                        pesan("Terjadi kesalahan: " + error, "error");
                    }
                });
            }
        }
    }

    function get_so(tglhingga) {
        var tglmulai = $("#mulai").val();
        $.get("<?= base_url('Logistik/get_so?s='); ?>" + tglmulai + "&e=" + tglhingga, function(data, status) {
            $("#no_so").html(data);
        });
    }

    function cetakspb() {
        var mulai = $("#mulai").val();
        var hingga = $("#hingga").val();
        var no_so = $("#no_so").val();
        window.open("<?= base_url('Logistik/cetak_spb?s='); ?>" + mulai + "&e=" + hingga + "&noso=" + no_so, "_blank");
    }
</script>

<script>
    document.addEventListener('DOMContentLoaded', function() {
        var searchInput = document.getElementById('qty_spb');

        searchInput.addEventListener('keyup', function(event) {
            if (event.keyCode === 13) { // 13 adalah kode key untuk Enter
                simpan_qty();
            }
        });

        $(document).ready(function() {
            $('#no_so').select2();
        });
    });
</script>