食谱建议
营养分析
@@ -398,9 +423,201 @@ function goBack() {
/* ===== Core data ===== */
var todayStr = '2026-07-23';
var selectedDate = todayStr;
+var todayDate = new Date(2026, 6, 23); // 2026-07-23
+
+/* ===== 周导航（页面顶部周日历） ===== */
+var WEEK_MS = 7 * 24 * 60 * 60 * 1000;
+var weekDayLabels = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
+var currentWeekStart = getMonday(todayDate);
+
+function getMonday(d) {
+ var m = new Date(d);
+ var day = m.getDay();
+ var diff = day === 0 ? -6 : 1 - day;
+ m.setDate(m.getDate() + diff);
+ m.setHours(0, 0, 0, 0);
+ return m;
+}
+
+function fmtDate(d) {
+ var y = d.getFullYear();
+ var m = ('0' + (d.getMonth() + 1)).slice(-2);
+ var day = ('0' + d.getDate()).slice(-2);
+ return y + '-' + m + '-' + day;
+}
+
+function isSameDay(a, b) {
+ return a.getFullYear() === b.getFullYear() &&
+ a.getMonth() === b.getMonth() &&
+ a.getDate() === b.getDate();
+}
+
+/* ===== 渲染周日历 ===== */
+function renderWeek() {
+ var container = document.getElementById('calWeek');
+ container.innerHTML = '';
+
+ var weekDayChars = ['日', '一', '二', '三', '四', '五', '六'];
+
+ for (var i = 0; i < 7; i++) {
+ var d = new Date(currentWeekStart);
+ d.setDate(d.getDate() + i);
+ var dateStr = fmtDate(d);
+ var wd = weekDayChars[d.getDay()];
+ var dayNum = d.getDate();
+ var isToday = isSameDay(d, todayDate);
+ var hasData = dayData[dateStr] && dayData[dateStr].intake > 0;
+
+ var dayEl = document.createElement('div');
+ dayEl.className = 'cal-day' + (isToday ? ' today' : '') + (!hasData ? ' no-data' : '');
+ dayEl.setAttribute('data-date', dateStr);
+ dayEl.onclick = function() { selectDay(this); };
+
+ dayEl.innerHTML =
+ '
' + wd + '
' +
+ '
' +
+ (hasData ? '
' : '') +
+ '
' + dayNum + '' +
+ '
';
+
+ container.appendChild(dayEl);
+ }
+
+ // 箭头状态：未来周禁止前进
+ var mondayOfThisWeek = getMonday(todayDate);
+ var nextArrow = document.getElementById('calNext');
+ if (currentWeekStart.getTime() >= mondayOfThisWeek.getTime()) {
+ nextArrow.style.opacity = '0.3';
+ nextArrow.style.pointerEvents = 'none';
+ } else {
+ nextArrow.style.opacity = '1';
+ nextArrow.style.pointerEvents = '';
+ }
+
+ // 选中当前日期（如果在本周内），否则 fallback
+ var selParts = selectedDate.split('-');
+ var selD = new Date(parseInt(selParts[0]), parseInt(selParts[1]) - 1, parseInt(selParts[2]));
+ var selMonday = getMonday(selD);
+ var target = null;
+ if (selMonday.getTime() === currentWeekStart.getTime()) {
+ target = container.querySelector('.cal-day[data-date="' + selectedDate + '"]');
+ }
+ if (!target) {
+ target = container.querySelector('.cal-day.today');
+ if (!target) target = container.querySelector('.cal-day:not(.no-data)');
+ if (!target) target = container.querySelector('.cal-day');
+ }
+ if (target) selectDay(target, true);
+}
+
+function prevWeek() {
+ currentWeekStart = new Date(currentWeekStart.getTime() - WEEK_MS);
+ renderWeek();
+}
+
+function nextWeek() {
+ var mondayOfThisWeek = getMonday(todayDate);
+ if (currentWeekStart.getTime() >= mondayOfThisWeek.getTime()) return;
+ currentWeekStart = new Date(currentWeekStart.getTime() + WEEK_MS);
+ renderWeek();
+}
+
+function selectDay(el, skipRender) {
+ document.querySelectorAll('.cal-day').forEach(function(d) { d.classList.remove('active'); });
+ el.classList.add('active');
+
+ var newDate = el.getAttribute('data-date');
+ if (newDate === selectedDate && !skipRender) return; // 同一日期不重复渲染
+
+ selectedDate = newDate;
+ var parts = selectedDate.split('-');
+ document.getElementById('calRange').textContent = parts[0] + '年' + parseInt(parts[1]) + '月' + parseInt(parts[2]) + '日';
+
+ renderAll();
+}
+
+/* ===== 月历弹窗 ===== */
+var pickerYear = 2026;
+var pickerMonth = 6;
+
+function toggleMonthPicker() {
+ var picker = document.getElementById('monthPicker');
+ var arrow = document.getElementById('dateArrow');
+ var show = !picker.classList.contains('show');
+ picker.classList.toggle('show', show);
+ arrow.classList.toggle('open', show);
+ if (show) {
+ pickerYear = todayDate.getFullYear();
+ pickerMonth = todayDate.getMonth();
+ renderMonthGrid();
+ }
+}
+
+function prevMonth() {
+ if (pickerMonth === 0) { pickerMonth = 11; pickerYear--; }
+ else { pickerMonth--; }
+ renderMonthGrid();
+}
+
+function nextMonth() {
+ if (pickerMonth === 11) { pickerMonth = 0; pickerYear++; }
+ else { pickerMonth++; }
+ renderMonthGrid();
+}
+
+function renderMonthGrid() {
+ document.getElementById('monthPickerTitle').textContent = pickerYear + '年' + (pickerMonth + 1) + '月';
+ var grid = document.getElementById('monthGrid');
+ grid.innerHTML = '';
+
+ var firstDay = new Date(pickerYear, pickerMonth, 1).getDay();
+ var daysInMonth = new Date(pickerYear, pickerMonth + 1, 0).getDate();
+
+ var prevDays = new Date(pickerYear, pickerMonth, 0).getDate();
+ for (var i = firstDay - 1; i >= 0; i--) {
+ var el = document.createElement('div');
+ el.className = 'month-picker__day month-picker__day--other';
+ el.textContent = prevDays - i;
+ grid.appendChild(el);
+ }
+
+ var todayDateStr = fmtDate(todayDate);
+
+ for (var d = 1; d <= daysInMonth; d++) {
+ var dateStr = pickerYear + '-' + ('0' + (pickerMonth + 1)).slice(-2) + '-' + ('0' + d).slice(-2);
+ var el = document.createElement('div');
+ var cls = 'month-picker__day';
+ if (dateStr === todayDateStr) cls += ' month-picker__day--today';
+ if (dateStr === selectedDate) cls += ' month-picker__day--selected';
+ el.className = cls;
+ el.textContent = d;
+ el.onclick = (function(ds) { return function(e) { e.stopPropagation(); pickDay(ds); }; })(dateStr);
+ grid.appendChild(el);
+ }
+}
+
+function pickDay(dateStr) {
+ document.getElementById('monthPicker').classList.remove('show');
+ document.getElementById('dateArrow').classList.remove('open');
+
+ var parts = dateStr.split('-');
+ var d = new Date(parseInt(parts[0]), parseInt(parts[1]) - 1, parseInt(parts[2]));
+ currentWeekStart = getMonday(d);
+ selectedDate = dateStr;
+ renderWeek();
+}
+
+document.addEventListener('click', function(e) {
+ var picker = document.getElementById('monthPicker');
+ if (!picker.classList.contains('show')) return;
+ if (!e.target.closest('.calendar-card__range') && !e.target.closest('#monthPicker')) {
+ picker.classList.remove('show');
+ document.getElementById('dateArrow').classList.remove('open');
+ }
+});
var dayData = {
- '2026-07-20': {
+ '2026-07-20': {
intake: 1050, summary: '今日热量摄入合理，营养素搭配均衡。早餐提供了充足蛋白质，午餐以碳水为主，晚餐清淡适中。',
meals: {
breakfast: { kcal: 280, time: '07:30', items: [
@@ -513,83 +730,6 @@ var dayData = {
'2026-07-26': null
};
-/* ===== Calendar logic ===== */
-var calYear = 2026;
-var calMonth = 6;
-
-function toggleCalendar() {
- var dd = document.getElementById('calendarDropdown');
- var arrow = document.getElementById('navDateArrow');
- var show = !dd.classList.contains('show');
- dd.classList.toggle('show', show);
- arrow.classList.toggle('open', show);
- if (show) {
- var parts = selectedDate.split('-');
- calYear = parseInt(parts[0]);
- calMonth = parseInt(parts[1]) - 1;
- renderCalGrid();
- }
-}
-
-function prevCalMonth() {
- if (calMonth === 0) { calMonth = 11; calYear--; }
- else calMonth--;
- renderCalGrid();
-}
-
-function nextCalMonth() {
- if (calMonth === 11) { calMonth = 0; calYear++; }
- else calMonth++;
- renderCalGrid();
-}
-
-function renderCalGrid() {
- document.getElementById('calMonthTitle').textContent = calYear + '年' + (calMonth + 1) + '月';
- var grid = document.getElementById('calMonthGrid');
- grid.innerHTML = '';
-
- var firstDay = new Date(calYear, calMonth, 1).getDay();
- var daysInMonth = new Date(calYear, calMonth + 1, 0).getDate();
-
- var prevDays = new Date(calYear, calMonth, 0).getDate();
- for (var i = firstDay - 1; i >= 0; i--) {
- var el = document.createElement('div');
- el.className = 'calendar-dropdown__day calendar-dropdown__day--other';
- el.textContent = prevDays - i;
- grid.appendChild(el);
- }
-
- for (var d = 1; d <= daysInMonth; d++) {
- var ds = calYear + '-' + ('0' + (calMonth + 1)).slice(-2) + '-' + ('0' + d).slice(-2);
- var el = document.createElement('div');
- var cls = 'calendar-dropdown__day';
- if (ds === todayStr) cls += ' calendar-dropdown__day--today';
- if (ds === selectedDate) cls += ' calendar-dropdown__day--selected';
- if (dayData[ds] && dayData[ds].intake > 0) cls += ' calendar-dropdown__day--has-data';
- el.className = cls;
- el.textContent = d;
- el.onclick = (function(ds) { return function(e) { e.stopPropagation(); pickCalDay(ds); }; })(ds);
- grid.appendChild(el);
- }
-}
-
-function pickCalDay(ds) {
- document.getElementById('calendarDropdown').classList.remove('show');
- document.getElementById('navDateArrow').classList.remove('open');
- selectedDate = ds;
- document.getElementById('navDateText').textContent = ds;
- renderAll();
-}
-
-document.addEventListener('click', function(e) {
- var dd = document.getElementById('calendarDropdown');
- if (!dd.classList.contains('show')) return;
- if (!e.target.closest('.nav-date') && !e.target.closest('#calendarDropdown')) {
- dd.classList.remove('show');
- document.getElementById('navDateArrow').classList.remove('open');
- }
-});
-
/* ===== Toggle summary collapse ===== */
function toggleSummary() {
var body = document.getElementById('summaryBody');
@@ -1130,7 +1270,9 @@ function renderNutrientIntake(data) {
}
/* ===== Init ===== */
-document.getElementById('navDateText').textContent = selectedDate;
+var initParts = selectedDate.split('-');
+document.getElementById('calRange').textContent = initParts[0] + '年' + parseInt(initParts[1]) + '月' + parseInt(initParts[2]) + '日';
+renderWeek();
renderAll();