|
|
@@ -1,5 +1,5 @@
|
|
|
-import React, { useState, useEffect } from 'react'
|
|
|
-import { View, Text, Swiper, SwiperItem, Image, Button } from '@tarojs/components'
|
|
|
+import React, { useState } from 'react'
|
|
|
+import { View, Text, Swiper, SwiperItem, Image, Button, Picker } from '@tarojs/components'
|
|
|
import { navigateTo } from '@tarojs/taro'
|
|
|
import { TabBarLayout } from '@/layouts/tab-bar-layout'
|
|
|
import { AreaPicker } from '../../components/AreaPicker'
|
|
|
@@ -57,6 +57,22 @@ const HomePage: React.FC = () => {
|
|
|
}
|
|
|
|
|
|
|
|
|
+ // 格式化日期显示
|
|
|
+ const formatDateDisplay = (dateStr: string) => {
|
|
|
+ const date = new Date(dateStr)
|
|
|
+ const today = new Date()
|
|
|
+ const tomorrow = new Date(today)
|
|
|
+ tomorrow.setDate(today.getDate() + 1)
|
|
|
+
|
|
|
+ if (date.toDateString() === today.toDateString()) {
|
|
|
+ return '今天'
|
|
|
+ } else if (date.toDateString() === tomorrow.toDateString()) {
|
|
|
+ return '明天'
|
|
|
+ } else {
|
|
|
+ return `${date.getMonth() + 1}月${date.getDate()}日`
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
// 处理日期选择
|
|
|
const handleDateChange = (e: any) => {
|
|
|
setSearchParams(prev => ({
|
|
|
@@ -234,14 +250,20 @@ const HomePage: React.FC = () => {
|
|
|
<Text className="text-sm text-gray-600 mb-2 block">出发日期</Text>
|
|
|
<View className="flex justify-between items-center bg-gray-50 rounded-lg p-3 border border-gray-200">
|
|
|
<Text className="text-sm text-gray-600">选择日期</Text>
|
|
|
- <View className="picker">
|
|
|
- <input
|
|
|
- type="date"
|
|
|
- value={searchParams.date}
|
|
|
- onChange={handleDateChange}
|
|
|
- className="text-sm text-blue-500 font-bold"
|
|
|
- />
|
|
|
- </View>
|
|
|
+ <Picker
|
|
|
+ mode="date"
|
|
|
+ value={searchParams.date}
|
|
|
+ start={new Date().toISOString().split('T')[0]}
|
|
|
+ end={new Date(Date.now() + 7 * 24 * 60 * 60 * 1000).toISOString().split('T')[0]}
|
|
|
+ fields="day"
|
|
|
+ onChange={handleDateChange}
|
|
|
+ >
|
|
|
+ <View className="picker-trigger bg-white px-3 py-1 rounded border border-gray-300">
|
|
|
+ <Text className="text-sm text-blue-500 font-bold">
|
|
|
+ {formatDateDisplay(searchParams.date)}
|
|
|
+ </Text>
|
|
|
+ </View>
|
|
|
+ </Picker>
|
|
|
</View>
|
|
|
</View>
|
|
|
|