feat(order): 增加门店订单页收货信息一键导航功能

- 订单卡片收货信息区域添加点击事件,实现一键导航至收货地址
- 新增 handleNavigate 方法,利用微信小程序内置地图 API 实现导航
- 导航功能支持坐标有效性检查,坐标无效时显示错误提示
- 订单详情页“过期时间”字段改为“送达时间”并显示对应数据
- 保留“发货时间”字段,确保送达时间与发货时间分别展示
- 确认代码构建和类型检查无新增错误
This commit is contained in:
2026-07-17 02:18:37 +08:00
parent 098fc01623
commit fff2ceb40d
3 changed files with 44 additions and 12 deletions

View File

@@ -62,5 +62,17 @@
- **验证**tsc 仅剩预存 `@tarojs/taro` 类型缺失环境报错,本文件无新错误
- ⚠️ 注意原「全部」Tab 显示的「待评价(statusFilter=4)」订单在改版后无 Tab 承接(用户确认不含待评价),如需可见后续可并入待处理
## 门店订单页「收货信息」一键导航src/pages/store/orders/index.tsx
- **需求**:订单卡片里的收货信息区域点击可一键导航
- **实现**`renderOrderCard` 的「收货信息」整块 View 加 `onClick={() => handleNavigate(order)}`,右侧加绿色「› 导航」标识提示可点
- **新增 `handleNavigate(order)`**:读取 `order.addressLat`/`order.addressLng`(模型里为 string`parseFloat` 转 number坐标有效则 `Taro.openLocation({ latitude, longitude, name: realName, address, scale: 16 })`(微信内置地图,自带导航选 App坐标缺失/非法则 toast「该订单未记录定位信息无法导航」兜底
- **注意**`Taro.openLocation` 是地图展示类 API不在微信 `requiredPrivateInfos` 受限清单内,无需在小程序后台声明、无需 `ensurePrivacyAuthorized` 预检(与 chooseImage/getPhoneNumber 不同)
- **验证**tsc 仅剩预存 `@tarojs/taro` 类型缺失环境报错,本文件无新错误
## 订单详情页「过期时间」→「送达时间」src/pages/order/detail.tsx
- **需求**:订单信息区原「过期时间」(order.expirationTime) 行改为「送达时间」
- **字段确认**:用户选择「送达时间」用 `order.deliveryTime`,且**保留**现有「发货时间」行 → `deliveryTime` 在两行各显示一次(用户明知并接受)
- **改动**第408-413行 `{order.expirationTime && ...过期时间}` 改为 `{order.deliveryTime && ...送达时间}`,数据用 `formatTime(order.deliveryTime)`
### 验证
- `npx taro build --type weapp` 构建成功

View File

@@ -405,12 +405,6 @@ const OrderDetailPage: React.FC = () => {
<Text className='text-xs text-gray-600'>{formatTime(order.deliveryTime)}</Text>
</View>
)}
{order.expirationTime && (
<View className='flex justify-between'>
<Text className='text-xs text-gray-400'></Text>
<Text className='text-xs text-gray-600'>{formatTime(order.expirationTime)}</Text>
</View>
)}
{order.comments && (
<View className='flex justify-start'>
<Text className='text-xs text-gray-400 mr-2'></Text>

View File

@@ -461,6 +461,23 @@ export default function StoreOrdersPage() {
})
}
/** 一键导航到收货地址(调用微信内置地图) */
const handleNavigate = (order: ShopOrder) => {
const lat = parseFloat(order.addressLat || '')
const lng = parseFloat(order.addressLng || '')
if (isNaN(lat) || isNaN(lng)) {
Taro.showToast({title: '该订单未记录定位信息,无法导航', icon: 'none'})
return
}
Taro.openLocation({
latitude: lat,
longitude: lng,
name: order.realName || '收货地址',
address: order.address || '',
scale: 16,
})
}
/** 渲染单个订单卡片 */
const renderOrderCard = (order: ShopOrder) => {
const actions = getOrderActions(order)
@@ -497,13 +514,22 @@ export default function StoreOrdersPage() {
</View>
))}
{/* 收货信息 */}
{/* 收货信息(点击区域一键导航) */}
{(order.realName || order.phone) && (
<View className='bg-gray-50 rounded-lg p-3 mb-3'>
<Text className='text-sm text-gray-700 block'>{order.realName} {order.phone}</Text>
{order.address && (
<Text className='text-xs text-gray-400 mt-1 block'>{order.address}</Text>
)}
<View
className='bg-gray-50 rounded-lg p-3 mb-3 flex items-center'
onClick={() => handleNavigate(order)}
>
<View className='flex-1'>
<Text className='text-sm text-gray-700 block'>{order.realName} {order.phone}</Text>
{order.address && (
<Text className='text-xs text-gray-400 mt-1 block'>{order.address}</Text>
)}
</View>
<View className='ml-2 flex flex-col items-center justify-center px-1'>
<Text className='text-lg text-green-500 leading-none'></Text>
<Text className='text-xs text-green-500 mt-0.5'></Text>
</View>
</View>
)}