nova-trip/nova-tourism/pages/homestay/room-detail/index.wxml

<!-- pages/hotel/hotel-details/index.wxml -->
<nav type="back" background-color="{{activeColor}}" title="房间详情" frontColor="#ffffff" />
<view class="page-section  swiper-images-wrapper">
    <swiper indicator-dots="{{indicatorDots}}" class="swiper-images" autoplay="{{SwiperInfo.autoplay}}" interval="{{SwiperInfo.interval}}" duration="{{SwiperInfo.duration}}">
        <block wx:for="{{room.images}}" wx:key="index">
            <swiper-item>
                <image class="swiper-item swiper-image " src="{{item}}"></image>
            </swiper-item>
        </block>
    </swiper>
</view>
<view class="page-section  page-section-spacing">
    <detail-card detail="{{room}}" activeColor="{{activeColor}}"></detail-card>
</view>
<view class="page-section  page-section-spacing ">
    <shop-detail-card shop="{{room.shop}}" activeColor="{{activeColor}}"></shop-detail-card>
</view>
<view class="page-section  page-section-spacing ">
    <list-card info="{{room.shop}}" activeColor="{{activeColor}}" islink url="../hotel-details/index?id={{room.shop.objectId}}" linkdesc="全部房源"></list-card>  
</view>
<van-sticky offset-top="{{ stickyTop }}">
    <van-tabs   active="{{active}}"  id="tabs" bind:change="tabChange" color="{{activeColor}}" nav-class="tab-title">
        <van-tab title="详情" name="detail" ></van-tab>
        <van-tab title="评价" name="comments"></van-tab>
    </van-tabs>
</van-sticky>
<!-- offset-top="{{100}}" -->
<view class="page-section ">
    <view id="detail" wx:if="{{room.details}}">
        <rich-text nodes="{{room.details}}" style="width: 100%;height: 100%; margin-right: 0 auto;"></rich-text>
    </view> 
</view>

<view class="page-section " id="comments">
    <comment-list activeColor="{{activeColor}}" comments="{{orders}}" title="房客评价" showMore="{{commentCount > 10?true:false}}" bind:more="navigateComments"></comment-list>
</view>
    
<view class="footer-bar">
    <view class="price" style="color: {{activeColor}};">￥{{room.price}}</view>
    <van-button color="{{activeColor}}" round size="normal" class="btn" bind:tap="navigate"><text style="color:#ffffff;" >立即预订</text></van-button>
</view>
<!-- <view class="page-section" >
    <van-tabs active="{{active}}" id="tabs" bind:change="tabChange" color="#FFE300" nav-class="tab-title">
    <van-tab title="详情" name="detail" >
        <block  wx:if="{{room.details && active == 'detail'}}">
            <scroll-view scroll-y="true" style="height:calc(100vh - 320rpx);" data-changeval="comments" bindscrolltolower="tabChange">
                <rich-text nodes="{{room.details}}" style="width: 100%;height: 100%; margin-right: 0 auto;"></rich-text>
            </scroll-view>
        </block>
    </van-tab>
    <van-tab title="评价" name="comments">
        <block wx:if="{{ active == 'comments'}}">
            <scroll-view scroll-y="true" style="height:calc(100vh - 320rpx);" data-changeval="detail"  bindscrolltoupper="tabChange">
                <text>djspj[dg re</text>
            </scroll-view>
        </block>
    </van-tab>
</van-tabs>
</view> -->
<!-- <view class="more">
    <view class="more-title">更多</view>
    <view class="more-title">民宿</view>
</view> 
<view class="box">
    <view class="price">
        <view class="hotel-price">￥128/每晚</view>
        <view class="hotel-original">￥168</view>
    </view>
    <view class="hotel-preferential">
        <view class="preferential">已优惠￥20元•新房特惠</view>
        <view class="hotel-detail">
            优惠明细
            <van-icon name="arrow" />
        </view>
    </view>
    <view class="address">独享整套房源•1室1床•可住2人</view>
    <view class="address">度尚居公寓，凡含大床房，万达广场</view>
    <view class="tag">
        <view class="tag-name">有洗衣机</view>
        <view class="tag-name">有洗衣机</view>
        <view class="tag-name">有洗衣机</view>
        <view class="tag-name">有洗衣机</view>
        <view class="tag-name">有洗衣机</view>
    </view>
    <view class="evaluation">
        <view>4.8分 超赞"房子位置好近地铁"</view>
        <view class="evaluation-txt">
            41条评价
            <van-icon name="arrow" />
        </view>
    </view>
    <view class="address">昌北机场商圈•新建区乐化镇徐邓村</view>
</view>
<view class="box">
    <view class="housing">房屋概览</view>
    <view class="housing-title">
        <view class="housing-txt">
            <view class="housing-name">房屋</view>
            <view>整套房源25㎡</view>
        </view>
        <view class="housing-txts">
            <view class="housing-name">窗户</view>
            <view>有窗户</view>
        </view>
        <view class="housing-txt">
            <view class="housing-name">户型</view>
            <view>一室0厅0厨1卫</view>
        </view>
        <view class="housing-txts">
            <view class="housing-name">电梯</view>
            <view>无电梯</view>
        </view>
        <view class="housing-txt">
            <view class="housing-name">人数</view>
            <view>2人,不可加客</view>
        </view>
        <view class="housing-txts">
            <view class="housing-name">卫浴</view>
            <view>1独卫</view>
        </view>
        <view class="housing-txt2">
            <view class="housing-name">床型</view>
            <view>1床(2X1.8米双人床*1)</view>
        </view>
    </view>
    <view class="introduce" bindtap="showPopup">
        <view class="introduce-name">介绍</view>
        <view class="introduce-describe">拥有各类典雅舒适客房风格简约，别致，设施健全，服务周到，展现一个"异家"服务周到，展现一个"异家"</view>
        <view class="introduce-check">查看详情</view>
        <van-popup show="{{ show }}" closeable close-icon-position="top-right" catchtap="onClose" round custom-style="width:80%;">
            <view class="txt">房屋介绍</view>
            <view class="title">拥有各类典雅舒适客房风格简约，别致，设施健全，服务周到，展现一个"异家"服务周到，展现一个"异家"</view>
        </van-popup>
    </view>
</view>
<view class="box">
    <view style="display: flex;justify-content: space-between;">
        <view class="housing">服务设施</view>
        <view class="housing-facilities">
            52项服务设施
            <van-icon name="arrow" />
        </view>
    </view>
    <view class="facilities">
        <view class="facilities-title">安全</view>
        <view class="facilities-txt">
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                智能门锁
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                门禁系统
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                灭火器
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                烟雾报警器
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                一氧化碳报警器
            </view>
            <view class="facilities-name">
                <van-icon name="minus" color="#afa9a9" />
                天然气报警器
            </view>
        </view>
    </view>
    <view class="facilities">
        <view class="facilities-title">服务</view>
        <view class="facilities-txt">
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                可长租
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                自助入住
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                行李寄存
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                管家式服务
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                付费停车
            </view>
        </view>
    </view>
    <view class="facilities">
        <view class="facilities-title">居家</view>
        <view class="facilities-txt">
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                无线网络
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                电视
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                热水壶
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                分体式空调
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                吹风机
            </view>
            <view class="facilities-name">
                <van-icon name="minus" color="#afa9a9" />
                中央空调
            </view>
        </view>
    </view>
    <view class="facilities">
        <view class="facilities-title">卫浴</view>
        <view class="facilities-txt">
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                热水淋浴
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                拖鞋
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                纸巾
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                牙具
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                毛巾
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                独立卫浴
            </view>
        </view>
    </view>
    <view class="facilities">
        <view class="facilities-title">卫生</view>
        <view class="facilities-txt">
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                床品每客一换
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                打扫工具
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                一次性毛巾
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                防臭地漏
            </view>
            <view class="facilities-name">
                <van-icon name="success" color="#1451ca" />
                白色床品
            </view>
        </view>
    </view>
</view>
<view class="box">
    <view class="housing">预定须知</view>
    <view class="instructions">以下规则由房东制定，请仔细阅读并遵守</view>
    <view class="confirm">
        <view class="confirm-title">确认</view>
        <view class="confirm-detail">
            <view class="confirm-immediately">立即确认</view>
            <view class="immediately-detail">下单即有房，无须等待确认</view>
        </view>
    </view>
    <view class="confirm">
        <view class="confirm-title">退出</view>
        <view class="confirm-detail">
            <view class="confirm-immediately">宽松</view>
            <view class="immediately-detail">入住前1天退出，可退全款</view>
        </view>
    </view>
    <view class="confirm">
        <view class="confirm-title">开票</view>
        <view class="confirm-detail">
            <view class="confirm-immediately">平台开票</view>
            <view class="immediately-detail">房东委托平台开具发票</view>
        </view>
    </view>
</view>
<view class="box">
    <view class="housing">费用须知</view>
    <view class="instructions">以下规则由房东制定，请仔细阅读并遵守</view>
    <view class="confirm">
        <view class="confirm-title">押金</view>
        <view class="confirm-detail">
            <view class="confirm-immediatelys">￥0</view>
            <view class="immediately-detail">房东提供免压服务</view>
        </view>
    </view>
    <view class="confirm">
        <view class="confirm-title">加客</view>
        <view class="confirm-detail">
            <view class="confirm-immediatelys">不可加客</view>
        </view>
    </view>
</view>
<view class="box">
    <view class="housing">入住须知</view>
    <view class="instructions">以下规则由房东制定，请仔细阅读并遵守</view>
    <view class="confirm">
        <view class="confirm-title">入离</view>
        <view class="confirm-detail">
            <view class="confirm-immediatelys">14:00一次日3:00间可入住,12:00前需要退房</view>
        </view>
    </view>
    <view class="confirm">
        <view class="confirm-title">入住</view>
        <view class="confirm-detail">
            <view class="confirm-immediately">自助入住</view>
            <view class="immediately-detail">全程自助办理入住，无需与房东接触，密码钥匙将在入住当天由房东提供</view>
            <view class="confirm-immediately2">实名登录</view>
            <view class="immediately-detail">全程自助办理入住，无需与房东接触，密码钥匙将在入住当天由房东提供</view>
        </view>
    </view>
    <view class="facilities">
        <view class="facilities-title">要求</view>
        <view class="facilities-txt">
            <view class="immediately-detail">入住需要实名登记，办理入住请出示身份证，需要接机请提前预约，感谢配合</view>
            <view class="facilities-names">
                <van-icon name="success" color="#1451ca" />
                允许抽烟
            </view>
            <view class="facilities-names">
                <van-icon name="success" color="#1451ca" />
                适合老人
            </view>
            <view class="facilities-names">
                <van-icon name="success" color="#1451ca" />
                房源没有噪音
            </view>
            <view class="facilities-names">
                <van-icon name="success" color="#1451ca" />
                适合婴幼儿
            </view>
            <view class="facilities-names">
                <van-icon name="success" color="#1451ca" />
                适合儿童
            </view>
            <view class="facilities-names">
                <van-icon name="success" color="#1451ca" />
                房源没有设施缺陷
            </view>
            <view class="facilities-names">
                <van-icon name="minus" color="red" />
                不允许携带宠物
            </view>
            <view class="facilities-names">
                <van-icon name="minus" color="red" />
                需爬楼梯
            </view>
            <view class="facilities-names">
                <van-icon name="minus" color="red" />
                不允许聚会
            </view>
            <view class="facilities-names">
                <van-icon name="minus" color="red" />
                不允许做饭
            </view>
        </view>
    </view>
</view> -->