@extends('layouts.buddy-screens')

@section('content')

<div class="content-wrapper bgline">
    <div class="container-xxl flex-grow-1 container-p-y">
        <h4 class="fw-bold py-3 mb-4"><span class="text-muted fw-light color-green">Dashboard </span>
        <span class="small-black">Gold Price
                @if(!empty($gold_silver_rate) && isset($gold_silver_rate['result']) && isset($gold_silver_rate['result']['data'])) 
                    {{$gold_silver_rate['result']['data']['rates']['gBuy']}}/Gm
                @endif 
                 <img src="{{asset('/images/right-arrow.png')}}" alt="" class="right-arrow">
            </span>
            <span class="small-black">Silver Price
                @if(!empty($gold_silver_rate) && isset($gold_silver_rate['result']) && isset($gold_silver_rate['result']['data'])) 
                    {{$gold_silver_rate['result']['data']['rates']['sBuy']}}/Gm
                @endif
                <img src="{{asset('/images/right-arrow.png')}}" alt="" class="right-arrow">
            </span>
            <a class="btn right-align">Buy/Sell</a>
        </h4>

        <div style="display:none">
            <span>Gold Price
                @if(!empty($gold_silver_rate) && isset($gold_silver_rate['result']) && isset($gold_silver_rate['result']['data'])) 
                    {{$gold_silver_rate['result']['data']['rates']['gBuy']}}/Gm
                @endif
            </span>
<br/>
            <span>Silver Price
                @if(!empty($gold_silver_rate) && isset($gold_silver_rate['result']) && isset($gold_silver_rate['result']['data'])) 
                    {{$gold_silver_rate['result']['data']['rates']['sBuy']}}/Gm
                @endif
            </span>
        </div>
        <div class="row">
        
        <div class="col-md-6 mt-3 pt-3">
        <div id="exTab2" class="tabpanel">	
        <h4 class="fw-bold"><span class="text-muted fw-light color-green">Select Metal/Amount</span></h4>
<!-- <ul class="nav nav-tabs">
			<li class="active">
        <a  href="#1" data-toggle="tab">Buy</a>
			</li>
			<li><a href="#2" data-toggle="tab">Sell</a>
			</li>
			<li><a href="#3" data-toggle="tab">Redeem</a>
			</li>
		</ul> -->

			<div class="tab-content ">
			  <div class="tab-pane active" id="1">
                <div class="d-grid">
              <label for="Select Metal">Select Metal</label>
              <select name="Metal" id="Metal">
                <option value="Gold">Gold</option>
                <option value="Silver">Silver</option>
                </select>
                <span class="bg-gray">Live Buy Price ₹ 7995.39 /gm</span>
				</div>
                <div class="d-flex">
                    <div>
                <input type="radio" id="Buy" name="fav_language" value="Buy" checked>
                <label for="Buy">Buy in Rupees</label>
                    </div>
                    <div>
                <input type="radio" id="Buy" name="fav_language" value="Buy">
                <label for="Buy">Buy in Rupees</label>
                </div>
                <div>
                <input type="radio" id="Buy" name="fav_language" value="Buy">
                <label for="Buy">Buy in Grams</label>
                </div>
                </div>
                <h4 class="d-flex"> = 2.255 gm <span> ₹ 18,236.00</span></h4>
                
                <a class="btn mt-3" id="openModal">Proceed to Confirmation</a>
                </div>
				
			</div>
  </div>
        </div>
        <div class="col-md-4  d-flex-justify">
            
            </div>
         </div>
    </div>
    <div id="modal" class="modal">
      <div class="modal-content">
        <span class="close" id="closeModal">&times;</span>
        <div class="modal-text">
        <h2 class="color-green">Withdrawal Request Submitted Successfully!</h2>
        <p><b>Transaction ID:</b> 123456789</p>
        <p><b>Withdrawal Amount:</b> 2.255 gm/₹ 18,236.00</p>
        <p><b>Transaction Fee:</b> ₹ 1200.00</p>
        <p><b>Total Credited:</b> ₹ 17036.00</p>
        <p><b>Date & Time:</b> 09-01-2025</p>
        </div>
      </div>
    </div>
</div>
<div  class="poweredbyaug" style="text-align: center;background: #fff; line-height: 50px;"><a href="{{url('/digigold-termcondition')}}" style="float: left;padding-left:20px;" target="_blank">Terms and Conditions</a> Powered By Augmont</div>

<link rel="stylesheet" href="{{asset('assets/css/digigold.css')}}" />
<script>
 // Get modal element
var modal = document.getElementById("modal");
// Get open modal button
var openModal = document.getElementById("openModal");
// Get close button
var closeModal = document.getElementById("closeModal");
// Listen for open click
openModal.onclick = function () {
  modal.style.display = "block";
};
// Listen for close click
closeModal.onclick = function () {
  modal.style.display = "none";
};
// Listen for outside click to close modal
window.onclick = function (event) {
  if (event.target === modal) {
    modal.style.display = "none";
  }
};
// Handle form submission
document.getElementById("contactForm").onsubmit = function (event) {
  event.preventDefault(); // Prevent page refresh
  alert("Form submitted successfully!");
  modal.style.display = "none"; // Close modal after submission
};

</script>
@endsection