nova-trip/nova-tourism/pages/my/homestay-order/index.wxml

<nav type="back" background-color="{{activeColor}}" title="民宿订单" frontColor="#ffffff" />
<van-tabs class="tabs" active="{{ active }}" bind:change="onChange" color="{{activeColor}}">
    <van-tab title="全部"></van-tab>
    <van-tab title="已付款"></van-tab>
    <van-tab title="已入住"></van-tab>
    <van-tab title="已完成"></van-tab>
</van-tabs>
<scroll-view style="height:calc(100vh - {{navigationBarHeight+ 44}}px);" scroll-y="{{true}}">
    <block wx:if="{{active==0}}">
    <block wx:if="{{list.length==0}}">
                <van-empty description="暂无订单" />
            </block>
        <block wx:for="{{list}}" wx:key="index">
            
            <view class="box">
                <view class="order-number">
                    <view class="number">订单号：{{item.orderNum}}</view>
                    <block wx:if="{{item.status==100}}">
                        <view class="state">已付款</view>
                    </block>
                    <block wx:if="{{item.status==200}}">
                        <view class="state">已入住</view>
                    </block>
                    <block wx:if="{{item.status==500}}">
                        <view class="state">退款审核中</view>
                    </block>
                    <block wx:if="{{item.status==601}}">
                        <view class="state">退款中</view>
                    </block>
                    <block wx:if="{{item.status==602}}">
                        <view class="state">退款失败</view>
                    </block>
                    <block wx:if="{{item.status==700}}">
                        <view class="state">退款成功</view>
                    </block>
                    <block wx:if="{{item.status==800}}">
                        <view class="state">已完成</view>
                    </block>
                </view>
                <view class="order-txt" data-item="{{item}}" catchtap="orderpay">
                    <image class="order-image" src="{{item.room.images[0]}}" />
                    <view class="order-name">
                        <view class="name">{{item.room.name}}</view>
                        <view class="order-price" style="color: {{activeColor}};">￥{{item.room.price}}/晚</view>
                        <view class="order-time">{{item.shopStore.address}}</view>
                    </view>
                </view>
                <view class="order-times">
                    <view class="order-date">
                        <view class="date">{{item.orderTime}}——{{item.Time}}</view>
                        <view class="sky">{{item.day}}晚</view>
                    </view>
                    <view class="price" style="color: {{activeColor}};">￥{{item.price}}</view>
                </view>
                <view class="order-order">
                    <view class="service" data-item="{{item}}" catchtap="phone">联系房东</view>
                    <block wx:if="{{item.status==100}}">
                        <view class="service" data-item="{{item}}" catchtap="replyRefund">
                            申请退款
                        </view>
                    </block>
                    <block wx:if="{{item.status==200}}">
                        <view class="pay" style="background-color: {{activeColor}};color: #ffffff;" data-item="{{item}}" catchtap="evaluation">去评价</view>
                    </block>
                    <block wx:if="{{item.status==100}}">
                        <view class="pay" style="background-color: {{activeColor}};color: #ffffff" data-item="{{item}}" catchtap="orderpay">详情</view>
                    </block>
                </view>
            </view>
        </block>
    </block>
    <block wx:if="{{active==1}}">
     <block wx:if="{{list.length==0}}">
                <van-empty description="暂无订单" />
            </block>
        <block wx:for="{{list}}" wx:key="index">
           
            <view class="box">
                <view class="order-number">
                    <view class="number">订单号：{{item.orderNum}}</view>
                    <view class="state">已付款</view>
                </view>
                <view class="order-txt" data-item="{{item}}" bindtap="orderpay">
                    <image class="order-image" src="{{item.room.images[0]}}" />
                    <view class="order-name">
                        <view class="name">{{item.room.name}}</view>
                        <view class="order-price">￥{{item.room.price}}</view>
                        <view class="order-time">营业时间：{{item.shopStore.workingTime}}</view>
                    </view>
                </view>
                <view class="order-times">
                    <view class="order-date">
                        <view class="date">{{item.orderTime}}——{{item.Time}}</view>
                        <view class="sky">{{item.day}}晚</view>
                    </view>
                    <view class="price">￥{{item.price}}</view>
                </view>
                <view class="order-order">
                    <view class="service" data-item="{{item}}" catchtap="phone">联系房东</view>
                    <view class="service" data-item="{{item}}" catchtap="replyRefund">申请退款</view>
                    <view class="pay" data-item="{{item}}" catchtap="orderpay" style="background-color: {{activeColor}};color: #ffffff">详情</view>
                </view>
            </view>
        </block>
    </block>
    <block wx:if="{{active==2}}">
        <block wx:if="{{list.length==0}}">
            <van-empty description="暂无订单" />
        </block>
        <block wx:for="{{list}}" wx:key="index">
            <view class="box">
                <view class="order-number">
                    <view class="number">订单号：{{item.orderNum}}</view>
                    <view class="state">已入住</view>
                </view>
                <view class="order-txt" data-item="{{item}}" bindtap="orderpay">
                    <image class="order-image" src="{{item.room.images[0]}}" />
                    <view class="order-name">
                        <view class="name">{{item.room.name}}</view>
                        <view class="order-price">￥{{item.room.price}}</view>
                        <view class="order-time">营业时间：{{item.shopStore.workingTime}}</view>
                    </view>
                </view>
                <view class="order-times">
                    <view class="order-date">
                        <view class="date">{{item.orderTime}}——{{item.Time}}</view>
                        <view class="sky">{{item.day}}晚</view>
                    </view>
                    <view class="price">￥{{item.price}}</view>
                </view>
                <view class="order-order">
                    <view class="service" data-item="{{item}}" catchtap="phone">联系房东</view>
                    <view class="pay" data-item="{{item}}" catchtap="evaluation" style="background-color: {{activeColor}};color: #ffffff">去评价</view>
                </view>
            </view>
        </block>
    </block>
    <block wx:if="{{active==3}}">
        <block wx:if="{{list.length==0}}">
            <van-empty description="暂无订单" />
        </block>
        <block wx:for="{{list}}" wx:key="index">
            <view class="box">
                <view class="order-number">
                    <view class="number">订单号：{{item.orderNum}}</view>
                    <view class="state">已完成</view>
                </view>
                <view class="order-txt" data-item="{{item}}" bindtap="orderpay">
                    <image class="order-image" src="{{item.room.images[0]}}" />
                    <view class="order-name">
                        <view class="name">{{item.room.name}}</view>
                        <view class="order-price">￥{{item.room.price}}</view>
                        <view class="order-time">营业时间：{{item.shopStore.workingTime}}</view>
                    </view>
                </view>
                <view class="order-times">
                    <view class="order-date">
                        <view class="date">{{item.orderTime}}——{{item.Time}}</view>
                        <view class="sky">{{item.day}}晚</view>
                    </view>
                    <view class="price">￥{{item.price}}</view>
                </view>
                <view class="order-order">
                    <view class="service" style="width: 180rpx;text-align: center;background-color: {{activeColor}};color: #ffffff" data-item="{{item}}" catchtap="orderpay">
                        详情
                    </view>
                </view>
            </view>
        </block>
    </block>
</scroll-view>