@extends("admin.layouts.sellermastersoyuz")
@section('title', __('Pay for Ad'))
@section('body')
@component('seller.components.breadcumb', ['secondactive' => 'active'])
  @slot('heading') {{ __('Pay for Ad') }} @endslot
  @slot('menu1') {{ __('Ads') }} @endslot
@endcomponent

<div class="contentbar">
  <div class="row">
    <div class="col-lg-6 offset-lg-3">
      <div class="card m-b-30">
        <div class="card-header">
          <h5 class="box-title">{{ __('Complete Payment') }}</h5>
        </div>
        <div class="card-body">
          <p><b>{{ __('Title') }}:</b> {{ $ad->title }}</p>
          <p><b>{{ __('Duration') }}:</b> {{ (int) $ad->ad_duration_days }} {{ __('days') }}</p>
          <p><b>{{ __('Amount') }}:</b> {{ $ad->ad_currency ?: 'INR' }} {{ number_format((float) $ad->ad_amount, 2) }}</p>
          <p><b>{{ __('Current status') }}:</b> {{ ucfirst($ad->ad_payment_status) }}</p>

          @if(session('error'))
            <div class="alert alert-danger">{{ session('error') }}</div>
          @endif

          @if($ad->ad_payment_status == 'paid')
            <div class="alert alert-success">{{ __('Payment already completed.') }}</div>
            <a href="{{ route('seller.shorts.index') }}" class="btn btn-primary">{{ __('Back to my ads') }}</a>
          @else
            <hr>

            @if($razorpayKey && $razorpayOrderId)
              <button id="payBtn" type="button" class="btn btn-success btn-block">
                <i class="feather icon-credit-card mr-2"></i>{{ __('Pay with Razorpay') }} — {{ $ad->ad_currency ?: 'INR' }} {{ number_format((float) $ad->ad_amount, 2) }}
              </button>

              <form id="rzpForm" action="{{ route('seller.shorts.pay.confirm', $ad->id) }}" method="POST" style="display:none;">
                @csrf
                <input type="hidden" name="payment_method" value="Razorpay">
                <input type="hidden" name="razorpay_payment_id" id="razorpay_payment_id">
                <input type="hidden" name="razorpay_order_id" id="razorpay_order_id" value="{{ $razorpayOrderId }}">
                <input type="hidden" name="razorpay_signature" id="razorpay_signature">
              </form>

              <hr>
              <details>
                <summary class="text-muted">{{ __('Or record payment manually (bank/manual)') }}</summary>
                <form action="{{ route('seller.shorts.pay.confirm', $ad->id) }}" method="POST" class="mt-3">
                  @csrf
                  <div class="form-group">
                    <label>{{ __('Payment Method') }}</label>
                    <select name="payment_method" class="form-control" required>
                      <option value="Bank Transfer">{{ __('Bank Transfer') }}</option>
                      <option value="Manual">{{ __('Manual') }}</option>
                    </select>
                  </div>
                  <div class="form-group">
                    <label>{{ __('Transaction ID / Reference') }}</label>
                    <input type="text" name="txn_id" class="form-control" required>
                  </div>
                  <button type="submit" class="btn btn-secondary">{{ __('Submit Manual Payment') }}</button>
                </form>
              </details>
            @else
              <div class="alert alert-warning">
                {{ __('Razorpay is not configured. Submit a manual reference below.') }}
              </div>
              <form action="{{ route('seller.shorts.pay.confirm', $ad->id) }}" method="POST">
                @csrf
                <div class="form-group">
                  <label>{{ __('Payment Method') }} <span class="text-danger">*</span></label>
                  <select name="payment_method" class="form-control" required>
                    <option value="Bank Transfer">{{ __('Bank Transfer') }}</option>
                    <option value="Manual">{{ __('Manual') }}</option>
                  </select>
                </div>
                <div class="form-group">
                  <label>{{ __('Transaction ID / Reference') }} <span class="text-danger">*</span></label>
                  <input type="text" name="txn_id" class="form-control" required>
                </div>
                <button type="submit" class="btn btn-success">{{ __('Mark as Paid') }}</button>
              </form>
            @endif

            <a href="{{ route('seller.shorts.index') }}" class="btn btn-link">{{ __('Cancel') }}</a>
          @endif
        </div>
      </div>
    </div>
  </div>
</div>

@if($ad->ad_payment_status != 'paid' && $razorpayKey && $razorpayOrderId)
<script src="https://checkout.razorpay.com/v1/checkout.js"></script>
<script>
  document.getElementById('payBtn').addEventListener('click', function () {
    var options = {
      key:      @json($razorpayKey),
      amount:   {{ (int) round(((float) $ad->ad_amount) * 100) }},
      currency: @json($ad->ad_currency ?: 'INR'),
      name:     @json(config('app.name')),
      description: @json('Short Ad #' . $ad->id . ' — ' . (int) $ad->ad_duration_days . ' days'),
      order_id: @json($razorpayOrderId),
      prefill: {
        name:    @json($user->name ?? ''),
        email:   @json($user->email ?? ''),
        contact: @json((string)($user->mobile ?? ''))
      },
      theme: { color: "#3399cc" },
      handler: function (response) {
        document.getElementById('razorpay_payment_id').value = response.razorpay_payment_id;
        document.getElementById('razorpay_signature').value  = response.razorpay_signature;
        document.getElementById('rzpForm').submit();
      },
      modal: {
        ondismiss: function () {
          console.log('Payment cancelled by user');
        }
      }
    };
    var rzp = new Razorpay(options);
    rzp.on('payment.failed', function (resp) {
      alert('Payment failed: ' + (resp.error && resp.error.description ? resp.error.description : 'Unknown error'));
    });
    rzp.open();
  });
</script>
@endif
@endsection