@extends('layouts.appNew')
@section('content')
<!--begin::Toolbar-->
<div class="toolbar py-5 pb-lg-15" id="kt_toolbar">
	<!--begin::Container-->
	<div id="kt_toolbar_container" class="container-xxl d-flex flex-stack flex-wrap">
		<!--begin::Page title-->
		<div class="page-title d-flex flex-column me-3">
			<!--begin::Title-->
			<h1 class="d-flex text-white fw-bold my-1 fs-3">Wallet Deposit</h1>
			<!--end::Title-->
		</div>
		<!--end::Page title-->
		<!--begin::Actions-->
		<!-- <div class="d-flex align-items-center py-3 py-md-1">
			<a href="{{ route('depositWallet.history') }}" data-bs-theme="light" class="btn bg-body btn-active-color-primary" data-bs-target="#kt_modal_create_app" id="kt_toolbar_primary_button">Wallet Deposit History</a>
		</div> -->
		<!--end::Actions-->
	</div>
	<!--end::Container-->
</div>
<!--end::Toolbar-->
<!--begin::Container-->
<div id="kt_content_container" class="d-flex flex-column-fluid align-items-start container-xxl">
	<!--begin::Post-->
	<div class="content flex-row-fluid" id="kt_content">
		<div class="card mb-5 mb-xxl-8">
			<div class="card-body pt-9 pb-0">
				<!--begin::Details-->
				<div class="d-flex flex-wrap flex-sm-nowrap">
					<!--begin::Info-->
					<div class="flex-grow-1">
						<!--begin::Title-->
						<div>
							@if(count($errors) > 0)
						      <div class="alert alert-danger">
						          <ul>
						              @foreach($errors->all() as $error)
						                  <li>{{$error}}</li>
						              @endforeach
						          </ul>
						      </div>
						    @endif
							<!--begin::Form-->
							<form action="{{ route('depositWallet.store') }}" class="form mb-15" method="post" enctype="multipart/form-data" id="kt_contact_form">
								@csrf		
								<!--begin::Input group-->
									<div class="row mb-10">
										<h1>New deposit to your Wallet</h1>
										@foreach($paymentMethod as $row)
										<div class="col-md-3 d-flex" style="margin: 30px;border: 1px solid #e2e6f9;padding: 30px;border-radius: 20px;">
											<label class="btn d-flex text-start p-6" data-kt-button="true">
											<!--begin::Radio-->
												<span class="form-check form-check-custom form-check-solid form-check-sm align-items-start mt-1">
													<input class="form-check-input" type="radio" name="payment_method" value="{{$row->id}}" />
												</span>
											<!--end::Radio-->
												<span class="ms-5">
													<img src="{{url('/logo/'.$row->image)}}">
														@if($row->id == 4 || $row->id == 5 || $row->id == 6 || $row->id == 7 || $row->id == 8 || $row->id == 9)
														<span style="margin-top: 9px; margin-left: 9px;"> {{$row->name}} </span>
														@endif
												</span>
											</label>
										</div>
										@endforeach
									</div>
								<!--end::Input group-->	
								<!--begin::Input group-->
									<div class="row mb-10">
										<h1>Enter the amount ₹</h1>
											<input type="text" class="form-control form-control-solid" placeholder="Enter your amount" id="amount" name="amount" style="border: 1px solid #e2e6f9;" />
									</div>	
								<!--end::Input group-->
								<!--begin::Input group-->
									<div class="row mb-10">
										<h1>We will send to your dollar in wallet</h1>
											<input type="text" class="form-control form-control-solid" name="finalamounttobank" id="finalamounttobank" disabled value="0.000000" style="border: 1px solid #e2e6f9;" />
										
									</div>	
								<!--end::Input group-->
								<!--begin::Submit-->
									<button type="submit" class="btn btn-success" id="kt_contact_submit_button">
										<!--begin::Indicator label-->
										<span class="indicator-label">Deposit</span>
										<!--end::Indicator label-->
										<!--begin::Indicator progress-->
										<span class="indicator-progress">Please wait... 
										<span class="spinner-border spinner-border-sm align-middle ms-2"></span></span>
										<!--end::Indicator progress-->
									</button>
									<a href="{{ route('home') }}" class="btn btn-primary me-2">Back</a>
								<!--end::Submit-->			
							</form>
							<!--end::Form-->
						</div>
						<!--end::Title-->
					</div>
					<!--end::Info-->
				</div>
				<!--end::Details-->
			</div>
		</div>
	</div>
	<!--end::Post-->
</div>
<!--end::Container-->
<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>

<script>
	$(document).ready(function () {
		$('#amount').on('keyup input', function() {
            
            var amount = $(this).val();
            var payment = $('input[name="payment_method"]:checked').val();
            if(payment){
            	if(payment == 1 || payment == 2 || payment == 3)
            	{
            		var data = '$ ' + amount / 80;
            	}
            	if(payment == 4)
            	{
            		var data = '$ ' + amount * 0.00000031;
            	}
            	if(payment == 5)
            	{
            		var data = '$ ' + amount * 0.0000054;
            	}
            	if(payment == 6)
            	{
            		var data = '$ ' + amount * 0.01149425;
            	}
            	if(payment == 7)
            	{
            		var data = '$ ' + amount * 1.20;
            	}
            	if(payment == 8)
            	{
            		var data = '$ ' + amount * 0.16;
            	}
            	if(payment == 9)
            	{
            		var data = '$ ' + amount * 0.00019;
            	}
            	if(payment == 10)
            	{
            		var data = '$ ' + amount / 80;
            	}
            	if(payment == 11)
            	{
            		var data = '$ ' + amount / 80;
            	}
            	$('#finalamounttobank').empty();
            	$('#finalamounttobank').val(data);
            }else{
            	alert('Please select payment method.');
            }
			
		});
	});
</script>
@endsection