From 91761b6754b2ca55b5f1a5317c1fc603a76794aa Mon Sep 17 00:00:00 2001
From: Qyir <13521889462@163.com>
Date: Thu, 13 Nov 2025 17:49:48 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E7=9F=AD=E5=89=A7=E7=89=88?=
 =?UTF-8?q?=E6=9D=83=E6=96=B9=E8=AE=A4=E8=AF=81=E9=A1=B5=E9=9D=A2=20?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E7=94=B3=E8=AF=B7=E7=AE=A1=E7=90=86=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E4=B8=8A=E4=BC=A0=E8=87=B3TOS?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 backend/app.py                     |   2 -
 backend/routers/article_routes.py  | 268 ----------
 backend/routers/rank_api_routes.py | 680 +++++++++++++++++++++++++-
 frontend/src/AdminPanel.vue        |  10 +-
 frontend/src/ClaimApplications.vue | 682 ++++++++++++++++++++++++++
 frontend/src/ClaimPage.vue         | 759 +++++++++++++++++++++++++++++
 frontend/src/DramaDetail.vue       |  19 +-
 frontend/src/router/index.js       |  12 +
 8 files changed, 2156 insertions(+), 276 deletions(-)
 delete mode 100644 backend/routers/article_routes.py
 create mode 100644 frontend/src/ClaimApplications.vue
 create mode 100644 frontend/src/ClaimPage.vue

diff --git a/backend/app.py b/backend/app.py
index 4eea4dd..99e868f 100644
--- a/backend/app.py
+++ b/backend/app.py
@@ -42,9 +42,7 @@ logging.basicConfig(
 
 # 导入并注册蓝图
 from routers.rank_api_routes import rank_bp
-from routers.article_routes import article_bp
 app.register_blueprint(rank_bp)
-app.register_blueprint(article_bp)
 
 
 if __name__ == '__main__':
diff --git a/backend/routers/article_routes.py b/backend/routers/article_routes.py
deleted file mode 100644
index 9d99260..0000000
--- a/backend/routers/article_routes.py
+++ /dev/null
@@ -1,268 +0,0 @@
-#!/usr/bin/env python3
-# -*- coding: utf-8 -*-
-"""
-文章API服务器
-提供文章列表获取和文章详情获取的接口
-"""
-
-from flask import Blueprint, request, jsonify
-from datetime import datetime, timedelta
-import logging
-from database import db
-from bson import ObjectId
-
-# 创建蓝图
-article_bp = Blueprint('article', __name__, url_prefix='/api/article')
-
-# 获取数据库集合
-articles_collection = db['articles']
-
-def format_time(time_obj):
-    """格式化时间"""
-    if not time_obj:
-        return ""
-    
-    if isinstance(time_obj, datetime):
-        return time_obj.strftime("%Y-%m-%d %H:%M:%S")
-    else:
-        return str(time_obj)
-
-def format_article_item(doc):
-    """格式化文章数据项"""
-    return {
-        "_id": str(doc.get("_id", "")),
-        "title": doc.get("title", ""),
-        "author_id": doc.get("author_id", ""),
-        "cover_image": doc.get("cover_image", ""),
-        "status": doc.get("status", ""),
-        "summary": doc.get("summary", ""),
-        "created_at": format_time(doc.get("created_at")),
-        "likes": doc.get("likes", []),
-        "likes_count": len(doc.get("likes", []))
-    }
-
-def get_article_list(page=1, limit=20, sort_by="created_at", status=None):
-    """获取文章列表（分页）"""
-    try:
-        # 计算跳过的数量
-        skip = (page - 1) * limit
-
-        # 构建查询条件
-        query_condition = {}
-        if status:
-            query_condition["status"] = status
-
-        # 设置排序字段
-        sort_field = sort_by if sort_by in ["created_at", "title"] else "created_at"
-        sort_order = -1  # 降序
-
-        # 查询数据
-        cursor = articles_collection.find(query_condition).sort(sort_field, sort_order).skip(skip).limit(limit)
-        docs = list(cursor)
-
-        # 获取总数
-        total = articles_collection.count_documents(query_condition)
-
-        # 格式化数据
-        article_list = []
-        for doc in docs:
-            item = format_article_item(doc)
-            article_list.append(item)
-
-        return {
-            "success": True,
-            "data": article_list,
-            "pagination": {
-                "page": page,
-                "limit": limit,
-                "total": total,
-                "pages": (total + limit - 1) // limit,
-                "has_next": page * limit < total,
-                "has_prev": page > 1
-            },
-            "sort_by": sort_by,
-            "status_filter": status,
-            "update_time": datetime.now().strftime("%Y-%m-%d %H:%M:%S")
-        }
-
-    except Exception as e:
-        logging.error(f"获取文章列表失败: {e}")
-        return {"success": False, "message": f"获取数据失败: {str(e)}"}
-
-def search_articles(keyword, page=1, limit=10):
-    """搜索文章"""
-    try:
-        if not keyword:
-            return {"success": False, "message": "请提供搜索关键词"}
-        
-        # 计算跳过的数量
-        skip = (page - 1) * limit
-        
-        # 构建搜索条件（模糊匹配标题和内容）
-        search_condition = {
-            "$or": [
-                {"title": {"$regex": keyword, "$options": "i"}},
-                {"content": {"$regex": keyword, "$options": "i"}},
-                {"summary": {"$regex": keyword, "$options": "i"}}
-            ]
-        }
-        
-        # 查询数据
-        cursor = articles_collection.find(search_condition).sort("created_at", -1).skip(skip).limit(limit)
-        docs = list(cursor)
-        
-        # 获取搜索结果总数
-        total = articles_collection.count_documents(search_condition)
-        
-        # 格式化数据
-        search_results = []
-        for doc in docs:
-            item = format_article_item(doc)
-            search_results.append(item)
-        
-        return {
-            "success": True,
-            "data": search_results,
-            "keyword": keyword,
-            "pagination": {
-                "page": page,
-                "limit": limit,
-                "total": total,
-                "pages": (total + limit - 1) // limit,
-                "has_next": page * limit < total,
-                "has_prev": page > 1
-            },
-            "update_time": datetime.now().strftime("%Y-%m-%d %H:%M:%S")
-        }
-        
-    except Exception as e:
-        logging.error(f"搜索文章失败: {e}")
-        return {"success": False, "message": f"搜索失败: {str(e)}"}
-
-def get_article_detail(article_id):
-    """获取文章详情"""
-    try:
-        # 尝试通过ObjectId查找
-        try:
-            doc = articles_collection.find_one({"_id": ObjectId(article_id)})
-        except:
-            # 如果ObjectId无效，尝试其他字段
-            doc = articles_collection.find_one({
-                "$or": [
-                    {"title": article_id},
-                    {"author_id": article_id}
-                ]
-            })
-        
-        if not doc:
-            return {"success": False, "message": "未找到文章信息"}
-        
-        # 格式化详细信息
-        detail = format_article_item(doc)
-        
-        return {
-            "success": True,
-            "data": detail,
-            "update_time": datetime.now().strftime("%Y-%m-%d %H:%M:%S")
-        }
-        
-    except Exception as e:
-        logging.error(f"获取文章详情失败: {e}")
-        return {"success": False, "message": f"获取详情失败: {str(e)}"}
-
-def get_statistics():
-    """获取统计信息"""
-    try:
-        # 基本统计
-        total_articles = articles_collection.count_documents({})
-        
-        if total_articles == 0:
-            return {"success": False, "message": "暂无数据"}
-        
-        # 按状态统计
-        status_stats = []
-        for status in ["draft", "published", "archived"]:
-            count = articles_collection.count_documents({"status": status})
-            status_stats.append({"status": status, "count": count})
-        
-        # 获取最新更新时间
-        latest_doc = articles_collection.find().sort("created_at", -1).limit(1)
-        latest_time = ""
-        if latest_doc:
-            latest_list = list(latest_doc)
-            if latest_list:
-                latest_time = format_time(latest_list[0].get("created_at"))
-        
-        return {
-            "success": True,
-            "data": {
-                "total_articles": total_articles,
-                "status_stats": status_stats,
-                "latest_update": latest_time
-            },
-            "update_time": datetime.now().strftime("%Y-%m-%d %H:%M:%S")
-        }
-        
-    except Exception as e:
-        logging.error(f"获取统计信息失败: {e}")
-        return {"success": False, "message": f"获取统计失败: {str(e)}"}
-
-# 路由定义
-@article_bp.route('/list')
-def get_articles():
-    """获取文章列表"""
-    page = int(request.args.get('page', 1))
-    limit = int(request.args.get('limit', 20))
-    sort_by = request.args.get('sort', 'created_at')
-    status = request.args.get('status')
-
-    result = get_article_list(page, limit, sort_by, status)
-    return jsonify(result)
-
-@article_bp.route('/search')
-def search():
-    """搜索文章"""
-    keyword = request.args.get('q', '')
-    page = int(request.args.get('page', 1))
-    limit = int(request.args.get('limit', 10))
-    result = search_articles(keyword, page, limit)
-    return jsonify(result)
-
-@article_bp.route('/detail')
-def get_detail():
-    """获取文章详情"""
-    article_id = request.args.get('id', '')
-    result = get_article_detail(article_id)
-    return jsonify(result)
-
-@article_bp.route('/stats')
-def get_stats():
-    """获取统计信息"""
-    result = get_statistics()
-    return jsonify(result)
-
-@article_bp.route('/health')
-def health_check():
-    """健康检查"""
-    try:
-        # 检查数据库连接
-        total_records = articles_collection.count_documents({})
-        
-        return jsonify({
-            "success": True,
-            "message": "服务正常",
-            "data": {
-                "database": "连接正常",
-                "total_records": total_records,
-                "timestamp": datetime.now().strftime("%Y-%m-%d %H:%M:%S")
-            }
-        })
-    except Exception as e:
-        return jsonify({
-            "success": False,
-            "message": f"服务异常: {str(e)}",
-            "data": {
-                "database": "连接失败",
-                "timestamp": datetime.now().strftime("%Y-%m-%d %H:%M:%S")
-            }
-        })
\ No newline at end of file
diff --git a/backend/routers/rank_api_routes.py b/backend/routers/rank_api_routes.py
index f83e5aa..8038f0e 100644
--- a/backend/routers/rank_api_routes.py
+++ b/backend/routers/rank_api_routes.py
@@ -9,7 +9,10 @@ from flask import Blueprint, request, jsonify
 from datetime import datetime, timedelta
 import logging
 import re
+import uuid
+from werkzeug.utils import secure_filename
 from database import db
+from handlers.Rankings.tos_client import oss_client
 
 # 创建蓝图
 rank_bp = Blueprint('rank', __name__, url_prefix='/api/rank')
@@ -17,6 +20,7 @@ rank_bp = Blueprint('rank', __name__, url_prefix='/api/rank')
 # 获取数据库集合
 collection = db['Ranking_storage']  # 主要数据源：榜单存储表（包含data数组）
 rankings_management_collection = db['Rankings_management']  # 管理数据库（字段同步源）
+claim_applications_collection = db['Claim_Applications']  # 认领申请集合
 
 def format_playcount(playcount_str):
     """格式化播放量字符串为数字"""
@@ -2258,4 +2262,678 @@ def get_drama_detail_by_id(drama_id):
         return jsonify({
             "success": False,
             "message": f"获取短剧详情失败: {str(e)}"
-        })
\ No newline at end of file
+        })
+
+def upload_certification_file(file):
+    """
+    上传认领证明文件到TOS
+    
+    Args:
+        file: 上传的文件对象
+        
+    Returns:
+        str: TOS永久链接URL
+    """
+    try:
+        # 获取文件扩展名
+        filename = secure_filename(file.filename)
+        file_extension = ''
+        if '.' in filename:
+            file_extension = '.' + filename.rsplit('.', 1)[1].lower()
+        
+        # 验证文件类型
+        allowed_image_extensions = ['.jpg', '.jpeg', '.png', '.gif']
+        allowed_doc_extensions = ['.pdf', '.doc', '.docx']
+        
+        if file_extension not in allowed_image_extensions + allowed_doc_extensions:
+            raise ValueError(f"不支持的文件类型: {file_extension}")
+        
+        # 验证文件大小
+        file.seek(0, 2)  # 移动到文件末尾
+        file_size = file.tell()  # 获取文件大小
+        file.seek(0)  # 重置文件指针
+        
+        max_size = 10 * 1024 * 1024  # 10MB for images
+        if file_extension in allowed_doc_extensions:
+            max_size = 20 * 1024 * 1024  # 20MB for documents
+        
+        if file_size > max_size:
+            raise ValueError(f"文件大小超过限制: {file_size / 1024 / 1024:.2f}MB")
+        
+        # 生成唯一文件名
+        random_filename = f"{uuid.uuid4().hex}{file_extension}"
+        object_key = f"media/rank/Certification/{random_filename}"
+        
+        # 上传到TOS
+        tos_url = oss_client.upload_bytes(
+            data=file.read(),
+            object_key=object_key,
+            content_type=file.content_type or 'application/octet-stream',
+            return_url=True
+        )
+        
+        logging.info(f"文件上传成功: {filename} -> {tos_url}")
+        return tos_url
+        
+    except Exception as e:
+        logging.error(f"文件上传失败: {str(e)}")
+        raise
+
+
+@rank_bp.route('/claim', methods=['POST'])
+def submit_claim():
+    """
+    提交认领申请（新版本：上传文件到TOS并创建待审核申请）
+    """
+    try:
+        # 获取表单数据
+        drama_id = request.form.get('drama_id')
+        field_type = request.form.get('field_type')  # 'copyright' 或 'manufacturing'
+        company_name = request.form.get('company_name')
+        description = request.form.get('description', '')
+        
+        # 验证必填字段
+        if not all([drama_id, field_type, company_name]):
+            return jsonify({
+                "success": False,
+                "message": "缺少必填字段"
+            }), 400
+        
+        # 验证字段类型
+        if field_type not in ['copyright', 'manufacturing']:
+            return jsonify({
+                "success": False,
+                "message": "无效的字段类型"
+            }), 400
+        
+        # 获取短剧信息
+        drama_info = rankings_management_collection.find_one({"mix_id": drama_id})
+        if not drama_info:
+            return jsonify({
+                "success": False,
+                "message": "未找到对应的短剧"
+            }), 404
+        
+        drama_name = drama_info.get('mix_name', '未知短剧')
+        
+        # 处理上传的文件并上传到TOS
+        uploaded_files = request.files.getlist('files')
+        tos_file_urls = []
+        
+        if uploaded_files:
+            for file in uploaded_files:
+                if file and file.filename:
+                    try:
+                        tos_url = upload_certification_file(file)
+                        tos_file_urls.append(tos_url)
+                    except ValueError as ve:
+                        return jsonify({
+                            "success": False,
+                            "message": str(ve)
+                        }), 400
+                    except Exception as e:
+                        return jsonify({
+                            "success": False,
+                            "message": f"文件上传失败: {str(e)}"
+                        }), 500
+        
+        if not tos_file_urls:
+            return jsonify({
+                "success": False,
+                "message": "请至少上传一个证明文件"
+            }), 400
+        
+        # 检查是否存在该短剧+该字段类型的待审核申请
+        existing_application = claim_applications_collection.find_one({
+            "drama_id": drama_id,
+            "field_type": field_type,
+            "status": "pending"
+        })
+        
+        # 如果存在待审核申请，删除旧的（但保留TOS文件）
+        if existing_application:
+            claim_applications_collection.delete_one({"_id": existing_application["_id"]})
+            logging.info(f"删除旧的待审核申请: {existing_application.get('application_id')}")
+        
+        # 创建新的申请记录
+        application_id = str(uuid.uuid4())
+        application_data = {
+            "application_id": application_id,
+            "drama_id": drama_id,
+            "drama_name": drama_name,
+            "field_type": field_type,
+            "company_name": company_name,
+            "description": description,
+            "tos_file_urls": tos_file_urls,
+            "status": "pending",
+            "submit_time": datetime.now(),
+            "review_time": None,
+            "reviewer": None,
+            "reject_reason": None
+        }
+        
+        claim_applications_collection.insert_one(application_data)
+        
+        logging.info(f"认领申请创建成功: application_id={application_id}, drama_id={drama_id}, field_type={field_type}")
+        
+        return jsonify({
+            "success": True,
+            "message": "认领申请提交成功，等待管理员审核",
+            "data": {
+                "application_id": application_id,
+                "drama_id": drama_id,
+                "field_type": field_type,
+                "company_name": company_name,
+                "file_count": len(tos_file_urls)
+            }
+        })
+        
+    except Exception as e:
+        logging.error(f"提交认领申请失败: {e}")
+        return jsonify({
+            "success": False,
+            "message": f"提交认领申请失败: {str(e)}"
+        }), 500
+
+
+# 获取申请列表
+@rank_bp.route('/claim/applications', methods=['GET'])
+def get_claim_applications():
+    """
+    获取认领申请列表
+    支持筛选和分页
+    """
+    try:
+        # 获取查询参数
+        status = request.args.get('status', 'all')  # all/pending/approved/rejected
+        page = int(request.args.get('page', 1))
+        limit = int(request.args.get('limit', 20))
+        
+        # 构建查询条件
+        query = {}
+        if status != 'all':
+            query['status'] = status
+        
+        # 查询总数
+        total = claim_applications_collection.count_documents(query)
+        
+        # 查询数据（按提交时间倒序）
+        applications = list(claim_applications_collection.find(query)
+                          .sort('submit_time', -1)
+                          .skip((page - 1) * limit)
+                          .limit(limit))
+        
+        # 格式化数据
+        formatted_applications = []
+        for app in applications:
+            formatted_applications.append({
+                "application_id": app.get('application_id'),
+                "drama_id": app.get('drama_id'),
+                "drama_name": app.get('drama_name'),
+                "field_type": app.get('field_type'),
+                "field_type_label": "版权方" if app.get('field_type') == 'copyright' else "承制方",
+                "company_name": app.get('company_name'),
+                "status": app.get('status'),
+                "status_label": {
+                    "pending": "待审核",
+                    "approved": "已通过",
+                    "rejected": "已拒绝"
+                }.get(app.get('status'), "未知"),
+                "submit_time": app.get('submit_time').strftime("%Y-%m-%d %H:%M:%S") if app.get('submit_time') else "",
+                "file_count": len(app.get('tos_file_urls', []))
+            })
+        
+        return jsonify({
+            "success": True,
+            "data": formatted_applications,
+            "pagination": {
+                "page": page,
+                "limit": limit,
+                "total": total,
+                "pages": (total + limit - 1) // limit
+            }
+        })
+        
+    except Exception as e:
+        logging.error(f"获取申请列表失败: {e}")
+        return jsonify({
+            "success": False,
+            "message": f"获取申请列表失败: {str(e)}"
+        }), 500
+
+
+# 获取申请详情
+@rank_bp.route('/claim/application/<application_id>', methods=['GET'])
+def get_claim_application_detail(application_id):
+    """
+    获取认领申请详情
+    """
+    try:
+        application = claim_applications_collection.find_one({"application_id": application_id})
+        
+        if not application:
+            return jsonify({
+                "success": False,
+                "message": "申请不存在"
+            }), 404
+        
+        # 格式化数据
+        formatted_data = {
+            "application_id": application.get('application_id'),
+            "drama_id": application.get('drama_id'),
+            "drama_name": application.get('drama_name'),
+            "field_type": application.get('field_type'),
+            "field_type_label": "版权方" if application.get('field_type') == 'copyright' else "承制方",
+            "company_name": application.get('company_name'),
+            "description": application.get('description', ''),
+            "tos_file_urls": application.get('tos_file_urls', []),
+            "status": application.get('status'),
+            "status_label": {
+                "pending": "待审核",
+                "approved": "已通过",
+                "rejected": "已拒绝"
+            }.get(application.get('status'), "未知"),
+            "submit_time": application.get('submit_time').strftime("%Y-%m-%d %H:%M:%S") if application.get('submit_time') else "",
+            "review_time": application.get('review_time').strftime("%Y-%m-%d %H:%M:%S") if application.get('review_time') else None,
+            "reviewer": application.get('reviewer'),
+            "reject_reason": application.get('reject_reason')
+        }
+        
+        return jsonify({
+            "success": True,
+            "data": formatted_data
+        })
+        
+    except Exception as e:
+        logging.error(f"获取申请详情失败: {e}")
+        return jsonify({
+            "success": False,
+            "message": f"获取申请详情失败: {str(e)}"
+        }), 500
+
+
+# 审核申请
+@rank_bp.route('/claim/review', methods=['POST'])
+def review_claim_application():
+    """
+    审核认领申请
+    """
+    try:
+        data = request.get_json()
+        application_id = data.get('application_id')
+        action = data.get('action')  # 'approve' 或 'reject'
+        reject_reason = data.get('reject_reason', '')
+        reviewer = data.get('reviewer', 'admin')  # 审核人
+        
+        # 验证参数
+        if not application_id or not action:
+            return jsonify({
+                "success": False,
+                "message": "缺少必填参数"
+            }), 400
+        
+        if action not in ['approve', 'reject']:
+            return jsonify({
+                "success": False,
+                "message": "无效的操作类型"
+            }), 400
+        
+        if action == 'reject' and not reject_reason:
+            return jsonify({
+                "success": False,
+                "message": "拒绝时必须填写理由"
+            }), 400
+        
+        # 查找申请
+        application = claim_applications_collection.find_one({"application_id": application_id})
+        if not application:
+            return jsonify({
+                "success": False,
+                "message": "申请不存在"
+            }), 404
+        
+        if application.get('status') != 'pending':
+            return jsonify({
+                "success": False,
+                "message": "该申请已经被审核过了"
+            }), 400
+        
+        # 执行审核操作
+        if action == 'approve':
+            # 通过：更新短剧字段并锁定
+            drama_id = application.get('drama_id')
+            field_type = application.get('field_type')
+            company_name = application.get('company_name')
+            description = application.get('description', '')
+            tos_file_urls = application.get('tos_file_urls', [])
+            
+            field_name = 'Copyright_field' if field_type == 'copyright' else 'Manufacturing_field'
+            
+            # 更新 Rankings_management 数据库
+            update_data = {
+                field_name: company_name,
+                f"{field_name}_claim_description": description,
+                f"{field_name}_claim_images": tos_file_urls,
+                f"{field_name}_claim_time": datetime.now(),
+                "last_updated": datetime.now()
+            }
+            
+            # 设置锁定状态
+            lock_status_update = {
+                f"field_lock_status.{field_name}": True,
+                f"field_lock_status.{field_name}_claim_description": True,
+                f"field_lock_status.{field_name}_claim_images": True,
+                f"field_lock_status.{field_name}_claim_time": True
+            }
+            update_data.update(lock_status_update)
+            
+            rankings_management_collection.update_one(
+                {"mix_id": drama_id},
+                {"$set": update_data}
+            )
+            
+            # 同步更新 Ranking_storage 数据库
+            ranking_storage_update = {
+                f"data.$[elem].{field_name}": company_name,
+                f"data.$[elem].{field_name}_claim_description": description,
+                f"data.$[elem].{field_name}_claim_images": tos_file_urls,
+                f"data.$[elem].{field_name}_claim_time": datetime.now(),
+                f"data.$[elem].field_lock_status.{field_name}": True,
+                f"data.$[elem].field_lock_status.{field_name}_claim_description": True,
+                f"data.$[elem].field_lock_status.{field_name}_claim_images": True,
+                f"data.$[elem].field_lock_status.{field_name}_claim_time": True
+            }
+            
+            collection.update_many(
+                {"data.mix_id": drama_id},
+                {"$set": ranking_storage_update},
+                array_filters=[{"elem.mix_id": drama_id}]
+            )
+            
+            # 更新申请状态
+            claim_applications_collection.update_one(
+                {"application_id": application_id},
+                {"$set": {
+                    "status": "approved",
+                    "review_time": datetime.now(),
+                    "reviewer": reviewer
+                }}
+            )
+            
+            logging.info(f"认领申请审核通过: application_id={application_id}, drama_id={drama_id}")
+            
+            return jsonify({
+                "success": True,
+                "message": "申请已通过，短剧信息已更新"
+            })
+            
+        else:  # reject
+            # 拒绝：只更新申请状态
+            claim_applications_collection.update_one(
+                {"application_id": application_id},
+                {"$set": {
+                    "status": "rejected",
+                    "review_time": datetime.now(),
+                    "reviewer": reviewer,
+                    "reject_reason": reject_reason
+                }}
+            )
+            
+            logging.info(f"认领申请已拒绝: application_id={application_id}, reason={reject_reason}")
+            
+            return jsonify({
+                "success": True,
+                "message": "申请已拒绝"
+            })
+        
+    except Exception as e:
+        logging.error(f"审核申请失败: {e}")
+        return jsonify({
+            "success": False,
+            "message": f"审核申请失败: {str(e)}"
+        }), 500
+
+
+# 获取待审核数量
+@rank_bp.route('/claim/pending-count', methods=['GET'])
+def get_pending_claim_count():
+    """
+    获取待审核的认领申请数量
+    """
+    try:
+        count = claim_applications_collection.count_documents({"status": "pending"})
+        
+        return jsonify({
+            "success": True,
+            "count": count
+        })
+        
+    except Exception as e:
+        logging.error(f"获取待审核数量失败: {e}")
+        return jsonify({
+            "success": False,
+            "message": f"获取待审核数量失败: {str(e)}"
+        }), 500
+
+
+# ==================== 文章相关API ====================
+# 获取数据库集合
+articles_collection = db['articles']
+
+def format_article_item(doc):
+    """格式化文章数据项"""
+    return {
+        "_id": str(doc.get("_id", "")),
+        "title": doc.get("title", ""),
+        "author_id": doc.get("author_id", ""),
+        "cover_image": doc.get("cover_image", ""),
+        "status": doc.get("status", ""),
+        "summary": doc.get("summary", ""),
+        "created_at": format_time(doc.get("created_at")),
+        "likes": doc.get("likes", []),
+        "likes_count": len(doc.get("likes", []))
+    }
+
+def get_article_list_data(page=1, limit=20, sort_by="created_at", status=None):
+    """获取文章列表（分页）"""
+    try:
+        skip = (page - 1) * limit
+        query_condition = {}
+        if status:
+            query_condition["status"] = status
+
+        sort_field = sort_by if sort_by in ["created_at", "title"] else "created_at"
+        sort_order = -1
+
+        cursor = articles_collection.find(query_condition).sort(sort_field, sort_order).skip(skip).limit(limit)
+        docs = list(cursor)
+        total = articles_collection.count_documents(query_condition)
+
+        article_list = []
+        for doc in docs:
+            item = format_article_item(doc)
+            article_list.append(item)
+
+        return {
+            "success": True,
+            "data": article_list,
+            "pagination": {
+                "page": page,
+                "limit": limit,
+                "total": total,
+                "pages": (total + limit - 1) // limit,
+                "has_next": page * limit < total,
+                "has_prev": page > 1
+            },
+            "sort_by": sort_by,
+            "status_filter": status,
+            "update_time": datetime.now().strftime("%Y-%m-%d %H:%M:%S")
+        }
+
+    except Exception as e:
+        logging.error(f"获取文章列表失败: {e}")
+        return {"success": False, "message": f"获取数据失败: {str(e)}"}
+
+def search_articles_data(keyword, page=1, limit=10):
+    """搜索文章"""
+    try:
+        if not keyword:
+            return {"success": False, "message": "请提供搜索关键词"}
+        
+        skip = (page - 1) * limit
+        search_condition = {
+            "$or": [
+                {"title": {"$regex": keyword, "$options": "i"}},
+                {"content": {"$regex": keyword, "$options": "i"}},
+                {"summary": {"$regex": keyword, "$options": "i"}}
+            ]
+        }
+        
+        cursor = articles_collection.find(search_condition).sort("created_at", -1).skip(skip).limit(limit)
+        docs = list(cursor)
+        total = articles_collection.count_documents(search_condition)
+        
+        search_results = []
+        for doc in docs:
+            item = format_article_item(doc)
+            search_results.append(item)
+        
+        return {
+            "success": True,
+            "data": search_results,
+            "keyword": keyword,
+            "pagination": {
+                "page": page,
+                "limit": limit,
+                "total": total,
+                "pages": (total + limit - 1) // limit,
+                "has_next": page * limit < total,
+                "has_prev": page > 1
+            },
+            "update_time": datetime.now().strftime("%Y-%m-%d %H:%M:%S")
+        }
+        
+    except Exception as e:
+        logging.error(f"搜索文章失败: {e}")
+        return {"success": False, "message": f"搜索失败: {str(e)}"}
+
+def get_article_detail_data(article_id):
+    """获取文章详情"""
+    try:
+        from bson import ObjectId
+        try:
+            doc = articles_collection.find_one({"_id": ObjectId(article_id)})
+        except:
+            doc = articles_collection.find_one({
+                "$or": [
+                    {"title": article_id},
+                    {"author_id": article_id}
+                ]
+            })
+        
+        if not doc:
+            return {"success": False, "message": "未找到文章信息"}
+        
+        detail = format_article_item(doc)
+        
+        return {
+            "success": True,
+            "data": detail,
+            "update_time": datetime.now().strftime("%Y-%m-%d %H:%M:%S")
+        }
+        
+    except Exception as e:
+        logging.error(f"获取文章详情失败: {e}")
+        return {"success": False, "message": f"获取详情失败: {str(e)}"}
+
+def get_article_statistics():
+    """获取统计信息"""
+    try:
+        total_articles = articles_collection.count_documents({})
+        
+        if total_articles == 0:
+            return {"success": False, "message": "暂无数据"}
+        
+        status_stats = []
+        for status in ["draft", "published", "archived"]:
+            count = articles_collection.count_documents({"status": status})
+            status_stats.append({"status": status, "count": count})
+        
+        latest_doc = articles_collection.find().sort("created_at", -1).limit(1)
+        latest_time = ""
+        if latest_doc:
+            latest_list = list(latest_doc)
+            if latest_list:
+                latest_time = format_time(latest_list[0].get("created_at"))
+        
+        return {
+            "success": True,
+            "data": {
+                "total_articles": total_articles,
+                "status_stats": status_stats,
+                "latest_update": latest_time
+            },
+            "update_time": datetime.now().strftime("%Y-%m-%d %H:%M:%S")
+        }
+        
+    except Exception as e:
+        logging.error(f"获取统计信息失败: {e}")
+        return {"success": False, "message": f"获取统计失败: {str(e)}"}
+
+# 文章路由定义
+@rank_bp.route('/article/list')
+def get_articles_route():
+    """获取文章列表"""
+    page = int(request.args.get('page', 1))
+    limit = int(request.args.get('limit', 20))
+    sort_by = request.args.get('sort', 'created_at')
+    status = request.args.get('status')
+    result = get_article_list_data(page, limit, sort_by, status)
+    return jsonify(result)
+
+@rank_bp.route('/article/search')
+def search_articles_route():
+    """搜索文章"""
+    keyword = request.args.get('q', '')
+    page = int(request.args.get('page', 1))
+    limit = int(request.args.get('limit', 10))
+    result = search_articles_data(keyword, page, limit)
+    return jsonify(result)
+
+@rank_bp.route('/article/detail')
+def get_article_detail_route():
+    """获取文章详情"""
+    article_id = request.args.get('id', '')
+    result = get_article_detail_data(article_id)
+    return jsonify(result)
+
+@rank_bp.route('/article/stats')
+def get_article_stats_route():
+    """获取统计信息"""
+    result = get_article_statistics()
+    return jsonify(result)
+
+@rank_bp.route('/article/health')
+def article_health_check():
+    """健康检查"""
+    try:
+        total_records = articles_collection.count_documents({})
+        
+        return jsonify({
+            "success": True,
+            "message": "服务正常",
+            "data": {
+                "database": "连接正常",
+                "total_records": total_records,
+                "timestamp": datetime.now().strftime("%Y-%m-%d %H:%M:%S")
+            }
+        })
+    except Exception as e:
+        return jsonify({
+            "success": False,
+            "message": f"服务异常: {str(e)}",
+            "data": {
+                "database": "连接失败",
+                "timestamp": datetime.now().strftime("%Y-%m-%d %H:%M:%S")
+            }
+        })
diff --git a/frontend/src/AdminPanel.vue b/frontend/src/AdminPanel.vue
index e553e52..c746abc 100644
--- a/frontend/src/AdminPanel.vue
+++ b/frontend/src/AdminPanel.vue
@@ -342,6 +342,11 @@ const goBack = () => {
   router.push('/')
 }
 
+// 跳转到认领申请管理页面
+const goToClaimApplications = () => {
+  router.push('/admin/claim-applications')
+}
+
 // 页面加载时初始化
 onMounted(() => {
   fetchRankingData()
@@ -359,6 +364,9 @@ onMounted(() => {
           <h1 class="main-title">AI棒榜 - 后台管理</h1>
         </div>
         <div class="header-actions">
+          <button class="btn btn-primary" @click="goToClaimApplications">
+            认领申请管理
+          </button>
           <button class="btn btn-secondary" @click="fetchRankingData">
             刷新数据
           </button>
@@ -586,7 +594,7 @@ export default {
 
 /* 主容器 */
 .main-container {
-  max-width: 375px;
+  max-width: 428px;
   margin: 0 auto;
   background: #f5f5f5;
   min-height: 100vh;
diff --git a/frontend/src/ClaimApplications.vue b/frontend/src/ClaimApplications.vue
new file mode 100644
index 0000000..0db6e54
--- /dev/null
+++ b/frontend/src/ClaimApplications.vue
@@ -0,0 +1,682 @@
+<template>
+  <div class="applications-page">
+    <div class="header">
+      <div class="header-top">
+        <button class="back-btn" @click="goBack">←</button>
+        <h1>申请管理</h1>
+      </div>
+      <div class="filters">
+        <button 
+          :class="['filter-btn', { active: currentFilter === 'all' }]"
+          @click="changeFilter('all')"
+        >
+          全部 ({{ stats.total }})
+        </button>
+        <button 
+          :class="['filter-btn', { active: currentFilter === 'pending' }]"
+          @click="changeFilter('pending')"
+        >
+          待审核 ({{ stats.pending }})
+        </button>
+        <button 
+          :class="['filter-btn', { active: currentFilter === 'approved' }]"
+          @click="changeFilter('approved')"
+        >
+          已通过 ({{ stats.approved }})
+        </button>
+        <button 
+          :class="['filter-btn', { active: currentFilter === 'rejected' }]"
+          @click="changeFilter('rejected')"
+        >
+          已拒绝 ({{ stats.rejected }})
+        </button>
+      </div>
+    </div>
+
+    <div class="table-container">
+      <table class="applications-table">
+        <thead>
+          <tr>
+            <th>短剧名称</th>
+            <th>申请类型</th>
+            <th>公司名称</th>
+            <th>提交时间</th>
+            <th>状态</th>
+            <th>操作</th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr v-if="loading">
+            <td colspan="6" class="loading-cell">加载中...</td>
+          </tr>
+          <tr v-else-if="applications.length === 0">
+            <td colspan="6" class="empty-cell">暂无申请</td>
+          </tr>
+          <tr v-else v-for="app in applications" :key="app.application_id">
+            <td>{{ app.drama_name }}</td>
+            <td>
+              <span :class="['type-badge', app.field_type]">
+                {{ app.field_type_label }}
+              </span>
+            </td>
+            <td>{{ app.company_name }}</td>
+            <td>{{ app.submit_time }}</td>
+            <td>
+              <span :class="['status-badge', app.status]">
+                {{ app.status_label }}
+              </span>
+            </td>
+            <td>
+              <button class="action-btn view" @click="viewDetail(app)">查看详情</button>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+
+    <!-- 详情弹窗 -->
+    <div v-if="showDetailModal" class="modal-overlay" @click="closeDetail">
+      <div class="modal-content" @click.stop>
+        <div class="modal-header">
+          <h2>申请详情</h2>
+          <button class="close-btn" @click="closeDetail">×</button>
+        </div>
+        
+        <div class="modal-body" v-if="currentApplication">
+          <div class="detail-section">
+            <h3>基本信息</h3>
+            <div class="detail-row">
+              <span class="label">短剧名称：</span>
+              <span class="value">{{ currentApplication.drama_name }}</span>
+            </div>
+            <div class="detail-row">
+              <span class="label">申请类型：</span>
+              <span class="value">{{ currentApplication.field_type_label }}</span>
+            </div>
+            <div class="detail-row">
+              <span class="label">公司名称：</span>
+              <span class="value">{{ currentApplication.company_name }}</span>
+            </div>
+            <div class="detail-row">
+              <span class="label">补充说明：</span>
+              <span class="value">{{ currentApplication.description || '无' }}</span>
+            </div>
+            <div class="detail-row">
+              <span class="label">提交时间：</span>
+              <span class="value">{{ currentApplication.submit_time }}</span>
+            </div>
+            <div class="detail-row">
+              <span class="label">状态：</span>
+              <span :class="['status-badge', currentApplication.status]">
+                {{ currentApplication.status_label }}
+              </span>
+            </div>
+          </div>
+
+          <div class="detail-section">
+            <h3>证明材料</h3>
+            <div class="files-grid">
+              <a 
+                v-for="(url, index) in currentApplication.tos_file_urls" 
+                :key="index"
+                :href="url" 
+                target="_blank"
+                class="file-link"
+              >
+                <div class="file-preview">
+                  <img v-if="isImage(url)" :src="url" alt="证明材料" />
+                  <div v-else class="file-icon">
+                    <span>{{ getFileExtension(url) }}</span>
+                  </div>
+                </div>
+                <span class="file-name">文件 {{ index + 1 }}</span>
+              </a>
+            </div>
+          </div>
+
+          <div v-if="currentApplication.status === 'rejected'" class="detail-section">
+            <h3>拒绝理由</h3>
+            <p class="reject-reason">{{ currentApplication.reject_reason }}</p>
+          </div>
+        </div>
+
+        <div class="modal-footer" v-if="currentApplication && currentApplication.status === 'pending'">
+          <button class="action-btn reject" @click="showRejectInput = true" v-if="!showRejectInput">
+            拒绝
+          </button>
+          <div v-if="showRejectInput" class="reject-input-group">
+            <input 
+              v-model="rejectReason" 
+              type="text" 
+              placeholder="请输入拒绝理由"
+              class="reject-input"
+            />
+            <button class="action-btn reject" @click="handleReject">确认拒绝</button>
+            <button class="action-btn cancel" @click="showRejectInput = false">取消</button>
+          </div>
+          <button class="action-btn approve" @click="handleApprove">通过</button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted, computed } from 'vue'
+import { useRouter } from 'vue-router'
+import axios from 'axios'
+
+const router = useRouter()
+const API_BASE_URL = 'http://localhost:8443/api'
+
+// 响应式数据
+const applications = ref([])
+const loading = ref(false)
+const currentFilter = ref('all')
+const showDetailModal = ref(false)
+const currentApplication = ref(null)
+const showRejectInput = ref(false)
+const rejectReason = ref('')
+
+// 统计数据
+const stats = ref({
+  total: 0,
+  pending: 0,
+  approved: 0,
+  rejected: 0
+})
+
+// 获取申请列表
+const fetchApplications = async (status = 'all') => {
+  loading.value = true
+  try {
+    const response = await axios.get(`${API_BASE_URL}/rank/claim/applications`, {
+      params: { status, page: 1, limit: 100 }
+    })
+    
+    if (response.data.success) {
+      applications.value = response.data.data
+    }
+  } catch (error) {
+    console.error('获取申请列表失败:', error)
+    alert('获取申请列表失败')
+  } finally {
+    loading.value = false
+  }
+}
+
+// 获取统计数据
+const fetchStats = async () => {
+  try {
+    const [allRes, pendingRes, approvedRes, rejectedRes] = await Promise.all([
+      axios.get(`${API_BASE_URL}/rank/claim/applications`, { params: { status: 'all', limit: 1 } }),
+      axios.get(`${API_BASE_URL}/rank/claim/applications`, { params: { status: 'pending', limit: 1 } }),
+      axios.get(`${API_BASE_URL}/rank/claim/applications`, { params: { status: 'approved', limit: 1 } }),
+      axios.get(`${API_BASE_URL}/rank/claim/applications`, { params: { status: 'rejected', limit: 1 } })
+    ])
+    
+    stats.value = {
+      total: allRes.data.pagination?.total || 0,
+      pending: pendingRes.data.pagination?.total || 0,
+      approved: approvedRes.data.pagination?.total || 0,
+      rejected: rejectedRes.data.pagination?.total || 0
+    }
+  } catch (error) {
+    console.error('获取统计数据失败:', error)
+  }
+}
+
+// 切换筛选
+const changeFilter = (filter) => {
+  currentFilter.value = filter
+  fetchApplications(filter)
+}
+
+// 查看详情
+const viewDetail = async (app) => {
+  try {
+    const response = await axios.get(`${API_BASE_URL}/rank/claim/application/${app.application_id}`)
+    if (response.data.success) {
+      currentApplication.value = response.data.data
+      showDetailModal.value = true
+      showRejectInput.value = false
+      rejectReason.value = ''
+    }
+  } catch (error) {
+    console.error('获取申请详情失败:', error)
+    alert('获取申请详情失败')
+  }
+}
+
+// 关闭详情
+const closeDetail = () => {
+  showDetailModal.value = false
+  currentApplication.value = null
+  showRejectInput.value = false
+  rejectReason.value = ''
+}
+
+// 通过申请
+const handleApprove = async () => {
+  if (!confirm('确认通过该申请吗？')) return
+  
+  try {
+    const response = await axios.post(`${API_BASE_URL}/rank/claim/review`, {
+      application_id: currentApplication.value.application_id,
+      action: 'approve',
+      reviewer: 'admin'
+    })
+    
+    if (response.data.success) {
+      alert('申请已通过')
+      closeDetail()
+      fetchApplications(currentFilter.value)
+      fetchStats()
+    } else {
+      alert('操作失败：' + response.data.message)
+    }
+  } catch (error) {
+    console.error('审核失败:', error)
+    alert('审核失败，请稍后重试')
+  }
+}
+
+// 拒绝申请
+const handleReject = async () => {
+  if (!rejectReason.value.trim()) {
+    alert('请输入拒绝理由')
+    return
+  }
+  
+  try {
+    const response = await axios.post(`${API_BASE_URL}/rank/claim/review`, {
+      application_id: currentApplication.value.application_id,
+      action: 'reject',
+      reject_reason: rejectReason.value,
+      reviewer: 'admin'
+    })
+    
+    if (response.data.success) {
+      alert('申请已拒绝')
+      closeDetail()
+      fetchApplications(currentFilter.value)
+      fetchStats()
+    } else {
+      alert('操作失败：' + response.data.message)
+    }
+  } catch (error) {
+    console.error('审核失败:', error)
+    alert('审核失败，请稍后重试')
+  }
+}
+
+// 判断是否为图片
+const isImage = (url) => {
+  return /\.(jpg|jpeg|png|gif)$/i.test(url)
+}
+
+// 获取文件扩展名
+const getFileExtension = (url) => {
+  const match = url.match(/\.([^.]+)$/)
+  return match ? match[1].toUpperCase() : 'FILE'
+}
+
+// 返回管理后台
+const goBack = () => {
+  router.push('/admin')
+}
+
+// 页面加载时获取数据
+onMounted(() => {
+  fetchApplications('all')
+  fetchStats()
+})
+</script>
+
+<style scoped>
+.applications-page {
+  padding: 12px;
+  max-width: 428px;
+  margin: 0 auto;
+  background: #ebedf2;
+  min-height: 100vh;
+}
+
+.header {
+  margin-bottom: 12px;
+}
+
+.header-top {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-bottom: 12px;
+}
+
+.back-btn {
+  background: white;
+  border: none;
+  width: 32px;
+  height: 32px;
+  border-radius: 8px;
+  font-size: 20px;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #374151;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+}
+
+.back-btn:hover {
+  background: #f3f4f6;
+}
+
+.header h1 {
+  font-size: 18px;
+  margin: 0;
+  color: #1f2937;
+  font-weight: 600;
+}
+
+.filters {
+  display: flex;
+  gap: 10px;
+}
+
+.filter-btn {
+  padding: 6px 12px;
+  border: 1px solid #e5e7eb;
+  background: white;
+  border-radius: 6px;
+  cursor: pointer;
+  transition: all 0.2s;
+  font-size: 12px;
+}
+
+.filter-btn:hover {
+  background: #f3f4f6;
+}
+
+.filter-btn.active {
+  background: #3b82f6;
+  color: white;
+  border-color: #3b82f6;
+}
+
+.table-container {
+  background: white;
+  border-radius: 8px;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+  overflow: hidden;
+}
+
+.applications-table {
+  width: 100%;
+  border-collapse: collapse;
+}
+
+.applications-table th {
+  background: #f9fafb;
+  padding: 8px 10px;
+  text-align: left;
+  font-weight: 600;
+  color: #374151;
+  border-bottom: 1px solid #e5e7eb;
+  font-size: 12px;
+}
+
+.applications-table td {
+  padding: 8px 10px;
+  border-bottom: 1px solid #f3f4f6;
+  font-size: 12px;
+}
+
+.loading-cell,
+.empty-cell {
+  text-align: center;
+  color: #9ca3af;
+  padding: 40px !important;
+}
+
+.type-badge {
+  display: inline-block;
+  padding: 2px 8px;
+  border-radius: 10px;
+  font-size: 11px;
+  font-weight: 500;
+}
+
+.type-badge.copyright {
+  background: #dbeafe;
+  color: #1e40af;
+}
+
+.type-badge.manufacturing {
+  background: #fce7f3;
+  color: #be123c;
+}
+
+.status-badge {
+  display: inline-block;
+  padding: 2px 8px;
+  border-radius: 10px;
+  font-size: 11px;
+  font-weight: 500;
+}
+
+.status-badge.pending {
+  background: #fef3c7;
+  color: #92400e;
+}
+
+.status-badge.approved {
+  background: #d1fae5;
+  color: #065f46;
+}
+
+.status-badge.rejected {
+  background: #fee2e2;
+  color: #991b1b;
+}
+
+.action-btn {
+  padding: 5px 10px;
+  border: none;
+  border-radius: 4px;
+  cursor: pointer;
+  font-size: 12px;
+  transition: all 0.2s;
+}
+
+.action-btn.view {
+  background: #3b82f6;
+  color: white;
+}
+
+.action-btn.view:hover {
+  background: #2563eb;
+}
+
+.action-btn.approve {
+  background: #10b981;
+  color: white;
+  margin-left: 8px;
+}
+
+.action-btn.approve:hover {
+  background: #059669;
+}
+
+.action-btn.reject {
+  background: #ef4444;
+  color: white;
+}
+
+.action-btn.reject:hover {
+  background: #dc2626;
+}
+
+.action-btn.cancel {
+  background: #6b7280;
+  color: white;
+  margin-left: 8px;
+}
+
+/* 弹窗样式 */
+.modal-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1000;
+}
+
+.modal-content {
+  background: white;
+  border-radius: 12px;
+  width: 90%;
+  max-width: 400px;
+  max-height: 90vh;
+  overflow-y: auto;
+}
+
+.modal-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 16px;
+  border-bottom: 1px solid #e5e7eb;
+}
+
+.modal-header h2 {
+  font-size: 16px;
+  margin: 0;
+  font-weight: 600;
+}
+
+.close-btn {
+  background: none;
+  border: none;
+  font-size: 24px;
+  cursor: pointer;
+  color: #6b7280;
+  line-height: 1;
+}
+
+.modal-body {
+  padding: 16px;
+}
+
+.detail-section {
+  margin-bottom: 16px;
+}
+
+.detail-section h3 {
+  font-size: 14px;
+  margin-bottom: 10px;
+  color: #374151;
+  font-weight: 600;
+}
+
+.detail-row {
+  display: flex;
+  margin-bottom: 10px;
+}
+
+.detail-row .label {
+  width: 80px;
+  color: #6b7280;
+  font-size: 12px;
+  flex-shrink: 0;
+}
+
+.detail-row .value {
+  flex: 1;
+  color: #1f2937;
+  font-size: 12px;
+  word-break: break-all;
+}
+
+.files-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 8px;
+}
+
+.file-link {
+  text-decoration: none;
+  color: inherit;
+}
+
+.file-preview {
+  width: 100%;
+  height: 90px;
+  border-radius: 6px;
+  overflow: hidden;
+  background: #f3f4f6;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 4px;
+}
+
+.file-preview img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.file-icon {
+  font-size: 11px;
+  color: #6b7280;
+  font-weight: 600;
+}
+
+.file-name {
+  font-size: 11px;
+  color: #6b7280;
+  display: block;
+  text-align: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.reject-reason {
+  padding: 10px;
+  background: #fef2f2;
+  border-left: 3px solid #ef4444;
+  color: #991b1b;
+  font-size: 12px;
+}
+
+.modal-footer {
+  padding: 12px 16px;
+  border-top: 1px solid #e5e7eb;
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  gap: 8px;
+}
+
+.reject-input-group {
+  display: flex;
+  gap: 8px;
+  flex: 1;
+  margin-right: 8px;
+}
+
+.reject-input {
+  flex: 1;
+  padding: 6px 10px;
+  border: 1px solid #e5e7eb;
+  border-radius: 4px;
+  font-size: 12px;
+}
+</style>
diff --git a/frontend/src/ClaimPage.vue b/frontend/src/ClaimPage.vue
new file mode 100644
index 0000000..25114b5
--- /dev/null
+++ b/frontend/src/ClaimPage.vue
@@ -0,0 +1,759 @@
+<script setup>
+import { ref, computed, onMounted } from 'vue'
+import { useRouter, useRoute } from 'vue-router'
+import axios from 'axios'
+
+const router = useRouter()
+const route = useRoute()
+
+// 响应式数据
+const description = ref('')
+const images = ref([])  // 改名为files更合适，但保持images以减少改动
+const companyName = ref('')
+const showSuccessModal = ref(false)
+const loading = ref(false)
+
+// 从路由参数获取信息
+const dramaId = route.params.id
+const fieldType = route.query.type // 'copyright' 或 'manufacturing'
+
+// API基础URL
+const API_BASE_URL = 'http://localhost:8443/api'
+
+// 计算属性
+const fieldLabel = computed(() => {
+  return fieldType === 'copyright' ? '版权方' : '承制方'
+})
+
+const pageTitle = computed(() => {
+  return fieldType === 'copyright' ? '短剧版权方认证' : '短剧承制方认证'
+})
+
+const isFormValid = computed(() => {
+  return images.value.length > 0 && 
+         description.value.trim().length > 0 && 
+         companyName.value.trim().length > 0
+})
+
+// 返回上一页
+const goBack = () => {
+  router.back()
+}
+
+// 获取文件类型图标
+const getFileIcon = (file) => {
+  const ext = file.name.split('.').pop().toLowerCase()
+  if (['jpg', 'jpeg', 'png', 'gif'].includes(ext)) return 'image'
+  if (ext === 'pdf') return 'pdf'
+  if (['doc', 'docx'].includes(ext)) return 'word'
+  return 'file'
+}
+
+// 验证文件大小
+const validateFileSize = (file) => {
+  const ext = file.name.split('.').pop().toLowerCase()
+  const isImage = ['jpg', 'jpeg', 'png', 'gif'].includes(ext)
+  const maxSize = isImage ? 10 * 1024 * 1024 : 20 * 1024 * 1024  // 10MB for images, 20MB for docs
+  
+  if (file.size > maxSize) {
+    const maxSizeMB = maxSize / 1024 / 1024
+    const fileType = isImage ? '图片' : '文档'
+    alert(`${fileType}文件大小不能超过${maxSizeMB}MB`)
+    return false
+  }
+  return true
+}
+
+// 处理文件上传
+const handleFileUpload = (event) => {
+  const files = event.target.files
+  if (!files || files.length === 0) return
+  
+  const remainingSlots = 9 - images.value.length
+  const filesToAdd = Array.from(files).slice(0, remainingSlots)
+  
+  filesToAdd.forEach(file => {
+    // 验证文件大小
+    if (!validateFileSize(file)) return
+    
+    const fileType = getFileIcon(file)
+    
+    if (fileType === 'image') {
+      // 图片文件：读取预览
+      const reader = new FileReader()
+      reader.onload = (e) => {
+        images.value.push({
+          id: Date.now() + Math.random(),
+          url: e.target.result,
+          file: file,
+          type: 'image',
+          name: file.name
+        })
+      }
+      reader.readAsDataURL(file)
+    } else {
+      // 非图片文件：显示图标
+      images.value.push({
+        id: Date.now() + Math.random(),
+        url: null,
+        file: file,
+        type: fileType,
+        name: file.name
+      })
+    }
+  })
+  
+  // 重置input以允许重复选择同一文件
+  event.target.value = ''
+}
+
+// 触发文件选择
+const triggerFileInput = () => {
+  document.getElementById('fileInput').click()
+}
+
+// 移除图片
+const handleRemoveImage = (id) => {
+  images.value = images.value.filter(img => img.id !== id)
+}
+
+// 提交认证
+const handleSubmit = async () => {
+  if (!isFormValid.value) return
+  
+  loading.value = true
+  
+  try {
+    // 创建 FormData 对象
+    const formData = new FormData()
+    formData.append('drama_id', dramaId)
+    formData.append('field_type', fieldType)
+    formData.append('company_name', companyName.value)
+    formData.append('description', description.value)
+    
+    // 添加文件
+    images.value.forEach((img, index) => {
+      if (img.file) {
+        formData.append(`files`, img.file)
+      }
+    })
+    
+    const response = await axios.post(`${API_BASE_URL}/rank/claim`, formData, {
+      headers: {
+        'Content-Type': 'multipart/form-data'
+      }
+    })
+    
+    if (response.data.success) {
+      showSuccessModal.value = true
+      // 3秒后返回详情页
+      setTimeout(() => {
+        router.push(`/drama/${dramaId}`)
+      }, 3000)
+    } else {
+      alert('提交失败：' + response.data.message)
+    }
+  } catch (error) {
+    console.error('提交认证失败:', error)
+    alert('提交失败，请稍后重试')
+  } finally {
+    loading.value = false
+  }
+}
+
+// 关闭成功弹窗
+const closeSuccessModal = () => {
+  showSuccessModal.value = false
+  router.push(`/drama/${dramaId}`)
+}
+</script>
+
+<template>
+  <div class="page">
+    <div class="card">
+      <!-- 顶部导航栏 -->
+      <div class="header">
+        <button class="icon-button" @click="goBack">
+          <svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" fill="none" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+            <polyline points="15 18 9 12 15 6" />
+          </svg>
+        </button>
+        <p class="title-header">{{ pageTitle }}</p>
+        <div class="header-spacer" />
+      </div>
+
+      <!-- 内容区域 -->
+      <div class="content">
+        <!-- 认证信息 -->
+        <div class="section">
+          <div class="section-head">
+            <div class="section-bar" />
+            <p class="section-title">认证信息</p>
+          </div>
+
+          <div class="form-row">
+            <p class="form-label">{{ fieldLabel }}</p>
+            <input 
+              v-model="companyName" 
+              type="text" 
+              placeholder="请输入" 
+              class="form-input"
+              maxlength="50"
+            />
+          </div>
+
+          <!-- 证明材料 -->
+          <div class="materials">
+            <div class="row-top">
+              <p class="row-label">证明材料</p>
+              <p class="count-label">{{ images.length }}/9</p>
+            </div>
+
+            <div class="grid">
+              <div 
+                v-for="img in images" 
+                :key="img.id" 
+                class="thumb"
+                :class="{ 'thumb-file': img.type !== 'image' }"
+                :style="img.type === 'image' ? { backgroundImage: `url(${img.url})` } : {}"
+              >
+                <!-- 图片预览 -->
+                <template v-if="img.type === 'image'">
+                  <!-- 图片已经通过backgroundImage显示 -->
+                </template>
+                
+                <!-- PDF图标 -->
+                <div v-else-if="img.type === 'pdf'" class="file-icon">
+                  <svg viewBox="0 0 24 24" width="32" height="32" fill="#e53e3e">
+                    <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/>
+                    <polyline points="14 2 14 8 20 8"/>
+                    <text x="7" y="18" font-size="6" fill="white" font-weight="bold">PDF</text>
+                  </svg>
+                  <p class="file-name">{{ img.name }}</p>
+                </div>
+                
+                <!-- Word图标 -->
+                <div v-else-if="img.type === 'word'" class="file-icon">
+                  <svg viewBox="0 0 24 24" width="32" height="32" fill="#2b5797">
+                    <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/>
+                    <polyline points="14 2 14 8 20 8"/>
+                    <text x="6" y="18" font-size="6" fill="white" font-weight="bold">DOC</text>
+                  </svg>
+                  <p class="file-name">{{ img.name }}</p>
+                </div>
+                
+                <!-- 删除按钮 -->
+                <button class="thumb-close" @click="handleRemoveImage(img.id)">
+                  <svg viewBox="0 0 24 24" width="12" height="12" stroke="#ffffff" fill="none" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+                    <line x1="18" y1="6" x2="6" y2="18" />
+                    <line x1="6" y1="6" x2="18" y2="18" />
+                  </svg>
+                </button>
+              </div>
+
+              <button v-if="images.length < 9" class="add-btn" @click="triggerFileInput">
+                <svg viewBox="0 0 24 24" width="20" height="20" stroke="#9ca3af" fill="none" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+                  <line x1="12" y1="5" x2="12" y2="19" />
+                  <line x1="5" y1="12" x2="19" y2="12" />
+                </svg>
+              </button>
+            </div>
+
+            <!-- 隐藏的文件输入 -->
+            <input 
+              id="fileInput" 
+              type="file" 
+              accept="image/jpeg,image/jpg,image/png,image/gif,.pdf,.doc,.docx" 
+              multiple 
+              style="display: none" 
+              @change="handleFileUpload"
+            />
+
+            <div class="hint">
+              <svg viewBox="0 0 24 24" width="16" height="16" stroke="#9ca3af" fill="none" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+                <circle cx="12" cy="12" r="10" />
+                <line x1="12" y1="16" x2="12" y2="12" />
+                <line x1="12" y1="8" x2="12" y2="8" />
+              </svg>
+              <p class="hint-text">
+                仅受持公司原画证认证版权方，个人身份请提交知识经授权证证通上传可认证是
+                <button class="link-btn">查看示例</button>
+              </p>
+            </div>
+          </div>
+        </div>
+
+        <!-- 补充说明 -->
+        <div class="section">
+          <p class="sub-title">补充说明</p>
+          <div class="textarea-wrap">
+            <textarea
+              v-model="description"
+              placeholder="请输入"
+              class="textarea"
+              maxLength="100"
+            />
+            <div class="counter">{{ description.length }}/100</div>
+          </div>
+        </div>
+
+        <!-- 提交按钮 -->
+        <button 
+          :class="isFormValid ? 'submit-btn' : 'submit-btn-disabled'" 
+          :disabled="!isFormValid || loading"
+          @click="handleSubmit"
+        >
+          {{ loading ? '提交中...' : '提交认证' }}
+        </button>
+
+        <p class="footer">
+          认证过程中有任何问题，请点击<button class="link-btn">联系客服</button>
+        </p>
+      </div>
+    </div>
+
+    <!-- 成功弹窗 -->
+    <div v-if="showSuccessModal" class="modal-overlay" @click="closeSuccessModal">
+      <div class="modal-content" @click.stop>
+        <div class="modal-icon">
+          <svg viewBox="0 0 24 24" width="48" height="48" stroke="#10b981" fill="none" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+            <polyline points="20 6 9 17 4 12" />
+          </svg>
+        </div>
+        <h3 class="modal-title">提交成功</h3>
+        <p class="modal-text">您的认证申请已提交，我们会尽快审核</p>
+        <button class="modal-btn" @click="closeSuccessModal">确定</button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+* {
+  box-sizing: border-box;
+}
+
+.page {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  background: #ebedf2;
+  padding: 14px;
+  min-height: 100vh;
+}
+
+.card {
+  display: flex;
+  flex-direction: column;
+  border-radius: 0;
+  overflow: hidden;
+  background: #f3f4f6;
+  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
+  width: 100%;
+  max-width: 428px;
+}
+
+.header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  background: #ffffff;
+  padding: 12px 16px;
+}
+
+.icon-button {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: 4px;
+  color: #374151;
+  background: none;
+  border: none;
+  cursor: pointer;
+  transition: opacity 0.2s;
+}
+
+.icon-button:hover {
+  opacity: 0.7;
+}
+
+.title-header {
+  color: #1f2937;
+  font-size: 16px;
+  font-weight: 600;
+  margin: 0;
+}
+
+.header-spacer {
+  width: 24px;
+  height: 24px;
+}
+
+.content {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  padding: 16px;
+}
+
+.section {
+  background: #ffffff;
+  border-radius: 12px;
+  padding: 20px;
+}
+
+.section-head {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-bottom: 16px;
+}
+
+.section-bar {
+  width: 4px;
+  height: 16px;
+  border-radius: 999px;
+  background: #3b82f6;
+}
+
+.section-title {
+  color: #111827;
+  font-size: 16px;
+  font-weight: 600;
+  margin: 0;
+}
+
+.row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12px 0;
+  border-bottom: 1px solid #f3f4f6;
+}
+
+.row-top {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 12px;
+}
+
+.row-label {
+  color: #4b5563;
+  font-size: 14px;
+  margin: 0;
+}
+
+.form-row {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 12px 0;
+  border-bottom: 1px solid #f3f4f6;
+}
+
+.form-label {
+  color: #4b5563;
+  font-size: 14px;
+  margin: 0;
+  font-weight: 500;
+}
+
+.form-input {
+  border: 1px solid #e5e7eb;
+  background: #ffffff;
+  color: #111827;
+  font-size: 14px;
+  padding: 10px 12px;
+  border-radius: 8px;
+  outline: none;
+  width: 100%;
+}
+
+.form-input::placeholder {
+  color: #9ca3af;
+}
+
+.form-input:focus {
+  border-color: #3b82f6;
+}
+
+.count-label {
+  color: #9ca3af;
+  font-size: 14px;
+  margin: 0;
+}
+
+.materials {
+  margin-top: 12px;
+}
+
+.grid {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  margin-bottom: 12px;
+}
+
+.thumb {
+  position: relative;
+  width: 80px;
+  height: 80px;
+  border-radius: 8px;
+  overflow: hidden;
+  background-size: cover;
+  background-position: center;
+  background-color: #e5e7eb;
+}
+
+.thumb-file {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: #f3f4f6;
+}
+
+.file-icon {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 4px;
+  padding: 8px;
+}
+
+.file-name {
+  font-size: 10px;
+  color: #6b7280;
+  text-align: center;
+  word-break: break-all;
+  line-height: 1.2;
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  margin: 0;
+}
+
+.thumb-close {
+  position: absolute;
+  top: -4px;
+  right: -4px;
+  width: 20px;
+  height: 20px;
+  border-radius: 999px;
+  background: #4b5563;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border: none;
+  cursor: pointer;
+  transition: background 0.2s;
+}
+
+.thumb-close:hover {
+  background: #374151;
+}
+
+.add-btn {
+  width: 80px;
+  height: 80px;
+  border-radius: 8px;
+  border: 2px dashed #d1d5db;
+  background: #ffffff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: border-color 0.2s;
+}
+
+.add-btn:hover {
+  border-color: #9ca3af;
+}
+
+.hint {
+  display: flex;
+  align-items: flex-start;
+  gap: 8px;
+  background: #f9fafb;
+  padding: 12px;
+  border-radius: 8px;
+}
+
+.hint-text {
+  font-size: 12px;
+  color: #6b7280;
+  margin: 0;
+  line-height: 1.5;
+}
+
+.link-btn {
+  color: #3b82f6;
+  font-size: 12px;
+  background: transparent;
+  border: none;
+  padding: 0;
+  cursor: pointer;
+  text-decoration: underline;
+}
+
+.link-btn:hover {
+  opacity: 0.8;
+}
+
+.sub-title {
+  color: #111827;
+  font-size: 14px;
+  font-weight: 600;
+  margin: 0 0 12px 0;
+}
+
+.textarea-wrap {
+  position: relative;
+}
+
+.textarea {
+  width: 100%;
+  height: 96px;
+  padding: 12px;
+  border: 1px solid #e5e7eb;
+  border-radius: 10px;
+  resize: none;
+  font-size: 14px;
+  color: #111827;
+  font-family: inherit;
+}
+
+.textarea::placeholder {
+  color: #9ca3af;
+}
+
+.textarea:focus {
+  outline: none;
+  border-color: #3b82f6;
+}
+
+.counter {
+  position: absolute;
+  bottom: 8px;
+  right: 8px;
+  font-size: 12px;
+  color: #9ca3af;
+}
+
+.submit-btn {
+  width: 100%;
+  padding: 12px 0;
+  border-radius: 10px;
+  background: #3b82f6;
+  color: #ffffff;
+  font-size: 16px;
+  font-weight: 600;
+  border: none;
+  cursor: pointer;
+  transition: background 0.2s;
+}
+
+.submit-btn:hover {
+  background: #2563eb;
+}
+
+.submit-btn-disabled {
+  width: 100%;
+  padding: 12px 0;
+  border-radius: 10px;
+  background: #e5e7eb;
+  color: #9ca3af;
+  font-size: 16px;
+  font-weight: 600;
+  border: none;
+  cursor: not-allowed;
+}
+
+.footer {
+  margin-top: 8px;
+  margin-bottom: 40px;
+  text-align: center;
+  font-size: 12px;
+  color: #6b7280;
+}
+
+/* 成功弹窗 */
+.modal-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1000;
+}
+
+.modal-content {
+  background: white;
+  border-radius: 16px;
+  padding: 32px 24px;
+  max-width: 320px;
+  width: 90%;
+  text-align: center;
+}
+
+.modal-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 64px;
+  height: 64px;
+  margin: 0 auto 16px;
+  background: #d1fae5;
+  border-radius: 50%;
+}
+
+.modal-title {
+  font-size: 20px;
+  font-weight: 600;
+  color: #111827;
+  margin: 0 0 8px 0;
+}
+
+.modal-text {
+  font-size: 14px;
+  color: #6b7280;
+  margin: 0 0 24px 0;
+}
+
+.modal-btn {
+  width: 100%;
+  padding: 12px 0;
+  border-radius: 10px;
+  background: #3b82f6;
+  color: #ffffff;
+  font-size: 16px;
+  font-weight: 600;
+  border: none;
+  cursor: pointer;
+  transition: background 0.2s;
+}
+
+.modal-btn:hover {
+  background: #2563eb;
+}
+
+/* 响应式设计 */
+@media (max-width: 480px) {
+  .page {
+    padding: 0;
+  }
+
+  .card {
+    max-width: 100%;
+    border-radius: 0;
+  }
+}
+</style>
diff --git a/frontend/src/DramaDetail.vue b/frontend/src/DramaDetail.vue
index 1fc0a68..af49b9a 100644
--- a/frontend/src/DramaDetail.vue
+++ b/frontend/src/DramaDetail.vue
@@ -26,9 +26,9 @@ const dramaData = ref({
 // API基础URL
 const API_BASE_URL = 'http://localhost:8443/api'  // 本地服务器
 
-// 返回上一页
+// 返回上一页（直接返回首页）
 const goBack = () => {
-  router.back()
+  router.push('/')
 }
 
 // 切换展开/收起
@@ -115,6 +115,17 @@ const fetchDramaDetail = async (dramaId) => {
   }
 }
 
+// 跳转到认领页面
+const goToClaim = (type) => {
+  // type: 'copyright' 或 'manufacturing'
+  const dramaId = route.params.id
+  if (dramaId) {
+    router.push(`/claim/${dramaId}?type=${type}`)
+  } else {
+    console.error('无法获取短剧ID')
+  }
+}
+
 // 页面加载时获取短剧数据
 onMounted(() => {
   // 从路由参数获取短剧ID
@@ -202,7 +213,7 @@ onMounted(() => {
                 <span v-if="dramaData.Copyright_field" class="chip-blue">{{ dramaData.Copyright_field }}</span>
                 <span v-else class="chip-empty"></span>
               </div>
-              <p class="claim">我要认领</p>
+              <p v-if="!dramaData.Copyright_field" class="claim" @click="goToClaim('copyright')">我要认领</p>
             </div>
           </div>
 
@@ -213,7 +224,7 @@ onMounted(() => {
                 <span v-if="dramaData.Manufacturing_Field" class="chip-red">{{ dramaData.Manufacturing_Field }}</span>
                 <span v-else class="chip-empty"></span>
               </div>
-              <p class="claim">我要认领</p>
+              <p v-if="!dramaData.Manufacturing_Field" class="claim" @click="goToClaim('manufacturing')">我要认领</p>
             </div>
           </div>
         </div>
diff --git a/frontend/src/router/index.js b/frontend/src/router/index.js
index dc2e2eb..87cd65e 100644
--- a/frontend/src/router/index.js
+++ b/frontend/src/router/index.js
@@ -1,6 +1,8 @@
 import { createRouter, createWebHistory } from 'vue-router'
 import AdminPanel from '../AdminPanel.vue'
 import DramaDetail from '../DramaDetail.vue'
+import ClaimPage from '../ClaimPage.vue'
+import ClaimApplications from '../ClaimApplications.vue'
 
 const routes = [
   {
@@ -8,10 +10,20 @@ const routes = [
     name: 'Admin',
     component: AdminPanel
   },
+  {
+    path: '/admin/claim-applications',
+    name: 'ClaimApplications',
+    component: ClaimApplications
+  },
   {
     path: '/drama/:id',
     name: 'DramaDetail',
     component: DramaDetail
+  },
+  {
+    path: '/claim/:id',
+    name: 'ClaimPage',
+    component: ClaimPage
   }
 ]