@extends('layouts.admin')

@section('title', "$title ·")

@section('breadcrumb')
    <div class="container-fluid">
        <div class="row mb-2">
            <div class="col-sm-6">
                <h1>{{ $title }}</h1>
            </div>
            <div class="col-sm-6">
                <ol class="breadcrumb float-sm-right">
                    <li class="breadcrumb-item">
                        <a href="{{ route('admin.dashboard') }}">Home</a>
                    </li>
                    <li class="breadcrumb-item active">{{ $title }}</li>
                </ol>
            </div>
        </div>
    </div>
@endsection

@section('content')
    <div class="container-fluid">
        <div class="row">
            <div class="col-12">
                <div class="card shadow">
                    <div class="card-header">
                        <div class="d-flex flex-row justify-content-between">
                            <div class="p-2">
                                <h4 class="card-title mt-2">Data Stock Belahan</h4>
                            </div>
                            <div class="ml-auto p-2">
                                <label for="input-code" class="col-form-label text-dark">No Hitung</label>
                            </div>
                            <div class="mr-auto p-2">
                                <div class="form-group form-input">
                                    <input value="{{ $code }}" type="text" name="code" class="form-control" id="input-code" readonly>
                                    <div class="invalid-feedback"></div>
                                </div>
                            </div>
                            <div class="p-2">
                                <div class="mt-2 mt-md-2">
                                    Tanggal : {{ date('d F Y') }}
                                </div>
                            </div>
                    </div>
                    </div>
                    <div class="card-body">
                        @include('app.stock.splitcount.add')
                    </div>
                </div>
            </div>
            <div class="col-12">
                <div class="card shadow">
                    <div class="card-header">
                        <div class="d-flex flex-column flex-md-row align-items-center justify-content-between">
                            <h4 class="card-title">List Stok Belahan</h4>
                        </div>
                    </div>
                    <div class="card-body">
                        <table class="table table-hover" width="100%" cellspacing="0">
                            <thead>
                                <tr>
                                    <th>No</th>
                                    <th>kategori/Jenis</th>
                                    <th>Barcode</th>
                                    <th>Nama Barang</th>
                                    <th>Total Berat Stock (Gr)</th>
                                    <th>Harga Beli per Gr (Rp)</th>
                                    <th>Nilai Stock Akhir (Rp)</th>
                                    <th>Aksi</th>
                                </tr>
                            </thead>
                            <tbody id="dataTable-Item">
                                <tr align="center">
                                    <td colspan="8">Data Not Found</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="card-footer">
                        <div class="row">
                        <div class="col-md-6">
                            <input type="hidden" id="input-stock_type_id" name="stock_type_id" value="{{ config('stock.split') }}">
                            <button type="button" class="btn btn-outline-danger btn-reset">
                                <span class="spinner-grow spinner-grow-sm d-none btn-spinner" id="status" role="status" aria-hidden="true"></span>
                                <span class="btn-text">Reset</span>
                            </button>
                        </div>
                        <div class="col-md-6 float-right">
                            <input type="hidden" id="input-stock_type_id" name="stock_type_id" value="{{ config('stock.split') }}">
                            <button type="button" class="btn btn-primary btn-submit btn-save w-75 float-right">
                                <span class="spinner-grow spinner-grow-sm d-none btn-spinner" id="status" role="status" aria-hidden="true"></span>
                                <span class="btn-text">Simpan</span>
                            </button>
                        </div>
                    </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@stop

@push('js')
    <script>
        function getData(_data = null) {
            let data = _data.data;
            let print = $('#is_print').val();

            // if (print == '1') {
            //     var a = document.createElement('a');
            //     a.href = `/stocks/mutation/invoice/${data.id}`;
            //     a.setAttribute('target', '_blank');
            //     a.click();
            // }

            return true;
        }

        function getMixer() {
            $('#input-mixer_id').select2({
                ajax: {
                    delay: 450,
                    headers: {
                        'Authorization': `Bearer ${$('meta[name="bearer-token"]').attr('content')}`
                    },
                    url: '{{ route('mixers.index') }}',
                    dataType: 'json',
                    data: function(params) {
                        var query = {
                            q: params.term,
                        }

                        return query;
                    },
                    processResults: function(data) {
                        return {
                            results: data.data.map(function(item) {
                                return {
                                    id: item.id,
                                    text: `${item.code} - ${item.name}`,
                                    name: item.name,
                                    code: item.code,
                                }
                            })
                        }
                    }
                }
            });
        }

        function getItem() {
            let dataSem = JSON.parse(localStorage.getItem("tbl_sem_hitung_stock")) || [];
            $('#input-item_id').select2({
                ajax: {
                    delay: 250,
                    headers: {
                        'Authorization': `Bearer ${$('meta[name="bearer-token"]').attr('content')}`
                    },
                    url: '{{ route('items.index') }}',
                    dataType: 'json',
                    data: function(params) {
                        var query = {
                            q: params.term,
                        }

                        return query;
                    },
                    processResults: function(data) {
                        let dataItem = [];
                        return {
                            results: data.data.map(function(item) {
                                if (item.stock.split > 0) {
                                    let indexData = dataSem.findIndex((index) => {
                                        return index.item_code === item.code;
                                    });
                                    if (indexData === -1) {
                                        return {
                                            id: item.id,
                                            text: `${item.code} - ${item.name}`,
                                            name: item.name,
                                            code: item.code,
                                            brand: item.item_brand.name,
                                            size: `${item.item_size.size} ${item.item_size.unit}`,
                                            color: item.item_color.name,
                                            shelving: `${item.shelving.rack.name}/${item.shelving.name}`,
                                            type: `${item.item_type.name}/${item.item_type.item_category.name}`,
                                            price: item.price_buy,
                                            stock_split: item.stock.split,
                                            stock_display: item.stock.display,
                                            stock_real: item.stock.real,
                                        }
                                    } else {
                                        return {}
                                    }
                                } else {
                                    dataItem.push({
                                        id: item.id,
                                        stock_display: parseFloat(item.price_buy * item.stock.display).toFixed(0),
                                        stock_real: parseFloat(item.price_buy * item.stock.real).toFixed(0),
                                    })
                                    localStorage.setItem("tbl_sem_stock_non_belahan", JSON.stringify(dataItem));

                                    return {}
                                }
                            })
                        }
                    }
                },
                templateSelection: function(container) {
                    $(container.element).attr('data-name', container.name);
                    $(container.element).attr('data-code', container.code);
                    $(container.element).attr('data-brand', container.brand);
                    $(container.element).attr('data-size', container.size);
                    $(container.element).attr('data-color', container.color);
                    $(container.element).attr('data-price', container.price);
                    $(container.element).attr('data-type', container.type);
                    $(container.element).attr('data-shelving', container.shelving);
                    $(container.element).attr('data-stock_split', container.stock_split);
                    $(container.element).attr('data-stock_display', container.stock_display);
                    $(container.element).attr('data-stock_real', container.stock_real);

                    return container.text;
                }
            });
        }

        function getDataSementara() {
            let html = ``;
            let data_sem = JSON.parse(localStorage.getItem("tbl_sem_hitung_stock"));
            if (data_sem !== null){
                let no = 1;
                data_sem.forEach(element => {
                    html += `
                        <tr>
                            <td>`+ no +`</td>
                            <td>`+ element.item_type +`</td>
                            <td>`+ element.item_code +`</td>
                            <td>`+ element.item_name +`</td>
                            <td>`+ element.tot_berat_stock +`</td>
                            <td>`+ element.hrg_beli_per_gr +`</td>
                            <td>`+ element.stock_akhir +`</td>
                            <td><button class="btn btn-danger shadow-sm btn-custom-1 delete" onclick="funDeleteSementara('`+ element.item_code +`')" title="Hapus"><i class="far fa-trash-alt fa-sm"></i></button></td>
                        </tr>
                    `;
                    no++;
                });
            }

            $('#dataTable-Item').html(``);
            $('#dataTable-Item').append(html);
            getItem();
        }
        
        function funDeleteSementara(code) {
            let dataPost = [];
            let dataSem = JSON.parse(localStorage.getItem("tbl_sem_hitung_stock"));
            dataSem.forEach(element => {
                if (element.item_code !== code) {
                    dataPost.push({
                        item_id: element.item_id,
                        item_code: element.item_code,
                        item_name: element.item_name,
                        item_type: element.item_type,
                        jml_stock_utuh: element.jml_stock_utuh,
                        berat_perkaleng: element.berat_perkaleng,
                        tot_berat_stock_utuh: element.tot_berat_stock_utuh,
                        tot_berat_stock_sisa: element.tot_berat_stock_sisa,
                        tot_berat_stock: element.tot_berat_stock,
                        hrg_beli_per_gr: element.hrg_beli_per_gr,
                        stock_akhir: element.stock_akhir,
                        stock_display: element.stock_display,
                        stock_real: element.stock_real
                    });
                }
            });
            localStorage.setItem("tbl_sem_hitung_stock", JSON.stringify(dataPost));
            getDataSementara();
        }

        $(document).ready(() => {
            $('.custom-loading').fadeIn();
            $.when(getItem(), getMixer(), getDataSementara()).done(() => {
                setTimeout(() => {
                    $('.custom-loading').fadeOut();
                }, 1500);
            });

            $('#input-item_id').on('change', function() {
                let selected = $(this).find(':selected');
                $('#input-item_code').val(selected.attr('data-code'));
                $('#input-item_name').val(selected.attr('data-name'));
                $('#input-item_brand').val(selected.attr('data-brand'));
                $('#input-item_size').val(selected.attr('data-size'));
                $('#input-item_color').val(selected.attr('data-color'));
                $('#input-item_type').val(selected.attr('data-type'));
                $('#input-price').val(selected.attr('data-price'));
                $('#input-shelving').val(selected.attr('data-shelving'));

                $('#input-hargabeli_utuh').val(selected.attr('data-price'));
                $('#input-stock_split').val(selected.attr('data-stock_split'));
                $('#input-stock_display').val(selected.attr('data-stock_display'));
                $('#input-stock_real').val(selected.attr('data-stock_real'));
            });

            $('#input-berat_kaleng').on('keyup', function() {
                var beratkaleng = $(this).val() || 0;
                var qtystockutuh = $('#input-jumlah_su').val() || 0;
                var hargabeli = $('#input-hargabeli_utuh').val() || 0;

                var hasil = parseFloat(beratkaleng * qtystockutuh).toFixed(3);
                if (!isNaN(hasil)){
                    $('#input-totalberat_su').val(hasil);
                } else {
                    $('#input-totalberat_su').val('0.000');
                }

                var rata_harga_beli = parseFloat(hargabeli / beratkaleng).toFixed(0);
                if (!isNaN(rata_harga_beli)){
                    $('#input-hargabeli').val(rata_harga_beli);
                } else {
                    $('#input-hargabeli').val('0');
                }
            })

            $('#input-jumlah_su').on('keyup', function() {
                var beratkaleng = $('#input-berat_kaleng').val() || 0;
                var qtystockutuh = $('#input-jumlah_su').val() || 0;

                var hasil = parseFloat(beratkaleng * qtystockutuh).toFixed(3);
                if (!isNaN(hasil)){
                    $('#input-totalberat_su').val(hasil);
                } else {
                    $('#input-totalberat_su').val('0.000');
                }
            })

            $('#input-totalberat_ss').on('keyup', function() {
                var berattotal = $('#input-totalberat_ss').val() || 0;
                var berattotalutuh = $('#input-totalberat_su').val() || 0;
                var hargabeli = $('#input-hargabeli').val();
                var hasil = parseFloat(parseFloat(berattotalutuh ) + parseFloat(berattotal)).toFixed(3);

                if (!isNaN(hasil)){
                    $('#input-totalberat_stock').val(hasil);
                    hasil = parseFloat(hargabeli * hasil).toFixed(0) || 0;
                    $('#input-stock_akhir').val(hasil);
                } else {
                    $('#input-totalberat_stock').val(berattotalutuh);
                    hasil = parseFloat(hargabeli * berattotalutuh).toFixed(0) || 0;
                    $('#input-stock_akhir').val(hasil);
                }
            })

            $('.btn-tambah').on('click', function() {
                let item_id = $('#input-item_id').val();
                let item_code = $('#input-item_code').val();
                let item_name = $('#input-item_name').val();
                let item_type = $('#input-item_type').val();

                let jml_stock_utuh = $('#input-jumlah_su').val();
                let berat_perkaleng = $('#input-berat_kaleng').val();
                let tot_berat_stock_utuh = $('#input-totalberat_su').val();
                let tot_berat_stock_sisa = $('#input-totalberat_ss').val();
                let tot_berat_stock = $('#input-totalberat_stock').val();
                let hrg_beli_per_gr = $('#input-hargabeli').val();
                let stock_akhir = $('#input-stock_akhir').val();

                let harga_beli = $('#input-hargabeli_utuh').val();
                let stock_split = $('#input-stock_split').val();
                let stock_display = $('#input-stock_display').val();
                let stock_real = $('#input-stock_real').val();

                if(item_id === null){
                    Swal.fire({
                        title: "Informasi",
                        html: "Barang Belum Dipilih",
                        icon: "info",
                        heightAuto: false
                    });
                    return false;
                }

                if(stock_akhir === ''){
                    Swal.fire({
                        title: "Informasi",
                        html: "Silahkan Check Kembali inputan yang Anda Masukan !!!",
                        icon: "info",
                        heightAuto: false
                    });
                    return false;
                }

                let dataPost = [];
                let dataSem = JSON.parse(localStorage.getItem("tbl_sem_hitung_stock")) || [];
                const indexData = dataSem.findIndex((index) => {
                    return index.item_code === item_code;
                });
                if (indexData === -1) {
                    dataSem.forEach(element => {
                        dataPost.push({
                            item_id: element.item_id,
                            item_code: element.item_code,
                            item_name: element.item_name,
                            item_type: element.item_type,
                            jml_stock_utuh: element.jml_stock_utuh,
                            berat_perkaleng: element.berat_perkaleng,
                            tot_berat_stock_utuh: element.tot_berat_stock_utuh,
                            tot_berat_stock_sisa: element.tot_berat_stock_sisa,
                            tot_berat_stock: element.tot_berat_stock,
                            hrg_beli_per_gr: element.hrg_beli_per_gr,
                            stock_akhir: element.stock_akhir,
                            stock_display: element.stock_display,
                            stock_real: element.stock_real
                        })
                    });

                    dataPost.push({
                        item_id: item_id,
                        item_code: item_code,
                        item_name: item_name,
                        item_type: item_type,
                        jml_stock_utuh: jml_stock_utuh,
                        berat_perkaleng: berat_perkaleng,
                        tot_berat_stock_utuh: tot_berat_stock_utuh,
                        tot_berat_stock_sisa: tot_berat_stock_sisa,
                        tot_berat_stock: tot_berat_stock,
                        hrg_beli_per_gr: hrg_beli_per_gr,
                        stock_akhir: stock_akhir,
                        stock_display: parseFloat(harga_beli * stock_display),
                        stock_real: parseFloat(harga_beli * stock_real)
                    })
                    
                    localStorage.setItem("tbl_sem_hitung_stock", JSON.stringify(dataPost));
                    Swal.fire({
                        title: "Berhasil",
                        html: "Barang Berhasil ditambahkan",
                        icon: "success",
                        timer: 2000,
                        showConfirmButton: false,
                        timerProgressBar: true,
                        heightAuto: false,
                        willOpen: () => {
                            Swal.showLoading()
                        }
                    }).then(() => {
                        getDataSementara();
                        $('#input-item_code').val('');
                        $('#input-item_name').val('');
                        $('#input-item_type').val('');
                        $('#input-jumlah_su').val('');
                        $('#input-berat_kaleng').val('');
                        $('#input-totalberat_su').val('');
                        $('#input-totalberat_ss').val('');
                        $('#input-totalberat_stock').val('');
                        $('#input-hargabeli').val('');
                        $('#input-stock_akhir').val('');
                        $('#input-hargabeli_utuh').val('');
                        $('#input-stock_split').val('');
                        $('#input-stock_display').val('');
                        $('#input-stock_real').val('');
                        // $('#input-item_id').val('').trigger('change');
                        window.location.reload();
                    });
                } else {
                    Swal.fire({
                        title: "Informasi",
                        html: "Barang Sudah Ada DI Tabel",
                        icon: "info",
                        heightAuto: false
                    });
                }
            })

            $('.btn-reset').on('click', function() {
                localStorage.setItem("tbl_sem_hitung_stock", JSON.stringify([]));
                getDataSementara();
            })

            $('.btn-save').on('click', function() {
                let listData = JSON.parse(localStorage.getItem("tbl_sem_hitung_stock"));
                let code = $('#input-code').val();

                let data = {
                    code,
                    'split_count_details': [],
                    'total': 0,
                };

                for (let index = 0; index < listData.length; index++) {
                    let element = listData[index];

                        data.split_count_details.push({
                            'item_id': element['item_id'],
                            'stock_split_rp': element['stock_split'] || 0,
                            'stock_display_rp': element['stock_display'] || 0,
                            'stock_real_rp': element['stock_real']
                        });
                    
                    data.total = (element['stock_split'] || 0) + (element['stock_display'] || 0) + (element['stock_real'] || 0);
                }

                $.ajax({
                    headers: {
                        'Authorization': `Bearer ${$('meta[name="bearer-token"]').attr('content')}`,
                        'Content-Type': 'application/json'
                    },
                    url: '{{ route('splitcounts.store') }}',
                    type: "post",
                    data: JSON.stringify(data),
                    dataType: "json",
                    contentType: false,
                    processData: false,
                    cache: false,
                    async: true,
                    timeout: 40000,
                    beforeSend:function(){
                        $('.custom-loading').fadeIn();
                    },
                    complete:function(){
                        $('.custom-loading').fadeOut();
                    },
                    success:(data) => {
                        if ($.isEmptyObject(data.errors)) {
                            Swal.fire({
                                title: "Berhasil",
                                html: data.message,
                                icon: "success",
                                timer: 2000,
                                showConfirmButton: false,
                                timerProgressBar: true,
                                heightAuto: false,
                                willOpen: () => {
                                    Swal.showLoading()
                                }
                            }).then(() => {
                                if ($.isEmptyObject(data.url)) {
                                    localStorage.removeItem('tbl_sem_hitung_stock');
                                    location.reload();
                                } else {
                                    location = data.url;
                                }
                            });
                        } else {
                            Swal.fire({
                                title: "Gagal",
                                html: data.errors,
                                icon: "error",
                                heightAuto: false
                            });
                        }
                    },
                    error:(xhr, status, error) => {
                        const {responseJSON:response} = xhr;
                        console.log(response);
                        if(response.errors) {
                            Swal.fire({
                                title: "Gagal",
                                text: "Anda belum menghitung stock belahan",
                                icon: "warning",
                                heightAuto: false
                            });
                        } else {
                            Swal.fire({
                                title: "Error",
                                text: response.message,
                                icon: "error",
                                heightAuto: false
                            });
                        }
                    }
                });
            })
        });
    </script>
@endpush