{% extends 'panel/base.html' %}
{% load static %}
{% block content %}
<div class="d-flex justify-content-between align-items-center mb-4">
    <h2>مدیریت قوانین هوشمند (Smart Rules)</h2>
</div>

<!-- فرم افزودن قانون جدید -->
<div class="card shadow-sm mb-4 border-0">
    <div class="card-header bg-primary text-white">
        <h5 class="mb-0"><i class="fa-solid fa-wand-magic-sparkles me-2"></i> ایجاد قانون جدید</h5>
    </div>
    <div class="card-body">
        <form method="post" action="{% url 'smart_rules' cafe_slug %}">
            {% csrf_token %}
            <input type="hidden" name="action" value="add">
            
            <div class="row g-3">
                <div class="col-md-6">
                    <label class="form-label">نام قانون</label>
                    <input type="text" name="name" class="form-control" placeholder="مثلا: تخفیف وفاداری قهوه" required>
                </div>
                <div class="col-md-6">
                    <label class="form-label">نوع قانون</label>
                    <select name="rule_type" id="ruleTypeSelect" class="form-select" onchange="toggleRuleFields()">
                        <option value="recommend">پیشنهاد محصول جدید</option>
                        <option value="discount">اعمال تخفیف شخصی</option>
                    </select>
                </div>

                <div class="col-md-6">
                    <label class="form-label text-danger">شرط: اگر این محصول را خرید...</label>
                    <select name="target_food" class="form-select" required>
                        {% for food in foods %}
                            <option value="{{ food.id }}">{{ food.name }}</option>
                        {% endfor %}
                    </select>
                </div>
                <div class="col-md-6">
                    <label class="form-label text-danger">حداقل دفعات خرید (برای فعال شدن)</label>
                    <input type="number" name="min_purchases" class="form-control" value="3" min="1" required>
                </div>

                <!-- بخش متغیر: پیشنهاد محصول -->
                <div class="col-md-12" id="recommendSection">
                    <label class="form-label text-success">نتیجه: این محصول به او پیشنهاد داده شود...</label>
                    <select name="suggested_food" class="form-select">
                        <option value="">-- انتخاب محصول پیشنهادی --</option>
                        {% for food in foods %}
                            <option value="{{ food.id }}">{{ food.name }}</option>
                        {% endfor %}
                    </select>
                </div>

                <!-- بخش متغیر: درصد تخفیف (مخفی به صورت پیش‌فرض) -->
                <div class="col-md-12" id="discountSection" style="display: none;">
                    <label class="form-label text-success">نتیجه: درصد تخفیف روی محصول هدف</label>
                    <div class="input-group">
                        <input type="number" name="discount_percent" class="form-control" placeholder="مثلا 15" min="1" max="100">
                        <span class="input-group-text">%</span>
                    </div>
                </div>
            </div>
            
            <button type="submit" class="btn btn-success mt-4 w-100">ثبت قانون هوشمند</button>
        </form>
    </div>
</div>

<!-- لیست قوانین ثبت شده -->
<div class="card shadow-sm border-0">
    <div class="card-body">
        <h5 class="mb-3">لیست قوانین فعال و غیرفعال</h5>
        <div class="table-responsive">
            <table class="table table-hover align-middle">
                <thead class="table-dark">
                    <tr>
                        <th>نام قانون</th>
                        <th>نوع</th>
                        <th>شرط (هدف + تعداد)</th>
                        <th>نتیجه (پیشنهاد / تخفیف)</th>
                        <th>وضعیت</th>
                        <th>عملیات</th>
                    </tr>
                </thead>
                <tbody>
                    {% for rule in rules %}
                    <tr>
                        <td><strong>{{ rule.name }}</strong></td>
                        <td>
                            {% if rule.rule_type == 'discount' %}
                                <span class="badge bg-info">تخفیف</span>
                            {% else %}
                                <span class="badge bg-warning text-dark">پیشنهاد</span>
                            {% endif %}
                        </td>
                        <td>{{ rule.target_food.name }} <br><small class="text-muted">(حداقل {{ rule.min_purchases }} بار)</small></td>
                        <td>
                            {% if rule.rule_type == 'discount' %}
                                {{ rule.discount_percent }}% تخفیف
                            {% else %}
                                {{ rule.suggested_food.name }}
                            {% endif %}
                        </td>
                        <td>
                            <form method="post" action="{% url 'smart_rules' cafe_slug %}" class="d-inline">
                                {% csrf_token %}
                                <input type="hidden" name="action" value="toggle">
                                <input type="hidden" name="rule_id" value="{{ rule.id }}">
                                <button type="submit" class="btn btn-sm {% if rule.is_active %}btn-success{% else %}btn-secondary{% endif %}">
                                    {% if rule.is_active %}فعال{% else %}غیرفعال{% endif %}
                                </button>
                            </form>
                        </td>
                        <td>
                            <form method="post" action="{% url 'smart_rules' cafe_slug %}" class="d-inline">
                                {% csrf_token %}
                                <input type="hidden" name="action" value="delete">
                                <input type="hidden" name="rule_id" value="{{ rule.id }}">
                                <button type="submit" class="btn btn-sm btn-danger" onclick="return confirm('آیا از حذف این قانون مطمئن هستید؟')">
                                    <i class="fa fa-trash"></i>
                                </button>
                            </form>
                        </td>
                    </tr>
                    {% empty %}
                    <tr>
                        <td colspan="6" class="text-center text-muted py-4">هیچ قانونی ثبت نشده است.</td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>

<!-- اسکریپت تغییر فرم -->
<script>
    function toggleRuleFields() {
        var ruleType = document.getElementById('ruleTypeSelect').value;
        var recSection = document.getElementById('recommendSection');
        var discSection = document.getElementById('discountSection');

        if (ruleType === 'discount') {
            recSection.style.display = 'none';
            discSection.style.display = 'block';
        } else {
            recSection.style.display = 'block';
            discSection.style.display = 'none';
        }
    }
    // اجرای اولیه هنگام لود صفحه
    document.addEventListener("DOMContentLoaded", toggleRuleFields);
</script>
{% endblock %}