laundry/pages/order/placeOrder/placeOrder.wxml

<view class="topBox" id="topBox">
    <view class="title flex" bindtap="addressDetail">
        <text>中央美术学院9号楼洗衣房1号柜</text>
        <van-icon name="arrow" size="15" color="#191C27" />
    </view>

    <view class="footer flex ju-b">
        <view class="le">
            <view class="address">
                <text>洪山区茅店山西路4号创星汇科技…</text>
                <text>｜距离40m</text>
            </view>
            <view class="tips">
                <text class="tag">已满柜</text>
                <text>24h开放·支持上门</text>
            </view>
        </view>
        <view class="lr">
            <swiper class="swiperBox" indicator-dots indicator-color="#D7D7D7" indicator-active-color="#4699FF">
                <swiper-item class="flex ju-c">
                    <image src="/image/icon/navigation.png"></image>
                    <text>导航</text>
                </swiper-item>

                <swiper-item class="flex ju-c">
                    <image src="/image/icon/kaigui.png"></image>
                    <text>开柜</text>
                </swiper-item>
            </swiper>
        </view>
    </view>
</view>

<view class="scrollBox" id="scrollBox">
    <scroll-view scroll-x>
        <image src="/image/order/houwaitao.png" class="show" wx:for="{{5}}"></image>
    </scroll-view>
</view>
<van-notice-bar mode="closeable" left-icon="/image/icon/message.png" bind:close="closeNews" text="在代码阅读过程中人们说脏话的频率是衡量代码质量的唯一标准。" />


<view class="contioner flex al-s" style="height: {{height}}px;">


    <view class="slidebar">
        <scroll-view scroll-y>
            <view class="sliderItem b-bottom {{activeKey == index?'active':''}}" wx:for="{{navList}}" wx:key="*this" bindtap="changeActive" data-activeKey="{{index}}">
                {{item.tit}}
            </view>
        </scroll-view>
    </view>

    <view class="listBox">
        <scroll-view scroll-y>
            <view class="title flex">
                <text>活动</text>
                <view class="line"></view>
            </view>

            <view class="box">
                <view class="items flex b-bottom" wx:for="{{shoppingList}}" wx:key="{{item.id}}">
                    <view class="le">
                        <image src="/image/order/houwaitao.png" class="picture"></image>

                    </view>
                    <view class="lr">
                        <view class="message flex ju-b">
                            <view class="tit">薄上衣（春夏装）</view>
                            <view class="num flex ju-b">
                                <view>
                                    <text class="price">￥<text class="number">{{item.price}}</text></text>
                                    <text class="oldPrice">￥9</text>
                                </view>

                                <view class="btn-sky btn flex ju-c" wx:if="{{item.num == 0}}" bindtap="shoppingPlus" data-item="{{item}}">
                                    <van-icon name="plus" size="12" />
                                </view>

                                <view class="flex" wx:else>
                                    <view class="btn-border btn flex ju-c" bindtap="shoppingMinus" data-item="{{item}}" >
                                        <van-icon name="minus" size="12" color="#191C27" />
                                    </view>
                                    <view class="nums">
                                        {{item.num}}
                                    </view>
                                    <view class="btn-sky btn flex ju-c"  bindtap="shoppingPlus" data-item="{{item}}">
                                        <van-icon name="plus" size="12" />
                                    </view>
                                </view>
                            </view>
                        </view>
                    </view>
                </view>
            </view>
        </scroll-view>
    </view>
</view>

<view class="footerBox flex ju-c" id="footerBar">
    <view class="btnBox flex ju-b">
        <view class="le flex" bindtap="btnShow">
            <view class="box" >
                <image src="/image/icon/box.png"></image>
                <dot num="{{carNum}}" wx:if="{{carNum > 0}}" offset="{{[-8,-15]}}" radius="50%" height="36rpx" width="36rpx" color="#F12C20"></dot>
            </view>

            <text class="tips" hidden="{{carList.length != 0}}">尚未选择服务</text>
            <text class="pricce" hidden="{{carList.length == 0}}">
                <text>￥</text>
                <text class="num">{{carPrice}}</text>
            </text>
        </view>
        <view class="lr {{carList.length > 0 ? 'btn-sky' : 'gray'}}" bindtap="getOrder">
            下单洗衣
        </view>
    </view>
</view>

<van-popup show="{{ show }}" position="bottom" bind:close="btnShow" round close-on-click-overlay>
    <view class="carBox">
        <view class="tit flex ju-b">
            <view class="le">
                已选服务（{{carNum}}）
            </view>
            <view class="lr flex" bindtap="clearCarAll">
                <image src="/image/icon/del.png" class="del"></image>
                <text>清空</text>
            </view>
        </view>


        <view class="box">

            <scroll-view scroll-y>

                <view class="items flex b-bottom" wx:for="{{carList}}" wx:key="{{index}}">
                    <view class="le">
                        <image src="/image/order/houwaitao.png" class="picture"></image>

                    </view>
                    <view class="lr">
                        <view class="message flex ju-b">
                            <view class="name">薄上衣（春夏装）</view>
                            <view class="num flex ju-b">
                                <view>
                                    <text class="price">￥<text class="number">{{item.price}}</text></text>
                                    <text class="oldPrice">￥9</text>
                                </view>

                                <view class="flex">
                                    <view class="btn-border btn flex ju-c"  bindtap="carMinus" data-item="{{item}}">
                                        <van-icon name="minus" size="12" color="#191C27" />
                                    </view>
                                    <view class="nums">
                                        {{item.num}}
                                    </view>
                                    <view class="btn-sky btn flex ju-c" bindtap="carPlus" data-item="{{item}}">
                                        <van-icon name="plus" size="12" />
                                    </view>
                                </view>
                            </view>
                        </view>
                    </view>
                </view>
            </scroll-view>
        </view>

    </view>

</van-popup>

<van-popup z-index="300" show="{{ detailsShow }}" position="bottom" bind:close="addressDetail" close-icon="/image/icon/close.png" round close-on-click-overlay closeable>
    <view class="details">
        <view class="title">
            中央美术学院9号楼洗衣房1号柜这里展示全部完整柜子信息
        </view>

        <view class="tag">
            可存衣
        </view>

        <view class="grayText">
            地址：洪山区茅店山西路4号创星汇科技园洪山区茅店山西路4号创星汇科技园
        </view>

        <view class="grayText">
            电话：027-98987654
        </view>

        <view class="grayText">
            营业时间：24h开放
        </view>

        <view class="grayText">
            配送：支持上门
        </view>
    </view>
</van-popup>