Feat:旅居选择日期这里需要加个左右滑动翻页的功能

This commit is contained in:
linxi
2026-02-05 17:41:09 +08:00
parent 23286ae940
commit 39d9c1a76a
+27 -3
View File
@@ -14,7 +14,7 @@
原定时间{{ originDate }}
</view>
</view>
<view class="calendar">
<view class="calendar" @touchstart="onTouchStart" @touchend="onTouchEnd">
<view class="calendar-header">
<view class="month-nav">
<text class="nav-btn" @click="changeMonth(-1)"></text>
@@ -111,7 +111,9 @@ export default {
tempStartDate: null,
tempEndDate: null,
dateStatusMap: {}, // 存储日期状态
selectionState: 'initial' // 'initial' | 'selecting' | 'completed'
selectionState: 'initial', // 'initial' | 'selecting' | 'completed'
touchStartX: 0,
touchStartY: 0
}
},
@@ -253,6 +255,28 @@ export default {
this.currentMonth = newMonth
},
onTouchStart(e) {
if (!e || !e.changedTouches || !e.changedTouches.length) return
this.touchStartX = e.changedTouches[0].clientX
this.touchStartY = e.changedTouches[0].clientY
},
onTouchEnd(e) {
if (!e || !e.changedTouches || !e.changedTouches.length) return
const touchEndX = e.changedTouches[0].clientX
const touchEndY = e.changedTouches[0].clientY
const deltaX = touchEndX - this.touchStartX
const deltaY = touchEndY - this.touchStartY
if (Math.abs(deltaX) <= Math.abs(deltaY)) return
const minDistance = 50
if (Math.abs(deltaX) < minDistance) return
if (deltaX < 0) {
this.changeMonth(1)
} else {
this.changeMonth(-1)
}
},
formatDate(date) {
if (!date) return ''
const year = date.getFullYear()
@@ -697,4 +721,4 @@ export default {
transform: scale(1);
}
}
</style>
</style>