{% extends "base.html" %}
{% block title %}سفارش‌ها{% endblock %}
{% block page_title %}سفارش‌ها{% endblock %}
{% block content %}

<div style="display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap">
  {% for s,lbl in [('all','همه'),('waiting_confirm','در انتظار'),('confirmed','تأیید شده'),('delivered','تحویل شده'),('rejected','رد شده')] %}
  <a href="{{ url_for('orders', status=s) }}" class="btn {{ 'btn-primary' if status==s else 'btn-blue' }}">{{ lbl }}</a>
  {% endfor %}
</div>

<div class="table-wrap">
  <div class="table-header">
    <h3>📦 سفارش‌ها ({{ orders|length }})</h3>
  </div>
  <table>
    <thead><tr><th>#</th><th>کاربر</th><th>سرویس</th><th>مبلغ</th><th>پرداخت</th><th>وضعیت</th><th>تاریخ</th><th>عملیات</th></tr></thead>
    <tbody>
    {% for o in orders %}
    {% set status_map = {'pending':'badge-pending','waiting_confirm':'badge-waiting','confirmed':'badge-confirmed','rejected':'badge-rejected','delivered':'badge-delivered'} %}
    {% set status_fa = {'pending':'⏳ انتظار رسید','waiting_confirm':'🔍 در بررسی','confirmed':'✅ تأیید','rejected':'❌ رد','delivered':'📦 تحویل'} %}
    {% set pay_fa = {'card':'💳 کارت','wallet':'👛 کیف پول','usdt':'💎 تتر','zarinpal':'🟣 زرین‌پال','free_trial':'🎁 آزمایشی'} %}
    <tr>
      <td style="font-weight:600">#{{ o.id }}</td>
      <td>
        <div style="font-size:13px">{{ o.full_name or '?' }}</div>
        <div style="font-size:11px;color:var(--muted)">@{{ o.username or '?' }}</div>
      </td>
      <td>{{ o.service }}<br><span style="font-size:11px;color:var(--muted)">{{ o.duration }}</span></td>
      <td>{{ "{:,}".format(o.amount) }} ت</td>
      <td style="font-size:12px">{{ pay_fa.get(o.payment_method, o.payment_method or 'کارت') }}</td>
      <td><span class="badge {{ status_map.get(o.status,'') }}">{{ status_fa.get(o.status, o.status) }}</span></td>
      <td style="color:var(--muted);font-size:11px">{{ o.created_at[:10] }}</td>
      <td>
        <div style="display:flex;gap:6px;flex-wrap:wrap">
        {% if o.status == 'waiting_confirm' %}
          <form method="POST" action="{{ url_for('approve_order', order_id=o.id) }}" style="display:inline">
            <button class="btn btn-green" type="submit">✅</button>
          </form>
          <form method="POST" action="{{ url_for('reject_order', order_id=o.id) }}" style="display:inline">
            <button class="btn btn-red" type="submit">❌</button>
          </form>
        {% endif %}
        {% if o.status == 'confirmed' %}
          <button class="btn btn-orange" onclick="openDeliver({{ o.id }})">📦 ارسال اکانت</button>
        {% endif %}
        </div>
      </td>
    </tr>
    {% endfor %}
    {% if not orders %}
    <tr><td colspan="8" style="text-align:center;color:var(--muted);padding:32px">سفارشی یافت نشد</td></tr>
    {% endif %}
    </tbody>
  </table>
</div>

<!-- Modal ارسال اکانت -->
<div class="modal-overlay" id="deliverModal">
  <div class="modal">
    <h3>📦 ارسال اطلاعات اکانت</h3>
    <form method="POST" id="deliverForm">
      <div class="form-group" style="margin-bottom:14px">
        <label>اطلاعات اکانت</label>
        <textarea name="account_info" rows="4" style="width:100%;background:rgba(255,255,255,.06);border:1px solid var(--border);border-radius:10px;padding:10px;color:var(--text);font-family:'Vazirmatn',sans-serif;font-size:13px;outline:none;resize:vertical" placeholder="ایمیل: x@x.com&#10;پسورد: 1234"></textarea>
      </div>
      <div class="form-group">
        <label>تاریخ انقضا</label>
        <input type="date" name="expires_at" required>
      </div>
      <div class="modal-btns">
        <button type="submit" class="btn btn-primary">📤 ارسال</button>
        <button type="button" class="btn btn-red" onclick="closeDeliver()">لغو</button>
      </div>
    </form>
  </div>
</div>

<script>
function openDeliver(id){
  document.getElementById('deliverForm').action='/order/'+id+'/deliver';
  document.getElementById('deliverModal').classList.add('open');
}
function closeDeliver(){
  document.getElementById('deliverModal').classList.remove('open');
}
</script>
{% endblock %}