feat: 暂存,修订体重管理PRD文档

This commit is contained in:
fengpu
2026-07-17 11:38:21 +08:00
parent d5b3e52ed4
commit 6836a0794b
5 changed files with 82 additions and 318 deletions
@@ -112,6 +112,30 @@
.record-action-btn.photo { border-color: #fa8c16; background: #fff7e6; color: #fa8c16; }
.record-action-btn:active { opacity: 0.8; }
.record-action-btn .ra-icon { font-size: 16px; }
/* 当餐摄入合计与状态(紧凑色块卡) */
.meal-summary {
margin: 0 16px 16px; padding: 10px 14px; border-radius: 10px;
display: flex; align-items: center; justify-content: space-between; gap: 10px;
background: #f6ffed; border: 1px solid #d9f7be;
transition: background 0.25s, border-color 0.25s;
}
.meal-summary.over { background: #fff1f0; border-color: #ffccc7; }
.meal-summary.low { background: #fff7e6; border-color: #ffd591; }
.meal-summary .summary-left { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.meal-summary .summary-row1 { display: flex; align-items: baseline; gap: 8px; }
.meal-summary .summary-label { font-size: 12px; color: #666; }
.meal-summary .summary-cal { font-size: 20px; font-weight: 700; color: #1a1a1a; line-height: 1.1; }
.meal-summary .summary-cal .cal-unit { font-size: 11px; font-weight: 500; color: #999; margin-left: 2px; }
.meal-summary .summary-diff { font-size: 11px; color: #999; }
.meal-summary .status-pill {
display: flex; align-items: center; gap: 4px; flex-shrink: 0;
padding: 5px 10px; border-radius: 12px; font-size: 12px; font-weight: 600;
background: rgba(255,255,255,0.92);
}
.meal-summary .status-pill .sp-icon { font-size: 13px; line-height: 1; }
.meal-summary .status-pill.ok { color: #52c41a; }
.meal-summary .status-pill.over { color: #ff4d4f; }
.meal-summary .status-pill.low { color: #fa8c16; }
</style>
</head>
<body>
@@ -144,8 +168,7 @@
<div class="meal-tab active">午餐</div>
<div class="meal-tab">晚餐</div>
</div>
<div class="meal-list"></div>
<!-- 双按钮:手动补录 / 拍照记录 -->
<!-- 双按钮:手动补录 / 拍照记录(位于餐品列表上方) -->
<div class="record-actions-wrap">
<div class="record-actions">
<button class="record-action-btn" onclick="goSelfRecord()">
@@ -156,6 +179,20 @@
</button>
</div>
</div>
<div class="meal-list"></div>
<!-- 当餐摄入合计与状态(紧凑色块卡) -->
<div class="meal-summary" id="mealSummary">
<div class="summary-left">
<div class="summary-row1">
<span class="summary-label">当餐摄入合计</span>
<span class="summary-cal"><span id="totalCal">0</span><span class="cal-unit">kcal</span></span>
</div>
<span class="summary-diff" id="calDiff">建议范围 500-800 kcal</span>
</div>
<span class="status-pill over" id="intakeStatus">
<span class="sp-icon" id="statusIcon">⚠️</span><span id="statusText">超标</span>
</span>
</div>
</div>
</div>
@@ -328,6 +365,34 @@
+ '<span class="food-source ' + (d.sourceClass || '') + '">' + d.source + '</span>'
+ '</div></a>';
}).join('');
/* 刷新当餐摄入合计与状态 */
renderMealSummary(items, mealType);
}
/* 各餐次合理摄入区间(下限/上限 kcal) */
var mealCalRanges = { '早餐': [300, 500], '午餐': [500, 800], '晚餐': [400, 700] };
/* 渲染当餐摄入合计与摄入状态(紧凑色块卡) */
function renderMealSummary(items, mealType) {
var totalCal = items.reduce(function(sum, d) { return sum + (d.cal || 0); }, 0);
document.getElementById('totalCal').textContent = totalCal;
var range = mealCalRanges[mealType] || [400, 700];
var lower = range[0], upper = range[1];
var status, cls, icon;
if (totalCal < lower) {
status = '不足'; cls = 'low'; icon = '📉';
} else if (totalCal > upper) {
status = '超标'; cls = 'over'; icon = '⚠️';
} else {
status = '适量'; cls = 'ok'; icon = '✅';
}
var diffText = '建议范围 ' + lower + '-' + upper + ' kcal';
document.getElementById('mealSummary').className = 'meal-summary ' + cls;
var statusEl = document.getElementById('intakeStatus');
statusEl.className = 'status-pill ' + cls;
document.getElementById('statusIcon').textContent = icon;
document.getElementById('statusText').textContent = status;
document.getElementById('calDiff').textContent = diffText;
}
mealTabs.forEach(function(tab) {