From 0bd92a43bfa15cee0b8a301f07924a01cb8ee4f8 Mon Sep 17 00:00:00 2001 From: gouki Date: Sat, 8 Aug 2026 14:51:53 +0000 Subject: [PATCH] =?UTF-8?q?fix(home):=20=E4=BF=AE=E5=A4=8D=E7=AE=AD?= =?UTF-8?q?=E5=A4=B4=E6=97=A0=E9=99=90=E5=BE=AA=E7=8E=AF+=E6=97=A5?= =?UTF-8?q?=E6=9C=9F=E6=A1=86=E7=AB=96=E9=95=BF=E5=9E=8B+=E5=AE=9C?= =?UTF-8?q?=E5=BF=8C=E6=94=BE=E5=A4=A7=E6=A1=86+=E6=9C=88=E5=8E=86?= =?UTF-8?q?=E6=A8=AA=E5=90=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 1. 箭头放到大框里面，点击不触发swiper无限循环 2. 日期框改为竖长型（min-height 800rpx） 3. 宜忌放到大框里面，包含日期/农历/干支/节日/星期/宜忌 4. 月历确认横向滑动（vertical=false） --- mini/pages/home/home.js | 16 ++- mini/pages/home/home.wxml | 111 ++++++++++---------- mini/pages/home/home.wxss | 209 ++++++++++++++++---------------------- 3 files changed, 157 insertions(+), 179 deletions(-) diff --git a/mini/pages/home/home.js b/mini/pages/home/home.js index dc59130..a9ac040 100644 --- a/mini/pages/home/home.js +++ b/mini/pages/home/home.js @@ -159,14 +159,26 @@ Page({ prevDay() { if (this.data.dayIndex > 0) { this.setData({ dayIndex: this.data.dayIndex - 1 }); - this.onDaySwiperChange({ detail: { current: this.data.dayIndex - 1 } }); + this.updateCurrentDayInfo(); } }, nextDay() { if (this.data.dayIndex < this.data.dayList.length - 1) { this.setData({ dayIndex: this.data.dayIndex + 1 }); - this.onDaySwiperChange({ detail: { current: this.data.dayIndex + 1 } }); + this.updateCurrentDayInfo(); + } + }, + + /** 更新当前 dayInfo（不触发 swiper 事件） */ + updateCurrentDayInfo() { + const cur = this.data.dayList[this.data.dayIndex]; + if (cur) { + this.setData({ + dayInfo: cur.dayInfo, + currentYear: cur.dayInfo.solarYear, + currentMonth: cur.dayInfo.solarMonth + }); } }, diff --git a/mini/pages/home/home.wxml b/mini/pages/home/home.wxml index 9de139e..8c95c1d 100644 --- a/mini/pages/home/home.wxml +++ b/mini/pages/home/home.wxml @@ -24,71 +24,74 @@ - - - + + + - - {{dayItem.dayInfo.solarYear}}年{{dayItem.dayInfo.solarMonth}}月 - + {{dayItem.dayInfo.solarYear}}年{{dayItem.dayInfo.solarMonth}}月 今日 {{dayItem.dayInfo.lunarDay === 1 ? '初一' : '十五'}} - - - - - {{dayItem.dayInfo.solarDay}} - - {{dayItem.dayInfo.lunarMonthName}}{{dayItem.dayInfo.lunarDayName}} - {{dayItem.dayInfo.lunarYearGanzhi}}年 {{dayItem.dayInfo.lunarMonthGanzhi}}月 {{dayItem.dayInfo.lunarDayGanzhi}}日 + + + + ‹ + + + + + {{dayItem.dayInfo.solarDay}} + + + + {{dayItem.dayInfo.lunarMonthName}}{{dayItem.dayInfo.lunarDayName}} + {{dayItem.dayInfo.lunarYearGanzhi}}年 {{dayItem.dayInfo.lunarMonthGanzhi}}月 {{dayItem.dayInfo.lunarDayGanzhi}}日 + + + + + {{dayItem.legalHoliday}} + {{dayItem.dayInfo.lunarFestival}} + {{dayItem.dayInfo.solarFestival}} + {{dayItem.dayInfo.solarTerm}}{{dayItem.termTime ? ' ' + dayItem.termTime : ''}} + + + + + 星期{{dayItem.dayInfo.weekDay}} · {{dayItem.legalHoliday ? dayItem.legalHoliday + ' · 放假' : (dayItem.workday ? '工作日 · 上班' : '周末 · 休息')}} + + + + + + 宜 + + {{item}} + + + + 忌 + + {{item}} + + + + › - - - {{dayItem.legalHoliday}} - {{dayItem.dayInfo.lunarFestival}} - {{dayItem.dayInfo.solarFestival}} - {{dayItem.dayInfo.solarTerm}}{{dayItem.termTime ? ' ' + dayItem.termTime : ''}} - - - - - 🪷 距 {{dayItem.nextBuddhist.name}} 还有 {{dayItem.nextBuddhist.daysLeft}} 天（{{dayItem.nextBuddhist.solarDate}}） - - - - - 星期{{dayItem.dayInfo.weekDay}} · {{dayItem.legalHoliday ? dayItem.legalHoliday + ' · 放假' : (dayItem.workday ? '工作日 · 上班' : '周末 · 休息')}} + + + 🪷 距 {{dayItem.nextBuddhist.name}} 还有 {{dayItem.nextBuddhist.daysLeft}} 天（{{dayItem.nextBuddhist.solarDate}}） - - - - - 宜 - - {{item}} - - - - - 忌 - - {{item}} - - - - - - + @@ -136,17 +139,13 @@ - - - ‹ - › - + {{currentYear}}年{{currentMonth}}月 - 上下或左右滑动换月 + 左右滑动换月 {{item}} diff --git a/mini/pages/home/home.wxss b/mini/pages/home/home.wxss index a1cb3ee..30003b3 100644 --- a/mini/pages/home/home.wxss +++ b/mini/pages/home/home.wxss @@ -70,32 +70,6 @@ padding-bottom: 40rpx; } -/* 固定左右箭头 */ -.day-arrow-fixed { - position: fixed; - top: 50%; - transform: translateY(-50%); - font-size: 72rpx; - color: #C9B8A6; - z-index: 50; - width: 80rpx; - height: 80rpx; - display: flex; - align-items: center; - justify-content: center; - background: rgba(255, 255, 255, 0.8); - border-radius: 50%; - box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1); -} - -.day-arrow-fixed.left { - left: 10rpx; -} - -.day-arrow-fixed.right { - right: 10rpx; -} - /* ===== 老黄历大日历卡片 ===== */ .almanac-card { border-radius: 24rpx; @@ -128,6 +102,7 @@ display: flex; justify-content: space-between; align-items: center; + margin-bottom: 16rpx; } .almanac-year { @@ -157,41 +132,65 @@ border-radius: 999rpx; } -/* 大日期 */ -.almanac-day-row { - display: flex; - align-items: center; - justify-content: center; - margin: 16rpx 0; -} - -/* 老黄历方框（包含农历和干支） */ +/* 大日期方框（竖长型，包含所有信息） */ .day-frame { - min-width: 480rpx; - padding: 32rpx 40rpx; display: flex; - align-items: center; - justify-content: center; + align-items: stretch; + justify-content: space-between; border: 6rpx solid; border-radius: 16rpx; background: #FFFDF8; box-shadow: inset 0 0 0 4rpx #FFFDF8, inset 0 0 0 6rpx currentColor; + padding: 24rpx 16rpx; + min-height: 800rpx; } -.day-frame-inner { +.frame-holiday { border-color: #C41E3A; color: #C41E3A; } +.frame-workday { border-color: #2E7D32; color: #2E7D32; } +.frame-weekend { border-color: #C41E3A; color: #C41E3A; } + +/* 箭头（在大框里面，竖向居中） */ +.day-arrow-inner { + display: flex; + align-items: center; + justify-content: center; + font-size: 64rpx; + color: #C9B8A6; + width: 60rpx; + flex-shrink: 0; +} + +.day-arrow-inner.left { + border-right: 1rpx solid #F0E6DA; +} + +.day-arrow-inner.right { + border-left: 1rpx solid #F0E6DA; +} + +/* 中间内容（竖向排列） */ +.day-frame-content { + flex: 1; display: flex; flex-direction: column; align-items: center; - gap: 16rpx; + justify-content: center; + gap: 20rpx; + padding: 0 16rpx; } .almanac-day-num { - font-size: 180rpx; + font-size: 200rpx; font-weight: 700; line-height: 1; text-align: center; } +.num-holiday { color: #C41E3A; } +.num-workday { color: #2E7D32; } +.num-weekend { color: #C41E3A; } + +/* 农历 */ .day-frame-lunar { display: flex; flex-direction: column; @@ -202,7 +201,7 @@ } .day-frame-lunar-main { - font-size: 40rpx; + font-size: 44rpx; font-weight: 600; color: #1A1A1A; } @@ -212,134 +211,102 @@ color: #9E8E7E; } -.frame-holiday { border-color: #C41E3A; color: #C41E3A; } -.frame-workday { border-color: #2E7D32; color: #2E7D32; } -.frame-weekend { border-color: #C41E3A; color: #C41E3A; } - -.num-holiday { color: #C41E3A; } -.num-workday { color: #2E7D32; } -.num-weekend { color: #C41E3A; } - -/* 节日（固定高度占位） */ -.almanac-fest { +/* 节日/节气 */ +.day-frame-fest { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 12rpx; - margin-bottom: 12rpx; - min-height: 52rpx; } -.badge-holiday { - background: #C41E3A; - color: #FFFFFF; +.frame-badge { font-size: 24rpx; padding: 6rpx 24rpx; + border-radius: 999rpx; } -.badge-festival { +.frame-badge-holiday { background: #C41E3A; color: #FFFFFF; } -.badge-term { +.frame-badge-festival { + background: #C41E3A; + color: #FFFFFF; +} + +.frame-badge-term { background: #2E7D32; color: #FFFFFF; } -/* 佛历提醒（固定高度占位） */ -.buddhist-tip { - text-align: center; - padding: 12rpx; - margin-bottom: 8rpx; - min-height: 50rpx; - display: flex; - align-items: center; - justify-content: center; -} - -.buddhist-text { +/* 星期 + 工作日 */ +.day-frame-week { font-size: 26rpx; - color: #B8860B; -} - -/* 星期 + 工作日/节假日提示 */ -.day-type-tip { - text-align: center; - font-size: 28rpx; font-weight: 600; - padding: 12rpx; - border-radius: 12rpx; - margin-top: 8rpx; + color: #6B5E53; + text-align: center; } -.tip-holiday { - color: #C41E3A; - background: rgba(196, 30, 58, 0.08); -} - -.tip-workday { - color: #2E7D32; - background: rgba(46, 125, 50, 0.08); -} - -.tip-weekend { - color: #C41E3A; - background: rgba(196, 30, 58, 0.08); -} - -/* 宜忌 */ -.yiji-card { - position: relative; -} - -.yiji-row { +/* 宜忌（在大框里面） */ +.day-frame-yiji { + width: 100%; display: flex; + flex-direction: column; + gap: 16rpx; + padding-top: 20rpx; + border-top: 2rpx solid #F0E6DA; } -.yiji-col { - flex: 1; +.frame-yiji-row { display: flex; gap: 16rpx; + align-items: flex-start; } -.yiji-divider { - width: 1rpx; - background: #F0E6DA; - margin: 0 16rpx; -} - -.yiji-title { +.frame-yiji-title { width: 56rpx; height: 56rpx; border-radius: 50%; display: flex; align-items: center; justify-content: center; - font-size: 30rpx; + font-size: 28rpx; font-weight: 700; flex-shrink: 0; } -.yiji-title.yi { background: #C41E3A; color: #FFFFFF; } -.yiji-title.ji { background: #546E7A; color: #FFFFFF; } +.frame-yiji-title.yi { background: #C41E3A; color: #FFFFFF; } +.frame-yiji-title.ji { background: #546E7A; color: #FFFFFF; } -.yiji-items { +.frame-yiji-items { + flex: 1; display: flex; flex-wrap: wrap; gap: 8rpx; align-content: flex-start; } -.yiji-item { - font-size: 26rpx; - padding: 4rpx 14rpx; +.frame-yiji-item { + font-size: 24rpx; + padding: 4rpx 12rpx; border-radius: 8rpx; } -.yiji-item.yi { background: #FEF2F2; color: #C41E3A; } -.yiji-item.ji { background: #F1F5F9; color: #546E7A; } +.frame-yiji-item.yi { background: #FEF2F2; color: #C41E3A; } +.frame-yiji-item.ji { background: #F1F5F9; color: #546E7A; } + +/* 佛历提醒 */ +.buddhist-tip { + text-align: center; + padding: 16rpx 12rpx 0; +} + +.buddhist-text { + font-size: 26rpx; + color: #B8860B; +} .section-title { font-size: 28rpx;