<view class="page-container">
  <view class="card ps-hero">
    <view class="ps-title">🚀 预售专区</view>
    <view class="ps-sub">交定金 · 锁名额 · 付尾款 · 享低价</view>
    <view class="ps-tabs">
      <view class="ps-tab {{view==='list'?'active':''}}" data-view="list" bindtap="switchView">预售活动</view>
      <view class="ps-tab {{view==='orders'?'active':''}}" data-view="orders" bindtap="switchView">我的预售</view>
    </view>
  </view>

  <!-- 状态占位 -->
  <view wx:if="{{loading}}" class="ps-loading">加载中...</view>

  <!-- ==================== 活动列表 ==================== -->
  <block wx:elif="{{view==='list'}}">
    <view class="ps-list">
      <view class="card ps-item" wx:for="{{list}}" wx:key="id" data-id="{{item.id}}" bindtap="openDetail">
        <image class="ps-image" src="{{item.product_image}}" mode="aspectFill" />
        <view class="ps-info">
          <view class="ps-name text-ellipsis-2">{{item.name}}</view>
          <view class="ps-price-row">
            <view class="ps-deposit">定金 <text class="ps-price">¥{{item.deposit}}</text></view>
            <view class="ps-final" wx:if="{{item.deposit_expand}}">尾款 ¥{{item.final_amount}}</view>
          </view>
          <view class="ps-delivery" wx:if="{{item.delivery_time}}">发货：{{item.delivery_time}}</view>
        </view>
      </view>
      <empty-state wx:if="{{!loading && list.length===0}}" text="暂无预售活动" />
    </view>
  </block>

  <!-- ==================== 活动详情 ==================== -->
  <block wx:elif="{{view==='detail'}}">
    <view class="card ps-detail" wx:if="{{detail.id}}">
      <image class="ps-detail-img" src="{{detail.product_image}}" mode="aspectFill" />
      <view class="ps-detail-name">{{detail.name}}</view>
      <view class="ps-price-box">
        <view class="ps-row"><text>商品原价</text><text class="ps-row-val">¥{{detail.product_price}}</text></view>
        <view class="ps-row" wx:if="{{detail.deposit_expand}}"><text>定金膨胀</text><text class="ps-row-val">抵 ¥{{detail.deposit_expand}}</text></view>
        <view class="ps-row"><text>定金</text><text class="ps-row-val danger">¥{{detail.deposit}}</text></view>
        <view class="ps-row"><text>发货时间</text><text class="ps-row-val">{{detail.delivery_time || '尾款后发货'}}</text></view>
      </view>
      <view class="ps-qty-row">
        <text>购买数量</text>
        <input class="ps-qty-input" type="number" value="{{qty}}" bindinput="changeQty" />
      </view>
      <button class="btn btn-danger btn-block ps-submit" loading="{{submitting}}" bindtap="submitDeposit">
        提交定金 ¥{{depositText}}
      </button>
      <view class="ps-back" bindtap="backToList">‹ 返回活动列表</view>
    </view>
  </block>

  <!-- ==================== 我的预售订单 ==================== -->
  <block wx:elif="{{view==='orders'}}">
    <view class="ps-list">
      <view class="card ps-item order-item" wx:for="{{orders}}" wx:key="id">
        <view class="ps-order-head">
          <view class="ps-order-no">单号：{{item.order_no}}</view>
          <view class="ps-order-status" wx:if="{{item.status==='deposit_paid'}}">待付尾款</view>
          <view class="ps-order-status done" wx:elif="{{item.status==='final_paid'}}">已付尾款</view>
          <view class="ps-order-status" wx:elif="{{item.status==='deposit_pending'}}">待付定金</view>
          <view class="ps-order-status muted" wx:else>{{item.status}}</view>
        </view>
        <view class="ps-order-body">
          <image class="ps-image" src="{{item.product_image}}" mode="aspectFill" />
          <view class="ps-info">
            <view class="ps-name text-ellipsis-2">{{item.product_name}}</view>
            <view class="ps-price-row">定金 ¥{{item.deposit}} · 尾款 ¥{{item.final_amount}}</view>
          </view>
        </view>
        <view class="ps-order-actions">
          <button class="btn btn-small btn-outline" wx:if="{{item.status==='deposit_pending'}}" data-no="{{item.order_no}}" bindtap="payFinal">付定金</button>
          <button class="btn btn-danger btn-small" wx:if="{{item.status==='deposit_paid'}}" data-no="{{item.order_no}}" bindtap="payFinal">付尾款</button>
        </view>
      </view>
      <empty-state wx:if="{{!loading && orders.length===0}}" text="暂无预售订单" />
      <view class="ps-back" wx:if="{{!loading && orders.length>0}}" bindtap="switchView" data-view="list">‹ 返回活动列表</view>
    </view>
  </block>
</view>
