|
|
@@ -6,10 +6,12 @@
|
|
|
|
|
|
<!-- 顶部图片区域 -->
|
|
|
<view class="header">
|
|
|
- <img mode="aspectFill" src="https://chtech.ncjti.edu.cn/hotelReservation/image/14.png" />
|
|
|
- <img class="img" src="https://chtech.ncjti.edu.cn/hotelReservation/image/16.png" />
|
|
|
- <img class="img2" src="https://chtech.ncjti.edu.cn/hotelReservation/image/17.png" />
|
|
|
- <view class="header_msg">有一种生活叫靖安</view>
|
|
|
+ <swiper class="header_swiper" circular :interval="3000">
|
|
|
+ <swiper-item v-for="banner in headerImgList" :key="banner.id" @click="handleClickBanner(banner)">
|
|
|
+ <img mode="aspectFill" class="img" :src="banner.imageUrl" />
|
|
|
+ <img mode="aspectFill" class="img2" :src="banner.logoUrl" />
|
|
|
+ </swiper-item>
|
|
|
+ </swiper>
|
|
|
</view>
|
|
|
|
|
|
<!-- 主体内容区域 -->
|
|
|
@@ -78,7 +80,12 @@
|
|
|
<image class="item-img" :src="item.coverImg" mode="scaleToFill"></image>
|
|
|
<view class="descrition">
|
|
|
<text class="title">{{ item.hotel_name }}</text>
|
|
|
- <text class="type">{{ item.hTypeName }}</text>
|
|
|
+ <text class="type">
|
|
|
+ {{ item.hTypeName }}
|
|
|
+ <text class="type_level" v-if="item.type == 1">银宿级</text>
|
|
|
+ <text class="type_level" v-if="item.type == 2">金宿级</text>
|
|
|
+ <text class="type_level" v-if="item.type == 3">白金级</text>
|
|
|
+ </text>
|
|
|
<text class="distance" v-if="showdDistance">距您直线{{ item.distance }}公里</text>
|
|
|
<view class="detail">
|
|
|
<img class="img" src="../../static/index/hotel.png" />
|
|
|
@@ -197,7 +204,12 @@
|
|
|
<image class="item-img" :src="item.coverImg" mode="scaleToFill"></image>
|
|
|
<view class="descrition">
|
|
|
<text class="title">{{ item.hotel_name }}</text>
|
|
|
- <text class="type">{{ item.hTypeName }}</text>
|
|
|
+ <text class="type">
|
|
|
+ {{ item.hTypeName }}
|
|
|
+ <text class="type_level" v-if="item.type == 1">银宿级</text>
|
|
|
+ <text class="type_level" v-if="item.type == 2">金宿级</text>
|
|
|
+ <text class="type_level" v-if="item.type == 3">白金级</text>
|
|
|
+ </text>
|
|
|
<text class="distance" v-if="showdDistance">距您直线{{ item.distance }}公里</text>
|
|
|
<view class="detail">
|
|
|
<img class="img" src="../../static/index/hotel.png" />
|
|
|
@@ -252,12 +264,28 @@
|
|
|
<view class="popupClass">
|
|
|
<img src="../../static/index/popup_bg.png" />
|
|
|
<!-- 立即前往区域 -->
|
|
|
- <!-- <view class="btn_go" @click="handleGo"></view> -->
|
|
|
<view class="btn_text">系统处于迭代试用状态,请勿下单预订酒店,如需预订请电联店家老板确认预订渠道。</view>
|
|
|
<!-- 关闭按钮区域 -->
|
|
|
<view class="btn_close" @click="handleClose"></view>
|
|
|
</view>
|
|
|
</uv-popup>
|
|
|
+
|
|
|
+ <!-- 等级介绍弹窗区域 -->
|
|
|
+ <uv-popup ref="popup_level" mode="center" :closeOnClickOverlay="false" bgColor="none">
|
|
|
+ <view class="popupLevel">
|
|
|
+ <view class="level_header">
|
|
|
+ <view class="">民宿等级</view>
|
|
|
+ <view class="header_text" @click="handleCloseLevelPop">×</view>
|
|
|
+ </view>
|
|
|
+ <view class="level_body">
|
|
|
+ 江西省民宿评定严格按照《民宿基本要求与评价(江西省省地方标准)》进行。民宿等级从高到低分为白金级、金宿级、银宿级三个等级,等级越高表示接待设施与服务品质越高。其中,白金级、金宿级由省里评定,银宿级由设区市评定。
|
|
|
+ </view>
|
|
|
+ <view class="level_btn">
|
|
|
+ <view class="btn notip" @click="handleNoTip">不再提示</view>
|
|
|
+ <view class="btn read" @click="handleCloseLevelPop">已读</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </uv-popup>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
@@ -343,7 +371,9 @@ export default {
|
|
|
}
|
|
|
]
|
|
|
}
|
|
|
- ]
|
|
|
+ ],
|
|
|
+ // 顶部轮播图图片数组
|
|
|
+ headerImgList: []
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
@@ -389,6 +419,7 @@ export default {
|
|
|
this.hotelList = []
|
|
|
this.page = 1
|
|
|
this.getLocation()
|
|
|
+ this.getHeaderImgList()
|
|
|
this.getResidueCount()
|
|
|
this.getBestNews()
|
|
|
this.getNews()
|
|
|
@@ -398,6 +429,8 @@ export default {
|
|
|
}, 1000)
|
|
|
},
|
|
|
onLoad() {
|
|
|
+ // 获取顶部轮播图数据
|
|
|
+ this.getHeaderImgList()
|
|
|
// 获取乡镇列表
|
|
|
this.getResidueCount()
|
|
|
// 获取定位
|
|
|
@@ -408,8 +441,21 @@ export default {
|
|
|
this.getNews()
|
|
|
// 获取特产列表
|
|
|
this.getGoodsList()
|
|
|
+
|
|
|
+ let isTip = uni.getStorageSync('isTip')
|
|
|
+
|
|
|
+ !isTip && this.$refs.popup_level.open()
|
|
|
},
|
|
|
methods: {
|
|
|
+ async getHeaderImgList() {
|
|
|
+ const res = await this.$myRequest({
|
|
|
+ url: '/mhotel/advertiseopenList.action'
|
|
|
+ })
|
|
|
+ // console.log(res)
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.headerImgList = res.data
|
|
|
+ }
|
|
|
+ },
|
|
|
async getBestNews() {
|
|
|
const res = await this.$myRequest({
|
|
|
url: '/mhotel/articlequeryMaxArticleLike.action'
|
|
|
@@ -705,10 +751,6 @@ export default {
|
|
|
handleClose() {
|
|
|
this.$refs.popup_sale.close()
|
|
|
},
|
|
|
- // 立即前往按钮回调
|
|
|
- handleGo() {
|
|
|
- console.log(111)
|
|
|
- },
|
|
|
// 计算两个点之间的距离
|
|
|
calculateDistance(lat, lng) {
|
|
|
let centerLat = lat
|
|
|
@@ -756,6 +798,60 @@ export default {
|
|
|
},
|
|
|
changeDot(e) {
|
|
|
this.current = e.detail.current
|
|
|
+ },
|
|
|
+ handleCloseLevelPop() {
|
|
|
+ this.$refs.popup_level.close()
|
|
|
+ },
|
|
|
+ handleNoTip() {
|
|
|
+ uni.setStorageSync('isTip', true)
|
|
|
+ this.$refs.popup_level.close()
|
|
|
+ },
|
|
|
+ // 点击顶部轮播图广告回调
|
|
|
+ handleClickBanner(banner) {
|
|
|
+ // console.log(banner)
|
|
|
+ switch (banner.jumpWay) {
|
|
|
+ case '网页':
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pagesSub/web/web?url=${banner.jumpPoint}`
|
|
|
+ })
|
|
|
+ break
|
|
|
+ case '小程序':
|
|
|
+ if (banner.jumpDirection == '民宿') {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages/detail/detail?id=${banner.jumpPoint}&distance=&town=${banner.townId}`
|
|
|
+ })
|
|
|
+ } else if (banner.jumpDirection == '商品') {
|
|
|
+ if (banner.jumpPoint == '首页') {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/packageShang/pages/tabbar/home'
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/packageShang/pages/goods/goods?id=${banner.jumpPoint}`
|
|
|
+ })
|
|
|
+ }
|
|
|
+ } else if (banner.jumpDirection == '攻略') {
|
|
|
+ if (banner.jumpPoint == '首页') {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/community/community'
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pagesSub/tweetDetail/tweetDetail?id=${banner.jumpPoint}&townId=${banner.townId}`
|
|
|
+ })
|
|
|
+ }
|
|
|
+ } else if (banner.jumpDirection == '优惠券') {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pagesSub/couponCenter/couponCenter?id=${banner.jumpPoint}`
|
|
|
+ })
|
|
|
+ }
|
|
|
+ break
|
|
|
+ default:
|
|
|
+ uni.previewImage({
|
|
|
+ urls: [banner.imageUrl]
|
|
|
+ })
|
|
|
+ break
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -773,41 +869,24 @@ export default {
|
|
|
position: relative;
|
|
|
height: 505rpx;
|
|
|
|
|
|
- img {
|
|
|
+ .header_swiper {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
- border-radius: 0 0 20rpx 20rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .img {
|
|
|
- position: absolute;
|
|
|
- top: 135rpx;
|
|
|
- left: 61rpx;
|
|
|
- width: 160rpx;
|
|
|
- height: 40rpx;
|
|
|
- }
|
|
|
|
|
|
- .img2 {
|
|
|
- position: absolute;
|
|
|
- top: 193rpx;
|
|
|
- left: 38rpx;
|
|
|
- width: 268rpx;
|
|
|
- height: 88rpx;
|
|
|
- }
|
|
|
+ .img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ border-radius: 0 0 20rpx 20rpx;
|
|
|
+ }
|
|
|
|
|
|
- .header_msg {
|
|
|
- position: absolute;
|
|
|
- top: 283rpx;
|
|
|
- left: 38rpx;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- width: 291rpx;
|
|
|
- height: 65rpx;
|
|
|
- font-size: 31rpx;
|
|
|
- color: #fff;
|
|
|
- border-radius: 16rpx;
|
|
|
- background: rgba(255, 255, 255, 0.2);
|
|
|
+ .img2 {
|
|
|
+ position: absolute;
|
|
|
+ top: 175rpx;
|
|
|
+ left: 38rpx;
|
|
|
+ width: 200rpx;
|
|
|
+ height: 200rpx;
|
|
|
+ border: 1rpx solid skyblue;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
|
|
|
@@ -1124,6 +1203,10 @@ export default {
|
|
|
height: 40rpx;
|
|
|
font-size: 24rpx;
|
|
|
color: #a6a6a6;
|
|
|
+
|
|
|
+ .type_level {
|
|
|
+ margin-left: 20rpx;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
.distance {
|
|
|
@@ -1350,15 +1433,6 @@ export default {
|
|
|
height: 665rpx;
|
|
|
}
|
|
|
|
|
|
- .btn_go {
|
|
|
- position: absolute;
|
|
|
- top: 415rpx;
|
|
|
- left: 40rpx;
|
|
|
- width: 396rpx;
|
|
|
- height: 76rpx;
|
|
|
- border-radius: 43rpx;
|
|
|
- }
|
|
|
-
|
|
|
.btn_text {
|
|
|
position: absolute;
|
|
|
top: 265rpx;
|
|
|
@@ -1383,5 +1457,56 @@ export default {
|
|
|
border-radius: 50%;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ .popupLevel {
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 20rpx;
|
|
|
+ width: 580rpx;
|
|
|
+ height: 495rpx;
|
|
|
+ border-radius: 20rpx;
|
|
|
+ background-color: #fff;
|
|
|
+
|
|
|
+ .level_header {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ height: 70rpx;
|
|
|
+
|
|
|
+ .header_text {
|
|
|
+ color: #c5c5c0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .level_body {
|
|
|
+ font-size: 26rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .level_btn {
|
|
|
+ margin-top: 80rpx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ align-items: center;
|
|
|
+ height: 80rpx;
|
|
|
+
|
|
|
+ .btn {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ width: 150rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .notip {
|
|
|
+ margin-right: 20rpx;
|
|
|
+ border: 1rpx solid #e7e7e7;
|
|
|
+ }
|
|
|
+
|
|
|
+ .read {
|
|
|
+ color: #fff;
|
|
|
+ background-color: #1890ff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|