laundry/pages/tabber/order/index.wxml

<van-tabs  title-active-color="#191C27" title-inactive-color="#666666" color="#4699FF" line-width="30" sticky bind:click="onClick">
    <van-tab title="全部">
        <view class="itemBoxs" wx:for="{{orderList}}" wx:key="index">
            <view class="titBoxs b-bottom  flex ju-b">
                <view class="le">{{item.order_type_name}}</view>
                <!-- or skyBlue or gray -->
                <view class="lr orange">{{item.status_name}}</view>
                <!-- <view class="lr gray" wx:if="{{item.type == 2}}">已取消</view> -->
            </view>
            <view class="contioner">
                <view class="messageBoxs">
                    <view class="tips">当前状态：{{item.logistics_status_name}}</view>
                    <view class="time">{{item.created_at}}</view>
                </view>

                <view class="centerBoxs flex ju-b"  bindtap="detail" data-no="{{item.order_no}}">
                    <scroll-view scroll-x>
                        <view wx:if="{{item.order_info.length < 2}}">
                            <view class="flex ju-b" wx:for="{{item.order_info}}" wx:for-item="v" wx:for-index="idx" wx:key="index">
                                <view>
                                    <view class="le flex">
                                        <image src="{{v.good.thumb?i.good.thumb:'/image/icon/dayiwaitao.png'}}" class="clothes"></image>
                                        <view class="name">{{v.good.title}}</view>
                                    </view>
                                </view>
                            </view>
                        </view>
                        <view class="flex" wx:else>
                            <view class="imgBoxs" wx:for="{{item.order_info}}" wx:for-item="v" wx:for-index="idx" wx:key="">
                                <image src="{{v.good.thumb?item.good.thumb:'/image/order/houwaitao.png'}}" class="clothes"></image>
                                <view class="nums">共{{v.stock}}件</view>
                            </view>
                        </view>
                    </scroll-view>
                    <view class="lr {{item.numList.length < 2 ? '' : 'showModel'}}">
                        <view class="price"><text class="small">￥</text>{{item.total_price}}</view>
                        <view class="num">共{{item.stock}}件</view>
                    </view>
                </view>

                <view class="footerBoxs flex ju-e" wx:if="{{item.status == 1}}">
                    <view class="btn border" bindtap="closOrder" data-oid="{{item.order_no}}">取消订单</view>
                    <view class="btn bg" bindtap="pay" data-oid="{{item.order_no}}">支付</view>
                </view>

                <view class="footerBoxs flex ju-e" wx:if="{{item.status != 1}}" data-no="{{item.order_no}}" bindtap="toDetail">
                    <view class="btn border">查看详情</view>
                </view>
            </view>
        </view>
    </van-tab>
    <van-tab title="未支付"> <view class="itemBoxs" wx:for="{{orderList}}" wx:key="index">
            <view class="titBoxs b-bottom  flex ju-b">
                <view class="le">{{item.order_type_name}}</view>
                <!-- or skyBlue or gray -->
                <view class="lr orange">{{item.status_name}}</view>
                <!-- <view class="lr gray" wx:if="{{item.type == 2}}">已取消</view> -->
            </view>
            <view class="contioner">
                <view class="messageBoxs">
                    <view class="tips">当前状态：{{item.logistics_status_name}}</view>
                    <view class="time">{{item.created_at}}</view>
                </view>

                <view class="centerBoxs flex ju-b"  bindtap="toDetail" data-no="{{item.order_no}}">
                    <scroll-view scroll-x>
                        <view wx:if="{{item.order_info.length < 2}}">
                            <view class="flex ju-b" wx:for="{{item.order_info}}" wx:for-item="v" wx:for-index="idxx" wx:key="idxx">
                                <view>
                                    <view class="le flex">
                                        <image src="{{v.good.thumb?i.good.thumb:'/image/icon/dayiwaitao.png'}}" class="clothes"></image>
                                        <view class="name">{{v.good.title}}</view>
                                    </view>
                                </view>
                            </view>
                        </view>
                        <view class="flex" wx:else>
                            <view class="imgBoxs" wx:for="{{item.order_info}}" wx:for-item="v" wx:for-index="idx" wx:key="">
                                <image src="{{v.good.thumb?item.good.thumb:'/image/order/houwaitao.png'}}" class="clothes"></image>
                                <view class="nums">共{{v.stock}}件</view>
                            </view>
                        </view>
                    </scroll-view>
                    <view class="lr {{item.numList.length < 2 ? '' : 'showModel'}}">
                        <view class="price"><text class="small">￥</text>{{item.total_price}}</view>
                        <view class="num">共{{item.stock}}件</view>
                    </view>
                </view>

                <view class="footerBoxs flex ju-e" wx:if="{{item.status == 1}}">
                    <view class="btn border" bindtap="closOrder" data-oid="{{item.order_no}}">取消订单</view>
                    <view class="btn bg" bindtap="pay" data-oid="{{item.order_no}}">支付</view>
                </view>

                <view class="footerBoxs flex ju-e" wx:if="{{item.status != 1}}" data-no="{{item.order_no}}" bindtap="toDetail">
                    <view class="btn border">查看详情</view>
                </view>
            </view>
        </view></van-tab>
    <van-tab title="待服务"> <view class="itemBoxs" wx:for="{{orderList}}" wx:key="index">
            <view class="titBoxs b-bottom  flex ju-b">
                <view class="le">{{item.order_type_name}}</view>
                <!-- or skyBlue or gray -->
                <view class="lr orange">{{item.status_name}}</view>
                <!-- <view class="lr gray" wx:if="{{item.type == 2}}">已取消</view> -->
            </view>
            <view class="contioner">
                <view class="messageBoxs">
                    <view class="tips">当前状态：{{item.logistics_status_name}}</view>
                    <view class="time">{{item.created_at}}</view>
                </view>

                <view class="centerBoxs flex ju-b" bindtap="detail"  data-no="{{item.order_no}}">
                    <scroll-view scroll-x>
                        <view wx:if="{{item.order_info.length < 2}}">
                            <view class="flex ju-b" wx:for="{{item.order_info}}" wx:for-item="v" wx:for-index="idx" wx:key="idx">
                                <view>
                                    <view class="le flex">
                                        <image src="{{v.good.thumb?i.good.thumb:'/image/icon/dayiwaitao.png'}}" class="clothes"></image>
                                        <view class="name">{{v.good.title}}</view>
                                    </view>
                                </view>
                            </view>
                        </view>
                        <view class="flex" wx:else>
                            <view class="imgBoxs" wx:for="{{item.order_info}}" wx:for-item="v" wx:for-index="idx" wx:key="">
                                <image src="{{v.good.thumb?item.good.thumb:'/image/order/houwaitao.png'}}" class="clothes"></image>
                                <view class="nums">共{{v.stock}}件</view>
                            </view>
                        </view>
                    </scroll-view>
                    <view class="lr {{item.numList.length < 2 ? '' : 'showModel'}}">
                        <view class="price"><text class="small">￥</text>{{item.total_price}}</view>
                        <view class="num">共{{item.stock}}件</view>
                    </view>
                </view>

                <view class="footerBoxs flex ju-e" wx:if="{{item.status == 1}}">
                    <view class="btn border" bindtap="closOrder" data-oid="{{item.order_no}}">取消订单</view>
                    <view class="btn bg" bindtap="pay" data-oid="{{item.order_no}}">支付</view>
                </view>

                <view class="footerBoxs flex ju-e" wx:if="{{item.status != 1}}" data-no="{{item.order_no}}" bindtap="toDetail">
                    <view class="btn border">查看详情</view>
                </view>
            </view>
        </view></van-tab>
    <van-tab title="服务中"> <view class="itemBoxs" wx:for="{{orderList}}" wx:key="index">
            <view class="titBoxs b-bottom  flex ju-b">
                <view class="le">{{item.order_type_name}}</view>
                <!-- or skyBlue or gray -->
                <view class="lr orange">{{item.status_name}}</view>
                <!-- <view class="lr gray" wx:if="{{item.type == 2}}">已取消</view> -->
            </view>
            <view class="contioner">
                <view class="messageBoxs">
                    <view class="tips">当前状态：{{item.logistics_status_name}}</view>
                    <view class="time">{{item.created_at}}</view>
                </view>

                <view class="centerBoxs flex ju-b"  bindtap="detail" data-no="{{item.order_info.orde_no}}">
                    <scroll-view scroll-x>
                        <view wx:if="{{item.order_info.length < 2}}">
                            <view class="flex ju-b" wx:for="{{item.order_info}}" wx:for-item="v" wx:for-index="idsx" wx:key="idsx">
                                <view>
                                    <view class="le flex">
                                        <image src="{{v.good.thumb?i.good.thumb:'/image/icon/dayiwaitao.png'}}" class="clothes"></image>
                                        <view class="name">{{v.good.title}}</view>
                                    </view>
                                </view>
                            </view>
                        </view>
                        <view class="flex" wx:else>
                            <view class="imgBoxs" wx:for="{{item.order_info}}" wx:for-item="v" wx:for-index="idx" wx:key="">
                                <image src="{{v.good.thumb?item.good.thumb:'/image/order/houwaitao.png'}}" class="clothes"></image>
                                <view class="nums">共{{v.stock}}件</view>
                            </view>
                        </view>
                    </scroll-view>
                    <view class="lr {{item.numList.length < 2 ? '' : 'showModel'}}">
                        <view class="price"><text class="small">￥</text>{{item.total_price}}</view>
                        <view class="num">共{{item.stock}}件</view>
                    </view>
                </view>

                <view class="footerBoxs flex ju-e" wx:if="{{item.status == 1}}">
                    <view class="btn border" bindtap="closOrder" data-oid="{{item.order_no}}">取消订单</view>
                    <view class="btn bg" bindtap="pay" data-oid="{{item.order_no}}">支付</view>
                </view>

                <view class="footerBoxs flex ju-e" wx:if="{{item.status != 1}}" data-no="{{item.order_no}}" bindtap="toDetail">
                    <view class="btn border">查看详情</view>
                </view>
            </view>
        </view></van-tab>
    <van-tab title="已完成"> <view class="itemBoxs" bindtap="toDetail" data-no="{{item.order_no}}" wx:for="{{orderList}}" wx:key="index">
            <view class="titBoxs b-bottom  flex ju-b">
                <view class="le">{{item.order_type_name}}</view>
                <!-- or skyBlue or gray -->
                <view class="lr orange">{{item.status_name}}</view>
                <!-- <view class="lr gray" wx:if="{{item.type == 2}}">已取消</view> -->
            </view>
            <view class="contioner">
                <view class="messageBoxs">
                    <view class="tips">当前状态：{{item.logistics_status_name}}</view>
                    <view class="time">{{item.created_at}}</view>
                </view>

                <view class="centerBoxs flex ju-b">
                    <scroll-view scroll-x>
                        <view wx:if="{{item.order_info.length < 2}}">
                            <view class="flex ju-b" wx:for="{{item.order_info}}" wx:for-item="v" wx:for-index="indx" wx:key="indx">
                                <view>
                                    <view class="le flex">
                                        <image src="{{v.good.thumb?i.good.thumb:'/image/icon/dayiwaitao.png'}}" class="clothes"></image>
                                        <view class="name">{{v.good.title}}</view>
                                    </view>
                                </view>
                            </view>
                        </view>
                        <view class="flex" wx:else>
                            <view class="imgBoxs" wx:for="{{item.order_info}}" wx:for-item="v" wx:for-index="idx" wx:key="">
                                <image src="{{v.good.thumb?item.good.thumb:'/image/order/houwaitao.png'}}" class="clothes"></image>
                                <view class="nums">共{{v.stock}}件</view>
                            </view>
                        </view>
                    </scroll-view>
                    <view class="lr {{item.numList.length < 2 ? '' : 'showModel'}}">
                        <view class="price"><text class="small">￥</text>{{item.total_price}}</view>
                        <view class="num">共{{item.stock}}件</view>
                    </view>
                </view>

                <view class="footerBoxs flex ju-e" wx:if="{{item.status == 1}}">
                    <view class="btn border" bindtap="closOrder" data-oid="{{item.order_no}}">取消订单</view>
                        <view class="btn bg" bindtap="pay" data-oid="{{item.order_no}}">支付</view>
                </view>

                <view class="footerBoxs flex ju-e" wx:if="{{item.status != 1}}" data-no="{{item.order_no}}" bindtap="toDetail">
                    <view class="btn border">查看详情</view>
                </view>
            </view>
        </view></van-tab>
</van-tabs>

<van-empty wx:if="{{orderList.length == 0}}" class="custom-image" image="/image/order/no-order.png" description="暂无订单" />

<van-dialog id="van-dialog" confirm-button-color="#4699FF" />