Commit 65847ca0 authored by 罗超's avatar 罗超

Merge branch 'master' of http://gitlab.oytour.com/zk123/jz_travel

parents 64bac0a3 6c3b510f
......@@ -34,10 +34,11 @@
:src="item.picUrl"
/>
<div class="good-info">
<div class="good-name" v-if="goodsInfo.showGoodsName">{{ item.name }}</div>
<div class="good-name" v-if="goodsInfo.showGoodsName">{{ item.name }} 1</div>
<view class="good-sub-name">{{item.subname}}</view>
<div class="good-price-info">
<span class="price" :style="{ color: mainColor }">{{ goodsInfo.showGoodsPrice ? getPrice(item.price) : '' }}
<span style='text-decoration: line-through;margin-left: 10px;font-size: 10px;color: gray;font-family: aa;'>原价:{{goodsInfo.showGoodsPrice ? getPrice(item.OriginalPrice) : ''}}</span>
<!-- <span style='text-decoration: line-through;margin-left: 10px;font-size: 10px;color: gray;font-family: aa;'>原价:{{goodsInfo.showGoodsPrice ? getPrice(item.OriginalPrice) : ''}}</span> -->
</span>
<span class="buy" v-if="goodsInfo.showBuyBtn" @click.stop="showSkuHandler(item)">
<u-icon name="cart-o" size="40" :color="mainColor" v-if="goodsInfo.buyBtn == 'cart'" />
......@@ -92,7 +93,30 @@ export default {
},
methods: {
openGood(item) {
uni.navigateTo({ url: '/pages/goods/goods?GoodsId=' + item.id });
//线路
if (item.goodType == 4) {
uni.navigateTo({
url: "/pages/jiuzhai/jz_LineDetail?tcid=" + item.id + '&configId=' + item.subid
});
}
//酒店
else if (item.goodType == 1) {
uni.navigateTo({
url: "/pages/hotel/detail?id=" + item.id
});
}
//餐食
else if (item.goodType == 2) {
uni.navigateTo({
url: '/pages/restaurant/detail?id=' + item.id
});
}
//景点
else if (item.goodType == 3) {
uni.navigateTo({
url: '/pages/ticketCoupons/detail?id=' + item.id
});
}
},
showSkuHandler(g) {
this.sku = g;
......
......@@ -32,8 +32,8 @@
</view>
</view>
<view class="good-info">
<view class="good-name" v-if="goodsInfo.showGoodsName">{{ item.name }}</view>
<view class="good-sub-name">这里的小文字介绍一点特色...</view>
<view class="good-name" v-if="goodsInfo.showGoodsName">{{ item.name }} 2</view>
<view class="good-sub-name">{{item.subname}}</view>
<view class="good-price-info">
<view class="price">
{{ goodsInfo.showGoodsPrice ? getPrice(item.price) : '' }}
......@@ -92,7 +92,30 @@ export default {
},
methods: {
openGood(item) {
uni.navigateTo({ url: '/pages/goods/goods?GoodsId=' + item.id });
//线路
if (item.goodType == 4) {
uni.navigateTo({
url: "/pages/jiuzhai/jz_LineDetail?tcid=" + item.id + '&configId=' + item.subid
});
}
//酒店
else if (item.goodType == 1) {
uni.navigateTo({
url: "/pages/hotel/detail?id=" + item.id
});
}
//餐食
else if (item.goodType == 2) {
uni.navigateTo({
url: '/pages/restaurant/detail?id=' + item.id
});
}
//景点
else if (item.goodType == 3) {
uni.navigateTo({
url: '/pages/ticketCoupons/detail?id=' + item.id
});
}
},
showSkuHandler(g) {
this.sku = g;
......
......@@ -32,7 +32,7 @@
</div>
</div>
<div class="good-info">
<div class="good-name" v-if="goodsInfo.showGoodsName">{{ item.name }}</div>
<div class="good-name" v-if="goodsInfo.showGoodsName">{{ item.name }} 3</div>
<div class="good-price-info">
<view class="price" :style="{ color: mainColor }">
<span>{{ goodsInfo.showGoodsPrice ? getPrice(item.price) : '' }}</span>
......@@ -92,7 +92,30 @@ export default {
},
methods: {
openGood(item) {
uni.navigateTo({ url: '/pages/goods/goods?GoodsId=' + item.id });
//线路
if (item.goodType == 4) {
uni.navigateTo({
url: "/pages/jiuzhai/jz_LineDetail?tcid=" + item.id + '&configId=' + item.subid
});
}
//酒店
else if (item.goodType == 1) {
uni.navigateTo({
url: "/pages/hotel/detail?id=" + item.id
});
}
//餐食
else if (item.goodType == 2) {
uni.navigateTo({
url: '/pages/restaurant/detail?id=' + item.id
});
}
//景点
else if (item.goodType == 3) {
uni.navigateTo({
url: '/pages/ticketCoupons/detail?id=' + item.id
});
}
},
showSkuHandler(g) {
this.sku = g;
......
......@@ -20,7 +20,7 @@
<view class="tips" v-if="goodsInfo.showGoodsTag"><image :src="goodsInfo.goodsTagPicUrl" mode="widthFix" style="width: 100%;" /></view>
<view class="img-box"><image style="width: 100%; height: 100%;" :mode="goodsInfo.fill == 1 ? 'aspectFill' : 'aspectFit'" :src="item.picUrl" /></view>
<view class="good-info">
<view class="good-name" v-if="goodsInfo.showGoodsName">{{ item.name }}</view>
<view class="good-name" v-if="goodsInfo.showGoodsName">{{ item.name }} 4</view>
<view class="good-price-info">
<view class="price" :style="{ color: mainColor }">{{ goodsInfo.showGoodsPrice ? getPrice(item.price) : '' }}</view>
<view class="buy" v-if="goodsInfo.showBuyBtn" @click.stop="showSkuHandler(item)">
......@@ -73,7 +73,30 @@ export default {
},
methods: {
openGood(item) {
uni.navigateTo({ url: '/pages/goods/goods?GoodsId=' + item.id });
//线路
if (item.goodType == 4) {
uni.navigateTo({
url: "/pages/jiuzhai/jz_LineDetail?tcid=" + item.id + '&configId=' + item.subid
});
}
//酒店
else if (item.goodType == 1) {
uni.navigateTo({
url: "/pages/hotel/detail?id=" + item.id
});
}
//餐食
else if (item.goodType == 2) {
uni.navigateTo({
url: '/pages/restaurant/detail?id=' + item.id
});
}
//景点
else if (item.goodType == 3) {
uni.navigateTo({
url: '/pages/ticketCoupons/detail?id=' + item.id
});
}
},
showSkuHandler(g) {
this.sku = g;
......
......@@ -24,11 +24,11 @@
</view>
</view>
<view class="good-info">
<view class="good-name" v-if="goodsInfo.showGoodsName">{{ item.name }}</view>
<view class="good-sub-name">这里的小文字介绍一点特色一类...</view>
<view class="good-name" v-if="goodsInfo.showGoodsName">{{ item.name }} 5</view>
<view class="good-sub-name">{{item.subname}}</view>
<view class="good-price-info">
<view class="price" :style="{ color: mainColor }">
<view class="good-sub-name" style="flex:1;">1天·共3个观光点</view>
<view class="good-sub-name" style="flex:1;">{{item.thirdname}}</view>
<span style="color: #111;">
{{ goodsInfo.showGoodsPrice ? getPrice(item.price) : '' }}
</span>
......@@ -83,7 +83,30 @@ export default {
},
methods: {
openGood(item) {
uni.navigateTo({ url: '/pages/goods/goods?GoodsId=' + item.id });
//线路
if (item.goodType == 4) {
uni.navigateTo({
url: "/pages/jiuzhai/jz_LineDetail?tcid=" + item.id + '&configId=' + item.subid
});
}
//酒店
else if (item.goodType == 1) {
uni.navigateTo({
url: "/pages/hotel/detail?id=" + item.id
});
}
//餐食
else if (item.goodType == 2) {
uni.navigateTo({
url: '/pages/restaurant/detail?id=' + item.id
});
}
//景点
else if (item.goodType == 3) {
uni.navigateTo({
url: '/pages/ticketCoupons/detail?id=' + item.id
});
}
},
showSkuHandler(g) {
this.sku = g;
......
<template>
<view
style="padding: 12px; padding-bottom: 0;width:100%;"
:style="{
<view style="padding: 12px; padding-bottom: 0;width:100%;" :style="{
'background-color': goodsInfo.backgroundColor,
'background-image': goodsInfo.backgroundPicUrl,
'border-color': goodsInfo.goodsStyle == 2 ? 'rgb(226, 226, 226)' : ''
}"
>
<view
class="good-four"
v-for="(item, gli) in goodList"
:key="gli"
@click="openGood(item)"
:style="{
}">
<view class="good-four" v-for="(item, gli) in goodList" :key="gli" @click="openGood(item)" :style="{
border: goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '',
background: goodsInfo.goodsStyle == 1 || goodsInfo.goodsStyle == 2 ? '#FFF' : ''
}"
>
<view class="tips" v-if="goodsInfo.showGoodsTag"><image :src="goodsInfo.goodsTagPicUrl" mode="widthFix" style="width: 100%;" /></view>
<view class="img-box"><image style="width: 100%; height: 100%;" :mode="goodsInfo.fill == 1 ? 'aspectFill' : 'aspectFit'" :src="item.picUrl" /></view>
}">
<view class="tips" v-if="goodsInfo.showGoodsTag">
<image :src="goodsInfo.goodsTagPicUrl" mode="widthFix" style="width: 100%;" />
</view>
<view class="img-box">
<image style="width: 100%; height: 100%;" :mode="goodsInfo.fill == 1 ? 'aspectFill' : 'aspectFit'" :src="item.picUrl" />
</view>
<view class="good-info">
<view class="good-name" v-if="goodsInfo.showGoodsName">{{ item.name }}</view>
<view class="good-name" v-if="goodsInfo.showGoodsName">{{ item.name }} 6</view>
<view class="good-sub-name">{{item.subname}}</view>
<view class="good-price-info">
<view class="price" :style="{ color: mainColor }">{{ goodsInfo.showGoodsPrice ? getPrice(item.price) : '' }}
<span style='text-decoration: line-through;margin-left: 10px;font-size: 10px;color: gray;font-family: aa;'>原价:{{goodsInfo.showGoodsPrice ? getPrice(item.OriginalPrice) : ''}}</span>
<!-- <span style='text-decoration: line-through;margin-left: 10px;font-size: 10px;color: gray;font-family: aa;'>原价:{{goodsInfo.showGoodsPrice ? getPrice(item.OriginalPrice) : ''}}</span> -->
</view>
<view class="buy" v-if="goodsInfo.showBuyBtn" @click.stop="showSkuHandler(item)">
<u-icon name="cart-o" size="40" :color="mainColor" v-if="goodsInfo.buyBtn == 'cart'" />
<u-icon name="add-o" size="40" :color="mainColor" v-else-if="goodsInfo.buyBtn == 'add'" />
<u-button
type="primary"
size="mini"
:ripple="true"
:color="goodsInfo.buttonColor"
:custom-style="
<u-button type="primary" size="mini" :ripple="true" :color="goodsInfo.buttonColor" :custom-style="
`backgroundColor:${goodsInfo.buttonColor},color:${goodsInfo.buyBtnStyle == 2 || goodsInfo.buyBtnStyle == 4 ? goodsInfo.buttonColor : '#FFF'}`
"
:plain="goodsInfo.buyBtnStyle == 2 || goodsInfo.buyBtnStyle == 4"
:shape="goodsInfo.buyBtnStyle == 3 || goodsInfo.buyBtnStyle == 4 ? 'circle' : 'square'"
v-else
>
:plain="goodsInfo.buyBtnStyle == 2 || goodsInfo.buyBtnStyle == 4" :shape="goodsInfo.buyBtnStyle == 3 || goodsInfo.buyBtnStyle == 4 ? 'circle' : 'square'"
v-else>
{{ goodsInfo.buyBtnText }}
</u-button>
</view>
......@@ -52,117 +41,160 @@
</template>
<script>
import goodSku from '../goods/goodsku';
import auth from '@/components/auth/index.vue';
export default {
components: {
goodSku,
auth
},
props: ['goodList', 'goodsInfo'],
data() {
return {
mainColor: '',
activeKey: 0,
showSku: false,
sku: {},
showAuth: false,
u: {}
};
},
created() {
this.mainColor = this.$uiConfig.mainColor;
},
methods: {
openGood(item) {
uni.navigateTo({ url: '/pages/goods/goods?GoodsId=' + item.id });
import goodSku from '../goods/goodsku';
import auth from '@/components/auth/index.vue';
export default {
components: {
goodSku,
auth
},
showSkuHandler(g) {
this.sku = g;
this.u = uni.getStorageSync('mall_UserInfo');
if (!this.u) {
this.u = {
nickName: '未登录',
avatarUrl: ''
};
this.showAuth = true;
} else {
this.showSku = true;
}
props: ['goodList', 'goodsInfo'],
data() {
return {
mainColor: '',
activeKey: 0,
showSku: false,
sku: {},
showAuth: false,
u: {}
};
},
reloadUserinfo() {
this.u = uni.getStorageSync('mall_UserInfo');
// this.showAuth = false;
created() {
this.mainColor = this.$uiConfig.mainColor;
},
//关闭登录窗口
gbAuth() {
this.showAuth = false;
methods: {
openGood(item) {
//线路
if (item.goodType == 4) {
uni.navigateTo({
url: "/pages/jiuzhai/jz_LineDetail?tcid=" + item.id + '&configId=' + item.subid
});
}
//酒店
else if (item.goodType == 1) {
uni.navigateTo({
url: "/pages/hotel/detail?id=" + item.id
});
}
//餐食
else if (item.goodType == 2) {
uni.navigateTo({
url: '/pages/restaurant/detail?id=' + item.id
});
}
//景点
else if (item.goodType == 3) {
uni.navigateTo({
url: '/pages/ticketCoupons/detail?id=' + item.id
});
}
},
showSkuHandler(g) {
this.sku = g;
this.u = uni.getStorageSync('mall_UserInfo');
if (!this.u) {
this.u = {
nickName: '未登录',
avatarUrl: ''
};
this.showAuth = true;
} else {
this.showSku = true;
}
},
reloadUserinfo() {
this.u = uni.getStorageSync('mall_UserInfo');
// this.showAuth = false;
},
//关闭登录窗口
gbAuth() {
this.showAuth = false;
}
}
}
};
};
</script>
<style>
.good-four {
position: relative;
margin-bottom: 14px;
display: flex;
height: 102px;
border: 1rpx solid transparent;
border-radius: 10rpx;
box-sizing: border-box;
padding: 0 1px 1px 0;
overflow: hidden;
}
.good-four .tips {
width: 64rpx;
height: 64rpx;
position: absolute;
top: 0;
left: 0;
z-index: 4;
}
.good-four .img-box {
width: 100px;
height: 100px;
}
.good-four .good-info {
padding: 12px;
flex: 1;
width: 1rpx;
border: 10rpx;
padding-bottom: 0;
display: flex;
flex-direction: column;
/* width:20%; */
}
.good-four .good-info .good-name {
font-size: 13px;
height: 34px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.good-four .good-info .good-price-info {
display: flex;
justify-items: center;
align-items: flex-end;
height: 22px;
flex: 1;
padding-bottom: 10rpx;
}
.good-four .good-info .good-price-info .price {
color: #ff4544;
flex: 1;
font-size: 14px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.good-four .good-info .good-price-info .buy {
width: 24px;
text-align: right;
}
.good-four {
position: relative;
margin-bottom: 14px;
display: flex;
height: 102px;
border: 1rpx solid transparent;
border-radius: 10rpx;
box-sizing: border-box;
padding: 0 1px 1px 0;
overflow: hidden;
}
.good-four .tips {
width: 64rpx;
height: 64rpx;
position: absolute;
top: 0;
left: 0;
z-index: 4;
}
.good-four .img-box {
width: 100px;
height: 100px;
}
.good-four .good-info {
padding: 12px;
flex: 1;
width: 1rpx;
border: 10rpx;
padding-bottom: 0;
display: flex;
flex-direction: column;
/* width:20%; */
}
.good-four .good-info .good-name {
font-size: 13px;
height: 34px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.good-four .good-info .good-price-info {
display: flex;
justify-items: center;
align-items: flex-end;
height: 22px;
flex: 1;
padding-bottom: 10rpx;
}
.good-four .good-info .good-price-info .price {
color: #ff4544;
flex: 1;
font-size: 14px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.good-four .good-info .good-price-info .buy {
width: 24px;
text-align: right;
}
..good-four .good-info .good-sub-name {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
/* -webkit-line-clamp: 2;
-webkit-box-orient: vertical; */
white-space: nowrap;
margin-bottom: 10rpx;
font-size: 22rpx;
color: #999999;
/* height: 37px; */
}
</style>
......@@ -24,8 +24,8 @@
<image class="img-2" :mode="goodsInfo.fill == 1 ? 'aspectFill' : 'aspectFit'" :src="item.picUrl" />
</view>
<view class="good-info">
<view class="good-name" v-if="goodsInfo.showGoodsName">{{ item.name }}</view>
<view class="sencond-title">这里的小文字介绍一点特色一类...</view>
<view class="good-name" v-if="goodsInfo.showGoodsName">{{ item.name }} 7</view>
<view class="sencond-title">{{item.subname}}</view>
<view class="good-price-info">
<view>
<u-rate
......@@ -96,10 +96,29 @@ export default {
},
methods: {
openGood(item) {
if(this.IsEducation==1){
uni.navigateTo({ url: '/pages/school/courseInfo?GoodsId='+item.id });
}else{
uni.navigateTo({ url: '/pages/goods/goods?GoodsId='+item.id });
//线路
if (item.goodType == 4) {
uni.navigateTo({
url: "/pages/jiuzhai/jz_LineDetail?tcid=" + item.id + '&configId=' + item.subid
});
}
//酒店
else if (item.goodType == 1) {
uni.navigateTo({
url: "/pages/hotel/detail?id=" + item.id
});
}
//餐食
else if (item.goodType == 2) {
uni.navigateTo({
url: '/pages/restaurant/detail?id=' + item.id
});
}
//景点
else if (item.goodType == 3) {
uni.navigateTo({
url: '/pages/ticketCoupons/detail?id=' + item.id
});
}
},
showSkuHandler(g) {
......
<template>
<view class="hotel-list-item">
<view class="img-box">
<image src="http://imgfile.oytour.com/Upload/DMC/202105251114114560000000058.png" mode="aspectFill"></image>
</view>
<view class="hotel-info">
<view class="hotel-name">乐山禅驿·嘉定院子酒店</view>
<view class="hotel-start">
<!-- TODO:判定是否为星级酒店,如果是显示星级,不是,显示另外一种方式 -->
<view class="rate" v-if="hotelType==0">
<u-rate active-color="#FEB969" inactive-color="#FFF" current="4" active-icon="star" inactive-icon="star" disabled></u-rate>
<text style="margin-left: 20rpx;vertical-align: top;">四星</text>
<view>
<view class="hotel-list-item" v-for="(item,index) in HotelList" :key="index" @click="goHotelDetail(item.HotelId)">
<view class="img-box">
<image :src="item.CoverImg" mode="aspectFill"></image>
</view>
<view class="hotel-info">
<view class="hotel-name">{{item.HotelName}}</view>
<view class="hotel-start">
<!-- TODO:判定是否为星级酒店,如果是显示星级,不是,显示另外一种方式 -->
<view class="rate" v-if="item.Star>=1&&item.Star<=5">
<u-rate active-color="#FEB969" inactive-color="#FFF" :current="item.Star" active-icon="star" inactive-icon="star" disabled></u-rate>
<text style="margin-left: 20rpx;vertical-align: top;">{{item.StarName}}</text>
</view>
<view class="other-rate" v-if="item.Star==9">
<text>温泉酒店</text>
<span class="line"></span>
</view>
<view class="other-rate" v-if="item.Star==8">
<text>精选民宿</text>
<span class="line"></span>
</view>
</view>
<view class="other-rate" v-if="hotelType==1">
<text>温泉酒店</text>
<span class="line"></span>
<view class="localtion">{{item.Address}}</view>
<view>
<u-tag v-for="(subItem,subIndex) in item.TagList" :key="subIndex" style="margin-right:10rpx;" :text="subItem" bg-color="#FFF" border-color="#DFBE6E" color="#DFBE6E"
size="mini"></u-tag>
</view>
<view class="other-rate" v-if="hotelType==2">
<text>精选民宿</text>
<span class="line"></span>
<view class="price">
<text></text>
<text class="money">{{item.B2BPrice}}</text>
<text></text>
</view>
</view>
<view class="localtion">距该酒店直线4.1公里·近九寨千古情景区·沟口</view>
<view>
<u-tag text="亲子设施" bg-color="#FFF" border-color="#DFBE6E" color="#DFBE6E" size="mini"></u-tag>
</view>
<view class="price">
<text></text>
<text class="money">599</text>
<text></text>
</view>
</view>
</view>
</template>
<script>
export default {
props:{
hotelType:{
type:Number,
default:0
props: {
HotelList: {
type: Array,
default: null
},
dayObj:{
type: Object,
default: null
}
},
data() {
......@@ -46,32 +53,47 @@
key: value
}
},
created() {
console.log(this.HotelList, 'hotel');
},
methods:{
goHotelDetail(id){
let myDayObj = JSON.stringify(this.dayObj);
uni.navigateTo({
url: "/pages/hotel/detail?id=" + id + '&dayObj=' + myDayObj
});
}
}
}
</script>
<style>
.hotel-list-item{
.hotel-list-item {
margin: 30rpx 30rpx 0 30rpx;
padding-bottom: 30rpx;
border-bottom: 1rpx solid #E2E2E2;
display: flex;
align-items: center;
}
.hotel-list-item .img-box{
.hotel-list-item .img-box {
width: 220rpx;
height: 280rpx;
border-radius: 20rpx;
overflow: hidden;
margin-right: 30rpx;
}
.hotel-list-item .img-box image{
.hotel-list-item .img-box image {
width: 100%;
}
.hotel-list-item .hotel-info{
.hotel-list-item .hotel-info {
width: 1px;
flex: 1;
}
.hotel-list-item .hotel-info .hotel-name{
.hotel-list-item .hotel-info .hotel-name {
font-weight: 500;
color: #111111;
line-height: 30rpx;
......@@ -80,27 +102,33 @@
overflow: hidden;
text-overflow: ellipsis;
}
.hotel-list-item .hotel-info .hotel-start{
margin:10rpx 0;
.hotel-list-item .hotel-info .hotel-start {
margin: 20rpx 0;
}
.hotel-list-item .hotel-info .hotel-start .rate{
.hotel-list-item .hotel-info .hotel-start .rate {
font-size: 30rpx;
font-weight: 500;
color: #999999;
line-height: 30rpx;
}
.hotel-list-item .hotel-info .hotel-start .other-rate{
.hotel-list-item .hotel-info .hotel-start .other-rate {
display: inline-block;
position: relative;
}
.hotel-list-item .hotel-info .hotel-start .other-rate text{
position: relative;z-index: 2;
.hotel-list-item .hotel-info .hotel-start .other-rate text {
position: relative;
z-index: 2;
font-size: 30rpx;
line-height: 30rpx;
font-weight: 500;
color: #111;
}
.hotel-list-item .hotel-info .hotel-start .other-rate .line{
.hotel-list-item .hotel-info .hotel-start .other-rate .line {
background-color: #DFBE6E;
height: 6px;
bottom: 2px;
......@@ -109,12 +137,13 @@
position: absolute;
z-index: 1;
}
.hotel-list-item .hotel-info .localtion{
.hotel-list-item .hotel-info .localtion {
font-size: 24rpx;
font-weight: 400;
color: #999999;
line-height: 30rpx;
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
......@@ -123,14 +152,16 @@
-webkit-box-orient: vertical;
margin-bottom: 10rpx;
}
.hotel-list-item .hotel-info .price{
.hotel-list-item .hotel-info .price {
margin-top: 10rpx;
font-weight: 500;
color: #FF3166;
font-size: 20rpx;
text-align: right;
}
.hotel-list-item .hotel-info .price .money{
.hotel-list-item .hotel-info .price .money {
font-size: 36rpx;
}
</style>
......@@ -309,6 +309,12 @@ export default {
that.minBlockLeft = minBlockLeft;
that.maxBlockLeft = maxBlockLeft;
},
_getMaxLength()
{
var that = this;
var MAX_LENGTH = that.width - that.blockSize;
return MAX_LENGTH;
},
/**
* 刷新整个视图
*/
......
<template>
<view class="room-good">
<view class="rm-left">
<image src="https://ak-d.tripcdn.com/images/0206l120008hti7x86A59_R_1080_808_R5_D.jpg" mode="aspectFill">
</image>
<view class="mark">12</view>
</view>
<view class="rm-right">
<view class="room-name">藏韵高级双床房</view>
<view class="f11">
<text class="king" style="margin-right: 14rpx;">含早餐</text>
<text>1.5m大床 2人入住 24㎡ 有窗</text>
<view>
<view class="room-good" v-for="(item,index) in RoomList">
<view class="rm-left">
<image src="https://ak-d.tripcdn.com/images/0206l120008hti7x86A59_R_1080_808_R5_D.jpg" mode="aspectFill">
</image>
<view class="mark">12</view>
</view>
<viwe class="give f11">
免费专辑接机 + 送沟口 + 1张情景演出票
</viwe>
<view class="f11 king" style="margin-top:15rpx;">入住当天18:00前可免费取消</view>
<view class="price">
<text class="f11" style="margin-right: 10rpx;"></text>
<text>889</text>
<view class="rm-right">
<view class="room-name">{{item.RoomName}}</view>
<view class="f11">
<text class="king" style="margin-right: 14rpx;">{{item.BreakfastTypeStr}}</text>
<text>{{item.BedTypeStr}} {{item.ServiceNumber}}人入住 {{item.RoomSize}}{{item.HasWindowStr}}</text>
</view>
<viwe class="give f11" v-if="item.Description">
{{item.Description}}
</viwe>
<view class="f11 king" style="margin-top:15rpx;">{{item.IsCancelStr}}</view>
<view class="price">
<text class="f11" style="margin-right: 10rpx;"></text>
<text>{{item.B2BPrice}}</text>
</view>
</view>
</view>
<view class="rm-opera">
<!-- 如果库存少于5显示 -->
<view class="warm-count">剩2间</view>
<view class="buy" @click="previewOrder">
<view class="buy-content"></view>
<view class="buy-tips">在线订</view>
<view class="rm-opera" v-if="item.Inventory>0&&item.Inventory<5">
<!-- 如果库存少于5显示 -->
<view class="warm-count">{{item.Inventory}}</view>
<view class="buy" @click="previewOrder">
<view class="buy-content"></view>
<view class="buy-tips">在线订</view>
</view>
</view>
<view class="rm-opera" v-if="item.Inventory==0">
<view class="buy disabled">
<view class="buy-content"></view>
<view class="buy-tips">已抢完</view>
</view>
</view>
</view>
</view>
......@@ -33,10 +41,16 @@
<script>
export default {
props: {
RoomList: {
type: Array,
default: null
}
},
methods: {
previewOrder(){
previewOrder() {
uni.navigateTo({
url:"/pages/hotel/order"
url: "/pages/hotel/order"
})
},
},
......@@ -63,7 +77,8 @@
width: 1px;
flex: 1;
}
.room-good .rm-opera{
.room-good .rm-opera {
margin-left: 10rpx;
display: flex;
flex-direction: column;
......@@ -71,14 +86,16 @@
justify-items: center;
align-items: center;
}
.room-good .rm-opera .warm-count{
.room-good .rm-opera .warm-count {
text-align: center;
font-size: 18rpx;
font-weight: 500;
color: #111111;
margin-bottom: 10rpx;
}
.room-good .rm-opera .buy{
.room-good .rm-opera .buy {
width: 70rpx;
height: 81rpx;
background: #FFFFFF;
......@@ -87,26 +104,31 @@
display: flex;
flex-direction: column;
}
.room-good .rm-opera .buy.disabled{
.room-good .rm-opera .buy.disabled {
background: #EBEBEB;
border: 2rpx solid #DCDCDC;
}
.room-good .rm-opera .buy.disabled .buy-tips{
.room-good .rm-opera .buy.disabled .buy-tips {
background: #A09E9E;
color: #fff;
}
.room-good .rm-opera .buy.disabled .buy-content{
.room-good .rm-opera .buy.disabled .buy-content {
color: #A09E9E;
}
.room-good .rm-opera .buy .buy-tips{
.room-good .rm-opera .buy .buy-tips {
height: 27rpx;
background: #000000;
text-align: center;
color:#DFBE6E;
color: #DFBE6E;
font-size: 18rpx;
line-height: 27rpx;
}
.room-good .rm-opera .buy .buy-content{
.room-good .rm-opera .buy .buy-content {
height: 1px;
flex: 1;
text-align: center;
......@@ -117,6 +139,7 @@
font-weight: 800;
color: #111111;
}
.room-good .rm-right .room-name {
font-size: 30rpx;
font-weight: 800;
......@@ -139,13 +162,13 @@
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
margin-top:15rpx;
margin-top: 15rpx;
}
.room-good .rm-right .price{
.room-good .rm-right .price {
font-weight: 800;
font-size: 40rpx;
color:#111;
color: #111;
}
.room-good .rm-left {
......
......@@ -2,17 +2,15 @@
<view class="hotel-detail">
<scroll-view scroll-y="true" style="width: 100%;height: 100%;" @scroll="scroll">
<view class="media" :style="{'opacity':(100-boxOption)+'%'}">
<u-swiper :list="imgsList" :effect3d="false" :height="545" :interval="5000" :border-radius="0"
@click="previewImage" name="picUrl" v-if="active==1"></u-swiper>
<u-swiper :list="dataList.HotelImg" :effect3d="false" :height="545" :interval="5000" :border-radius="0" @click="previewImage"
name="Path" v-if="active==1"></u-swiper>
<view class="video-box" v-if="active==0">
<video id="myVideo" :src="detailData.VideoUrl" style="width: 100%;height: 100%;"
:controls='controls' :show-center-play-btn='false' :show-fullscreen-btn='false'
@fullscreenchange='videoControl' object-fit='fill'></video>
<video id="myVideo" :src="detailData.VideoUrl" style="width: 100%;height: 100%;" :controls='controls'
:show-center-play-btn='false' :show-fullscreen-btn='false' @fullscreenchange='videoControl' object-fit='fill'></video>
<view @click="enlarge" class="play-btn">
<!-- 播放按钮 -->
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1616471847000_345.png"
style="width: 37rpx;height: 44rpx;" mode=""></image>
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1616471847000_345.png" style="width: 37rpx;height: 44rpx;"
mode=""></image>
</view>
</view>
<!-- <view class="type-box" v-if="videoUrl!=''">
......@@ -24,16 +22,16 @@
<view class="media-info">
<view class="flex">
<view class="mi-left">
<view v-if="imgsList.length>0" class="type-img-box" @click="openPicture">
<image :src="imgsList[0].picUrl" mode="aspectFill"></image>
<view v-if="dataList.HotelImg.length>0" class="type-img-box" @click="openPicture">
<image :src="dataList.HotelImg[0].Path" mode="aspectFill"></image>
<view class="content">
<!-- <u-icon name="photo" size="26" color="#FFF"></u-icon> -->
<text>{{imgsList.length}}</text>
<text>{{dataList.HotelImg.length}}</text>
</view>
</view>
</view>
<view class="mi-right">
<view style="font-size: 40rpx;font-weight: 600;text-align: right;margin-bottom: 6rpx;" class="king">5星</view>
<view style="font-size: 40rpx;font-weight: 600;text-align: right;margin-bottom: 6rpx;" class="king">{{dataList.StarName}}</view>
<view style="font-weight: 500;color:#dfbe6e99;text-align: right;" class="f12">658人下单入住</view>
<!-- <view class="flex">
<text style="color:white;margin-right: 14rpx;" class="f12">星级</text>
......@@ -42,9 +40,8 @@
</view>
</view>
</view>
<view @click="goback" :style="[titleStyle,{opacity:'100% !important'}]"
style="position: fixed;top: 0;left: 0;padding-left: 6rpx;">
<view @click="goback" :style="[titleStyle,{opacity:'100% !important'}]" style="position: fixed;top: 0;left: 0;padding-left: 6rpx;">
<u-icon name="arrow-left" size="44" color="#FFF" style="margin-top: 22rpx;"></u-icon>
</view>
</view>
......@@ -52,33 +49,31 @@
<view @click="goback">
<u-icon name="arrow-left" size="44"></u-icon>
</view>
<view style="flex: 1;margin-left: 30rpx; text-align: left;">眉山黑龙滩长岛天堂洲际酒店</view>
<view style="flex: 1;margin-left: 30rpx; text-align: left;">{{dataList.HotelName}}</view>
</view>
<view class="hotel-content">
<view class="hotel-base">
<view class="head">
<view style="flex:1;">
<view class="hotel-name">九寨沟星宇国际大酒店</view>
<view class="hotel-tag">亲子设施 | 江河景房 | 环境安静 | 全家出游</view>
<view class="hotel-name">{{dataList.HotelName}}</view>
<view class="hotel-tag">
<text v-for="(subItem,subIndex) in dataList.TagList" :key="subIndex">{{subItem}}
<text style="margin:0 10rpx;" v-if="subIndex!=dataList.TagList.length-1">|</text>
</text>
</view>
</view>
<!-- 关注 -->
<view class="op-box">
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1621940804000_709.png"
style="margin-right: 17rpx;"></image>
<image v-if="!islike"
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1621940804000_61.png"
@click="changeLike"></image>
<image v-if="islike"
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1621940804000_953.png"
@click="changeLike"></image>
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1621940804000_709.png" style="margin-right: 17rpx;"></image>
<image v-if="!islike" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1621940804000_61.png"
@click="changeLike"></image>
<image v-if="islike" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1621940804000_953.png"
@click="changeLike"></image>
</view>
</view>
<view class="shebei">
<view class="sb-left">
<view class="sb-item">2014年开业</view>
<view class="sb-item">2017年装修</view>
<view class="sb-item">免费停车场</view>
<view class="sb-item" v-for="(subItem,sIndex) in dataList.PublicFacilities">{{subItem}}</view>
</view>
<view class="sb-right">
<text style="margin-right: 20rpx;">设施/详情</text>
......@@ -89,11 +84,10 @@
<view class="loc-left">
<view class="loc-name">
<u-icon name="location" size="28" />
<text style="margin-left: 14rpx;">沟口 | 九寨沟风景区沟口</text>
<text style="margin-left: 14rpx;">{{dataList.Address}}</text>
</view>
<view class="loc-remark">
<view>距浦东国际机场14.5km,驾车约19min</view>
<view>距车站约1km,驾车约5min</view>
<view>{{dataList.AddressDes}}</view>
</view>
</view>
<view class="loc-right">
......@@ -103,27 +97,27 @@
</view>
<view class="date-box flex" @click="showTimePopup=true">
<view class="date">
<text>{{searchObj.date.startDay}}</text>
<text>{{roomMsg.StartDate}}</text>
<text class="date-week">{{searchObj.date.startWeek}}</text>
</view>
<view class="hr-line"></view>
<view class="date">
<text>{{searchObj.date.endDay}}</text>
<text>{{roomMsg.EndDate}}</text>
<text class="date-week">{{searchObj.date.endWeek}}</text>
</view>
<view class="ver-line"></view>
<view class="date">
共 · {{searchObj.date.day}}
共 · {{day}}
</view>
</view>
<view class="hotel-room">
<view class="room-type">
<view v-for="(x,i) in threeLevelList" class="item" @click="changeRoomType(i)"
:class="{'active':currentRoomType==i}">{{x.name}}</view>
<view class="item" :class="{'active':isShowAll}" @click="getAllRoom()">全部</view>
<view v-for="(x,i) in threeLevelList" class="item" @click="changeRoomType(x)" :class="{'active':x.isCheck==1}">{{x.name}}</view>
</view>
<view class="room-list">
<room-good></room-good>
<room-good-test></room-good-test>
<room-good :RoomList="RoomList"></room-good>
<!-- <room-good-test></room-good-test> -->
</view>
</view>
</view>
......@@ -133,44 +127,19 @@
<text>订房须知</text>
</view>
<ul class="title-style-one">
<li>
<view class="item-title">酒店提示</view>
<view class="item-content">疫情期间,酒店不提供早餐,请佩戴好口罩。</view>
</li>
<li>
<view class="item-title">儿童政策</view>
<view class="item-content">不接受18岁以下客人单独入住。不含儿童早餐。
加床政策、儿童人数请参见您所选定的客房政策,若超过房型限定人数,可能需收取额外费用。提出的任何要求均需获得酒店的确认,所有服务详情以酒店告知为准。</view>
</li>
<li>
<view class="item-title">宠物政策</view>
<view class="item-content">不可携带宠物。</view>
</li>
</ul>
<view class="big-title">
<text>入离规则</text>
</view>
<ul class="title-style-one">
<li>
<view class="item-title king regular">入住时间:14:00以后</view>
<view class="item-title king regular">退房时间:13:00以前</view>
<li v-for="(sItem,sIndex) in dataList.Booking" :key="sIndex">
<view class="item-title">{{sItem.Name}}</view>
<view class="item-content">
{{sItem.Content}}
</view>
</li>
</ul>
<view class="big-title">
<text>设施服务</text>
</view>
<ul class="title-style-one hr">
<li>
<view class="item-title regular">接机服务</view>
</li>
<li>
<view class="item-title regular">叫醒服务</view>
</li>
<li>
<view class="item-title regular">洗衣服务</view>
</li>
<li>
<view class="item-title regular">健身房</view>
<li v-for="(vItem,vIndex) in dataList.ServiceItems" :key="vIndex">
<view class="item-title regular">{{vItem}}</view>
</li>
</ul>
<view class="hotel-more-info" @click="openDescription">酒店详情</view>
......@@ -226,19 +195,7 @@
export default {
data() {
return {
imgsList: [{
picUrl: "https://ak-d.tripcdn.com/images/200j13000000v60wjE77D_R_1080_808_R5_D.jpg"
},
{
picUrl: "https://ak-d.tripcdn.com/images/t1/hotel/533000/532930/3fcc6398b3c44c08bb1b57aef579793e_R_1080_808_R5_D.jpg"
},
{
picUrl: "https://ak-d.tripcdn.com/images/20010r000000hmqk32EF2_R_1080_808_R5_D.jpg"
},
{
picUrl: "https://ak-d.tripcdn.com/images/200v0f0000007d6wgBCD6_R_1080_808_R5_D.jpg"
}
],
imgsList: [],
id: 0,
typeList: [{
Id: 0,
......@@ -255,36 +212,45 @@
videoUrl: "https://video.c-ctrip.com/videos/230i1r000001hxb2mEEE4.mp4",
active: 1,
islike: false,
currentRoomType: 0,
nearbyType: 0,
searchObj: {
date: {}
},
roomMsg:{
HotelId:0,
StartDate:'',
EndDate:''
},
day:0,
threeLevelList: [{
name: "全部",
id: 0
name: "单人床",
id: 1,
isCheck: 0
},
{
name: "大床房",
id: 1
id: 2,
isCheck: 0
},
{
name: "双床房",
id: 2
id: 3,
isCheck: 0
},
{
name: "含早餐",
id: 3
id: 4,
isCheck: 0
},
{
name: "可取消",
id: 4
},
{
name: "优惠活动",
id: 5
id: 5,
isCheck: 0
}
]
],
RoomList: [], //可过滤房间
dataList: {}, //数据
isShowAll: false, //显示全部
}
},
components: {
......@@ -295,26 +261,10 @@
canlendar
},
created() {
let d1 = new Date();
let d = new Date();
let d2 = new Date(d.setDate(d.getDate() + 1))
var obj = {
start: `${d1.getFullYear()}-${d1.getMonth()+1}-${d1.getDate()}`,
end: `${d2.getFullYear()}-${d2.getMonth()+1}-${d2.getDate()}`,
startDay: `${this.getMonth(d1)}${d1.getDate()}日`,
endDay: `${this.getMonth(d1)}${d1.getDate()}日`,
startWeek: this.getWeek(d1),
endWeek: this.getWeek(d2),
day: 1
}
uni.setStorage({
key: 'Time',
data: JSON.stringify(obj)
})
this.searchObj.date = obj
},
onLoad(options) {
// this.id=options.id
this.id = options.id
// this.ProjectType=options.type
let that = this
uni.getSystemInfo({
......@@ -327,34 +277,45 @@
},
});
this.mainColor = this.$uiConfig.mainColor;
if (this.id > 0) {
this.getHotelDetail(this.id);
}
if(options.dayObj){
var tempDay = JSON.parse(options.dayObj);
this.roomMsg.StartDate = tempDay.StartDate;
this.roomMsg.EndDate = tempDay.EndDate;
this.day = tempDay.day;
console.log(options.dayObj);
}
},
methods: {
goMap(name, lon, lat) {
wx.openLocation({
latitude:lat,
longitude:lon,
scale: 18,
name,
address:"武侯区科华中路 2 号",
success:(res)=>{
// console.log(res)
},
fail: (err) => {
// console.log(err)
}
latitude: lat,
longitude: lon,
scale: 18,
name,
address: "武侯区科华中路 2 号",
success: (res) => {
// console.log(res)
},
fail: (err) => {
// console.log(err)
}
})
},
openPicture(){
openPicture() {
let imgObj = JSON.stringify(this.dataList.HotelImg);
uni.navigateTo({
url:"/pages/hotel/picture"
url: "/pages/hotel/picture?imgObj=" + imgObj
})
},
openDescription(){
openDescription() {
uni.navigateTo({
url:"/pages/hotel/description"
url: "/pages/hotel/description"
})
},
chosenDateResult(obj) {
obj.startDay = this.formatMonthDay(obj.startDay)
obj.endDay = this.formatMonthDay(obj.endDay)
......@@ -397,8 +358,56 @@
changeNearbyType(t) {
this.nearbyType = t
},
changeRoomType(i) {
this.currentRoomType = i
//显示全部
getAllRoom() {
this.isShowAll = !this.isShowAll;
if (this.isShowAll) {
this.threeLevelList.forEach(x => {
x.isCheck = 1;
})
this.RoomList = this.dataList.RoomList;
} else {
this.threeLevelList.forEach(x => {
x.isCheck = 0;
})
}
},
//点击过滤房间
changeRoomType(obj) {
if (obj.isCheck == 0) {
obj.isCheck = 1
} else {
obj.isCheck = 0;
}
this.RoomList = [];
let num = 0;
this.threeLevelList.forEach(x => {
if (x.isCheck == 1) {
num++;
this.dataList.RoomList.forEach(y => {
if (x.id == 1 && y.BedType == 1) {
this.RoomList.push(y)
}
if (x.id == 2 && y.BedType == 2) {
this.RoomList.push(y)
}
if (x.id == 3 && y.BedType == 3) {
this.RoomList.push(y)
}
if (x.id == 3 && y.BedType == 4) {
this.RoomList.push(y)
}
if (x.id == 4 && y.IsCancel == 5) {
this.RoomList.push(y)
}
})
}
})
if (num == this.threeLevelList.length) {
this.isShowAll = true;
} else {
this.isShowAll = false;
}
},
changeLike() {
this.islike = !this.islike
......@@ -445,6 +454,25 @@
changeHandler(i) {
this.active = i;
},
//获取酒店详情
getHotelDetail(id) {
let msg = {
HotelId: id
}
this.request2({
url: '/api/Hotel/GetHotelInfo',
data: msg
},
res => {
if (res.resultCode == 1) {
console.log(res, '详情数据');
this.dataList = res.data;
this.RoomList = this.dataList.RoomList;
}
}
);
}
},
}
</script>
......@@ -873,7 +901,7 @@
bottom: 0;
left: 0;
right: 0;
padding:30rpx 50rpx;
padding: 30rpx 50rpx;
}
.hotel-detail .media .media-info .mi-left {
......
......@@ -2,20 +2,20 @@
<view class="hotel-list">
<view class="search-box">
<view class="date" @click="chosenDate">
<view>{{searchObj.date.startDay}}</view>
<view>{{searchObj.date.endDay}}</view>
<view>{{startDay}}</view>
<view>{{endDay}}</view>
</view>
<view class="days">{{searchObj.date.day}}</view>
<view class="days">{{day}}</view>
<view style="width: 1px; flex: 1;">
<u-search placeholder="关键字/位置/品牌/酒店名" v-model="searchObj.searchKey" input-align="left" :value="searchObj.searchKey"
text-color="#111" bg-color="rgba(0,0,0,0)" :show-action="false"></u-search>
<u-search placeholder="关键字/位置/品牌/酒店名" v-model="searchObj.Name" input-align="left" :value="searchObj.Name"
text-color="#111" bg-color="rgba(0,0,0,0)" @change="getList(1)" :show-action="false"></u-search>
</view>
</view>
<view>
<u-dropdown ref="uDropdown" @open="open" @close="close" active-color="#000" inactive-color="#444">
<u-dropdown-item v-model="searchObj.sort" :title="optionsTitle[0]" :options="options1" @change="change">
<u-dropdown-item v-model="searchObj.OrderByType" :title="optionsTitle[0]" :options="options1" @change="change">
</u-dropdown-item>
<u-dropdown-item v-model="searchObj.enclosure" :title="optionsTitle[1]" :options="options2" @change="change2"></u-dropdown-item>
<!-- <u-dropdown-item v-model="searchObj.enclosure" :title="optionsTitle[1]" :options="options2" @change="change2"></u-dropdown-item> -->
<u-dropdown-item :title="optionsTitle[2]">
<view class="slot-content" style="padding: 30rpx;background-color: #FFF;">
<view>
......@@ -26,14 +26,14 @@
<view style="font-size: 24rpx;flex:1">¥0</view>
<view style="font-size: 24rpx;flex:1;color: #333;text-align: right;">¥1000以上</view>
</view>
<range-slider :width="690" :height="80" :step="10" :liveMode="true" background-color="#E2E2E2"
:block-size="40" active-color="#111111" min="0" max="1000" @rangechange="rangechange4"
:values="tempRateAndPrice.price"></range-slider>
<range-slider ref="rangeslider" :width="690" :height="80" :step="10" :liveMode="true" background-color="#E2E2E2"
:block-size="40" active-color="#111111" min="0" max="1000" @rangechange="rangechange4" :values="tempRateAndPrice.price"></range-slider>
<view style="margin: 20rpx 0 29rpx 0;">
<text style="font-size: 28rpx;color:#111;font-weight: 800;">星级</text>
</view>
<view class="hotel-rate-box">
<view v-for="(x,i) in rates" :key="i" class="hotel-rate" :class="{'active':tempRateAndPrice.rate.indexOf(x.value)!=-1}" @click="setHotelRate(x.value)">{{x.label}}</view>
<view v-for="(x,i) in rates" :key="i" class="hotel-rate" :class="{'active':tempRateAndPrice.rate.indexOf(x.Id)!=-1}"
@click="setHotelRate(x.Id)">{{x.Name}}</view>
</view>
<view style="box-shadow: 0px -10px 30px 0px rgba(36, 36, 36, 0.06);margin-top:40rpx;display: flex;">
<view style="flex:1;margin-right: 30rpx;">
......@@ -45,28 +45,17 @@
</view>
</view>
</u-dropdown-item>
<!-- <u-dropdown-item v-model="value2" :title="optionsTitle[3]" :options="options2"></u-dropdown-item> -->
</u-dropdown>
</view>
<u-popup v-model="showTimePopup" mode="bottom" border-radius="20" length="95%" :safe-area-inset-bottom="true">
<canlendar @finish="chosenDateResult"></canlendar>
</u-popup>
<view class="morewhere">
<view v-for="(x,i) in threeLevelList" class="item" @click="chosenMorewhere(x.id)" :class="{'active':searchObj.moreSearch.indexOf(x.id)!=-1}">{{x.name}}</view>
<view v-for="(x,i) in searchObj.TagList" class="item" @click="chosenMorewhere(x)" :class="{'active':x.IsCheck==1}">{{x.Name}}</view>
</view>
<scroll-view :scroll-y="true" @scrolltolower="lower" :enable-back-to-top="true" :enable-flex="true" :scroll-top="scrollTop"
@scroll="scroll" style="height: calc(100% - 224rpx); padding-bottom: 0px;">
<hotel-good></hotel-good>
<hotel-good></hotel-good>
<hotel-good :hotelType="1"></hotel-good>
<hotel-good></hotel-good>
<hotel-good :hotelType="1"></hotel-good>
<hotel-good></hotel-good>
<hotel-good></hotel-good>
<hotel-good></hotel-good>
<hotel-good :hotelType="2"></hotel-good>
<hotel-good></hotel-good>
<hotel-good></hotel-good>
<hotel-good :HotelList="HotelList" :dayObj="dayObj"></hotel-good>
<u-loadmore v-if="showLoading" :status="status" :load-text="loadText" :font-size="24" :margin-top="20"
:margin-bottom="20" bg-color="#F5F5F5" color="#111" />
</scroll-view>
......@@ -80,26 +69,27 @@
export default {
data() {
return {
showTimePopup:false,
value1: 1,
value2: 2,
searchObj:{
searchKey:"",
sort:1,
enclosure:-1,
rateAndPrice:{
price:{},
priceText:"不限",
rate:[]
},
date:{},
moreSearch:[]
showTimePopup: false,
searchObj: {
pageIndex: 1,
pageSize: 15,
Name: '', //关键字
StartPrice: 0,
EndPrice: 1000,
QStartDate: '',
QEndDate: '',
OrderByType: '1', //排序类型
QStars: '', //星级
TagList: [] //查询标签
},
tempRateAndPrice:{
price:{},
priceText:"不限",
rate:[]
day: 0,
startDay: '',
endDay: '',
HotelList: [], //酒店数据
tempRateAndPrice: {
price: {},
priceText: "不限",
rate: []
},
optionsTitle: [
"推荐排序",
......@@ -107,44 +97,9 @@
"价格/星级",
"筛选"
],
rates: [
{
label:"二星/经济",
value:1
},
{
label:"三星/舒适",
value:2
},
{
label:"四星/高档",
value:3
},
{
label:"五星/豪华",
value:4
}
],
options1: [
{
label: '推荐排序',
value: 1,
},
{
label: '好评优先',
value: 2,
},
{
label: '低价优先',
value: 3,
},
{
label: '高价优先',
value: 4,
}
],
options2: [
{
rates: [],
options1: [], //推荐排序数据
options2: [{
label: '不限',
value: -1,
},
......@@ -181,47 +136,21 @@
value: 8,
},
],
btnStyle:{
btnStyle: {
borderRadius: '16rpx',
color: '#111',
fontSize: '30rpx',
width: '100%',
border:"1px solid #111",
background:"#FFF"
border: "1px solid #111",
background: "#FFF"
},
btnStyle2:{
btnStyle2: {
borderRadius: '16rpx',
color: '#fff',
fontSize: '30rpx',
width: '100%',
background:"#111"
background: "#111"
},
threeLevelList:[
{
name:"民宿",
id:0
},
{
name:"大床房",
id:1
},
{
name:"双床房",
id:2
},
{
name:"含早餐",
id:3
},
{
name:"免费取消",
id:4
},
{
name:"优惠活动",
id:5
}
],
loadText: {
loadmore: "轻轻上拉,加载更多",
loading: "努力加载中",
......@@ -231,8 +160,10 @@
old: {
scrollTop: 0,
},
showLoading:false,
showLoading: false,
status: "loadmore",
page_count:0,
dayObj:{}
}
},
components: {
......@@ -241,15 +172,12 @@
hotelGood
},
created() {
uni.navigateTo({
url:"/pages/hotel/detail"
})
uni.setNavigationBarTitle({
title: "酒店",
});
let d1=new Date();
let d=new Date();
let d2=new Date(d.setDate(d.getDate()+1))
let d1 = new Date();
let d = new Date();
let d2 = new Date(d.setDate(d.getDate() + 1))
var obj = {
start: `${d1.getFullYear()}-${d1.getMonth()+1}-${d1.getDate()}`,
end: `${d2.getFullYear()}-${d2.getMonth()+1}-${d2.getDate()}`,
......@@ -261,7 +189,13 @@
key: 'Time',
data: JSON.stringify(obj)
})
this.searchObj.date=obj
this.searchObj.QStartDate = obj.start;
this.searchObj.QEndDate = obj.end;
this.startDay = obj.startDay;
this.endDay = obj.endDay;
this.day = obj.day;
this.getSearchCondition();
this.getList();
},
methods: {
scroll: function(e) {
......@@ -275,83 +209,93 @@
},
lower(e) {
// TODO: 滚动到了底部,实现翻页加载
// if (this.msg.pageIndex < this.page_count) {
// this.status = "loading";
// this.msg.pageIndex++;
// this.init();
// } else {
// this.isover = true;
// this.status = "nomore";
// }
if (this.searchObj.pageIndex < this.page_count) {
this.status = "loading";
this.searchObj.pageIndex++;
this.getList();
} else {
this.status = "nomore";
}
},
chosenMorewhere(id){
let i=this.searchObj.moreSearch.indexOf(id)
if(i==-1){
this.searchObj.moreSearch.push(id)
}else{
this.searchObj.moreSearch.splice(i,1)
chosenMorewhere(obj) {
if (obj.IsCheck == 0) {
obj.IsCheck = 1
} else {
obj.IsCheck = 0;
}
this.getList(1);
},
chosenDateResult(obj){
this.searchObj.date=obj
this.showTimePopup=false
chosenDateResult(obj) {
this.searchObj.QStartDate = obj.start;
this.searchObj.QEndDate = obj.end;
this.startDay = obj.startDay;
this.endDay = obj.endDay;
this.day = obj.day;
this.getList(1);
this.showTimePopup = false
},
chosenDate(){
// uni.navigateTo({
// url:"/pages/hotel/components/time/index"
// })
this.showTimePopup=true
chosenDate() {
this.showTimePopup = true
},
setHotelRate(rateId){
let temp=this.tempRateAndPrice.rate.indexOf(rateId)
if(temp==-1){
setHotelRate(rateId) {
let temp = this.tempRateAndPrice.rate.indexOf(rateId)
if (temp == -1) {
this.tempRateAndPrice.rate.push(rateId)
}else{
this.tempRateAndPrice.rate.splice(temp,1)
} else {
this.tempRateAndPrice.rate.splice(temp, 1)
}
},
resetPrice(){
this.optionsTitle[2]="价格/星级"
this.searchObj.rateAndPrice={
price:{
minValue:0,
maxValue:1000
resetPrice() {
this.optionsTitle[2] = "价格/星级";
var obj = this.$refs.rangeslider;
obj.progressBarLeft = 0;
obj.progressBarWidth = obj._getMaxLength();
obj.minBlockLeft = 0;
obj.maxBlockLeft = obj._getMaxLength();
this.tempRateAndPrice = {
price: {
minValue: 0,
maxValue: 1000
},
priceText:"不限",
rate:[]
priceText: "不限",
rate: []
}
this.closeDropdown();
this.searchObj.StartPrice = 0;
this.searchObj.EndPrice = 1000;
this.getList(1);
},
surePrice(){
let result=""
if(this.tempRateAndPrice.rate.length>0){
this.rates.forEach(x=>{
if(this.tempRateAndPrice.rate.indexOf(x.value)!=-1){
result+=x.label+","
surePrice() {
let result = ""
if (this.tempRateAndPrice.rate.length > 0) {
this.rates.forEach(x => {
if (this.tempRateAndPrice.rate.indexOf(x.value) != -1) {
result += x.label + ","
}
})
}
if(this.tempRateAndPrice.priceText!="不限"){
result+=this.tempRateAndPrice.priceText
if (this.tempRateAndPrice.priceText != "不限") {
result += this.tempRateAndPrice.priceText
}
result=result==""?"价格/星级":result
console.log(result)
this.optionsTitle[2]=result
this.$forceUpdate()
this.searchObj.rateAndPrice=this.tempRateAndPrice
result = result == "" ? "价格/星级" : result
this.optionsTitle[2] = result
this.$forceUpdate()
this.closeDropdown();
this.getList(1);
},
rangechange4(e){
if(e.minValue==0){
if(e.maxValue==1000){
this.tempRateAndPrice.priceText="不限"
}else{
this.tempRateAndPrice.priceText=`¥${e.maxValue}以下`
rangechange4(e) {
this.searchObj.StartPrice = e.minValue;
this.searchObj.EndPrice = e.maxValue;
if (e.minValue == 0) {
if (e.maxValue == 1000) {
this.tempRateAndPrice.priceText = "不限"
} else {
this.tempRateAndPrice.priceText = `¥${e.maxValue}以下`
}
}else if(e.maxValue==1000){
this.tempRateAndPrice.priceText=`¥${e.minValue}以上`
}else{
this.tempRateAndPrice.priceText=`¥${e.minValue} - ¥${e.maxValue}之间`
} else if (e.maxValue == 1000) {
this.tempRateAndPrice.priceText = `¥${e.minValue}以上`
} else {
this.tempRateAndPrice.priceText = `¥${e.minValue} - ¥${e.maxValue}之间`
}
},
closeDropdown() {
......@@ -361,8 +305,8 @@
// 展开某个下来菜单时,先关闭原来的其他菜单的高亮
// 同时内部会自动给当前展开项进行高亮
this.$refs.uDropdown.highlight();
if(index==2){
this.tempRateAndPrice=this.searchObj.rateAndPrice
if (index == 2) {
this.tempRateAndPrice = this.searchObj.rateAndPrice
}
},
close(index) {
......@@ -379,9 +323,10 @@
}
})
this.optionsTitle[0] = temp.label
this.getList(1);
},
change2(index){
if(index!=-1){
change2(index) {
if (index != -1) {
let temp = this.options2.find(x => {
if (x.value == index) {
return x
......@@ -390,9 +335,64 @@
}
})
this.optionsTitle[1] = temp.label
}else{
} else {
this.optionsTitle[1] = "附近"
}
},
//获取查询条件
getSearchCondition() {
this.request2({
url: '/api/Hotel/GetHotelQuery',
data: {}
},
res => {
if (res.resultCode == 1) {
let tempObj = res.data;
this.options1 = [];
this.rates = [];
if (tempObj && tempObj.OrderByList.length > 0) {
tempObj.OrderByList.forEach(x => {
let obj = {
label: x.Name,
value: x.Id
}
this.options1.push(obj);
})
}
if (tempObj && tempObj.TagList) {
this.searchObj.TagList = tempObj.TagList;
}
if (tempObj && tempObj.StarList) {
this.rates = tempObj.StarList;
}
}
},
err => {
}
);
},
//获取列表数据
getList(type) {
this.searchObj.QStars = this.tempRateAndPrice.rate.toString();
this.dayObj.StartDate = this.searchObj.QStartDate;
this.dayObj.EndDate = this.searchObj.QEndDate;
this.dayObj.day = this.day;
if(type==1){
this.HotelList=[];
}
this.request2({
url: '/api/Hotel/AppGetHotelPage',
data: this.searchObj
},
res => {
if (res.resultCode == 1) {
this.HotelList = this.HotelList.concat(res.data.pageData);
this.page_count = res.data.pageCount;
}
}
);
}
},
}
......@@ -401,7 +401,6 @@
<style>
.hotel-list {
height: 100vh;
}
.hotel-list .search-box {
......@@ -430,11 +429,13 @@
border-right: 1px solid #E2E2E2;
font-size: 24rpx;
}
.hotel-rate-box{
.hotel-rate-box {
display: flex;
align-items: center;
}
.hotel-rate{
.hotel-rate {
width: 160rpx;
height: 60rpx;
background: #ECF1F4;
......@@ -445,21 +446,25 @@
margin-right: 15rpx;
text-align: center;
}
.hotel-rate:last-child{
.hotel-rate:last-child {
margin-right: 0;
}
.hotel-rate.active{
.hotel-rate.active {
background: #111111;
color: #FFFFFF;
}
.hotel-list .morewhere{
padding:10rpx 30rpx;
.hotel-list .morewhere {
padding: 10rpx 30rpx;
display: flex;
align-items: center;
overflow-x: auto;
flex-wrap: nowrap;
}
.hotel-list .morewhere .item{
.hotel-list .morewhere .item {
padding: 0 20rpx;
height: 36rpx;
line-height: 36rpx;
......@@ -471,11 +476,13 @@
font-weight: 400;
flex-shrink: 0;
}
.hotel-list .morewhere .item.active{
.hotel-list .morewhere .item.active {
background: #111111;
color: #FFFFFF;
}
.hotel-list .morewhere .item:last-child{
.hotel-list .morewhere .item:last-child {
margin-right: 0;
}
</style>
......@@ -3,13 +3,13 @@
<scroll-view scroll-y="true" class="hotel-pic">
<view class="content">
<view class="left">
<view v-for="(x,i) in jiList" :key="i" class="image-box" @click="previewImage(x.picUrl)">
<image :src="x.picUrl" mode="widthFix"></image>
<view v-for="(x,i) in jiList" :key="i" class="image-box" @click="previewImage(x.Path)">
<image :src="x.Path" mode="widthFix"></image>
</view>
</view>
<view class="right">
<view v-for="(x,i) in ouList" :key="i" class="image-box" @click="previewImage(x.picUrl)">
<image :src="x.picUrl" mode="widthFix"></image>
<view v-for="(x,i) in ouList" :key="i" class="image-box" @click="previewImage(x.Path)">
<image :src="x.Path" mode="widthFix"></image>
</view>
</view>
</view>
......@@ -21,126 +21,37 @@
export default {
data() {
return {
imageList:[
{
picUrl:"https://ak-d.tripcdn.com/images/200j13000000v60wjE77D_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/t1/hotel/533000/532930/3fcc6398b3c44c08bb1b57aef579793e_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/20010r000000hmqk32EF2_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/200v0f0000007d6wgBCD6_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"http://imgfile.oytour.com/Upload/DMC/202105251114114560000000058.png",
type:"酒店"
},
{
picUrl:"https://dimg07.c-ctrip.com/images/01066120008jk5bcc94AC_C_1600_1200.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/200j13000000v60wjE77D_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/t1/hotel/533000/532930/3fcc6398b3c44c08bb1b57aef579793e_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/20010r000000hmqk32EF2_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/200v0f0000007d6wgBCD6_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"http://imgfile.oytour.com/Upload/DMC/202105251114114560000000058.png",
type:"酒店"
},
{
picUrl:"https://dimg07.c-ctrip.com/images/01066120008jk5bcc94AC_C_1600_1200.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/200j13000000v60wjE77D_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/t1/hotel/533000/532930/3fcc6398b3c44c08bb1b57aef579793e_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/20010r000000hmqk32EF2_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/200v0f0000007d6wgBCD6_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"http://imgfile.oytour.com/Upload/DMC/202105251114114560000000058.png",
type:"酒店"
},
{
picUrl:"https://dimg07.c-ctrip.com/images/01066120008jk5bcc94AC_C_1600_1200.jpg",
type:"酒店"
},{
picUrl:"https://ak-d.tripcdn.com/images/200j13000000v60wjE77D_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/t1/hotel/533000/532930/3fcc6398b3c44c08bb1b57aef579793e_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/20010r000000hmqk32EF2_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/200v0f0000007d6wgBCD6_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"http://imgfile.oytour.com/Upload/DMC/202105251114114560000000058.png",
type:"酒店"
},
{
picUrl:"https://dimg07.c-ctrip.com/images/01066120008jk5bcc94AC_C_1600_1200.jpg",
type:"酒店"
}
],
imageList:[],
jiList:[],
ouList:[],
allImageSrc:[]
}
},
onLoad(options) {
if(options.imgObj){
this.imageList=JSON.parse(options.imgObj);
this.getSeperate();
}
},
created() {
uni.setNavigationBarTitle({
title: "酒店图片",
});
this.imageList.forEach((x,i)=>{
this.allImageSrc.push(x.picUrl)
if(i%2==0){
this.jiList.push(x)
}else{
this.ouList.push(x)
}
})
console.log(this.jiList,this.ouList)
});
},
mounted () {
},
methods: {
getSeperate(){
this.imageList.forEach((x,i)=>{
this.allImageSrc.push(x.Path)
if(i%2==0){
this.jiList.push(x)
}else{
this.ouList.push(x)
}
})
},
previewImage(src) {
uni.previewImage({
urls: this.allImageSrc,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment