@extends('layouts.app_operasi')

@section('content')
<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-8">
            <div class="card">
                <div class="card-header">{{ __('Komuditi') }}</div>

                <div class="card-body text-center">
                    <div class="row">
                        <div class="col-2 justify-content-start">
                            <a href="{{ url('/') }}" class="ion-backspace" style="font-size:50px;color:blue;"></a>
                        </div>
                    </div>
                    <div class="row form-group justify-content-center">
                        <div class="col-lg-6 col-md-8 col-sm-12">
                            <div class="small-box bg-info">
                                <div class="inner">
                                    <h3 id="baki_komuditi"></h3>

                                    <p>Baki Komuditi</p>
                                </div>
                                <div class="icon">
                                    <i class="ion ion-bag"></i>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                    <div class="row form-group justify-content-center">
                        <button class="btn btn-primary" id="pendahuluan">Pendahuluan Komuditi</button>
                        <button class="btn btn-primary ml-md-2" id="tambah">Tambah Komuditi</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="daftar_marhun" tabindex="-1" data-backdrop="static"  aria-labelledby="ModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="ModalLabel">Daftar Marhun</h5>
            </div>
            <div class="modal-body">
                
            </div>
            <div class="modal-footer">
                <div class="form-group row">
                    <input class="btn btn-primary mr-2" type="button" name="tambah_marhun" id="tambah_marhun" value="Tambah">
                    <input class="btn btn-primary mr-2" type="button" name="terima_marhun" id="terima_marhun" value="Terima">
                    <button type="button" class="btn btn-danger" name="batal_marhun" id="batal_marhun">Batal</button>
                </div>
            </div>
            </form>
        </div>
    </div>
</div>
<script>
    $(document).ready( function () {
        checkKomuditi();
    });

    const formatter = new Intl.NumberFormat('en-US', {
        minimumFractionDigits: 2
    });

    function checkKomuditi(){
        $.ajax({
            method:'get',
            url:'http://api_arrahn.test/api/komuditi/check',
            success:function(data){
                var check_komuditi = Object.keys(data).length;
                if(check_komuditi != 0){
                    $('#baki_komuditi').text(formatter.format(data['unit_komuditi']));
                    $('#pendahuluan').hide();
                    $('#tambah').show();
                }else{
                    $('#baki_komuditi').text(0);
                    $('#tambah').hide();
                    $('#pendahuluan').show();
                }
            }
        });
    }

    $('#pendahuluan').click(async function(){
        const { value: komuditi } = await Swal.fire({
            title: 'Pembelian Komuditi',
            input: 'text',
            inputLabel: 'Jumlah Komuditi Yang Dibeli',
            inputPlaceholder: 'Unit Komuditi',
            showCancelButton: true,
            confirmButtonText: 'Sahkan',
            cancelButtonText: 'Batal',
            inputValidator: (value) => {
                if($.isNumeric(value) == false){
                    return 'Sila Unit Komuditi Yang Dibeli'
                }
            }
        });

        if (komuditi) {
            $.ajax({
                method:'post',
                url:'http://api_arrahn.test/api/komuditi/pendahuluan',
                data:{
                    'unit_komuditi':komuditi,
                    'purchased_by':'afiq'
                },
                dataType:'json',
                success:function(){
                    checkKomuditi();
                    Swal.fire({
                        icon: 'success',
                        title: 'Berjaya!',
                        text: 'Pendahuluan Unit Komuditi Berjaya'
                    });
                },
                error: function(xhRequest, ErrorText, thrownError){
                    Swal.fire({
                        icon: 'error',
                        title: 'Amaran!',
                        text: 'Pendahuluan Unit Komuditi Tidak Berjaya'
                    });
                    console.log(xhRequest);
                }
            });
        }
    })

    $('#tambah').click(async function(){
        const { value: komuditi } = await Swal.fire({
            title: 'Pembelian Komuditi',
            input: 'text',
            inputLabel: 'Jumlah Komuditi Yang Dibeli',
            inputPlaceholder: 'Unit Komuditi',
            showCancelButton: true,
            confirmButtonText: 'Sahkan',
            cancelButtonText: 'Batal',
            inputValidator: (value) => {
                if($.isNumeric(value) == false){
                    return 'Sila Unit Komuditi Yang Dibeli'
                }
            }
        });

        if (komuditi) {
            $.ajax({
                method:'put',
                url:'http://api_arrahn.test/api/komuditi/update',
                data:{
                    'unit_komuditi':komuditi,
                    'purchased_by':'afiq'
                },
                dataType:'json',
                success:function(){
                    checkKomuditi();
                    Swal.fire({
                        icon: 'success',
                        title: 'Berjaya!',
                        text: 'Pernambahan Unit Komuditi Berjaya'
                    });
                },
                error: function(xhRequest, ErrorText, thrownError){
                    Swal.fire({
                        icon: 'error',
                        title: 'Amaran!',
                        text: 'Pernambahan Unit Komuditi Tidak Berjaya'
                    });
                    console.log(xhRequest);
                }
            });
        }
    })

</script>
@endsection