Files
a_long/miniprogram/pages/jiedanchi/jiedanchi.wxml
2026-06-27 01:26:11 +08:00

263 lines
11 KiB
Plaintext

<!--pages/qiangdan/qiangdan.wxml-->
<view class="qiangdan-page">
<!-- 授权提示页(未开启打手功能时显示) -->
<view class="unauthorized-container" wx:if="{{showUnauthorized}}">
<view class="unauthorized-card">
<view class="card-glow"></view>
<view class="card-content-unauth">
<view class="icon-lock">🔒</view>
<text class="title">功能未开启</text>
<text class="message">{{unauthorizedMsg}}</text>
<text class="description">请先注册为服务者,即可使用抢单功能</text>
<view class="btn-register" bindtap="goToDashouRegister">
<text class="btn-text">立即注册</text>
<view class="btn-shine"></view>
</view>
</view>
</view>
</view>
<!-- 正常内容(授权后显示) -->
<block wx:else>
<!-- 顶部区域:商品类型选择 -->
<view class="leixing-quyu">
<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"
>
<!-- 选中态的光晕特效 -->
<view wx:if="{{xuanzhongLeixingId == item.id}}" class="guangyun-effect"></view>
<image
class="leixing-tupian"
src="{{item.full_tupian_url}}"
mode="aspectFill"
/>
<text class="leixing-jieshao">{{item.jieshao}}</text>
</view>
</block>
</view>
</scroll-view>
</view>
<!-- 分割线 -->
<view class="fenge-xian"></view>
<!-- 订单列表容器 -->
<view class="dingdan-container">
<scroll-view
class="dingdan-scroll-view"
scroll-y
enhanced
show-scrollbar="{{false}}"
refresher-enabled="{{xuanzhongLeixingId != null}}"
refresher-threshold="80"
refresher-default-style="black"
refresher-background="#f5f5f5"
refresher-triggered="{{scrollViewRefreshing}}"
bindrefresherrefresh="onPullDownRefresh"
bindscrolltolower="onReachBottom"
>
<!-- 下拉刷新区域 -->
<view class="refresher-container" slot="refresher">
<text wx:if="{{scrollViewRefreshing}}" class="refreshing-text">正在刷新...</text>
<text wx:else class="pull-down-text">下拉刷新订单</text>
</view>
<!-- 订单列表 -->
<view class="dingdan-list">
<!-- 状态提示 -->
<view wx:if="{{!xuanzhongLeixingId}}" class="empty-tip">
<image src="/images/icon_select.png" class="tip-icon"></image>
<text class="tip-text">请先选择上方订单类型</text>
</view>
<view wx:elif="{{dingdanList.length === 0 && !isLoading}}" class="empty-tip">
<image src="/images/icon_empty_order.png" class="tip-icon"></image>
<text class="tip-text">当前类型暂无待抢订单</text>
</view>
<!-- 订单卡片列表 -->
<block wx:for="{{dingdanList}}" wx:key="dingdan_id">
<!-- 平台订单卡片 (pingtai == 1) -->
<view
wx:if="{{item.isPingtai}}"
class="dingdan-card pingtai-card"
data-item="{{item}}"
>
<!-- 顶部信息区 -->
<view class="card-top">
<text class="creat-time">{{item.creat_time}}</text>
<view class="top-line"></view>
<text class="pingtai-tag">平台订单</text>
</view>
<!-- 指定单标识行 - 新增头像和昵称 -->
<view wx:if="{{item.isZhiding}}" class="zhiding-row">
<text class="zhiding-icon">指定</text>
<image
wx:if="{{item.zhiding_avatar_full}}"
class="zhiding-avatar"
src="{{item.zhiding_avatar_full}}"
mode="aspectFill"
/>
<text class="zhiding-nicheng">{{item.zhiding_nicheng || '指定打手'}}</text>
<text class="zhiding-uid">UID: {{item.zhiding_uid || '未知'}}</text>
</view>
<!-- 内容区:圆形图片 + 介绍 -->
<view class="card-content">
<image
class="neirong-tupian"
src="{{item.full_tupian_url}}"
mode="aspectFill"
/>
<view
class="jieshao-box {{item.jieshao && item.jieshao.length > 60 ? 'jieshao-ellipsis' : ''}}"
data-type="jieshao"
data-content="{{item.jieshao}}"
bindtap="onViewDetail"
>
<text class="jieshao-label">介绍:</text>
<text class="jieshao-text">{{item.jieshao || '暂无介绍'}}</text>
<text wx:if="{{item.jieshao && item.jieshao.length > 60}}" class="view-more">[点击查看]</text>
</view>
</view>
<!-- 备注区 -->
<view
wx:if="{{item.beizhu}}"
class="beizhu-box {{item.beizhu.length > 40 ? 'beizhu-ellipsis' : ''}}"
data-type="beizhu"
data-content="{{item.beizhu}}"
bindtap="onViewDetail"
>
<text class="beizhu-label">备注:</text>
<text class="beizhu-text">{{item.beizhu}}</text>
<text wx:if="{{item.beizhu.length > 40}}" class="view-more">[点击查看]</text>
</view>
<!-- 底部:分佣 + 抢单按钮 -->
<view class="card-bottom">
<view class="fenyong-box">
<text class="fenyong-icon">💰</text>
<text class="fenyong-text">分佣</text>
<text class="fenyong-price">{{item.dashou_fencheng || 0}}</text>
<text class="fenyong-unit">元</text>
</view>
<view
class="qiangdan-btn pingtai-btn"
data-item="{{item}}"
bindtap="onQiangdanTap"
>
<text class="btn-text">立即抢单</text>
<view class="btn-shine"></view>
</view>
</view>
</view>
<!-- 商家订单卡片 (pingtai == 2) -->
<view
wx:elif="{{item.isShangjia}}"
class="dingdan-card shangjia-card"
data-item="{{item}}"
>
<!-- 顶部信息区 -->
<view class="card-top">
<text class="creat-time">{{item.creat_time}}</text>
<view class="top-line"></view>
<text class="pingtai-tag">商家发单</text>
</view>
<!-- 指定单标识行 - 新增头像和昵称 -->
<view wx:if="{{item.isZhiding}}" class="zhiding-row">
<text class="zhiding-icon">指定</text>
<image
wx:if="{{item.zhiding_avatar_full}}"
class="zhiding-avatar"
src="{{item.zhiding_avatar_full}}"
mode="aspectFill"
/>
<text class="zhiding-nicheng">{{item.zhiding_nicheng || '指定打手'}}</text>
<text class="zhiding-uid">UID: {{item.zhiding_uid || '未知'}}</text>
</view>
<!-- 内容区:圆形商家头像 + 昵称 -->
<view class="shangjia-info">
<image
class="shangjia-touxiang"
src="{{item.full_tupian_url}}"
mode="aspectFill"
/>
<text class="shangjia-nicheng">{{item.sjnicheng || '未知商家'}}</text>
</view>
<!-- 介绍区 -->
<view
class="shangjia-jieshao {{item.jieshao && item.jieshao.length > 50 ? 'jieshao-ellipsis' : ''}}"
data-type="jieshao"
data-content="{{item.jieshao}}"
bindtap="onViewDetail"
>
<text class="jieshao-label">订单介绍:</text>
<text class="jieshao-text">{{item.jieshao || '暂无介绍'}}</text>
<text wx:if="{{item.jieshao && item.jieshao.length > 50}}" class="view-more">[点击查看]</text>
</view>
<!-- 备注区 -->
<view
wx:if="{{item.beizhu}}"
class="shangjia-beizhu {{item.beizhu.length > 30 ? 'beizhu-ellipsis' : ''}}"
data-type="beizhu"
data-content="{{item.beizhu}}"
bindtap="onViewDetail"
>
<text class="beizhu-label">商家备注:</text>
<text class="beizhu-text">{{item.beizhu}}</text>
<text wx:if="{{item.beizhu.length > 30}}" class="view-more">[点击查看]</text>
</view>
<!-- 底部:分佣 + 抢单按钮 -->
<view class="card-bottom">
<view class="fenyong-box">
<text class="fenyong-icon">💰</text>
<text class="fenyong-text">分佣</text>
<text class="fenyong-price">{{item.dashou_fencheng || 0}}</text>
<text class="fenyong-unit">元</text>
</view>
<view
class="qiangdan-btn shangjia-btn"
data-item="{{item}}"
bindtap="onQiangdanTap"
>
<text class="btn-text">立即抢单</text>
<view class="btn-shine"></view>
</view>
</view>
</view>
</block>
<!-- 加载更多状态 -->
<view wx:if="{{isLoadingMore && dingdanList.length > 0}}" class="loading-more">
<text class="loading-text">加载更多订单中...</text>
</view>
<view wx:if="{{!hasMore && dingdanList.length > 0}}" class="no-more">
<text class="no-more-text">没有更多订单了</text>
</view>
</view>
</scroll-view>
<!-- 全局加载遮罩 -->
<view wx:if="{{isLoading && dingdanList.length === 0 && xuanzhongLeixingId}}" class="loading-mask">
<view class="loading-spinner"></view>
<text class="loading-mask-text">订单加载中...</text>
</view>
</view>
</block>
<global-notification id="global-notification" />
<popup-notice id="popupNotice" />
</view>