car_front/pages/car_new/car_new.wxml

<!--pages/car_new/car_new.wxml-->
<view class="sticky-filter">
  <van-dropdown-menu>
  <van-dropdown-item
    value="{{selectedSort}}"
    options="{{sortOptions}}"
    bind:change="onSortChange"
  />
  <van-dropdown-item id="dropdownItemBrand" title="{{selectedBrandLabel}}"  use-slot>
    <van-tree-select
      height="400"
      items="{{brandTree}}"
      main-active-index="{{mainActiveIndex}}"
      active-id="{{selectedSeriesId}}"
      bind:click-nav="onBrandClick"
      bind:click-item="onSeriesSelect"
    />
  </van-dropdown-item>
  <van-dropdown-item
    value="{{selectedPrice}}"
    options="{{priceOptions}}"
    bind:change="onPriceChange"
  />

</van-dropdown-menu>
</view>

<!-- 汽车列表 -->
<view class="car-list">
  <view wx:for="{{carList}}" wx:key="id" class="car-item car-type-{{item.car_type}}" bindtap="goToCarDetail" data-id="{{item.id}}">
    <!-- 车辆类型标签 -->
    <view class="car-type-badge">
      <text wx:if="{{item.car_type == 1}}" class="badge-new">新车</text>
      <text wx:elif="{{item.car_type == 3}}" class="badge-rent">租车</text>
      <text wx:elif="{{item.car_type == 2}}" class="badge-used">二手车</text>
    </view>
    
    <image class="car-image" src="{{item.cover_image[0]}}" mode="aspectFill" />
    
    <view class="car-info">
      <view class="car-title">{{item.title}}</view>
      
      <!-- 新车价格显示 -->
      <view wx:if="{{item.car_type == 1}}" class="car-price">
        <text class="price-new">¥{{item.price}}万起</text>
        <text wx:if="{{item.re_price}}" class="price-old">指导价 ¥{{item.re_price}}万</text>
      </view>
      
      <!-- 租车价格显示 -->
      <view wx:elif="{{item.car_type == 3}}" class="car-price">
        <text class="price-rent">¥{{item.price}}/天</text>
        <text wx:if="{{item.re_price}}" class="price-monthly">月租 ¥{{item.re_price}}</text>
      </view>
      
      <!-- 二手车价格显示 -->
      <view wx:elif="{{item.car_type == 2}}" class="car-price">
        <text class="price-used">¥{{item.price}}万</text>
        <text wx:if="{{item.re_price}}" class="price-original">新车价 ¥{{item.re_price}}万</text>
      </view>
      
      <!-- 车辆特性标签 -->
      <view class="car-attrs">
        <!-- 新车特性 -->
        <block wx:if="{{item.car_type == 1}}">
          <van-tag wx:for="{{item.attr}}" wx:key="index" wx:for-item="opt" type="primary" size="mini">
            {{opt}}
          </van-tag>
          <van-tag wx:if="{{item.is_new_model}}" type="success" size="mini">全新上市</van-tag>
          <van-tag wx:if="{{item.has_discount}}" type="warning" size="mini">限时优惠</van-tag>
        </block>
        
        <!-- 租车特性 -->
        <block wx:elif="{{item.car_type == 3}}">
          <van-tag wx:for="{{item.attr}}" wx:key="index" wx:for-item="opt" type="success" size="mini">
            {{opt}}
          </van-tag>
          <van-tag wx:if="{{item.available_now}}" type="primary" size="mini">现车可租</van-tag>
          <van-tag wx:if="{{item.insurance_included}}" type="default" size="mini">含保险</van-tag>
        </block>
        
        <!-- 二手车特性 -->
        <block wx:elif="{{item.car_type == 2}}">
          <van-tag wx:for="{{item.attr}}" wx:key="index" wx:for-item="opt" type="warning" size="mini">
            {{opt}}
          </van-tag>
          <van-tag wx:if="{{item.mileage}}" type="default" size="mini">{{item.mileage}}万公里</van-tag>
          <van-tag wx:if="{{item.car_age}}" type="default" size="mini">{{item.car_age}}年车龄</van-tag>
          <van-tag wx:if="{{item.certified}}" type="success" size="mini">官方认证</van-tag>
        </block>
      </view>
      
      <!-- 额外信息 -->
      <view class="car-extra">
        <!-- 新车额外信息 -->
        <text wx:if="{{item.car_type == 1 && item.dealer_name}}" class="dealer-info">{{item.dealer_name}}</text>
        
        <!-- 租车额外信息 -->
        <text wx:elif="{{item.car_type == 3 && item.pickup_location}}" class="pickup-info">取车点：{{item.pickup_location}}</text>
        
        <!-- 二手车额外信息 -->
        <view wx:elif="{{item.car_type == 2}}" class="used-car-info">
          <text wx:if="{{item.first_license_date}}" class="license-date">首次上牌：{{item.first_license_date}}</text>
          <text wx:if="{{item.warranty_remain}}" class="warranty-info">质保剩余：{{item.warranty_remain}}</text>
        </view>
      </view>
    </view>
  </view>

   <!-- 加载状态 -->
   <view class="loading-container" wx:if="{{loading}}">
    <view class="loading-spinner">
      <text>加载中...</text>
    </view>
  </view>
  
  <!-- 无数据状态 -->
  <view class="no-data-container" wx:if="{{showNoData}}">
    <!-- <image class="no-data-icon" src="/images/no-data.png"></image> -->
    <text class="no-data-text">暂无数据</text>
    <text class="no-data-desc">换个条件试试吧</text>
  </view>
  
  <!-- 加载更多状态 -->
  <view class="load-more-container" wx:if="{{carList.length > 0}}">
    <view class="load-more-item" wx:if="{{loadingMore}}">
      <text>加载更多...</text>
    </view>
    <view class="load-more-item-no" wx:elif="{{!hasMore}}">
      <text>没有更多数据了</text>
    </view>
  </view>
</view>