{% extends "base.html" %}

{% block title %}Admin Dashboard - ScanLook{% endblock %}

{% block content %}
<div class="dashboard-container">
    <!-- Mode Selector -->
    <div class="mode-selector">
    <a href="{{ url_for('home') }}" class="btn btn-secondary btn-sm">
        <i class="fa-solid fa-arrow-left"></i> Back to Home
    </a>
    <button class="mode-btn mode-btn-active" data-href="{{ url_for('admin_dashboard') }}">
        👔 Admin Console
    </button>
    <button class="mode-btn" data-href="{{ url_for('staff_mode') }}">
        📦 Scanning Mode
    </button>
    </div>

    <script>
    document.querySelectorAll('.mode-selector button').forEach(btn => {
        btn.addEventListener('click', function() {
            window.location.href = this.getAttribute('data-href');
        });
    });
    </script>

    <div class="dashboard-header">
        <div class="header-left">
            <h1 class="page-title">Admin Dashboard</h1>
            <label class="filter-toggle">
                <input type="checkbox" id="showArchived" {% if show_archived %}checked{% endif %} onchange="toggleArchived()">
                <span class="filter-label">Show Archived</span>
            </label>
        </div>
        <a href="{{ url_for('sessions.create_session') }}" class="btn btn-primary">
            <span class="btn-icon">+</span> New Session
        </a>
    </div>

    <script>
    function toggleArchived() {
        const checked = document.getElementById('showArchived').checked;
        window.location.href = '{{ url_for("admin_dashboard") }}' + (checked ? '?show_archived=1' : '');
    }
    </script>

    {% if sessions %}
        <div class="sessions-grid">
            {% for session in sessions %}
            <div class="session-card {% if session.status == 'archived' %}session-archived{% endif %}">
                <div class="session-card-header">
                    <h3 class="session-name">
                        {{ session.session_name }}
                        {% if session.status == 'archived' %}<span class="archived-badge">ARCHIVED</span>{% endif %}
                    </h3>
                    <span class="session-type-badge session-type-{{ session.session_type }}">
                        {{ 'Full Physical' if session.session_type == 'full_physical' else 'Cycle Count' }}
                    </span>
                </div>

                <div class="session-stats">
                    <div class="stat-item">
                        <div class="stat-value">{{ session.total_locations or 0 }}</div>
                        <div class="stat-label">Total Locations</div>
                    </div>
                    <div class="stat-item">
                        <div class="stat-value">{{ session.completed_locations or 0 }}</div>
                        <div class="stat-label">Completed</div>
                    </div>
                    <div class="stat-item">
                        <div class="stat-value">{{ session.in_progress_locations or 0 }}</div>
                        <div class="stat-label">In Progress</div>
                    </div>
                </div>

                <div class="session-meta">
                    <div class="meta-item">
                        <span class="meta-label">Created:</span>
                        <span class="meta-value">{{ session.created_timestamp[:16] }}</span>
                    </div>
                    <div class="meta-item">
                        <span class="meta-label">By:</span>
                        <span class="meta-value">{{ session.created_by_name }}</span>
                    </div>
                </div>

                <div class="session-actions">
                    <a href="{{ url_for('sessions.session_detail', session_id=session.session_id) }}" class="btn btn-secondary btn-block">
                        View Details
                    </a>
                </div>
            </div>
            {% endfor %}
        </div>
    {% else %}
        <div class="empty-state">
            <div class="empty-icon">📋</div>
            <h2 class="empty-title">No Active Sessions</h2>
            <p class="empty-text">Create a new count session to get started</p>
            <a href="{{ url_for('sessions.create_session') }}" class="btn btn-primary">
                Create First Session
            </a>
        </div>
    {% endif %}
</div>
{% endblock %}