Feat:旅居选择日期这里需要加个左右滑动翻页的功能
This commit is contained in:
@@ -14,7 +14,7 @@
|
|||||||
原定时间:{{ originDate }}
|
原定时间:{{ originDate }}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="calendar">
|
<view class="calendar" @touchstart="onTouchStart" @touchend="onTouchEnd">
|
||||||
<view class="calendar-header">
|
<view class="calendar-header">
|
||||||
<view class="month-nav">
|
<view class="month-nav">
|
||||||
<text class="nav-btn" @click="changeMonth(-1)">〈</text>
|
<text class="nav-btn" @click="changeMonth(-1)">〈</text>
|
||||||
@@ -111,7 +111,9 @@ export default {
|
|||||||
tempStartDate: null,
|
tempStartDate: null,
|
||||||
tempEndDate: null,
|
tempEndDate: null,
|
||||||
dateStatusMap: {}, // 存储日期状态
|
dateStatusMap: {}, // 存储日期状态
|
||||||
selectionState: 'initial' // 'initial' | 'selecting' | 'completed'
|
selectionState: 'initial', // 'initial' | 'selecting' | 'completed'
|
||||||
|
touchStartX: 0,
|
||||||
|
touchStartY: 0
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -253,6 +255,28 @@ export default {
|
|||||||
this.currentMonth = newMonth
|
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) {
|
formatDate(date) {
|
||||||
if (!date) return ''
|
if (!date) return ''
|
||||||
const year = date.getFullYear()
|
const year = date.getFullYear()
|
||||||
@@ -697,4 +721,4 @@ export default {
|
|||||||
transform: scale(1);
|
transform: scale(1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user