<!--pages/merchant-orders/merchant-orders.wxml-->
<view class="sj-page">
  <!-- 顶部商品类型滑动 -->
  <view class="leixing-area">
    <scroll-view class="leixing-scroll" scroll-x enhanced show-scrollbar="{{false}}">
      <view class="leixing-container">
        <block wx:for="{{shangpinleixing}}" wx:key="id">
          <view
            class="leixing-item {{xuanzhongLeixingId == item.id ? 'leixing-active' : ''}}"
            data-id="{{item.id}}"
            bindtap="selectLeixing"
          >
            <image class="leixing-img" src="{{item.full_tupian_url}}" mode="aspectFill"/>
            <text class="leixing-name">{{item.jieshao || '类型'}}</text>
          </view>
        </block>
      </view>
    </scroll-view>
  </view>

  <!-- 搜索行 -->
  <view class="filter-row">
    <view class="search-box">
      <image class="search-icon" src="/images/icon_search.svg" mode="aspectFit"/>
      <input class="search-input" placeholder="搜索订单ID/介绍/昵称/接单员ID/拼多多订单号" value="{{searchKeyword}}" bindinput="onSearchInput" bindconfirm="onSearchConfirm" confirm-type="search"/>
      <view class="search-clear" wx:if="{{searchKeyword}}" bindtap="clearSearch"><text>✕</text></view>
    </view>
  </view>

  <!-- 时间段筛选 -->
  <view class="time-filter-row">
    <picker mode="date" value="{{timeStart}}" bindchange="onTimeStartChange">
      <view class="time-pill {{timeStart ? 'time-pill--active' : ''}}">{{timeStart || '开始日期'}}</view>
    </picker>
    <text class="time-sep">至</text>
    <picker mode="date" value="{{timeEnd}}" bindchange="onTimeEndChange">
      <view class="time-pill {{timeEnd ? 'time-pill--active' : ''}}">{{timeEnd || '结束日期'}}</view>
    </picker>
    <view class="time-clear" wx:if="{{timeStart || timeEnd}}" bindtap="clearTimeFilter">清除</view>
  </view>
  <view class="time-quick-row">
    <view class="time-quick-chip" data-days="0" bindtap="pickQuickRange">全部</view>
    <view class="time-quick-chip" data-days="1" bindtap="pickQuickRange">今天</view>
    <view class="time-quick-chip" data-days="7" bindtap="pickQuickRange">近7天</view>
    <view class="time-quick-chip" data-days="30" bindtap="pickQuickRange">近30天</view>
  </view>

  <view class="staff-filter-row" wx:if="{{staffList.length > 0}}">
    <picker mode="selector" range="{{staffList}}" range-key="nickname" bindchange="onStaffFilterChange">
      <view class="staff-filter-pill">{{selectedStaffLabel}}</view>
    </picker>
    <view wx:if="{{selectedStaffMemberId}}" class="staff-filter-clear" bindtap="clearStaffFilter">清除</view>
  </view>

  <!-- 待结算数量提示条（保留原功能） -->
  <view class="sj-pending-tip" wx:if="{{pendingCount > 0}}">
    <text class="sj-pending-icon"></text>
    <text class="sj-pending-text">待结算订单</text>
    <view class="sj-pending-badge">{{pendingCount}}</view>
  </view>

  <!-- 主体：左右布局 -->
  <view class="main-container">
    <!-- 左侧状态栏（固定） -->
    <view class="left-status">
      <view class="sidebar-stats" wx:if="{{canViewFinance}}">
        <text class="sb-line">派单 {{orderStats.dispatch_count}} / ¥{{orderStats.dispatch_amount}}</text>
        <text class="sb-line">成交 {{orderStats.completed_count}} / ¥{{orderStats.completed_amount}}</text>
        <text class="sb-line">退款 {{orderStats.refund_count}} / ¥{{orderStats.refund_amount}}</text>
        <text class="sb-line accent">待结 {{orderStats.pending_count}} / ¥{{orderStats.pending_amount}}</text>
      </view>
      <block wx:for="{{statusList}}" wx:key="key">
        <view class="status-item {{currentStatusKey == item.key ? 'status-active' : ''}}" data-key="{{item.key}}" bindtap="switchStatus">
          <text class="status-name">{{item.name}}</text>
          <!-- 结算中状态旁边显示红色数字（保留原功能） -->
          <view class="status-dot" wx:if="{{currentStatusKey == item.key}}"></view>
          <view wx:if="{{item.key === 'jiesuanzhong' && pendingCount > 0}}" class="sj-status-badge">{{pendingCount}}</view>
        </view>
      </block>
    </view>

    <!-- 右侧包裹：撑出右边距，里面是 scroll-view -->
    <view class="right-wrapper">
      <scroll-view
        class="right-list"
        scroll-y enhanced show-scrollbar="{{false}}"
        scroll-top="{{listScrollTop}}"
        bindscroll="onListScroll"
        refresher-enabled="{{true}}"
        refresher-threshold="80"
        refresher-default-style="black"
        refresher-background="#fff8e1"
        refresher-triggered="{{scrollViewRefreshing}}"
        bindrefresherrefresh="onPullDownRefresh"
        bindscrolltolower="onReachBottom"
        lower-threshold="50"
      >
        <view class="refresher-slot" slot="refresher">
          <text wx:if="{{scrollViewRefreshing}}" class="refreshing-text">⚡ 正在刷新...</text>
          <text wx:else class="pull-text">▼ 下拉刷新</text>
        </view>

        <!-- 内容容器 -->
        <view class="list-inner">
          <!-- 加载中 -->
          <view wx:if="{{isLoading && currentList.length === 0}}" class="loading-state">
            <view class="loading-spinner"></view>
            <text class="loading-tip">加载订单中...</text>
          </view>

          <!-- 空状态 -->
          <view wx:elif="{{!isLoading && currentList.length === 0}}" class="empty-state">
            <image class="empty-img" src="/images/empty-order.png" mode="aspectFit"/>
            <text class="empty-text">暂无订单</text>
            <text class="empty-subtext">快去派发订单吧</text>
          </view>

          <!-- 订单卡片：逍遥梦 ui-preview 布局 -->
          <view class="sj-order-list">
            <block wx:for="{{currentList}}" wx:key="dingdan_id">
              <!-- 优质商家金牌卡 -->
              <view wx:if="{{item.shangjia_youzhi}}" class="xym-order-item gold-card" data-item="{{item}}" bindtap="goToSjDingdanXiangqing">
                <view class="gold-head flexb">
                  <view class="kehuduan-banner-wrap">
                    <image class="gold-banner" src="{{goldBannerUrl}}" mode="widthFix"/>
                  </view>
                </view>
                <view class="gold-body-wrap">
                  <view class="order-con gold-inner">
                    <view wx:if="{{item.isZhiding}}" class="zhiding-strip">
                      <view class="zhiding-strip-top myflex">
                        <text class="zhiding-label">指定</text>
                        <image wx:if="{{item.zhiding_avatar_full}}" class="zhiding-avatar" src="{{item.zhiding_avatar_full}}" mode="aspectFill"/>
                        <text class="zhiding-name">{{item.zhiding_nicheng || '指定接单员'}}</text>
                      </view>
                      <view wx:if="{{item.dashou_biaoqian.length > 0 || item.zhiding_identity_biaoqian.length > 0}}" class="zhiding-strip-tags">
                        <chenghao-tag wx:for="{{item.dashou_biaoqian}}" wx:for-item="tag" wx:key="id" mingcheng="{{tag.mingcheng}}" texiaoJson="{{tag.texiao_json}}" />
                        <chenghao-tag wx:for="{{item.zhiding_identity_biaoqian}}" wx:for-item="tag" wx:key="id" mingcheng="{{tag.mingcheng}}" texiaoJson="{{tag.texiao_json}}" />
                      </view>
                    </view>
                    <view class="order-row myflex">
                      <image class="o-logo" src="{{item.leixing_icon_url}}" mode="aspectFill"/>
                      <view class="o-col">
                        <view class="o-goods line2">{{item.jieshao || '暂无介绍'}}</view>
                        <view class="tag-row myflex">
                          <text class="tag-pill tag-youzhi">优质商家</text>
                        </view>
                      </view>
                    </view>
                    <view class="reward-badge normal-reward">
                      <text class="reward-yen sm">￥</text>
                      <text class="reward-num dark">{{item.jine || '0.00'}}</text>
                    </view>
                    <view class="remark-block dark">
                      <text class="remark-label dark-t">商家备注：</text>{{item.beizhu || '暂无'}}
                    </view>
                    <view wx:if="{{item.shangjia_biaoqian.length || item.shangjia_identity_biaoqian.length || item.xuqiu_biaoqian.length}}" class="merchant-tags-container">
                      <scroll-view wx:if="{{item.shangjia_biaoqian.length}}" class="biaoqian-inline-scroll" scroll-x>
                        <chenghao-tag wx:for="{{item.shangjia_biaoqian}}" wx:for-item="tag" wx:key="id" mingcheng="{{tag.mingcheng}}" texiaoJson="{{tag.texiao_json}}" />
                      </scroll-view>
                      <scroll-view wx:if="{{item.shangjia_identity_biaoqian.length}}" class="biaoqian-inline-scroll" scroll-x style="margin-top:8rpx">
                        <chenghao-tag wx:for="{{item.shangjia_identity_biaoqian}}" wx:for-item="tag" wx:key="id" mingcheng="{{tag.mingcheng}}" texiaoJson="{{tag.texiao_json}}" />
                      </scroll-view>
                      <scroll-view wx:if="{{item.xuqiu_biaoqian.length}}" class="biaoqian-inline-scroll" scroll-x style="margin-top:8rpx">
                        <chenghao-tag wx:for="{{item.xuqiu_biaoqian}}" wx:for-item="tag" wx:key="id" mingcheng="{{tag.mingcheng}}" texiaoJson="{{tag.texiao_json}}" />
                      </scroll-view>
                    </view>
                    <view class="merchant-strip myflex">
                      <image class="m-avatar" src="{{item.sj_avatar_full}}" mode="aspectFill"/>
                      <view class="m-info">
                        <view class="m-name light-t">{{item.sjnicheng || '未知商家'}}</view>
                        <view class="m-sn light-sub">ID:{{item.shangjia_id}}  发布于 {{item.creat_time}}</view>
                      </view>
                    </view>
                    <view class="o-foot flexb">
                      <text class="o-amt-grey">订单金额 ￥{{item.jine || '0.00'}}</text>
                      <view class="sj-status-pill" style="color:{{item.zhuangtaiColor}}">{{item.zhuangtaiZh}}</view>
                    </view>
                  </view>
                </view>
              </view>

              <!-- 普通商家订单 -->
              <view wx:else class="xym-order-item normal-card" data-item="{{item}}" bindtap="goToSjDingdanXiangqing">
                <view class="normal-body-wrap">
                  <view class="order-con">
                    <view wx:if="{{item.isZhiding}}" class="zhiding-strip">
                      <view class="zhiding-strip-top myflex">
                        <text class="zhiding-label">指定</text>
                        <image wx:if="{{item.zhiding_avatar_full}}" class="zhiding-avatar" src="{{item.zhiding_avatar_full}}" mode="aspectFill"/>
                        <text class="zhiding-name">{{item.zhiding_nicheng || '指定接单员'}}</text>
                      </view>
                      <view wx:if="{{item.dashou_biaoqian.length > 0 || item.zhiding_identity_biaoqian.length > 0}}" class="zhiding-strip-tags">
                        <chenghao-tag wx:for="{{item.dashou_biaoqian}}" wx:for-item="tag" wx:key="id" mingcheng="{{tag.mingcheng}}" texiaoJson="{{tag.texiao_json}}" />
                        <chenghao-tag wx:for="{{item.zhiding_identity_biaoqian}}" wx:for-item="tag" wx:key="id" mingcheng="{{tag.mingcheng}}" texiaoJson="{{tag.texiao_json}}" />
                      </view>
                    </view>
                    <view class="order-row myflex">
                      <image class="o-logo" src="{{item.leixing_icon_url}}" mode="aspectFill"/>
                      <view class="o-col">
                        <view class="o-goods line2">{{item.jieshao || '暂无介绍'}}</view>
                      </view>
                    </view>
                    <view class="reward-badge normal-reward">
                      <text class="reward-yen sm">￥</text>
                      <text class="reward-num dark">{{item.jine || '0.00'}}</text>
                    </view>
                    <view class="remark-block dark">
                      <text class="remark-label dark-t">商家备注：</text>{{item.beizhu || '暂无'}}
                    </view>
                    <view wx:if="{{item.shangjia_biaoqian.length || item.shangjia_identity_biaoqian.length || item.xuqiu_biaoqian.length}}" class="merchant-tags-container">
                      <scroll-view wx:if="{{item.shangjia_biaoqian.length}}" class="biaoqian-inline-scroll" scroll-x>
                        <chenghao-tag wx:for="{{item.shangjia_biaoqian}}" wx:for-item="tag" wx:key="id" mingcheng="{{tag.mingcheng}}" texiaoJson="{{tag.texiao_json}}" />
                      </scroll-view>
                      <scroll-view wx:if="{{item.shangjia_identity_biaoqian.length}}" class="biaoqian-inline-scroll" scroll-x style="margin-top:8rpx">
                        <chenghao-tag wx:for="{{item.shangjia_identity_biaoqian}}" wx:for-item="tag" wx:key="id" mingcheng="{{tag.mingcheng}}" texiaoJson="{{tag.texiao_json}}" />
                      </scroll-view>
                      <scroll-view wx:if="{{item.xuqiu_biaoqian.length}}" class="biaoqian-inline-scroll" scroll-x style="margin-top:8rpx">
                        <chenghao-tag wx:for="{{item.xuqiu_biaoqian}}" wx:for-item="tag" wx:key="id" mingcheng="{{tag.mingcheng}}" texiaoJson="{{tag.texiao_json}}" />
                      </scroll-view>
                    </view>
                    <view class="merchant-strip myflex">
                      <image class="m-avatar" src="{{item.sj_avatar_full}}" mode="aspectFill"/>
                      <view class="m-info">
                        <view class="m-name light-t">{{item.sjnicheng || '未知商家'}}</view>
                        <view class="m-sn light-sub">ID:{{item.shangjia_id}}  发布于 {{item.creat_time}}</view>
                      </view>
                    </view>
                    <view class="o-foot flexb">
                      <text class="o-amt-grey">订单金额 ￥{{item.jine || '0.00'}}</text>
                      <view class="sj-status-pill" style="color:{{item.zhuangtaiColor}}">{{item.zhuangtaiZh}}</view>
                    </view>
                  </view>
                </view>
              </view>
            </block>
          </view>

          <!-- 上拉加载更多提示 -->
          <view class="load-more" wx:if="{{hasMore && currentList.length > 0 && !isLoadingMore}}">
            <text class="load-more-text">上拉加载更多</text>
          </view>

          <!-- 加载中 -->
          <view class="loading-more-state" wx:if="{{isLoadingMore}}">
            <view class="mini-spinner"></view>
            <text>加载中...</text>
          </view>

          <!-- 🆕 手动加载更多按钮 -->
          <view class="manual-load-more" wx:if="{{hasMore && currentList.length > 0 && !isLoadingMore}}">
            <button class="load-more-btn" bindtap="onLoadMoreTap" loading="{{false}}">点击加载更多</button>
          </view>

          <!-- 没有更多 -->
          <view class="no-more" wx:if="{{!hasMore && currentList.length > 0}}">
            <text>—— 没有更多了 ——</text>
          </view>
        </view>
      </scroll-view>
    </view>
  </view>
</view>
<global-notification id="global-notification" />
<tab-bar />