<view class="page page-with-tabbar">
  <!-- 装修渲染层 -->
  <view class="decor-wrap" wx:if="{{decorEnabled}}">
    <block wx:for="{{decorComponents}}" wx:key="key" wx:for-item="dc">
      <view class="decor-titlebar" wx:if="{{dc.type === 'titleBar'}}"><text class="decor-titlebar-text">{{dc.props.title}}</text></view>
      <view class="decor-notice" wx:if="{{dc.type === 'noticeBar'}}">📢 {{dc.props.text}}</view>
      <view class="nav-grid" wx:if="{{dc.type === 'grid' || dc.type === 'navGroup'}}">
        <view class="nav-item" wx:for="{{dc.props.items}}" wx:key="index" wx:for-item="it" bindtap="onDecorNav" data-link="{{it.link}}">
          <text class="nav-icon">{{it.icon}}</text>
          <text class="nav-label">{{it.text || it.label}}</text>
        </view>
      </view>
    
      <view wx:if="{{dc.type === 'waterfall'}}" class="wf-wrap">
        <view wx:if="{{dc.props.title}}" class="wf-title">{{dc.props.title}}</view>
        <view class="wf-columns">
          <view class="wf-col">
            <view class="wf-card" wx:for="{{dc.products}}" wx:key="index" wx:if="{{index % 2 === 0}}" wx:for-item="pr" bindtap="onDecorProduct" data-id="{{pr.id}}">
              <image class="wf-img" src="{{pr.image}}" mode="aspectFill" style="height:{{index % 3 === 0 ? 150 : 200}}rpx" />
              <view class="wf-name">{{pr.name}}</view>
              <view wx:if="{{dc.props.showPrice !== false}}" class="wf-price">¥{{pr.price}}</view>
              <view wx:if="{{dc.props.showSales !== false}}" class="wf-sales">已售{{pr.sales}}件</view>
            </view>
          </view>
          <view class="wf-col wf-col-2">
            <view class="wf-card" wx:for="{{dc.products}}" wx:key="index" wx:if="{{index % 2 === 1}}" wx:for-item="pr" bindtap="onDecorProduct" data-id="{{pr.id}}">
              <image class="wf-img" src="{{pr.image}}" mode="aspectFill" style="height:{{index % 3 === 1 ? 200 : 150}}rpx" />
              <view class="wf-name">{{pr.name}}</view>
              <view wx:if="{{dc.props.showPrice !== false}}" class="wf-price">¥{{pr.price}}</view>
              <view wx:if="{{dc.props.showSales !== false}}" class="wf-sales">已售{{pr.sales}}件</view>
            </view>
          </view>
        </view>
      </view>
      <view wx:if="{{dc.type === 'couponWall'}}" class="cw-wrap">
        <view wx:if="{{dc.props.title}}" class="wf-title">{{dc.props.title}}</view>
        <view class="cw-coupon" wx:for="{{dc.coupons}}" wx:key="id" wx:for-item="cp">
          <view class="cw-left">
            <view class="cw-value">¥{{cp.value}}</view>
            <view class="cw-cond">满{{cp.min_amount}}可用</view>
          </view>
          <view class="cw-mid">
            <view class="cw-name">{{cp.name}}</view>
            <view class="cw-valid">{{cp.valid_days ? '有效期' + cp.valid_days + '天' : '限量' + cp.remained + '张'}}</view>
          </view>
          <view wx:if="{{!cp.claimed && dc.props.showClaim !== false && dc.loginToken}}" class="cw-btn" catchtap="onClaimCoupon" data-id="{{cp.id}}">领取</view>
          <view wx:else class="cw-btn cw-btn-dis">{{cp.claimed ? '已领取' : '领取'}}</view>
        </view>
      </view>
      <view wx:if="{{dc.type === 'noticeScroll'}}" class="decor-notice" style="background:{{dc.props.bgColor || '#fff8ec'}};color:{{dc.props.textColor || '#8a6d3b'}}">📢
        <view class="ns-track">{{dc.props.items[0] || '公告滚动内容'}}</view>
      </view>
      <view wx:if="{{dc.type === 'countdownBanner'}}" class="cdb-banner" style="background:{{dc.props.bgColor || '#EE6B2F'}}" bindtap="onDecorNav" data-link="{{dc.props.link}}">
        <view class="cdb-title">{{dc.props.title || '限时特惠'}}</view>
        <view class="cdb-subtitle">{{dc.props.subtitle}}</view>
        <view class="cdb-clock">
          <text class="cdb-box">{{dc.props.d || '00'}}</text><text class="cdb-sep">:</text>
          <text class="cdb-box">{{dc.props.h || '00'}}</text><text class="cdb-sep">:</text>
          <text class="cdb-box">{{dc.props.m || '00'}}</text><text class="cdb-sep">:</text>
          <text class="cdb-box">{{dc.props.s || '00'}}</text>
        </view>
      </view>
      <view wx:if="{{dc.type === 'categoryGrid'}}" class="cg-grid" style="grid-template-columns:repeat({{dc.props.columns || 4}},1fr)">
        <view class="cg-item" wx:for="{{dc.categories}}" wx:key="id" wx:for-item="cg" bindtap="onDecorCategory">
          <view class="cg-icon">{{cg.icon || '📂'}}</view>
          <view class="cg-name">{{cg.name}}</view>
        </view>
      </view>

</block>
  </view>
  <view wx:if="{{!decorEnabled}}">
  <!-- 用户信息头部 -->
  <view class="user-header">
    <view class="user-avatar">
      <image class="avatar" src="{{userInfo.avatar}}" mode="aspectFill" wx:if="{{userInfo.avatar}}" />
      <text class="avatar-placeholder" wx:else>{{avatarChar}}</text>
    </view>
    <view class="user-meta" wx:if="{{logged}}">
      <view class="user-name">{{userInfo.nickname || maskPhone(userInfo.phone)}}</view>
      <view class="user-level" wx:if="{{levelInfo.current_level}}">
        <text class="tag tag-primary">{{levelInfo.current_level.name}}</text>
      </view>
    </view>
    <view class="user-meta" wx:else bindtap="goLogin">
      <view class="user-name">点击登录</view>
      <view class="user-login-tip">登录后享受更多服务</view>
    </view>
  </view>

  <!-- 订单快捷入口 -->
  <view class="card">
    <view class="card-body">
      <view class="order-quick-grid">
        <view class="oq-item" bindtap="goOrders" data-status="pending_pay">
          <text class="oq-icon">⏳</text>
          <text class="oq-label">待付款</text>
        </view>
        <view class="oq-item" bindtap="goOrders" data-status="pending_ship">
          <text class="oq-icon">📦</text>
          <text class="oq-label">待发货</text>
        </view>
        <view class="oq-item" bindtap="goOrders" data-status="shipped">
          <text class="oq-icon">🚚</text>
          <text class="oq-label">待收货</text>
        </view>
        <view class="oq-item" bindtap="goOrders" data-status="received">
          <text class="oq-icon">⭐</text>
          <text class="oq-label">待评价</text>
        </view>
        <view class="oq-item" bindtap="goRefund">
          <text class="oq-icon">🔄</text>
          <text class="oq-label">退款/售后</text>
        </view>
      </view>
    </view>
  </view>

  <!-- 会员服务入口 -->
  <view class="card" wx:if="{{logged}}">
    <view class="menu-list">
      <view class="menu-item flex-between" bindtap="gotoMembership">
        <view class="flex-row gap-16"><text class="menu-icon">👑</text><text>会员中心</text></view>
        <text class="menu-arrow">›</text>
      </view>
      <view class="menu-item flex-between" bindtap="gotoDistribution">
        <view class="flex-row gap-16"><text class="menu-icon">📢</text><text>分销中心</text></view>
        <text class="menu-arrow">›</text>
      </view>
      <view class="menu-item flex-between" bindtap="gotoExchange">
        <view class="flex-row gap-16"><text class="menu-icon">🎁</text><text>积分商城</text></view>
        <text class="menu-arrow">›</text>
      </view>
      <view class="menu-item flex-between" bindtap="gotoPoints">
        <view class="flex-row gap-16"><text class="menu-icon">💎</text><text>我的积分</text><text style="color:#7C3AED;font-size:24rpx">{{userInfo.points||0}}分</text></view>
        <text class="menu-arrow">›</text>
      </view>
      <view class="menu-item flex-between" bindtap="gotoRecharge">
        <view class="flex-row gap-16"><text class="menu-icon">💰</text><text>余额充值</text></view>
        <text class="menu-arrow">›</text>
      </view>
      <view class="menu-item flex-between" bindtap="gotoCheckin">
        <view class="flex-row gap-16"><text class="menu-icon">✅</text><text>每日签到</text></view>
        <text class="menu-arrow">›</text>
      </view>
      <view class="menu-item flex-between" bindtap="gotoGroupBuy">
        <view class="flex-row gap-16"><text class="menu-icon">🤝</text><text>拼团</text></view>
        <text class="menu-arrow">›</text>
      </view>
      <view class="menu-item flex-between" bindtap="gotoPresale">
        <view class="flex-row gap-16"><text class="menu-icon">🚀</text><text>预售</text></view>
        <text class="menu-arrow">›</text>
      </view>
      <view class="menu-item flex-between" bindtap="gotoBargain">
        <view class="flex-row gap-16"><text class="menu-icon">🔪</text><text>砍价</text></view>
        <text class="menu-arrow">›</text>
      </view>
    </view>
  </view>

  <!-- 菜单列表 -->
  <view class="card">
    <view class="menu-list">
      <view class="menu-item flex-between" bindtap="goOrders" data-status="all">
        <view class="flex-row gap-16"><text class="menu-icon">📋</text><text>我的订单</text></view>
        <text class="menu-arrow">›</text>
      </view>
      <view class="menu-item flex-between" bindtap="goAddress">
        <view class="flex-row gap-16"><text class="menu-icon">📍</text><text>收货地址</text></view>
        <text class="menu-arrow">›</text>
      </view>
      <view class="menu-item flex-between" bindtap="goFavorites">
        <view class="flex-row gap-16"><text class="menu-icon">❤️</text><text>我的收藏</text></view>
        <text class="menu-arrow">›</text>
      </view>
      <view class="menu-item flex-between" bindtap="goCoupon">
        <view class="flex-row gap-16"><text class="menu-icon">📄</text><text>优惠券</text></view>
        <text class="menu-arrow">›</text>
      </view>
    </view>
  </view>

  <view class="card" wx:if="{{logged}}">
    <view class="menu-list">
      <view class="menu-item flex-between" bindtap="gotoNotification">
        <view class="flex-row gap-16"><text class="menu-icon">🔔</text><text>消息通知</text></view>
        <text class="menu-arrow">›</text>
      </view>
      <view class="menu-item flex-between" bindtap="gotoBrowseHistory">
        <view class="flex-row gap-16"><text class="menu-icon">🕘</text><text>浏览足迹</text></view>
        <text class="menu-arrow">›</text>
      </view>
    </view>
  </view>

  <view class="card" wx:if="{{logged}}">
    <view class="menu-list">
      <view class="menu-item flex-between" bindtap="goAbout">
        <view class="flex-row gap-16"><text class="menu-icon">ℹ️</text><text>关于我们</text></view>
        <text class="menu-arrow">›</text>
      </view>
    </view>
  </view>

  <!-- 退出登录 -->
  <view class="logout-section" wx:if="{{logged}}">
    <button class="btn-plain btn-block" bindtap="onLogout">退出登录</button>
  </view>
  </view>
</view>
