refactor(robotaxi): 将本地图片资源迁移至CDN托管
本次提交将robotaxi模块下所有静态图片的引用从本地相对路径替换为官方CDN链接,移除了冗余的本地资源导入语句,减小应用打包体积,优化资源加载体验。
| | |
| | | import { View, Text, Image } from '@tarojs/components'; |
| | | import OrderStatusCard from './order-status-card'; |
| | | import rightIcon from '../../../../robotaxi/assets/right-icon.png'; |
| | | import { TripStatus } from '../../../../robotaxi/pages/begin-route/constants/trip-status'; |
| | | import { safeParse } from '../../../../utils/Robotaxi-public-method'; |
| | | |
| | |
| | | </Text> |
| | | 出发 |
| | | </View> |
| | | <Image className="now-site-icon" src={rightIcon} /> |
| | | <Image className="now-site-icon" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/right-icon.png" /> |
| | | </View> |
| | | </View> |
| | | <View onClick={() => props.onSelectSite('end')} className="to-site"> |
| | |
| | | import { View, Map, Text, Image } from '@tarojs/components'; |
| | | import MapOverlayTips from './map-overlay-tips'; |
| | | import MapPointer from './map-pointer'; |
| | | import selectCityIcon from '../../../../robotaxi/assets/select-city.png'; |
| | | import personalCenter from '../../../../robotaxi/assets/personal-center.png'; |
| | | import coupon from '../../../../robotaxi/assets/coupon.png'; |
| | | import contactService from '../../../../robotaxi/assets/contact-service.png'; |
| | | import originIcon from '../../../../robotaxi/assets/origin-icon.png'; |
| | | import pointer from '../../../../robotaxi/assets/pointer.png'; |
| | | import rightIcon from '../../../../robotaxi/assets/right-icon.png'; |
| | | import { getWeatherIconByDesc } from '../../../../utils/weather'; |
| | | import { DEFAULT_LATITUDE, DEFAULT_LONGITUDE } from '../../../../robotaxi/constants/map'; |
| | | import { HOME_MAP_HEIGHT, HOME_MAP_ID } from '../constants'; |
| | |
| | | <View className="select-city-container"> |
| | | <View onClick={props.onSelectCity} className="select-city"> |
| | | <Text>{props.selectedCityName || '北京市'}</Text> |
| | | <Image className="select-city-icon" src={selectCityIcon} /> |
| | | <Image className="select-city-icon" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/select-city.png" /> |
| | | </View> |
| | | {props.weatherData && ( |
| | | <View className="weather-info"> |
| | |
| | | bottom: typeof props.overlayAnchorBottom === 'number' ? `${props.overlayAnchorBottom}px` : undefined |
| | | }} |
| | | > |
| | | <Image onClick={props.onToOrigin} className="origin-icon" src={originIcon} /> |
| | | <Image onClick={props.onToOrigin} className="origin-icon" src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/origin-icon.png' /> |
| | | </View> |
| | | <MapOverlayTips |
| | | isGuest={props.shouldShowGuestTip} |
| | |
| | | onViewOperatingArea={props.onViewOperatingArea} |
| | | /> |
| | | <View className="map-entry"> |
| | | <Image onClick={props.onToPersonalCenter} className="map-entry-icon" src={personalCenter} /> |
| | | <Image onClick={props.onToPersonalCenter} className="map-entry-icon" src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/personal-center.png' /> |
| | | <View className="split-line"></View> |
| | | <Image onClick={props.onOpenService} className="map-entry-icon" src={contactService} /> |
| | | <Image onClick={props.onOpenService} className="map-entry-icon" src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/contact-service.png' /> |
| | | <View className="split-line"></View> |
| | | <Image onClick={props.onToCoupon} className="map-entry-icon" src={coupon} /> |
| | | <Image onClick={props.onToCoupon} className="map-entry-icon" src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/coupon.png' /> |
| | | </View> |
| | | <MapPointer |
| | | showToolTip={props.showToolTip} |
| | |
| | | isOperatingArea={props.isOperatingArea} |
| | | isAdsorbed={props.isAdsorbed} |
| | | currentSite={props.currentSite} |
| | | pointerSrc={pointer} |
| | | rightIconSrc={rightIcon} |
| | | pointerSrc='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/pointer.png' |
| | | rightIconSrc='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/right-icon.png' |
| | | waitingRadarSrc={props.waitingRadarSrc} |
| | | onSelectSite={props.onSelectSite} |
| | | /> |
| | |
| | | right: 0; |
| | | width: 52px; |
| | | height: 34px; |
| | | background: url(../../../../../robotaxi/assets/marketing-coupon-topBg.png) |
| | | background: url(https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/marketing-coupon-topBg.png) |
| | | no-repeat center center; |
| | | background-size: 100% 100%; |
| | | font-family: PingFang SC; |
| | |
| | | import { useEffect, useState } from 'react'; |
| | | import { View, Text, Image, ScrollView } from '@tarojs/components'; |
| | | import closeIcon from '../../../../../robotaxi/assets/marketing-close.png'; |
| | | import singleLeftIcon from '../../../../../robotaxi/assets/marketing-single-left.png'; |
| | | import singleRightIcon from '../../../../../robotaxi/assets/marketing-single-right.png'; |
| | | import singleTopLeftIcon from '../../../../../robotaxi/assets/marketing-single-top-left.png'; |
| | | import singleTopRightIcon from '../../../../../robotaxi/assets/marketing-single-top-right.png'; |
| | | import './index.less'; |
| | | |
| | | type MarketingPopupProps = { |
| | |
| | | return ( |
| | | <View className='marketing-popup-single-panel'> |
| | | <View className='marketing-popup-title'> |
| | | <Image className='marketing-popup-coupon-title-top-icon' src={singleTopLeftIcon} /> |
| | | <Image className='marketing-popup-coupon-title-top-icon' src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/marketing-single-top-left.png' /> |
| | | <View style={{ margin: '0 14px' }}>恭喜获得{Number(coupon.quantity) > 0 ? coupon.quantity + '张' : ''}</View> |
| | | <Image className='marketing-popup-coupon-title-top-icon' src={singleTopRightIcon} /> |
| | | <Image className='marketing-popup-coupon-title-top-icon' src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/marketing-single-top-right.png' /> |
| | | </View> |
| | | <View className='marketing-popup-coupon-title'> |
| | | <Image className='marketing-popup-coupon-title-icon' src={singleLeftIcon} /> |
| | | <Image className='marketing-popup-coupon-title-icon' src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/marketing-single-left.png' /> |
| | | <View style={{ margin: '0 8px' }}>{coupon?.title || '媒体尝鲜券'}</View> |
| | | <Image className='marketing-popup-coupon-title-icon' src={singleRightIcon} /> |
| | | <Image className='marketing-popup-coupon-title-icon' src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/marketing-single-right.png' /> |
| | | </View> |
| | | <View className='marketing-popup-coupon-tag-text'>{formatThresholdText(coupon.conditionalAmount)}</View> |
| | | <View className='marketing-popup-coupon-expire-text'>{formatTime(coupon.expireText, "list")}到期</View> |
| | |
| | | {popupBtnText} |
| | | </View> |
| | | <View className='marketing-popup-close-single' onClick={props.onClose}> |
| | | <Image className='marketing-popup-close-icon' src={closeIcon} /> |
| | | <Image className='marketing-popup-close-icon' src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/close-icon.png' /> |
| | | </View> |
| | | </View> |
| | | ); |
| | |
| | | return ( |
| | | <View className={`marketing-popup-multi-panel ${isTwoCoupons ? 'marketing-popup-multi-panel--two' : ''}`}> |
| | | <View className='marketing-popup-close' onClick={props.onClose}> |
| | | <Image className='marketing-popup-close-icon' src={closeIcon} /> |
| | | <Image className='marketing-popup-close-icon' src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/close-icon.png' /> |
| | | </View> |
| | | <View |
| | | className={`marketing-popup-multi-bg ${isTwoCoupons ? 'marketing-popup-multi-bg--two' : ''}`} |
| | |
| | | [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={require('../../../../../robotaxi/assets/pointer.png')} /> |
| | | <Image className="order-status-left-item-icon" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/pointer.png" /> |
| | | <View></View> |
| | | <View></View> |
| | | </View> |
| | |
| | | import { View, Text, Image } from '@tarojs/components'; |
| | | import { useEffect, useMemo, useState } from 'react'; |
| | | import './index.less'; |
| | | import check from '../../../../../robotaxi/assets/check.png' |
| | | import uncheck from '../../../../../robotaxi/assets/uncheck.png' |
| | | import { privicyShowManager } from './utils' |
| | | import { submitAgreement } from '../../../../../robotaxi/api/home' |
| | | import { getNormalizedLoginAgreementList, type LoginAgreementItem } from '../../../../../robotaxi/utils/login-agreement' |
| | |
| | | { |
| | | agreementList.map((item) => ( |
| | | <View className='link-item' key={String(item.id)}> |
| | | <Image onClick={checkItem(String(item.id))} className='item-radio' src={isAgree[String(item.id)] ? check : uncheck} |
| | | <Image onClick={checkItem(String(item.id))} className='item-radio' src={isAgree[String(item.id)] ? 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/check.png' : 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/uncheck.png'} |
| | | mode='aspectFill' /> |
| | | <View className='item-name' onClick={() => handleLinkClick(item.id)}>《 {item.name} 》</View> |
| | | </View> |
| | | )) |
| | | } |
| | | <View className='link-item'> |
| | | <Image onClick={checkAll} className='item-radio' src={isAllAgree ? check : uncheck} |
| | | <Image onClick={checkAll} className='item-radio' src={isAllAgree ? 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/check.png' : 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/uncheck.png'} |
| | | mode='aspectFill' /> |
| | | <View onClick={checkAll} className='item-name'>全部勾选</View> |
| | | </View> |
| | |
| | | z-index: 10; |
| | | |
| | | .toolTip-bg { |
| | | background-image: url(../../../robotaxi/assets/tooltip-bg.png); |
| | | background-image: url('https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/tooltip-bg.png'); |
| | | background-size: cover; |
| | | height: 70px; |
| | | min-width: 155px; |
| | |
| | | import { View, Text, Image, ScrollView } from "@tarojs/components"; |
| | | import { useEffect, useState } from "react"; |
| | | import "./index.less"; |
| | | import closeIcon from "../../assets/close-icon.png"; |
| | | import icon from "../../assets/coupon-arrow.png"; |
| | | import couponSelectIcon from "../../assets/coupon-select.png"; |
| | | import couponArrowRight from "../../assets/coupon-arrow-right.png"; |
| | | import couponSelectedIcon from "../../assets/coupon-selected.png"; |
| | | import { getUserCouponList } from "../../api/coupon"; |
| | | |
| | | type Props = { |
| | |
| | | <View className="coupon-popup-content" animation={animationData}> |
| | | <View className="coupon-header"> |
| | | <Text className="coupon-title">选择优惠券</Text> |
| | | <Image className="close-icon" src={closeIcon} onClick={onClose} /> |
| | | <Image className="close-icon" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/close-icon.png" onClick={onClose} /> |
| | | </View> |
| | | <View className="coupon-list-wrap"> |
| | | <View className="coupon-list-head"> |
| | |
| | | </View> |
| | | <View className="my-coupon-item" onClick={gotoMyCoupon}> |
| | | <Text>我的优惠券</Text> |
| | | <Image className="arrow-icon" src={couponArrowRight} /> |
| | | <Image className="arrow-icon" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/coupon-arrow-right.png" /> |
| | | </View> |
| | | </View> |
| | | <ScrollView |
| | |
| | | ? "expanded" |
| | | : "" |
| | | }`} |
| | | src={icon} |
| | | src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/coupon-arrow.png" |
| | | ></Image> |
| | | </View> |
| | | </View> |
| | |
| | | className="select-img" |
| | | src={ |
| | | activeCouponId === item.operationCouponId |
| | | ? couponSelectedIcon |
| | | : couponSelectIcon |
| | | ? 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/coupon-selected.png' |
| | | : 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/coupon-select.png' |
| | | } |
| | | ></Image> |
| | | </View> |
| | |
| | | className={`unavailable-toggle-arrow ${ |
| | | expandUnusable ? "expanded" : "" |
| | | }`} |
| | | src={couponArrowRight} |
| | | src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/coupon-arrow-right.png" |
| | | /> |
| | | </View> |
| | | {expandUnusable && ( |
| | |
| | | ? "expanded" |
| | | : "" |
| | | }`} |
| | | src={icon} |
| | | src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/coupon-arrow.png" |
| | | ></Image> |
| | | </View> |
| | | </View> |
| | | <View className="select-box"> |
| | | <Image |
| | | className="select-img" |
| | | src={couponSelectIcon} |
| | | src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/coupon-select.png" |
| | | ></Image> |
| | | </View> |
| | | </View> |
| | |
| | | hoverClass='common-hover-class' |
| | | > |
| | | <View className='agreement-item-title'>{item.name}</View> |
| | | <Image className='agreement-item-icon' src={require('../../assets/skip-arrows.png')} /> |
| | | <Image className='agreement-item-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/skip-arrows.png" /> |
| | | </View> |
| | | ))} |
| | | </View> |
| | |
| | | <View className='announcements-content' animation={animationData}> |
| | | <View className='announcements-box'> |
| | | <View className='announcements-text'>第一步:关闭车门</View> |
| | | <Image onClick={onClose} className='announcements-icon' src={require('../../../assets/close-icon.png')} /> |
| | | <Image onClick={onClose} className='announcements-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/close-icon.png" /> |
| | | </View> |
| | | { |
| | | doorImgError ? ( |
| | |
| | | import { View, Text, Image } from '@tarojs/components'; |
| | | import { useEffect, useState } from 'react'; |
| | | import './index.less'; |
| | | import closeIcon from '../../../../assets/close-icon.png'; |
| | | |
| | | type Props = { |
| | | show: boolean; |
| | |
| | | <View className={`auth-bluetooth-popup ${show ? 'show' : ''}`} catchMove> |
| | | <View className='popup-mask' onClick={onClose}></View> |
| | | <View className='popup-content' animation={animationData}> |
| | | <Image className='close-icon' src={closeIcon} onClick={onClose} /> |
| | | <Image className='bluetooth-bg' src={'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/bluetooth-bg.png'} /> |
| | | <Image className='close-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/close-icon.png" onClick={onClose} /> |
| | | <Image className='bluetooth-bg' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/bluetooth-bg.png" /> |
| | | <View className='content-main'> |
| | | <Text className='popup-title'>授权蓝牙</Text> |
| | | <Text className='popup-sub-title'>无感自动开启车辆</Text> |
| | |
| | | import { View, Image } from "@tarojs/components"; |
| | | import bluetoothIcon from "../../../../assets/bluetooth-icon.png"; |
| | | import blueRightIcon from "../../../../assets/blue-right-icon.png"; |
| | | |
| | | type Props = { |
| | | description: string; |
| | |
| | | return ( |
| | | <View className="bluetooth-operate-card" onClick={onClick}> |
| | | <View className="bluetooth-operate-card-left"> |
| | | <Image src={bluetoothIcon} /> |
| | | <Image src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/bluetooth-icon.png" /> |
| | | <View>{description}</View> |
| | | </View> |
| | | {!!actionText && ( |
| | | <View className="bluetooth-operate-card-right"> |
| | | <View>{actionText}</View> |
| | | <Image src={blueRightIcon} /> |
| | | <Image src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/blue-right-icon.png" /> |
| | | </View> |
| | | )} |
| | | </View> |
| | |
| | | return ( |
| | | <View className="car-card-arrive"> |
| | | <View className={`car-card-arrive-item ${trunkStatus && 'close-btn-item'}`} onClick={() => handleUnlock('trunk', () => setTrunkStatus(!trunkStatus))}> |
| | | <Image className="car-card-arrive-item-img" src={trunkStatus ? require('../../../../assets/trunk-open.png') : require('../../../../assets/trunk-close.png')} /> |
| | | <Image className="car-card-arrive-item-img" src={trunkStatus ? 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/trunk-open.png' : 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/trunk-close.png'} /> |
| | | <View className="car-card-arrive-item-text">{trunkStatus ? '关闭后备箱' : '打开后备箱'}</View> |
| | | </View> |
| | | <View className="car-card-arrive-item" onClick={() => handleUnlock('door', () => setLockStatus(true))}> |
| | | <Image className="car-card-arrive-item-img" src={require('../../../../assets/lock-close.png')} /> |
| | | <Image className="car-card-arrive-item-img" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/lock-close.png" /> |
| | | <View className="car-card-arrive-item-text">解锁车门</View> |
| | | </View> |
| | | </View> |
| | |
| | | <Image className='car-card-reach-img' src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/door-anim.webp' /> |
| | | <View className="car-card-reach-btn"> |
| | | <View className={`car-card-reach-btn-item ${trunkStatus && 'close-btn-item'}`} onClick={() => handleUnlock('trunk', () => setTrunkStatus(!trunkStatus))}> |
| | | <Image className="car-card-reach-btn-item-img" src={trunkStatus ? require('../../../../assets/trunk-open.png') : require('../../../../assets/trunk-close.png')} /> |
| | | <Image className="car-card-reach-btn-item-img" src={trunkStatus ? 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/trunk-open.png' : 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/trunk-close.png'} /> |
| | | <View className="car-card-reach-btn-item-text">{trunkStatus ? '关闭后备箱' : '打开后备箱'}</View> |
| | | </View> |
| | | <View className="car-card-reach-btn-item" onClick={handleOpenOverRoutePopup}> |
| | | <Image className="car-card-reach-btn-item-img" src={require('../../../../assets/over-gps-icon.png')} /> |
| | | <Image className="car-card-reach-btn-item-img" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/over-gps-icon.png" /> |
| | | <View className="car-card-reach-btn-item-text">结束行程</View> |
| | | </View> |
| | | </View> |
| | |
| | | fareBreakdown?.redPacketMoney + fareBreakdown?.couponMoney > 0 && |
| | | <View className="car-card-end-particulars-money-through">{formatMoney(fareBreakdown?.orderMoney)}元</View> |
| | | } |
| | | <Image style={{ transform: showDetail ? 'rotate(90deg)' : 'rotate(0deg)', transition: 'transform 0.3s' }} src={require('../../../../assets/ccc-icon-right.png')} /> |
| | | <Image style={{ transform: showDetail ? 'rotate(90deg)' : 'rotate(0deg)', transition: 'transform 0.3s' }} src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/ccc-right.png" /> |
| | | </View> |
| | | } |
| | | </View> |
| | |
| | | <View className="car-card-end-cost-money"> |
| | | 全程{formatTripDistance(fareBreakdown?.kilometer)}|{formatTripDurationFromSeconds(fareBreakdown?.time)} |
| | | </View> |
| | | <Image src={require('../../../../assets/ccc-icon-right.png')} /> |
| | | <Image src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/ccc-right.png" /> |
| | | </View> |
| | | { |
| | | (fareBreakdown?.operateFree != 1 && [TripStatus.TripFinished, TripStatus.PaymentSuccess].includes(tripStatus)) && Number(fareBreakdown?.redPacketMoney + fareBreakdown?.couponMoney) > 0 && |
| | |
| | | <View className="car-card-end-through-content" onClick={onOpenCouponSelect}> |
| | | <View className="car-card-end-through-content-title">最佳优惠</View> |
| | | <View className="car-card-end-through-content-money">-{formatMoney(fareBreakdown?.redPacketMoney + fareBreakdown?.couponMoney)}元</View> |
| | | <Image src={require('../../../../assets/ccc-icon-right.png')} /> |
| | | <Image src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/ccc-right.png" /> |
| | | </View> |
| | | </View> |
| | | } |
| | |
| | | <View className="car-card-temp-num-btn"> |
| | | { |
| | | canAdjustTemperature ? |
| | | <Image className="car-card-temp-num-btn-img" src={require('../../../../assets/T-down.png')} onClick={() => handleTempChange(-0.5)} /> |
| | | <Image className="car-card-temp-num-btn-img" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/T-down.png" onClick={() => handleTempChange(-0.5)} /> |
| | | : |
| | | <Image className="car-card-temp-num-btn-img" src={require('../../../../assets/T-down-no.png')} /> |
| | | <Image className="car-card-temp-num-btn-img" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/T-down-no.png" /> |
| | | } |
| | | </View> |
| | | <View className="car-card-temp-num-text"> |
| | |
| | | <View className="car-card-temp-num-btn"> |
| | | { |
| | | canAdjustTemperature ? |
| | | <Image className="car-card-temp-num-btn-img" src={require('../../../../assets/T-up.png')} onClick={() => handleTempChange(0.5)} /> |
| | | <Image className="car-card-temp-num-btn-img" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/T-up.png" onClick={() => handleTempChange(0.5)} /> |
| | | : |
| | | <Image className="car-card-temp-num-btn-img" src={require('../../../../assets/T-up-no.png')} /> |
| | | <Image className="car-card-temp-num-btn-img" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/T-up-no.png" /> |
| | | } |
| | | </View> |
| | | </View> |
| | | <View className="car-card-temp-switch" onClick={handleToggleAcSwitch}> |
| | | { |
| | | acSwitchOn ? |
| | | <Image className="car-card-temp-switch-img" src={require('../../../../assets/T-switch-open.png')} /> |
| | | <Image className="car-card-temp-switch-img" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/T-switch-open.png" /> |
| | | : |
| | | <Image className="car-card-temp-switch-img" src={require('../../../../assets/T-switch-close.png')} /> |
| | | <Image className="car-card-temp-switch-img" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/T-switch-close.png" /> |
| | | } |
| | | <View className="car-card-temp-switch-text">空调开关</View> |
| | | </View> |
| | |
| | | import { View, Text, Image, Button } from "@tarojs/components"; |
| | | import changeDestinationIcon from "../../../../assets/change-destination.png"; |
| | | import shareIcon from "../../../../assets/share-trip.png"; |
| | | import cancelIcon from "../../../../assets/cancel-trip.png"; |
| | | import { TripStatus } from '../../constants/trip-status'; |
| | | |
| | | type Props = { |
| | |
| | | { |
| | | key: "cancel", |
| | | label: "取消行程", |
| | | icon: cancelIcon, |
| | | icon: 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/cancel-trip.png', |
| | | visible: tripStatus === TripStatus.VehicleApproaching, |
| | | onClick: handleCancelTrip |
| | | }, |
| | | { |
| | | key: "destination", |
| | | label: "修改目的地", |
| | | icon: changeDestinationIcon, |
| | | icon: 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/change-destination.png', |
| | | visible: [TripStatus.VehicleApproaching, TripStatus.VehicleArrivedPickup, TripStatus.InService].includes(tripStatus) && showModifyDestination, |
| | | onClick: handleModifyDestination |
| | | }, |
| | | { |
| | | key: "share", |
| | | label: "分享行程", |
| | | icon: shareIcon, |
| | | icon: 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/share-trip.png', |
| | | visible: [TripStatus.VehicleApproaching, TripStatus.VehicleArrivedPickup, TripStatus.InService].includes(tripStatus), |
| | | onClick: handleShareTrip |
| | | } |
| | |
| | | { |
| | | [TripStatus.CallingCar].includes(tripStatus) && |
| | | <View className="cancel-btn"> |
| | | <Image onClick={() => handleOpenCancelPopup?.({ durationDisplay, waitMinutes })} src={require('../../../../assets/cancel-btn.png')} className="cancel" /> |
| | | <Image onClick={() => handleOpenCancelPopup?.({ durationDisplay, waitMinutes })} src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/cancel-btn.png' className="cancel" /> |
| | | </View> |
| | | } |
| | | </View> |
| | |
| | | <View className='cancel-mask'></View> |
| | | <View className='cancel-content' animation={animationData}> |
| | | <View className='cancel-box'> |
| | | <Image onClick={closePopup} className='cancel-icon' src={require('../../../assets/close-icon.png')} /> |
| | | <Image onClick={closePopup} className='cancel-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/close-icon.png" /> |
| | | </View> |
| | | <View className='cancel-tip-box'> |
| | | <View className='cancel-tip-box-title'>{STATUS_MAP[cancelType].title}</View> |
| | |
| | | <View className='cancel-site-box'> |
| | | <View className='cancel-site-box-icon'> |
| | | <View className='cancel-site-box-icon-start'></View> |
| | | <Image src={require('../../../assets/dotted-line.png')} /> |
| | | <Image src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/dotted-line.png" /> |
| | | <View className='cancel-site-box-icon-end'></View> |
| | | </View> |
| | | <View className='cancel-site-box-content'> |
| | |
| | | </View> |
| | | : |
| | | <View className='cancel-btn-box'> |
| | | <Image className='cancel-btn-cancel' onClick={onConfirm} src={require('../../../assets/submit-cancel-btn.png')} /> |
| | | <Image className='cancel-btn-cancel' onClick={onConfirm} src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/submit-cancel-btn.png' /> |
| | | <View className='cancel-btn-again' onClick={onClose}>再等等</View> |
| | | </View> |
| | | } |
| | |
| | | <View className='evaluate-mask'></View> |
| | | <View className='evaluate-content' animation={animationData}> |
| | | <View className='evaluate-content-close'> |
| | | <Image onClick={onClose} src={require('../../../assets/close-icon.png')} /> |
| | | <Image onClick={onClose} src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/close-icon.png" /> |
| | | </View> |
| | | <View className='evaluate-content-title'> |
| | | <Image src={activeBad} /> |
| | |
| | | { |
| | | p.status === 'failed' && ( |
| | | <View className='evaluate-problem-pic-box-mask failed' onClick={() => handleRetry(idx)}> |
| | | <Image className='failed-icon' src={require('../../../assets/tip-default-icon.png')} /> |
| | | <Image className='failed-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/tip-default-icon.png" /> |
| | | <Text className='mask-text'>请重试</Text> |
| | | </View> |
| | | ) |
| | |
| | | { |
| | | p.status === 'success' && ( |
| | | <View className='evaluate-problem-pic-box-delete' onClick={() => handleDelete(idx)}> |
| | | <Image className='delete-icon' src={require('../../../assets/clear-icon.png')} /> |
| | | <Image className='delete-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/clear-icon.png" /> |
| | | </View> |
| | | ) |
| | | } |
| | |
| | | { |
| | | pictures.length < 3 && ( |
| | | <View className='evaluate-problem-pic-box-upload' onClick={handleChooseImages}> |
| | | <Image className='evaluate-problem-pic-box-upload-img' src={require('../../../assets/upload-icon.png')} /> |
| | | <Image className='evaluate-problem-pic-box-upload-img' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/upload-icon.png" /> |
| | | <View className='evaluate-problem-pic-box-upload-count'>{pictures.length}/3</View> |
| | | </View> |
| | | ) |
| | |
| | | import { useEffect, useState, useRef } from 'react'; |
| | | import './css-folder/modify-destination-review.less'; |
| | | import RouteSelectionPanel from './route-selection-panel'; |
| | | import tipDefaultIcon from '../../../assets/tip-default-icon.png'; |
| | | |
| | | type Props = { |
| | | startSite: any; |
| | |
| | | <View className='modify-destination-review-operate-free'>载客测试免费</View> |
| | | ) : ( |
| | | <View className='modify-destination-review-fare-main' onClick={toPriceDescription}> |
| | | <Image className='modify-destination-review-tip-icon' src={tipDefaultIcon} /> |
| | | <Image className='modify-destination-review-tip-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/tip-default-icon.png" /> |
| | | 预估 |
| | | <Text className='modify-destination-review-fare-num'>{fareEstimate?.finalFareStr || '-'}</Text> |
| | | 元 |
| | |
| | | <View className='over-popup' catchMove> |
| | | <View className='over-mask' onClick={onClose}></View> |
| | | <View className='over-content' animation={animationData}> |
| | | <Image onClick={onClose} className='close-icon' src={require('../../../assets/close-icon.png')} /> |
| | | <Image onClick={onClose} className='close-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/close-icon.png" /> |
| | | <View className='over-title'>确认结束行程?</View> |
| | | <View className='over-txt'>行程结束{finishMinutes}分钟后车辆将自动驶离</View> |
| | | <View onClick={handleConfirm} className='reselect-btn'>确认结束</View> |
| | |
| | | <View onClick={() => setChecked(!checked)} className='passenger-content-checkbox'> |
| | | { |
| | | checked ? |
| | | <Image src={require('../../../assets/check.png')} /> |
| | | <Image src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/check.png" /> |
| | | : |
| | | <Image src={require('../../../assets/uncheck.png')} /> |
| | | <Image src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/uncheck.png" /> |
| | | } |
| | | <View>3个月内不再显示</View> |
| | | </View> |
| | |
| | | <View className="top-box"> |
| | | <View className="top-box-title"> |
| | | <View className="title">正在发布行程...</View> |
| | | <Image onClick={handleOpenCancelPopup} src={require('../../../assets/cancel-btn.png')} className="cancel-btn" /> |
| | | <Image onClick={handleOpenCancelPopup} src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/cancel-btn.png' className="cancel-btn" /> |
| | | </View> |
| | | <View className="progress-box"> |
| | | <View className="progress" style={{ width: `${progress}%` }}></View> |
| | |
| | | <View key={item} className="route-state-box-item"> |
| | | {/* 根据 completedCount 动态显示完成图标 */} |
| | | {item < completedCount ? ( |
| | | <Image className="route-state-box-item-icon" src={require('../../../assets/route-state-icon.png')} /> |
| | | <Image className="route-state-box-item-icon" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/route-state-icon.png" /> |
| | | ) : ( |
| | | <Image className="route-state-box-item-icon" src={require('../../../assets/route-state-dot.png')} /> |
| | | <Image className="route-state-box-item-icon" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/route-state-dot.png" /> |
| | | )} |
| | | <View className={`route-state-box-item-text ${item == 2 && 'route-state-box-item-text-strong'}`}>{['上车点:', '目的地:', ''][item]}{[startSiteName, endSiteName, '正在发布行程'][item]}</View> |
| | | </View> |
| | |
| | | import Taro from "@tarojs/taro" |
| | | import { useEffect, useState, useRef } from "react"; |
| | | import { View, Text, Image } from '@tarojs/components'; |
| | | import rightIcon from '../../../assets/right-icon.png' |
| | | import './css-folder/release-route.less' |
| | | import tipBlueIcon from '../../../assets/tip-blue-icon.png' |
| | | import changeCouponIcon from '../../../assets/change-coupon.png' |
| | | import tipDefaultIcon from '../../../assets/tip-default-icon.png' |
| | | import RouteSelectionPanel from './route-selection-panel'; |
| | | |
| | | type Props = { |
| | |
| | | <View className="now-site-address-content"> |
| | | 从<Text className="now-site-address-text">{startSite.name}</Text>上车 |
| | | </View> |
| | | <Image className="now-site-icon" src={rightIcon} /> |
| | | <Image className="now-site-icon" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/right-icon.png" /> |
| | | </View> |
| | | </View> |
| | | {walkingTime > 0 && <View className="now-site-walk">步行{formatWalkingTime(walkingTime)}</View>} |
| | |
| | | </View> |
| | | <View className="route-content-bottom"> |
| | | <View onClick={handleOpenPassengerNotice} className="route-content-bottom-left"> |
| | | <Image className="tip-icon" src={tipDefaultIcon} /> |
| | | <Image className="tip-icon" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/tip-default-icon.png" /> |
| | | <View>乘车须知</View> |
| | | </View> |
| | | </View> |
| | |
| | | </View> |
| | | <View className="flex-center"> |
| | | <View className="discount-amount-num">{fareEstimate.discountAmount}元</View> |
| | | <Image className="change-coupon-icon" src={changeCouponIcon} /> |
| | | <Image className="change-coupon-icon" src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/change-coupon.png' /> |
| | | </View> |
| | | </View> |
| | | } |
| | |
| | | <View className="route-operate-free">载客测试免费</View> |
| | | ) : ( |
| | | <View className="route-content-top-money" onClick={() => toPriceDescription()} > |
| | | <Image className="tip-icon" src={tipDefaultIcon} /> |
| | | <Image className="tip-icon" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/tip-default-icon.png" /> |
| | | 预估 |
| | | <Text className="money-num">{fareEstimate.finalFareStr || '-'}</Text> |
| | | 元 |
| | |
| | | import { View, Text, Image, ScrollView } from '@tarojs/components'; |
| | | import { useEffect, useState } from 'react'; |
| | | import './index.less'; |
| | | import closeIcon from '../../../../assets/close-icon.png'; |
| | | import selectTypeLineIcon from '../../../../assets/select-type-line.png'; |
| | | import { queryRoutePreferences } from '../../../../api/begin-route'; |
| | | |
| | | export type RoutePreferenceOption = { |
| | |
| | | <View className='popup-content' animation={animationData}> |
| | | <View className='popup-header'> |
| | | <Text className='popup-title'>路线偏好设置</Text> |
| | | <Image className='close-icon' src={closeIcon} onClick={onClose} /> |
| | | <Image className='close-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/close-icon.png" onClick={onClose} /> |
| | | </View> |
| | | <View className='popup-list-wrap'> |
| | | <View className='popup-list-inner'> |
| | |
| | | > |
| | | <View className='popup-name'>{item.label}</View> |
| | | {isSelected && ( |
| | | <Image className='select-icon' src={selectTypeLineIcon} /> |
| | | <Image className='select-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/select-type-line.png" /> |
| | | )} |
| | | </View> |
| | | ); |
| | |
| | | import Taro from '@tarojs/taro'; |
| | | import { useEffect, useRef, useState } from 'react'; |
| | | import { View, Text, Image } from '@tarojs/components'; |
| | | import selectLineIcon from '../../../assets/select-line.png'; |
| | | import trafficSignalIcon from '../../../assets/traffic-signal.png'; |
| | | import RoutePreferencePopup, { RoutePreferenceOption } from './route-preference-popup'; |
| | | import { queryRoutePreferences, saveRoutePreference } from '../../../api/begin-route'; |
| | | import { formatRemainingDurationDisplay, normalizeDistanceKm } from '../../../utils/format'; |
| | |
| | | <View className='route-select-title'>路线选择:</View> |
| | | <View className='route-select-preference' onClick={() => setShowPreferencePopup(true)}> |
| | | <View className='route-select-preference-text'>{preference?.label || '智能推荐'}</View> |
| | | <Image src={selectLineIcon} /> |
| | | <Image src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/select-line.png" /> |
| | | </View> |
| | | </View> |
| | | <View className='route-select-content'> |
| | |
| | | <View>{dist}</View> |
| | | {typeof routeData.trafficLights !== 'undefined' && ( |
| | | <View className='traffic-signal-item'> |
| | | <Image className='traffic-signal-icon' src={trafficSignalIcon} /> |
| | | <Image className='traffic-signal-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/traffic-signal.png" /> |
| | | <Text>{routeData.trafficLights}个</Text> |
| | | </View> |
| | | )} |
| | |
| | | import { CurrentUserLocation } from './hooks/use-route-manager.shared'; |
| | | import { MODIFY_DESTINATION_SESSION_KEY } from './constants/modify-destination'; |
| | | |
| | | import backIcon from '../../../robotaxi/assets/back-icon.png' |
| | | import personalCenter from '../../../robotaxi/assets/personal-center.png' |
| | | import coupon from '../../../robotaxi/assets/coupon.png' |
| | | import contactService from '../../../robotaxi/assets/contact-service.png' |
| | | import originIcon from '../../../robotaxi/assets/origin-icon.png' |
| | | import packUpIcon from '../../../robotaxi/assets/pack-up.png' |
| | | import { _ROBOTAXI_WS_HOST } from '../../../constants/api'; |
| | | |
| | | const ROUTE_SUMMARY_MARKER_ID = 999001; |
| | |
| | | onMapTap: handleMapTap, |
| | | renderMapOverlays, |
| | | toBack, |
| | | backIcon, |
| | | backIcon: 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/back-icon.png', |
| | | onServiceEntry: handleServiceEntry, |
| | | onCouponEntry: handleCouponEntry, |
| | | onPersonalCenterEntry: handlePersonalCenterEntry, |
| | | personalCenter, |
| | | coupon, |
| | | contactService, |
| | | personalCenter: 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/personal-center.png', |
| | | coupon: 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/coupon.png', |
| | | contactService: 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/contact-service.png', |
| | | shouldShowOrigin, |
| | | originBoxHidden, |
| | | originOpacity, |
| | |
| | | handleWalkNavigation, |
| | | showWalkNavigationButton, |
| | | selectRouteIcon: 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/select-route.png', |
| | | packUpIcon, |
| | | packUpIcon: 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/pack-up.png', |
| | | onSelectRouteClick: () => setIsRouteSelectExpanded(!isRouteSelectExpanded), |
| | | isRouteSelectExpanded, |
| | | canToggleRouteSelect, |
| | | walkIcon: 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/walk-icon.png', |
| | | originIcon, |
| | | originIcon: 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/origin-icon.png', |
| | | renderTripCard, |
| | | showCustomerService, |
| | | handleCloseCustomerService, |
| | |
| | | import { useState, useEffect } from "react"; |
| | | import { View, Text, Image, RichText } from "@tarojs/components"; |
| | | import "./index.less"; |
| | | import icon from "../../assets/coupon-arrow.png"; |
| | | import close from "../../assets/close-icon.png"; |
| | | import { |
| | | getCouponList, |
| | | receiveCoupon, |
| | |
| | | </Text> |
| | | <View className="more" onClick={() => openPopup(item)}> |
| | | <Text className="more-detail">查看详情</Text> |
| | | <Image className="more-img" src={icon}></Image> |
| | | <Image className="more-img" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/coupon-arrow.png"></Image> |
| | | </View> |
| | | </View> |
| | | </View> |
| | |
| | | <Text className="title">{currentCoupon.title}</Text> |
| | | <Image |
| | | className="close" |
| | | src={close} |
| | | src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/close-icon.png" |
| | | onClick={() => closePopup()} |
| | | ></Image> |
| | | </View> |
| | |
| | | } from '../../../utils/Robotaxi-public-method'; |
| | | import EvaluatePopup from '../begin-route/components/evaluate-popup'; |
| | | import './index.less'; |
| | | import Subtract from '../../assets/Subtract.png'; |
| | | import more from '../../assets/more.png'; |
| | | |
| | | export default function OrderPage() { |
| | | const router = useRouter(); |
| | |
| | | <View className='title'>账单信息</View> |
| | | <View className='look-rule' onClick={() => toRulePage()}> |
| | | <Text className='look-rule-txt'>查看计价规则</Text> |
| | | <Image className='arrow-icon' src={Subtract}></Image> |
| | | <Image className='arrow-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/Subtract.png"></Image> |
| | | </View> |
| | | </View> |
| | | <View className='price-card'> |
| | |
| | | <Text className='question-text'>{item.questions}</Text> |
| | | <Image |
| | | className={`arrow-icon ${expandedItems.includes(String(item.id)) ? 'rotated' : ''}`} |
| | | src={more} |
| | | src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/more.png" |
| | | ></Image> |
| | | </View> |
| | | {expandedItems.includes(String(item.id)) && ( |
| | |
| | | <Text className='expand-more-text'>{showAllFaq ? '收起' : '展开更多'}</Text> |
| | | <Image |
| | | className={`arrow-icon ${showAllFaq ? 'rotated' : ''}`} |
| | | src={more} |
| | | src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/more.png" |
| | | ></Image> |
| | | </View> |
| | | )} |
| | | </View> |
| | | )} |
| | | {/* 去投诉 */} |
| | | <Image className='complaint' onClick={() => setShowEvaluatePopup(true)} src={require('../../assets/complaint-btn.png')} /> |
| | | <Image className='complaint' onClick={() => setShowEvaluatePopup(true)} src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/complaint-btn.png' /> |
| | | |
| | | {/* 评价弹窗 */} |
| | | <EvaluatePopup |
| | |
| | | import { Component, useState, useEffect } from 'react'; |
| | | import { View, Text, Image, Input } from '@tarojs/components'; |
| | | import './index.less'; |
| | | import Subtract from '../../assets/Subtract.png'; |
| | | import { |
| | | formatTripDistance, |
| | | formatTripDurationFromSeconds |
| | |
| | | {/* 查看计价规则 */} |
| | | <View className='look-rule' onClick={() => toPricingRule()}> |
| | | <Text className='look-rule-txt'>查看计价规则</Text> |
| | | <Image className='arrow-icon' src={Subtract}></Image> |
| | | <Image className='arrow-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/Subtract.png"></Image> |
| | | </View> |
| | | |
| | | |
| | |
| | | import { View, Map, Text, Image, ScrollView } from '@tarojs/components'; |
| | | import './index.less'; |
| | | |
| | | import backIcon from '../../../robotaxi/assets/back-icon.png'; |
| | | import originIcon from '../../../robotaxi/assets/origin-icon.png'; |
| | | |
| | | import { getOpenCity } from '../../api/select-city'; |
| | | import { getGeofence } from '../../api/home'; |
| | | import { extractPointsFromPolygons, findMatchedPolygon, getDistance } from '../../../utils/Robotaxi-public-method'; |
| | |
| | | </Map> |
| | | {/* 返回按钮 */} |
| | | <View onClick={toBack} className="back-btn"> |
| | | <Image className="back-icon" src={backIcon} /> |
| | | <Image className="back-icon" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/back-icon.png" /> |
| | | </View> |
| | | |
| | | {/* 底部面板 */} |
| | | { |
| | | cityList.length != 0 && |
| | | <View className="bottom-sheet"> |
| | | <Image className="origin-icon" src={originIcon} onClick={toOrigin} /> |
| | | <Image className="origin-icon" src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/origin-icon.png' onClick={toOrigin} /> |
| | | <View className="header"> |
| | | <Text className="title">查看运营区域</Text> |
| | | </View> |
| | |
| | | import { useState, useEffect, useRef } from 'react'; |
| | | import { View, Text, Image, Map } from '@tarojs/components'; |
| | | import './index.less'; |
| | | import right from '../../../assets/right.png' |
| | | import lineRight from '../../../assets/line-right.png' |
| | | import { getOrderDetail } from '../../../api/order'; |
| | | import EvaluatePopup from '../../begin-route/components/evaluate-popup'; |
| | | import { submitOrderComment } from '../../../api/begin-route'; |
| | |
| | | color: '#6D7FD9', |
| | | width: 10, |
| | | arrowLine: true, |
| | | arrowIconPath: lineRight, |
| | | arrowIconPath: 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/line-right.png', |
| | | borderColor: '#FFFFFF', |
| | | }]; |
| | | setPolyline(polylineData); |
| | |
| | | </View> |
| | | <View onClick={todescription} className='price-remark'> |
| | | <Text className='remark-text'>费用说明</Text> |
| | | <Image src={right} className='remark-img' /> |
| | | <Image src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/right.png" className='remark-img' /> |
| | | </View> |
| | | </View> |
| | | } |
| | |
| | | import { View, Text, Image } from "@tarojs/components"; |
| | | import { useState } from "react"; |
| | | import { useSelector } from "react-redux"; |
| | | import backIcon from "../../assets/mine-back.png"; |
| | | import mineArrow from "../../assets/mine-arrow.png"; |
| | | import mineLine from "../../assets/mine-line.png"; |
| | | import waitPay from "../../assets/mine-pay.png"; |
| | | import finished from "../../assets/mine-finished.png"; |
| | | import cancelled from "../../assets/mine-cancelled.png"; |
| | | import all from "../../assets/mine-all.png"; |
| | | import FavoritePopup from "../site-search/components/favorite-popup"; |
| | | import { getOrderHistoryList } from "../../api/order"; |
| | | import { getUserouponNum } from "../../api/coupon"; |
| | |
| | | }; |
| | | |
| | | const tripMenuList: TripMenuItem[] = [ |
| | | { key: "pendingPay", label: "待支付", icon: waitPay }, |
| | | { key: "completed", label: "已完成", icon: finished }, |
| | | { key: "cancelled", label: "已取消", icon: cancelled }, |
| | | { key: "all", label: "全部订单", icon: all } |
| | | { key: "pendingPay", label: "待支付", icon: 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/mine-pay.png' }, |
| | | { key: "completed", label: "已完成", icon: 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/finished.png' }, |
| | | { key: "cancelled", label: "已取消", icon: 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/cancelled.png' }, |
| | | { key: "all", label: "全部订单", icon: 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/mine-all.png' } |
| | | ]; |
| | | |
| | | const toolMenuList: ToolMenuItem[] = [ |
| | |
| | | <View className="personal-center-container"> |
| | | <View className="personal-center-header"> |
| | | <View className="header-left" onClick={handleBack}> |
| | | <Image className="header-back-icon" src={backIcon} /> |
| | | <Image className="header-back-icon" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/mine-back.png" /> |
| | | </View> |
| | | </View> |
| | | |
| | |
| | | <Text className="coupon-card-title">我的优惠券</Text> |
| | | <View className="coupon-card-right"> |
| | | <Text className="coupon-card-count">{couponCount}张</Text> |
| | | <Image className="coupon-card-arrow" src={mineArrow} /> |
| | | <Image className="coupon-card-arrow" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/mine-arrow.png" /> |
| | | </View> |
| | | </View> |
| | | |
| | |
| | | onClick={() => handleTripClick(item.key)} |
| | | > |
| | | {item.key === "all" && ( |
| | | <Image className="mine-line" src={mineLine} /> |
| | | <Image className="mine-line" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/mine-line.png" /> |
| | | )} |
| | | {item.key === "pendingPay" && hasPendingPayOrder && ( |
| | | <View className="trip-menu-badge" /> |
| | |
| | | onClick={() => handleToolClick(item.key)} |
| | | > |
| | | <Text className="tool-menu-label">{item.label}</Text> |
| | | <Image className="tool-menu-arrow" src={mineArrow} /> |
| | | <Image className="tool-menu-arrow" src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/mine-arrow.png" /> |
| | | </View> |
| | | ))} |
| | | </View> |
| | |
| | | <View className='tip-popup' catchMove> |
| | | <View className='tip-mask'></View> |
| | | <View className='tip-content' animation={animationData}> |
| | | <Image onClick={toHome} className='close-icon' src={require('../../../assets/close-icon.png')} /> |
| | | <Image onClick={toHome} className='close-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/close-icon.png" /> |
| | | <View className='tip-title'>{tipType === '1' ? '上车点与目的地距离较近,建议步行前往' : '当前位置距上车点较远,暂不支持叫车,请重新选择上车点'}</View> |
| | | <View onClick={onClose} className='reselect-btn'>重新选点</View> |
| | | </View> |
| | |
| | | const [outOfServiceRange, setOutOfServiceRange] = useState(false); // 是否超出运营范围 |
| | | const [walkingDistance, setWalkingDistance] = useState<number | null>(null); // 步行距离 |
| | | const [walkingDuration, setWalkingDuration] = useState<number | null>(null); // 步行时长 |
| | | const tooltipBgUrl = require('../../../../robotaxi/assets/tooltip-bg.png'); // 提示背景图资源 |
| | | const tooltipBgUrl = 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/tooltip-bg.png'; // 提示背景图资源 |
| | | const [tooltipBgSrc, setTooltipBgSrc] = useState(tooltipBgUrl); // 提示背景图路径 |
| | | const [isAndroid, setIsAndroid] = useState(false); // 是否安卓机型 |
| | | const waitingRadarSrc = 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/waiting-radar.webp'; // 加载雷达图 |
| | |
| | | z-index: 10; |
| | | |
| | | .toolTip-bg { |
| | | background-image: url(../../../robotaxi/assets/tooltip-bg.png); |
| | | background-image: url('https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/tooltip-bg.png'); |
| | | background-size: cover; |
| | | height: 70px; |
| | | min-width: 155px; |
| | |
| | | import SelectMapSiteView from './components/select-map-site-view'; |
| | | import useSelectMapSite from './hooks/use-select-map-site'; |
| | | |
| | | import backIcon from '../../../robotaxi/assets/back-icon.png'; |
| | | import personalCenter from '../../../robotaxi/assets/personal-center.png'; |
| | | import coupon from '../../../robotaxi/assets/coupon.png'; |
| | | import contactService from '../../../robotaxi/assets/contact-service.png'; |
| | | import originIcon from '../../../robotaxi/assets/origin-icon.png'; |
| | | import pointer from '../../../robotaxi/assets/pointer.png'; |
| | | import activeStar from '../../../robotaxi/assets/active-star.png'; |
| | | import noStar from '../../../robotaxi/assets/no-star.png'; |
| | | |
| | | /** |
| | | * 地图选点页入口:负责 hook 编排与视图组装。 |
| | | */ |
| | |
| | | handleRegionChange={selectMapSite.handleRegionChange} |
| | | handleMarkerTap={selectMapSite.handleMarkerTap} |
| | | toBack={selectMapSite.toBack} |
| | | backIcon={backIcon} |
| | | backIcon='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/back-icon.png' |
| | | openService={selectMapSite.openService} |
| | | toCoupon={selectMapSite.toCoupon} |
| | | toPersonalCenter={selectMapSite.toPersonalCenter} |
| | | personalCenter={personalCenter} |
| | | coupon={coupon} |
| | | contactService={contactService} |
| | | personalCenter='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/personal-center.png' |
| | | coupon='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/coupon.png' |
| | | contactService='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/contact-service.png' |
| | | nearbyLoading={selectMapSite.nearbyLoading} |
| | | isAndroid={selectMapSite.isAndroid} |
| | | waitingRadarSrc={selectMapSite.waitingRadarSrc} |
| | |
| | | tooltipBgSrc={selectMapSite.tooltipBgSrc} |
| | | pageType={selectMapSite.pageType} |
| | | bounce={selectMapSite.bounce} |
| | | pointer={pointer} |
| | | pointer='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/pointer.png' |
| | | toOrigin={selectMapSite.toOrigin} |
| | | originIcon={originIcon} |
| | | originIcon='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/origin-icon.png' |
| | | walkingDuration={selectMapSite.walkingDuration} |
| | | walkingDistance={selectMapSite.walkingDistance} |
| | | nearbySites={selectMapSite.nearbySites} |
| | | handleCollect={selectMapSite.handleCollect} |
| | | changeStationSite={selectMapSite.changeStationSite} |
| | | activeStar={activeStar} |
| | | noStar={noStar} |
| | | activeStar='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/active-star.png' |
| | | noStar='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/no-star.png' |
| | | confirmSite={selectMapSite.confirmSite} |
| | | showCustomerService={selectMapSite.showCustomerService} |
| | | handleCloseCustomerService={selectMapSite.handleCloseCustomerService} |
| | |
| | | import { View, Image, Map } from '@tarojs/components'; |
| | | import { formatDurationDisplay, safeParse } from '../../../../utils/Robotaxi-public-method'; |
| | | import { TripStatus } from '../../begin-route/constants/trip-status'; |
| | | import homeIcon from '../../../assets/back-home.png'; |
| | | import contactServiceIcon from '../../../assets/contact-service.png'; |
| | | import shareLine from '../../../assets/share-line.png'; |
| | | |
| | | type Props = { |
| | | isExpired: boolean; |
| | |
| | | > |
| | | {renderMapOverlays()} |
| | | <View onClick={goHome} className='select-city'> |
| | | <Image className='select-city-icon' src={homeIcon} /> |
| | | <Image className='select-city-icon' src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/back-home.png' /> |
| | | </View> |
| | | <View className='container'> |
| | | <View |
| | | className={`share-contact ${showReminder ? 'has-tip' : ''}`} |
| | | onClick={handleContactService} |
| | | > |
| | | <Image className='share-contact-icon' src={contactServiceIcon} /> |
| | | <Image className='share-contact-icon' src='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/contact-service.png' /> |
| | | </View> |
| | | {showReminder && ( |
| | | <View className='tip-box'> |
| | |
| | | <View className='car-card-line'></View> |
| | | <View className='car-card-temp'> |
| | | <View className='car-card-temp-list'> |
| | | <Image className='car-card-temp-img' src={shareLine} /> |
| | | <Image className='car-card-temp-img' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/share-line.png" /> |
| | | <View className='car-card-temp-row'> |
| | | <View className='car-card-temp-row-left'> |
| | | <View className='dot start'></View> |
| | |
| | | import { View, Text, Image, ScrollView } from '@tarojs/components'; |
| | | import { useEffect, useState } from 'react'; |
| | | import './index.less'; |
| | | import closeIcon from '../../../../assets/close-icon.png'; |
| | | import deleteIcon from '../../../../assets/delete-icon.png'; |
| | | import { getCollectPoints, collectPoint } from '../../../../api/site-search'; |
| | | |
| | | type Props = { |
| | |
| | | <View className='favorite-content' animation={animationData}> |
| | | <View className='favorite-header'> |
| | | <Text className='favorite-title'>收藏夹</Text> |
| | | <Image className='close-icon' src={closeIcon} onClick={onClose} /> |
| | | <Image className='close-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/close-icon.png" onClick={onClose} /> |
| | | </View> |
| | | <View className='favorite-list-wrap'> |
| | | <ScrollView |
| | |
| | | <Image onClick={(e) => { |
| | | e.stopPropagation(); |
| | | handleDelete(item); |
| | | }} className='delete-icon' src={deleteIcon} /> |
| | | }} className='delete-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/delete-icon.png" /> |
| | | </View> |
| | | ))} |
| | | {list.length === 0 && ( |
| | |
| | | import { View, Image } from '@tarojs/components'; |
| | | import { useState, useEffect } from 'react'; |
| | | import { collectPoint, getCollectPoints } from '../../../api/site-search'; |
| | | import tUpIcon from '../../../assets/T-up.png'; |
| | | |
| | | type Props = { |
| | | // 站点数据 |
| | |
| | | onClick={() => setExpandStationChildren(true)} |
| | | > |
| | | <View>更多</View> |
| | | <Image className='site-gate-more-icon' src={tUpIcon} /> |
| | | <Image className='site-gate-more-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/T-up.png" /> |
| | | </View> |
| | | ); |
| | | } |
| | |
| | | import { useState, useEffect, useRef } from 'react'; |
| | | import { View, Text, Image, Input } from '@tarojs/components'; |
| | | import './index.less'; |
| | | import map from '../../assets/map.png' |
| | | import favorite from '../../assets/favorite.png' |
| | | import address from '../../assets/address.png' |
| | | import arrow from '../../assets/arrow.png' |
| | | import activeStar from '../../assets/active-star.png' |
| | | import noStar from '../../assets/no-star.png' |
| | | import { getDistance } from '../../../utils/Robotaxi-public-method'; |
| | | import { getOrderDistance } from '../../api/select-map-site'; |
| | | import { checkOtp } from '../../../utils/tools'; |
| | |
| | | key={item.id || index} |
| | | itemKey={item.id || index} |
| | | item={item} |
| | | iconSrc={address} |
| | | starSrc={activeStar} |
| | | noStarSrc={noStar} |
| | | iconSrc='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/address.png' |
| | | starSrc='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/active-star.png' |
| | | noStarSrc='https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/no-star.png' |
| | | showDistance={showDistance} |
| | | onSelect={onSelect} |
| | | renderHighlightedText={renderHighlightedText} |
| | |
| | | { |
| | | searchValue && |
| | | <View onClick={clearSearchValue} className='cancel-icon-box'> |
| | | <Image className='cancel-icon' src={require('../../assets/clear-icon.png')} /> |
| | | <Image className='cancel-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/clear-icon.png" /> |
| | | </View> |
| | | } |
| | | </View> |
| | |
| | | {/* 收藏夹与地图选点 */} |
| | | <View className='fast-box'> |
| | | <View className='fast-item' onClick={() => setShowFavoritePopup(true)}> |
| | | <Image className='fast-item-icon' src={favorite}></Image> |
| | | <Image className='fast-item-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/favorite.png"></Image> |
| | | <Text className='fast-item-text'>收藏夹</Text> |
| | | </View> |
| | | <View className='fast-split'></View> |
| | | <View onClick={toSelectSite} className='fast-item'> |
| | | <Image className='fast-item-icon' src={map}></Image> |
| | | <Image className='fast-item-icon' src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/map.png"></Image> |
| | | <Text className='fast-item-text'>地图选点</Text> |
| | | </View> |
| | | </View> |
| | |
| | | {sortedHistorySite.length > MAX_SHOW_COUNT && ( |
| | | <View className='show-more' onClick={toggleHistoryShow}> |
| | | <Text className='more-text'>{showAllHistory ? '收起' : '展示更多'}</Text> |
| | | <Image className={`more-icon ${showAllHistory ? 'rotate-up' : ''}`} src={arrow}></Image> |
| | | <Image className={`more-icon ${showAllHistory ? 'rotate-up' : ''}`} src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/arrow.png"></Image> |
| | | </View> |
| | | )} |
| | | </View> |
| | |
| | | {recommendList.length > MAX_SHOW_COUNT && ( |
| | | <View className='show-more' onClick={toggleRecommendShow}> |
| | | <Text className='more-text'>{showAllRecommend ? '收起' : '展示更多'}</Text> |
| | | <Image className={`more-icon ${showAllRecommend ? 'rotate-up' : ''}`} src={arrow}></Image> |
| | | <Image className={`more-icon ${showAllRecommend ? 'rotate-up' : ''}`} src="https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/arrow.png"></Image> |
| | | </View> |
| | | )} |
| | | </View> |
| | |
| | | import weatherIcon from '../robotaxi/assets/weather.png'; |
| | | import windIcon from '../robotaxi/assets/wind.png'; |
| | | import sunnyIcon from '../robotaxi/assets/sunny.png'; |
| | | import cloudIcon from '../robotaxi/assets/sandDust.png'; |
| | | import rainIcon from '../robotaxi/assets/rain.png'; |
| | | import snowIcon from '../robotaxi/assets/snow.png'; |
| | | import thunderstormIcon from '../robotaxi/assets/thundershower.png'; |
| | | import fogIcon from '../robotaxi/assets/fog.png'; |
| | | import cloudyIcon from '../robotaxi/assets/cloudy.png'; |
| | | import rainstormIcon from '../robotaxi/assets/rainstorm.png'; |
| | | import sleetIcon from '../robotaxi/assets/sleet.png'; |
| | | |
| | | export const DEFAULT_TEMPERATURE_UNIT = '℃'; // 默认温度单位 |
| | | |
| | |
| | | * @param weatherDesc 高德天气返回的天气文字 |
| | | */ |
| | | export const getWeatherIconByDesc = (weatherDesc: string) => { |
| | | if (!weatherDesc) return weatherIcon; |
| | | if (!weatherDesc) return 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/weather.png'; |
| | | |
| | | // 优先级建议:雷阵雨/冰雹 > 大雨/暴雨 > 小雨/中雨 > 雪 > 雨夹雪 > 沙尘 > 雾霾 > 大风 > 多云/阴 > 晴 |
| | | |
| | | // 雷阵雨/冰雹 |
| | | if (['雷阵雨', '强雷阵雨', '雷阵雨并伴有冰雹'].includes(weatherDesc)) { |
| | | return thunderstormIcon; |
| | | return 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/thundershower.png'; |
| | | } |
| | | // 大雨/暴雨 |
| | | if (['大雨', '暴雨', '大暴雨', '特大暴雨', '强阵雨', '极端降雨', '中雨-大雨', '大雨-暴雨', '暴雨-大暴雨', '大暴雨-特大暴雨'].includes(weatherDesc)) { |
| | | return rainstormIcon; |
| | | return 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/rainstorm.png'; |
| | | } |
| | | // 小雨/中雨 |
| | | if (['阵雨', '小雨', '中雨', '毛毛雨/细雨', '雨', '小雨-中雨', '阵雨天气'].includes(weatherDesc)) { |
| | | return rainIcon; |
| | | return 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/rain.png'; |
| | | } |
| | | // 雪 |
| | | if (['雪', '阵雪', '小雪', '中雪', '大雪', '暴雪', '小雪-中雪', '中雪-大雪', '大雪-暴雪'].includes(weatherDesc)) { |
| | | return snowIcon; |
| | | return 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/snow.png'; |
| | | } |
| | | // 雨夹雪 |
| | | if (['雨夹雪', '阵雨夹雪', '雨雪天气', '冻雨'].includes(weatherDesc)) { |
| | | return sleetIcon; |
| | | return 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/sleet.png'; |
| | | } |
| | | // 沙尘/浮尘 |
| | | if (['浮尘', '扬沙', '沙尘暴', '强沙尘暴'].includes(weatherDesc)) { |
| | | return cloudIcon; |
| | | return 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/sandDust.png'; |
| | | } |
| | | // 雾/霾 |
| | | if (['雾', '浓雾', '强浓雾', '轻雾', '大雾', '特强浓雾', '霾', '中度霾', '重度霾', '严重霾'].includes(weatherDesc)) { |
| | | return fogIcon; |
| | | return 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/fog.png'; |
| | | } |
| | | // 大风/台风 |
| | | if (['有风', '和风', '微风', '清风', '强风/劲风', '疾风', '大风', '烈风', '风暴', '狂暴风', '飓风', '热带风暴', '龙卷风'].includes(weatherDesc)) { |
| | | return windIcon; |
| | | return 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/wind.png'; |
| | | } |
| | | // 多云/阴 |
| | | if (['晴间多云', '多云', '阴'].includes(weatherDesc)) { |
| | | return cloudyIcon; |
| | | return 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/cloudy.png'; |
| | | } |
| | | // 晴 |
| | | if (['晴', '少云', '平静'].includes(weatherDesc)) { |
| | | return sunnyIcon; |
| | | return 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/sunny.png'; |
| | | } |
| | | |
| | | // 其他/未知:['热', '冷', '未知'] |
| | | return weatherIcon; |
| | | return 'https://s.xiaopeng.com/xp-fe/robot-taxi/imgs/weather.png'; |
| | | }; |
| | | |
| | | /** |