✨ feat(deps): add date-fns dependency for date formatting

- add date-fns@^4.1.0 package to handle date formatting

♻️ refactor(date): standardize date formatting using date-fns

- home page: simplify date display logic with format()
- order-detail page: format departure and order creation time
- order page: format schedule departure time
- orders page: format departure time and order creation time
- passengers page: format passenger creation time
- schedule-list page: simplify time formatting with format()
- select-activity page: format activity start date with consistent pattern

mini/package.json

@@ -52,6 +52,7 @@
   "author": "",
   "dependencies": {
     "@babel/runtime": "^7.24.4",
+    "@d8d/server": "workspace:*",
     "@hookform/resolvers": "^5.2.1",
     "@radix-ui/react-slot": "^1.2.3",
     "@tanstack/react-query": "^5.84.1",
@@ -74,11 +75,11 @@
     "abortcontroller-polyfill": "^1.7.8",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
+    "date-fns": "^4.1.0",
     "hono": "4.8.5",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
     "react-hook-form": "^7.62.0",
-    "@d8d/server": "workspace:*",
     "zod": "^4.0.14"
   },
   "devDependencies": {

mini/src/pages/home/index.tsx

@@ -1,6 +1,8 @@
 import React, { useState } from 'react'
 import { View, Text, Swiper, SwiperItem, Image, Button, Picker } from '@tarojs/components'
 import { navigateTo } from '@tarojs/taro'
+import { format } from 'date-fns'
+import { zhCN } from 'date-fns/locale'
 import { TabBarLayout } from '@/layouts/tab-bar-layout'
 import { AreaPicker } from '../../components/AreaPicker'
 import { Navbar } from '@/components/ui/navbar'
@@ -78,17 +80,7 @@ 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()}日`
-    }
+    return format(date, 'M月d日', { locale: zhCN })
   }
 
   // 处理日期选择

mini/src/pages/order-detail/index.tsx

@@ -3,6 +3,8 @@ import { View, Text, ScrollView } from '@tarojs/components';
 import { Button } from '@/components/ui/button';
 import Taro from '@tarojs/taro';
 import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
+import { format } from 'date-fns';
+import { zhCN } from 'date-fns/locale';
 import { orderClient } from '@/api';
 import { OrderStatus } from '@/types/order.types';
 import { getVehicleTypeText, getTravelModeText } from '@/types/route.types';
@@ -172,7 +174,7 @@ const OrderDetailPage = () => {
               <Text className="text-[28rpx] text-gray-600 w-[160rpx] flex-shrink-0">出发时间：</Text>
               <Text className="text-[28rpx] text-gray-900 flex-1 font-medium">
                 {order.routeSnapshot?.departureTime
-                  ? new Date(order.routeSnapshot.departureTime).toLocaleString('zh-CN')
+                  ? format(new Date(order.routeSnapshot.departureTime), 'yyyy-MM-dd HH:mm:ss', { locale: zhCN })
                   : '未知时间'
                 }
               </Text>
@@ -207,7 +209,7 @@ const OrderDetailPage = () => {
 
             <View className="flex items-center">
               <Text className="text-[28rpx] text-gray-600 w-[160rpx] flex-shrink-0">下单时间：</Text>
-              <Text className="text-[28rpx] text-gray-900 flex-1 font-medium">{new Date(order.createdAt).toLocaleString('zh-CN')}</Text>
+              <Text className="text-[28rpx] text-gray-900 flex-1 font-medium">{format(new Date(order.createdAt), 'yyyy-MM-dd HH:mm:ss', { locale: zhCN })}</Text>
             </View>
           </View>
         </View>

mini/src/pages/order/index.tsx

@@ -2,6 +2,8 @@ import { View, Text, ScrollView } from '@tarojs/components'
 import { navigateBack, navigateTo, useRouter } from '@tarojs/taro'
 import { useState, useEffect } from 'react'
 import { useQuery, useMutation } from '@tanstack/react-query'
+import { format } from 'date-fns'
+import { zhCN } from 'date-fns/locale'
 import { orderClient, paymentClient, routeClient, passengerClient, authClient } from '@/api'
 import { Navbar, NavbarPresets } from '@/components/ui/navbar'
 import { Button } from '@/components/ui/button'
@@ -545,7 +547,7 @@ export default function OrderPage() {
               <View className="space-y-4 mb-6">
                 <View className="flex justify-between items-center">
                   <Text className={`text-sm font-medium ${isCharter ? 'text-gray-300' : 'text-gray-600'}`}>出发时间</Text>
-                  <Text className={`text-sm font-semibold ${isCharter ? 'text-white' : 'text-gray-900'}`}>{schedule.departureTime}</Text>
+                  <Text className={`text-sm font-semibold ${isCharter ? 'text-white' : 'text-gray-900'}`}>{schedule.departureTime ? format(new Date(schedule.departureTime), 'yyyy-MM-dd HH:mm', { locale: zhCN }) : '未知时间'}</Text>
                 </View>
                 <View className="flex justify-between items-center">
                   <Text className={`text-sm font-medium ${isCharter ? 'text-gray-300' : 'text-gray-600'}`}>车辆型号</Text>

mini/src/pages/orders/index.tsx

@@ -3,6 +3,8 @@ import { View, Text, ScrollView } from '@tarojs/components';
 import { Button } from '@/components/ui/button';
 import Taro from '@tarojs/taro';
 import { useQuery } from '@tanstack/react-query';
+import { format } from 'date-fns';
+import { zhCN } from 'date-fns/locale';
 import { orderClient } from '@/api';
 import { OrderStatus } from '@/types/order.types';
 import { getVehicleTypeText, getTravelModeText } from '@/types/route.types';
@@ -107,7 +109,7 @@ const OrderCard = ({ order, onViewDetail }) => {
               isCharterOrder ? 'text-white' : 'text-gray-900'
             }`}>
               {order.routeSnapshot?.departureTime
-                ? new Date(order.routeSnapshot.departureTime).toLocaleString('zh-CN')
+                ? format(new Date(order.routeSnapshot.departureTime), 'yyyy-MM-dd HH:mm:ss', { locale: zhCN })
                 : '未知时间'
               }
             </Text>
@@ -161,7 +163,7 @@ const OrderCard = ({ order, onViewDetail }) => {
           <Text className={`text-[26rpx] flex-1 min-w-0 font-medium leading-[1.4] ${
             isCharterOrder ? 'text-gray-300' : 'text-gray-500'
           }`}>
-            下单时间：{new Date(order.createdAt).toLocaleString('zh-CN')}
+            下单时间：{format(new Date(order.createdAt), 'yyyy-MM-dd HH:mm:ss', { locale: zhCN })}
           </Text>
           <View className="flex items-center flex-shrink-0">
             <Text className={`text-[28rpx] mr-2 ${

mini/src/pages/passengers/passengers.tsx

@@ -4,6 +4,8 @@ import Taro from '@tarojs/taro'
 import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
 import { useForm } from 'react-hook-form'
 import { zodResolver } from '@hookform/resolvers/zod'
+import { format } from 'date-fns'
+import { zhCN } from 'date-fns/locale'
 import { z } from 'zod'
 import { Navbar, NavbarPresets } from '@/components/ui/navbar'
 import { Button } from '@/components/ui/button'
@@ -265,7 +267,7 @@ const PassengersPage: React.FC = () => {
   const viewPassengerDetail = (passenger: Passenger) => {
     Taro.showModal({
       title: '乘车人详情',
-      content: `姓名：${passenger.name}\n证件类型：${passenger.idType}\n证件号码：${passenger.idNumber}\n手机号：${passenger.phone}\n创建时间：${new Date(passenger.createdAt).toLocaleString('zh-CN')}`,
+      content: `姓名：${passenger.name}\n证件类型：${passenger.idType}\n证件号码：${passenger.idNumber}\n手机号：${passenger.phone}\n创建时间：${format(new Date(passenger.createdAt), 'yyyy-MM-dd HH:mm:ss', { locale: zhCN })}`,
       showCancel: false,
       confirmText: '知道了',
       confirmColor: '#4A90C2'

mini/src/pages/schedule-list/ScheduleListPage.tsx

@@ -2,6 +2,8 @@ import React, { useState, useEffect } from 'react'
 import { View, Text, ScrollView, Button } from '@tarojs/components'
 import { useRouter, navigateTo, navigateBack } from '@tarojs/taro'
 import { useQuery } from '@tanstack/react-query'
+import { format } from 'date-fns'
+import { zhCN } from 'date-fns/locale'
 import { routeClient } from '../../api'
 import { Navbar, NavbarPresets } from '@/components/ui/navbar'
 
@@ -165,10 +167,7 @@ const ScheduleListPage: React.FC = () => {
   // 格式化时间
   const formatTime = (timeString: string) => {
     const date = new Date(timeString)
-    return date.toLocaleTimeString('zh-CN', {
-      hour: '2-digit',
-      minute: '2-digit'
-    })
+    return format(date, 'HH:mm', { locale: zhCN })
   }
 
   // 格式化价格

mini/src/pages/select-activity/ActivitySelectPage.tsx

@@ -2,6 +2,8 @@ import React from 'react'
 import { View, Text, Image, ScrollView } from '@tarojs/components'
 import { useRouter, navigateTo, navigateBack } from '@tarojs/taro'
 import { useQuery } from '@tanstack/react-query'
+import { format } from 'date-fns'
+import { zhCN } from 'date-fns/locale'
 import { routeClient } from '../../api'
 import { Navbar, NavbarPresets } from '@/components/ui/navbar'
 
@@ -209,7 +211,7 @@ const ActivitySelectPage: React.FC = () => {
     return {
       location: locationParts.join(' · '),
       address: venue.address,
-      date: new Date(activity.startDate).toLocaleDateString('zh-CN')
+      date: format(new Date(activity.startDate), 'yyyy-MM-dd', { locale: zhCN })
     }
   }
 

pnpm-lock.yaml

@@ -86,6 +86,9 @@ importers:
       clsx:
         specifier: ^2.1.1
         version: 2.1.1
+      date-fns:
+        specifier: ^4.1.0
+        version: 4.1.0
       hono:
         specifier: 4.8.5
         version: 4.8.5