@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-10">
            <h3 class="text-center text-uppercase">MAKLUMAT MARHUN</h3>
            <div class="card">
                <div class="card-body">
                    <form action="" id="maklumat_marhun" method="post">
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group row">
                                    <input type="hidden" name="kodcaw" id="kodcaw" value="{{$cawangan_info['kodcaw']}}">
                                    <div class="col-md-4">No Rujukan</div>
                                    <div class="col-md-8"><input type="text" name="norujukan" id="norujukan" value="{{ $norujukan }}"></div>
                                    <div class="col-md-4">Marhun</div>
                                    <div class="col-md-8">
                                        <select name="marhun" id="marhun">
                                            <option disabled selected value> -- select an option -- </option>
                                            @foreach($jemas as $j)
                                                <option value="{{$j['marhun']}}">{{$j['descpt']}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="col-md-12">
                                        <div class="form-group row">
                                            <div class="form-check form-check-inline">
                                                <input class="form-check-input" type="checkbox" id="rosak" value="rosak">
                                                <label class="form-check-label" for="rosak">Rosak</label>
                                            </div>
                                            <div class="form-check form-check-inline">
                                                <input class="form-check-input" type="checkbox" id="putus" value="putus">
                                                <label class="form-check-label" for="putus">Putus</label>
                                            </div>
                                            <div class="form-check form-check-inline">
                                                <input class="form-check-input" type="checkbox" id="patah" value="patah">
                                                <label class="form-check-label" for="patah">Patah</label>
                                            </div>
                                            <div class="form-check form-check-inline">
                                                <input class="form-check-input" type="checkbox" id="permata" value="permata">
                                                <label class="form-check-label" for="permata">Permata</label>
                                            </div>
                                            <div class="form-check form-check-inline">
                                                <input class="form-check-input" type="checkbox" id="sebelah" value="sebelah">
                                                <label class="form-check-label" for="sebelah">Sebelah</label>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-md-4">Karat</div>
                                    <div class="col-md-8">
                                        <select name="karat" id="karat">
                                            <option disabled selected value> -- select an option -- </option>
                                            @foreach($hargaemas as $emas)
                                                <option value="{{$emas['karat']}}">{{$emas['karat'].' - '.$emas['keterangan']}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="col-md-4">Berat</div>
                                    <div class="col-md-8"><input type="text" name="berat_emas" id="berat_emas"></div>
                                    <div class="col-md-4">Harga</div>
                                    <div class="col-md-8"><input type="text" name="harga" id="harga" readonly></div>
                                    <div class="col-md-4">Nilai Marhun</div>
                                    <div class="col-md-8"><input type="text" name="nilai_marhun" id="nilai_marhun" readonly></div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="row">
                                    <div class="col-md-12">
                                        <img style="width:200px" src="{{ asset('img/logo_arrahn_baru.png') }}" alt="">
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="form-group row" style="margin-right:auto;margin-left:auto">
                                        <button class="btn btn-primary mr-2">KAMERA</button>
                                        <button class="btn btn-primary">MUAT NAIK</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <hr>
                        <div class="row">
                            <div class="form-group row" style="margin-right:auto;margin-left:auto">
                                <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="submit" name="terima_marhun" id="terima_marhun" value="Terima">
                                <input class="btn btn-danger mr-2" type="button" name="batal_marhun" id="batal_marhun" value="Batal">
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    $('#karat').change(function(){
        var karat = this.value;
        karat = karat.replace(/\./g,'-');
        var berat = $('#berat_emas').val();
        getHargaEmas(karat,berat)
    });

    $('#berat_emas').change(function(){
        var berat = this.value;
        var karat = $('#karat').val();
        karat = karat.replace(/\./g,'-');
        getHargaEmas(karat,berat)
    })

    $('#tambah_marhun').click(function(){
        var kodcaw = $('#kodcaw').val();
        var norujukan = $('#norujukan').val();
        var marhun = $('#marhun').val();
        var rosak = $('#rosak').val();
        var putus = $('#putus').val();
        var patah = $('#patah').val();
        var permata = $('#permata').val();
        var sebelah = $('#sebelah').val();
        var karat = $('#karat').val();
        var berat_emas = $('#berat_emas').val();
        var harga = $('#harga').val();
        var nilai_marhun = $('#nilai_marhun').val();

        $.ajax({
            method:'POST',
            url:'http://localhost:8000/api/marhun/'+kodcaw,
            dataType:'json',
            data:{
                'norujukan': norujukan,
                'marhun' : marhun,
                'rosak' : rosak,
                'putus' : putus,
                'patah' : patah,
                'permata' : permata,
                'sebelah' : sebelah,
                'karat' : karat,
                'berat_emas' :berat_emas,
                'harga' : harga,
                'nilai_marhun' : nilai_marhun
            },
            success:function(data){
                alert('Tambah Marhun Berjaya');
                $('#marhun').prop("selected", false);
                $('#rosak').prop('checked', false);
                $('#putus').prop('checked', false);
                $('#patah').prop('checked', false);
                $('#permata').prop('checked', false);
                $('#sebelah').prop('checked', false);
                $('#karat').prop("selected", false);
                $('#berat_emas').val("");
                $('#harga').val("");
                $('#nilai_marhun').val("");
            },
            error: function(xhRequest, ErrorText, thrownError){
                alert('Tambah Marhun Tidak Berjaya');
                console.log(xhRequest);
            }
        });
    })

    function getHargaEmas(karat,berat){
        $.ajax({
            method:'GET',
            url:'http://localhost:8000/api/harga_emas/'+karat,
            success:function(data){
                
                var nilai_marhun = data['harga2'] * berat;
                $('#harga').val(data['harga2']);
                $('#nilai_marhun').val(nilai_marhun);
            }
        })
    }
</script>
@endsection