3443443

+//app.js
+App({
+  onLaunch: function () {
+    // 展示本地存储能力
+    var logs = wx.getStorageSync('logs') || []
+    logs.unshift(Date.now())
+    wx.setStorageSync('logs', logs)
+
+    // 登录
+    wx.login({
+      success: res => {
+        // 发送 res.code 到后台换取 openId, sessionKey, unionId
+      }
+    })
+    // 获取用户信息
+    wx.getSetting({
+      success: res => {
+        if (res.authSetting['scope.userInfo']) {
+          // 已经授权，可以直接调用 getUserInfo 获取头像昵称，不会弹框
+          wx.getUserInfo({
+            success: res => {
+              // 可以将 res 发送给后台解码出 unionId
+              this.globalData.userInfo = res.userInfo
+
+              // 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
+              // 所以此处加入 callback 以防止这种情况
+              if (this.userInfoReadyCallback) {
+                this.userInfoReadyCallback(res)
+              }
+            }
+          })
+        }
+      }
+    })
+  },
+  globalData: {
+    userInfo: null
+  }
+})

+{
+  "pages": [
+    "pages/hoteldetail/hoteldetail",
+    "pages/ruzhuxuzhi/ruzhuxuzhi",
+    "pages/jiudiandetail/jiudiandetail",
+    "pages/fangxingintro/fangxingintro",
+    
+    "pages/yudingfinish/yudingfinish",
+    "pages/yuding/yuding",
+    "pages/roomdetail/roomdetail",
+    "pages/gongluedetail/gongluedetail",
+    "pages/selectcity/selectcity",
+    "pages/houselist/houselist",
+    "pages/experience/experience",
+    "pages/gonglue/gonglue",
+    "pages/tiyan/tiyan",
+    "pages/huiyuanxieyi/huiyuanxieyi",
+    "pages/zhucexieyi/zhucexieyi",
+    "pages/huiyuanindex/huiyuanindex",
+    "pages/huiyuan/huiyuan",
+    "pages/yudingzhinan/yudingzhinan",
+    "pages/wantruzhu/wantruzhu",
+    "pages/opencity/opencity",
+    "pages/lixiangzhong/lixiangzhong",
+    "pages/login/login",
+    "pages/index/index",
+    "pages/logs/logs"
+ 
+  ],
+  "permission": {
+    "scope.userLocation": {
+      "desc": "你的位置信息将用于小程序位置接口的效果展示"
+    }
+  },
+  "window": {
+    "backgroundTextStyle": "light",
+    "navigationBarBackgroundColor": "#fff",
+    "navigationBarTitleText": "WeChat",
+    "navigationBarTextStyle": "black"
+  },
+  "sitemapLocation": "sitemap.json"
+}

+/**app.wxss**/
+.register {
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.5);
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 99;
+}
+
+image{
+  width:100%;
+  height:100%;
+}
+
+/* 轮播图 */
+.swiper_image{
+  width:750rpx;
+  height:376rpx;
+  font-size: 0;
+  margin: 30rpx auto 0;
+  position: relative;
+  box-shadow:0px -1px 6px 0px rgba(212,137,96,0.11);
+ 
+
+}
+.swiper_item_img{
+ 
+  height:376rpx;
+}
+.swiper_image image{
+  width:100%;
+  height:100%;
+  /* box-shadow:0px -1px 6px 0px rgba(212,137,96,0.11); */
+  
+}
+.swiper_item_img swiper-item{
+   width:686rpx;
+  height:376rpx;
+  box-shadow:0px -1px 6px 0px rgba(212,137,96,0.11);
+  display:felx;
+  align-items: center;justify-content: center;
+
+  
+}
+.swiper_item_img swiper-item image{
+  width:100%;
+  height:100%;
+  
+}
+
+
+.dots{
+    /* width: 156rpx; */
+    
+    display: flex;
+    align-items: center;
+    flex-direction: row;
+    position: absolute;
+    justify-content: center;
+    left: 0;
+    right:0;
+    bottom: 20rpx;
+}
+/*未选中时的小圆点样式 */
+.dot{
+    width: 12rpx;
+    height: 12rpx;
+    border-radius: 50%;
+    margin-right: 26rpx;
+    background-color:#fff;
+}
+/*选中以后的小圆点样式  */
+.active{
+    width: 12rpx;
+    height: 12rpx;
+    border-radius:50%;
+    background-color: #FF5A4E;
+    
+
+}

+// pages/experience/experience.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    imgUrls: [
+      '/img/tuijianimg1.png',
+      '/img/tuijianimg1.png',
+      '/img/tuijianimg1.png',
+    ],
+    indicatorDots: false,
+    autoplay: true,
+    interval: 2000,
+    duration: 1000,
+    currentSwiper: 0,
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function(options) {
+
+  },
+
+  swiperChange: function (e) {
+    this.setData({
+      currentSwiper: e.detail.current
+    })
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function() {
+
+  }
+})

+{
+ "navigationBarTitleText": "体验"
+}

+  <view class="swiper_image">
+    <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" class="swiper_item_img" bindchange="swiperChange">
+      <block wx:for="{{imgUrls}}" wx:key="doct">
+        <swiper-item style="border-radius:10px;">
+          <image src="{{item}}" data-index='{{index}}' class="slide-image" bindtap='viewImg' width="355" height="150" />
+        </swiper-item>
+      </block>
+    </swiper>
+
+    <view class="dots">
+      <block wx:for="{{imgUrls}}" wx:key="">
+        <view class="dot{{index == currentSwiper ? ' active' : ''}}"></view>
+      </block>
+    </view>
+
+  </view>
+
+  <view class="pingbox">
+      <view class="pingboxitem">
+          <view class="pingboxtop">
+              <view class="pingleft">
+                  <image src="/img/renwu.png"></image>
+              </view>
+
+              <view class="pigright">温宁</view>
+          </view>
+
+          <view class="pingword">在闹中取静的西湖，体验地道的本土生活</view>
+
+          <view class="pingtext">杭州处于亚热带季风区，四季分明，夏季气候炎热，湿润，是新四大火炉之一。相反，冬季寒冷，干燥。春秋两季气候宜人，是观光旅游的黄金季节。</view>
+
+          <view class="pingbottom">
+              <view class="pingbottomleft">
+                  <view class="pingbottomleftimg">
+                      <image src="/img/ditu.png"></image>
+                  </view>
+
+                  <view class="pingdidian">杭州西湖风景民宿</view>
+              </view>
+
+              <view class="pingbottomright">
+                  <view class="pingbottomrightimg">
+                      <image src="/img/zan.png"></image>
+                  </view>
+                  <view class="zannum">67</view>
+              </view>
+          </view>
+      </view>
+
+      <view class="pingboxitem">
+          <view class="pingboxtop">
+              <view class="pingleft">
+                  <image src="/img/renwu.png"></image>
+              </view>
+
+              <view class="pigright">温宁</view>
+          </view>
+
+          <view class="pingword">在闹中取静的西湖，体验地道的本土生活</view>
+
+          <view class="pingtext">杭州处于亚热带季风区，四季分明，夏季气候炎热，湿润，是新四大火炉之一。相反，冬季寒冷，干燥。春秋两季气候宜人，是观光旅游的黄金季节。</view>
+
+          <view class="pingbottom">
+              <view class="pingbottomleft">
+                  <view class="pingbottomleftimg">
+                      <image src="/img/ditu.png"></image>
+                  </view>
+
+                  <view class="pingdidian">杭州西湖风景民宿</view>
+              </view>
+
+              <view class="pingbottomright">
+                  <view class="pingbottomrightimg">
+                      <image src="/img/zan.png"></image>
+                  </view>
+                  <view class="zannum">67</view>
+              </view>
+          </view>
+      </view>
+
+      <view class="pingboxitem">
+          <view class="pingboxtop">
+              <view class="pingleft">
+                  <image src="/img/renwu.png"></image>
+              </view>
+
+              <view class="pigright">温宁</view>
+          </view>
+
+          <view class="pingword">在闹中取静的西湖，体验地道的本土生活</view>
+
+          <view class="pingtext">杭州处于亚热带季风区，四季分明，夏季气候炎热，湿润，是新四大火炉之一。相反，冬季寒冷，干燥。春秋两季气候宜人，是观光旅游的黄金季节。</view>
+
+          <view class="pingbottom">
+              <view class="pingbottomleft">
+                  <view class="pingbottomleftimg">
+                      <image src="/img/ditu.png"></image>
+                  </view>
+
+                  <view class="pingdidian">杭州西湖风景民宿</view>
+              </view>
+
+              <view class="pingbottomright">
+                  <view class="pingbottomrightimg">
+                      <image src="/img/zan.png"></image>
+                  </view>
+                  <view class="zannum">67</view>
+              </view>
+          </view>
+      </view>
+
+      <view class="pingboxitem">
+          <view class="pingboxtop">
+              <view class="pingleft">
+                  <image src="/img/renwu.png"></image>
+              </view>
+
+              <view class="pigright">温宁</view>
+          </view>
+
+          <view class="pingword">在闹中取静的西湖，体验地道的本土生活</view>
+
+          <view class="pingtext">杭州处于亚热带季风区，四季分明，夏季气候炎热，湿润，是新四大火炉之一。相反，冬季寒冷，干燥。春秋两季气候宜人，是观光旅游的黄金季节。</view>
+
+          <view class="pingbottom">
+              <view class="pingbottomleft">
+                  <view class="pingbottomleftimg">
+                      <image src="/img/ditu.png"></image>
+                  </view>
+
+                  <view class="pingdidian">杭州西湖风景民宿</view>
+              </view>
+
+              <view class="pingbottomright">
+                  <view class="pingbottomrightimg">
+                      <image src="/img/zan.png"></image>
+                  </view>
+                  <view class="zannum">67</view>
+              </view>
+          </view>
+      </view>
+  </view>

+/* 轮播图 */
+.swiper_image{
+  width:750rpx;
+  height:376rpx;
+  font-size: 0;
+  margin: 30rpx auto 0;
+  position: relative;
+  box-shadow:0px -1px 6px 0px rgba(212,137,96,0.11);
+ 
+
+}
+.swiper_item_img{
+ 
+  height:376rpx;
+}
+.swiper_image image{
+  width:100%;
+  height:100%;
+  /* box-shadow:0px -1px 6px 0px rgba(212,137,96,0.11); */
+  
+}
+.swiper_item_img swiper-item{
+   width:686rpx;
+  height:376rpx;
+  box-shadow:0px -1px 6px 0px rgba(212,137,96,0.11);
+  display:felx;
+  align-items: center;justify-content: center;
+
+  
+}
+.swiper_item_img swiper-item image{
+  width:100%;
+  height:100%;
+  
+}
+
+
+.dots{
+    /* width: 156rpx; */
+    height: 36rpx;
+    display: flex;
+    flex-direction: row;
+    position: absolute;
+    justify-content: center;
+    left: 0;
+    right:0;
+    bottom: 20rpx;
+}
+/*未选中时的小圆点样式 */
+.dot{
+    width: 12rpx;
+    height: 12rpx;
+    border-radius: 50%;
+    margin-right: 26rpx;
+    background-color:#fff;
+}
+/*选中以后的小圆点样式  */
+.active{
+    width: 12rpx;
+    height: 12rpx;
+    border-radius:50%;
+    background-color: #FF5A4E;
+    
+
+}
+
+.pingboxtop{
+    display:flex;
+    align-items: center
+}
+.pingleft{
+  width:82rpx;
+  height: 82rpx;
+  font-size: 0;
+  border-radius: 50%;
+}
+.pingbox{
+  padding: 0 34rpx;
+  box-sizing: border-box;
+  margin-bottom:20rpx;
+  
+}
+.pingleft image{
+  border-radius: 50%;
+}
+.pingboxitem{
+  padding: 24rpx 0;
+  box-sizing: border-box
+}
+.pigright{
+  color:#06121E;
+  font-size: 32rpx;
+  margin-left:28rpx;
+}
+.pingbottom{
+  display:flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-top:24rpx;
+
+}
+.pingbottomleftimg{
+  width:35rpx;
+  height:33rpx;
+  font-size: 0
+}
+.pingbottomleft{
+  display:flex;
+  align-items: center
+}
+.pingdidian{
+  color:#06121E;
+  font-size: 28rpx;
+  margin-left:12rpx;
+}
+.pingbottomright{
+  display:flex;
+  align-items: center;
+}
+
+.pingbottomrightimg{
+  width:28rpx;
+  height:28rpx;
+  font-size: 0
+}
+.zannum{
+  color:#FF5A4E;
+  font-size: 24rpx;
+}

+// pages/hoteldetail/hoteldetail.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    imgUrls: [
+      '/img/tuijianimg1.png',
+      '/img/tuijianimg1.png',
+      '/img/tuijianimg1.png',
+    ],
+    indicatorDots: false,
+    autoplay: true,
+    interval: 2000,
+    duration: 1000,
+    currentSwiper: 0,
+    selitem: 1
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  selkind(e) {
+    this.setData({
+      selitem: e.currentTarget.dataset.type
+    })
+  },
+  swiperChange: function (e) {
+    this.setData({
+      currentSwiper: e.detail.current
+    })
+  },
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "usingComponents": {}
+}

+<view class="swiper_image">
+  <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" class="swiper_item_img" bindchange="swiperChange">
+    <block wx:for="{{imgUrls}}" wx:key="doct">
+      <swiper-item style="border-radius:10px;">
+        <image src="{{item}}" data-index='{{index}}' class="slide-image" bindtap='viewImg' width="355" height="150" />
+      </swiper-item>
+    </block>
+  </swiper>
+
+  <view class="dots">
+    <block wx:for="{{imgUrls}}" wx:key="">
+      <view class="dot{{index == currentSwiper ? ' active' : ''}}"></view>
+    </block>
+  </view>
+
+</view>
+
+<view class="minsuintor">
+  <view class="minsutou">蔓图精品民宿</view>
+
+  <view class="suconcatbox">
+    <view class="suhead suheadone">
+      <view class="suheadleft">
+        <view class="suheadleimg">
+          <image src="/img/ditu.png"></image>
+        </view>
+
+        <view class="sunheadword">北京海淀区蔓图精品民宿</view>
+
+
+      </view>
+
+      <view class="suheadright">
+        <image src="/img/dianhua.png"></image>
+      </view>
+    </view>
+
+    <view class="suhead suheadsec">
+      <view class="suheadleft">
+        <view class="suheadleimg">
+          <image src="/img/haibao.png"></image>
+        </view>
+
+        <view class="sunheadword">08月29日-08月31日</view>
+      </view>
+      <view class="ruzhuright">
+        <view class="ruzhu">
+          入住
+          <text class="ruzhunum">2</text>晚
+        </view>
+
+        <view class="ruzhuyou">
+          <image src="/img/yourow.png"></image>
+        </view>
+      </view>
+
+    </view>
+  </view>
+</view>
+
+<view class="minsulist">
+    <view class='minsuitem {{selitem==1?"selactive":""}}' bindtap="selkind" data-type="1">房型介绍</view>
+    <view class='minsuitem {{selitem==2?"selactive":""}}' bindtap="selkind" data-type="2">酒店介绍</view>
+    <view class='minsuitem {{selitem==3?"selactive":""}}' bindtap="selkind" data-type="3">入住须知</view>
+    <view class='minsuitem {{selitem==4?"selactive":""}}' bindtap="selkind" data-type="4">游玩攻略</view>
+</view>
+
+<!--房型介绍 -->
+
+<view class="fangjieshao" wx:if="{{selitem==1}}">
+    <view class="fangjieshaoitem">
+        <view class="fangjietop">
+            <image src="/img/tuijianimg3.png"></image>
+        </view>
+
+        <view class="fangjiebot">
+            <view class="fangjieleft">尊享大床房</view>
+
+            <view class="fangjieprice">￥197</view>
+        </view>
+
+        <view class="fangjiabot">
+            <view class="fangjiabotleft">
+                <view class="fangjiabotlefttop">55㎡  1张1.8米大床</view>
+
+                <view class="kindtext">
+                
+                <text class="fangjiabotbottom">有窗</text>
+                <text class="jinzhang">房屋紧张</text>
+                
+                </view>
+            </view>
+
+            <view class="yudingqita">
+                <view class="yudingqitaleft">预定其他日期</view>
+                <view class="yudingyou">
+                    <image src="/img/whiteyourow.png"></image>
+                </view>
+            </view>
+
+            <!-- <view class="fangjiabotright">免费预订</view> -->
+        </view>
+    </view>
+
+     <view class="fangjieshaoitem">
+        <view class="fangjietop">
+            <image src="/img/tuijianimg3.png"></image>
+        </view>
+
+        <view class="fangjiebot">
+            <view class="fangjieleft">尊享大床房</view>
+
+            <view class="fangjieprice">￥197</view>
+        </view>
+
+        <view class="fangjiabot">
+            <view class="fangjiabotleft">
+                <view class="fangjiabotlefttop">55㎡  1张1.8米大床</view>
+
+                <view class="fangjiabotbottom">有窗</view>
+            </view>
+
+            <view class="fangjiabotright">免费预订</view>
+        </view>
+    </view>
+
+     <view class="fangjieshaoitem">
+        <view class="fangjietop">
+            <image src="/img/tuijianimg3.png"></image>
+        </view>
+
+        <view class="fangjiebot">
+            <view class="fangjieleft">尊享大床房</view>
+
+            <view class="fangjieprice">￥197</view>
+        </view>
+
+        <view class="fangjiabot">
+            <view class="fangjiabotleft">
+                <view class="fangjiabotlefttop">55㎡  1张1.8米大床</view>
+
+                <view class="fangjiabotbottom">有窗</view>
+            </view>
+
+            <view class="fangjiabotright">免费预订</view>
+        </view>
+    </view>
+</view>
+
+<!-- 酒店介绍 -->
+
+<view class="jiudianbigbox" wx:if="{{selitem==2}}">
+  <!-- 酒店介绍 -->
+
+  <view class="jiudianintortext">
+    <view class="jiudainjie">
+      <view class="jiudianjieleft">酒店介绍</view>
+      <view class="judianjieright">
+        <image src="/img/yourow.png"></image>
+      </view>
+    </view>
+
+    <view class="jiudiancontentitem">
+      <view class="jiudianboxtop">
+        <view class="jiudiantopleft">
+          <image src="/img/jieshaojiu.png"></image>
+        </view>
+        <view class="jiudianhuan">周边环境</view>
+
+      </view>
+
+      <view class="zhoubiantext">
+        上海艾格瑞公寓位于具有“上海缩影”之称的虹口，坐拥浦江繁华内环核心，占据内环具有价值“黄金三角生活圈”。公寓毗邻瑞虹天地商圈、四川北路商圈、海伦路商圈之众多商场和写字楼，步行可达和平公园、鲁迅公园、1933老场坊、多伦路文化名人街，乘车前往外滩、陆家嘴约十余分钟。 　　公寓设有标准层和行政层，标准层设有7种各具特色的北欧风房型，行政层设有3种舒适简约套房房型，每间房间配有无线上网服务。
+      </view>
+    </view>
+
+    <view class="jiudiancontentitem">
+      <view class="jiudianboxtop">
+        <view class="jiudiantopleft">
+          <image src="/img/shejistyle.png"></image>
+        </view>
+        <view class="jiudianhuan">设计风格</view>
+
+      </view>
+
+      <view class="zhoubiantext">
+        酒店设计现代、简约。 游玩回到水晶可以在露台喝茶聊天，看书发呆。尽情享受度假时光。
+      </view>
+    </view>
+    <view class="jiudiancontentitem">
+      <view class="jiudianboxtop">
+        <view class="jiudiantopleft">
+          <image src="/img/jiaotong.png"></image>
+        </view>
+        <view class="jiudianhuan">交通路线</view>
+
+      </view>
+
+      <view class="zhoubiantext">
+        酒店临近16号线永丰南站，步行4分钟即可到达地铁站；
+      </view>
+    </view>
+
+    <view class="jiudiancontentitem">
+      <view class="jiudianboxtop">
+        <view class="jiudiantopleft">
+          <image src="/img/tuijianreson.png"></image>
+        </view>
+        <view class="jiudianhuan">推荐理由</view>
+
+      </view>
+
+      <view class="zhoubiantext">
+        公寓内还设有健身房、咖啡厅、公共会客厅、棋牌桌游吧、会议室、商务中心等设施。在这里，可以充分感受上海气息的品质居住体验，愿能成为您商务、旅行下榻的优选。
+      </view>
+    </view>
+
+
+  </view>
+
+
+
+  <!-- 设施服务 -->
+
+  <view class="jiudianintortext">
+    <view class="jiudainjie">
+      <view class="jiudianjieleft">设施服务</view>
+      <view class="judianjieright">
+        <image src="/img/yourow.png"></image>
+      </view>
+    </view>
+
+    <view class="jiaotong">
+
+      <view class="jiaotongitem">
+        <view class="jiaotongtop">交通服务</view>
+
+        <view class="jiaotongbottom">
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">免费停车</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">自行车租赁服务</view>
+          </view>
+        </view>
+      </view>
+
+      <view class="jiaotongitem">
+        <view class="jiaotongtop">餐饮服务</view>
+
+        <view class="jiaotongbottom">
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">中餐厅</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">咖啡厅</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">送餐服务</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">烧烤</view>
+          </view>
+        </view>
+      </view>
+
+      <view class="jiaotongitem">
+        <view class="jiaotongtop">网络设施</view>
+
+        <view class="jiaotongbottom">
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">客房WIFI</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">公共区域WIFI</view>
+          </view>
+        </view>
+      </view>
+
+
+      <view class="jiaotongitem">
+        <view class="jiaotongtop">娱乐和健身设施</view>
+
+        <view class="jiaotongbottom">
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">茶室</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">健身房</view>
+          </view>
+        </view>
+      </view>
+
+
+      <view class="jiaotongitem">
+        <view class="jiaotongtop">服务项目</view>
+
+        <view class="jiaotongbottom">
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">会议室</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">全天前天</view>
+          </view>
+        </view>
+      </view>
+
+    </view>
+
+
+
+  </view>
+
+
+
+</view>
+
+
+
+
+
+<view class="jiudianbottom">
+    <view class="jiudianbottomleft">
+        <view class="jiudianitem">
+            <view class="jiudianitemtop">
+                <image src="/img/pin.png"></image>
+            </view>
+
+            <view class="jiudianitembot">首页</view>
+        </view>
+        <view class="jiudianitem">
+            <view class="jiudianitemtop">
+                <image src="/img/kefu.png"></image>
+            </view>
+
+            <view class="jiudianitembot kename">客服</view>
+        </view>
+        <view class="jiudianitem">
+            <view class="jiudianitemtop">
+                <image src="/img/shou.png"></image>
+            </view>
+
+            <view class="jiudianitembot">收藏</view>
+        </view>
+    </view>
+
+    <view class="jiudianbottomright">购买会员免费入住</view>
+</view>

+page {
+  background: #F9F9F9;
+}
+
+.minsuintor {
+  padding: 40rpx 44rpx;
+  box-sizing: border-box;
+  background: #fff;
+}
+
+.minsutou {
+  color: #06121e;
+  font-size: 38rpx;
+  font-weight: bold;
+}
+
+.suhead {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 30rpx 32rpx 30rpx 0;
+  box-sizing: border-box;
+}
+
+.suheadone {
+  margin-top: 32rpx;
+}
+
+.suheadsec {
+  margin-top: 16rpx;
+}
+
+.suheadleft {
+  display: flex;
+  align-items: center;
+}
+
+.suheadleimg {
+  width: 40rpx;
+  height: 40rpx;
+  font-size: 0;
+}
+
+.sunheadword {
+  color: #06121e;
+  font-size: 28rpx;
+  margin-left: 12rpx;
+}
+
+.suheadright {
+  width: 44rpx;
+  height: 44rpx;
+  font-size: 0;
+}
+
+.ruzhu {
+  color: #06121e;
+  font-size: 28rpx;
+}
+
+.ruzhunum {
+  color: #ff5a4e;
+  font-size: 28rpx;
+}
+
+.ruzhuright {
+  display: flex;
+  align-items: center;
+}
+
+.ruzhuyou {
+  width: 18rpx;
+  height: 18rpx;
+  font-size: 0;
+  margin-left: 16rpx;
+}
+
+.minsulist {
+  display: flex;
+  align-items: center;
+  padding: 32rpx 58rpx;
+  box-sizing: border-box;
+  justify-content: space-between;
+  background: #fff;
+  margin-top:20rpx;
+}
+
+.minsuitem {
+  color: #06121e;
+  font-size: 26rpx;
+}
+
+.selactive {
+  color: #06121e;
+  font-size: 38rpx;
+  font-weight: bold;
+  position: relative;
+}
+
+.selactive::after {
+  position: absolute;
+  display: block;
+  content: '';
+  width: 48rpx;
+  height: 6rpx;
+  background: #ff5a4e;
+  left: 50%;
+  right: 50%;
+  transform: translateX(-50%);
+  bottom: -12rpx;
+  border-radius: 4rpx;
+}
+
+.judianjieright {
+  width: 34rpx;
+  height: 34rpx;
+  font-size: 0;
+}
+
+.jiudainjie {
+  width: 686rpx;
+  margin: 24rpx auto 0;
+  padding: 38rpx 32rpx;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  box-shadow: 0px 16rpx 24rpx rgba(0, 0, 0, 0.02);
+  opacity: 1;
+  border-radius: 20rpx;
+}
+
+.jiudianjieleft {
+  color: #06121e;
+  font-size: 32rpx;
+  font-weight: bold;
+}
+
+.fuwujie {
+  margin-bottom: 52rpx;
+}
+
+.jiudianbottomleft {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12rpx 34rpx;
+  box-sizing: border-box;
+  width: 350rpx;
+}
+
+.jiudianbottomright {
+  width: 400rpx;
+  height: 98rpx;
+  background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
+  opacity: 1;
+  color: #fff;
+  font-size: 32rpx;
+  text-align: center;
+  line-height: 98rpx;
+}
+
+.jiudianbottom {
+  display: flex;
+  align-items: center;
+}
+
+.jiudianitem {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
+.jiudianitemtop {
+  width: 40rpx;
+  height: 40rpx;
+  font-size: 0;
+}
+
+.jiudianitembot {
+  color: #bdc4ce;
+  font-size: 22rpx;
+}
+
+.kename {
+  color: #ff5a4e;
+  font-size: 22rpx;
+}
+
+.fangjietop {
+  width: 686rpx;
+  height: 320rpx;
+  font-size: 0;
+  margin: 28rpx auto 0;
+}
+
+.fangjieshao {
+  padding: 0 32rpx 0rpx;
+  box-sizing: border-box;
+  margin-bottom:54rpx;
+}
+
+.fangjieleft {
+  color: #06121e;
+  font-size: 32rpx;
+  font-weight: bold;
+}
+
+.fangjiebot {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-top: 32rpx;
+  padding: 0 32rpx;
+  box-sizing: border-box
+}
+
+.fangjieprice {
+  color: #ff5a4e;
+  font-size: 24rpx;
+  font-weight: bold;
+}
+
+.fangjiabot {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-top:14rpx;
+  padding: 0 32rpx;
+  box-sizing: border-box
+
+}
+
+.fangjiabotlefttop {
+  color: #8c9198;
+  font-size: 24rpx;
+}
+
+.fangjiabotbottom {
+  color: #ff5a4e;
+  font-size: 22rpx;
+}
+.jinzhang{
+  color:#EB9E52;
+  font-size: 22rpx;
+  margin-left:40rpx;
+}
+
+.fangjiabotright {
+  width: 150rpx;
+  height: 60rpx;
+  background: rgba(255, 90, 78, 1);
+  opacity: 1;
+  border-radius: 40rpx;
+  color:#fff;
+  font-size: 28rpx;
+  text-align: center;
+  line-height: 60rpx
+}
+.fangjieshaoitem{
+  background: #fff;
+  padding-bottom: 30rpx
+}
+
+.yudingqita{
+  width:240rpx;
+  height:60rpx;
+  background:rgba(255,90,78,1);
+  opacity:1;
+  border-radius:40rpx;
+  display:flex;
+  align-items: center;
+  padding: 0 24rpx;
+  box-sizing: border-box
+}
+.yudingqitaleft{
+  color:#fff;
+  font-size: 28rpx;
+}
+.yudingyou{
+  width:22rpx;
+  height:22rpx;
+  font-size: 0;
+  margin-left:5rpx;
+}

+// pages/gonglue/gonglue.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "navigationBarTitleText": "攻略"
+}

+<view class="gongluelist">
+  <view class="gonglueitem">
+    <image src="/img/hangzhou.png"></image>
+
+    <view class="gonglueword">
+      <view class="wordtop">朗丽兹西山花园酒店</view>
+
+      <view class="wordbottom">
+        <view class="wordbotleft">
+          <image src="/img/weizhi.png"></image>
+        </view>
+        <view class="wordbotright">海淀区吴镇蔓图精品民宿</view>
+      </view>
+    </view>
+
+    <view class="gongluepic">
+      <view class="gongluetu">
+        <image src="/img/hong.png"></image>
+      </view>
+      <view class="peoplenum">58人种草</view>
+    </view>
+
+
+  </view>
+  <view class="gonglueitem">
+    <image src="/img/hangzhou.png"></image>
+
+    <view class="gonglueword">
+      <view class="wordtop">朗丽兹西山花园酒店</view>
+
+      <view class="wordbottom">
+        <view class="wordbotleft">
+          <image src="/img/weizhi.png"></image>
+        </view>
+        <view class="wordbotright">海淀区吴镇蔓图精品民宿</view>
+      </view>
+    </view>
+
+    <view class="gongluepic">
+      <view class="gongluetu">
+        <image src="/img/hong.png"></image>
+      </view>
+      <view class="peoplenum">58人种草</view>
+    </view>
+
+
+  </view>
+  <view class="gonglueitem">
+    <image src="/img/hangzhou.png"></image>
+
+    <view class="gonglueword">
+      <view class="wordtop">朗丽兹西山花园酒店</view>
+
+      <view class="wordbottom">
+        <view class="wordbotleft">
+          <image src="/img/weizhi.png"></image>
+        </view>
+        <view class="wordbotright">海淀区吴镇蔓图精品民宿</view>
+      </view>
+    </view>
+
+    <view class="gongluepic">
+      <view class="gongluetu">
+        <image src="/img/hong.png"></image>
+      </view>
+      <view class="peoplenum">58人种草</view>
+    </view>
+
+
+  </view>
+  <view class="gonglueitem">
+    <image src="/img/hangzhou.png"></image>
+
+    <view class="gonglueword">
+      <view class="wordtop">朗丽兹西山花园酒店</view>
+
+      <view class="wordbottom">
+        <view class="wordbotleft">
+          <image src="/img/weizhi.png"></image>
+        </view>
+        <view class="wordbotright">海淀区吴镇蔓图精品民宿</view>
+      </view>
+    </view>
+
+    <view class="gongluepic">
+      <view class="gongluetu">
+        <image src="/img/hong.png"></image>
+      </view>
+      <view class="peoplenum">58人种草</view>
+    </view>
+
+
+  </view>
+</view>

+.gonglueitem{
+  width:686rpx;
+  height:368rpx;
+  font-size: 0;
+  margin:26rpx auto 0;
+  border-radius: 16rpx;
+  position: relative
+}
+.wordbottom{
+  width:338rpx;
+  height:52rpx;
+  background:rgba(0,0,0,1);
+  opacity:0.5;
+  border-radius:28rpx;
+  background: #000000;
+  margin-top:16rpx;
+  display:flex;
+  align-items: center;
+  padding: 10rpx 20rpx;
+  box-sizing: border-box;
+ 
+}
+.gonglueword{
+  position: absolute;
+  top:222rpx;
+  left:38rpx;
+}
+.wordtop{
+  color:#FFFFFF;
+  font-size: 36rpx;
+}
+
+.wordbotleft{
+  width:24rpx;
+  height:24rpx;
+  font-size: 0
+}
+.wordbotright{
+  color:#fff;
+  font-size: 24rpx;
+  margin-left:10rpx;
+}
+.gongluetu{
+  width:142rpx;
+  height:48rpx;
+  font-size: 0;
+  position: relative
+}
+.gongluepic{
+  position: absolute;
+  top:30rpx;
+  right:0;
+  
+}
+.peoplenum{
+  color:#FFFFFF;
+  font-size: 24rpx;
+  position: absolute;
+  top:8rpx;
+  right:14rpx;
+}
+.gongluelist{
+  margin-bottom:36rpx;
+}

+// pages/gongluedetail/gongluedetail.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    imgUrls: [
+      '/img/tuijianimg1.png',
+      '/img/tuijianimg1.png',
+      '/img/tuijianimg1.png',
+    ],
+    indicatorDots: false,
+    autoplay: true,
+    interval: 2000,
+    duration: 1000,
+    currentSwiper: 0,
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  swiperChange: function (e) {
+    this.setData({
+      currentSwiper: e.detail.current
+    })
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "navigationBarTitleText": "攻略详情"
+}

+<!-- <view class="gongdetailtop">
+  <image src="/img/tuijianimg1.png"></image>
+
+  
+
+
+</view> -->
+
+
+<view class="swiper_image">
+  <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" class="swiper_item_img" bindchange="swiperChange">
+    <block wx:for="{{imgUrls}}" wx:key="doct">
+      <swiper-item style="border-radius:10px;">
+        <image src="{{item}}" data-index='{{index}}' class="slide-image" bindtap='viewImg' width="355" height="150" />
+
+
+      </swiper-item>
+    </block>
+
+
+
+
+
+   
+  </swiper>
+
+   <view class="dongdetailbot">
+
+      <view class="topimg">
+        <image src="/img/hong.png"></image>
+      </view>
+
+      <view class="zhongcaoname">58人种草</view>
+    </view>
+
+  <view class="dots">
+    <block wx:for="{{imgUrls}}" wx:key="">
+      <view class="dot{{index == currentSwiper ? ' active' : ''}}"></view>
+    </block>
+  </view>
+
+</view>
+
+
+<view class="gongdetailbox">
+  <view class="detailboxhead">
+    <view class="detailboxtop">西湖美景民宿</view>
+    <view class="detailboxbotm">
+      <view class="detailboxbotleft">
+        <image src="/img/ditu.png"></image>
+      </view>
+
+      <view class="detailboxbotright">杭州西湖风景民宿</view>
+    </view>
+  </view>
+
+  <view class="gongluebox">
+    <view class="gonglueboxitem">
+      <view class="gongboxtop">
+        <text class="textnum">01</text>
+        <text class="textwen">在闹中取静的西湖，体验地道的本土生活</text>
+      </view>
+
+      <view class="gongboximg">
+        <image src="/img/dali.png"></image>
+      </view>
+
+      <view class="gongboxtext">杭州处于亚热带季风区，四季分明，、夏季气候炎热，湿润，是新四大火炉之一。相反，冬季寒冷，干燥。春秋两季气候宜人，是观光旅游的黄金季节。</view>
+    </view>
+
+    <view class="gonglueboxitem">
+      <view class="gongboxtop">
+        <text class="textnum">01</text>
+        <text class="textwen">在闹中取静的西湖，体验地道的本土生活</text>
+      </view>
+
+      <view class="gongboximg">
+        <image src="/img/dali.png"></image>
+      </view>
+
+      <view class="gongboxtext">杭州处于亚热带季风区，四季分明，、夏季气候炎热，湿润，是新四大火炉之一。相反，冬季寒冷，干燥。春秋两季气候宜人，是观光旅游的黄金季节。</view>
+    </view>
+
+
+    <view class="gonglueboxitem">
+      <view class="gongboxtop">
+        <text class="textnum">01</text>
+        <text class="textwen">在闹中取静的西湖，体验地道的本土生活</text>
+      </view>
+
+      <view class="gongboximg">
+        <image src="/img/dali.png"></image>
+      </view>
+
+      <view class="gongboxtext">杭州处于亚热带季风区，四季分明，、夏季气候炎热，湿润，是新四大火炉之一。相反，冬季寒冷，干燥。春秋两季气候宜人，是观光旅游的黄金季节。</view>
+    </view>
+
+    <view class="gonglueboxitem">
+      <view class="gongboxtop">
+        <text class="textnum">01</text>
+        <text class="textwen">在闹中取静的西湖，体验地道的本土生活</text>
+      </view>
+
+      <view class="gongboximg">
+        <image src="/img/dali.png"></image>
+      </view>
+
+      <view class="gongboxtext">杭州处于亚热带季风区，四季分明，、夏季气候炎热，湿润，是新四大火炉之一。相反，冬季寒冷，干燥。春秋两季气候宜人，是观光旅游的黄金季节。</view>
+    </view>
+  </view>
+
+
+</view>
+
+
+<view class="ongbottom">
+  <view class="gongbottmleft">
+
+    <view class="gongimgtop">
+      <view class="gongbotleftimg">
+        <image src="/img/xin.png"></image>
+      </view>
+
+      <view class="gongimgtext">已种草</view>
+
+    </view>
+
+    <view class="bongbotrig">
+
+      <text class="buyname">购买会员免费入住</text>
+
+
+
+      <view class="redyou">
+        <image src="/img/redyou.png"></image>
+      </view>
+
+    </view>
+  </view>
+
+  <view class="gongbottmright">攻略中的民宿</view>
+
+
+</view>

+page {
+  background: #fff;
+}
+
+.gongdetailtop {
+  width: 750rpx;
+  height: 376rpx;
+  font-size: 0;
+  position: relative;
+}
+
+.dongdetailbot {
+  position: absolute;
+  top: 46rpx;
+  right: 0;
+}
+
+.topimg {
+  width: 142rpx;
+  height: 48rpx;
+  font-size: 0;
+  position: relative;
+}
+
+.zhongcaoname {
+  color: #fff;
+  font-size: 24rpx;
+  position: absolute;
+  top: 6rpx;
+  right: 14rpx;
+}
+
+.gongdetailbox {
+  padding: 0 32rpx;
+  box-sizing: border-box;
+}
+
+.detailboxtop {
+  color: #06121e;
+  font-size: 40rpx;
+  font-weight: bold;
+  margin-top: 40rpx;
+}
+
+.detailboxhead {
+  border-bottom: 24rpx solid #f9f9f9;
+}
+
+.detailboxbotm {
+  display: flex;
+  align-items: center;
+  padding: 32rpx 0;
+  box-sizing: border-box;
+}
+
+.detailboxbotleft {
+  width: 35rpx;
+  height: 33rpx;
+  font-size: 0;
+}
+
+.detailboxbotright {
+  color: #06121e;
+  font-size: 28rpx;
+  margin-left: 20rpx;
+  width: 615rpx;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.gongboximg {
+  width: 684rpx;
+  height: 392rpx;
+  font-size: 0;
+  margin-top: 20rpx;
+}
+
+.gongboxtext {
+  color: #06121e;
+  font-size: 28rpx;
+  margin-top: 40rpx;
+}
+
+.textnum {
+  color: #06121e;
+  font-size: 44rpx;
+  font-weight: bold;
+}
+
+.textwen {
+  color: #06121e;
+  font-size: 36rpx;
+  font-weight: bold;
+  margin-left: 10rpx;
+}
+
+.gonglueboxitem {
+  margin-bottom: 24rpx;
+}
+
+.gongboxtop {
+  margin-top: 50rpx;
+}
+
+.gongbottmleft {
+  display: flex;
+  align-items: center;
+   padding: 8rpx 32rpx;
+  box-sizing: border-box;
+}
+
+.gongbotleftimg {
+  width: 60rpx;
+  height: 50rpx;
+  font-size: 0;
+}
+
+.ongbottom {
+ 
+  display:flex;
+  align-items: center;
+  justify-content: space-between
+}
+
+.gongimgtext {
+  color: #ff5a4e;
+  font-size: 24rpx;
+}
+
+.bongbotrig {
+  color: #ff5a4e;
+  font-size: 22rpx;
+  margin-left: 74rpx;
+  display:flex;
+  align-items: center
+}
+
+.gongbottmright {
+  width: 296rpx;
+  height: 98rpx;
+  background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
+  opacity: 1;
+  color:#fff;
+  font-size: 32rpx;
+  text-align: center;
+  line-height: 98rpx;
+
+}
+.sanjiao{
+  font-size: 30rpx;
+}
+
+.redyou{
+  width:20rpx;
+  height:20rpx;
+  font-size: 0;
+  margin-left:10rpx;
+}
+.swiper_image{
+  position: relative
+}

+// pages/hoteldetail/hoteldetail.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    imgUrls: [
+      '/img/tuijianimg1.png',
+      '/img/tuijianimg1.png',
+      '/img/tuijianimg1.png',
+    ],
+    indicatorDots: false,
+    autoplay: true,
+    interval: 2000,
+    duration: 1000,
+    currentSwiper: 0,
+    selitem:4
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  selkind(e){
+    this.setData({
+      selitem:e.currentTarget.dataset.type
+    })
+  },
+  swiperChange: function (e) {
+    this.setData({
+      currentSwiper: e.detail.current
+    })
+  },
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "navigationBarTitleText": "酒店详情"
+}

+<view class="swiper_image">
+  <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" class="swiper_item_img" bindchange="swiperChange">
+    <block wx:for="{{imgUrls}}" wx:key="doct">
+      <swiper-item style="border-radius:10px;">
+        <image src="{{item}}" data-index='{{index}}' class="slide-image" bindtap='viewImg' width="355" height="150" />
+      </swiper-item>
+    </block>
+  </swiper>
+
+  <view class="dots">
+    <block wx:for="{{imgUrls}}" wx:key="">
+      <view class="dot{{index == currentSwiper ? ' active' : ''}}"></view>
+    </block>
+  </view>
+
+</view>
+
+<view class="minsuintor">
+  <view class="minsutou">蔓图精品民宿</view>
+
+  <view class="suconcatbox">
+    <view class="suhead suheadone">
+      <view class="suheadleft">
+        <view class="suheadleimg">
+          <image src="/img/ditu.png"></image>
+        </view>
+
+        <view class="sunheadword">北京海淀区蔓图精品民宿</view>
+
+
+      </view>
+
+      <view class="suheadright">
+        <image src="/img/dianhua.png"></image>
+      </view>
+    </view>
+
+    <view class="suhead suheadsec">
+      <view class="suheadleft">
+        <view class="suheadleimg">
+          <image src="/img/haibao.png"></image>
+        </view>
+
+        <view class="sunheadword">08月29日-08月31日</view>
+      </view>
+      <view class="ruzhuright">
+        <view class="ruzhu">
+          入住
+          <text class="ruzhunum">2</text>晚
+        </view>
+
+        <view class="ruzhuyou">
+          <image src="/img/yourow.png"></image>
+        </view>
+      </view>
+
+    </view>
+  </view>
+</view>
+
+<view class="minsulist">
+  <view class='minsuitem {{selitem==1?"selactive":""}}' bindtap="selkind" data-type="1">房型介绍</view>
+  <view class='minsuitem {{selitem==2?"selactive":""}}' bindtap="selkind" data-type="2">酒店介绍</view>
+  <view class='minsuitem {{selitem==3?"selactive":""}}' bindtap="selkind" data-type="3">入住须知</view>
+  <view class='minsuitem {{selitem==4?"selactive":""}}' bindtap="selkind" data-type="4">游玩攻略</view>
+</view>
+
+
+<!-- 房型介绍 -->
+
+<view class="fangxing" wx:if="{{selitem==1}}">
+  <view class="jiudainjie">
+    <view class="jiudianjieleft">酒店介绍</view>
+    <view class="judianjieright">
+      <image src="/img/yourow.png"></image>
+    </view>
+  </view>
+
+  <view class="jiudainjie fuwujie">
+    <view class="jiudianjieleft">设施服务</view>
+    <view class="judianjieright">
+      <image src="/img/yourow.png"></image>
+    </view>
+  </view>
+
+</view>
+
+<!-- 酒店介绍 -->
+<view class="jiudianbigbox" wx:if="{{selitem==2}}">
+
+
+  <view class="jiudianintortext">
+    <view class="jiudainjieintro">
+      <view class="jiudianjieleft">酒店介绍</view>
+      <view class="judianjieright intoryou">
+        <image src="/img/yourow.png"></image>
+      </view>
+    </view>
+
+    <view class="jiudiancontentitem">
+      <view class="jiudianboxtop">
+        <view class="jiudiantopleft">
+          <image src="/img/jieshaojiu.png"></image>
+        </view>
+        <view class="jiudianhuan">周边环境</view>
+
+      </view>
+
+      <view class="zhoubiantext">
+        上海艾格瑞公寓位于具有“上海缩影”之称的虹口，坐拥浦江繁华内环核心，占据内环具有价值“黄金三角生活圈”。公寓毗邻瑞虹天地商圈、四川北路商圈、海伦路商圈之众多商场和写字楼，步行可达和平公园、鲁迅公园、1933老场坊、多伦路文化名人街，乘车前往外滩、陆家嘴约十余分钟。 　　公寓设有标准层和行政层，标准层设有7种各具特色的北欧风房型，行政层设有3种舒适简约套房房型，每间房间配有无线上网服务。
+      </view>
+    </view>
+
+    <view class="jiudiancontentitem">
+      <view class="jiudianboxtop">
+        <view class="jiudiantopleft">
+          <image src="/img/shejistyle.png"></image>
+        </view>
+        <view class="jiudianhuan">设计风格</view>
+
+      </view>
+
+      <view class="zhoubiantext">
+        酒店设计现代、简约。 游玩回到水晶可以在露台喝茶聊天，看书发呆。尽情享受度假时光。
+      </view>
+    </view>
+    <view class="jiudiancontentitem">
+      <view class="jiudianboxtop">
+        <view class="jiudiantopleft">
+          <image src="/img/jiaotong.png"></image>
+        </view>
+        <view class="jiudianhuan">交通路线</view>
+
+      </view>
+
+      <view class="zhoubiantext">
+        酒店临近16号线永丰南站，步行4分钟即可到达地铁站；
+      </view>
+    </view>
+
+    <view class="jiudiancontentitem">
+      <view class="jiudianboxtop">
+        <view class="jiudiantopleft">
+          <image src="/img/tuijianreson.png"></image>
+        </view>
+        <view class="jiudianhuan">推荐理由</view>
+
+      </view>
+
+      <view class="zhoubiantext">
+        公寓内还设有健身房、咖啡厅、公共会客厅、棋牌桌游吧、会议室、商务中心等设施。在这里，可以充分感受上海气息的品质居住体验，愿能成为您商务、旅行下榻的优选。
+      </view>
+    </view>
+
+
+  </view>
+
+
+
+  <!-- 设施服务 -->
+
+  <view class="jiudianintortext">
+    <view class="jiudainjieintro">
+      <view class="jiudianjieleft">设施服务</view>
+      <view class="judianjieright intoryou">
+        <image src="/img/yourow.png"></image>
+      </view>
+    </view>
+
+    <view class="jiaotong">
+
+      <view class="jiaotongitem">
+        <view class="jiaotongtop">交通服务</view>
+
+        <view class="jiaotongbottom">
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">免费停车</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">自行车租赁服务</view>
+          </view>
+        </view>
+      </view>
+
+      <view class="jiaotongitem">
+        <view class="jiaotongtop">餐饮服务</view>
+
+        <view class="jiaotongbottom">
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">中餐厅</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">咖啡厅</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">送餐服务</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">烧烤</view>
+          </view>
+        </view>
+      </view>
+
+      <view class="jiaotongitem">
+        <view class="jiaotongtop">网络设施</view>
+
+        <view class="jiaotongbottom">
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">客房WIFI</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">公共区域WIFI</view>
+          </view>
+        </view>
+      </view>
+
+
+      <view class="jiaotongitem">
+        <view class="jiaotongtop">娱乐和健身设施</view>
+
+        <view class="jiaotongbottom">
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">茶室</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">健身房</view>
+          </view>
+        </view>
+      </view>
+
+
+      <view class="jiaotongitem">
+        <view class="jiaotongtop">服务项目</view>
+
+        <view class="jiaotongbottom">
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">会议室</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">全天前天</view>
+          </view>
+        </view>
+      </view>
+
+    </view>
+
+
+
+  </view>
+
+
+
+</view>
+<!-- 入住须知 -->
+
+<view class="ruzhuxuzhi" wx:if="{{selitem==3}}">
+  <view class="ruzhuxuname">入住须知</view>
+  <view></view>
+
+</view>
+
+<!-- 游玩攻略 -->
+<view class="youwangong" wx:if="{{selitem==4}}">
+
+  <view class="youwanitem">
+    <view class="youwantop">在·杭州</view>
+
+    <view class="youwantextname">为您解锁地区</view>
+
+    <view class='youwanimgbox'>
+      <view class="youwanimg">
+        <image src="/img/lineimg2.png"></image>
+      </view>
+      <view class="youwanimg">
+        <image src="/img/lineimg2.png"></image>
+      </view>
+      <view class="youwanimg">
+        <image src="/img/lineimg2.png"></image>
+      </view>
+    </view>
+
+    <view class="youwantext">杭州处于亚热带季风区，四季分明，、夏季气候炎热，湿润，是新四大火炉之一。相反，冬季寒冷，干燥。春秋两季气候宜人，是观光旅游的黄金季节。</view>
+  </view>
+  <view class="youwanitem">
+    <view class="youwantop">在·杭州</view>
+
+    <view class="youwantextname">为您解锁地区</view>
+
+    <view class='youwanimgbox'>
+      <view class="youwanimg">
+        <image src="/img/lineimg2.png"></image>
+      </view>
+      <view class="youwanimg">
+        <image src="/img/lineimg2.png"></image>
+      </view>
+      <view class="youwanimg">
+        <image src="/img/lineimg2.png"></image>
+      </view>
+    </view>
+
+    <view class="youwantext">杭州处于亚热带季风区，四季分明，、夏季气候炎热，湿润，是新四大火炉之一。相反，冬季寒冷，干燥。春秋两季气候宜人，是观光旅游的黄金季节。</view>
+  </view>
+  <view class="youwanitem">
+    <view class="youwantop">在·杭州</view>
+
+    <view class="youwantextname">为您解锁地区</view>
+
+    <view class='youwanimgbox'>
+      <view class="youwanimg">
+        <image src="/img/lineimg2.png"></image>
+      </view>
+      <view class="youwanimg">
+        <image src="/img/lineimg2.png"></image>
+      </view>
+      <view class="youwanimg">
+        <image src="/img/lineimg2.png"></image>
+      </view>
+    </view>
+
+    <view class="youwantext">杭州处于亚热带季风区，四季分明，、夏季气候炎热，湿润，是新四大火炉之一。相反，冬季寒冷，干燥。春秋两季气候宜人，是观光旅游的黄金季节。</view>
+  </view>
+  <view class="youwanitem">
+    <view class="youwantop">在·杭州</view>
+
+    <view class="youwantextname">为您解锁地区</view>
+
+    <view class='youwanimgbox'>
+      <view class="youwanimg">
+        <image src="/img/lineimg2.png"></image>
+      </view>
+      <view class="youwanimg">
+        <image src="/img/lineimg2.png"></image>
+      </view>
+      <view class="youwanimg">
+        <image src="/img/lineimg2.png"></image>
+      </view>
+    </view>
+
+    <view class="youwantext">杭州处于亚热带季风区，四季分明，、夏季气候炎热，湿润，是新四大火炉之一。相反，冬季寒冷，干燥。春秋两季气候宜人，是观光旅游的黄金季节。</view>
+  </view>
+  <view class="youwanitem">
+    <view class="youwantop">在·杭州</view>
+
+    <view class="youwantextname">为您解锁地区</view>
+
+    <view class='youwanimgbox'>
+      <view class="youwanimg">
+        <image src="/img/lineimg2.png"></image>
+      </view>
+      <view class="youwanimg">
+        <image src="/img/lineimg2.png"></image>
+      </view>
+      <view class="youwanimg">
+        <image src="/img/lineimg2.png"></image>
+      </view>
+    </view>
+
+    <view class="youwantext">杭州处于亚热带季风区，四季分明，、夏季气候炎热，湿润，是新四大火炉之一。相反，冬季寒冷，干燥。春秋两季气候宜人，是观光旅游的黄金季节。</view>
+  </view>
+
+</view>
+
+<view class="jiudianbottom">
+  <view class="jiudianbottomleft">
+    <view class="jiudianitem">
+      <view class="jiudianitemtop">
+        <image src="/img/pin.png"></image>
+      </view>
+
+      <view class="jiudianitembot">首页</view>
+    </view>
+    <view class="jiudianitem">
+      <view class="jiudianitemtop">
+        <image src="/img/kefu.png"></image>
+      </view>
+
+      <view class="jiudianitembot kename">客服</view>
+    </view>
+    <view class="jiudianitem">
+      <view class="jiudianitemtop">
+        <image src="/img/shou.png"></image>
+      </view>
+
+      <view class="jiudianitembot">收藏</view>
+    </view>
+  </view>
+
+  <view class="jiudianbottomright">购买会员免费入住</view>
+</view>

+page {
+  background: #f7f7f7;
+}
+
+.minsuintor {
+  padding: 40rpx 44rpx;
+  box-sizing: border-box;
+  background: #fff;
+}
+
+.minsutou {
+  color: #06121e;
+  font-size: 38rpx;
+  font-weight: bold;
+}
+
+.suhead {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 30rpx 32rpx 30rpx 0;
+  box-sizing: border-box;
+}
+
+.suheadone {
+  margin-top: 32rpx;
+}
+
+.suheadsec {
+  margin-top: 16rpx;
+}
+
+.suheadleft {
+  display: flex;
+  align-items: center;
+}
+
+.suheadleimg {
+  width: 40rpx;
+  height: 40rpx;
+  font-size: 0;
+}
+
+.sunheadword {
+  color: #06121e;
+  font-size: 28rpx;
+  margin-left: 12rpx;
+}
+
+.suheadright {
+  width: 44rpx;
+  height: 44rpx;
+  font-size: 0;
+}
+
+.ruzhu {
+  color: #06121e;
+  font-size: 28rpx;
+}
+
+.ruzhunum {
+  color: #ff5a4e;
+  font-size: 28rpx;
+}
+
+.ruzhuright {
+  display: flex;
+  align-items: center;
+}
+
+.ruzhuyou {
+  width: 18rpx;
+  height: 18rpx;
+  font-size: 0;
+  margin-left: 16rpx;
+}
+
+.minsulist {
+  display: flex;
+  align-items: center;
+  padding: 32rpx 58rpx;
+  box-sizing: border-box;
+  justify-content: space-between;
+  background: #fff;
+}
+
+.minsuitem {
+  color: #06121e;
+  font-size: 26rpx;
+}
+
+.selactive {
+  color: #06121e;
+  font-size: 38rpx;
+  font-weight: bold;
+  position: relative;
+}
+
+.selactive::after {
+  position: absolute;
+  display: block;
+  content: '';
+  width: 48rpx;
+  height: 6rpx;
+  background: #ff5a4e;
+  left: 50%;
+  right: 50%;
+  transform: translateX(-50%);
+  bottom: -12rpx;
+  border-radius: 4rpx;
+}
+
+.judianjieright {
+  width: 34rpx;
+  height: 34rpx;
+  font-size: 0;
+}
+
+.jiudainjie {
+  width: 686rpx;
+  margin: 24rpx auto;
+  padding: 38rpx 32rpx;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  box-shadow: 0px 16rpx 24rpx rgba(0, 0, 0, 0.02);
+  opacity: 1;
+  border-radius: 20rpx;
+  background: #fff;
+}
+
+.jiudainjieintro {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 40rpx 0;
+  box-sizing: border-box;
+}
+
+.jiudianjieleft {
+  color: #06121e;
+  font-size: 32rpx;
+  font-weight: bold;
+}
+
+.fuwujie {
+  margin-bottom: 52rpx;
+}
+
+.jiudianbottomleft {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12rpx 34rpx;
+  box-sizing: border-box;
+  width: 350rpx;
+  background: #fff;
+}
+
+.jiudianbottomright {
+  width: 400rpx;
+  height: 98rpx;
+  background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
+  opacity: 1;
+  color: #fff;
+  font-size: 32rpx;
+  text-align: center;
+  line-height: 98rpx;
+}
+
+.jiudianbottom {
+  display: flex;
+  align-items: center;
+  position: fixed;
+  bottom: 0;
+}
+
+.jiudianitem {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
+.jiudianitemtop {
+  width: 40rpx;
+  height: 40rpx;
+  font-size: 0;
+}
+
+.jiudianitembot {
+  color: #bdc4ce;
+  font-size: 22rpx;
+}
+
+.kename {
+  color: #ff5a4e;
+  font-size: 22rpx;
+}
+
+.jiudianboxtop {
+  display: flex;
+  align-items: center;
+  margin-top: 38rpx;
+}
+
+.jiudiantopleft {
+  width: 48rpx;
+  height: 48rpx;
+  font-size: 0;
+}
+
+.jiudianintortext {
+  width: 686rpx;
+  margin: 24rpx auto 0;
+  padding: 0 32rpx 24rpx;
+  box-sizing: border-box;
+  box-shadow: 0px 16px 24px rgba(0, 0, 0, 0.02);
+  opacity: 1;
+  border-radius: 20px;
+  background: #fff;
+}
+
+.jiudianhuan {
+  color: #06121e;
+  font-size: 32rpx;
+  margin-left: 10rpx;
+}
+
+.zhoubiantext {
+  color: #5b5e63;
+  font-size: 28rpx;
+  margin-top: 24rpx;
+}
+
+.jiudianbigbox {
+  margin-bottom: 156rpx;
+}
+
+.jiaotongtop {
+  color: #06121e;
+  font-size: 30rpx;
+}
+
+.jiaotongitemleft {
+  width: 48rpx;
+  height: 48rpx;
+  font-size: 0;
+}
+
+.jiaotongbottomitem {
+  display: flex;
+  align-items: center;
+  margin-top: 16rpx;
+  margin-right: 40rpx;
+}
+
+.jiaotongitemname {
+  color: #5b5e63;
+  font-size: 28rpx;
+  margin-left: 12rpx;
+}
+
+.jiaotongbottom {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+.jiaotongitem {
+  margin-top: 20rpx;
+}
+
+.fangxing {
+  margin-bottom: 146rpx;
+}
+
+.intoryou {
+  width: 30rpx;
+  height: 30rpx;
+  font-size: 0;
+  transform: rotate(90deg);
+}
+
+/* 入住须知 */
+
+.ruzhuxuzhi {
+  width: 686rpx;
+ 
+  background: rgba(255, 255, 255, 1);
+  box-shadow: 0px 16rpx 24rpx rgba(0, 0, 0, 0.02);
+  opacity: 1;
+  border-radius: 20rpx;
+  padding: 40rpx 32rpx;
+  box-sizing: border-box;
+  margin: 24rpx auto 0;
+}
+.ruzhuxuname{
+  color:#06121E;
+  font-size: 32rpx;
+  font-weight: bold;
+
+}
+.youwangong{
+  /* padding: 50rpx 0rpx 50rpx 32rpx;
+  box-sizing: border-box; */
+  background: #fff;
+  margin-top:24rpx;
+  margin-bottom:156rpx;
+}
+.youwanitem{
+  padding:50rpx 0 50rpx 32rpx;
+  box-sizing: border-box 
+}
+
+/* 游玩攻略 */
+.youwantop{
+  color:#06121E;
+  font-size: 36rpx;
+  font-weight:bold;
+}
+.youwantextname{
+  color:#8C9198;
+  font-size: 24rpx;
+  margin-top:5rpx;
+  
+}
+.youwanimgbox{
+  display:flex;
+  align-items: center;
+  overflow-x: scroll;
+  margin-top:34rpx;
+  
+}
+.youwanimg{
+  width:670rpx;
+  height: 392rpx;
+  font-size: 0;
+  flex:0 0 auto;
+  margin-right:20rpx;
+}
+.youwantext{
+  color:#06121E;
+  font-size: 28rpx;
+  width:656rpx;
+  margin:34rpx auto 0;
+}

+// pages/houselist/houselist.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    showlist:false
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+ "navigationBarTitleText": "房源列表"
+}

+<view class="headlist">
+  <view class="headlistleft">
+    <view class="leftimg">
+      <image src="/img/sousuo.png"></image>
+    </view>
+    <view class="headenter">
+      <input placeholder='' placeholder-class="enterword" />
+    </view>
+  </view>
+
+  <view class="housetime">
+    <view class="houseleft">
+      <view class="houselefttop">08月21日</view>
+      <view class="houseleftbottom">(周三入住)</view>
+    </view>
+
+    <view class="middletime">
+
+      <view class="housemiddle">
+        <view class="housemiddletop">共2晚</view>
+        <image src="/img/rowright.png"></image>
+      </view>
+    </view>
+
+    <view class="houseleft">
+      <view class="houselefttop">08月21日</view>
+      <view class="houseleftbottom">(周三入住)</view>
+    </view>
+  </view>
+
+
+  <view class="tuijian">
+
+    <view class="nodata" wx:if="{{showlist}}">
+
+      <view class="nodataimg">
+        <image src="/img/tuijian.png"></image>
+      </view>
+
+      <view class="nodatatext">
+        您搜索的 <text class="area">北京</text> 区域房源正在准备中，上线后将第一时间推送到您的首页，敬请期待！
+      </view>
+
+    </view>
+
+
+    <view class="tuijianlist" wx:else>
+      <view class="tuijianitem">
+        <view class="tuijainimg">
+          <image src="/img/tuijianimg1.png"></image>
+
+          <view class='linethirname tuituname'>
+
+            <view class="linethileft">
+              <image src="/img/weizhi.png"></image>
+            </view>
+            <view class="lineright">丽江 玉龙纳西族自治县</view>
+          </view>
+        </view>
+
+        <view class="tuijianintro">
+          <view class="tuijianname">朗丽兹西山花园酒店</view>
+          <view class="tuijianleft">
+            <view class="tuijainleftname">吴镇蔓图精品民宿</view>
+            <view class="tuijianrightname">
+              <view class="tuitu">
+                <image src="/img/ditu.png"></image>
+              </view>
+
+              <view class="dituname">海淀区蔓图精品民宿</view>
+            </view>
+          </view>
+
+          <view class="kind">
+            <view class="lindleft">
+              <view class="leftitem">原木轻著</view>
+              <view class="leftitem">豪华精致</view>
+
+            </view>
+            <view class="lieright">
+              <view class="lineleftmoney zhemoney">¥888</view>
+              <view class="lineleftmoney">会员免费</view>
+            </view>
+
+          </view>
+        </view>
+      </view>
+
+      <view class="tuijianitem">
+        <view class="tuijainimg">
+          <image src="/img/tuijianimg2.png"></image>
+
+          <view class='linethirname tuituname'>
+
+            <view class="linethileft">
+              <image src="/img/weizhi.png"></image>
+            </view>
+            <view class="lineright">丽江 玉龙纳西族自治县</view>
+          </view>
+        </view>
+
+        <view class="tuijianintro">
+          <view class="tuijianname">朗丽兹西山花园酒店</view>
+          <view class="tuijianleft">
+            <view class="tuijainleftname">吴镇蔓图精品民宿</view>
+            <view class="tuijianrightname">
+              <view class="tuitu">
+                <image src="/img/ditu.png"></image>
+              </view>
+
+              <view class="dituname">海淀区蔓图精品民宿</view>
+            </view>
+          </view>
+
+          <view class="kind">
+            <view class="lindleft">
+              <view class="leftitem">原木轻著</view>
+              <view class="leftitem">豪华精致</view>
+
+            </view>
+            <view class="lieright">
+              <view class="lineleftmoney zhemoney">¥888</view>
+              <view class="lineleftmoney">会员免费</view>
+            </view>
+
+          </view>
+        </view>
+      </view>
+      <view class="tuijianitem">
+        <view class="tuijainimg">
+          <image src="/img/tuijianimg3.png"></image>
+
+          <view class='linethirname tuituname'>
+
+            <view class="linethileft">
+              <image src="/img/weizhi.png"></image>
+            </view>
+            <view class="lineright">丽江 玉龙纳西族自治县</view>
+          </view>
+        </view>
+
+        <view class="tuijianintro">
+          <view class="tuijianname">朗丽兹西山花园酒店</view>
+          <view class="tuijianleft">
+            <view class="tuijainleftname">吴镇蔓图精品民宿</view>
+            <view class="tuijianrightname">
+              <view class="tuitu">
+                <image src="/img/ditu.png"></image>
+              </view>
+
+              <view class="dituname">海淀区蔓图精品民宿</view>
+            </view>
+          </view>
+
+          <view class="kind">
+            <view class="lindleft">
+              <view class="leftitem">原木轻著</view>
+              <view class="leftitem">豪华精致</view>
+
+            </view>
+            <view class="lieright">
+              <view class="lineleftmoney zhemoney">¥888</view>
+              <view class="lineleftmoney">会员免费</view>
+            </view>
+
+          </view>
+        </view>
+      </view>
+
+    </view>
+  </view>
+</view>

+@import '../lixiangzhong/lixiangzhong.wxss';
+page{
+  background: #fff
+}
+.headlistleft{
+  display:flex;
+  align-items: center;
+  justify-content: center;
+  padding: 40rpx 106rpx;
+  border-bottom:1rpx solid #f5f5f5;
+}
+.leftimg{
+  width:40rpx;
+  height:40rpx;
+  font-size: 0
+}
+.headenter input{
+  color:#8C9198;
+  font-size: 28rpx;
+}
+.headenter{
+  margin-left:20rpx;
+}
+.enterword{
+  color:#8C9198;
+  font-size: 28rpx;
+}
+.housetime{
+  display:flex;
+  align-items: center;
+   padding: 40rpx 106rpx;
+  box-sizing: border-box;
+  justify-content: space-between
+}
+.housemiddle{
+  width:96rpx;
+  height:56rpx;
+  font-size: 0;
+  position: relative
+}
+.houselefttop{
+  color:#06121E;
+  font-size: 36rpx;
+  font-weight: bold
+}
+.houseleftbottom{
+  color:#8C9198;
+  font-size:24rpx;
+  text-align: center;
+  margin-top:8rpx;
+}
+.housemiddletop{
+  width:80rpx;
+  color:#FF5A4E;
+  font-size: 24rpx;
+  text-align: center;
+  position: absolute;
+  top:-15rpx;
+ 
+}
+.nodataimg{
+  width:356rpx;
+  height:210rpx;
+  font-size: 0;
+  margin:58rpx auto 0;
+}
+.nodatatext{
+  color:#8C9198;
+  font-size: 24rpx;
+  width:524rpx;
+  margin:24rpx auto 0;
+  line-height: 1.6
+}
+.area{
+  color:#06121E;
+  font-size: 24rpx;
+}

+// pages/huiyuan/huiyuan.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "navigationBarTitleText": "会员"
+}

+<view class='huiyuanpage'>
+  <image src="/img/sun_81.png"></image>
+  <view class="pinzhi">
+    <view class="pinzhitop">品质住宿 全年免费</view>
+
+    <view class="pinzhilistbox">
+      <view class="pinzhilist">
+        <view class="pinzhileft">
+          <image src="/img/sun_21.png"></image>
+        </view>
+        <view class="pinzhiright">
+          <view class="buxiandiqu">不限地区</view>
+          <view class="pinzhibottom">全国范围消费任享</view>
+        </view>
+      </view>
+
+
+
+      <view class="pinzhilist">
+        <view class="pinzhileft">
+          <image src="/img/sun_22.png"></image>
+        </view>
+        <view class="pinzhiright">
+          <view class="buxiandiqu">不限酒店</view>
+          <view class="pinzhibottom">合作度假酒店全部通用</view>
+        </view>
+      </view>
+
+      <view class="pinzhilist">
+        <view class="pinzhileft">
+          <image src="/img/sun_23.png"></image>
+        </view>
+        <view class="pinzhiright">
+          <view class="buxiandiqu">不限时间</view>
+          <view class="pinzhibottom">节假日、周末均可入住</view>
+        </view>
+      </view>
+
+      <view class="pinzhilist">
+        <view class="pinzhileft">
+          <image src="/img/sun_24.png"></image>
+        </view>
+        <view class="pinzhiright">
+          <view class="buxiandiqu">不限次数</view>
+          <view class="pinzhibottom">有效期内不限定房次数</view>
+        </view>
+      </view>
+      <view class="pinzhilist">
+        <view class="pinzhileft">
+          <image src="/img/sun_25.png"></image>
+        </view>
+        <view class="pinzhiright">
+          <view class="buxiandiqu">消费无忧</view>
+          <view class="pinzhibottom">不住也能抵游侠旅游代金劵</view>
+        </view>
+      </view>
+
+      <view class="pinzhilist">
+        <view class="pinzhileft">
+          <image src="/img/sun_26.png"></image>
+        </view>
+        <view class="pinzhiright">
+          <view class="buxiandiqu">会员活动</view>
+          <view class="pinzhibottom">不定期下线活动，畅想会员特权</view>
+        </view>
+      </view>
+    </view>
+
+
+  </view>
+</view>
+
+<view class="dainilaiojie">
+  <image src="/img/sun_29.png"></image>
+
+  <view class="dainiliaojie">带你了解理想中会员</view>
+</view>
+
+<!-- 会员权益 -->
+
+<view class="huiyuan">
+
+  <view class="huioyuantop">
+    <view class="huiyuantopleft">会员权益</view>
+    <view class="huiyuantopright">
+      <image src="/img/yourow.png"></image>
+    </view>
+  </view>
+
+  <view class="huiyuantext">在会员有效期内免费入住本平台上的所有合作度假酒店，不限地区、不限酒店、不限总次数，所有合作房型不限时间随意挑选!您不入住也能将购买会员金额转为旅游侠旅游线路代金劵。 不定期可免费参加平台举办的不定期线下优质会员活动。</view>
+</view>
+
+<!-- 平台优势 -->
+
+
+<view class="huiyuan">
+
+  <view class="huioyuantop">
+    <view class="huiyuantopleft">平台优势</view>
+    <view class="huiyuantopright">
+      <image src="/img/yourow.png"></image>
+    </view>
+  </view>
+
+  <view class="pingtaiadvantage">
+    <view class="advantageleft">
+      <image src="/img/sun_88.png"></image>
+    </view>
+
+    <view class="advantageright">
+      我们的创业团队深耕与酒店、民宿、媒体、旅游、金融及互联网技术服务行业
+    </view>
+  </view>
+
+  <view class="pingtaiadvantage">
+    <view class="advantageleft">
+      <image src="/img/sun_89.png"></image>
+    </view>
+
+    <view class="advantageright">
+      原创策划出数千条深度旅游线路，并协同我们的优秀团队甄选出特色旅游度假民宿，为会员发掘优质旅宿产品
+    </view>
+  </view>
+
+
+</view>
+
+<!-- 精选酒店 -->
+
+<view class="jiudian">
+  <view class="huioyuantop">
+    <view class="huiyuantopleft">精选酒店</view>
+
+    <view class="jiudianright">
+
+      <view class="jiudianleft">持续更新中</view>
+      <view class="huiyuantopright">
+        <image src="/img/yourow.png"></image>
+      </view>
+    </view>
+
+  </view>
+
+  <view class="sholist">
+    <view class="sjopitem">
+      <view class="shopitemimg">
+        <image src="/img/anji.png"></image>
+      </view>
+
+      <view class="shoname">安吉</view>
+    </view>
+
+    <view class="sjopitem">
+      <view class="shopitemimg">
+        <image src="/img/tianjin.png"></image>
+      </view>
+
+      <view class="shoname">天津</view>
+    </view>
+    <view class="sjopitem">
+      <view class="shopitemimg">
+        <image src="/img/dali.png"></image>
+      </view>
+
+      <view class="shoname">大理</view>
+    </view>
+
+
+    <view class="sjopitem">
+      <view class="shopitemimg">
+        <image src="/img/fujian.png"></image>
+      </view>
+
+      <view class="shoname">福建</view>
+    </view>
+    <view class="sjopitem">
+      <view class="shopitemimg">
+        <image src="/img/suzhou.png"></image>
+      </view>
+
+      <view class="shoname">苏州</view>
+    </view>
+
+    <view class="sjopitem">
+      <view class="shopitemimg">
+        <image src="/img/hangzhou.png"></image>
+      </view>
+
+      <view class="shoname">杭州</view>
+    </view>
+  </view>
+
+  <view class="anpai">已上线72家酒店，覆盖24所城市</view>
+</view>
+
+<!-- 订房问题 -->
+
+<view class="huiyuan">
+
+  <view class="huioyuantop">
+    <view class="huiyuantopleft">订房问题</view>
+    <view class="huiyuantopright">
+      <image src="/img/yourow.png"></image>
+    </view>
+  </view>
+
+  <view class="huiyuantext">1、平台每月上新新民俗，保证房源供应，周末及节假日房源抢手，可提前安排行程，错峰出行，订房无压力。2、为了避免资源浪费，预订平台酒店需要支付预订保证金，会员在顺利办理退房手续后，将在一个工作日退还保证金</view>
+</view>
+
+<!-- 分享有礼 -->
+
+<view class="sharepresent">
+  <view class="huioyuantop">
+    <view class="huiyuantopleft">精选酒店</view>
+
+    <view class="jiudianright">
+
+      <view class="jiudianleft">持续更新中</view>
+      <view class="huiyuantopright">
+        <image src="/img/yourow.png"></image>
+      </view>
+    </view>
+
+  </view>
+
+  <view class="presentcontent">您可在“我的”页面一键生成并分享专属情怀海报。若有好友通过您的分享购买会员，每个会员100元的现金奖励放在您的个人账户。</view>
+
+  <view class="yudingti">
+    <view class='yudingtinum'>1</view>
+    <view class="yudingtiword">查看我想去的城市可无酒店？</view>
+  </view>
+
+  <view class="shareimg">
+    <image src="/img/share.png"></image>
+  </view>
+
+  <view class="yudingti">
+    <view class='yudingtinum'>2</view>
+    <view class="yudingtiword">登录状态下，长按保存海报</view>
+  </view>
+
+  <view class="savehai">
+    <image src="/img/savehaibao.png"></image>
+  </view>
+
+  <view class="yudingti">
+    <view class='yudingtinum'>3</view>
+    <view class="yudingtiword">您可以将海报分享到各大论坛</view>
+  </view>
+
+  <view class="fenhaibao">
+    <image src="/img/fenhaibao.png"></image>
+  </view>
+
+  <view class="yudingti">
+    <view class='yudingtinum'>4</view>
+    <view class="yudingtiword">在“我的”页面下方，点击“我的钱包”绑定银 行卡信息即可。
+    </view>
+  </view>
+
+
+  <view class="wode">
+    <image src="/img/wode.png"></image>
+  </view>
+</view>
+
+<!--底部导航 -->
+
+<view class="dibuinfo">
+  <view class="dibuinfoleft">
+    <view class="dibuitem">
+      <view class="dibuitemtop">
+        <image src="/img/pin.png"></image>
+      </view>
+
+      <view class="dibuitembottom">首页</view>
+    </view>
+
+    <view class="dibuitem">
+      <view class="dibuitemtop">
+        <image src="/img/kefu.png"></image>
+      </view>
+
+      <view class="dibuitembottom">客服</view>
+    </view>
+    <view class="dibuitem">
+      <view class="dibuitemtop">
+        <image src="/img/haibao.png"></image>
+      </view>
+
+      <view class="dibuitembottom">保存海报</view>
+    </view>
+  </view>
+
+  <view class="dibuinforight">立即购买会员</view>
+</view>

+page {
+  background: #fae3b2;
+}
+
+.huiyuanpage {
+  width: 750rpx;
+  height: 800rpx;
+  font-size: 0;
+  position: relative;
+}
+
+.pinzhi {
+  width: 684rpx;
+  height: 938rpx;
+  background: #fff;
+  border-radius: 16rpx;
+  margin: 0 auto;
+  position: absolute;
+  top: 635rpx;
+  left: 34rpx;
+}
+
+.pinzhitop {
+  width: 400rpx;
+  height: 80rpx;
+  background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
+  opacity: 1;
+  border-radius: 0px 0px 32rpx 32rpx;
+  margin: 0 auto;
+  color: #fff;
+  font-size: 32rpx;
+  text-align: center;
+  position: absolute;
+  top: -10rpx;
+  left: 142rpx;
+}
+
+.pinzhileft {
+  width: 32rpx;
+  height: 32rpx;
+  font-size: 0;
+}
+
+.pinzhilistbox {
+  margin-top: 116rpx;
+}
+
+.pinzhilist:first-child {
+  margin-top: 0;
+}
+
+.pinzhilist {
+  margin-top: 52rpx;
+  padding: 0 72rpx;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+}
+
+.buxiandiqu {
+  color: #06121e;
+  font-size: 28rpx;
+  font-weight: bold;
+}
+
+.pinzhibottom {
+  color: #8c9198;
+  font-size: 24rpx;
+}
+
+.pinzhiright {
+  margin-left: 24rpx;
+  margin-top: 12rpx;
+}
+
+.dainilaiojie {
+  width: 600rpx;
+  height: 106rpx;
+  font-size: 0;
+  margin: 821rpx auto 0;
+  position: relative;
+}
+
+.dainiliaojie {
+  color: #fff;
+  font-size: 32rpx;
+  position: absolute;
+  top: 28rpx;
+  left: 138rpx;
+}
+
+.huioyuantop {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.huiyuan {
+  width: 686rpx;
+  height: 406rpx;
+  background: #fff;
+  margin: 50rpx auto 0;
+  padding: 42rpx 32rpx;
+  box-sizing: border-box;
+  border-radius: 20rpx;
+}
+
+.huiyuantopleft {
+  color: #06121e;
+  font-size: 32rpx;
+  font-weight: bold;
+}
+
+.huiyuantopright {
+  width: 30rpx;
+  height: 30rpx;
+  font-size: 0;
+  transform: rotate(90deg);
+}
+
+.huiyuantext {
+  color: #5b5e63;
+  font-size: 28rpx;
+  margin-top: 72rpx;
+  height: 244rpx;
+  overflow-y: scroll;
+}
+
+.advantageleft {
+  width: 60rpx;
+  height: 60rpx;
+  font-size: 0;
+  flex: 0 0 auto;
+}
+
+.advantageright {
+  color: #5b5e63;
+  font-size: 28rpx;
+  margin-left: 12rpx;
+}
+
+.pingtaiadvantage {
+  display: flex;
+  margin-top: 58rpx;
+}
+
+/* 精选酒店 */
+
+.jiudian {
+  width: 686rpx;
+  height: 614rpx;
+  background: rgba(255, 255, 255, 1);
+  box-shadow: 0px 16px 24px rgba(0, 0, 0, 0.02);
+  opacity: 1;
+  border-radius: 20rpx;
+  margin: 24rpx auto 0;
+  padding: 42rpx 32rpx;
+  box-sizing: border-box;
+}
+
+.jiudianright {
+  display: flex;
+  align-items: center;
+}
+
+.jiudianleft {
+  color: #ff5a4e;
+  font-size: 24rpx;
+  margin-right: 32rpx;
+ 
+}
+
+.sholist {
+  margin-top: 74rpx;
+  display:flex;
+  align-items: center;
+  flex-wrap: wrap
+}
+
+.shopitemimg {
+  width: 190rpx;
+  height: 120rpx;
+  font-size: 0;
+}
+
+.shoname {
+  width: 190rpx;
+  color: #3d444d;
+  font-size: 28rpx;
+  text-align: center;
+  margin-top: 10rpx;
+}
+.sjopitem{
+  margin-right:17rpx;
+  margin-bottom:24rpx;
+}
+.anpai{
+  color:#5B5E63;
+  font-size: 24rpx;
+  text-align: center
+}
+
+.sharepresent{
+  width:686rpx;
+  border-radius: 20rpx;
+  padding: 42rpx 32rpx;
+  box-sizing: border-box;
+  background: #fff;
+  margin:24rpx auto 42rpx;
+}
+.presentcontent{
+  color:#5B5E63;
+  font-size: 28rpx;
+  margin-top:72rpx;
+
+}
+
+.yudingti{
+  display:flex;
+  align-items: center;
+  margin-top:28rpx;
+}
+.yudingtiword{
+  color:#06121E;
+  font-size: 32rpx;
+  font-weight: bold;
+  margin-left:20rpx;
+}
+.questext{
+  color:#5B5E63;
+  font-size: 28rpx;
+  margin-top:72rpx;
+}
+
+.yudingtinum{
+  width:40rpx;
+  height:40rpx;
+  background: #FF5A4E;
+  color:#fff;
+  font-size: 28rpx;
+  text-align: center;
+  line-height: 40rpx;
+  border-radius: 8rpx;
+  flex:0 0 auto;
+}
+.shareimg{
+  width:625rpx;
+  height:288rpx;
+  font-size: 0;
+  margin:24rpx auto 0;
+}
+.savehai{
+  width:625rpx;
+  height:303rpx;
+  font-size: 0;
+  margin-top:24rpx;
+}
+
+.fenhaibao{
+  width:624rpx;
+  height:254rpx;
+  font-size: 0;
+  margin:24rpx auto 0;
+}
+
+.wode{
+  width:625rpx;
+  height:282rpx;
+  font-size: 0;
+  margin:24rpx auto 0;
+}
+
+.dibuinfo{
+  display:flex;
+  align-items: center
+}
+
+.dibuinfoleft{
+  display:flex;
+  align-items: center;
+  background: #fff;
+  padding: 12rpx 32rpx;
+  box-sizing: border-box;
+  justify-content: space-between;
+  width:350rpx;
+}
+.dibuitemtop{
+  width:52rpx;
+  height:52rpx;
+  font-size: 0;
+  margin:0 auto;
+}
+.dibuitembottom{
+  color:#BDC4CE;
+  font-size: 22rpx;
+  margin-top:5rpx;
+
+}
+.dibuitem{
+  display:flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center
+}
+.dibuinforight{
+  width:400rpx;
+ height:98rpx;
+  box-sizing: border-box;
+  background:linear-gradient(180deg,rgba(252,169,162,1) 0%,rgba(255,119,117,1) 100%);
+  opacity:1;
+  color:#fff;
+  font-size: 32rpx;
+  text-align: center;
+  line-height: 98rpx;
+}

+// pages/huiyuanindex/huiyuanindex.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    showphone:false,
+    goumaishou:false
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "navigationBarTitleText": "会员"
+}

+<!-- 绑定手机号 -->
+
+<view class="register" catchtouchmove='true' wx:if="{{showphone}}">
+  <view class="phonewrap">
+    <view class="phonebang">绑定手机号</view>
+
+    <view class="phoneenter">
+      <view class="phoneenterleft">+86</view>
+      <view class="phoneenterright">
+        <input placeholder='请输入手机号' placeholder-class='shuru' />
+      </view>
+    </view>
+
+    <view class="yanzheng">
+      <view class="yanzhengleft">
+        <input placeholder='请输入验证码' placeholder-class='codeenter' />
+      </view>
+      <view class="getcode">获取验证码</view>
+    </view>
+
+    <view class="bangding">绑定</view>
+  </view>
+</view>
+
+<!-- 确认购买信息 -->
+
+<view class="register" catchtouchmove='true' wx:if="{{goumaishou}}">
+  <view class="goumaiwrap">
+    <view class="goumaitop">请确认购买信息</view>
+    <view class="huiyuanshou">
+      <view class="huiyuanshouleft">会员手机号</view>
+      <view class="huiyuanshouright">13254732134</view>
+    </view>
+
+    <view class="goumaizhi">
+      <view class="goumaihzileft">
+        购买会员即表示您同意
+      </view>
+
+      <view class="goumaihziright">
+        《会员协议》
+      </view>
+    </view>
+
+    <view class="buynow">点击购买</view>
+  </view>
+</view>
+
+
+
+
+
+<view class='huiyuanpage'>
+  <image src="/img/sun_81.png"></image>
+  <view class="pinzhi">
+    <view class="pinzhitop">品质住宿 全年免费</view>
+
+    <view class="pinzhilistbox">
+      <view class="pinzhilist">
+        <view class="pinzhileft">
+          <image src="/img/sun_21.png"></image>
+        </view>
+        <view class="pinzhiright">
+          <view class="buxiandiqu">不限地区</view>
+          <view class="pinzhibottom">全国范围消费任享</view>
+        </view>
+      </view>
+
+
+
+      <view class="pinzhilist">
+        <view class="pinzhileft">
+          <image src="/img/sun_22.png"></image>
+        </view>
+        <view class="pinzhiright">
+          <view class="buxiandiqu">不限酒店</view>
+          <view class="pinzhibottom">合作度假酒店全部通用</view>
+        </view>
+      </view>
+
+      <view class="pinzhilist">
+        <view class="pinzhileft">
+          <image src="/img/sun_23.png"></image>
+        </view>
+        <view class="pinzhiright">
+          <view class="buxiandiqu">不限时间</view>
+          <view class="pinzhibottom">节假日、周末均可入住</view>
+        </view>
+      </view>
+
+      <view class="pinzhilist">
+        <view class="pinzhileft">
+          <image src="/img/sun_24.png"></image>
+        </view>
+        <view class="pinzhiright">
+          <view class="buxiandiqu">不限次数</view>
+          <view class="pinzhibottom">有效期内不限定房次数</view>
+        </view>
+      </view>
+      <view class="pinzhilist">
+        <view class="pinzhileft">
+          <image src="/img/sun_25.png"></image>
+        </view>
+        <view class="pinzhiright">
+          <view class="buxiandiqu">消费无忧</view>
+          <view class="pinzhibottom">不住也能抵游侠旅游代金劵</view>
+        </view>
+      </view>
+
+      <view class="pinzhilist">
+        <view class="pinzhileft">
+          <image src="/img/sun_26.png"></image>
+        </view>
+        <view class="pinzhiright">
+          <view class="buxiandiqu">会员活动</view>
+          <view class="pinzhibottom">不定期下线活动，畅想会员特权</view>
+        </view>
+      </view>
+    </view>
+
+
+  </view>
+</view>
+
+<view class="dainilaiojie">
+  <image src="/img/sun_29.png"></image>
+
+  <view class="dainiliaojie">带你了解理想中会员</view>
+</view>
+
+<view class="listbox">
+  <view class="listboxitem">
+
+    <view class="boxitemleft">会员权益</view>
+
+    <view class="boxitemright">
+      <image src="/img/yourow.png"></image>
+    </view>
+
+  </view>
+  <view class="listboxitem">
+
+    <view class="boxitemleft">平台优势</view>
+
+    <view class="boxitemright">
+      <image src="/img/yourow.png"></image>
+    </view>
+
+  </view>
+  <view class="listboxitem">
+
+    <view class="boxitemleft">精选酒店</view>
+
+    <view class="boxitemright">
+      <image src="/img/yourow.png"></image>
+    </view>
+
+  </view>
+  <view class="listboxitem">
+
+    <view class="boxitemleft">订房问题</view>
+
+    <view class="boxitemright">
+      <image src="/img/yourow.png"></image>
+    </view>
+
+  </view>
+  <view class="listboxitem">
+
+    <view class="boxitemleft">分享有礼</view>
+
+    <view class="boxitemright">
+      <image src="/img/yourow.png"></image>
+    </view>
+
+  </view>
+</view>
+
+
+
+
+
+
+
+
+<!--底部导航 -->
+
+<view class="dibuinfo">
+  <view class="dibuinfoleft">
+    <view class="dibuitem">
+      <view class="dibuitemtop">
+        <image src="/img/pin.png"></image>
+      </view>
+
+      <view class="dibuitembottom">首页</view>
+    </view>
+
+    <view class="dibuitem">
+      <view class="dibuitemtop">
+        <image src="/img/kefu.png"></image>
+      </view>
+
+      <view class="dibuitembottom">客服</view>
+    </view>
+    <view class="dibuitem">
+      <view class="dibuitemtop">
+        <image src="/img/haibao.png"></image>
+      </view>
+
+      <view class="dibuitembottom">保存海报</view>
+    </view>
+  </view>
+
+  <view class="dibuinforight">立即购买会员</view>
+</view>

+page {
+  background: #fae3b2;
+}
+
+.huiyuanpage {
+  width: 750rpx;
+  height: 800rpx;
+  font-size: 0;
+  position: relative;
+}
+
+.pinzhi {
+  width: 684rpx;
+  height: 938rpx;
+  background: #fff;
+  border-radius: 16rpx;
+  margin: 0 auto;
+  position: absolute;
+  top: 635rpx;
+  left: 34rpx;
+}
+
+.pinzhitop {
+  width: 400rpx;
+  height: 80rpx;
+  background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
+  opacity: 1;
+  border-radius: 0px 0px 32rpx 32rpx;
+  margin: 0 auto;
+  color: #fff;
+  font-size: 32rpx;
+  text-align: center;
+  position: absolute;
+  top: -10rpx;
+  left: 142rpx;
+}
+
+.pinzhileft {
+  width: 32rpx;
+  height: 32rpx;
+  font-size: 0;
+}
+
+.pinzhilistbox {
+  margin-top: 116rpx;
+}
+
+.pinzhilist:first-child {
+  margin-top: 0;
+}
+
+.pinzhilist {
+  margin-top: 52rpx;
+  padding: 0 72rpx;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+}
+
+.buxiandiqu {
+  color: #06121e;
+  font-size: 28rpx;
+  font-weight: bold;
+}
+
+.pinzhibottom {
+  color: #8c9198;
+  font-size: 24rpx;
+}
+
+.pinzhiright {
+  margin-left: 24rpx;
+  margin-top: 12rpx;
+}
+
+.dainilaiojie {
+  width: 600rpx;
+  height: 106rpx;
+  font-size: 0;
+  margin: 821rpx auto 0;
+  position: relative;
+}
+
+.dainiliaojie {
+  color: #fff;
+  font-size: 32rpx;
+  position: absolute;
+  top: 28rpx;
+  left: 138rpx;
+}
+
+.huioyuantop {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.huiyuan {
+  width: 686rpx;
+  height: 406rpx;
+  background: #fff;
+  margin: 50rpx auto 0;
+  padding: 42rpx 32rpx;
+  box-sizing: border-box;
+  border-radius: 20rpx;
+}
+
+.huiyuantopleft {
+  color: #06121e;
+  font-size: 32rpx;
+  font-weight: bold;
+}
+
+.huiyuantopright {
+  width: 30rpx;
+  height: 30rpx;
+  font-size: 0;
+  transform: rotate(90deg);
+}
+
+.huiyuantext {
+  color: #5b5e63;
+  font-size: 28rpx;
+  margin-top: 72rpx;
+  height: 244rpx;
+  overflow-y: scroll;
+}
+
+.advantageleft {
+  width: 60rpx;
+  height: 60rpx;
+  font-size: 0;
+  flex: 0 0 auto;
+}
+
+.advantageright {
+  color: #5b5e63;
+  font-size: 28rpx;
+  margin-left: 12rpx;
+}
+
+.pingtaiadvantage {
+  display: flex;
+  margin-top: 58rpx;
+}
+
+/* 精选酒店 */
+
+.jiudian {
+  width: 686rpx;
+  height: 614rpx;
+  background: rgba(255, 255, 255, 1);
+  box-shadow: 0px 16px 24px rgba(0, 0, 0, 0.02);
+  opacity: 1;
+  border-radius: 20rpx;
+  margin: 24rpx auto 0;
+  padding: 42rpx 32rpx;
+  box-sizing: border-box;
+}
+
+.jiudianright {
+  display: flex;
+  align-items: center;
+}
+
+.jiudianleft {
+  color: #ff5a4e;
+  font-size: 24rpx;
+  margin-right: 32rpx;
+}
+
+.sholist {
+  margin-top: 74rpx;
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+.shopitemimg {
+  width: 190rpx;
+  height: 120rpx;
+  font-size: 0;
+}
+
+.shoname {
+  width: 190rpx;
+  color: #3d444d;
+  font-size: 28rpx;
+  text-align: center;
+  margin-top: 10rpx;
+}
+
+.sjopitem {
+  margin-right: 17rpx;
+  margin-bottom: 24rpx;
+}
+
+.anpai {
+  color: #5b5e63;
+  font-size: 24rpx;
+  text-align: center;
+}
+
+.sharepresent {
+  width: 686rpx;
+  border-radius: 20rpx;
+  padding: 42rpx 32rpx;
+  box-sizing: border-box;
+  background: #fff;
+  margin: 24rpx auto 42rpx;
+}
+
+.presentcontent {
+  color: #5b5e63;
+  font-size: 28rpx;
+  margin-top: 72rpx;
+}
+
+.yudingti {
+  display: flex;
+  align-items: center;
+  margin-top: 28rpx;
+}
+
+.yudingtiword {
+  color: #06121e;
+  font-size: 32rpx;
+  font-weight: bold;
+  margin-left: 20rpx;
+}
+
+.questext {
+  color: #5b5e63;
+  font-size: 28rpx;
+  margin-top: 72rpx;
+}
+
+.yudingtinum {
+  width: 40rpx;
+  height: 40rpx;
+  background: #ff5a4e;
+  color: #fff;
+  font-size: 28rpx;
+  text-align: center;
+  line-height: 40rpx;
+  border-radius: 8rpx;
+  flex: 0 0 auto;
+}
+
+.shareimg {
+  width: 625rpx;
+  height: 288rpx;
+  font-size: 0;
+  margin: 24rpx auto 0;
+}
+
+.savehai {
+  width: 625rpx;
+  height: 303rpx;
+  font-size: 0;
+  margin-top: 24rpx;
+}
+
+.fenhaibao {
+  width: 624rpx;
+  height: 254rpx;
+  font-size: 0;
+  margin: 24rpx auto 0;
+}
+
+.wode {
+  width: 625rpx;
+  height: 282rpx;
+  font-size: 0;
+  margin: 24rpx auto 0;
+}
+
+.dibuinfo {
+  display: flex;
+  align-items: center;
+}
+
+.dibuinfoleft {
+  display: flex;
+  align-items: center;
+  background: #fff;
+  padding: 12rpx 32rpx;
+  box-sizing: border-box;
+  justify-content: space-between;
+  width: 350rpx;
+}
+
+.dibuitemtop {
+  width: 52rpx;
+  height: 52rpx;
+  font-size: 0;
+  margin: 0 auto;
+}
+
+.dibuitembottom {
+  color: #bdc4ce;
+  font-size: 22rpx;
+  margin-top: 5rpx;
+}
+
+.dibuitem {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
+.dibuinforight {
+  width: 400rpx;
+  height: 98rpx;
+  box-sizing: border-box;
+  background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
+  opacity: 1;
+  color: #fff;
+  font-size: 32rpx;
+  text-align: center;
+  line-height: 98rpx;
+}
+
+.listboxitem {
+  width: 686rpx;
+  height: 120rpx;
+  background: rgba(255, 255, 255, 1);
+  box-shadow: 0px 16rpx 24rpx rgba(0, 0, 0, 0.02);
+  opacity: 1;
+  border-radius: 20rpx;
+  margin: 0 auto;
+  padding: 38rpx 32rpx;
+  box-sizing: border-box;
+}
+
+.boxitemright {
+  width: 25rpx;
+  height: 25rpx;
+  font-size: 0;
+}
+
+.listboxitem {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-top: 24rpx;
+}
+
+.listbox {
+  margin-bottom: 50rpx;
+}
+
+/* 绑定手机号 */
+
+.phonewrap {
+  width: 622rpx;
+  height: 496rpx;
+  background: rgba(255, 255, 255, 1);
+  opacity: 1;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  border-radius: 20rpx;
+  padding: 30rpx 32rpx;
+  box-sizing: border-box;
+}
+
+.phonebang {
+  color: #06121e;
+  font-size: 36rpx;
+  font-weight: bold;
+  text-align: center;
+  padding-bottom: 32rpx;
+  border-bottom: 1rpx solid #f5f5f5;
+}
+
+.phoneenter {
+  display: flex;
+  align-items: center;
+  padding: 16rpx 40rpx;
+  box-sizing: border-box;
+  margin-top: 38rpx;
+}
+
+.phoneenterleft {
+  color: #06121e;
+  font-size: 32rpx;
+}
+
+.phoneenterright {
+  color: #8c9198;
+  font-size: 26rpx;
+  margin-left: 10rpx;
+}
+
+.shuru {
+  color: #8c9198;
+  font-size: 26rpx;
+}
+
+.yanzheng {
+  display: flex;
+  align-items: center;
+  margin-top: 24rpx;
+}
+
+.yanzhengleft {
+  width: 360rpx;
+  padding: 24rpx 40rpx;
+  box-sizing: border-box;
+  color: #8c9198;
+  font-size: 24rpx;
+}
+
+.getcode {
+  width: 176rpx;
+  height: 80rpx;
+  border: 2rpx solid rgba(255, 90, 78, 1);
+  opacity: 1;
+  border-radius: 16rpx;
+  color: #ff5a4e;
+  font-size: 24rpx;
+  padding: 24rpx 28rpx;
+  box-sizing: border-box;
+  margin-left: 24rpx;
+}
+
+.bangding {
+  width: 442rpx;
+  height: 80rpx;
+  background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
+  opacity: 1;
+  border-radius: 44rpx;
+  color: #fff;
+  font-size: 28rpx;
+  text-align: center;
+  line-height: 80rpx;
+  margin: 42rpx auto 0;
+}
+
+.goumaiwrap {
+  width: 622rpx;
+  height: 460rpx;
+  background: rgba(255, 255, 255, 1);
+  opacity: 1;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  border-radius: 15rpx;
+  padding: 30rpx 60rpx;
+  box-sizing: border-box;
+}
+
+.goumaitop {
+  color: #06121e;
+  font-size: 36rpx;
+  padding-bottom: 32rpx;
+  box-sizing: border-box;
+  border-bottom: 1rpx solid #f5f5f5;
+  font-weight: bold;
+  text-align: center;
+}
+
+.huiyuanshou {
+  display: flex;
+  align-items: center;
+  margin-top: 60rpx;
+}
+
+.huiyuanshouleft {
+  color: #8c9198;
+  font-size: 28rpx;
+}
+
+.huiyuanshouright {
+  color: #06121e;
+  font-size: 28rpx;
+  margin-left: 40rpx;
+}
+
+.goumaizhi {
+  display: flex;
+  align-items: center;
+  margin-top: 24rpx;
+}
+
+.goumaihziright {
+  color: #ff5a4e;
+  font-size: 28rpx;
+}
+
+.goumaihzileft {
+  color: #8c9198;
+  font-size: 28rpx;
+}
+
+.buynow {
+  width: 442rpx;
+  height: 80rpx;
+  background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
+  opacity: 1;
+  border-radius: 44rpx;
+  color: #fff;
+  font-size: 28rpx;
+  text-align: center;
+  line-height: 80rpx;
+  margin:62rpx auto 0;
+}
+
+.dibuinforight {
+  width: 442rpx;
+  height: 80rpx;
+  background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
+  opacity: 1;
+  border-radius: 44rpx;
+  color:#fff;
+  font-size: 28rpx;
+  text-align: center;
+  line-height: 80rpx
+}

+// pages/huiyuanxieyi/huiyuanxieyi.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "navigationBarTitleText": "会员协议"
+}

+<view class="xieyiname">
+    <view class="xieyinametop">会员协议</view>
+    <view class="xieyicontent">[审慎阅读]您在申请购买守麦流程中点击同意本协议之 前，应当认真阅读本协议。请您务必审慎阅读、充分理解 条款内容，特别是免除或限制责任的条款、法律适用和争 议解决条款。免除或者限制责任的条款将以粗体下划线标 识，您应重点阅读。如你对协议有任何疑问，请联系守麦 小程序平台客服。 [签约动作]当您按照签约页面提示填写信息、阅读并同, 意本协议且完成全部购买守麦程序后，即表示您已充分阅 读、理解并接受本协议的全部内容，并与守麦达成-致， 成为“守麦会员”。阅读本协议的过程中，如果您不同意 本协议或其中任何条款约定，您应立即停止购买流程。 守麦会员服务协议 最新版本生效时间: 2019年09月10日 导言 本协议是守麦会员与杭州守麦网络科技有限公司(下 称“守麦”)之间关于您成为守麦会员及使用守麦提供的 会员服务(下称“会员服务”)所订立的有效契约，具有 法律效力。“ 会员服务”是指守麦为守麦会员提供的会员, 权益;“守麦会员” 是指完成了成为守麦会员的所有程序 且在会员服务期限内遵守相关服务使用规则下享受守麦会 员服务的自然人。 守麦已经以标粗体下划线或其他合理方式提示您重点 阅读协议中与您的权益(可能)存在重大关系的条款(包括</view>
+</view>

+.xieyinametop{
+  color:#06121E;
+  font-size: 28rpx;
+  text-align: center;
+  margin-top:34rpx;
+}
+.xieyicontent{
+  color:#06121E;
+  font-size: 28rpx;
+  
+  padding: 0 32rpx;
+  box-sizing: border-box;
+  margin-top:78rpx;
+  margin-bottom:40rpx;
+}

+//index.js
+//获取应用实例
+const app = getApp()
+
+Page({
+  data: {
+    motto: 'Hello World',
+    userInfo: {},
+    hasUserInfo: false,
+    canIUse: wx.canIUse('button.open-type.getUserInfo')
+  },
+  //事件处理函数
+  bindViewTap: function() {
+    wx.navigateTo({
+      url: '../logs/logs'
+    })
+  },
+  onLoad: function () {
+    if (app.globalData.userInfo) {
+      this.setData({
+        userInfo: app.globalData.userInfo,
+        hasUserInfo: true
+      })
+    } else if (this.data.canIUse){
+      // 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
+      // 所以此处加入 callback 以防止这种情况
+      app.userInfoReadyCallback = res => {
+        this.setData({
+          userInfo: res.userInfo,
+          hasUserInfo: true
+        })
+      }
+    } else {
+      // 在没有 open-type=getUserInfo 版本的兼容处理
+      wx.getUserInfo({
+        success: res => {
+          app.globalData.userInfo = res.userInfo
+          this.setData({
+            userInfo: res.userInfo,
+            hasUserInfo: true
+          })
+        }
+      })
+    }
+  },
+  getUserInfo: function(e) {
+    console.log(e)
+    app.globalData.userInfo = e.detail.userInfo
+    this.setData({
+      userInfo: e.detail.userInfo,
+      hasUserInfo: true
+    })
+  }
+})

+{
+  "usingComponents": {}
+}

+<!--index.wxml-->
+<view class="container">
+  <view class="userinfo">
+    <button wx:if="{{!hasUserInfo && canIUse}}" open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 获取头像昵称 </button>
+    <block wx:else>
+      <image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" mode="cover"></image>
+      <text class="userinfo-nickname">{{userInfo.nickName}}</text>
+    </block>
+  </view>
+  <view class="usermotto">
+    <text class="user-motto">{{motto}}</text>
+  </view>
+</view>

+/**index.wxss**/
+.userinfo {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.userinfo-avatar {
+  width: 128rpx;
+  height: 128rpx;
+  margin: 20rpx;
+  border-radius: 50%;
+}
+
+.userinfo-nickname {
+  color: #aaa;
+}
+
+.usermotto {
+  margin-top: 200px;
+}

+// pages/hoteldetail/hoteldetail.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    imgUrls: [
+      '/img/tuijianimg1.png',
+      '/img/tuijianimg1.png',
+      '/img/tuijianimg1.png',
+    ],
+    indicatorDots: false,
+    autoplay: true,
+    interval: 2000,
+    duration: 1000,
+    currentSwiper: 0,
+    selitem: 1
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  selkind(e) {
+    this.setData({
+      selitem: e.currentTarget.dataset.type
+    })
+  },
+  swiperChange: function (e) {
+    this.setData({
+      currentSwiper: e.detail.current
+    })
+  },
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "navigationBarTitleText": "酒店详情"
+}

+<view class="swiper_image">
+  <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" class="swiper_item_img" bindchange="swiperChange">
+    <block wx:for="{{imgUrls}}" wx:key="doct">
+      <swiper-item style="border-radius:10px;">
+        <image src="{{item}}" data-index='{{index}}' class="slide-image" bindtap='viewImg' width="355" height="150" />
+      </swiper-item>
+    </block>
+  </swiper>
+
+  <view class="dots">
+    <block wx:for="{{imgUrls}}" wx:key="">
+      <view class="dot{{index == currentSwiper ? ' active' : ''}}"></view>
+    </block>
+  </view>
+
+</view>
+
+<view class="minsuintor">
+  <view class="minsutou">蔓图精品民宿</view>
+
+  <view class="suconcatbox">
+    <view class="suhead suheadone">
+      <view class="suheadleft">
+        <view class="suheadleimg">
+          <image src="/img/ditu.png"></image>
+        </view>
+
+        <view class="sunheadword">北京海淀区蔓图精品民宿</view>
+
+
+      </view>
+
+      <view class="suheadright">
+        <image src="/img/dianhua.png"></image>
+      </view>
+    </view>
+
+    <view class="suhead suheadsec">
+      <view class="suheadleft">
+        <view class="suheadleimg">
+          <image src="/img/haibao.png"></image>
+        </view>
+
+        <view class="sunheadword">08月29日-08月31日</view>
+      </view>
+      <view class="ruzhuright">
+        <view class="ruzhu">
+          入住
+          <text class="ruzhunum">2</text>晚
+        </view>
+
+        <view class="ruzhuyou">
+          <image src="/img/yourow.png"></image>
+        </view>
+      </view>
+
+    </view>
+  </view>
+</view>
+
+<view class="minsulist">
+  <view class='minsuitem {{selitem==1?"selactive":""}}' bindtap="selkind" data-type="1">房型介绍</view>
+  <view class='minsuitem {{selitem==2?"selactive":""}}' bindtap="selkind" data-type="2">酒店介绍</view>
+  <view class='minsuitem {{selitem==3?"selactive":""}}' bindtap="selkind" data-type="3">入住须知</view>
+  <view class='minsuitem {{selitem==4?"selactive":""}}' bindtap="selkind" data-type="4">游玩攻略</view>
+</view>
+
+
+<view class="jiudianbigbox">
+  <!-- 酒店介绍 -->
+
+  <view class="jiudianintortext">
+    <view class="jiudainjie">
+      <view class="jiudianjieleft">酒店介绍</view>
+      <view class="judianjieright">
+        <image src="/img/yourow.png"></image>
+      </view>
+    </view>
+
+    <view class="jiudiancontentitem">
+      <view class="jiudianboxtop">
+        <view class="jiudiantopleft">
+          <image src="/img/jieshaojiu.png"></image>
+        </view>
+        <view class="jiudianhuan">周边环境</view>
+
+      </view>
+
+      <view class="zhoubiantext">
+        上海艾格瑞公寓位于具有“上海缩影”之称的虹口，坐拥浦江繁华内环核心，占据内环具有价值“黄金三角生活圈”。公寓毗邻瑞虹天地商圈、四川北路商圈、海伦路商圈之众多商场和写字楼，步行可达和平公园、鲁迅公园、1933老场坊、多伦路文化名人街，乘车前往外滩、陆家嘴约十余分钟。 　　公寓设有标准层和行政层，标准层设有7种各具特色的北欧风房型，行政层设有3种舒适简约套房房型，每间房间配有无线上网服务。
+      </view>
+    </view>
+
+    <view class="jiudiancontentitem">
+      <view class="jiudianboxtop">
+        <view class="jiudiantopleft">
+          <image src="/img/shejistyle.png"></image>
+        </view>
+        <view class="jiudianhuan">设计风格</view>
+
+      </view>
+
+      <view class="zhoubiantext">
+        酒店设计现代、简约。 游玩回到水晶可以在露台喝茶聊天，看书发呆。尽情享受度假时光。
+      </view>
+    </view>
+    <view class="jiudiancontentitem">
+      <view class="jiudianboxtop">
+        <view class="jiudiantopleft">
+          <image src="/img/jiaotong.png"></image>
+        </view>
+        <view class="jiudianhuan">交通路线</view>
+
+      </view>
+
+      <view class="zhoubiantext">
+        酒店临近16号线永丰南站，步行4分钟即可到达地铁站；
+      </view>
+    </view>
+
+    <view class="jiudiancontentitem">
+      <view class="jiudianboxtop">
+        <view class="jiudiantopleft">
+          <image src="/img/tuijianreson.png"></image>
+        </view>
+        <view class="jiudianhuan">推荐理由</view>
+
+      </view>
+
+      <view class="zhoubiantext">
+        公寓内还设有健身房、咖啡厅、公共会客厅、棋牌桌游吧、会议室、商务中心等设施。在这里，可以充分感受上海气息的品质居住体验，愿能成为您商务、旅行下榻的优选。
+      </view>
+    </view>
+
+
+  </view>
+
+
+
+  <!-- 设施服务 -->
+
+  <view class="jiudianintortext">
+    <view class="jiudainjie">
+      <view class="jiudianjieleft">设施服务</view>
+      <view class="judianjieright">
+        <image src="/img/yourow.png"></image>
+      </view>
+    </view>
+
+    <view class="jiaotong">
+
+      <view class="jiaotongitem">
+        <view class="jiaotongtop">交通服务</view>
+
+        <view class="jiaotongbottom">
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">免费停车</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">自行车租赁服务</view>
+          </view>
+        </view>
+      </view>
+
+      <view class="jiaotongitem">
+        <view class="jiaotongtop">餐饮服务</view>
+
+        <view class="jiaotongbottom">
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">中餐厅</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">咖啡厅</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">送餐服务</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">烧烤</view>
+          </view>
+        </view>
+      </view>
+
+      <view class="jiaotongitem">
+        <view class="jiaotongtop">网络设施</view>
+
+        <view class="jiaotongbottom">
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">客房WIFI</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">公共区域WIFI</view>
+          </view>
+        </view>
+      </view>
+
+
+      <view class="jiaotongitem">
+        <view class="jiaotongtop">娱乐和健身设施</view>
+
+        <view class="jiaotongbottom">
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">茶室</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">健身房</view>
+          </view>
+        </view>
+      </view>
+
+
+      <view class="jiaotongitem">
+        <view class="jiaotongtop">服务项目</view>
+
+        <view class="jiaotongbottom">
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">会议室</view>
+          </view>
+
+          <view class="jiaotongbottomitem">
+            <view class="jiaotongitemleft">
+              <image src="/img/duigou.png"></image>
+            </view>
+            <view class="jiaotongitemname">全天前天</view>
+          </view>
+        </view>
+      </view>
+
+    </view>
+
+
+
+  </view>
+
+
+
+</view>
+
+
+<view class="jiudianbottom">
+  <view class="jiudianbottomleft">
+    <view class="jiudianitem">
+      <view class="jiudianitemtop">
+        <image src="/img/pin.png"></image>
+      </view>
+
+      <view class="jiudianitembot">首页</view>
+    </view>
+    <view class="jiudianitem">
+      <view class="jiudianitemtop">
+        <image src="/img/kefu.png"></image>
+      </view>
+
+      <view class="jiudianitembot kename">客服</view>
+    </view>
+    <view class="jiudianitem">
+      <view class="jiudianitemtop">
+        <image src="/img/shou.png"></image>
+      </view>
+
+      <view class="jiudianitembot">收藏</view>
+    </view>
+  </view>
+
+  <view class="jiudianbottomright">购买会员免费入住</view>
+</view>

+page {
+  background: #F9F9F9;
+}
+
+.minsuintor {
+  padding: 40rpx 44rpx;
+  box-sizing: border-box;
+  background: #fff;
+}
+
+.minsutou {
+  color: #06121e;
+  font-size: 38rpx;
+  font-weight: bold;
+}
+
+.suhead {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 30rpx 32rpx 30rpx 0;
+  box-sizing: border-box;
+}
+
+.suheadone {
+  margin-top: 32rpx;
+}
+
+.suheadsec {
+  margin-top: 16rpx;
+}
+
+.suheadleft {
+  display: flex;
+  align-items: center;
+}
+
+.suheadleimg {
+  width: 40rpx;
+  height: 40rpx;
+  font-size: 0;
+}
+
+.sunheadword {
+  color: #06121e;
+  font-size: 28rpx;
+  margin-left: 12rpx;
+}
+
+.suheadright {
+  width: 44rpx;
+  height: 44rpx;
+  font-size: 0;
+}
+
+.ruzhu {
+  color: #06121e;
+  font-size: 28rpx;
+}
+
+.ruzhunum {
+  color: #ff5a4e;
+  font-size: 28rpx;
+}
+
+.ruzhuright {
+  display: flex;
+  align-items: center;
+}
+
+.ruzhuyou {
+  width: 18rpx;
+  height: 18rpx;
+  font-size: 0;
+  margin-left: 16rpx;
+}
+
+.minsulist {
+  display: flex;
+  align-items: center;
+  padding: 32rpx 58rpx;
+  box-sizing: border-box;
+  justify-content: space-between;
+  background: #fff;
+}
+
+.minsuitem {
+  color: #06121e;
+  font-size: 26rpx;
+}
+
+.selactive {
+  color: #06121e;
+  font-size: 38rpx;
+  font-weight: bold;
+  position: relative;
+}
+
+.selactive::after {
+  position: absolute;
+  display: block;
+  content: '';
+  width: 48rpx;
+  height: 6rpx;
+  background: #ff5a4e;
+  left: 50%;
+  right: 50%;
+  transform: translateX(-50%);
+  bottom: -12rpx;
+  border-radius: 4rpx;
+}
+
+.judianjieright {
+  width: 34rpx;
+  height: 34rpx;
+  font-size: 0;
+}
+
+.jiudainjie {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  border-bottom: 1rpx solid #f5f5f5;
+  padding: 40rpx 0;
+  box-sizing: border-box;
+}
+
+.jiudianjieleft {
+  color: #06121e;
+  font-size: 32rpx;
+  font-weight: bold;
+}
+
+.fuwujie {
+  margin-bottom: 52rpx;
+}
+
+.jiudianbottomleft {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12rpx 34rpx;
+  box-sizing: border-box;
+  width: 350rpx;
+  background: #fff;
+}
+
+.jiudianbottomright {
+  width: 400rpx;
+  height: 98rpx;
+  background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
+  opacity: 1;
+  color: #fff;
+  font-size: 32rpx;
+  text-align: center;
+  line-height: 98rpx;
+}
+
+.jiudianbottom {
+  display: flex;
+  align-items: center;
+  position: fixed;
+  bottom: 0;
+  left: 0;
+}
+
+.jiudianitem {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
+.jiudianitemtop {
+  width: 40rpx;
+  height: 40rpx;
+  font-size: 0;
+}
+
+.jiudianitembot {
+  color: #bdc4ce;
+  font-size: 22rpx;
+}
+
+.kename {
+  color: #ff5a4e;
+  font-size: 22rpx;
+}
+
+.jiudianboxtop {
+  display: flex;
+  align-items: center;
+  margin-top: 38rpx;
+}
+
+.jiudiantopleft {
+  width: 48rpx;
+  height: 48rpx;
+  font-size: 0;
+}
+
+.jiudianintortext {
+  width: 686rpx;
+  margin: 24rpx auto 0;
+  padding: 0 32rpx 24rpx;
+  box-sizing: border-box;
+  box-shadow: 0px 16px 24px rgba(0, 0, 0, 0.02);
+  opacity: 1;
+  border-radius: 20px;
+  background: #fff
+}
+
+.jiudianhuan {
+  color: #06121e;
+  font-size: 32rpx;
+  margin-left: 10rpx;
+}
+
+.zhoubiantext {
+  color: #5b5e63;
+  font-size: 28rpx;
+  margin-top: 24rpx;
+}
+.jiudianbigbox{
+  margin-bottom: 156rpx;
+}
+.jiaotongtop{
+    color:#06121E;
+    font-size: 30rpx;
+}
+.jiaotongitemleft{
+    width:48rpx;
+    height:48rpx;
+    font-size: 0
+}
+
+.jiaotongbottomitem{
+  display:flex;
+  align-items: center;
+  margin-top:16rpx;
+   margin-right:40rpx;
+ 
+}
+.jiaotongitemname{
+  color:#5B5E63;
+  font-size: 28rpx;
+  margin-left:12rpx;
+ 
+}
+.jiaotongbottom{
+  display:flex;
+  align-items: center;
+  flex-wrap: wrap;
+}
+.jiaotongitem{
+  margin-top:20rpx;
+}

+// pages/lixiangzhong/lixiangzhong.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "navigationBarTitleText": "理想中"
+}

+<view class="head">
+  <view class="headleft">
+    <view class="headleftimg">
+      <image src="/img/renwu.png"></image>
+
+      <view class="zuanimg">
+        <image src="/img/zuanshi.png"></image>
+      </view>
+    </view>
+    <view class="headname">爱旅行的小李</view>
+  </view>
+  <view class="headright">会员剩余214天到期</view>
+</view>
+<view class="zhilist">
+  <view class="zhiitem">
+    <view class="zhiitemimg">
+      <image src="/img/wangguan.png"></image>
+    </view>
+    <view class="zhiitemname">会员指南</view>
+  </view>
+  <view class="zhiitem">
+    <view class="zhiitemimg">
+
+      <image src="/img/sun_02.png"></image>
+    </view>
+    <view class="zhiitemname">会员指南</view>
+  </view>
+  <view class="zhiitem">
+    <view class="zhiitemimg">
+
+      <image src="/img/nav_03.png"></image>
+    </view>
+    <view class="zhiitemname">会员指南</view>
+  </view>
+</view>
+
+<view class="searchlist">
+  <view class="searchhead">
+    <view class="searchleft">
+      <image src="/img/sousuo.png"></image>
+    </view>
+    <view class="searchname">
+      <input placeholder='请输入搜索内容' placeholder-class='entername' />
+    </view>
+  </view>
+
+  <view class="enterbox">
+    <view class="enterboxleft">
+      <view class="enterboxlist">
+        <view class="boxleft"></view>
+        <view class="boxmiddle">08月21日</view>
+        <view class="boxright">（周三入住）</view>
+      </view>
+      <view class="enterboxlist boxlistsec">
+        <view class="boxleft"></view>
+        <view class="boxmiddle">08月23日</view>
+        <view class="boxright">（周五离店）</view>
+      </view>
+    </view>
+    <view class="enterboxright">共2晚</view>
+  </view>
+
+  <view class="searchnametext">查找房源</view>
+</view>
+<!-- 开放城市 -->
+<view class="chengshilist">
+
+  <view class="chengshihead">
+    <view class="chengshileft">开放城市</view>
+    <view class="chengshiright">
+      <view class="rightname">全部</view>
+      <view class="rihghtimg">
+        <image src="/img/yourow.png"></image>
+      </view>
+    </view>
+  </view>
+
+  <view class="citylist">
+    <view class="cityimg">
+      <image src="/img/img1.png"></image>
+
+      <view class="listimgname">
+        <view class="topname">天津</view>
+        <view class="bottompname">TianJin</view>
+      </view>
+    </view>
+    <view class="cityimg">
+      <image src="/img/img2.png"></image>
+      <view class="listimgname">
+        <view class="topname">台湾</view>
+        <view class="bottompname">TaiWan</view>
+      </view>
+    </view>
+    <view class="cityimg">
+      <image src="/img/img3.png"></image>
+    </view>
+  </view>
+</view>
+<!-- 最近上线 -->
+<view class="recentline">
+  <view class="recentlinetop">
+    最近上线
+  </view>
+  <view class="recentlinebottom">立即开启您的度假之旅</view>
+
+  <view class="recnetlinebox">
+    <view class="recentlineimg">
+      <image src="/img/lineimg1.png"></image>
+
+      <view class="linetext">
+        <view class="linetopname">仰望雪山-方艺术天堂</view>
+
+        <view class="linesecname">丽江古原雪山庄园</view>
+        <view class='linethirname'>
+
+          <view class="linethileft">
+            <image src="/img/weizhi.png"></image>
+          </view>
+          <view class="lineright">丽江 玉龙纳西族自治县</view>
+        </view>
+      </view>
+    </view>
+    <view class="recentlineimg">
+      <image src="/img/lineimg2.png"></image>
+    </view>
+  </view>
+
+
+</view>
+
+<!--为您推荐  -->
+<view class="tuijian">
+  <view class="chengshihead tuihead">
+    <view class="chengshileft">为您推荐</view>
+    <view class="chengshiright">
+      <view class="rightname">全部</view>
+      <view class="rihghtimg">
+        <image src="/img/yourow.png"></image>
+      </view>
+    </view>
+  </view>
+
+  <view class="tuijianlist">
+    <view class="tuijianitem">
+      <view class="tuijainimg">
+        <image src="/img/tuijianimg1.png"></image>
+
+        <view class='linethirname tuituname'>
+
+          <view class="linethileft">
+            <image src="/img/weizhi.png"></image>
+          </view>
+          <view class="lineright">丽江 玉龙纳西族自治县</view>
+        </view>
+      </view>
+
+      <view class="tuijianintro">
+        <view class="tuijianname">朗丽兹西山花园酒店</view>
+        <view class="tuijianleft">
+          <view class="tuijainleftname">吴镇蔓图精品民宿</view>
+          <view class="tuijianrightname">
+            <view class="tuitu">
+              <image src="/img/ditu.png"></image>
+            </view>
+
+            <view class="dituname">海淀区蔓图精品民宿</view>
+          </view>
+        </view>
+
+        <view class="kind">
+          <view class="lindleft">
+            <view class="leftitem">原木轻著</view>
+            <view class="leftitem">豪华精致</view>
+
+          </view>
+          <view class="lieright">
+            <view class="lineleftmoney zhemoney">¥888</view>
+            <view class="lineleftmoney">会员免费</view>
+          </view>
+
+        </view>
+      </view>
+    </view>
+
+    <view class="tuijianitem">
+      <view class="tuijainimg">
+        <image src="/img/tuijianimg2.png"></image>
+
+        <view class='linethirname tuituname'>
+
+          <view class="linethileft">
+            <image src="/img/weizhi.png"></image>
+          </view>
+          <view class="lineright">丽江 玉龙纳西族自治县</view>
+        </view>
+      </view>
+
+      <view class="tuijianintro">
+        <view class="tuijianname">朗丽兹西山花园酒店</view>
+        <view class="tuijianleft">
+          <view class="tuijainleftname">吴镇蔓图精品民宿</view>
+          <view class="tuijianrightname">
+            <view class="tuitu">
+              <image src="/img/ditu.png"></image>
+            </view>
+
+            <view class="dituname">海淀区蔓图精品民宿</view>
+          </view>
+        </view>
+
+        <view class="kind">
+          <view class="lindleft">
+            <view class="leftitem">原木轻著</view>
+            <view class="leftitem">豪华精致</view>
+
+          </view>
+          <view class="lieright">
+            <view class="lineleftmoney zhemoney">¥888</view>
+            <view class="lineleftmoney">会员免费</view>
+          </view>
+
+        </view>
+      </view>
+    </view>
+     <view class="tuijianitem">
+      <view class="tuijainimg">
+        <image src="/img/tuijianimg3.png"></image>
+
+        <view class='linethirname tuituname'>
+
+          <view class="linethileft">
+            <image src="/img/weizhi.png"></image>
+          </view>
+          <view class="lineright">丽江 玉龙纳西族自治县</view>
+        </view>
+      </view>
+
+      <view class="tuijianintro">
+        <view class="tuijianname">朗丽兹西山花园酒店</view>
+        <view class="tuijianleft">
+          <view class="tuijainleftname">吴镇蔓图精品民宿</view>
+          <view class="tuijianrightname">
+            <view class="tuitu">
+              <image src="/img/ditu.png"></image>
+            </view>
+
+            <view class="dituname">海淀区蔓图精品民宿</view>
+          </view>
+        </view>
+
+        <view class="kind">
+          <view class="lindleft">
+            <view class="leftitem">原木轻著</view>
+            <view class="leftitem">豪华精致</view>
+
+          </view>
+          <view class="lieright">
+            <view class="lineleftmoney zhemoney">¥888</view>
+            <view class="lineleftmoney">会员免费</view>
+          </view>
+
+        </view>
+      </view>
+    </view>
+
+  </view>
+</view>

+page {
+  background: #fff;
+}
+
+.headleftimg {
+  width: 72rpx;
+  height: 72rpx;
+  font-size: 0;
+  position: relative;
+}
+
+.head {
+  padding: 24rpx 38rpx;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  border-bottom: 24rpx solid #f8f8f8;
+}
+
+.headleft {
+  display: flex;
+  align-items: center;
+}
+
+.zuanimg {
+  width: 30rpx;
+  height: 30rpx;
+  font-size: 0;
+  position: absolute;
+  top: 44rpx;
+  right: -10rpx;
+}
+
+.headname {
+  color: #06121e;
+  font-size: 28rpx;
+  margin-left: 28rpx;
+}
+
+.headright {
+  color: #8c9198;
+  font-size: 20rpx;
+}
+
+.zhilist {
+  display: flex;
+  align-items: center;
+  justify-content: space-around;
+  padding: 22rpx 0;
+  box-sizing: border-box;
+  border-bottom: 24rpx solid #f8f8f8;
+}
+
+.zhiitem {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
+.zhiitemimg {
+  width: 60rpx;
+  height: 60rpx;
+  font-size: 0;
+}
+
+.zhiitemname {
+  color: #06121e;
+  font-size: 28rpx;
+  margin-top: 6rpx;
+}
+
+.searchlist {
+  padding-bottom: 40rpx;
+}
+
+.searchleft {
+  width: 28rpx;
+  height: 28rpx;
+  font-size: 0;
+}
+
+.searchhead {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 22rpx 92rpx;
+  box-sizing: border-box;
+  border-bottom: 1rpx solid #f5f5f5;
+}
+
+.searchname {
+  margin-left: 12rpx;
+  color: #06121e;
+  font-size: 28rpx;
+}
+
+.entername {
+  color: #06121e;
+  font-size: 28rpx;
+}
+
+.boxleft {
+  width: 16rpx;
+  height: 16rpx;
+  border-radius: 50%;
+  background: #ff5a4e;
+}
+
+.enterboxlist {
+  display: flex;
+  align-items: center;
+  padding: 28rpx 0;
+  box-sizing: border-box;
+  border-bottom: 1rpx solid #f5f5f5;
+}
+
+.enterbox {
+  padding: 0 72rpx;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.enterboxleft {
+  width: 500rpx;
+}
+
+.boxmiddle {
+  color: #06121e;
+  font-size: 36rpx;
+  margin-left: 30rpx;
+}
+
+.boxright {
+  color: #8c9198;
+  font-size: 24rpx;
+  margin-left: 8rpx;
+}
+
+.enterboxright {
+  color: #ff5a4e;
+  font-size: 24rpx;
+}
+
+.searchnametext {
+  color: #fff;
+  font-size: 32rpx;
+  width: 618rpx;
+  height: 88rpx;
+  background: linear-gradient(90deg, rgba(255, 114, 113, 1) 0%, rgba(255, 122, 120, 1) 13%, rgba(252, 172, 165, 1) 100%, rgba(255, 194, 82, 1) 100%);
+  box-shadow: 0px 8rpx 16rpx rgba(253, 164, 158, 0.3);
+  opacity: 1;
+  border-radius: 44rpx;
+  margin: 0 auto;
+  text-align: center;
+  line-height: 88rpx;
+  margin-top: 20rpx;
+}
+
+.boxlistsec {
+  border-bottom: none;
+}
+
+.chengshilist {
+  background: #f9f9f9;
+  padding: 42rpx 32rpx;
+  box-sizing: border-box;
+}
+
+.chengshihead {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.chengshiright {
+  display: flex;
+  align-items: center;
+}
+
+.chengshileft {
+  color: #06121e;
+  font-size: 36rpx;
+  font-weight: bold;
+}
+
+.rightname {
+  color: #06121e;
+  font-size: 28rpx;
+}
+
+.rihghtimg {
+  width: 22rpx;
+  height: 22rpx;
+  font-size: 0;
+  margin-left: 20rpx;
+}
+
+.citylist {
+  display: flex;
+  align-items: center;
+  flex-wrap: nowrap;
+  overflow-x: scroll;
+  margin-top: 32rpx;
+}
+
+.cityimg {
+  width: 275rpx;
+  height: 180rpx;
+  font-size: 0;
+  margin-left: 14rpx;
+  flex: 0 0 auto;
+  position: relative;
+}
+
+.listimgname {
+  position: absolute;
+  right: 22rpx;
+  bottom: 14rpx;
+}
+
+.topname {
+  color: #fff;
+  font-size: 24rpx;
+  text-align: right;
+}
+
+.bottompname {
+  color: #fff;
+  font-size: 24rpx;
+  margin-top: 4rpx;
+}
+
+.recentline {
+  padding: 0 32rpx;
+  box-sizing: border-box;
+}
+
+.recnetlinebox {
+  display: flex;
+  align-items: center;
+  flex-wrap: nowrap;
+  overflow-x: scroll;
+  margin-top: 24rpx;
+}
+
+.recentlineimg {
+  width: 633rpx;
+  height: 330rpx;
+  font-size: 0;
+  flex: 0 0 auto;
+  margin-left: 18rpx;
+  position: relative;
+}
+
+.recentlineimg:first-child {
+  margin-left: 0;
+}
+
+.recentlinetop {
+  color: #06121e;
+  font-size: 36rpx;
+  font-weight: bold;
+  margin-top: 50rpx;
+}
+
+.recentlinebottom {
+  color: #8c9198;
+  font-size: 22rpx;
+  margin-top: 6rpx;
+}
+
+.linetext {
+  position: absolute;
+  left: 46rpx;
+  bottom: 52rpx;
+}
+
+.linetopname {
+  color: #fff;
+  font-size: 36rpx;
+}
+
+.linesecname {
+  color: #fff;
+  font-size: 26rpx;
+}
+
+.linethirname {
+  display: flex;
+  align-items: center;
+  background: rgba(0, 0, 0, 1);
+  opacity: 0.5;
+  border-radius: 28rpx;
+  padding: 10rpx 22rpx;
+  box-sizing: border-box;
+  margin-top: 14rpx;
+}
+
+.linethileft {
+  width: 22rpx;
+  height: 24rpx;
+  font-size: 0;
+}
+
+.lineright {
+  color: #fff;
+  font-size: 24rpx;
+  margin-left: 14rpx;
+  z-index: 99;
+}
+
+.tuijian {
+  padding: 0 32rpx;
+  box-sizing: border-box;
+  margin-bottom: 70rpx;
+}
+
+.tuihead {
+  padding: 28rpx 0;
+  box-sizing: border-box;
+}
+
+.tuijainimg {
+  width: 686rpx;
+  height: 386rpx;
+  font-size: 0;
+  border-radius: 16rpx;
+  position: relative;
+}
+
+.tuituname {
+  position: absolute;
+  left: 24rpx;
+  bottom: 24rpx;
+}
+
+.tuijianname {
+  color: #06121e;
+  font-size: 32rpx;
+  margin-top: 14rpx;
+  font-weight: bold;
+}
+
+.tuijianleft {
+  display: flex;
+  align-items: center;
+  margin-top: 14rpx;
+}
+
+.tuijainleftname {
+  color: #8c9198;
+  font-size: 24rpx;
+}
+
+.tuijianrightname {
+  display: flex;
+  align-items: center;
+  color: #8c9198;
+  font-size: 24rpx;
+}
+
+.tuitu {
+  width: 32rpx;
+  height: 34rpx;
+  font-size: 0;
+  margin-left: 16rpx;
+}
+
+.dituname {
+  margin-left: 4rpx;
+}
+
+.lindleft {
+  display: flex;
+  align-items: center;
+}
+
+.leftitem {
+  color: #ff5a4e;
+  font-size: 24rpx;
+  margin-right: 28rpx;
+}
+
+.kind {
+  margin-top: 18rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.lieright {
+  width: 200rpx;
+  height: 54rpx;
+  background: rgba(255, 114, 113, 1);
+  opacity: 1;
+  border-radius: 20rpx;
+  padding: 10 16rpx;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+}
+
+.lineleftmoney {
+  color: #fff;
+  font-size: 24rpx;
+}
+
+.zhemoney {
+  text-decoration: line-through;
+}
+
+.lineleftmoney {
+  color: #fff;
+  font-size: 24rpx;
+  margin-left: 14rpx;
+}
+
+.tuijianitem {
+  margin-top: 48rpx;
+}
+
+.tuijianitem:first-child {
+  margin-top: 0;
+}

+// pages/login/login.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+ "navigationBarTitleText": "登录守麦"
+}

+<view class="register">
+  <view class="loginwrap">
+      <view class="loginname">等录</view>
+      <view class="logintext">
+        理想中希望获取您的头像昵称信息，以便
+        您更好的使用
+      </view>
+      <view class="bottomtext">
+          <view class="bottomtextleft">取消</view>
+          <view class="bottomtextright">确认</view>
+      </view>
+  </view>
+</view>

+/* pages/login/login.wxss */
+.loginwrap{
+  position: absolute;
+  width:622rpx;
+  height:397rpx;
+  background:rgba(255,255,255,1);
+  opacity:1;
+  border-radius: 15rpx;
+  top:310rpx;
+  left:51rpx;
+  padding: 30rpx 60rpx;
+  box-sizing: border-box;
+
+}
+.loginname{
+  color:#06121E;
+  font-weight: bold;
+  font-size: 36rpx;
+  text-align: center
+}
+.logintext{
+  color:#8C9198;
+  font-size: 28rpx;
+  margin-top:74rpx;
+}
+.bottomtext{
+  display:flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-top:42rpx;
+}
+.bottomtextleft{
+  width:214rpx;
+  height:80rpx;
+  background:rgba(238,238,238,1);
+  opacity:1;
+  border-radius:44rpx;
+  color:#8C9198;
+  font-size: 28rpx;
+  text-align: center;
+  line-height: 80rpx;
+
+}
+.bottomtextright{
+  width:214rpx;
+  height:80rpx;
+  background:linear-gradient(180deg,rgba(252,169,162,1) 0%,rgba(255,119,117,1) 100%);
+  opacity:1;
+  border-radius:44rpx;
+  color:#fff;
+  font-size: 28rpx;
+  text-align: center;
+  line-height: 80rpx;
+}

+//logs.js
+const util = require('../../utils/util.js')
+
+Page({
+  data: {
+    logs: []
+  },
+  onLoad: function () {
+    this.setData({
+      logs: (wx.getStorageSync('logs') || []).map(log => {
+        return util.formatTime(new Date(log))
+      })
+    })
+  }
+})

+{
+  "navigationBarTitleText": "查看启动日志",
+  "usingComponents": {}
+}

+<!--logs.wxml-->
+<view class="container log-list">
+  <block wx:for="{{logs}}" wx:for-item="log">
+    <text class="log-item">{{index + 1}}. {{log}}</text>
+  </block>
+</view>

+.log-list {
+  display: flex;
+  flex-direction: column;
+  padding: 40rpx;
+}
+.log-item {
+  margin: 10rpx;
+}

+// pages/opencity/opencity.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "navigationBarTitleText": "开放城市"
+}

+<view class="citylist">
+
+    <view class="citylsititem">
+        <image src="/img/sun_40.png"></image>
+
+        <view class="citytext">
+            <view class="citychinese">天津</view>
+            <view class="cityenglish">TianJin</view>
+        </view>
+    </view>
+    <view class="citylsititem">
+        <image src="/img/sun_41.png"></image>
+
+        <view class="citytext">
+            <view class="citychinese">杭州</view>
+            <view class="cityenglish">Hangzhou</view>
+        </view>
+    </view>
+    <view class="citylsititem">
+        <image src="/img/sun_42.png"></image>
+
+        <view class="citytext">
+            <view class="citychinese">大理</view>
+            <view class="cityenglish">dali</view>
+        </view>
+    </view>
+    <view class="citylsititem">
+        <image src="/img/sun_43.png"></image>
+
+        <view class="citytext">
+            <view class="citychinese">福建</view>
+            <view class="cityenglish">Fujian</view>
+        </view>
+    </view>
+  </view>

+.citylsititem{
+  width:680rpx;
+  height:306rpx;
+  font-size: 0;
+  margin:0 auto 32rpx;
+  position:relative;
+
+}
+.citytext{
+  position: absolute;
+  bottom:32rpx;
+  right:58rpx;
+}
+.citychinese{
+  color:#fff;
+  font-size: 32rpx;
+  text-align: right
+}
+.cityenglish{
+  color:#fff;
+  font-size: 32rpx;
+  text-align: right;
+  margin-top:4rpx;
+}

+// pages/roomdetail/roomdetail.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    imgUrls: [
+      '/img/tuijianimg1.png',
+      '/img/tuijianimg1.png',
+      '/img/tuijianimg1.png',
+    ],
+    indicatorDots: false,
+    autoplay: true,
+    interval: 2000,
+    duration: 1000,
+    currentSwiper: 0,
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+  swiperChange: function (e) {
+    this.setData({
+      currentSwiper: e.detail.current
+    })
+  },
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "navigationBarTitleText": "酒店详情"
+}

+<view class="roomtop">
+  <image src="/img/lineimg2.png"></image>
+
+  <view class="jiudianbox">
+    <view class="jiudianname">尊享大床房</view>
+
+    <view class="swiper_image">
+      <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" class="swiper_item_img" bindchange="swiperChange">
+        <block wx:for="{{imgUrls}}" wx:key="doct">
+          <swiper-item style="border-radius:10px;">
+            <image src="{{item}}" data-index='{{index}}' class="slide-image" bindtap='viewImg' width="355" height="150" />
+          </swiper-item>
+        </block>
+      </swiper>
+
+      <view class="dots">
+        <block wx:for="{{imgUrls}}" wx:key="">
+          <view class="dot{{index == currentSwiper ? ' active' : ''}}"></view>
+        </block>
+      </view>
+
+    </view>
+
+    <view class="rulelist">
+        <view class="ruleitem">
+            <view class="ruleitemleft">
+                <view class="leftname">面积</view>
+                <view class="rightname">20-23ml</view>
+            </view>
+
+            <view class="ruleitemright">
+                <view class="leftname">所在楼层</view>
+                <view class="rightname">2-9层</view>
+            </view>
+        </view>
+
+         <view class="ruleitem">
+            <view class="ruleitemleft">
+                <view class="leftname">房型</view>
+                <view class="rightname">双人</view>
+            </view>
+
+            <view class="ruleitemright">
+                <view class="leftname">床型</view>
+                <view class="rightname">1.8大床</view>
+            </view>
+        </view>
+    </view>
+
+    <view class="rulelist">
+        <view class="ruleitem">
+            <view class="ruleitemleft">
+                <view class="leftname">可住</view>
+                <view class="rightname">2人</view>
+            </view>
+
+            <view class="ruleitemright">
+                <view class="leftname">窗户</view>
+                <view class="rightname">有窗</view>
+            </view>
+        </view>
+
+         <view class="ruleitem">
+            <view class="ruleitemleft">
+                <view class="leftname">加床</view>
+                <view class="rightname">不可加床</view>
+            </view>
+
+            <view class="ruleitemright">
+                <view class="leftname">上网方式</view>
+                <view class="rightname">免费wifi</view>
+            </view>
+        </view>
+    </view>
+
+    <view class="lijiding">立即预订</view>
+
+
+  </view>
+</view>

+.roomtop {
+  width: 750rpx;
+  height: 284rpx;
+  font-size: 0;
+  position: relative;
+}
+
+.jiudianbox {
+  width: 750rpx;
+  background: #fff;
+  /* height: 500rpx; */
+  opacity: 1;
+  border-radius: 20rpx 20rpx 0rpx 0rpx;
+  position: absolute;
+  top: 260rpx;
+  margin-bottom:40rpx;
+}
+
+.jiudianname {
+  color: #06121e;
+  font-size: 32rpx;
+  padding: 28rpx 32rpx;
+}
+
+/* 轮播图 */
+
+.swiper_image {
+  width: 686rpx;
+  height: 344rpx;
+  font-size: 0;
+  margin: 0 auto 0;
+  position: relative;
+  box-shadow: 0px -1px 6px 0px rgba(212, 137, 96, 0.11);
+}
+
+.swiper_item_img {
+  height: 344rpx;
+}
+
+.swiper_image image {
+  width: 100%;
+  height: 100%;
+  /* box-shadow:0px -1px 6px 0px rgba(212,137,96,0.11); */
+}
+
+.swiper_item_img swiper-item {
+  width: 686rpx;
+  height: 344rpx;
+  box-shadow: 0px -1px 6px 0px rgba(212, 137, 96, 0.11);
+  display: felx;
+  align-items: center;
+  justify-content: center;
+}
+
+.swiper_item_img swiper-item image {
+  width: 100%;
+  height: 100%;
+}
+
+.rulelist {
+  padding: 0 50rpx 48rpx 50rpx;
+  box-sizing: border-box;
+  border-bottom: 1rpx solid #f5f5f5;
+  padding-bottom: 48rpx;
+}
+
+.ruleitem {
+  display: flex;
+  align-items: center;
+  margin-top: 48rpx;
+}
+
+.ruleitemleft {
+  width: 300rpx;
+  display: flex;
+  align-items: center;
+}
+
+.leftname {
+  color: #8c9198;
+  font-size: 24rpx;
+}
+
+.rightname {
+  color: #06121e;
+  font-size: 24rpx;
+  margin-left: 40rpx;
+}
+
+.ruleitemright {
+  display: flex;
+  align-items: center;
+  margin-left: 115rpx;
+}
+
+.lijiding {
+  width: 684rpx;
+  height: 88rpx;
+  background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
+  opacity: 1;
+  border-radius: 48rpx;
+  color:#fff;
+  font-size: 32rpx;
+  text-align: center;
+  line-height: 88rpx;
+  margin:68rpx auto 0;
+}

+// pages/hoteldetail/hoteldetail.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    imgUrls: [
+      '/img/tuijianimg1.png',
+      '/img/tuijianimg1.png',
+      '/img/tuijianimg1.png',
+    ],
+    indicatorDots: false,
+    autoplay: true,
+    interval: 2000,
+    duration: 1000,
+    currentSwiper: 0,
+    selitem: 1
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  selkind(e) {
+    this.setData({
+      selitem: e.currentTarget.dataset.type
+    })
+  },
+  swiperChange: function (e) {
+    this.setData({
+      currentSwiper: e.detail.current
+    })
+  },
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+ "navigationBarTitleText": "酒店详情"
+}

+
+<view class="swiper_image">
+  <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" class="swiper_item_img" bindchange="swiperChange">
+    <block wx:for="{{imgUrls}}" wx:key="doct">
+      <swiper-item style="border-radius:10px;">
+        <image src="{{item}}" data-index='{{index}}' class="slide-image" bindtap='viewImg' width="355" height="150" />
+      </swiper-item>
+    </block>
+  </swiper>
+
+  <view class="dots">
+    <block wx:for="{{imgUrls}}" wx:key="">
+      <view class="dot{{index == currentSwiper ? ' active' : ''}}"></view>
+    </block>
+  </view>
+
+</view>
+
+<view class="minsuintor">
+  <view class="minsutou">蔓图精品民宿</view>
+
+  <view class="suconcatbox">
+    <view class="suhead suheadone">
+      <view class="suheadleft">
+        <view class="suheadleimg">
+          <image src="/img/ditu.png"></image>
+        </view>
+
+        <view class="sunheadword">北京海淀区蔓图精品民宿</view>
+
+
+      </view>
+
+      <view class="suheadright">
+        <image src="/img/dianhua.png"></image>
+      </view>
+    </view>
+
+    <view class="suhead suheadsec">
+      <view class="suheadleft">
+        <view class="suheadleimg">
+          <image src="/img/haibao.png"></image>
+        </view>
+
+        <view class="sunheadword">08月29日-08月31日</view>
+      </view>
+      <view class="ruzhuright">
+        <view class="ruzhu">
+          入住
+          <text class="ruzhunum">2</text>晚
+        </view>
+
+        <view class="ruzhuyou">
+          <image src="/img/yourow.png"></image>
+        </view>
+      </view>
+
+    </view>
+  </view>
+</view>
+
+<view class="minsulist">
+    <view class='minsuitem {{selitem==1?"selactive":""}}' bindtap="selkind" data-type="1">房型介绍</view>
+    <view class='minsuitem {{selitem==2?"selactive":""}}' bindtap="selkind" data-type="2">酒店介绍</view>
+    <view class='minsuitem {{selitem==3?"selactive":""}}' bindtap="selkind" data-type="3">入住须知</view>
+    <view class='minsuitem {{selitem==4?"selactive":""}}' bindtap="selkind" data-type="4">游玩攻略</view>
+</view>
+
+<view class="jiudainjie">
+    <view class="jiudianjieleft">酒店介绍</view>
+    <view class="judianjieright">
+      <image src="/img/yourow.png"></image>
+    </view>
+</view>
+
+<view class="jiudainjie fuwujie">
+    <view class="jiudianjieleft">设施服务</view>
+    <view class="judianjieright">
+      <image src="/img/yourow.png"></image>
+    </view>
+</view>
+
+<view class="jiudianbottom">
+    <view class="jiudianbottomleft">
+        <view class="jiudianitem">
+            <view class="jiudianitemtop">
+                <image src="/img/pin.png"></image>
+            </view>
+
+            <view class="jiudianitembot">首页</view>
+        </view>
+        <view class="jiudianitem">
+            <view class="jiudianitemtop">
+                <image src="/img/kefu.png"></image>
+            </view>
+
+            <view class="jiudianitembot kename">客服</view>
+        </view>
+        <view class="jiudianitem">
+            <view class="jiudianitemtop">
+                <image src="/img/shou.png"></image>
+            </view>
+
+            <view class="jiudianitembot">收藏</view>
+        </view>
+    </view>
+
+    <view class="jiudianbottomright">购买会员免费入住</view>
+</view>

+page {
+  background: #fff;
+}
+
+.minsuintor {
+  padding: 40rpx 44rpx;
+  box-sizing: border-box;
+}
+
+.minsutou {
+  color: #06121e;
+  font-size: 38rpx;
+  font-weight: bold;
+}
+
+.suhead {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 30rpx 32rpx 30rpx 0;
+  box-sizing: border-box;
+}
+
+.suheadone {
+  margin-top: 32rpx;
+}
+
+.suheadsec {
+  margin-top: 16rpx;
+}
+
+.suheadleft {
+  display: flex;
+  align-items: center;
+}
+
+.suheadleimg {
+  width: 40rpx;
+  height: 40rpx;
+  font-size: 0;
+}
+
+.sunheadword {
+  color: #06121e;
+  font-size: 28rpx;
+  margin-left: 12rpx;
+}
+
+.suheadright {
+  width: 44rpx;
+  height: 44rpx;
+  font-size: 0;
+}
+
+.ruzhu {
+  color: #06121e;
+  font-size: 28rpx;
+}
+
+.ruzhunum {
+  color: #ff5a4e;
+  font-size: 28rpx;
+}
+
+.ruzhuright {
+  display: flex;
+  align-items: center;
+}
+
+.ruzhuyou {
+  width: 18rpx;
+  height: 18rpx;
+  font-size: 0;
+  margin-left: 16rpx;
+}
+
+.minsulist {
+  display: flex;
+  align-items: center;
+  padding: 32rpx 58rpx;
+  box-sizing: border-box;
+  justify-content: space-between;
+}
+
+.minsuitem {
+  color: #06121e;
+  font-size: 26rpx;
+}
+
+.selactive {
+  color: #06121e;
+  font-size: 38rpx;
+  font-weight: bold;
+  position: relative;
+}
+
+.selactive::after {
+  position: absolute;
+  display: block;
+  content: '';
+  width: 48rpx;
+  height: 6rpx;
+  background: #ff5a4e;
+  left: 50%;
+  right: 50%;
+  transform: translateX(-50%);
+  bottom: -12rpx;
+  border-radius: 4rpx;
+}
+
+.judianjieright {
+  width: 34rpx;
+  height: 34rpx;
+  font-size: 0;
+}
+
+.jiudainjie {
+  width: 686rpx;
+  margin: 24rpx auto 0;
+  padding: 38rpx 32rpx;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  box-shadow: 0px 16rpx 24rpx rgba(0, 0, 0, 0.02);
+  opacity: 1;
+  border-radius: 20rpx;
+}
+.jiudianjieleft{
+  color:#06121E;
+  font-size: 32rpx;
+  font-weight: bold;
+}
+.fuwujie{
+  margin-bottom:52rpx;
+}
+.jiudianbottomleft{
+    display:flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 12rpx 34rpx;
+    box-sizing: border-box;
+    width:350rpx;
+
+}
+
+.jiudianbottomright{
+  width:400rpx;
+  height:98rpx;
+  background:linear-gradient(180deg,rgba(252,169,162,1) 0%,rgba(255,119,117,1) 100%);
+  opacity:1;
+  color:#fff;
+  font-size: 32rpx;
+  text-align: center;
+  line-height: 98rpx;
+}
+
+.jiudianbottom{
+  display:flex;
+  align-items: center
+}
+
+.jiudianitem{
+  display:flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center
+}
+.jiudianitemtop{
+  width:40rpx;
+  height:40rpx;
+  font-size: 0
+}
+.jiudianitembot{
+  color:#BDC4CE;
+  font-size: 22rpx;
+}
+.kename{
+  color:#FF5A4E;
+  font-size:22rpx;
+}

+// pages/selectcity/selectcity.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    letter: ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"],
+    newcity: ['北京', '上海', '广州', '深圳', '成都', '杭州'],
+    citylist: [{ "letter": "A", "data": [{ "id": "v7", "cityName": "安徽" }] }, { "letter": "B", "data": [{ "id": "v10", "cityName": "巴中" }, { "id": "v4", "cityName": "包头" }, { "id": "v1", "cityName": "北京" }] }, { "letter": "C", "data": [{ "id": "v15", "cityName": "成都" }] }, { "letter": "D", "data": [{ "id": "v21", "cityName": "稻城" }] }, { "letter": "G", "data": [{ "id": "v17", "cityName": "广州" }, { "id": "v29", "cityName": "桂林" }] }, { "letter": "H", "data": [{ "id": "v9", "cityName": "海南" }, { "id": "v3", "cityName": "呼和浩特" }] }, { "letter": "L", "data": [{ "id": "v24", "cityName": "洛阳" }, { "id": "v20", "cityName": "拉萨" }, { "id": "v14", "cityName": "丽江" }] }, { "letter": "M", "data": [{ "id": "v13", "cityName": "眉山" }] }, { "letter": "N", "data": [{ "id": "v27", "cityName": "南京" }] }, { "letter": "S", "data": [{ "id": "v18", "cityName": "三亚" }, { "id": "v2", "cityName": "上海" }] }, { "letter": "T", "data": [{ "id": "v5", "cityName": "天津" }] }, { "letter": "W", "data": [{ "id": "v12", "cityName": "乌鲁木齐" }, { "id": "v25", "cityName": "武汉" }] }, { "letter": "X", "data": [{ "id": "v23", "cityName": "西安" }, { "id": "v28", "cityName": "香港" }, { "id": "v19", "cityName": "厦门" }] }, { "letter": "Z", "data": [{ "id": "v8", "cityName": "张家口" }] }],
+
+    currentCity:''
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function(options) {
+    this.getcity()
+  },
+
+  //获取用户当前位置
+  getcity() {
+    let that = this;
+    wx.getLocation({
+      type: 'gcj02',
+      success: function (res) {
+        // 经纬度
+        var latitude = res.latitude
+        var longitude = res.longitude
+
+
+        var aK = that.data.aK
+        wx.request({
+          url: 'https://api.map.baidu.com/geocoder/v2/?ak=y8jPDTMIuAnaVscUztce1RKfNx8v5sok&location=' + latitude + ',' + longitude + '&output=json',
+          data: {},
+          header: {
+            'content-type': 'application/json'
+          },
+          success: function (res) {
+            console.log('1234567890', res)
+            var province = res.data.result.addressComponent.province;
+            let district = res.data.result.addressComponent.district
+            that.setData({
+              currentCity: province
+            })
+           
+          }
+        })
+
+      },
+      fail: function () {
+        wx.showToast({
+          title: '授权失败,请打开GPS重新进入页面授权',
+          icon: 'none',
+          duration: 2000
+        })
+      }
+    })
+  },
+
+  reseatweizhi(){
+    this.getcity()
+  },
+
+  letterTap(e) {
+    console.log(e)
+    const Item = e.currentTarget.dataset.item;
+    this.setData({
+      cityListId: Item
+    });
+    // let scrollHeight = wx.getSystemInfoSync().windowHeight;
+    // this.setData({
+    //    scrollHeight: scrollHeight
+    // })
+
+    // var query = wx.createSelectorQuery();
+
+    // var that = this;
+    // query.select('.city_left').boundingClientRect(function (rect) {
+    //    console.log('66666',rect)
+
+    // }).exec();
+
+
+    //滚动到某一位置
+    // var me = this;
+    // var query = wx.createSelectorQuery().in(me);
+    // query.selectViewport().scrollOffset()
+    // query.select("#comment").boundingClientRect();
+    // query.exec(function (res) {
+    //   console.log(res);
+    //   var miss = res[0].scrollTop + res[1].top - 10;
+    //   wx.pageScrollTo({
+    //     scrollTop: miss,
+    //     duration: 300
+    //   });
+
+    // });
+
+
+    // if (Item == '#') {
+    //   this.setData({
+    //     scrollHeight: this.data.len
+    //   });
+
+
+    // } else {
+      
+    // }
+    // console.log('77777', Item)
+
+    // console.log('909090', this.data.scrollHeight)
+
+    // console.log("..............." + this.data.cityListId);
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function() {
+
+  }
+})

+{
+  "navigationBarTitleText": "选择城市"
+}

+<view class="selcityhead">
+  <view class="selcityleft">
+    <view class="selcityimg">
+      <image src="/img/sousuo.png"></image>
+    </view>
+
+    <view class="selinput">
+      <input placeholder='请输入搜索城市' placeholder-class='searchcity' />
+    </view>
+  </view>
+
+  <view class="selcityright">取消</view>
+</view>
+
+<view class="cityhead">
+  <view class="cityheadleft">
+    <view class="selimgsize">
+      <image src="/img/ditu.png"></image>
+    </view>
+    <view class="cityleftname">{{currentCity}}</view>
+    <view class="cityleftding">当前定位</view>
+  </view>
+
+  <view class="cityheadright" bindtap="reseatweizhi">重新定位</view>
+</view>
+
+
+<view class='city_box'>
+  <view class='city_left'>
+    <scroll-view style='width:100%;height:100%;' scroll-with-animation scroll-into-view='{{cityListId}}' class="citybox" scroll-y='true' scroll-top="{{scrollHeight}}">
+
+      <view class='new_city'>
+        <view class='new_city_title'>热门城市</view>
+        <view class='new_city_box'>
+          <text class='new_city_text' wx:for='{{newcity}}' wx:key='this' data-types='new' catchtap='cityTap' data-val='{{item}}'>{{item}}</text>
+        </view>
+      </view>
+
+
+
+      <view class='city_list_box'>
+        <block wx:for='{{citylist}}' wx:key='this' wx:for-item='letterItem' wx:for-index='letterIndex'>
+          <view class='city_first_letter' id='{{letterItem.letter}}'>{{letterItem.letter}}</view>
+          <text class='city_name' wx:for='{{letterItem.data}}' wx:key='this' data-types='list' catchtap='cityTap' data-index='{{index}}' data-val='{{item}}'>{{item.cityName}}</text>
+        </block>
+      </view>
+    </scroll-view>
+  </view>
+  <view class='city_right'>
+    <text class='letter_item' wx:for='{{letter}}' wx:key='this' catchtap='letterTap' data-item='{{item}}'>{{item}}</text>
+  </view>
+</view>

+page{
+  padding: 0 24rpx;
+  box-sizing: border-box;
+  height:100%;
+}
+.selcityhead{
+  display:flex;
+  align-items: center;
+  padding: 24rpx 0 40rpx;
+  box-sizing: border-box;
+  justify-content: space-between;
+  border-bottom:1rpx soild #EEE;
+}
+.selcityleft{
+  width:580rpx;
+  background: #F9F9F9;
+  display:flex;
+  align-items: center;
+  padding: 14rpx 34rpx;
+  box-sizing: border-box;
+}
+.selcityimg{
+  width:28rpx;
+  height:28rpx;
+  font-size: 0
+}
+.selinput{
+  width:502rpx;
+  color:#BDC4CE;
+  font-size: 28rpx;
+  margin-left:10rpx;
+}
+.searchcity{
+  color:#BDC4CE;
+  font-size: 28rpx;
+}
+.selcityright{
+  color:#06121E;
+  font-size: 28rpx;
+  
+}
+.cityhead{
+  display:flex;
+  align-items: center;
+  justify-content: space-between;
+  width:750
+}
+.cityheadleft{
+  display:flex;
+  align-items: center;
+}
+.selimgsize{
+  width:40rpx;
+  height:40rpx;
+  font-size: 0;
+}
+.cityleftname{
+  color:#06121E;
+  font-size: 32rpx;
+  margin-left:12rpx;
+  font-weight: bold;
+}
+.cityleftding{
+  color:#8C9198;
+  font-size: 24rpx;
+  margin-left:12rpx;
+}
+.cityheadright{
+  color:#FF5A4E;
+  font-size: 24rpx;
+}
+.dituimg{
+ width:40rpx;
+  height:40rpx;
+  font-size: 0;
+}
+
+/* 字母排序城市 */
+
+.city_box{
+  height:100%;
+  background: #fff;
+  display: flex;
+}
+.city_left{
+  flex: 1;
+}
+.city_right{
+  width: 60rpx;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-around;
+}
+.letter_item{
+  flex: 1;
+  display: block;
+  font-size: 24rpx;
+  color: #33B9FF;
+  text-align: center;
+}
+.city_locate,.national{
+  height: 80rpx;
+  line-height: 80rpx;
+  border-bottom: 1px solid #efefef;
+  font-size: 28rpx;
+  color: #333;
+  padding-left: 25rpx;
+}
+.city_locate_title{
+  color: #999;
+  margin-right: 20rpx;
+}
+.new_city{
+  /* background: #efefef; */
+  font-size: 28rpx;
+  margin-top:44rpx;
+}
+.new_city_title{
+  line-height: 50rpx;
+  color: #BDC4CE;
+  padding-left: 25rpx;
+  margin-bottom: 20rpx;
+}
+.new_city_box{
+  display: flex;
+  flex-wrap: wrap;
+}
+.new_city_text{
+  /* width: 200rpx; */
+  text-align: center;
+  line-height: 70rpx;
+  background: #fff;
+  border-radius: 35rpx;
+  margin:0 22rpx 22rpx 0;
+  font-size: 22rpx;
+  color:#06121E;
+  padding: 12rpx 70rpx;
+  box-sizing: border-box;
+}
+.city_first_letter{
+  line-height: 40rpx;
+  height: 40rpx;
+  padding-left: 25rpx;
+  font-size: 28rpx;
+  background: #eee;
+  color: #999;
+}
+.city_name{
+  display: block;
+  line-height: 80rpx;
+  height: 80rpx;
+  border-bottom: 1px solid #efefef;
+  font-size: 28rpx;
+  color: #333;
+  padding-left: 25rpx;
+}

+// pages/tiyan/tiyan.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "navigationBarTitleText": "体验"
+}

+<view class="tiyanhead">
+
+  <view class="tiyanzuo">
+    <view class='tiyanleft'>最新发布</view>
+    <view class="tiyanzhong">最多点赞</view>
+  </view>
+
+  <view class="tiyanright">
+    <view class='tiyanyou'>
+      <image src="/img/xie.png"></image>
+    </view>
+    <view class="tiyanxie">写笔记</view>
+  </view>
+</view>
+
+<view class="tiyanbox">
+  <view class="tiyanboxitem">
+    <view class="tiyanboxleft">
+      <image src="/img/tiyan1.png"></image>
+    </view>
+    <view class="tiyanboxright">
+      <view class="tiyantop">
+        <view class="tiyantopleft">
+          <image src="/img/tiyanren.png"></image>
+        </view>
+
+        <view class="tiyanname">温宁</view>
+
+
+
+      </view>
+
+      <view class="tiyantext">
+        位置很好，距离天津站也比较近，交通便捷，推荐!
+      </view>
+
+      <view class="tiyanbottom">
+        <view class="tiyanbotleft">
+          <view class="tiyanbolefimg">
+            <image src="/img/ditu.png"></image>
+          </view>
+          <view class="ditutext">海淀区蔓图精品民宿</view>
+        </view>
+
+        <view class="tiyanright">
+          <view class="tiyanzanimg">
+            <image src="/img/zan.png"></image>
+          </view>
+          <view class="zannum">67</view>
+        </view>
+
+      </view>
+    </view>
+  </view>
+  <view class="tiyanboxitem">
+    <view class="tiyanboxleft">
+      <image src="/img/tiyan1.png"></image>
+    </view>
+    <view class="tiyanboxright">
+      <view class="tiyantop">
+        <view class="tiyantopleft">
+          <image src="/img/tiyanren.png"></image>
+        </view>
+
+        <view class="tiyanname">温宁</view>
+
+
+
+      </view>
+
+      <view class="tiyantext">
+        位置很好，距离天津站也比较近，交通便捷，推荐!
+      </view>
+
+      <view class="tiyanbottom">
+        <view class="tiyanbotleft">
+          <view class="tiyanbolefimg">
+            <image src="/img/ditu.png"></image>
+          </view>
+          <view class="ditutext">海淀区蔓图精品民宿</view>
+        </view>
+
+        <view class="tiyanright">
+          <view class="tiyanzanimg">
+            <image src="/img/zan.png"></image>
+          </view>
+          <view class="zannum">67</view>
+        </view>
+
+      </view>
+    </view>
+  </view>
+
+  <view class="tiyanboxitem">
+    <view class="tiyanboxleft">
+      <image src="/img/tiyan1.png"></image>
+    </view>
+    <view class="tiyanboxright">
+      <view class="tiyantop">
+        <view class="tiyantopleft">
+          <image src="/img/tiyanren.png"></image>
+        </view>
+
+        <view class="tiyanname">温宁</view>
+
+
+
+      </view>
+
+      <view class="tiyantext">
+        位置很好，距离天津站也比较近，交通便捷，推荐!
+      </view>
+
+      <view class="tiyanbottom">
+        <view class="tiyanbotleft">
+          <view class="tiyanbolefimg">
+            <image src="/img/ditu.png"></image>
+          </view>
+          <view class="ditutext">海淀区蔓图精品民宿</view>
+        </view>
+
+        <view class="tiyanright">
+          <view class="tiyanzanimg">
+            <image src="/img/zan.png"></image>
+          </view>
+          <view class="zannum">67</view>
+        </view>
+
+      </view>
+    </view>
+  </view>
+
+  <view class="tiyanboxitem">
+    <view class="tiyanboxleft">
+      <image src="/img/tiyan1.png"></image>
+    </view>
+    <view class="tiyanboxright">
+      <view class="tiyantop">
+        <view class="tiyantopleft">
+          <image src="/img/tiyanren.png"></image>
+        </view>
+
+        <view class="tiyanname">温宁</view>
+
+
+
+      </view>
+
+      <view class="tiyantext">
+        位置很好，距离天津站也比较近，交通便捷，推荐!
+      </view>
+
+      <view class="tiyanbottom">
+        <view class="tiyanbotleft">
+          <view class="tiyanbolefimg">
+            <image src="/img/ditu.png"></image>
+          </view>
+          <view class="ditutext">海淀区蔓图精品民宿</view>
+        </view>
+
+        <view class="tiyanright">
+          <view class="tiyanzanimg">
+            <image src="/img/zan.png"></image>
+          </view>
+          <view class="zannum">67</view>
+        </view>
+
+      </view>
+    </view>
+  </view>
+</view>

+page{
+  background: #fff;
+}
+.tiyanhead{
+  padding: 18rpx 34rpx;
+
+}
+
+.tiyanleft{
+  color:#06121E;
+  font-size: 38rpx;
+  position: relative;
+  font-weight: bold;
+}
+.tiyanleft::after{
+  display:block;
+  content:'';
+  width:48rpx;
+  height:6rpx;
+  background: #FF5A4E;
+  position: absolute;
+  left:48rpx;
+  bottom:-12rpx;
+  border-radius: 14rpx;
+
+}
+.tiyanhead{
+  display:flex;
+  align-items: center;
+  justify-content: space-between
+}
+.tiyanzuo{
+  display:flex;
+  align-items: center
+}
+.tiyanzhong{
+  color:#5B5E63;
+  font-size: 26rpx;
+  margin-left:60rpx;
+}
+.tiyanright{
+  display:flex;
+  align-items: center;
+  
+}
+.tiyanyou{
+  width:44rpx;
+  height:40rpx;
+}
+.tiyanxie{
+  color:#5B5E63;
+  font-size: 26rpx;
+  margin-left:5rpx;
+}
+.tiyanbox{
+  margin-bottom:28rpx;
+}
+.tiyanboxitem{
+  display:flex;
+  align-items: center;
+  padding: 34rpx 20rpx;
+  margin-top:24rpx;
+}
+.tiyanboxleft{
+  width:220rpx;
+  height:220rpx;
+  font-size: 0;
+  flex:0 0 auto;
+}
+.tiyanbox{
+  padding: 24rpx 34rpx;
+  box-sizing: border-box
+}
+.tiyanboxright{
+  margin-left:54rpx;
+}
+.tiyantopleft{
+  width:40rpx;
+  height:40rpx;
+  font-size: 0
+}
+.tiyantop{
+  display:flex;
+  align-items: center
+}
+.tiyanname{
+  color:#06121E;
+  font-size: 28rpx;
+  margin-left:16rpx;
+
+}
+.tiyantext{
+  color:#06121E;
+  font-size: 30rpx;
+  margin-top:18rpx;
+}
+.tiyanbottom{
+  display:flex;
+  align-items: center;
+  margin-top:46rpx;
+  justify-content: space-between
+}
+.tiyanbolefimg{
+  width:32rpx;
+  height:31rpx;
+  font-size: 0
+}
+.tiyanbotleft{
+  display:flex;
+  align-items: center
+}
+.tiyanright{
+  display:flex;
+  align-items: center;
+  margin-left:18rpx;
+}
+.tiyanzanimg{
+  width:32rpx;
+  height:32rpx;
+  font-size: 0
+}
+.zannum{
+  color:#FF5A4E;
+  font-size: 22rpx;
+  margin-left:15rpx;
+}
+.ditutext{
+  color:#8C9198;
+  font-size: 22rpx;
+  width:200rpx;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  margin-left:4rpx;
+}

+// pages/wantruzhu/wantruzhu.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "navigationBarTitleText": "我想入住"
+}

+<view class="wantheadenter">
+  <image src="/img/sun_19.png"></image>
+</view>
+
+<view class="selectcity">
+  <view class="selectname">请选择您最想去的5个城市</view>
+  <view class="selectcityitem">
+    <view class="cityiemblock">
+      北京
+    </view>
+    <view class="cityiemblock">
+      天津
+    </view>
+    <view class="cityiemblock">
+      石家庄
+    </view>
+    <view class="cityiemblock">
+      台湾
+    </view>
+    <view class="cityiemblock">
+      深圳
+    </view>
+  </view>
+  <view class="wanthead">
+      <view class="wantleft">我还想去</view>
+      <view class="wantright">0/20</view>
+  </view>
+
+  <view class="wanttext">
+      <input placeholder='' placeholder-class='wantword'/>
+  </view>
+
+
+</view>
+
+<view class="tijiao">提交</view>

+.wantheadenter{
+  width:750rpx;
+  height:172rpx;
+  font-size: 0
+}
+.selectcity{
+    padding: 42rpx 56rpx;
+    box-sizing: border-box
+}
+.selectname{
+  color:#06121E;
+  font-size: 32rpx;
+  font-weight: bold;
+  
+}
+.selectcityitem{
+  display:flex;
+  align-items: center;
+  flex-wrap:wrap;
+}
+.cityiemblock{
+  padding: 7rpx 74rpx;
+  color:#06121E;
+  font-size: 26rpx;
+  margin-top:24rpx;
+}
+.wanthead{
+  display:flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-top:44rpx;
+}
+.wanttext{
+  width:648rpx;
+  height:80rpx;
+  background:rgba(249,249,249,1);
+  opacity:1;
+  border-radius:60rpx;
+  border:1rpx solid #f5f5f5;
+  margin-top:24rpx;
+  display:flex;
+  align-items: center;
+  justify-content: center
+}
+.wanttext input{
+  width:500rpx;
+}
+.wantleft{
+  color:#06121E;
+  font-size:32rpx;
+  font-weight: bold;
+}
+.wantright{
+  color:#8C9198;
+  font-size: 24rpx;
+
+}
+.tijiao{
+  width:684rpx;
+  height:88rpx;
+  background:linear-gradient(180deg,rgba(252,169,162,1) 0%,rgba(255,119,117,1) 100%);
+  opacity:1;
+  border-radius:48rpx;
+  margin:432rpx auto 0;
+  text-align: center;
+  line-height: 88rpx;
+  color:#fff;
+  font-size: 32rpx;
+}

+// pages/yuding/yuding.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    zhifushow:false
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "navigationBarTitleText": "预定"
+}

+<view class="yudingtou">
+  <view class="yudingtouname">蔓图精品民宿</view>
+  <view class="yudingtoutext">尊享大床房（含早）</view>
+
+  <view class="yudingbot">
+    <view class="yudingbotleft">
+      <image src="/img/weizhi.png"></image>
+    </view>
+
+    <view class="weizhitext">北京市朝阳区香河园路左家庄15号院</view>
+  </view>
+</view>
+
+<view class='yuding'>
+
+
+  <view class="housetime">
+    <view class="houseleft">
+      <view class="houselefttop">08月21日</view>
+      <view class="houseleftbottom">(周三入住)</view>
+    </view>
+
+    <view class="middletime">
+
+      <view class="housemiddle">
+        <view class="housemiddletop">共2晚</view>
+        <image src="/img/rowright.png"></image>
+      </view>
+    </view>
+
+    <view class="houseleft">
+      <view class="houselefttop">08月21日</view>
+      <view class="houseleftbottom">(周三入住)</view>
+    </view>
+  </view>
+
+  <view class="ruzhuren">入住人：李娜</view>
+  <view class="ruzhuphone">手机号：13216599216</view>
+  <view class="ruzhubot">
+    <view class="ruzhubotleft">
+      <view class="ruzhuleftimg">
+        <image src="/img/sun_23.png"></image>
+      </view>
+      <view class='ruzhutext'>放心订 2019-08-21 18:00前可免费取消</view>
+    </view>
+  </view>
+
+
+</view>
+
+<view class="yudingsec">
+  <view class="yudingtopname">退订政策</view>
+  <view class="yudingtext">
+    因个人原因无法入住已预约酒店 1、请在48小时申请取消; 2、入住前未能取消扣除30%的保证金;如未能在订单日期14:00前取消订单 3、或未能实际入住，平台扣除全额保证金
+  </view>
+
+  <view class="yudingtopname">退订政策</view>
+  <view class="yudingtext">
+    会员预订房间需预付与该房间市场价等额的保证金，离店后，保证金原路退回您的支付宝账户。
+  </view>
+  
+</view>
+
+
+<view class="yudingbottom">
+    <view class="yudingbottomleft">
+        <view class="yudingleftname">￥1902</view>
+         <view class="yudingleftcontent">离店退还保证金</view>
+    </view>
+
+    <view class="yudingbottomright">支付保证金</view>
+</view>
+
+
+<!-- 支付保证金 -->
+
+<view class="register" wx:if="{{zhifushow}}">
+    <view class="zhifuwrap">
+        <view class="zhifuname">支付保证金</view>
+        <view class="zhifumoney">￥1902</view>
+
+        <view class="zhifutui">退房退还保证金</view>
+
+        <view class="zhifutuihuan">支付保证金</view>
+    </view>
+
+</view>

+page {
+  background: #f9f9f9;
+}
+
+.yudingtou {
+  width: 750rpx;
+  height: 348rpx;
+  background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
+  opacity: 1;
+  padding: 0 32rpx;
+  box-sizing: border-box;
+  overflow: hidden;
+  position: relative;
+}
+
+.yudingtouname {
+  color: #fff;
+  font-size: 40rpx;
+  margin-top: 60rpx;
+}
+
+.yudingtoutext {
+  color: #fff;
+  font-size: 28rpx;
+  margin-top: 12rpx;
+}
+
+.yudingbotleft {
+  width: 30rpx;
+  height: 30rpx;
+  font-size: 0;
+}
+
+.weizhitext {
+  color: #fff;
+  font-size: 24rpx;
+  margin-left: 10rpx;
+}
+
+.yudingbot {
+  display: flex;
+  align-items: center;
+  margin-top: 18rpx;
+}
+
+.yuding {
+  width: 686rpx;
+  height: 400rpx;
+  background: #fff;
+  border-radius: 20rpx;
+  padding: 40rpx 60rpx;
+  box-sizing: border-box;
+  margin: 26rpx auto 0;
+  background: rgba(255, 255, 255, 1);
+  box-shadow: 0px 16rpx 24rpx rgba(0, 0, 0, 0.02);
+  opacity: 1;
+  z-index: 33;
+  position: absolute;
+  top: 246rpx;
+  left: 32rpx;
+}
+
+.yudingsec {
+  width: 686rpx;
+  /* height: 400rpx; */
+  background: #fff;
+  border-radius: 20rpx;
+  padding: 40rpx 60rpx;
+  box-sizing: border-box;
+  margin: 0 auto 150rpx;
+  background: rgba(255, 255, 255, 1);
+  box-shadow: 0px 16rpx 24rpx rgba(0, 0, 0, 0.02);
+  opacity: 1;
+  z-index: 33;
+  position: absolute;
+  top: 695rpx;
+  left: 32rpx;
+}
+
+.housetime {
+  display: flex;
+  align-items: center;
+  /* padding: 40rpx 106rpx; *//* box-sizing: border-box; */
+  justify-content: space-between;
+}
+
+.housemiddle {
+  width: 96rpx;
+  height: 56rpx;
+  font-size: 0;
+  position: relative;
+}
+
+.houselefttop {
+  color: #06121e;
+  font-size: 36rpx;
+  font-weight: bold;
+}
+
+.houseleftbottom {
+  color: #8c9198;
+  font-size: 24rpx;
+  text-align: center;
+  margin-top: 8rpx;
+}
+
+.housemiddletop {
+  width: 80rpx;
+  color: #ff5a4e;
+  font-size: 24rpx;
+  text-align: center;
+  position: absolute;
+  top: -15rpx;
+}
+
+.yudingtopleftname {
+  color: #06121e;
+  font-size: 32rpx;
+  font-weight: bold;
+  width: 158rpx;
+  display: flex;
+  align-items: center;
+}
+
+.ruzhu {
+  color: #8c9198;
+  font-size: 24rpx;
+  margin-top: 8rpx;
+  text-align: center;
+  width: 158rpx;
+}
+
+.yudingtop {
+  display: flex;
+  align-items: center;
+}
+
+.ydingname {
+  color: #333;
+}
+
+.ruzhuren {
+  color: #5b5e63;
+  font-size: 28rpx;
+  margin-top: 28rpx;
+}
+
+.ruzhuphone {
+  color: #5b5e63;
+  font-size: 28rpx;
+  margin-top: 20rpx;
+}
+
+.ruzhubot {
+  display: flex;
+  align-items: center;
+}
+
+.ruzhuleftimg {
+  width: 27rpx;
+  height: 27rpx;
+  font-size: 0;
+}
+
+.ruzhutext {
+  color: #ff5a4e;
+  font-size: 24rpx;
+  margin-left: 15rpx;
+}
+
+.ruzhubotleft {
+  display: flex;
+  align-items: center;
+  margin-top: 82rpx;
+}
+
+.yudingtext {
+  color: #8c9198;
+  font-size: 28rpx;
+  margin-top: 26rpx;
+}
+
+.yudingtopname {
+  color: #06121e;
+  font-size: 32rpx;
+  font-weight: bold;
+  margin-top: 24rpx;
+}
+
+.yudingbottom {
+  display: flex;
+  align-items: center;
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  z-index: 44;
+}
+
+.yudingbottomleft {
+  width: 510rpx;
+  display: flex;
+  align-items: center;
+  padding: 32rpx;
+  box-sizing: border-box;
+  background: #fff;
+}
+
+.yudingbottomright {
+  width: 240rpx;
+  padding: 36rpx 0;
+  /* height:98rpx; */
+  background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
+  opacity: 1;
+  color: #fff;
+  font-size: 28rpx;
+  text-align: center;
+  box-sizing: border-box;
+}
+
+.yudingleftname {
+  color: #ff5a4e;
+  font-size: 36rpx;
+  font-weight: bold;
+}
+
+.yudingleftcontent {
+  color: #5b5e63;
+  font-size: 24rpx;
+  margin-left: 20rpx;
+}
+
+.zhifuwrap {
+  width: 622rpx;
+  height: 403rpx;
+  background: rgba(255, 255, 255, 1);
+  opacity: 1;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  padding: 30rpx 84rpx;
+  box-sizing: border-box;
+  border-radius: 16rpx;
+}
+
+.zhifuname {
+  color: #06121e;
+  font-size: 36rpx;
+  text-align: center;
+  font-weight: bold;
+}
+
+.zhifumoney {
+  color: #ff5a4e;
+  font-size: 40rpx;
+  text-align: center;
+  margin-top: 60rpx;
+}
+
+.zhifutui {
+  color: #8c9198;
+  font-size: 26rpx;
+  text-align: center;
+  margin-top: 14rpx;
+}
+
+.zhifutuihuan {
+  width: 442rpx;
+  height: 80rpx;
+  background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
+  opacity: 1;
+  border-radius: 44rpx;
+  color:#fff;
+  text-align: center;
+  line-height: 80rpx;
+  margin-top:32rpx;
+}

+// pages/yudingfinish/yudingfinish.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "navigationBarTitleText": "预定成功"
+}

+
+<view class="yudingsucehead">
+    <view class="yudingstop">
+        <view class="yudingstopleft">
+            <image src="/img/yudingfinish.png"></image>
+        </view>
+        <view class="yudingstopright">保证金支付成功,欢迎入住！</view>
+    </view>
+
+    <view class="seedetail">
+        <view class="seedetailzuo">查看详情</view>
+        <view class="seedetailyou">
+            <image src="/img/yourowrow.png"></image>
+        </view>
+    </view>
+</view>
+
+<view class="mantu">
+    <view class="mantuname">蔓图精品民宿</view>
+    <view class="mantugao">高级大床房 1间(含早)</view>
+    <view class="mantuyue">2019-08-21日 周三   至   2019-08-23日 周五</view>
+    <view class="totalwan">共2晚</view>
+
+    <view class='zongjia'>
+        <view class="zongjialeft">总价</view>
+        <view class="zongjiaright">￥1902</view>
+    </view>
+</view>
+
+<view class="backindex">返回首页</view>

+page {
+  background: #f4f8fb;
+}
+
+.yudingsucehead {
+  width: 750rpx;
+  height: 232rpx;
+  background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
+  opacity: 1;
+  padding: 50rpx 22rpx;
+  box-sizing: border-box;
+}
+
+.yudingstop {
+  display: flex;
+  align-items: center;
+}
+
+.yudingstopleft {
+  width: 80rpx;
+  height: 80rpx;
+  font-size: 0;
+}
+
+.yudingstopright {
+  color: #fff;
+  font-size: 40rpx;
+}
+
+.seedetail {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+}
+
+.seedetailyou {
+  width: 12rpx;
+  height: 12rpx;
+  font-size: 0;
+}
+
+.seedetailzuo {
+  color: #fff;
+  font-size: 24rpx;
+}
+
+.mantu {
+  width: 686rpx;
+  height: 476rpx;
+  background: rgba(255, 255, 255, 1);
+  box-shadow: 0px 16rpx 24rpx rgba(0, 0, 0, 0.02);
+  opacity: 1;
+  border-radius: 20rpx;
+  padding: 48rpx 32rpx;
+  box-sizing: border-box;
+  position: absolute;
+  top: 194rpx;
+  left: 32rpx;
+}
+
+.mantuname {
+  color: #06121e;
+  font-size: 40rpx;
+  font-weight: bold;
+}
+
+.mantugao {
+  color: #5b5e63;
+  font-size: 28rpx;
+  margin-top: 16rpx;
+}
+
+.mantuyue {
+  color: #5b5e63;
+  font-size: 28rpx;
+  margin-top: 66rpx;
+}
+
+.totalwan {
+  color: #ff5a4e;
+  font-size: 28rpx;
+  text-align: center;
+  margin-top: 32rpx;
+}
+
+.zongjia {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-top: 60rpx;
+}
+
+.zongjialeft {
+  color: #06121e;
+  font-size: 28rpx;
+}
+
+.zongjiaright {
+  color: #ff5a4e;
+  font-size: 36rpx;
+}
+
+.backindex {
+  width: 646rpx;
+  height: 88rpx;
+  border: 1px solid rgba(140, 145, 152, 1);
+  opacity: 1;
+  border-radius: 44rpx;
+  margin:40rpx auto 0;
+  position: absolute;
+  top:710rpx;
+  left:52rpx;
+  text-align: center;
+  line-height: 88rpx;
+}

+// pages/yudingzhinan/yudingzhinan.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "navigationBarTitleText": "预定指南"
+}

+<view class="seecity">
+  <view class="yudingti">
+    <view class='yudingtinum'>1</view>
+    <view class="yudingtiword">查看我想去的城市可无酒店？</view>
+  </view>
+
+  <view class="questext">1、您可在“首页”页面，在搜索栏输入你想去的城市，点击(查找房源)查看在该城市合作的所以酒店</view>
+
+  <view class="searchlist">
+    <view class="searchhead">
+      <view class="searchleft">
+        <image src="/img/sousuo.png"></image>
+      </view>
+      <view class="searchname">
+        <input placeholder='请输入搜索内容' placeholder-class='entername' />
+      </view>
+    </view>
+
+    <view class="enterbox">
+      <view class="enterboxleft">
+        <view class="enterboxlist">
+          <view class="boxleft"></view>
+          <view class="boxmiddle">08月21日</view>
+          <view class="boxright">（周三入住）</view>
+        </view>
+        <view class="enterboxlist boxlistsec">
+          <view class="boxleft"></view>
+          <view class="boxmiddle">08月23日</view>
+          <view class="boxright">（周五离店）</view>
+        </view>
+      </view>
+      <view class="enterboxright">共2晚</view>
+    </view>
+
+    <view class="searchnametext">查找房源</view>
+  </view>
+
+  <view class="questext sectext">2、您可在“首页-查看全部酒店”页面，查看我们全部民宿。</view>
+
+
+
+  <view class="yutuiimg">
+    <image src="/img/sun_45.png"></image>
+  </view>
+</view>
+
+<view class="seecity">
+  <view class="yudingti">
+    <view class='yudingtinum'>2</view>
+    <view class="yudingtiword">如何收藏心仪的酒店？</view>
+  </view>
+
+  <view class="colecttext">点击酒店信息页面底部（收藏），可在（我的-我的收藏）查看你所收藏的酒店
+    <view class="colllectimg">
+      <image src="/img/sun_46.png"></image>
+    </view>
+
+    <view class="xinyiimg">
+      <image src="/img/sun_47.png"></image>
+    </view>
+
+  </view>
+</view>
+
+<view class="seecity">
+  <view class="yudingti">
+    <view class='yudingtinum'>3</view>
+    <view class="yudingtiword">如何预订房间？</view>
+  </view>
+
+  <view class="questext">1、选好心仪酒店，查看酒店所以房型，通过房型图片查看该房型详细信息</view>
+  <view class="yudingimg">
+    <image src="/img/sun_48.png"></image>
+  </view>
+
+  <view class="questext sectext">2、页面选择入住日期，向下滑动选择房型，点击房型的（免费预订）</view>
+
+  <view class="select1img">
+    <image src="/img/sun_49.png"></image>
+  </view>
+
+  <view class="select1img">
+    <image src="/img/sun_50.png"></image>
+  </view>
+
+  <view class="questext sectext">3、支付保证金</view>
+
+  <view class="zhifuimg">
+    <image src="/img/sun_51.png"></image>
+  </view>
+
+
+</view>
+
+<view class="seecity">
+  <view class="yudingti">
+    <view class='yudingtinum'>4</view>
+    <view class="yudingtiword">如何确认是否预约成功？</view>
+  </view>
+
+  <view class="questext">点击酒（我的-我的订单-待出行）查看所以已预定成功的房型</view>
+
+  <view class="yudingimg">
+    <image src="/img/sun_52.png"></image>
+  </view>
+</view>
+
+<view class="seecity">
+  <view class="yudingti">
+    <view class='yudingtinum'>5</view>
+    <view class="yudingtiword">如何办理入住</view>
+  </view>
+
+  <view class="questext">在规定时间内抵达酒店，出示会员订单及本人身份证原件即可办理入住，点击入住须知可查看入住时间，所需证件等详细信息</view>
+
+  <view class="cancelimg">
+    <image src="/img/sun_53.png"></image>
+  </view>
+
+</view>
+
+<view class="seecity">
+  <view class="yudingti">
+    <view class='yudingtinum'>6</view>
+    <view class="yudingtiword">如何取消已预订的房间？</view>
+  </view>
+
+  <view class="questext">1、点击我的-我的订单-待出行</view>
+
+  <view class="quxiaoimg">
+    <image src="/img/sun_54.png"></image>
+  </view>
+
+  <view class="questext sectext">2、点击（我的-我的订单-订单详情-取消订单）</view>
+  <view class="wnxinti">温馨提示：若因个人原因无法入住预订酒店，请务必提前48小时申请取消。如您未能48小时申请取消订单，平台将扣除30%保证金。未取消预订且未实际入住，将被扣除全部保证金</view>
+
+  <view class="quimg">
+    <image src="/img/sun_55.png"></image>
+  </view>
+</view>
+
+<view class="seecity">
+  <view class="yudingti">
+    <view class='yudingtinum'>7</view>
+    <view class="yudingtiword">保证金如何退还给我？</view>
+  </view>
+
+
+</view>
+
+<view class="seecity">
+  <view class="yudingti">
+    <view class='yudingtinum'>8</view>
+    <view class="yudingtiword">如何联系客服？</view>
+  </view>
+
+   <view class="questext">如以上内容未解决您的疑问，请点击（我的客服），客服会为您解答。</view>
+
+  <view class="kefuimg">
+      <image src="/img/sun_56.png"></image>
+  </view>
+</view>

+page{
+  background: #F9F9F9
+}
+.yudingtinum{
+  width:40rpx;
+  height:40rpx;
+  background: #FF5A4E;
+  color:#fff;
+  font-size: 28rpx;
+  text-align: center;
+  line-height: 40rpx;
+  border-radius: 8rpx;
+}
+.seecity{
+  width:686rpx;
+  margin:24rpx auto 0;
+  background: #fff;
+  padding: 42rpx 30rpx;
+  box-sizing: border-box
+
+}
+.yudingti{
+  display:flex;
+  align-items: center
+}
+.yudingtiword{
+  color:#06121E;
+  font-size: 32rpx;
+  font-weight: bold;
+  margin-left:20rpx;
+}
+.questext{
+  color:#5B5E63;
+  font-size: 28rpx;
+  margin-top:72rpx;
+
+
+}
+
+.searchlist {
+  padding-bottom: 40rpx;
+}
+
+.searchleft {
+  width: 28rpx;
+  height: 28rpx;
+  font-size: 0;
+}
+
+.searchhead {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 22rpx 92rpx;
+  box-sizing: border-box;
+  border-bottom: 1rpx solid #f5f5f5;
+}
+
+.searchname {
+  margin-left: 12rpx;
+  color: #06121e;
+  font-size: 28rpx;
+}
+
+.entername {
+  color: #06121e;
+  font-size: 28rpx;
+}
+
+.boxleft {
+  width: 16rpx;
+  height: 16rpx;
+  border-radius: 50%;
+  background: #ff5a4e;
+}
+
+.enterboxlist {
+  display: flex;
+  align-items: center;
+  padding: 28rpx 0;
+  box-sizing: border-box;
+  border-bottom: 1rpx solid #f5f5f5;
+}
+
+.enterbox {
+  padding: 0 32rpx;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.enterboxleft {
+  width: 465rpx;
+}
+
+.boxmiddle {
+  color: #06121e;
+  font-size: 36rpx;
+  margin-left: 30rpx;
+}
+
+.boxright {
+  color: #8c9198;
+  font-size: 24rpx;
+  margin-left: 8rpx;
+}
+
+.enterboxright {
+  color: #ff5a4e;
+  font-size: 24rpx;
+}
+
+.searchnametext {
+  color: #fff;
+  font-size: 32rpx;
+  width: 618rpx;
+  height: 88rpx;
+  background: linear-gradient(90deg, rgba(255, 114, 113, 1) 0%, rgba(255, 122, 120, 1) 13%, rgba(252, 172, 165, 1) 100%, rgba(255, 194, 82, 1) 100%);
+  box-shadow: 0px 8rpx 16rpx rgba(253, 164, 158, 0.3);
+  opacity: 1;
+  border-radius: 44rpx;
+  margin: 0 auto;
+  text-align: center;
+  line-height: 88rpx;
+  margin-top: 20rpx;
+}
+.sectext{
+  margin-top:20rpx;
+}
+
+.chengshihead {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-top:40rpx;
+}
+
+.chengshiright {
+  display: flex;
+  align-items: center;
+}
+
+.chengshileft {
+  color: #06121e;
+  font-size: 36rpx;
+  font-weight: bold;
+}
+
+.rightname {
+  color: #06121e;
+  font-size: 28rpx;
+}
+
+.rihghtimg {
+  width: 22rpx;
+  height: 22rpx;
+  font-size: 0;
+  margin-left: 20rpx;
+}
+.yutuiimg{
+  width:625rpx;
+  height:158rpx;
+  font-size: 0;
+  margin-top:12rpx;
+}
+.colecttext{
+  color:#5B5E63;
+  font-size: 28rpx;
+  margin-top:72rpx;
+}
+.colllectimg{
+  width:661rpx;
+  height:118rpx;
+  font-size: 0;
+  margin-top:4rpx;
+}
+.xinyiimg{
+  width:626rpx;
+  height:290rpx;
+  font-size: 0;
+  margin-top:12rpx;
+}
+.yudingimg{
+  width:626rpx;
+  height:470rpx;
+  font-size:0;
+  margin-top:4rpx;
+}
+.select1img{
+  width:661rpx;
+  height:190rpx;
+  font-size:0
+}
+.zhifuimg{
+  width:661rpx;
+  height:468rpx;
+  font-size: 0;
+  margin-top:12rpx;
+}
+.yudingimg{
+  width:626rpx;
+  height:270rpx;
+  font-size: 0;
+  margin-top:8rpx;
+}
+.cancelimg{
+  width:626rpx;
+  height:100rpx;
+  font-size: 0;
+  margin-top:8rpx;
+}
+.quxiaoimg{
+  width:626rpx;
+  height:270rpx;
+  font-size:0;
+  margin-top:12rpx;
+}
+.wnxinti{
+  color:#5B5E63;
+  font-size:28rpx;
+  margin-top:10rpx;
+}
+.quimg{
+  width:626rpx;
+  height:98rpx;
+  font-size:0
+}
+.kefuimg{
+  width:626rpx;
+  height:288rpx;
+  font-size: 0;
+  margin-top:24rpx;
+}

+// pages/zhucexieyi/zhucexieyi.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

+{
+  "navigationBarTitleText": "注册协议"
+}

+<view class="xieyiname">
+    <view class="xieyinametop">注册协议</view>
+    <view class="xieyicontent">[审慎阅读]您在申请购买守麦流程中点击同意本协议之 前，应当认真阅读本协议。请您务必审慎阅读、充分理解 条款内容，特别是免除或限制责任的条款、法律适用和争 议解决条款。免除或者限制责任的条款将以粗体下划线标 识，您应重点阅读。如你对协议有任何疑问，请联系守麦 小程序平台客服。 [签约动作]当您按照签约页面提示填写信息、阅读并同, 意本协议且完成全部购买守麦程序后，即表示您已充分阅 读、理解并接受本协议的全部内容，并与守麦达成-致， 成为“守麦会员”。阅读本协议的过程中，如果您不同意 本协议或其中任何条款约定，您应立即停止购买流程。 守麦会员服务协议 最新版本生效时间: 2019年09月10日 导言 本协议是守麦会员与杭州守麦网络科技有限公司(下 称“守麦”)之间关于您成为守麦会员及使用守麦提供的 会员服务(下称“会员服务”)所订立的有效契约，具有 法律效力。“ 会员服务”是指守麦为守麦会员提供的会员, 权益;“守麦会员” 是指完成了成为守麦会员的所有程序 且在会员服务期限内遵守相关服务使用规则下享受守麦会 员服务的自然人。 守麦已经以标粗体下划线或其他合理方式提示您重点 阅读协议中与您的权益(可能)存在重大关系的条款(包括</view>
+</view>

+.xieyinametop{
+  color:#06121E;
+  font-size: 28rpx;
+  text-align: center;
+  margin-top:34rpx;
+}
+.xieyicontent{
+  color:#06121E;
+  font-size: 28rpx;
+  
+  padding: 0 32rpx;
+  box-sizing: border-box;
+  margin-top:78rpx;
+  margin-bottom:40rpx;
+}

+{
+	"description": "项目配置文件",
+	"packOptions": {
+		"ignore": []
+	},
+	"setting": {
+		"urlCheck": false,
+		"es6": true,
+		"postcss": true,
+		"minified": true,
+		"newFeature": true,
+		"autoAudits": false,
+		"checkInvalidKey": true
+	},
+	"compileType": "miniprogram",
+	"libVersion": "2.8.3",
+	"appid": "wx1f51f42105b63343",
+	"projectname": "wineshopyuyue",
+	"debugOptions": {
+		"hidedInDevtools": []
+	},
+	"isGameTourist": false,
+	"simulatorType": "wechat",
+	"simulatorPluginLibVersion": {},
+	"condition": {
+		"search": {
+			"current": -1,
+			"list": []
+		},
+		"conversation": {
+			"current": -1,
+			"list": []
+		},
+		"game": {
+			"currentL": -1,
+			"list": []
+		},
+		"miniprogram": {
+			"current": -1,
+			"list": []
+		}
+	}
+}

+{
+  "desc": "关于本文件的更多信息，请参考文档 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html",
+  "rules": [{
+  "action": "allow",
+  "page": "*"
+  }]
+}

+const formatTime = date => {
+  const year = date.getFullYear()
+  const month = date.getMonth() + 1
+  const day = date.getDate()
+  const hour = date.getHours()
+  const minute = date.getMinutes()
+  const second = date.getSeconds()
+
+  return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':')
+}
+
+const formatNumber = n => {
+  n = n.toString()
+  return n[1] ? n : '0' + n
+}
+
+module.exports = {
+  formatTime: formatTime
+}