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

{% block title %}{{ category }} - {{ site_name }}{% endblock %}

{# 分类详情页只有一个分类，目录条也指向自己即可（避免空目录条） #}
{% block cat_nav %}
<nav class="cat-nav" aria-label="分类导航">
    <div class="cat-nav-inner">
        <a href="{{ url_for('public_nav.index') }}" class="active">← 返回首页</a>
        <a href="#cat-detail" class="active">{{ category }}</a>
    </div>
</nav>
{% endblock %}

{% block content %}
    <section class="section" id="cat-detail">
        <div class="section-header">
            <h2>{{ category }}</h2>
            <div class="meta">共 {{ items|length }} 个</div>
        </div>

        {% if not items %}
            <div class="empty">该分类下暂无导航。</div>
        {% else %}
            <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) }}
                                {%- else -%}新
                                {%- endif -%}
                            </div>
                        </div>
                        <div class="card-arrow"><i class="layui-icon layui-icon-right"></i></div>
                    </a>
                {% endfor %}
            </div>
        {% endif %}
    </section>
{% endblock %}