feat(begin-route): 添加蓝牙操作卡片并更新个人中心图标

hejianhao

2026-04-15 c677333fe5a2fb96b0af58bb682e0b6d09279bc1

feat(begin-route): 添加蓝牙操作卡片并更新个人中心图标

- 新增蓝牙操作卡片组件，用于提示用户开启系统蓝牙以解锁车辆
- 将多处引用的 contact-service 图标更新为 personal-center 图标，统一命名
- 添加蓝牙操作卡片对应的样式定义

 src/pages/robotaxi/home/index.tsx

@@ -8,7 +8,7 @@
import MapOverlayTips from './components/map-overlay-tips';
import MapPointer from './components/map-pointer';
import selectCityIcon from '../../../robotaxi/assets/select-city.png'
import contactService from '../../../robotaxi/assets/contact-service.png'
import personalCenter from '../../../robotaxi/assets/personal-center.png'
import coupon from '../../../robotaxi/assets/coupon.png'
import suggest from '../../../robotaxi/assets/suggest.png'
import originIcon from '../../../robotaxi/assets/origin-icon.png'
@@ -436,7 +436,7 @@
        />
        {/* 地图浮层入口 */}
        <View className="map-entry">
          <Image onClick={openService} className="map-entry-icon" src={contactService} />
          <Image onClick={openService} className="map-entry-icon" src={personalCenter} />
          <View className="split-line"></View>
          <Image onClick={toCoupon} className="map-entry-icon" src={coupon} />
          <View className="split-line"></View>

 src/robotaxi/assets/blue-right-icon.png

 src/robotaxi/assets/bluetooth-icon.png

 src/robotaxi/pages/begin-route/components/begin-route-view.tsx

@@ -25,7 +25,7 @@
  onServiceEntry: () => void;
  onCouponEntry: () => void;
  onOrderEntry: () => void;
  contactService: string;
  personalCenter: string;
  coupon: string;
  suggest: string;
  shouldShowOrigin: boolean;
@@ -83,7 +83,7 @@
    onServiceEntry,
    onCouponEntry,
    onOrderEntry,
    contactService,
    personalCenter,
    coupon,
    suggest,
    shouldShowOrigin,
@@ -144,7 +144,7 @@
          <Image className='select-city-icon' src={backIcon} />
        </View>
        <View className='map-entry'>
          <Image onClick={onServiceEntry} className='map-entry-icon' src={contactService} />
          <Image onClick={onServiceEntry} className='map-entry-icon' src={personalCenter} />
          <View className='split-line'></View>
          <Image onClick={onCouponEntry} className='map-entry-icon' src={coupon} />
          <View className='split-line'></View>

 src/robotaxi/pages/begin-route/components/calling-car-modules/bluetooth-operate-card.tsx

New file
@@ -0,0 +1,19 @@
import { View, Image } from "@tarojs/components";
import bluetoothIcon from "@/assets/images/bluetooth-icon.png";
import blueRightIcon from "@/assets/images/blue-right-icon.png";

export default function BluetoothOperateCard() {
    
    return (
        <View className="bluetooth-operate-card">
            <View className="bluetooth-operate-card-left">
                <Image src={bluetoothIcon} />
                <View>系统蓝牙未开启，无法自动解锁车辆</View>
            </View>
            <View className="bluetooth-operate-card-right">
                <View>去开启</View>
                <Image src={blueRightIcon} />
            </View>
        </View>
    );
}

 src/robotaxi/pages/begin-route/components/css-folder/calling-car.less

@@ -64,6 +64,7 @@
            display: flex;
            align-items: center;
            justify-content: center;

            .cancel {
                flex-shrink: 0;
                width: 144px;
@@ -501,4 +502,47 @@
        mask-composite: exclude;
        pointer-events: none;
    }
}

.bluetooth-operate-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 24px 16px 16px;
    border-radius: 16px;
    background: #FFFFFF;

    .bluetooth-operate-card-left {
        display: flex;
        align-items: center;
        gap: 12px;
        font-size: 24px;
        font-weight: normal;
        line-height: 40px;
        letter-spacing: normal;
        color: rgba(0, 0, 0, 0.9);

        image {
            flex-shrink: 0;
            width: 24px;
            height: 28px;
        }
    }

    .bluetooth-operate-card-right {
        display: flex;
        align-items: center;
        gap: 11px;
        font-size: 24px;
        font-weight: normal;
        line-height: 40px;
        letter-spacing: normal;
        color: #6D7FD9;

        image {
            flex-shrink: 0;
            width: 11.97px;
            height: 17.5px;
        }
    }
}

 src/robotaxi/pages/begin-route/index.tsx

@@ -32,7 +32,7 @@
import useViewDelegates from './hooks/use-view-delegates';

import backIcon from '../../../robotaxi/assets/back-icon.png'
import contactService from '../../../robotaxi/assets/contact-service.png'
import personalCenter from '../../../robotaxi/assets/personal-center.png'
import coupon from '../../../robotaxi/assets/coupon.png'
import suggest from '../../../robotaxi/assets/suggest.png'
import originIcon from '../../../robotaxi/assets/origin-icon.png'
@@ -532,7 +532,7 @@
      onServiceEntry={handleServiceEntry}
      onCouponEntry={handleCouponEntry}
      onOrderEntry={handleOrderEntry}
      contactService={contactService}
      personalCenter={personalCenter}
      coupon={coupon}
      suggest={suggest}
      shouldShowOrigin={shouldShowOrigin}

 src/robotaxi/pages/select-map-site/index.tsx

@@ -7,7 +7,7 @@
import TipPopup from './components/tip-popup';

import backIcon from '../../../robotaxi/assets/back-icon.png'
import contactService from '../../../robotaxi/assets/contact-service.png'
import personalCenter from '../../../robotaxi/assets/personal-center.png'
import coupon from '../../../robotaxi/assets/coupon.png'
import suggest from '../../../robotaxi/assets/suggest.png'
import originIcon from '../../../robotaxi/assets/origin-icon.png'
@@ -515,7 +515,7 @@
        </View>
        {/* 地图浮层入口 */}
        <View className="map-entry">
          <Image onClick={openService} className="map-entry-icon" src={contactService} />
          <Image onClick={openService} className="map-entry-icon" src={personalCenter} />
          <View className="split-line"></View>
          <Image onClick={toCoupon} className="map-entry-icon" src={coupon} />
          <View className="split-line"></View>