{% extends "base.html" %}
{% block title %}دراساتي في السوق{% endblock %}
{% block content %}
<div class="max-w-6xl mx-auto px-4 py-8">
    <div class="flex items-center justify-between mb-8">
        <div>
            <h1 class="text-2xl font-serif font-bold text-white flex items-center gap-3">
                <span class="text-gold-400">&#9670;</span> دراساتي في السوق
            </h1>
            <p class="text-sm text-slate-400 mt-1">إدارة دراساتك المعروضة في السوق</p>
        </div>
        <div class="flex items-center gap-3">
            <a href="{{ url_for('marketplace.my_inquiries') }}" class="text-sm text-slate-400 hover:text-gold-400 transition">الاستفسارات الواردة</a>
            <a href="{{ url_for('marketplace.create') }}" class="bg-gold-500/20 border border-gold-500/30 text-gold-400 px-4 py-2 rounded-lg text-sm hover:bg-gold-500/30 transition">+ عرض دراسة جديدة</a>
        </div>
    </div>

    <!-- Stats -->
    <div class="grid grid-cols-3 gap-4 mb-8">
        <div class="bg-white/5 border border-white/10 rounded-xl p-4 text-center">
            <div class="text-2xl font-bold text-gold-400">{{ listings|length }}</div>
            <div class="text-xs text-slate-500">دراسة معروضة</div>
        </div>
        <div class="bg-white/5 border border-white/10 rounded-xl p-4 text-center">
            <div class="text-2xl font-bold text-emerald-400">{{ "%.2f"|format(total_revenue) }}</div>
            <div class="text-xs text-slate-500">إجمالي الإيرادات</div>
        </div>
        <div class="bg-white/5 border border-white/10 rounded-xl p-4 text-center">
            <div class="text-2xl font-bold text-blue-400">{{ total_inquiries }}</div>
            <div class="text-xs text-slate-500">استفسار وارد</div>
        </div>
    </div>

    {% if listings %}
    <div class="space-y-4">
        {% for listing in listings %}
        <div class="bg-white/5 border border-white/10 rounded-xl p-5 flex items-center justify-between gap-4">
            <div class="flex-1 min-w-0">
                <div class="flex items-center gap-2 mb-1">
                    <span class="px-2 py-0.5 rounded-full text-[10px] font-medium bg-{{ listing.goal_color }}-500/20 text-{{ listing.goal_color }}-400">{{ listing.goal_label }}</span>
                    {% if listing.approval_status == 'pending' %}
                    <span class="px-2 py-0.5 rounded-full text-[10px] font-medium bg-yellow-500/20 text-yellow-400">قيد المراجعة</span>
                    {% elif listing.approval_status == 'rejected' %}
                    <span class="px-2 py-0.5 rounded-full text-[10px] font-medium bg-red-500/20 text-red-400">مرفوض</span>
                    {% elif listing.is_active %}
                    <span class="px-2 py-0.5 rounded-full text-[10px] font-medium bg-emerald-500/20 text-emerald-400">نشط</span>
                    {% endif %}
                    {% if listing.featured %}
                    <span class="text-[10px] text-gold-400">⭐</span>
                    {% endif %}
                </div>
                <h3 class="text-white font-semibold truncate">{{ listing.title or listing.report.project_name }}</h3>
                <div class="flex items-center gap-4 mt-1 text-xs text-slate-500">
                    <span>👁 {{ listing.views }}</span>
                    <span>🛒 {{ listing.purchases }}</span>
                    <span>💬 {{ listing.inquiries|length }}</span>
                    {% if listing.listing_goal in ('sell', 'license') %}
                    <span class="text-gold-400">{{ listing.price }} {{ listing.currency }}</span>
                    {% endif %}
                    {% if listing.avg_rating > 0 %}
                    <span>⭐ {{ listing.avg_rating }}</span>
                    {% endif %}
                </div>
                {% if listing.admin_notes %}
                <div class="mt-2 text-xs text-red-400">ملاحظة الإدارة: {{ listing.admin_notes }}</div>
                {% endif %}
            </div>
            <div class="flex items-center gap-2 shrink-0">
                {% if listing.is_active %}
                <a href="{{ url_for('marketplace.view_listing', listing_id=listing.id) }}" class="text-xs text-slate-400 hover:text-gold-400 transition px-3 py-1.5 bg-white/5 rounded-lg">عرض</a>
                <button onclick="withdrawListing({{ listing.id }})" class="text-xs text-red-400 hover:text-red-300 transition px-3 py-1.5 bg-red-500/10 rounded-lg">سحب</button>
                {% endif %}
            </div>
        </div>
        {% endfor %}
    </div>
    {% else %}
    <div class="text-center py-16">
        <div class="text-4xl mb-4">📊</div>
        <p class="text-slate-400 mb-2">لم تعرض أي دراسة بعد</p>
        <a href="{{ url_for('marketplace.create') }}" class="text-gold-400 text-sm hover:underline">عرض دراستك الأولى</a>
    </div>
    {% endif %}
</div>

<script>
function withdrawListing(id) {
    if (!confirm('هل تريد سحب هذه الدراسة من السوق؟')) return;
    fetch('/marketplace/edit/' + id, {
        method: 'POST',
        headers: {'Content-Type': 'application/json'},
        body: JSON.stringify({action: 'withdraw'})
    }).then(r => r.json()).then(() => location.reload());
}
</script>
{% endblock %}