优化用人方小程序：视频下载页区分个人/企业维度、订单管理页显示方式调整

1. 视频下载页：
   - 区分企业维度和个人维度原型页面
   - 企业维度：保留原有功能，明确标注为企业维度
   - 个人维度：新增个人维度页面，包含个人信息摘要、视频统计和分类列表

2. 订单管理页显示方式调整：
   - 工资视频：从"22"改为"22/24"（本月已上传视频人数/总人数）
   - 个税视频：从"20"改为"20/24"（本月已上传视频人数/总人数）
   - 打卡算法：保持"24/30"（当月已打卡人数/总人数）的显示方式

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

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>

yongren.html

@@ -1181,13 +1181,13 @@
                                         </div>
                                         <div class="bg-green-50 rounded-lg p-2 text-center">
                                             <p class="text-xs text-gray-600">工资视频</p>
-                                            <p class="text-sm font-bold text-gray-800">22</p>
-                                            <p class="text-xs text-gray-500">已上传</p>
+                                            <p class="text-sm font-bold text-gray-800">22/24</p>
+                                            <p class="text-xs text-gray-500">92%</p>
                                         </div>
                                         <div class="bg-purple-50 rounded-lg p-2 text-center">
                                             <p class="text-xs text-gray-600">个税视频</p>
-                                            <p class="text-sm font-bold text-gray-800">20</p>
-                                            <p class="text-xs text-gray-500">已上传</p>
+                                            <p class="text-sm font-bold text-gray-800">20/24</p>
+                                            <p class="text-xs text-gray-500">83%</p>
                                         </div>
                                     </div>
                                     <div class="flex justify-between text-sm">
@@ -1437,9 +1437,9 @@
                 </div>
             </div>
 
-            <!-- 新增页面7: 视频查看下载页 -->
+            <!-- 新增页面7: 视频查看下载页（企业维度） -->
             <div class="flex flex-col items-center">
-                <h2 class="text-xl font-semibold text-gray-700 mb-4">视频查看下载页</h2>
+                <h2 class="text-xl font-semibold text-gray-700 mb-4">视频查看下载页（企业维度）</h2>
                 <div class="mobile-frame">
                     <div class="status-bar">
                         <span>9:41</span>
@@ -1456,7 +1456,7 @@
                             <div class="flex items-center justify-between">
                                 <div>
                                     <h3 class="font-semibold text-gray-800">阿里巴巴2023-11</h3>
-                                    <p class="text-sm text-gray-500">打卡视频管理</p>
+                                    <p class="text-sm text-gray-500">企业维度 - 打卡视频管理</p>
                                 </div>
                                 <button class="text-blue-500 text-sm">
                                     <i class="fas fa-download mr-1"></i>批量下载
@@ -1606,12 +1606,252 @@
                     </div>
                 </div>
             </div>
+
+            <!-- 新增页面8: 视频查看下载页（个人维度） -->
+            <div class="flex flex-col items-center">
+                <h2 class="text-xl font-semibold text-gray-700 mb-4">视频查看下载页（个人维度）</h2>
+                <div class="mobile-frame">
+                    <div class="status-bar">
+                        <span>9:41</span>
+                        <div class="flex space-x-1">
+                            <i class="fas fa-signal"></i>
+                            <i class="fas fa-wifi"></i>
+                            <i class="fas fa-battery-three-quarters"></i>
+                        </div>
+                    </div>
+
+                    <div class="h-[calc(100%-104px)] overflow-y-auto">
+                        <!-- 顶部信息 -->
+                        <div class="p-4 border-b border-gray-200">
+                            <div class="flex items-center justify-between">
+                                <div>
+                                    <h3 class="font-semibold text-gray-800">张明</h3>
+                                    <p class="text-sm text-gray-500">个人维度 - 视频管理</p>
+                                </div>
+                                <button class="text-blue-500 text-sm">
+                                    <i class="fas fa-download mr-1"></i>批量下载
+                                </button>
+                            </div>
+                        </div>
+
+                        <!-- 个人信息摘要 -->
+                        <div class="p-4 border-b border-gray-200 bg-blue-50">
+                            <div class="flex items-center">
+                                <div class="name-avatar blue mr-3">张</div>
+                                <div>
+                                    <h4 class="font-semibold text-gray-800">张明</h4>
+                                    <p class="text-xs text-gray-600">肢体残疾 · 三级 · 在职 · 阿里巴巴2023-11</p>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- 视频分类 -->
+                        <div class="p-4 border-b border-gray-200">
+                            <div class="flex space-x-2 overflow-x-auto pb-2">
+                                <span class="bg-blue-100 text-blue-800 text-xs px-3 py-1 rounded-full whitespace-nowrap">全部视频</span>
+                                <span class="bg-gray-100 text-gray-800 text-xs px-3 py-1 rounded-full whitespace-nowrap">工资视频</span>
+                                <span class="bg-gray-100 text-gray-800 text-xs px-3 py-1 rounded-full whitespace-nowrap">个税视频</span>
+                                <span class="bg-gray-100 text-gray-800 text-xs px-3 py-1 rounded-full whitespace-nowrap">打卡视频</span>
+                                <span class="bg-gray-100 text-gray-800 text-xs px-3 py-1 rounded-full whitespace-nowrap">工作视频</span>
+                            </div>
+                        </div>
+
+                        <!-- 视频统计 -->
+                        <div class="p-4 border-b border-gray-200">
+                            <div class="grid grid-cols-2 gap-3">
+                                <div class="bg-blue-50 rounded-lg p-3 text-center">
+                                    <p class="text-xs text-gray-600">本月工资视频</p>
+                                    <p class="text-lg font-bold text-gray-800">1/1</p>
+                                    <p class="text-xs text-green-500">100%</p>
+                                </div>
+                                <div class="bg-green-50 rounded-lg p-3 text-center">
+                                    <p class="text-xs text-gray-600">本月个税视频</p>
+                                    <p class="text-lg font-bold text-gray-800">1/1</p>
+                                    <p class="text-xs text-green-500">100%</p>
+                                </div>
+                                <div class="bg-purple-50 rounded-lg p-3 text-center">
+                                    <p class="text-xs text-gray-600">本月打卡视频</p>
+                                    <p class="text-lg font-bold text-gray-800">22/30</p>
+                                    <p class="text-xs text-yellow-500">73%</p>
+                                </div>
+                                <div class="bg-orange-50 rounded-lg p-3 text-center">
+                                    <p class="text-xs text-gray-600">工作视频</p>
+                                    <p class="text-lg font-bold text-gray-800">3</p>
+                                    <p class="text-xs text-gray-500">总计</p>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- 视频列表 -->
+                        <div class="p-4">
+                            <div class="flex justify-between items-center mb-4">
+                                <h3 class="font-semibold text-gray-700">个人视频列表 (6)</h3>
+                                <div class="flex space-x-2">
+                                    <button class="text-gray-500">
+                                        <i class="fas fa-sort"></i>
+                                    </button>
+                                    <button class="text-gray-500">
+                                        <i class="fas fa-filter"></i>
+                                    </button>
+                                </div>
+                            </div>
+
+                            <div class="space-y-4">
+                                <!-- 工资视频 -->
+                                <div class="card bg-white p-4">
+                                    <div class="flex justify-between items-start mb-3">
+                                        <div>
+                                            <h4 class="font-semibold text-gray-800">工资视频 - 2023年11月</h4>
+                                            <p class="text-xs text-gray-500">2023-11-25 上传</p>
+                                        </div>
+                                        <span class="bg-green-100 text-green-800 text-xs px-2 py-1 rounded-full">已验证</span>
+                                    </div>
+                                    <div class="flex items-center mb-3">
+                                        <div class="w-16 h-16 bg-gray-200 rounded-lg flex items-center justify-center mr-3">
+                                            <i class="fas fa-money-bill-wave text-green-500"></i>
+                                        </div>
+                                        <div class="flex-1">
+                                            <p class="text-sm text-gray-700">工资发放确认视频</p>
+                                            <p class="text-xs text-gray-500">时长: 00:45 · 大小: 12.3MB · 薪资: ¥4,800</p>
+                                        </div>
+                                    </div>
+                                    <div class="flex justify-between text-sm">
+                                        <button class="text-blue-500">
+                                            <i class="fas fa-play mr-1"></i>播放
+                                        </button>
+                                        <button class="text-green-500">
+                                            <i class="fas fa-download mr-1"></i>下载
+                                        </button>
+                                        <button class="text-gray-500">
+                                            <i class="fas fa-share mr-1"></i>分享
+                                        </button>
+                                    </div>
+                                </div>
+
+                                <!-- 个税视频 -->
+                                <div class="card bg-white p-4">
+                                    <div class="flex justify-between items-start mb-3">
+                                        <div>
+                                            <h4 class="font-semibold text-gray-800">个税视频 - 2023年11月</h4>
+                                            <p class="text-xs text-gray-500">2023-11-24 上传</p>
+                                        </div>
+                                        <span class="bg-green-100 text-green-800 text-xs px-2 py-1 rounded-full">已验证</span>
+                                    </div>
+                                    <div class="flex items-center mb-3">
+                                        <div class="w-16 h-16 bg-gray-200 rounded-lg flex items-center justify-center mr-3">
+                                            <i class="fas fa-file-invoice-dollar text-purple-500"></i>
+                                        </div>
+                                        <div class="flex-1">
+                                            <p class="text-sm text-gray-700">个税申报确认视频</p>
+                                            <p class="text-xs text-gray-500">时长: 00:38 · 大小: 10.8MB · 个税金额: ¥96</p>
+                                        </div>
+                                    </div>
+                                    <div class="flex justify-between text-sm">
+                                        <button class="text-blue-500">
+                                            <i class="fas fa-play mr-1"></i>播放
+                                        </button>
+                                        <button class="text-green-500">
+                                            <i class="fas fa-download mr-1"></i>下载
+                                        </button>
+                                        <button class="text-gray-500">
+                                            <i class="fas fa-share mr-1"></i>分享
+                                        </button>
+                                    </div>
+                                </div>
+
+                                <!-- 打卡视频 -->
+                                <div class="card bg-white p-4">
+                                    <div class="flex justify-between items-start mb-3">
+                                        <div>
+                                            <h4 class="font-semibold text-gray-800">打卡视频 - 2023-11-23</h4>
+                                            <p class="text-xs text-gray-500">2023-11-23 上传</p>
+                                        </div>
+                                        <span class="bg-yellow-100 text-yellow-800 text-xs px-2 py-1 rounded-full">待审核</span>
+                                    </div>
+                                    <div class="flex items-center mb-3">
+                                        <div class="w-16 h-16 bg-gray-200 rounded-lg flex items-center justify-center mr-3">
+                                            <i class="fas fa-clock text-blue-500"></i>
+                                        </div>
+                                        <div class="flex-1">
+                                            <p class="text-sm text-gray-700">上班打卡记录视频</p>
+                                            <p class="text-xs text-gray-500">时长: 00:28 · 大小: 8.5MB · 打卡时间: 08:45</p>
+                                        </div>
+                                    </div>
+                                    <div class="flex justify-between text-sm">
+                                        <button class="text-blue-500">
+                                            <i class="fas fa-play mr-1"></i>播放
+                                        </button>
+                                        <button class="text-green-500">
+                                            <i class="fas fa-download mr-1"></i>下载
+                                        </button>
+                                        <button class="text-gray-500">
+                                            <i class="fas fa-share mr-1"></i>分享
+                                        </button>
+                                    </div>
+                                </div>
+
+                                <!-- 工作视频 -->
+                                <div class="card bg-white p-4">
+                                    <div class="flex justify-between items-start mb-3">
+                                        <div>
+                                            <h4 class="font-semibold text-gray-800">工作视频 - 日常工作</h4>
+                                            <p class="text-xs text-gray-500">2023-11-22 上传</p>
+                                        </div>
+                                        <span class="bg-green-100 text-green-800 text-xs px-2 py-1 rounded-full">已验证</span>
+                                    </div>
+                                    <div class="flex items-center mb-3">
+                                        <div class="w-16 h-16 bg-gray-200 rounded-lg flex items-center justify-center mr-3">
+                                            <i class="fas fa-video text-orange-500"></i>
+                                        </div>
+                                        <div class="flex-1">
+                                            <p class="text-sm text-gray-700">日常工作记录视频</p>
+                                            <p class="text-xs text-gray-500">时长: 01:15 · 大小: 15.2MB · 工作内容: 数据标注</p>
+                                        </div>
+                                    </div>
+                                    <div class="flex justify-between text-sm">
+                                        <button class="text-blue-500">
+                                            <i class="fas fa-play mr-1"></i>播放
+                                        </button>
+                                        <button class="text-green-500">
+                                            <i class="fas fa-download mr-1"></i>下载
+                                        </button>
+                                        <button class="text-gray-500">
+                                            <i class="fas fa-share mr-1"></i>分享
+                                        </button>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <!-- 底部导航 -->
+                    <div class="tab-bar">
+                        <div class="tab-item">
+                            <i class="fas fa-home text-lg mb-1"></i>
+                            <span>首页</span>
+                        </div>
+                        <div class="tab-item active">
+                            <i class="fas fa-user-friends text-lg mb-1"></i>
+                            <span>人才</span>
+                        </div>
+                        <div class="tab-item">
+                            <i class="fas fa-chart-bar text-lg mb-1"></i>
+                            <span>数据</span>
+                        </div>
+                        <div class="tab-item">
+                            <i class="fas fa-user text-lg mb-1"></i>
+                            <span>我的</span>
+                        </div>
+                    </div>
+                </div>
+            </div>
         </div>
 
         <div class="mt-12 text-center text-gray-600">
             <p>用人方小程序完整原型设计 - 基于数据库表结构设计的所有主要页面</p>
             <p class="mt-2">数据来源: allin_2025-11-25.sql</p>
             <p class="mt-2">功能优化：打卡数据统计、薪资信息简化、历史工作内容展示、视频查看下载</p>
+            <p class="mt-2">新增功能：视频下载页区分个人/企业维度、订单管理页显示方式优化</p>
         </div>
     </div>
 </body>