wxamp-ymtxUser/pagesB/pages/administrativeDivision/administrativeDivision.wxml

<view class="container">
  <!-- 已选择区域路径显示 -->
  <view class="selected-path" wx:if="{{selectedRegions.length > 0}}">
    <text class="path-title">已选择：</text>
    <view class="path-items">
      <view 
        wx:for="{{selectedRegions}}" 
        wx:key="index"
        class="path-item {{index === selectedRegions.length - 1 ? 'last' : ''}}"
        data-index="{{index}}"
        bindtap="reSelectRegion"
      >
        <text>{{item.name}}</text>
        <text class="separator" wx:if="{{index < selectedRegions.length - 1}}">></text>
      </view>
    </view>
  </view>

  <!-- 选择按钮 -->
  <view class="select-btn-container">
    <button 
      class="select-btn" 
      bindtap="startSelection"
      loading="{{loading}}"
    >
      {{selectedRegions.length === 0 ? '开始选择区域' : '继续选择下一级'}}
    </button>
  </view>

  <!-- 操作按钮 -->
  <view class="action-buttons">
    <button 
      class="btn complete-btn" 
      bindtap="completeSelection"
      disabled="{{selectedRegions.length === 0}}"
    >
      完成选择
    </button>
    <button 
      class="btn reset-btn" 
      bindtap="resetSelection"
      wx:if="{{selectedRegions.length > 0}}"
    >
      重置
    </button>
  </view>

  <!-- 选择器弹出层 -->
  <view class="picker-modal" wx:if="{{showPicker}}">
    <view class="picker-mask" bindtap="closePicker"></view>
    <view class="picker-content">
      <view class="picker-header">
        <text class="picker-title">{{regionTitle}}</text>
        <text class="picker-close" bindtap="closePicker">×</text>
      </view>
      
      <view class="picker-body">
        <!-- 加载状态 -->
        <view class="loading-container" wx:if="{{loading}}">
          <view class="loading-spinner"></view>
          <text class="loading-text">加载中...</text>
        </view>
        
        <!-- 区域列表 -->
        <scroll-view scroll-y class="region-list" wx:else>
          <view 
            wx:for="{{regionList}}" 
            wx:key="id"
            class="region-item"
            data-index="{{index}}"
            bindtap="selectRegion"
          >
            <view class="region-info">
              <text class="region-name">{{item.name}}</text>
            </view>
            <text class="arrow">›</text>
          </view>
          
          <!-- 空状态 -->
          <view class="empty-state" wx:if="{{regionList.length === 0}}">
            <text class="empty-text">
              {{selectedRegions.length > 0 ? '已选择到最后一级' : '暂无区域数据'}}
            </text>
          </view>
        </scroll-view>
      </view>
    </view>
  </view>

  <!-- 使用说明 -->
  <view class="instruction">
    <text class="instruction-title">使用说明：</text>
    <text class="instruction-text">1. 点击"开始选择区域"开始选择\n2. 选择后会加载下一级区域\n3. 点击已选择区域的任意级别可以重新选择\n4. 选择最后一级时会直接替换\n5. 完成选择后点击"完成选择"按钮</text>
  </view>
</view>