import { View, Image } from '@tarojs/components';
|
import { safeParse } from '../../../../../utils/Robotaxi-public-method';
|
import { TripStatus } from '../../../../../robotaxi/constants/trip-status';
|
|
type HomeTripStatus = TripStatus | 0;
|
|
type Props = {
|
/** 行程状态 */
|
tripStatus: HomeTripStatus;
|
/** 订单信息 */
|
orderData: any;
|
/** 查看详情回调 */
|
onViewDetail: () => void;
|
/** 状态文案映射 */
|
orderStatusMap: Partial<Record<TripStatus, string>>;
|
};
|
|
/**
|
* 订单状态卡片。
|
*/
|
export default function OrderStatusCard({ tripStatus, orderData, onViewDetail, orderStatusMap }: Props) {
|
if (![TripStatus.CallingCar, TripStatus.VehicleApproaching, TripStatus.VehicleArrivedPickup, TripStatus.InService, TripStatus.ArrivedDestination, TripStatus.TripFinished].includes(tripStatus as TripStatus)) {
|
return null;
|
}
|
|
return (
|
<View className="order-status">
|
{
|
[TripStatus.CallingCar].includes(tripStatus as TripStatus) &&
|
<View className="order-status-left">
|
<View className="order-status-left-item">
|
<Image className="order-status-left-item-icon" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/pointer.png" />
|
<View></View>
|
<View></View>
|
</View>
|
<View className="order-status-left-text">正在为您呼叫...</View>
|
</View>
|
}
|
{
|
[TripStatus.VehicleApproaching, TripStatus.VehicleArrivedPickup, TripStatus.InService, TripStatus.ArrivedDestination, TripStatus.TripFinished].includes(tripStatus as TripStatus) &&
|
<View className="order-status-left">
|
{
|
orderData.vehiclePictures
|
? <Image className="order-status-left-icon" src={safeParse(orderData.vehiclePictures, {})?.url || 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/v2/default-vehicle-img-20260724-v2.png'} />
|
: <Image className="order-status-left-icon" src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/v2/default-vehicle-img-20260724-v2.png' />
|
}
|
<View className="order-status-left-detail">
|
<View>{orderData.plateNumber}</View>
|
<View>{orderStatusMap[tripStatus as TripStatus]}</View>
|
</View>
|
</View>
|
}
|
<View onClick={onViewDetail} className="order-status-btn">查看</View>
|
<Image className="order-status-bg" src={'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/order-card-bg.png'} />
|
</View>
|
);
|
}
|
