微信小店联盟带货小程序

commission.wxml 2.6KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. <!--pages/distribution/commission.wxml-->
  2. <view class="container">
  3. <!-- 佣金概览卡片 -->
  4. <view class="overview-card">
  5. <view class="total-section">
  6. <view class="label">累计佣金(元)</view>
  7. <view class="amount">{{overview.totalAmount}}</view>
  8. </view>
  9. <view class="stats-row">
  10. <view class="stat-item">
  11. <text class="value">{{overview.todayAmount}}</text>
  12. <text class="label">今日佣金</text>
  13. </view>
  14. <view class="stat-item">
  15. <text class="value">{{overview.monthAmount}}</text>
  16. <text class="label">本月佣金</text>
  17. </view>
  18. <view class="stat-item">
  19. <text class="value">{{overview.pendingAmount}}</text>
  20. <text class="label">待结算</text>
  21. </view>
  22. </view>
  23. </view>
  24. <!-- 明细列表标签页 -->
  25. <view class="tabs">
  26. <view class="tab {{currentTab === 'all' ? 'active' : ''}}" bindtap="switchTab" data-tab="all">全部</view>
  27. <view class="tab {{currentTab === 'pending' ? 'active' : ''}}" bindtap="switchTab" data-tab="pending">待结算</view>
  28. <view class="tab {{currentTab === 'settled' ? 'active' : ''}}" bindtap="switchTab" data-tab="settled">已结算</view>
  29. </view>
  30. <!-- 佣金明细列表 -->
  31. <scroll-view scroll-y="true" class="commission-list" bindscrolltolower="loadMore">
  32. <view class="commission-item" wx:for="{{commissionList}}" wx:key="id">
  33. <view class="commission-info">
  34. <view class="main-info">
  35. <view class="title">{{item.title}}</view>
  36. <view class="time">{{item.createTime}}</view>
  37. </view>
  38. <view class="amount {{item.status === 'pending' ? 'pending' : ''}}">
  39. {{item.amount > 0 ? '+' : ''}}{{item.amount}}
  40. </view>
  41. </view>
  42. <view class="detail-info">
  43. <view class="detail-item">
  44. <text class="label">订单编号:</text>
  45. <text class="value">{{item.orderNo}}</text>
  46. </view>
  47. <view class="detail-item">
  48. <text class="label">结算状态:</text>
  49. <text class="value {{item.status === 'pending' ? 'pending-text' : 'settled-text'}}">
  50. {{item.status === 'pending' ? '待结算' : '已结算'}}
  51. </text>
  52. </view>
  53. </view>
  54. </view>
  55. <!-- 加载更多 -->
  56. <view class="loading" wx:if="{{loading}}">
  57. <text class="loading-text">加载中...</text>
  58. </view>
  59. <!-- 无数据提示 -->
  60. <view class="empty" wx:if="{{commissionList.length === 0}}">
  61. <image class="empty-icon" src="/static/images/empty-commission.png" mode="aspectFit"></image>
  62. <text class="empty-text">暂无佣金记录</text>
  63. </view>
  64. </scroll-view>
  65. </view>