import { View, Map, Image } from '@tarojs/components';
|
import CustomerServicePopup from '../../../components/customer-service';
|
import ReleaseRoute from './release-route';
|
import ReleaseBeBeing from './release-be-being';
|
import CancelPopup from './cancel-popup';
|
import CallingCar from './calling-car';
|
import AnnouncementsPopup from './announcements-popup';
|
import OverRoute from './over-route';
|
import PassengerNotice from './passenger-notice';
|
import EvaluatePopup from './evaluate-popup';
|
import TipPopup from '../../select-map-site/components/tip-popup';
|
import PrivacyPopup from '../../../../pages/robotaxi/home/components/privacy-popup';
|
|
type Props = {
|
mapLongitude: number;
|
mapLatitude: number;
|
mapScale: number;
|
markers: any[];
|
polyline: any[];
|
showLocation: boolean;
|
handleCalloutTap: (e: any) => void;
|
handleRegionChange: (e: any) => void;
|
renderMapOverlays: () => JSX.Element;
|
toBack: () => void;
|
backIcon: string;
|
onServiceEntry: () => void;
|
onCouponEntry: () => void;
|
onOrderEntry: () => void;
|
contactService: string;
|
coupon: string;
|
suggest: string;
|
shouldShowOrigin: boolean;
|
originBoxHidden: boolean;
|
originOpacity: number;
|
toOrigin: () => void;
|
originIcon: string;
|
renderTripCard: () => JSX.Element | null;
|
showCustomerService: boolean;
|
handleCloseCustomerService: () => void;
|
showCancelPopup: boolean;
|
cancelType: number;
|
cancelPopupWaitMinutes: number | null;
|
startSite: any;
|
endSite: any;
|
fareEstimate: any;
|
tripStatus: number;
|
routeDuration: number | null;
|
handleCloseCancelPopup: () => void;
|
handleConfirmCancel: () => void;
|
showAnnouncementsPopup: boolean;
|
handleCloseAnnouncementsPopup: () => void;
|
showOverRoutePopup: boolean;
|
handleCloseOverRoutePopup: () => void;
|
handleConfirmOverRoute: () => void;
|
showTipPopup: boolean;
|
handleCloseTipPopup: () => void;
|
tipType: string;
|
showPrivacyPopup: boolean;
|
handleClosePrivacyPopup: () => void;
|
showPassengerNotice: boolean;
|
handleClosePassengerNotice: () => void;
|
changeCheckedEnter: (checked: boolean) => void;
|
showEvaluatePopup: boolean;
|
orderId: string;
|
handleCloseEvaluatePopup: () => void;
|
handleConfirmEvaluate: (content: string) => void;
|
};
|
|
export default function BeginRouteView(props: Props) {
|
const {
|
mapLongitude,
|
mapLatitude,
|
mapScale,
|
markers,
|
polyline,
|
showLocation,
|
handleCalloutTap,
|
handleRegionChange,
|
renderMapOverlays,
|
toBack,
|
backIcon,
|
onServiceEntry,
|
onCouponEntry,
|
onOrderEntry,
|
contactService,
|
coupon,
|
suggest,
|
shouldShowOrigin,
|
originBoxHidden,
|
originOpacity,
|
toOrigin,
|
originIcon,
|
renderTripCard,
|
showCustomerService,
|
handleCloseCustomerService,
|
showCancelPopup,
|
cancelType,
|
cancelPopupWaitMinutes,
|
startSite,
|
endSite,
|
fareEstimate,
|
tripStatus,
|
routeDuration,
|
handleCloseCancelPopup,
|
handleConfirmCancel,
|
showAnnouncementsPopup,
|
handleCloseAnnouncementsPopup,
|
showOverRoutePopup,
|
handleCloseOverRoutePopup,
|
handleConfirmOverRoute,
|
showTipPopup,
|
handleCloseTipPopup,
|
tipType,
|
showPrivacyPopup,
|
handleClosePrivacyPopup,
|
showPassengerNotice,
|
handleClosePassengerNotice,
|
changeCheckedEnter,
|
showEvaluatePopup,
|
orderId,
|
handleCloseEvaluatePopup,
|
handleConfirmEvaluate
|
} = props;
|
|
// 统一渲染地图与业务弹窗容器
|
return (
|
<View className='home-container'>
|
<Map
|
id='map'
|
longitude={mapLongitude}
|
latitude={mapLatitude}
|
scale={mapScale}
|
markers={markers}
|
polyline={polyline}
|
showLocation={showLocation}
|
onCalloutTap={handleCalloutTap}
|
onRegionChange={handleRegionChange}
|
style={{ width: '100%', height: '87vh' }}
|
>
|
{renderMapOverlays()}
|
<View onClick={toBack} className='select-city'>
|
<Image className='select-city-icon' src={backIcon} />
|
</View>
|
<View className='map-entry'>
|
<Image onClick={onServiceEntry} className='map-entry-icon' src={contactService} />
|
<View className='split-line'></View>
|
<Image onClick={onCouponEntry} className='map-entry-icon' src={coupon} />
|
<View className='split-line'></View>
|
<Image onClick={onOrderEntry} className='map-entry-icon' src={suggest} />
|
</View>
|
<View className='container'>
|
<View className='container-inner'>
|
{shouldShowOrigin && (
|
<View className='origin-box' style={{ opacity: originBoxHidden ? 0 : originOpacity, transition: 'opacity 0.2s ease-out', pointerEvents: originBoxHidden ? 'none' : 'auto' }}>
|
<Image onClick={toOrigin} className='origin-icon' src={originIcon} />
|
</View>
|
)}
|
<View catchMove onClick={(e) => e.stopPropagation()}>
|
{renderTripCard()}
|
</View>
|
</View>
|
</View>
|
</Map>
|
<CustomerServicePopup
|
show={showCustomerService}
|
onClose={handleCloseCustomerService}
|
/>
|
<CancelPopup
|
show={showCancelPopup}
|
cancelType={cancelType}
|
startSite={startSite}
|
endSite={endSite}
|
waitMinutes={cancelPopupWaitMinutes ?? fareEstimate?.waitingTime}
|
tripStatus={tripStatus}
|
routeDurationSeconds={routeDuration}
|
discountAmount={fareEstimate?.discountAmount}
|
onClose={handleCloseCancelPopup}
|
onConfirm={handleConfirmCancel}
|
/>
|
<AnnouncementsPopup
|
show={showAnnouncementsPopup}
|
onClose={handleCloseAnnouncementsPopup}
|
/>
|
<OverRoute
|
show={showOverRoutePopup}
|
onClose={handleCloseOverRoutePopup}
|
onConfirm={handleConfirmOverRoute}
|
/>
|
<TipPopup
|
show={showTipPopup}
|
onClose={handleCloseTipPopup}
|
tipType={tipType}
|
/>
|
<PrivacyPopup
|
show={showPrivacyPopup}
|
onClose={handleClosePrivacyPopup}
|
onAgree={handleClosePrivacyPopup}
|
/>
|
{!showCancelPopup && (
|
<PassengerNotice
|
show={showPassengerNotice}
|
onClose={handleClosePassengerNotice}
|
onCheckedChange={changeCheckedEnter}
|
/>
|
)}
|
<EvaluatePopup
|
show={showEvaluatePopup}
|
orderId={orderId}
|
orderRating={1}
|
onClose={handleCloseEvaluatePopup}
|
onConfirm={handleConfirmEvaluate}
|
/>
|
</View>
|
);
|
}
|
