feat: KPL v1.5.0 功能迭代

1. 奖章条件优化
- 修复统计查询 SQL 语法
- 添加按类别检查奖章方法

2. 移动端适配
- 登录页、课程中心、课程详情
- 考试页面、成长路径、排行榜

3. 证书系统
- 数据库模型和迁移脚本
- 证书颁发/列表/下载/验证 API
- 前端证书列表页面

4. 数据大屏
- 企业级/团队级数据 API
- ECharts 可视化大屏页面

frontend/src/views/trainee/course-detail.vue

@@ -1297,4 +1297,178 @@ onUnmounted(() => {
       }
     }
   }
+
+  // 手机端深度优化
+  @media (max-width: 480px) {
+    .course-detail-container {
+      padding: 8px;
+      
+      .course-header {
+        padding: 14px;
+        border-radius: 12px;
+        margin-bottom: 10px;
+        
+        .header-content {
+          .breadcrumb {
+            margin-bottom: 12px;
+            
+            :deep(.el-breadcrumb) {
+              font-size: 12px;
+            }
+          }
+          
+          .course-title {
+            font-size: 18px;
+            margin-bottom: 8px;
+          }
+          
+          .course-desc {
+            font-size: 13px;
+            -webkit-line-clamp: 2;
+          }
+          
+          .course-meta {
+            gap: 8px;
+            
+            .meta-item {
+              font-size: 12px;
+              padding: 4px 8px;
+            }
+          }
+          
+          .progress-section {
+            margin-top: 12px;
+            
+            .progress-info {
+              font-size: 13px;
+            }
+          }
+        }
+      }
+      
+      .course-content {
+        gap: 10px;
+        
+        .content-sidebar {
+          padding: 10px;
+          max-height: 200px;
+          border-radius: 12px;
+          
+          .sidebar-header {
+            flex-direction: column;
+            gap: 10px;
+            margin-bottom: 10px;
+            
+            .sidebar-title {
+              font-size: 15px;
+            }
+            
+            .el-input {
+              width: 100% !important;
+            }
+          }
+          
+          .file-type-filter {
+            margin-bottom: 10px;
+            overflow-x: auto;
+            
+            .el-radio-group {
+              flex-wrap: nowrap;
+              
+              :deep(.el-radio-button__inner) {
+                padding: 4px 10px;
+                font-size: 12px;
+              }
+            }
+          }
+          
+          .material-list {
+            .material-item {
+              padding: 8px 10px;
+              
+              .material-info {
+                .material-name {
+                  font-size: 13px;
+                }
+                
+                .material-meta {
+                  font-size: 11px;
+                }
+              }
+            }
+          }
+        }
+        
+        .content-main {
+          padding: 10px;
+          border-radius: 12px;
+          
+          .empty-state {
+            padding: 40px 20px;
+            
+            p {
+              font-size: 13px;
+            }
+          }
+          
+          .preview-container {
+            min-height: 300px;
+            
+            .preview-toolbar {
+              gap: 8px;
+              margin-bottom: 10px;
+              
+              .toolbar-left {
+                .preview-title {
+                  font-size: 14px;
+                }
+              }
+              
+              .toolbar-right {
+                .el-button {
+                  padding: 8px 12px;
+                  font-size: 12px;
+                }
+              }
+            }
+            
+            .preview-content {
+              .pdf-viewer-container {
+                .pdf-toolbar {
+                  flex-wrap: wrap;
+                  gap: 8px;
+                  padding: 8px;
+                  
+                  .page-controls,
+                  .zoom-controls {
+                    gap: 4px;
+                    
+                    .page-info,
+                    .zoom-info {
+                      font-size: 12px;
+                      min-width: 50px;
+                    }
+                  }
+                }
+              }
+              
+              // 视频自适应
+              .video-player {
+                video {
+                  max-height: 50vh;
+                }
+              }
+              
+              // 图片自适应
+              .image-preview {
+                img {
+                  max-height: 60vh;
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
 </style>