@extends('layouts.layout')
@section('css')
    <link rel="stylesheet" href="{{ asset('/css/lakuemas_tarik.css') }}">
@endsection
@section('body_class', 'nav-md')
@section('body_content')
<div class="container body">
    <div class="main_container">
        @include('includes.sidebar')
        <div class="right_col" role="main">
            <div class="page-title">
                <div class="title_left">
                    <h3>Laku Tarik</h3>
                </div>
                <div class="clearfix"></div>
            </div>

            <div class="row">
                <div class="col-xs-12">
                    <ol class="breadcrumb">
                        <li><a href="{{ route('dashboard') }}">Home</a></li>                        
                        <li class="active">Transaction</li>
                        <li class="active">Laku Tarik</li>
                    </ol>
                </div>
            </div>
            <div class="row">
                <div class="col-md-3"></div>
                <div class="col-md-6">
                    <div class="content_tarik">
                        <h4 class="mb-10">Konfirmasi Tarik Emas</h4>

                        <div class="row mt-20 mb-10">
                            <div class="col-md-5">Saldo</div>
                            <div class="col-md-7">: {{ $customer->tabungan[0]->saldo }} Gram</div>
                        </div>

                        <div class="row mt-10 mb-10">
                            <div class="col-md-12">
                                <b class="fs-14">Detail Penarikan</b>
                            </div>
                        </div>

                        @php $total_certificate = 0; @endphp
                        @foreach($transaction->detail as $transaction_detail)
                            <div class="row mt-10 mb-10">
                                <div class="col-md-5">{{ $transaction_detail->quantity }} Keping - Pecahan {{ $transaction_detail->pecahan_emas_global->pecahan }} Gram</div>
                                <div class="col-md-7">
                                    @if($transaction->id_payment_method != \App\Models\Metode_pembayaran_model::ID_DIRECT)
                                        : Rp. {{ number_format($transaction_detail->quantity * $transaction_detail->certificate_price) }},-
                                    @else

                                    @endif
                                </div>
                            </div>
                            @php $total_certificate = $total_certificate + ($transaction_detail->quantity * $transaction_detail->certificate_price); @endphp
                        @endforeach

                        @if($transaction->service_fee != '0')
                            <div class="row mt-10 mb-10">
                                <div class="col-md-5">Biaya Layanan</div>
                                <div class="col-md-7">
                                    @if($transaction->id_payment_method == \App\Models\Metode_pembayaran_model::ID_SALDO_LAKUEMAS)
                                        : <b>GRATIS</b>
                                    @else
                                        : Rp. {{ number_format($transaction->service_fee) }},-
                                    @endif
                                </div>
                            </div>
                        @endif  

                        @if($transaction->id_payment_method != \App\Models\Metode_pembayaran_model::ID_DIRECT)
                            <div class="row mt-10 mb-10 bold">
                                <div class="col-md-5">Total</div>
                                <div class="col-md-7">: Rp. {{ number_format($transaction->service_fee + $total_certificate) }},-</div>
                            </div>
                        @endif

                        <div class="row mt-20 mb-10">
                            <div class="col-md-12">
                                <b class="fs-14">Metode Pembayaran</b>
                            </div>
                        </div>
                        <div class="row mt-10 mb-10">
                            <div class="col-md-5">{{ ucfirst($transaction->payment_method->label) }}</div>
                            <div class="col-md-7">
                                @if($transaction->id_payment_method == \App\Models\Metode_pembayaran_model::ID_SALDO_LAKUEMAS)
                                    : ({{ number_format($total_certificate/$harga_jual['value'], 4) }} gram)
                                @elseif($transaction->id_payment_method == \App\Models\Metode_pembayaran_model::ID_DIRECT)

                                @else
                                    : <img src="{{ asset('/images/' . $transaction->payment_method->image) }}" height="30" />
                                @endif
                            </div>
                        </div>

                        <div class="row mt-20 mb-10">
                            <div class="col-md-12">
                                <b class="fs-14">Tempat Penarikan</b>
                            </div>
                        </div>

                        <div class="row mt-10 mb-10">
                            <div class="col-md-5">Nama</div>
                            <div class="col-md-7">{{ $transaction->store->nama }}</div>
                        </div>

                        <div class="row mt-10 mb-10">
                            <div class="col-md-5">Alamat</div>
                            <div class="col-md-7">{!! $transaction->store->alamat !!}</div>
                        </div>

                        <div class="row mt-40 mb-10">
                            <div class="col-md-12 center">Pastikan anda mengecek kembali data diatas sebelum melakukan pembayaran</div>
                        </div>

                        <div class="row mt-20 mb-10">
                            <div class="col-md-6">
                                <button type="button" class="btn btn-primary btn-block" onclick="showPINForm()">Lanjutkan</button>
                            </div>
                            <div class="col-md-6">
                                <a href="{{ url('transaksi/tarik_emas/' . $customer_id_crypt) }}" class="btn btn-danger btn-block">Kembali</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-3"></div>
            </div>
        </div>
        @include('includes.footer')
    </div>
</div>
<div id="passwordAdmin" class="modal fade bd-example-modal-sm" tabindex="-1" role="dialog">
  <div class="modal-dialog modal-sm" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Masukan PIN Anda</h5>
      </div>
      <div class="modal-body">
        <input type="password" id="pinUser" name="pinUser" class="form-control" placeholder="PIN" maxlength="6">
        <div class="alert-msg" style="display: none;"></div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" onclick="checkPin()">Konfirmasi</button>
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
      </div>
    </div>
  </div>
</div>

@endsection

@section("scripts")
<script type="text/javascript">
    function showPINForm() {
        $('#passwordAdmin').modal('show');
        setTimeout(function(){ 
            document.getElementById("pinUser").focus();
        }, 500);
    }

    function checkPin() {
        let pin = $('#pinUser').val();
        if(pin.length == 0) {
            $('.alert-msg').html('PIN tidak boleh kosong');
            $('.alert-msg').fadeIn();
            document.getElementById("pinUser").focus();
            return false;
        }
        else if(pin.length < 6) {
            $('.alert-msg').html('PIN minimal 6 karakter');
            $('.alert-msg').fadeIn();
            document.getElementById("pinUser").focus();
            return false;
        }
        $('.alert-msg').hide();
        $.ajax({
            url: '/transaksi/tarik_emas/checkPin',
            method: "POST",
            headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
            data: {
                "pin" : $("#pinUser").val()
            },
            error: function(response) {
                var data = response.responseJSON;
                alert(data.error);
                $("#form-tarik").find(".loading").addClass("hidden");
                $("#form-tarik").find(".btn-add").removeClass("hidden");
            },
            success: function(response) {
                if(response.success == 0) {
                    $('.alert-msg').html('Maaf, PIN Anda salah');
                    $('.alert-msg').fadeIn();
                    $("#pinUser").val('');
                    document.getElementById("pinUser").focus();
                    return false;
                }
                $('.alert-msg').hide();
                confirm();
            }
        });
    }

    function confirm() {
        $.ajax({
            url: '/transaksi/tarik_emas/confirm',
            method: "POST",
            headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
            data: {
                "id_customer" : '{{ $customer_id_crypt }}'
            },
            error: function(response) {
                var data = response.responseJSON;
                alert(data.error);
                $("#form-tarik").find(".loading").addClass("hidden");
                $("#form-tarik").find(".btn-add").removeClass("hidden");
            },
            success: function(response) {
                location.href = '{{ url("transaksi/tarik_emas/confirm/") }}/' + response.transaction_code + '/{{ $customer_id_crypt }}';
            }
        });
    }
</script>
@endsection