@extends('layouts.layout')
@section('body_class', 'nav-md')
@section('css')
    <style type="text/css">
        .alert-msg {
            font-size: 12px;
            font-style: italic;
            color: #f00;
            margin-top:5px;
        }
    </style>
@endsection
@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>Butik Emas Waiting Approval Detail #{{ $buy->code }}</h3>
                </div>
                <div class="clearfix"></div>
            </div>

            <div class="row">                
                <div class="col-xs-12">
                    <div class="x_panel">                        
                        <div class="x_content">
                            @if($buy->payment_method == 'transfer')
    							<div class="row tile_count">
    								<div class="col-sm-4 col-xs-12 tile_stats_count">
    									<span class="count_top"><i class="fa fa-money" aria-hidden="true"></i> Butik Emas - IRIS Balance</span>
    									<div class="count result-ajax-balance" style="font-size:25px;">
    										<i class="fa fa-spinner fa-spin"></i>
    										<span class="sr-only">Loading...</span>
    									</div>
    									<span class="count_bottom"></span>
    								</div>
    							</div>
                            @else
                                <div class="row tile_count">
                                    <div class="col-sm-4 col-xs-12 tile_stats_count">
                                        <span class="count_top"><i class="fa fa-money" aria-hidden="true"></i> Cash On Store <b>{{ $buy->store->nama }}</b></span>
                                        <div class="count result-ajax-balance" style="font-size:25px;">
                                            Rp. {{ number_format($buy->store->store_balance->balance) }}
                                        </div>
                                        <span class="count_bottom"></span>
                                    </div>
                                </div>
                            @endif


                            @if (Session::has('success'))
                                <div class="alert alert-success" style="margin-bottom: 20px;" role="alert">
                                    {{Session::get("success")}}
                                </div>
                            @endif
                            @if (Session::has('oops'))
                                <div class="alert alert-warning" style="margin-bottom: 20px;" role="alert">
                                    {{Session::get("oops")}}
                                </div>
                            @endif
                            <h1 style="margin-bottom:5px; font-size:14px; letter-spacing:1px; font-weight:700">CUSTOMER</h1>
                            <hr style="margin-top:0;">

                            <div class="form-horizontal">
                                <div class="row">
                                    <div class="col-xs-12 col-sm-6">
                                        <div class="form-group">
                                            <label class="col-xs-12 col-sm-4 control-label">Name :</label>
                                            <div class="col-xs-12 col-sm-8">
                                                <input type="text" disabled value="{{ $buy->name }}" class="form-control">
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-xs-12 col-sm-4 control-label">Email :</label>
                                            <div class="col-xs-12 col-sm-8">
                                                <input type="text" disabled value="{{ $buy->email }}" class="form-control">
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-xs-12 col-sm-4 control-label">Handphone :</label>
                                            <div class="col-xs-12 col-sm-8">
                                                <input type="text" disabled value="{{ $buy->handphone }}" class="form-control">
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-xs-12 col-sm-4 control-label">Address :</label>
                                            <div class="col-xs-12 col-sm-8">
                                                <textarea class="form-control" disabled>{{ $buy->address }}</textarea>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xs-12 col-sm-6">
                                        <div class="form-group">
                                            <label class="col-xs-12 col-sm-4 control-label">ID Number :</label>
                                            <div class="col-xs-12 col-sm-8">
                                                <input type="text" disabled value="{{ $buy->ktp }}" class="form-control">
                                                <div>
                                                    <img src="{{ env('ALIYUN_OSS_IMAGE_URL') . '/butikemas/temporary/'. $buy->ktp_photo }}" style="margin-top:5px;" width="100%" />
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            @if($buy->payment_method == 'transfer')     
                                <h1 style="margin-top:10px; margin-bottom:5px; font-size:14px; letter-spacing:1px; font-weight:700">BANK</h1>
                                <hr style="margin-top:0;">

                                <div class="form-horizontal">
                                    <div class="row">
                                        <div class="col-xs-12 col-sm-6">
                                            <div class="form-group">
                                                <label class="col-xs-12 col-sm-4 control-label">Bank :</label>
                                                <div class="col-xs-12 col-sm-8">
                                                    <input type="text" disabled value="{{ $buy->bank->bank }}" class="form-control">
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label class="col-xs-12 col-sm-4 control-label">Account Number :</label>
                                                <div class="col-xs-12 col-sm-8">
                                                    <input type="text" disabled value="{{ $buy->bank_account_number }}" class="form-control">
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label class="col-xs-12 col-sm-4 control-label">Account Name :</label>
                                                <div class="col-xs-12 col-sm-8">
                                                    <input type="text" disabled value="{{ $buy->bank_account_name }}" class="form-control">
                                                </div>
                                            </div>                                        
                                        </div>                                    
                                    </div>
                                </div>
                            @else
                                <h1 style="margin-top:10px; margin-bottom:5px; font-size:14px; letter-spacing:1px; font-weight:700">PAYMENT METHOD : <span class="badge badge-primary">CASH</span></h1>
                                <hr style="margin-top:0;">
                            @endif

                            <h1 style="margin-top:10px; margin-bottom:5px; font-size:14px; letter-spacing:1px; font-weight:700">TRANSACTION</h1>
                            <hr style="margin-top:0;">

                            @if($buy->jaws_cashbox)
                                <div class="alert alert-info" role="alert" style="margin-bottom: 20px;;">
                                    <i class="fa fa-info-circle"></i> This transaction is created by Jaws Application. All items in this transaction will be stored in cashbox <b><i class="fa fa-dropbox"></i> {{ $buy->jaws_cashbox->cashbox_code }}</b>
                                </div>
                            @endif

                            <div class="form-horizontal">
                                <div class="row">
                                    <div class="col-xs-12 col-sm-4">
                                        <div class="form-group">
                                            <label class="col-xs-12 col-sm-4 control-label">ID :</label>
                                            <div class="col-xs-12 col-sm-8">
                                                <input type="text" disabled value="{{ $buy->id }}" class="form-control">
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-xs-12 col-sm-4 control-label">Code :</label>
                                            <div class="col-xs-12 col-sm-8">
                                                <input type="text" disabled value="{{ $buy->code }}" class="form-control">
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-xs-12 col-sm-4 control-label">Date :</label>
                                            <div class="col-xs-12 col-sm-8">
                                                <input type="text" disabled value="{{ $buy->created_at }}" class="form-control">
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-xs-12 col-sm-4 control-label">Store Name :</label>
                                            <div class="col-xs-12 col-sm-8">
                                                <input type="text" disabled value="{{ $buy->store->nama }}" class="form-control">
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-xs-12 col-sm-4 control-label">Creator :</label>
                                            <div class="col-xs-12 col-sm-8">
                                                <input type="text" disabled value="{{ $buy->user->name }}" class="form-control">
                                            </div>
                                        </div>

                                        <div class="form-group" style="display: none;">
                                            <label class="col-xs-12 col-sm-4 control-label">Disburse :</label>
                                            <div class="col-xs-12 col-sm-8">
                                                <input type="text" disabled value="{{ number_format($buy->disburse) }}" class="form-control">
                                            </div>
                                        </div>                                        
                                    </div> 
                                    <div class="col-xs-12 col-sm-8">
                                        <table class="table table-bordered table-striped">
                                            <thead>
                                                <tr>
                                                    <th class="text-center">Item</th>
                                                    <th class="text-center">Photo</th>
                                                    <th class="text-right">Weight</th>
                                                    <th class="text-right">Carat</th>
                                                    <th class="text-right">Quantity</th>
                                                    <th class="text-right" style="width: 170px;">Unit Price</th>
                                                    <th class="text-right">Total Price</th>                                                    
                                                </tr>
                                            </thead>
                                            <tbody>
                                                @forelse($buy->detail as $item)
                                                    <tr>
                                                        <td class="text-center">{{ $item->carat->brand->brand }}</td>
                                                        <td class="text-center">
                                                            @if($item->photo)
                                                            <img src="{{ env('ALIYUN_OSS_IMAGE_URL') . '/butikemas/temporary/item/'. $item->photo }}" style="width:100px" />
                                                            @else
                                                                -
                                                            @endif
                                                        </td>
                                                        <td class="text-right">{{ $item->weight }}</td>
                                                        <td class="text-right">{{ $item->carat->carat->carat }}</td>
                                                        <td class="text-right">{{ $item->quantity }}</td>
                                                        <td class="text-right"><div style="float: left;"><span class="badge" style="font-size: 10px; cursor: pointer;" onclick="editTransaction('{{ json_encode($item) }}')"><i class="fa fa-pencil"></i></span></div>{{ number_format($item->unit_price) }}</td>
                                                        <td class="text-right">{{ number_format($item->unit_price * $item->quantity) }}</td>
                                                    </tr>
                                                @empty
                                                    <tr>
                                                        <td colspan="7" class="text-center">No Data</td>
                                                    </tr>
                                                @endforelse
                                            </tbody>
                                            @if(count($buy->detail) > 0)
                                                <tfoot>
                                                    <tr>
                                                        <td class="text-right" colspan="6">Total :</td>
                                                        <td class="text-right">{{ number_format($buy->product_total_price) }}</td>
                                                    </tr>
                                                    <tr>
                                                        <td class="text-right text-danger" colspan="6">Admin Fee :</td>
                                                        <td class="text-right text-danger">( {{ number_format($buy->admin_fee) }} )</td>
                                                    </tr>
                                                    <tr>
                                                        <td class="text-right" colspan="6">Disburse :</td>
                                                        <td class="text-right">{{ number_format($buy->disburse) }}</td>
                                                    </tr>
                                                    @if($buy->payment_method == 'cash')
                                                    <tr>
                                                        <td class="text-right" colspan="6">Final :</td>
                                                        <td class="text-right">
                                                            @php $lebih = substr($buy->disburse, -2);  @endphp
                                                            {{ number_format($buy->disburse - $lebih) }}
                                                            <input type="hidden" id="final_disburse" value="{{ $buy->disburse - $lebih }}">
                                                        </td>
                                                    </tr>
                                                    @endif
                                                </tfoot>
                                            @endif
                                        </table>
                                    </div>                                   
                                </div>
                            </div>

                            <hr>

                            @if($buy->status == (\App\Models\Butik_emas_buy_temp_model::STATUS)["processing"]["ID"])
                                <div class="alert alert-warning" role="alert"><span style="font-weight:700">Please Wait</span> This data is in progress</div>
                            @elseif($buy->status == (\App\Models\Butik_emas_buy_temp_model::STATUS)["waiting_approval"]["ID"])
                                <form id="form" class="form-horizontal">
                                    <input type="hidden" name="id" value="{{ $buy->id }}">
                                    <div class="form-group">
                                        <div class="col-xs-4"></div>
                                        <div class="col-xs-4 text-center">
                                            Insert your PIN number <input type="password" class="form-control input-pin" autocomplete="off" inputmode="numeric" style="margin-top: 5px; text-align: center;">
                                        </div>
                                        <div class="col-xs-4"></div>
                                    </div>  


                                    <div class="form-group text-center">
                                        @if($buy->payment_method == 'transfer')
                                            <button type="button" class="btn btn-primary btn-create-iris"><i class="fa fa-money" aria-hidden="true"></i> Create Iris</button>
                                        @else
                                            <button type="button" class="btn btn-primary btn-create-iris"><i class="fa fa-check" aria-hidden="true"></i> Approve</button>
                                        @endif
                                        <button type="button" class="btn btn-danger btn-reject"><i class="fa fa-times" aria-hidden="true"></i> Reject</button>
                                    </div>

                                </form>
                            @elseif($buy->status == (\App\Models\Butik_emas_buy_temp_model::STATUS)["iris_created"]["ID"])
                                <div class="alert alert-success" role="alert"><span style="font-weight:700">Success!</span> Iris Created</div>
                            @elseif($buy->status == (\App\Models\Butik_emas_buy_temp_model::STATUS)["approved_cash"]["ID"])
                                <div class="alert alert-success" role="alert"><span style="font-weight:700">Success!</span> Approved</div>
                            @endif

                            <hr>

                            <h1 style="margin-top:10px; margin-bottom:5px; font-size:14px; letter-spacing:1px; font-weight:700">IRIS LOG</h1>
                            <hr style="margin-top:0;">
                            
							<div style="border: 0px solid #f00; overflow:auto;">	
								<table class="table table-bordered table-striped">
									<thead>
										<tr>
											<th class="text-center" width="10%">Created at</th>
											<th class="text-center" width="50%">Request</th>
											<th class="text-center" width="10%">Status Code</th>
											<th class="text-center" width="30%">Response</th>
										</tr>
									</thead>
									<tbody>
										@forelse($buy->iris_log as $iris_log)
											<tr>
												<td class="text-center">{{ $iris_log->created_at }}</td>
												<td class="text-center">{{ $iris_log->request }}</td>
												<td class="text-center">{{ $iris_log->status_code }}</td>
												<td class="text-center">{{ $iris_log->response }}</td>
											</tr>
										@empty
											<tr>
												<td colspan="4" class="text-center">No Data</td>
											</tr>
										@endforelse
									</tbody>
								</table>
							</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        @include('includes.footer')
    </div>
</div>

<!-- Modal -->
<div class="modal fade" id="editTransactionModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-sm" role="document">
    <div class="modal-content">
        <div class="modal-header">
            <h4 class="modal-title" id="exampleModalLabel"><i class="fa fa-pencil"></i> Change Unit Price</h4>
        </div>
        <form method="POST" action="{{ url('butik_emas/approval/change_price') }}">
          <div class="modal-body">
              <div id="pin_modal_form" class="form-group" style="margin-bottom: 20px; ">
                <input type="hidden" name="_token" value="{{ csrf_token() }}" />
                <input type="hidden" name="butik_emas_id" id="butik_emas_id">
                <input type="hidden" name="item_id" id="item_id">
                <label for="leiBuyPrice"><b>Insert your PIN first</b></label>
                <input type="password" class="form-control" id="pin_modal" name="pin_modal" placeholder="PIN Number">
                <div class="alert-msg" style="display: none; margin-top:3px;"></div>
                <button type="button" class="btn btn-success" onclick="checkPIN()" style="margin-top: 5px;">Check PIN</button>
              </div>

              <span class="after_pin" style="display: none;">
                  <div class="form-group" style="margin-bottom: 20px; ">
                    <label for="leiBuyPrice"><b>LEI Buy Price</b></label>
                    <input type="number" class="form-control" id="leiBuyPrice" name="buy_price" placeholder="buy price" value="{{ $buy->buy_price }}">
                  </div>
                  <div class="form-group">
                    <label for="unitPrice"><b>Unit Price/Gram</b></label>
                    <input type="number" class="form-control" id="unitPrice" name="unit_price" placeholder="unit price" onchange="unitPriceCount()">
                  </div>
                  <div class="form-group">
                    <label for="unitPrice"><b>Weight</b></label>
                    <input type="number" class="form-control" id="weight_modal" name="weight_modal" placeholder="weight" disabled>
                  </div>
                  <div class="form-group">
                    <label for="unitPrice"><b>Quantity</b></label>
                    <input type="number" class="form-control" id="quantity_modal" name="quantity_modal" placeholder="quantity" disabled>
                  </div>
                  <div class="form-group">
                    <label for="unitPrice"><b>Total Price</b></label>
                    <input type="number" class="form-control" id="total_modal" name="total_modal" placeholder="total" disabled>
                  </div>
              </span>
          </div>
          <div class="modal-footer after_pin" style="display: none;">
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            <button class="btn btn-primary">Save changes</button>
          </div>
        </form>
    </div>
  </div>
</div>
@endsection

@section("scripts")
<script type="text/javascript">
	$(document).ready(function(){
        @if($buy->payment_method == 'transfer')
		  ajax_get_balance();
        @endif

        $('.form-calculate').change(function() {
            console.log($('#stock_' + this.name).html());
            calculation_topup_request();            
        });
        $('.form-calculate').keyup(function() {
            let stock = $('#stock_' + this.name).html();
            if(this.value > stock) {
                $('#warning_msg').fadeIn();
                return false;
            }
            else {
                $('#warning_msg').fadeOut();
            }
            console.log($('#stock_' + this.name).html());
            calculation_topup_request();            
        });
	});

    function calculation_topup_request() {
        let n_100000 = parseInt($('#f_n_100000').val() ? $('#f_n_100000').val() : 0) * 100000;
        let n_50000 = parseInt($('#f_n_50000').val() ? $('#f_n_50000').val() : 0) * 50000;
        let n_20000 = parseInt($('#f_n_20000').val() ? $('#f_n_20000').val() : 0) * 20000;
        let n_10000 = parseInt($('#f_n_10000').val() ? $('#f_n_10000').val() : 0) * 10000;
        let n_5000 = parseInt($('#f_n_5000').val() ? $('#f_n_5000').val() : 0) * 5000;
        let n_2000 = parseInt($('#f_n_2000').val() ? $('#f_n_2000').val() : 0) * 2000;
        let n_1000 = parseInt($('#f_n_1000').val() ? $('#f_n_1000').val() : 0) * 1000;
        let n_500 = parseInt($('#f_n_500').val() ? $('#f_n_500').val() : 0) * 500;
        let n_200 = parseInt($('#f_n_200').val() ? $('#f_n_200').val() : 0) * 200;
        let n_100 = parseInt($('#f_n_100').val() ? $('#f_n_100').val() : 0) * 100;

        let total = n_100000 + n_50000 + n_20000 + n_10000 + n_5000 + n_2000 + n_1000 + n_500 + n_200 + n_100;
        $('#total_disburse').html(new Intl.NumberFormat().format(total));
        if(total == parseInt($('#final_disburse').val())) {
            $('.btn_approval').prop('disabled', false);
            $('#match_nominal').fadeIn();

        }
        else {
            $('.btn_approval').prop('disabled', true);
            $('#match_nominal').hide();                
        }
    }

	function ajax_get_balance()
	{
		$.ajax({
			url: web_url + '/api/iris/get_balance_butikemas',
			method: "GET",
			headers: {
				'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
			},
		})
		.done(function(response) {
			$('.result-ajax-balance').eq(0).html(response.txt_balance);

			irisbalance = response.txt_balance.replace(/^Rp. /,"").replace(/[,]/, "").replace(/[,-]/g,"");
			$('#table_confirmation').data('irisbalance', irisbalance);

		}).error(function(response) {
			alert('Gagal mengambil data saldo iris')
		});


		return false;
	}

    function editTransaction(value) {
        let data = JSON.parse(value);
        $('#butik_emas_id').val({{ $buy->id }});
        $('#item_id').val(data.id);
        $('#unitPrice').val(data.unit_price/data.weight);
        $('#weight_modal').val(data.weight);
        $('#quantity_modal').val(data.quantity);
        $('#total_modal').val(data.total_price);
        $('#editTransactionModal').modal('show');
        $('.alert-msg').hide();
        $('#pin_modal_form').show();
        $('.after_pin').hide();
        $('#pin_modal').val('');
        setTimeout(function(){ 
            document.getElementById("pin_modal").focus();
        }, 500);
    }

    function unitPriceCount() {
        let price_per_gram = $('#unitPrice').val();
        let weight = $('#weight_modal').val();
        let qty = $('#quantity_modal').val();
        let total = price_per_gram * weight * qty;
        $('#total_modal').val(total);
    }

    function checkPIN() {
        let pin = $('#pin_modal').val();
        if(pin.length == 0) {
            $('.alert-msg').html('PIN tidak boleh kosong');
            $('.alert-msg').fadeIn();
            document.getElementById("pin_modal").focus();
            return false;
        }
        else if(pin.length < 6) {
            $('.alert-msg').html('PIN minimal 6 karakter');
            $('.alert-msg').fadeIn();
            document.getElementById("pin_modal").focus();
            return false;
        }
        $('.alert-msg').hide();
        $.ajax({
            url: '/check/pin',
            method: "POST",
            headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
            data: {
                "pin" : pin
            },
            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();
                    $("#pin_modal").val('');
                    document.getElementById("pin_modal").focus();
                    return false;
                }
                $('.alert-msg').hide();
                $('#pin_modal_form').hide();
                $('.after_pin').fadeIn();
            }
        });
    }


    @if($buy->status != (\App\Models\Butik_emas_buy_temp_model::STATUS)["processing"]["ID"])
        @if($buy->status == (\App\Models\Butik_emas_buy_temp_model::STATUS)["waiting_approval"]["ID"])
            $("#form .btn-create-iris").on("click", function() {
                var formData = new FormData($('#form')[0]);
                formData.append("pin", btoa($(".input-pin").val()));

                $("#form").find("button").attr("disabled", true);
                $.ajax({
                    url: '{{ $buy->id }}/create_iris',
                    type : 'POST',
                    data :formData,
                    contentType: false,
                    processData: false,
                    headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },            
                    success: function(response) {
                        alert("Your data will be processed immediately");
                        location.reload();
                    },
                    error: function(response) {
                        $("#form").find("button").attr("disabled", false);
                        $("#form")[0].reset();
                        var response = response.responseJSON;
                        alert(response.error);
                    }
                });
                return false;
            })
        @endif

        $("#form .btn-reject").on("click", function() {
            var formData = new FormData($('#form')[0]);
            formData.append("pin", btoa($(".input-pin").val()));

            $("#form").find("button").attr("disabled", true);
            $.ajax({
                url: '{{ $buy->id }}/reject',
                type : 'POST',
                data :formData,
                contentType: false,
                processData: false,
                headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
                success: function(response) {
                    alert("Reject success");
                    location.reload();
                },
                error: function(response) {
                    $("#form").find("button").attr("disabled", false);
                    $("#form")[0].reset();
                    var response = response.responseJSON;
                    alert(response.error);
                }
            });
            return false;
        })
    @endif
</script>
@endsection