{% extends 'public/base.html' %}

{# 分类目录条（sticky 顶部导航） #}
{% block cat_nav %}
{% if groups %}
<nav class="cat-nav" aria-label="分类导航">
    <div class="cat-nav-inner">
        {% for category in groups.keys() %}
            <a href="#cat-{{ loop.index }}">{{ category }}</a>
        {% endfor %}
    </div>
</nav>
{% endif %}
{% endblock %}

{% block content %}
    {% if not groups %}
        <div class="empty">
            <i class="layui-icon layui-icon-face-surprised" style="font-size:48px;color:#ccc;"></i>
            <p>暂无导航数据，请先在后台【系统管理 → 导航管理】添加。</p>
        </div>
    {% else %}
        {% for category, items in groups.items() %}
            {% set cat_id = 'cat-' ~ loop.index %}
            <section class="section" id="{{ cat_id }}">
                <div class="section-header">
                    <h2>{{ category }}</h2>
                    <div class="meta">
                        共 {{ items|length }} 个 ·
                        <a href="{{ url_for('public_nav.category_detail', name=category) }}">查看全部 →</a>
                    </div>
                </div>
                <div class="grid">
                    {% for item in items %}
                        <a class="card"
                           href="{{ item.url }}"
                           data-nav-id="{{ item.id }}"
                           {% if item.is_external %}target="_blank" rel="noopener noreferrer"{% endif %}>
                            <div class="icon-wrap">
                                <i class="layui-icon {{ item.icon }}"></i>
                            </div>
                            <div class="card-body">
                                <div class="title-row">
                                    <div class="title" title="{{ item.title }}">{{ item.title }}</div>
                                    {% if item.is_external %}
                                    <span class="ext-tag" title="外部链接"><i class="layui-icon layui-icon-link"></i></span>
                                    {% endif %}
                                </div>
                                <div class="desc">{{ item.description or '暂无描述' }}</div>
                                <div class="url" title="{{ item.url }}">{{ item.url }}</div>
                                <div class="visit-count" data-nav-visit="{{ item.visit_count or 0 }}">
                                    {%- set vc = item.visit_count or 0 -%}
                                    {%- if vc >= 3 -%}访问 {{ '{:,}'.format(vc) }}
                                    {%- elif vc > 0 -%}新
                                    {%- else -%}新
                                    {%- endif -%}
                                </div>
                            </div>
                            <div class="card-arrow"><i class="layui-icon layui-icon-right"></i></div>
                        </a>
                    {% endfor %}
                </div>
            </section>
        {% endfor %}
    {% endif %}
{% endblock %}