operation_wx/pages/map/index.wxml

<view class="container">
  <!-- 地图组件 -->
  <map 
    id="map"
    class="map"
    longitude="{{longitude}}"
    latitude="{{latitude}}"
    scale="{{scale}}"
    markers="{{markers}}"
    polyline="{{polyline}}"
    show-location
    bindregionchange="onRegionChange"
  ></map>
  
  <!-- 底部操作面板 -->
  <view class="bottom-panel">
    <!-- 行程信息卡片 -->
    <view class="trip-card">
      <view class="location-item">
        <view class="location-icon start-icon">
          <view class="icon-circle"></view>
        </view>
        <view class="location-input">
          <input placeholder="您的位置" value="{{startLocation.name}}" bindtap="chooseStartLocation" />
        </view>
      </view>
      
      <view class="location-item">
        <view class="location-icon end-icon">
          <view class="icon-marker"></view>
        </view>
        <view class="location-input">
          <input placeholder="输入目的地" value="{{endLocation.name}}" bindtap="chooseEndLocation" />
        </view>
      </view>
      
      <!-- 行程信息 -->
      <view class="trip-info" wx:if="{{showTripInfo}}">
        <view class="distance">距离: {{distance}} 公里</view>
        <view class="estimated-price">预估费用: ¥{{estimatedPrice}}</view>
      </view>
    </view>
    
    <!-- 叫车按钮 -->
    <button class="call-btn" bindtap="callCar" wx:if="{{showCallButton}}">
      呼叫快车
    </button>
    
    <!-- 司机信息 (叫车后显示) -->
    <view class="driver-info" wx:if="{{showDriverInfo}}">
      <image src="{{driverAvatar}}" class="driver-avatar"></image>
      <view class="driver-details">
        <view class="driver-name">司机 {{driverName}}</view>
        <view class="driver-car">车牌号: {{carNumber}}</view>
        <view class="driver-arrive">预计{{estimatedArrival}}分钟后到达</view>
      </view>
      <button class="cancel-btn" bindtap="cancelOrder">取消订单</button>
    </view>
  </view>
  
  <!-- 附近车辆数量提示 -->
  <view class="cars-nearby" wx:if="{{carsNearby > 0}}">
    <view class="cars-icon">
      <text class="iconfont icon-car"></text>
    </view>
    <view class="cars-count">附近有 {{carsNearby}} 辆车</view>
  </view>
</view>