feat: 实现最新/热门/推荐标签功能

- 移除顶部热门工具排行榜模块
- 在标签下方添加三个tab（最新/热门/推荐）
- 添加is_recommended字段到Site模型
- 创建数据库迁移脚本add_is_recommended.py
- 更新后台管理界面支持推荐标记
- 更新分页链接保持tab状态
- 所有功能已本地测试验证通过

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

app.py

@@ -92,6 +92,7 @@ def create_app(config_name='default'):
         # 获取筛选参数
         tag_slug = request.args.get('tag')
         search_query = request.args.get('q', '').strip()
+        current_tab = request.args.get('tab', 'latest')  # 默认为"最新"
         page = request.args.get('page', 1, type=int)
         per_page = 100  # 每页显示100个站点
 
@@ -110,7 +111,8 @@ def create_app(config_name='default'):
                 pagination = None
                 return render_template('index_new.html', sites=sites, tags=tags,
                                      selected_tag=selected_tag, search_query=search_query,
-                                     pagination=pagination, tag_counts=tag_counts)
+                                     pagination=pagination, tag_counts=tag_counts,
+                                     current_tab=current_tab)
 
         # 搜索功能
         if search_query:
@@ -125,19 +127,25 @@ def create_app(config_name='default'):
                 )
             )
 
-        # 排序并分页
-        query = query.order_by(Site.sort_order.desc(), Site.id.desc())
+        # Tab筛选和排序
+        if current_tab == 'popular':
+            # 热门：按浏览次数倒序
+            query = query.order_by(Site.view_count.desc(), Site.id.desc())
+        elif current_tab == 'recommended':
+            # 推荐：只显示is_recommended=True的
+            query = query.filter_by(is_recommended=True).order_by(Site.sort_order.desc(), Site.id.desc())
+        else:
+            # 最新：按创建时间倒序（默认）
+            query = query.order_by(Site.created_at.desc(), Site.id.desc())
+
+        # 分页
         pagination = query.paginate(page=page, per_page=per_page, error_out=False)
         sites = pagination.items
 
-        # 获取热门工具（按浏览次数排序，最多10个）
-        popular_sites = Site.query.filter_by(is_active=True)\
-            .order_by(Site.view_count.desc()).limit(10).all()
-
         return render_template('index_new.html', sites=sites, tags=tags,
                              selected_tag=selected_tag, search_query=search_query,
                              pagination=pagination, tag_counts=tag_counts,
-                             popular_sites=popular_sites)
+                             current_tab=current_tab)
 
     @app.route('/site/<code>')
     def site_detail(code):
@@ -1349,9 +1357,9 @@ Sitemap: {}sitemap.xml
         column_display_actions = True
         action_disallowed_list = []
 
-        column_list = ['id', 'code', 'name', 'url', 'slug', 'is_active', 'view_count', 'created_at']
+        column_list = ['id', 'code', 'name', 'url', 'slug', 'is_active', 'is_recommended', 'view_count', 'created_at']
         column_searchable_list = ['code', 'name', 'url', 'description']
-        column_filters = ['is_active', 'tags']
+        column_filters = ['is_active', 'is_recommended', 'tags']
         column_labels = {
             'id': 'ID',
             'code': '网站编码',
@@ -1364,13 +1372,14 @@ Sitemap: {}sitemap.xml
             'features': '主要功能',
             'news_keywords': '新闻关键词',
             'is_active': '是否启用',
+            'is_recommended': '是否推荐',
             'view_count': '浏览次数',
             'sort_order': '排序权重',
             'tags': '标签',
             'created_at': '创建时间',
             'updated_at': '更新时间'
         }
-        form_columns = ['name', 'url', 'slug', 'logo', 'short_desc', 'description', 'features', 'news_keywords', 'tags', 'is_active', 'sort_order']
+        form_columns = ['name', 'url', 'slug', 'logo', 'short_desc', 'description', 'features', 'news_keywords', 'tags', 'is_active', 'is_recommended', 'sort_order']
 
         # 自定义编辑/删除文字
         column_extra_row_actions = None

migrations/add_is_recommended.py

@@ -0,0 +1,72 @@
+"""
+数据库迁移脚本: 为sites表添加is_recommended字段
+执行方法: python migrations/add_is_recommended.py
+"""
+import os
+import sys
+
+# 添加项目根目录到sys.path
+sys.path.insert(0, os.path.dirname(os.path.dirname(os.path.abspath(__file__))))
+
+from app import create_app
+from models import db
+
+def upgrade():
+    """添加is_recommended字段"""
+    app = create_app(os.getenv('FLASK_ENV', 'development'))
+
+    with app.app_context():
+        try:
+            # 检查字段是否已存在
+            result = db.session.execute(db.text(
+                "SELECT COLUMN_NAME FROM INFORMATION_SCHEMA.COLUMNS "
+                "WHERE TABLE_NAME = 'sites' AND COLUMN_NAME = 'is_recommended'"
+            ))
+
+            if result.fetchone():
+                print("字段 is_recommended 已存在，跳过迁移")
+                return
+
+            # 添加字段
+            print("开始添加 is_recommended 字段...")
+            db.session.execute(db.text(
+                "ALTER TABLE sites ADD COLUMN is_recommended TINYINT(1) NOT NULL DEFAULT 0 COMMENT '是否推荐'"
+            ))
+            db.session.commit()
+            print("[OK] 成功添加 is_recommended 字段")
+
+        except Exception as e:
+            db.session.rollback()
+            print(f"[ERROR] 迁移失败: {str(e)}")
+            sys.exit(1)
+
+def downgrade():
+    """删除is_recommended字段"""
+    app = create_app(os.getenv('FLASK_ENV', 'development'))
+
+    with app.app_context():
+        try:
+            # 删除字段
+            print("开始删除 is_recommended 字段...")
+            db.session.execute(db.text(
+                "ALTER TABLE sites DROP COLUMN is_recommended"
+            ))
+            db.session.commit()
+            print("✓ 成功删除 is_recommended 字段")
+
+        except Exception as e:
+            db.session.rollback()
+            print(f"✗ 回滚失败: {str(e)}")
+            sys.exit(1)
+
+if __name__ == '__main__':
+    import argparse
+
+    parser = argparse.ArgumentParser(description='数据库迁移: 添加is_recommended字段')
+    parser.add_argument('--downgrade', action='store_true', help='回滚迁移')
+    args = parser.parse_args()
+
+    if args.downgrade:
+        downgrade()
+    else:
+        upgrade()

models.py

@@ -26,6 +26,7 @@ class Site(db.Model):
     features = db.Column(db.Text, comment='主要功能')
     news_keywords = db.Column(db.String(200), comment='新闻获取关键词（用于精准匹配相关新闻）')
     is_active = db.Column(db.Boolean, default=True, comment='是否启用')
+    is_recommended = db.Column(db.Boolean, default=False, nullable=False, comment='是否推荐')
     view_count = db.Column(db.Integer, default=0, comment='浏览次数')
     sort_order = db.Column(db.Integer, default=0, comment='排序权重')
     created_at = db.Column(db.DateTime, default=datetime.now, comment='创建时间')
@@ -52,6 +53,7 @@ class Site(db.Model):
             'features': self.features,
             'news_keywords': self.news_keywords,
             'is_active': self.is_active,
+            'is_recommended': self.is_recommended,
             'view_count': self.view_count,
             'tags': [tag.name for tag in self.tags],
             'created_at': self.created_at.strftime('%Y-%m-%d %H:%M:%S') if self.created_at else None

templates/index_new.html

@@ -44,126 +44,6 @@
         margin-bottom: 0;
     }
 
-    /* 热门工具排行榜 */
-    .popular-section {
-        padding: 0 0 32px 0;
-    }
-
-    .popular-header {
-        display: flex;
-        align-items: center;
-        gap: 12px;
-        margin-bottom: 20px;
-    }
-
-    .popular-title {
-        font-size: 20px;
-        font-weight: 700;
-        color: var(--text-primary);
-        margin: 0;
-        display: flex;
-        align-items: center;
-        gap: 8px;
-    }
-
-    .popular-badge {
-        background: linear-gradient(135deg, #ff6b6b 0%, #ff8e53 100%);
-        color: white;
-        font-size: 18px;
-        padding: 2px 8px;
-        border-radius: 4px;
-    }
-
-    .popular-grid {
-        display: grid;
-        grid-template-columns: repeat(5, 1fr);
-        gap: 16px;
-    }
-
-    .popular-item {
-        background: var(--bg-white);
-        border: 1px solid var(--border-color);
-        border-radius: 12px;
-        padding: 16px;
-        text-decoration: none;
-        transition: all 0.3s;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        text-align: center;
-        position: relative;
-        overflow: hidden;
-    }
-
-    .popular-item:hover {
-        transform: translateY(-4px);
-        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
-        border-color: var(--primary-blue);
-    }
-
-    .popular-rank {
-        position: absolute;
-        top: 8px;
-        left: 8px;
-        width: 24px;
-        height: 24px;
-        background: linear-gradient(135deg, #ffd700 0%, #ffed4e 100%);
-        color: #b8860b;
-        border-radius: 50%;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        font-size: 12px;
-        font-weight: 700;
-        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-    }
-
-    .popular-rank.rank-2 {
-        background: linear-gradient(135deg, #c0c0c0 0%, #e8e8e8 100%);
-        color: #696969;
-    }
-
-    .popular-rank.rank-3 {
-        background: linear-gradient(135deg, #cd7f32 0%, #e9a76f 100%);
-        color: #654321;
-    }
-
-    .popular-rank.rank-other {
-        background: #f1f5f9;
-        color: #64748b;
-    }
-
-    .popular-logo {
-        width: 56px;
-        height: 56px;
-        border-radius: 12px;
-        object-fit: cover;
-        margin-bottom: 12px;
-    }
-
-    .popular-name {
-        font-size: 14px;
-        font-weight: 600;
-        color: var(--text-primary);
-        margin-bottom: 4px;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-        width: 100%;
-    }
-
-    .popular-views {
-        display: flex;
-        align-items: center;
-        gap: 4px;
-        color: #94a3b8;
-        font-size: 12px;
-    }
-
-    .popular-fire {
-        font-size: 16px;
-    }
-
     /* 分类过滤 */
     .categories {
         padding: 32px 0;
@@ -456,30 +336,63 @@
         color: var(--text-secondary);
     }
 
+    /* 排序标签 */
+    .sort-tabs {
+        padding: 24px 0 0 0;
+        border-top: 1px solid var(--border-color);
+        margin-top: 24px;
+    }
+
+    .sort-tabs-container {
+        display: flex;
+        gap: 8px;
+        align-items: center;
+    }
+
+    .sort-tab {
+        padding: 8px 20px;
+        border: 1px solid var(--border-color);
+        border-radius: 50px;
+        background: var(--bg-white);
+        color: var(--text-secondary);
+        text-decoration: none;
+        font-size: 14px;
+        font-weight: 500;
+        transition: all 0.2s;
+        display: inline-flex;
+        align-items: center;
+        gap: 6px;
+        cursor: pointer;
+    }
+
+    .sort-tab:hover {
+        border-color: var(--primary-blue);
+        color: var(--primary-blue);
+        background: rgba(59, 130, 246, 0.05);
+    }
+
+    .sort-tab.active {
+        background: var(--primary-blue);
+        border-color: var(--primary-blue);
+        color: white;
+    }
+
+    .sort-tab .icon {
+        font-size: 14px;
+    }
+
     /* 响应式 */
     @media (max-width: 768px) {
         .hero-title {
             font-size: 40px;
         }
 
-        .popular-grid {
-            grid-template-columns: repeat(2, 1fr);
-            gap: 12px;
-        }
-
-        .popular-logo {
-            width: 48px;
-            height: 48px;
-        }
-
         .tools-grid {
             grid-template-columns: 1fr;
         }
-    }
 
-    @media (min-width: 769px) and (max-width: 1024px) {
-        .popular-grid {
-            grid-template-columns: repeat(3, 1fr);
+        .sort-tabs-container {
+            flex-wrap: wrap;
         }
     }
 </style>
@@ -497,37 +410,6 @@
 
 <div class="main-content">
 
-    <!-- 热门工具排行榜 -->
-    {% if popular_sites and not selected_tag and not search_query %}
-    <div class="popular-section">
-        <div class="popular-header">
-            <h2 class="popular-title">
-                <span class="popular-badge">🔥</span>
-                热门工具排行榜
-            </h2>
-        </div>
-        <div class="popular-grid">
-            {% for site in popular_sites[:10] %}
-            <a href="/site/{{ site.code }}" class="popular-item">
-                <div class="popular-rank {% if loop.index == 1 %}rank-1{% elif loop.index == 2 %}rank-2{% elif loop.index == 3 %}rank-3{% else %}rank-other{% endif %}">
-                    {{ loop.index }}
-                </div>
-                {% if site.logo %}
-                <img src="{{ site.logo }}" alt="{{ site.name }}" class="popular-logo">
-                {% else %}
-                <div class="popular-logo" style="background: linear-gradient(135deg, #0ea5e9 0%, #8b5cf6 100%);"></div>
-                {% endif %}
-                <div class="popular-name">{{ site.name }}</div>
-                <div class="popular-views">
-                    <span class="popular-fire">👁</span>
-                    <span>{% if site.view_count >= 1000 %}{{ (site.view_count / 1000) | round(1) }}k{% else %}{{ site.view_count | default(0) }}{% endif %}</span>
-                </div>
-            </a>
-            {% endfor %}
-        </div>
-    </div>
-    {% endif %}
-
     <!-- 分类过滤 -->
     <div class="categories" id="categories">
         <div class="category-tabs" id="categoryTabs">
@@ -557,6 +439,27 @@
             </div>
             {% endif %}
         </div>
+
+        <!-- 排序标签 -->
+        <div class="sort-tabs">
+            <div class="sort-tabs-container">
+                <a href="/?{% if selected_tag %}tag={{ selected_tag.slug }}&{% endif %}tab=latest"
+                   class="sort-tab {% if not current_tab or current_tab == 'latest' %}active{% endif %}">
+                    <span class="icon">🕐</span>
+                    最新
+                </a>
+                <a href="/?{% if selected_tag %}tag={{ selected_tag.slug }}&{% endif %}tab=popular"
+                   class="sort-tab {% if current_tab == 'popular' %}active{% endif %}">
+                    <span class="icon">🔥</span>
+                    热门
+                </a>
+                <a href="/?{% if selected_tag %}tag={{ selected_tag.slug }}&{% endif %}tab=recommended"
+                   class="sort-tab {% if current_tab == 'recommended' %}active{% endif %}">
+                    <span class="icon">⭐</span>
+                    推荐
+                </a>
+            </div>
+        </div>
     </div>
 
     <!-- 工具网格 -->
@@ -604,7 +507,7 @@
         <div class="pagination">
             <!-- 上一页 -->
             {% if pagination.has_prev %}
-            <a href="?page={{ pagination.prev_num }}{% if selected_tag %}&tag={{ selected_tag.slug }}{% endif %}{% if search_query %}&q={{ search_query }}{% endif %}">
+            <a href="?page={{ pagination.prev_num }}{% if selected_tag %}&tag={{ selected_tag.slug }}{% endif %}{% if search_query %}&q={{ search_query }}{% endif %}{% if current_tab and current_tab != 'latest' %}&tab={{ current_tab }}{% endif %}">
                 <span>◀</span>
             </a>
             {% else %}
@@ -618,7 +521,7 @@
             {% set end_page = [pagination.pages, pagination.page + 2]|min %}
 
             {% if start_page > 1 %}
-            <a href="?page=1{% if selected_tag %}&tag={{ selected_tag.slug }}{% endif %}{% if search_query %}&q={{ search_query }}{% endif %}">1</a>
+            <a href="?page=1{% if selected_tag %}&tag={{ selected_tag.slug }}{% endif %}{% if search_query %}&q={{ search_query }}{% endif %}{% if current_tab and current_tab != 'latest' %}&tab={{ current_tab }}{% endif %}">1</a>
             {% if start_page > 2 %}
             <span>...</span>
             {% endif %}
@@ -628,7 +531,7 @@
                 {% if page_num == pagination.page %}
                 <span class="active">{{ page_num }}</span>
                 {% else %}
-                <a href="?page={{ page_num }}{% if selected_tag %}&tag={{ selected_tag.slug }}{% endif %}{% if search_query %}&q={{ search_query }}{% endif %}">{{ page_num }}</a>
+                <a href="?page={{ page_num }}{% if selected_tag %}&tag={{ selected_tag.slug }}{% endif %}{% if search_query %}&q={{ search_query }}{% endif %}{% if current_tab and current_tab != 'latest' %}&tab={{ current_tab }}{% endif %}">{{ page_num }}</a>
                 {% endif %}
             {% endfor %}
 
@@ -636,12 +539,12 @@
             {% if end_page < pagination.pages - 1 %}
             <span>...</span>
             {% endif %}
-            <a href="?page={{ pagination.pages }}{% if selected_tag %}&tag={{ selected_tag.slug }}{% endif %}{% if search_query %}&q={{ search_query }}{% endif %}">{{ pagination.pages }}</a>
+            <a href="?page={{ pagination.pages }}{% if selected_tag %}&tag={{ selected_tag.slug }}{% endif %}{% if search_query %}&q={{ search_query }}{% endif %}{% if current_tab and current_tab != 'latest' %}&tab={{ current_tab }}{% endif %}">{{ pagination.pages }}</a>
             {% endif %}
 
             <!-- 下一页 -->
             {% if pagination.has_next %}
-            <a href="?page={{ pagination.next_num }}{% if selected_tag %}&tag={{ selected_tag.slug }}{% endif %}{% if search_query %}&q={{ search_query }}{% endif %}">
+            <a href="?page={{ pagination.next_num }}{% if selected_tag %}&tag={{ selected_tag.slug }}{% endif %}{% if search_query %}&q={{ search_query }}{% endif %}{% if current_tab and current_tab != 'latest' %}&tab={{ current_tab }}{% endif %}">
                 <span>▶</span>
             </a>
             {% else %}