{% extends "base.html" %}

{% block title %}کیف پول{% endblock %}

{% block content %}
  <section class="card">
    <h1>کیف پول کاربر</h1>
    <p class="muted">صاحب کیف: {{ wallet.owner_name }}</p>
    <div class="wallet-balance">{{ "{:,}".format(wallet.balance) }} تومان</div>
  </section>

  <section class="card">
    <h2>شارژ کیف پول</h2>
    <p class="muted">مبلغ را وارد کنید و روی دکمه شارژ بزنید تا به درگاه پرداخت هدایت شوید.</p>
    <form action="{{ url_for('web.wallet_charge') }}" method="post" class="row">
      <input
        type="number"
        name="amount"
        min="1000"
        step="1000"
        placeholder="مثلا 200000"
        required
      />
      <button type="submit">شارژ کیف پول</button>
    </form>
  </section>

  <section class="card">
    <h2>تراکنش های اخیر</h2>
    {% if orders %}
      <table>
        <thead>
          <tr>
            <th>شماره مرجع</th>
            <th>مبلغ</th>
            <th>وضعیت</th>
            <th>اعتباردهی</th>
            <th>جزئیات</th>
          </tr>
        </thead>
        <tbody>
          {% for order in orders %}
            <tr>
              <td>{{ order.order_ref }}</td>
              <td>{{ "{:,}".format(order.amount) }}</td>
              <td>{{ order.status }}</td>
              <td>
                {% if order.credited %}
                  <span class="ok">انجام شد</span>
                {% else %}
                  <span class="bad">خیر</span>
                {% endif %}
              </td>
              <td><a href="{{ url_for('web.order_status', order_ref=order.order_ref) }}">مشاهده</a></td>
            </tr>
          {% endfor %}
        </tbody>
      </table>
    {% else %}
      <p class="muted">هنوز تراکنشی وجود ندارد.</p>
    {% endif %}
  </section>

  {% if badge_script_url %}
    <section class="card">
      <h2>نماد اعتماد</h2>
      <div id="payexa-verification-badge-1"></div>
      <script async src="{{ badge_script_url | e }}"></script>
    </section>
  {% endif %}
{% endblock %}