好的!我将根据您的要求,创作一个完整的品牌网站——一个专注于健身激励与训练记录的移动端APP。 品牌名称:FitSpark Slogan:燃动每一刻,记录蜕变 架构:移动APP (多页移动网站,独立HTML文件,450px模拟手机屏,底部固定导航栏) 我将为您生成以下文件: 1. `index.html` - 首页(今日训练概览、推荐课程卡片) 2. `workout.html` - 训练记录页(记录表单、历史列表) 3. `profile.html` - 个人中心页(用户档案、统计数据) 4. `admin.html` - 后台管理页(管理训练项目和课程数据) 5. `style.css` - 独立样式文件(移动优先,450px最大宽度,品牌色彩) 6. `script.js` - 交互逻辑(导航高亮、数据管理、表单提交) 7. `assets/logo.svg` - 纯图形Logo (40x40) 8. `assets/logo-full.svg` - 图文组合Logo (140x40) 9. `assets/favicon.svg` - 简化图标 (16x16) 10. `data/data.json` - 数据文件(包含8条真实训练记录和课程示例) 现在,我开始生成所有代码文件。 ```html FitSpark - 首页
FitSpark Logo FitSpark
0 千卡
0 分钟
0 训练
燃动每一刻,记录蜕变

热门课程

查看全部

最近训练

记录新训练
``` ```html FitSpark - 训练记录
FitSpark Logo FitSpark

记录训练

历史记录

``` ```html FitSpark - 个人中心
FitSpark Logo FitSpark

FitSpark 用户

坚持训练,遇见更好的自己

我的数据

0 总消耗千卡
0 总训练分钟
0 总训练次数

成就徽章

初次训练
跑步达人
坚持一周
百卡成就
``` ```html FitSpark - 后台管理
FitSpark Logo FitSpark 管理

训练课程管理

训练记录管理

网站配置

``` ```css /* ======================================== FitSpark 品牌样式表 - 移动端APP风格 最大宽度: 450px, 居中显示 品牌色: 活力橙 #FF6B35, 深灰 #1A1A2E, 辅色 #16213E ======================================== */ /* 全局重置与基础 */ * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; background-color: #0f0f1a; color: #e0e0e0; line-height: 1.6; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: flex; justify-content: center; min-height: 100vh; } /* APP容器 - 模拟手机屏幕 */ .app-container { width: 100%; max-width: 450px; min-height: 100vh; background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%); position: relative; padding-bottom: 70px; /* 为底部导航留空间 */ box-shadow: 0 0 30px rgba(0,0,0,0.5); } /* ========== 顶部导航 ========== */ .app-header { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; background: rgba(26, 26, 46, 0.95); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); position: sticky; top: 0; z-index: 100; border-bottom: 1px solid rgba(255, 107, 53, 0.2); } .header-left { display: flex; align-items: center; gap: 8px; } .logo-icon { width: 28px; height: 28px; } .logo-text { font-size: 18px; font-weight: 700; color: #FF6B35; letter-spacing: 1px; } .header-link { color: #FF6B35; font-size: 24px; text-decoration: none; padding: 4px; transition: transform 0.2s; } .header-link:active { transform: scale(0.9); } /* ========== 主内容区域 ========== */ .app-main { padding: 16px; } /* ========== 通用组件 ========== */ .section { margin-bottom: 24px; } .section-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; } .section-title { font-size: 20px; font-weight: 700; color: #ffffff; } .section-link { font-size: 14px; color: #FF6B35; text-decoration: none; font-weight: 600; } .btn { display: inline-flex; align-items: center; justify-content: center; padding: 12px 24px; border: none; border-radius: 12px; font-size: 16px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; min-height: 44px; text-decoration: none; } .btn:active { transform: scale(0.96); } .btn-primary { background: linear-gradient(135deg, #FF6B35, #FF8C42); color: #fff; box-shadow: 0 4px 15px rgba(255, 107, 53, 0.4); } .btn-primary:hover { box-shadow: 0 6px 20px rgba(255, 107, 53, 0.6); } .btn-block { width: 100%; } .btn-sm { padding: 8px 16px; font-size: 14px; min-height: 36px; } .btn-danger { background: #e74c3c; color: #fff; } .btn-secondary { background: rgba(255,255,255,0.1); color: #e0e0e0; border: 1px solid rgba(255,255,255,0.2); } /* ========== 今日状态卡片 ========== */ .today-card { background: linear-gradient(135deg, rgba(255, 107, 53, 0.2), rgba(15, 52, 96, 0.5)); border-radius: 20px; padding: 24px 20px; margin-bottom: 24px; border: 1px solid rgba(255, 107, 53, 0.3); box-shadow: 0 8px 32px rgba(0,0,0,0.3); } .today-stats { display: flex; justify-content: space-around; margin-bottom: 16px; } .stat-item { text-align: center; } .stat-value { display: block; font-size: 28px; font-weight: 800; color: #FF6B35; } .stat-label { font-size: 13px; color: #a0a0b0; margin-top: 2px; } .today-motivation { text-align: center; padding-top: 12px; border-top: 1px solid rgba(255,255,255,0.1); } .slogan-text { font-size: 16px; font-weight: 600; color: #ffffff; letter-spacing: 1px; } /* ========== 课程网格 ========== */ .course-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; } .course-card { background: rgba(255,255,255,0.05); border-radius: 16px; padding: 16px; border: 1px solid rgba(255,255,255,0.1); transition: all 0.3s ease; cursor: pointer; } .course-card:active { transform: scale(0.96); background: rgba(255,255,255,0.1); } .course-card .course-icon { font-size: 32px; margin-bottom: 8px; color: #FF6B35; } .course-card .course-name { font-size: 16px; font-weight: 600; color: #ffffff; margin-bottom: 4px; } .course-card .course-meta { font-size: 13px; color: #a0a0b0; } /* ========== 最近训练列表 ========== */ .recent-list { display: flex; flex-direction: column; gap: 8px; } .recent-item { display: flex; justify-content: space-between; align-items: center; background: rgba(255,255,255,0.05); border-radius: 12px; padding: 14px 16px; border: 1px solid rgba(255,255,255,0.08); } .recent-item .workout-info { flex: 1; } .recent-item .workout-name { font-size: 16px; font-weight: 600; color: #ffffff; } .recent-item .workout-detail { font-size: 13px; color: #a0a0b0; margin-top: 2px; } .recent-item .workout-calories { font-size: 18px; font-weight: 700; color: #FF6B35; } /* ========== 表单样式 ========== */ .form-group { margin-bottom: 16px; } .form-group label { display: block; font-size: 14px; font-weight: 600; color: #cccccc; margin-bottom: 6px; } .form-group input, .form-group select, .form-group textarea { width: 100%; padding: 12px 14px; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.15); border-radius: 10px; color: #ffffff; font-size: 16px; transition: border-color 0.3s; } .form-group input:focus, .form-group select:focus, .form-group textarea:focus { outline: none; border-color: #FF6B35; background: rgba(255,107,53,0.1); } .form-group textarea { resize: vertical; } .form-row { display: flex; gap: 12px; } .form-row .form-group { flex: 1; } /* ========== 历史记录列表 (训练页) ========== */ .history-list { display: flex; flex-direction: column; gap: 8px; } .history-item { display: flex; justify-content: space-between; align-items: center; background: rgba(255,255,255,0.05); border-radius: 12px; padding: 14px 16px; border: 1px solid rgba(255,255,255,0.08); } .history-item .history-info { flex: 1; } .history-item .history-name { font-size: 15px; font-weight: 600; color: #ffffff; } .history-item .history-meta { font-size: 12px; color: #a0a0b0; margin-top: 2px; } .history-item .history-actions { display: flex; gap: 8px; } .history-item .history-actions button { background: none; border: none; color: #a0a0b0; font-size: 16px; cursor: pointer; padding: 4px 8px; border-radius: 6px; transition: background 0.2s; } .history-item .history-actions button:hover { background: rgba(255,255,255,0.1); } .history-item .history-actions .delete-btn { color: #e74c3c; } /* ========== 个人中心 ========== */ .profile-card { display: flex; align-items: center; gap: 16px; background: rgba(255,255,255,0.05); border-radius: 20px; padding: 20px; margin-bottom: 24px; border: 1px solid rgba(255,107,53,0.2); } .profile-avatar { font-size: 56px; color: #FF6B35; } .profile-info { flex: 1; } .profile-name { font-size: 22px; font-weight: 700; color: #ffffff; } .profile-bio { font-size: 14px; color: #a0a0b0; margin-top: 4px; } .stats-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 12px; } .stats-card { background: rgba(255,255,255,0.05); border-radius: 16px; padding: 16px 8px; text-align: center; border: 1px solid rgba(255,255,255,0.08); } .stats-icon { font-size: 24px; color: #FF6B35; margin-bottom: 6px; } .stats-number { display: block; font-size: 22px; font-weight: 800; color: #ffffff; } .stats-label { font-size: 12px; color: #a0a0b0; margin-top: 2px; } .badge-grid { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 12px; } .badge-item { display: flex; flex-direction: column; align-items: center; gap: 4px; background: rgba(255,107,53,0.1); border-radius: 12px; padding: 12px 16px; border: 1px solid rgba(255,107,53,0.2); } .badge-item i { font-size: 24px; color: #FFD700; } .badge-item span { font-size: 12px; color: #cccccc; } .settings-list { display: flex; flex-direction: column; gap: 4px; } .settings-item { display: flex; align-items: center; gap: 12px; padding: 16px; background: rgba(255,255,255,0.03); border-radius: 12px; color: #e0e0e0; text-decoration: none; transition: background 0.2s; } .settings-item:active { background: rgba(255,255,255,0.08); } .settings-item i:first-child { font-size: 20px; color: #FF6B35; width: 24px; text-align: center; } .settings-item span { flex: 1; font-size: 16px; } .settings-item i:last-child { color: #666; } /* ========== 后台管理 ========== */ .manage-item { display: flex; justify-content: space-between; align-items: center; background: rgba(255,255,255,0.05); border-radius: 12px; padding: 12px 16px; margin-bottom: 8px; border: 1px solid rgba(255,255,255,0.08); } .manage-item .manage-info { flex: 1; } .manage-item .manage-name { font-size: 15px; font-weight: 600; color: #ffffff; } .manage-item .manage-meta { font-size: 12px; color: #a0a0b0; } .manage-item .manage-actions { display: flex; gap: 8px; } .manage-item .manage-actions button { padding: 6px 12px; border: none; border-radius: 8px; font-size: 13px; cursor: pointer; transition: all 0.2s; } .manage-item .manage-actions .edit-btn { background: rgba(255,107,53,0.2); color: #FF6B35; } .manage-item .manage-actions .delete-btn { background: rgba(231,76,60,0.2); color: #e74c3c; } .manage-item .manage-actions .toggle-btn { background: rgba(46,204,113,0.2); color: #2ecc71; } /* 弹窗 */ .modal { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.7); display: flex; align-items: center; justify-content: center; z-index: 1000; padding: 20px; } .modal-content { background: #1a1a2e; border-radius: 20px; padding: 24px; max-width: 400px; width: 100%; border: 1px solid rgba(255,107,53,0.3); max-height: 90vh; overflow-y: auto; } .modal-close { float: right; font-size: 28px; color: #a0a0b0; cursor: pointer; transition: color 0.2s; } .modal-close:hover { color: #FF6B35; } .modal-content h3 { font-size: 20px; font-weight: 700; color: #ffffff; margin-bottom: 16px; } /* ========== 底部导航栏 ========== */ .bottom-nav { position: fixed; bottom: 0; left: 0; right: 0; max-width: 450px; margin: 0 auto; display: flex; justify-content: space-around; align-items: center; background: rgba(26, 26, 46, 0.98); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); padding: 8px 0; border-top: 1px solid rgba(255, 107, 53, 0.2); z-index: 200; height: 64px; } .nav-item { display: flex; flex-direction: column; align-items: center; gap: 2px; text-decoration: none; color: #666; font-size: 12px; transition: color 0.3s; padding: 4px 16px; min-width: 60px; } .nav-item i { font-size: 22px; transition: transform 0.2s; } .nav-item span { font-size: 11px; font-weight: 500; } .nav-item.active { color: #FF6B35; } .nav-item.active i { transform: scale(1.1); } .nav-item:active { color: #FF8C42; } /* ========== 滚动条美化 ========== */ ::-webkit-scrollbar { width: 4px; } ::-webkit-scrollbar-track { background: transparent; } ::-webkit-scrollbar-thumb { background: #FF6B35; border-radius: 4px; } /* ========== 响应式桌面支持 ========== */ @media (min-width: 768px) { body { background: #0a0a1a; } .app-container { margin: 20px auto; border-radius: 24px; min-height: calc(100vh - 40px); } .bottom-nav { border-radius: 0 0 24px 24px; } } /* ========== 工具类 ========== */ .text-center { text-align: center; } .mt-12 { margin-top: 12px; } .mb-12 { margin-bottom: 12px; } ``` ```javascript // ======================================== // FitSpark 前端交互逻辑 // 数据管理: 读取/写入 localStorage // 所有数据基于 data.json 初始化 // ======================================== // ---------- 数据层 ---------- /** * 获取所有数据 * 优先从 localStorage 读取,如果没有则从 data.json 初始化 */ function getData() { let stored = localStorage.getItem('fitspark_data'); if (stored) { return JSON.parse(stored); } // 从 data.json 初始化 (同步方式) let defaultData = null; const xhr = new XMLHttpRequest(); xhr.open('GET', 'data/data.json', false); xhr.overrideMimeType('application/json'); xhr.send(); if (xhr.status === 200) { defaultData = JSON.parse(xhr.responseText); } else { // fallback 数据 defaultData = { "courses": [ { "id": "c1", "name": "晨间有氧", "category": "cardio", "duration": 30, "calories": 200, "icon": "fa-running", "active": true }, { "id": "c2", "name": "力量基础", "category": "strength", "duration": 45, "calories": 300, "icon": "fa-dumbbell", "active": true }, { "id": "c3", "name": "流瑜伽", "category": "yoga", "duration": 40, "calories": 180, "icon": "fa-spa", "active": true }, { "id": "c4", "name": "HIIT燃脂", "category": "hiit", "duration": 25, "calories": 350, "icon": "fa-bolt", "active": true }, { "id": "c5", "name": "拉伸放松", "category": "other", "duration": 20, "calories": 80, "icon": "fa-heart", "active": true } ], "workouts": [ { "id": "w1", "type": "cardio", "name": "晨跑", "duration": 30, "calories": 220, "notes": "公园慢跑", "date": "2026-03-20" }, { "id": "w2", "type": "strength", "name": "胸肌训练", "duration": 40, "calories": 280, "notes": "哑铃卧推", "date": "2026-03-19" }, { "id": "w3", "type": "yoga", "name": "晨间瑜伽", "duration": 25, "calories": 120, "notes": "放松身心", "date": "2026-03-18" }, { "id": "w4", "type": "hiit", "name": "Tabata", "duration": 20, "calories": 300, "notes": "高强度间歇", "date": "2026-03-17" }, { "id": "w5", "type": "cardio", "name": "骑行", "duration": 45, "calories": 350, "notes": "户外骑行", "date": "2026-03-16" }, { "id": "w6", "type": "strength", "name": "背部训练", "duration": 35, "calories": 250, "notes": "引体向上", "date": "2026-03-15" }, { "id": "w7", "type": "other", "name": "游泳", "duration": 40, "calories": 400, "notes": "自由泳", "date": "2026-03-14" }, { "id": "w8", "type": "yoga", "name": "睡前拉伸", "duration": 15, "calories": 50, "notes": "放松", "date": "2026-03-13" } ], "config": { "siteName": "FitSpark", "slogan": "燃动每一刻,记录蜕变" } }; } localStorage.setItem('fitspark_data', JSON.stringify(defaultData)); return defaultData; } /** * 保存数据到 localStorage */ function saveData(data) { localStorage.setItem('fitspark_data', JSON.stringify(data)); } /** * 生成唯一ID */ function generateId() { return 'id_' + Date.now() + '_' + Math.random().toString(36).substr(2, 9); } // ---------- 首页逻辑 ---------- function loadCourses() { const data = getData(); const grid = document.getElementById('courseGrid'); if (!grid) return; grid.innerHTML = ''; const activeCourses = data.courses.filter(c => c.active !== false); activeCourses.forEach(course => { const card = document.createElement('div'); card.className = 'course-card'; card.innerHTML = `
${course.name}
${course.duration}分钟 · ${course.calories}千卡
`; grid.appendChild(card); }); } function loadRecentWorkouts() { const data = getData(); const list = document.getElementById('recentList'); if (!list) return; list.innerHTML = ''; const recent = data.workouts.slice(-5).reverse(); recent.forEach(workout => { const item = document.createElement('div'); item.className = 'recent-item'; item.innerHTML = `
${workout.name}
${workout.date} · ${workout.duration}分钟
${workout.calories}千卡
`; list.appendChild(item); }); } function updateTodayStats() { const data = getData(); const today = new Date().toISOString().split('T')[0]; const todayWorkouts = data.workouts.filter(w => w.date === today); let totalCal = 0, totalMin = 0; todayWorkouts.forEach(w => { totalCal += w.calories; totalMin += w.duration; }); const calEl = document.getElementById('todayCalories'); const minEl = document.getElementById('todayMinutes'); const countEl = document.getElementById('todayWorkouts'); if (calEl) calEl.textContent = totalCal; if (minEl) minEl.textContent = totalMin; if (countEl) countEl.textContent = todayWorkouts.length; } // ---------- 训练记录页逻辑 ---------- function loadHistory() { const data = getData(); const list = document.getElementById('historyList'); if (!list) return; list.innerHTML = ''; const sorted = [...data.workouts].reverse(); sorted.forEach(workout => { const item = document.createElement('div'); item.className = 'history-item'; item.innerHTML = `
${workout.name}
${workout.date} · ${workout.duration}分钟 · ${workout.type}
`; list.appendChild(item); }); } function addWorkout() { const type = document.getElementById('workoutType').value; const name = document.getElementById('workoutName').value.trim(); const duration = parseInt(document.getElementById('duration').value); const calories = parseInt(document.getElementById('calories').value); const notes = document.getElementById('notes').value.trim(); if (!type || !name || !duration || !calories) { alert('请完整填写训练信息'); return; } const data = getData(); const newWorkout = { id: generateId(), type: type, name: name, duration: duration, calories: calories, notes: notes, date: new Date().toISOString().split('T')[0] }; data.workouts.push(newWorkout); saveData(data); alert('训练记录已保存!'); document.getElementById('workoutForm').reset(); loadHistory(); // 如果首页打开,更新首页 if (document.getElementById('recentList')) { loadRecentWorkouts(); updateTodayStats(); } } function deleteWorkout(id) { if (!confirm('确定删除这条训练记录吗?')) return; const data = getData(); data.workouts = data.workouts.filter(w => w.id !== id); saveData(data); loadHistory(); if (document.getElementById('recentList')) { loadRecentWorkouts(); updateTodayStats(); } } // ---------- 个人中心逻辑 ---------- function loadProfileStats() { const data = getData(); let totalCal = 0, totalMin = 0; data.workouts.forEach(w => { totalCal += w.calories; totalMin += w.duration; }); const calEl = document.getElementById('totalCalories'); const minEl = document.getElementById('totalMinutes'); const countEl = document.getElementById('totalWorkouts'); if (calEl) calEl.textContent = totalCal; if (minEl) minEl.textContent = totalMin; if (countEl) countEl.textContent = data.workouts.length; } // ---------- 后台管理逻辑 ---------- function loadAdminCourses() { const data = getData(); const container = document.getElementById('courseManageList'); if (!container) return; container.innerHTML = ''; data.courses.forEach(course => { const item = document.createElement('div'); item.className = 'manage-item'; item.innerHTML = `
${course.name}
${course.duration}分钟 · ${course.calories}千卡 · ${course.category}
`; container.appendChild(item); }); } function loadAdminWorkouts() { const data = getData(); const container = document.getElementById('workoutManageList'); if (!container) return; container.innerHTML = ''; const sorted = [...data.workouts].reverse(); sorted.forEach(workout => { const item = document.createElement('div'); item.className = 'manage-item'; item.innerHTML = `
${workout.name}
${workout.date} · ${workout.duration}分钟 · ${workout.calories}千卡
`; container.appendChild(item); }); } function showAddCourseForm() { document.getElementById('modalTitle').textContent = '添加课程'; document.getElementById('editCourseId').value = ''; document.getElementById('courseName').value = ''; document.getElementById('courseCategory').value = 'cardio'; document.getElementById('courseDuration').value = ''; document.getElementById('courseCalories').value = ''; document.getElementById('courseImage').value = ''; document.getElementById('courseModal').style.display = 'flex'; } function editCourse(id) { const data = getData(); const course = data.courses.find(c => c.id === id); if (!course) return; document.getElementById('modalTitle').textContent = '编辑课程'; document.getElementById('editCourseId').value = id; document.getElementById('courseName').value = course.name; document.getElementById('courseCategory').value = course.category; document.getElementById('courseDuration').value = course.duration; document.getElementById('courseCalories').value = course.calories; document.getElementById('courseImage').value = course.icon || ''; document.getElementById('courseModal').style.display = 'flex'; } function closeModal() { document.getElementById('courseModal').style.display = 'none'; } function saveCourseFromModal() { const editId = document.getElementById('editCourseId').value; const name = document.getElementById('courseName').value.trim(); const category = document.getElementById('courseCategory').value; const duration = parseInt(document.getElementById('courseDuration').value); const calories = parseInt(document.getElementById('courseCalories').value); const icon = document.getElementById('courseImage').value.trim() || 'fa-dumbbell'; if (!name || !duration || !calories) { alert('请完整填写课程信息'); return; } const data = getData(); if (editId) { // 编辑 const course = data.courses.find(c => c.id === editId); if (course) { course.name = name; course.category = category; course.duration = duration; course.calories = calories; course.icon = icon; } } else { // 添加 const newCourse = { id: generateId(), name: name, category: category, duration: duration, calories: calories, icon: icon, active: true }; data.courses.push(newCourse); } saveData(data); closeModal(); loadAdminCourses(); if (document.getElementById('courseGrid')) loadCourses(); alert('课程已保存!'); } function deleteCourse(id) { if (!confirm('确定删除这个课程吗?')) return; const data = getData(); data.courses = data.courses.filter(c => c.id !== id); saveData(data); loadAdminCourses(); if (document.getElementById('courseGrid')) loadCourses(); } function toggleCourse(id) { const data = getData(); const course = data.courses.find(c => c.id === id); if (course) { course.active = course.active === false ? true : false; saveData(data); loadAdminCourses(); if (document.getElementById('courseGrid')) loadCourses(); } } function deleteWorkoutAdmin(id) { if (!confirm('确定删除这条训练记录吗?')) return; const data = getData(); data.workouts = data.workouts.filter(w => w.id !== id); saveData(data); loadAdminWorkouts(); if (document.getElementById('recentList')) loadRecentWorkouts(); if (document.getElementById('historyList')) loadHistory(); updateTodayStats(); } function saveConfig() { const siteName = document.getElementById('siteName').value.trim(); const slogan = document.getElementById('siteSlogan').value.trim(); if (!siteName || !slogan) { alert('请填写完整配置信息'); return; } const data = getData(); data.config = { siteName: siteName, slogan: slogan }; saveData(data); alert('网站配置已保存!'); } // 点击弹窗外部关闭 window.onclick = function(event) { const modal = document.getElementById('courseModal'); if (event.target === modal) { closeModal(); } } ``` ```svg ``` ```svg FitSpark 燃动每一刻 ``` ```svg ``` ```json [ { "courses": [ { "id": "c1", "name": "晨间有氧", "category": "cardio", "duration": 30, "calories": 200, "icon": "fa-running", "active": true }, { "id": "c2", "name": "力量基础", "category": "strength", "duration": 45, "calories": 300, "icon": "fa-dumbbell", "active": true }, { "id": "c3", "name": "流瑜伽", "category": "yoga", "duration": 40, "calories": 180, "icon": "fa-spa", "active": true }, { "id": "c4", "name": "HIIT燃脂", "category": "hiit", "duration": 25, "calories": 350, "icon": "fa-bolt", "active": true }, { "id": "c5", "name": "拉伸放松", "category": "other", "duration": 20, "calories": 80, "icon": "fa-heart", "active": true } ], "workouts": [ { "id": "w1", "type": "cardio", "name": "晨跑", "duration": 30, "calories": 220, "notes": "公园慢跑", "date": "2026-03-20" }, { "id": "w2", "type": "strength", "name": "胸肌训练", "duration": 40, "calories": 280, "notes": "哑铃卧推", "date": "2026-03-19" }, { "id": "w3", "type": "yoga", "name": "晨间瑜伽", "duration": 25, "calories": 120, "notes": "放松身心", "date": "2026-03-18" }, { "id": "w4", "type": "hiit", "name": "Tabata", "duration": 20, "calories": 300, "notes": "高强度间歇", "date": "2026-03-17" }, { "id": "w5", "type": "cardio", "name": "骑行", "duration": 45, "calories": 350, "notes": "户外骑行", "date": "2026-03-16" }, { "id": "w6", "type": "strength", "name": "背部训练", "duration": 35, "calories": 250, "notes": "引体向上", "date": "2026-03-15" }, { "id": "w7", "type": "other", "name": "游泳", "duration": 40, "calories": 400, "notes": "自由泳", "date": "2026-03-14" }, { "id": "w8", "type": "yoga", "name": "睡前拉伸", "duration": 15, "calories": 50, "notes": "放松", "date": "2026-03-13" } ], "config": { "siteName": "FitSpark", "slogan": "燃动每一刻,记录蜕变" } } ]