{% extends 'base.html' %}
{% block title %}پنل اپراتور{% endblock %}

{% block content %}
<div class="glass-card mb-4 p-3 d-flex justify-content-between align-items-center">
    <h4 class="m-0 fw-bold d-flex align-items-center text-dark">
        <i class="bi bi-person-workspace text-primary me-2 fs-3"></i> 
        داشبورد اپراتور <span class="badge bg-secondary ms-3 rounded-pill">باجه {{ seat.code }}</span>
    </h4>
    <a href="/logout" class="btn btn-outline-danger px-4 rounded-pill fw-bold">
        <i class="bi bi-power me-1"></i> خروج
    </a>
</div>

<div class="row g-4">
    <div class="col-lg-4 col-md-5">
        <div class="glass-card text-center h-100 border-top border-5 {% if current_client %}border-danger{% else %}border-success{% endif %}" style="border-radius: 20px;">
            <h5 class="mb-4 text-muted fw-bold">وضعیت فعلی باجه</h5>
            
            {% if current_client %}
                <div class="display-4 fw-bold text-danger mb-2">مشغول</div>
                <p class="text-muted mb-4">در حال خدمت‌رسانی به مراجعه‌کننده</p>
                <div style="font-size: 5rem; color: #dee2e6;"><i class="bi bi-person-lines-fill"></i></div>
            {% else %}
                <div class="display-4 fw-bold text-success mb-2">آماده</div>
                <p class="text-muted mb-4">می‌توانید نفر بعدی را فراخوانی کنید</p>
                
                <form action="{{ url_for('call_next') }}" method="POST" class="mt-4">
                    <button type="submit" class="btn btn-primary btn-lg w-100 py-4 fs-4 rounded-4 shadow-lg">
                        <i class="bi bi-megaphone-fill me-2"></i> فراخوانی نفر بعد
                    </button>
                </form>
            {% endif %}
        </div>
    </div>
    
    <div class="col-lg-8 col-md-7">
        <div class="glass-card h-100 position-relative">
            <h5 class="mb-4 fw-bold pb-3 border-bottom"><i class="bi bi-card-checklist text-primary me-2"></i> اطلاعات مراجعه‌کننده</h5>
            
            {% if current_client %}
            <div class="row mb-4">
                <div class="col-sm-6 mb-3">
                    <p class="text-muted small mb-1">شماره نوبت</p>
                    <div class="fs-1 fw-bold text-dark">{{ current_client.ticket_number }}</div>
                </div>
                <div class="col-sm-6 mb-3">
                    <p class="text-muted small mb-1">نام مراجعه‌کننده</p>
                    <div class="fs-3 fw-bold">{{ current_client.name }}</div>
                </div>
                <div class="col-12 mt-2">
                    <p class="text-muted small mb-1">خدمت درخواستی</p>
                    <div class="fs-4 badge bg-info text-dark p-3 rounded-3 w-100 text-start">
                        {% if current_client.service_request == 'BOTH' %}هر دو مورد (بارگذاری و تأییدیه){% elif current_client.service_request == 'UPLOAD' %}فقط بارگذاری مدرک{% else %}فقط تأییدیه تحصیلی{% endif %}
                    </div>
                </div>
            </div>
            
            <hr class="my-4">
            
            <form action="{{ url_for('finish_service', client_id=current_client.id) }}" method="POST" class="d-flex flex-wrap gap-3">
                <button type="submit" name="action" value="COMPLETE" class="btn btn-success btn-lg flex-grow-1 rounded-3 py-3 fw-bold shadow-sm">
                    <i class="bi bi-check2-all me-2"></i> پایان کار و ارجاع
                </button>
                <button type="submit" name="action" value="NO_SHOW" class="btn btn-outline-danger btn-lg rounded-3 py-3 px-4 fw-bold" onclick="return confirm('آیا از ثبت عدم حضور مطمئن هستید؟')">
                    <i class="bi bi-person-x-fill me-1"></i> عدم حضور
                </button>
            </form>
            
            {% else %}
            <div class="text-center text-muted d-flex flex-column justify-content-center align-items-center h-75">
                <i class="bi bi-inbox text-light" style="font-size: 6rem;"></i>
                <h4 class="mt-3">هیچ مراجعه‌کننده‌ای فعال نیست</h4>
                <p>برای دریافت نفر جدید روی دکمه "فراخوانی نفر بعد" کلیک کنید.</p>
            </div>
            {% endif %}
        </div>
    </div>
</div>
{% endblock %}