Commit 903ea686 authored by youjie's avatar youjie

酒店列表

parent e2263d2f
...@@ -22,14 +22,14 @@ ...@@ -22,14 +22,14 @@
</view> </view>
<view class="autLoginGo" <view class="autLoginGo"
:class="[!showLogin?'':'active']" :class="[!showLogin?'':'active']"
@click="guestInfor.code==0&&guestInfor.IsEnd==0?'':goWebUrl()"> @click="guestInfor.code==0&&guestInfor.IsEnd==0&&guest.length==0?'':goWebUrl()">
<template v-if="guestInfor.code==0&&guestInfor.IsEnd==0"> <template v-if="guestInfor.code==0&&guestInfor.IsEnd==0">
去填写 去填写
</template> </template>
<template v-else> <template v-else>
查看 查看
</template> </template>
<button v-if="guestInfor.code==0&&guestInfor.IsEnd==0" <button v-if="guestInfor.code==0&&guestInfor.IsEnd==0&&guest.length==0"
class="getPhone" class="getPhone"
type="default" type="default"
open-type="getPhoneNumber" open-type="getPhoneNumber"
...@@ -153,11 +153,13 @@ export default { ...@@ -153,11 +153,13 @@ export default {
}, (res) => { }, (res) => {
if (res.resultCode == 1) { if (res.resultCode == 1) {
this.guestInfor = res.data; this.guestInfor = res.data;
this.guest = res.data.guest
if(this.guestInfor.guest&& if(this.guestInfor.guest&&
this.guestInfor.guest.length>0&& this.guestInfor.guest.length>0&&
this.guestInfor.guest.length==1){ this.guestInfor.guest.length==1){
this.msg.Id = this.guestInfor.guest[0].Id; this.msg.Id = this.guestInfor.guest[0].Id;
this.msg.OrderId = this.guestInfor.guest[0].OrderId; this.msg.OrderId = this.guestInfor.guest[0].OrderId;
this.msg.Phone = this.guestInfor.guest[0].MobilePhone;
} }
uni.hideLoading(); uni.hideLoading();
}}, (error) => { }}, (error) => {
......
<template>
<view
class="slot-content hotelRegionBox column"
style="background-color: #F3F1EF">
<view class="hotelAddress row justify-center">
<text>目的地</text>
<icon @click="sure" class="hotelClear" type="clear" size="20"/>
</view>
<!-- <view class="internationalBox row-sb-n">
<view class="internationalName"
:class="[interCurrent==item.ID?'active':'']"
v-for="(item,index) in internationals"
:key="index"
@click="setInternational(item)">
<text>{{ item.Name }}</text>
<view class="internationalNABox">
<view v-if="interCurrent==item.ID" class="internationalNA">
<view>1</view>
</view>
</view>
</view>
</view> -->
<view class="internationalSearch" style="position: relative;">
<u-search placeholder="搜索城市/国家中文或拼音"
input-align="left"
:value="parameters.KeyWordsCity"
text-color="#111"
bg-color="rgba(0,0,0,0)"
disabled
:show-action="false"
style="font-size: 22rpx;"></u-search>
<view class="clickSearch" @click="clickSearchCity()">
<view>0</view>
</view>
</view>
<view class="row" style="height: 1px;flex: 1;">
<view class="hotelRegionL">
<scroll-view :scroll-y="true" style="height: 100%;">
<view class="hotelRegionLText row items-center justify-center"
:class="[parameters.GName==item.GName?'active':'']"
v-for="(item,index) in PopularCities" :key="index"
@click="confirmCity(item)">
<!-- <view class="hotelPopular"></view> -->
<text>{{ item.GName }}</text>
</view>
</scroll-view>
</view>
<view class="hotelRegionR">
<scroll-view :scroll-y="true" style="height: 100%;">
<view class="hotelRegionRC">
<view class="hotelRegionRText row items-center justify-center"
:class="[parameters.CityCode2==item.CityCode?'active':'']"
v-for="(item,index) in cityList" :key="index"
@click="changeDistrict(item)">
<view>{{ item.CityName }}</view>
</view>
</view>
</scroll-view>
</view>
</view>
<view style="padding: 0 30rpx;box-shadow: 0rpx 1rpx 8rpx 0rpx rgba(185,152,70,0.25);background: #F3F1EF;">
<view
style="
box-shadow: 0px -10px 30px 0px rgba(36, 36, 36, 0.06);
margin-top: 40rpx;
margin-bottom: 40rpx;
display: flex;
"
>
<!--
<view style="flex: 1; margin-right: 30rpx">
<u-button :custom-style="btnStyle" @click="clear"
>清空</u-button
>
</view>-->
<view style="flex: 1">
<u-button :custom-style="btnStyle2" @click="sure"
>确定</u-button
>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
props:['msg','PopularCities'],
data() {
return {
btnStyle: {
borderRadius: "16rpx",
color: "#111",
fontSize: "30rpx",
width: "100%",
border: "1px solid #111",
background: "#FFF",
},
btnStyle2: {
borderRadius: "16rpx",
color: "#fff",
fontSize: "30rpx",
width: "100%",
background: "#111",
},
// cityListAll: [],
cityList: [],
parameters: {
KeyWordsCity: '',//搜索城市
GName: '', //热门
CityCode2: '',//目的地代码
CityName: '',//目的地
},
DistrictOptions: [],
internationals:[
{Name:'国内(含港澳台)',ID:0},
{Name:'国际',ID:1}
],
interCurrent:0,
}
},
watch:{
msg: {
handler (val, oldval) {
if(val){
this.parameters = {
...val
}
this.interCurrent = val.interCurrent
}
},
deep: true,
},
PopularCities: {
handler (val, oldval) {
if(val){
this.cityList = val[0].CityList
}
},
deep: true,
}
},
created() {
},
methods: {
sure(){
this.$emit('sure',this.parameters)
},
setInternational(val){
this.interCurrent = val.ID
},
confirmCity(val) {
this.parameters.GName = val.GName;
this.cityList = val.CityList
this.parameters.CityCode2 = this.cityList[0].CityCode;
this.parameters.CityName = this.cityList[0].CityName;
},
changeDistrict(item) {
this.parameters.CityCode2 = item.CityCode
this.parameters.CityName = item.CityName;
},
clickSearchCity(){
this.$emit('searchCity','City')
},
}
}
</script>
<style scoped>
@import url("@/asset/css/flex.css");
.hotelRegionBox{
height: 1218rpx;
}
.hotelRegionL{
width: 183rpx;
background: #E9E4E0;
}
.hotelRegionLText{
height: 78rpx;
line-height: 70rpx;
font-weight: bold;
font-size: 28rpx;
color: #080A09 ;
}
.hotelRegionLText.active{
background: #F3F1EF;
color: #B99846;
}
.hotelPopular{
width: 8rpx;
height: 8rpx;
background: #FF3166;
border-radius: 50%;
margin-right: 10rpx;
}
.hotelRegionR{
width: 1px;
flex: 1;
background: #F3F1EF;
padding: 0rpx 10rpx;
}
.hotelRegionRText{
width: 150rpx;
height: 68rpx;
line-height: 60rpx;
background: #fff;
margin: 10rpx 15rpx;
padding: 0 10rpx;
border-radius: 6rpx;
}
.hotelRegionRText view{
font-size: 28rpx;
color: #080A09;
font-weight: 500;
display: block;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.hotelRegionRText.active{
background: #B99846;
}
.hotelRegionRText.active view{
color: #fff;
}
.hotelAddress{
position: relative;
padding: 25rpx 0;
}
.hotelClear{
position: absolute;
right: 30rpx;
z-index: 1;
}
.hotelAddress text{
font-size: 32rpx;
font-weight: 800;
}
.hotelRegionRC{
display: flex;
flex-wrap: wrap;
}
.internationalBox{
padding: 0 80rpx;
margin-bottom: 30rpx;
}
.internationalName{
flex: 1;
text-align: center;
font-size: 30rpx;
position: relative;
}
.internationalNABox{
position: absolute;
bottom: -15rpx;
left: 0;
right: 0;
}
.internationalName.active .internationalNA{
width: 50rpx;
height: 8rpx;
border-radius: 8rpx;
background: #B99846;
margin: auto;
font-weight: bold;
}
.internationalNA view{
opacity: 0;
}
.internationalSearch{
border-radius: 50rpx;
background: #fff;
margin: 0 30rpx;
margin-bottom: 8rpx;
overflow: hidden;
}
.clickSearch{
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 3;
}
.clickSearch view{
opacity: 0;
}
</style>
\ No newline at end of file
<template>
<view class="searchCityBox column">
<view class="searchCityKey column"
:style="[titleStyle]">
<view class="row items-center" :style="{'padding-right':paddingRight}">
<view class="internationalSearch">
<u-search :placeholder="type?'搜索城市/国家中文或拼音':'搜索酒店中文或拼音'"
v-model="parameters.KeyWords"
input-align="left"
:value="parameters.KeyWords"
text-color="#111"
bg-color="rgba(0,0,0,0)"
@change="getKeyWords"
@confirm="searchKey"
:show-action="false"
style="font-size: 22rpx;"></u-search>
</view>
<text @click="searchClose">取消</text>
</view>
<view class="internationalTisp">
{{type?'当前目的地及周边查询结果(酒店起价为参考价)':'当前酒店查询结果(酒店起价为参考价)'}}
</view>
</view>
<scroll-view :scroll-y="true" style="height: 1px;flex: 1;overflow: hidden;"
@scrolltolower="lower">
<view class="searchCityCenterBox">
<template v-if="HotelList.length>0||KeyCityList.length>0">
<template v-if="HotelList.length>0">
<view class="searchCityCenter column" v-for="(item,index) in HotelList"
:key="index"
@click="currentData(item)">
<view class="searchCityTitle">
<view>{{ item.name }}</view>
</view>
<view class="searchCityText row">
<view class="searchCityTextL col">
<template v-for="x in item.tagList">{{ x }}/</template>
<template v-if="item.starRating">
{{item.starRating}}星/
</template>
<template v-if="item.address||item.areaLis.length>0">
{{ item.address }}
<template v-if="item.areaList.length>0">(
<template v-for="(x,i) in item.areaList">
{{ x }}
<template v-if="i!=item.areaList.length-1">
</template>
</template>)
</template>
</template>
</view>
<view class="searchCityTextR">
{{ item.unitprice }}
<text></text>
</view>
</view>
</view>
</template>
<template v-if="KeyCityList.length>0">
<view class="searchCityCenter column" v-for="(item,index) in KeyCityList"
:key="index"
@click="currentData(item,1)">
<view class="searchCityTitle">
<view>{{ item.NameCN }}</view>
</view>
<view class="searchCityText row">
<view class="searchCityTextL col">
</view>
<view class="searchCityTextR">
<!-- {{ item.unitprice }} -->
<text></text>
</view>
</view>
</view>
</template>
</template>
<u-empty v-else text="请输入关键字" mode="data" padding-top="50" color="#000"></u-empty>
<!-- <u-loadmore v-if="showLoading" :status="status" :load-text="loadText" :font-size="24" :margin-top="20"
:margin-bottom="20" bg-color="#F5F5F5" color="#111" /> -->
</view>
</scroll-view>
</view>
</template>
<script>
export default {
props:['type'],
data() {
return {
parameters: {
pageIndex: 1,
pageSize: 15,
CityCode: '',
CityName: '',
GName: '',
KeyWords: '',
},
cityList: [],
cityListAll: [],
PopularCities: [],
HotelList: [],
KeyCityList: [],
titleStyle: null,
paddingRight: 0,
showLoading: false,
loadText: {
loadmore: "轻轻上拉,加载更多",
loading: "努力加载中",
nomore: "没有更多了",
},
status: "loadmore",
page_count: 0,
}
},
created() {
const that = this
uni.getSystemInfo({
success(res) {
that.paddingRight = `${res.screenWidth-160}rpx`
that.titleStyle = {
paddingTop: `${res.statusBarHeight}px`
};
},
});
},
methods:{
getKeyWords(){
if(this.parameters.KeyWords==''||!this.parameters.KeyWords){
this.HotelList = []
this.KeyCityList = []
return
}
if(this.type){
this.searchCity()
}else{
this.getList(1)
}
},
searchClose(){
this.$emit('searchClose')
this.HotelList = []
this.KeyCityList = []
this.parameters.KeyWords = ''
},
lower(e) {
// TODO: 滚动到了底部,实现翻页加载
if (this.parameters.pageIndex < this.page_count) {
this.status = "loading";
this.parameters.pageIndex++;
this.getList();
} else {
this.status = "nomore";
}
},
//获取列表数据
getList(type) {
if(this.showLoading) return
uni.showLoading({
title: "加载中",
});
// this.searchObj.QStars = this.tempRateAndPrice.rate.toString();
if (type == 1) {
this.parameters.pageIndex =1
this.page_count = 0
this.HotelList = [];
}
this.showLoading = true
this.apipost('dmc_post_B2BAndB2CGetDidaHotelPage',this.parameters,
(res) => {
if (res.resultCode == 1) {
uni.hideLoading();
this.showLoading = false
if (this.parameters.pageIndex === 1) {
this.HotelList = res.data.pageData;
} else {
this.HotelList = this.HotelList.concat(res.data.pageData);
}
console.log(this.HotelList,'------');
this.page_count = res.data.pageCount;
}
},(err)=>{
uni.hideLoading();
this.showLoading = false
uni.showToast({
title: err.message,
icon: 'none',
})
}
);
},
currentData(item,type){
if(this.parameters.KeyWords==''||!this.parameters.KeyWords) return
if(type){
this.$emit('searchKey',3,item.CityCode,item.NameCN.split(' ')[0])
}else{
this.$emit('searchKey',2,item.hotelid)
}
},
searchKey(){
if(this.parameters.KeyWords==''||!this.parameters.KeyWords) return
this.$emit('searchKey',1,this.parameters.KeyWords)
},
searchCity(){
if(this.showLoading)return
uni.showLoading({
title: "加载中",
})
this.showLoading = true
this.apipost('dmc_post_B2BAndB2CGetDestination',{
KeyWords: this.parameters.KeyWords
},
(res) => {
if (res.resultCode == 1) {
this.KeyCityList = res.data
uni.hideLoading();
this.showLoading = false
}
},
(err) => {
uni.hideLoading();
this.showLoading = false
}
);
},
}
}
</script>
<style scoped>
@import url("@/asset/css/flex.css");
.searchCityBox{
width: 100vw;
height: 100vh;
background: #fff;
}
.internationalSearch{
}
.internationalSearch{
width: 1px;
flex: 1;
border-radius: 30rpx;
padding: 5rpx 15rpx ;
background: #F6F7F9;
margin-right: 20rpx;
margin-left: 30rpx;
}
.internationalTisp{
font-size: 22rpx;
background: #F3F7FA;
margin-top: 20rpx;
padding: 10rpx 30rpx;
letter-spacing: 2rpx;
}
.searchCityCenter{
padding: 20rpx 30rpx;
border-bottom: 1px solid #eee;
}
.searchCityTitle{
font-size: 30rpx;
}
.searchCityTitle view{
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.searchCityTextL{
font-size: 24rpx;
color: #6D6D6F;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.searchCityTextR{
margin-left: 15rpx;
font-size: 32rpx;
color: #B99846;
font-weight: bold;
}
.searchCityTextR text{
color: #000;
font-weight: 100;
font-size: 26rpx;
margin-left: 5rpx;
}
</style>
\ No newline at end of file
...@@ -2,25 +2,26 @@ ...@@ -2,25 +2,26 @@
<view class="hotel-list-item" <view class="hotel-list-item"
:class="[isMap?'hotel-mapList':'']" @click="goHotelDetail(item.HotelId)"> :class="[isMap?'hotel-mapList':'']" @click="goHotelDetail(item.HotelId)">
<view class="img-box"> <view class="img-box">
<image :src="item.CoverImg" mode="aspectFill"></image> <image :src="item.coverimg" mode="aspectFill"></image>
</view> </view>
<view class="hotel-info column"> <view class="hotel-info column">
<view class="hotel-name row items-center"> <view class="hotel-name row items-center">
<img v-if="item.Star>=3" class="hotel-SubR" :class="[item.Star==3?'hotel-SubStar3':item.Star==4?'hotel-SubStar4':item.Star==5?'hotel-SubStar5':'']" :src="item.Star==3?StarImgs[0]:item.Star==4?StarImgs[1]:item.Star==5?StarImgs[2]:''"/> <img v-if="item.Star>=3" class="hotel-SubR" :class="[item.Star==3?'hotel-SubStar3':item.Star==4?'hotel-SubStar4':item.Star==5?'hotel-SubStar5':'']" :src="item.Star==3?StarImgs[0]:item.Star==4?StarImgs[1]:item.Star==5?StarImgs[2]:''"/>
<text v-else class="hotel-Economy">经济型</text> <text v-else class="hotel-Economy">经济型</text>
{{item.HotelName}} {{item.name}}
</view> </view>
<view class="hotel-Subtitle row"> <view class="hotel-Subtitle row">
<view class="hotel-SubText" v-if="item.AddressDes">{{ item.AddressDes }}</view> <view class="hotel-SubText" v-if="item.areaList.length>0">
<text v-for="(t,i) in item.areaList" :key="i">{{ t }}
<template v-if="i!=item.areaList.length-1"></template>
</text>
</view>
</view> </view>
<view class="hotel-start"> <view class="hotel-start">
<view class="other-rate" v-if="item.Star==9"> <view class="other-rate" v-for="(t,i) in item.tagList" :key="i">
<text>温泉酒店</text> <text>温泉酒店</text>
</view> </view>
<view class="other-rate" v-if="item.Star==8">
<text>精选民宿</text>
</view>
</view> </view>
<view class="localtion row items-start"> <view class="localtion row items-start">
<view class="localtionL"> <view class="localtionL">
...@@ -29,7 +30,7 @@ ...@@ -29,7 +30,7 @@
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638759918789658713.png"/> src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638759918789658713.png"/>
</view> </view>
<view class="localtionR" style="width:1px;flex:1"> <view class="localtionR" style="width:1px;flex:1">
{{item.Address}} {{item.address}}
</view> </view>
</view> </view>
<!-- <view> <!-- <view>
...@@ -39,12 +40,12 @@ ...@@ -39,12 +40,12 @@
<view class="hotel-price"> <view class="hotel-price">
<view class="hotel-priceL"> <view class="hotel-priceL">
<view> <view>
Shangri-La Hotel... {{ item.brandname }}
</view> </view>
</view> </view>
<view class="price"> <view class="price">
<text>CNY</text> <text>CNY</text>
<text class="money">{{$utils.getretailer()==true? item.B2BPrice:item.SalesPrice}}</text> <text class="money">{{item.unitprice}}</text>
<text></text> <text></text>
</view> </view>
</view> </view>
...@@ -254,6 +255,7 @@ ...@@ -254,6 +255,7 @@
text-overflow: ellipsis; text-overflow: ellipsis;
position: relative; position: relative;
top: -3rpx; top: -3rpx;
text-align: center;
} }
.hotel-list-item.hotel-mapList{ .hotel-list-item.hotel-mapList{
margin: 0; margin: 0;
......
...@@ -10,8 +10,8 @@ ...@@ -10,8 +10,8 @@
:class="{ active: isMinActive }" :class="{ active: isMinActive }"
:style="'width:' + blockSize + 'rpx;height:' + blockSize + 'rpx;margin-left:' + minBlockLeft + 'rpx;'" :style="'width:' + blockSize + 'rpx;height:' + blockSize + 'rpx;margin-left:' + minBlockLeft + 'rpx;'"
@touchstart="_onBlockTouchStart" @touchstart="_onBlockTouchStart"
@touchmove.stop="_onBlockTouchMove" @touchmove.stop="(e)=>{_onBlockTouchMove(e,'Left')}"
@touchend="_onBlockTouchEnd" @touchend="(e)=>{_onBlockTouchEnd(e,'Left')}"
:data-left="minBlockLeft" :data-left="minBlockLeft"
data-tag="minBlock" data-tag="minBlock"
> >
...@@ -22,8 +22,8 @@ ...@@ -22,8 +22,8 @@
:class="{ active: isMaxActive }" :class="{ active: isMaxActive }"
:style="'width:' + blockSize + 'rpx;height:' + blockSize + 'rpx;margin-left:' + maxBlockLeft + 'rpx;'" :style="'width:' + blockSize + 'rpx;height:' + blockSize + 'rpx;margin-left:' + maxBlockLeft + 'rpx;'"
@touchstart="_onBlockTouchStart" @touchstart="_onBlockTouchStart"
@touchmove.stop="_onBlockTouchMove" @touchmove.stop="(e)=>{_onBlockTouchMove(e,'Right')}"
@touchend="_onBlockTouchEnd" @touchend="(e)=>{_onBlockTouchEnd(e,'Right')}"
:data-left="maxBlockLeft" :data-left="maxBlockLeft"
data-tag="maxBlock" data-tag="maxBlock"
> >
...@@ -163,7 +163,6 @@ export default { ...@@ -163,7 +163,6 @@ export default {
values: function(newVal, oldVal, changedPath) { values: function(newVal, oldVal, changedPath) {
var that = this; var that = this;
var values = that.values; var values = that.values;
console.log('refresh', newVal, oldVal);
if (that._isValuesValid(newVal) && that._isValuesValid(values)) { if (that._isValuesValid(newVal) && that._isValuesValid(values)) {
if (values[0] != oldVal[0] || values[1] != oldVal[1]) that._refresh(); if (values[0] != oldVal[0] || values[1] != oldVal[1]) that._refresh();
} }
...@@ -200,7 +199,7 @@ export default { ...@@ -200,7 +199,7 @@ export default {
this._curBlock = e.target.dataset.tag; this._curBlock = e.target.dataset.tag;
} }
}, },
_onBlockTouchMove: function(e) { _onBlockTouchMove: function(e,type) {
let tag = e.target.dataset.tag; let tag = e.target.dataset.tag;
if (tag == 'minBlock' || tag == 'maxBlock') { if (tag == 'minBlock' || tag == 'maxBlock') {
var that = this; var that = this;
...@@ -222,10 +221,10 @@ export default { ...@@ -222,10 +221,10 @@ export default {
this.originalMaxValue = values[1]; this.originalMaxValue = values[1];
var eventOption = {}; var eventOption = {};
// //
if (this.liveMode) that.$emit('rangechange', eventDetail, eventOption); if (this.liveMode) that.$emit('rangechange', eventDetail, eventOption,type);
} }
}, },
_onBlockTouchEnd: function(e) { _onBlockTouchEnd: function(e,type) {
let tag = e.target.dataset.tag; let tag = e.target.dataset.tag;
this.isMinActive = false; this.isMinActive = false;
this.isMaxActive = false; this.isMaxActive = false;
...@@ -246,7 +245,7 @@ export default { ...@@ -246,7 +245,7 @@ export default {
this.originalMinValue = values[0]; this.originalMinValue = values[0];
this.originalMaxValue = values[1]; this.originalMaxValue = values[1];
var eventOption = {}; var eventOption = {};
that.$emit('rangechange', eventDetail, eventOption); that.$emit('rangechange', eventDetail, eventOption,type);
} }
}, },
_isValuesValid: function(values) { _isValuesValid: function(values) {
......
<template>
<view class="hotel-list-search">
<view class="row items-center" style="padding: 12rpx 0;">
<view class="search-box" style="width: 1px;flex: 1;">
<view class="hotel-city" @click="showCity">
<!-- <u-icon name="location" :size="24" color="#000000" style="margin-right: 8rpx"></u-icon> -->
{{ city }}
</view>
<view class="date" @click="chosenDate">
<view class="row"><text>入住</text> <view>{{ startDay }}</view> <text>{{parameters.rooms}}</text></view>
<view class="row"><text>离店</text> <view>{{ endDay }}</view> <text>{{parameters.peoples}}</text></view>
</view>
<view class="days column justify-center">
</view>
<view style="width: 1px; flex: 1">
<u-search placeholder="城市/地标/商圈/酒店" v-model="parameters.KeyWords" input-align="left"
:value="parameters.KeyWords" text-color="#111" bg-color="rgba(0,0,0,0)" @change="research()"
:show-action="false"
style="font-size: 22rpx;"></u-search>
</view>
</view>
<view class="hotelMapIcon column" v-if="isMap" @click="goMapHotel">
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638759918587378741.png"
style="width: 45rpx;height: 36rpx;"/>
<text>地图</text>
</view>
</view>
<u-dropdown ref="uDropdown"
@open="open" @close="close"
active-color="#B99846"
inactive-color="#080A09"
title-size="28"
>
<u-dropdown-item
v-model="parameters.QOrderBy"
:title="optionsTitle[0]"
:options="options1">
<view
class="slot-content hotelComprehensiveBox column"
style="background-color: #F3F1EF"
>
<view class="hotelComprehensiv row items-center"
v-for="(item,index) in options1" :key="index"
:class="[parameters.QOrderBy==item.value?'active':'']"
@click="ComSorting(item)">
<text>{{ item.label }}</text>
<view v-if="parameters.QOrderBy==item.value">
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638760948784111958.png"/>
</view>
</view>
</view>
</u-dropdown-item>
<u-dropdown-item
:title="optionsTitle[1]"
:options="cityList">
<view
class="slot-content hotelRegionBox column"
style="background-color: #E9E4E0"
>
<view class="row" style="height: 1px;flex: 1;">
<view class="hotelRegionL">
<scroll-view :scroll-y="true" style="height: 100%;">
<view class="hotelRegionLText row items-center justify-center"
:class="[parameters.GName==item.GName?'active':'']"
v-for="(item,index) in PopularCities" :key="index"
@click="confirmCity(item)">
<!-- <view class="hotelPopular"></view> -->
<text>{{ item.GName }}</text>
</view>
</scroll-view>
</view>
<view class="hotelRegionR">
<scroll-view :scroll-y="true" style="height: 100%;">
<view class="hotelRegionRText row items-center"
v-for="(item,index) in cityList" :key="index"
@click="changeDistrict(item)">
<text>{{ item.CityName }}</text>
<view v-if="parameters.CityCode==item.CityCode">
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638760948784111958.png"/>
</view>
</view>
</scroll-view>
</view>
</view>
<view style="padding: 0 30rpx;box-shadow: 0rpx 1rpx 8rpx 0rpx rgba(185,152,70,0.25);background: #F3F1EF;">
<view
style="
box-shadow: 0px -10px 30px 0px rgba(36, 36, 36, 0.06);
margin-top: 40rpx;
margin-bottom: 40rpx;
display: flex;
"
>
<view style="flex: 1; margin-right: 30rpx">
<u-button :custom-style="btnStyle" @click="resetRegion"
>清空</u-button
>
</view>
<view style="flex: 1">
<u-button :custom-style="btnStyle2" @click="sureRegion"
>完成</u-button
>
</view>
</view>
</view>
</view>
</u-dropdown-item>
<u-dropdown-item :title="optionsTitle[2]" >
<view
class="slot-content"
style="padding: 30rpx 0; background-color: #F3F1EF"
>
<view style="padding: 0 30rpx;">
<view style="font-size: 28rpx;color: #080A09;font-weight: bold;">
<text
style="
margin-right: 10rpx;
"
>价格</text
>
<text>
<!--({{tempRateAndPrice.priceText?tempRateAndPrice.priceText:'单选'}})-->
(单选)
</text>
</view>
<view
style="
display: flex;
align-items: center;
color: #757776;
margin-top: 34rpx;
"
>
<view style="font-size: 24rpx; flex: 1">{{ parameters.StartPrice }}</view>
<view
style="
font-size: 24rpx;
flex: 1;
color: #757776;
text-align: right;
"
>{{ tempRateAndPrice.priceText }}</view
>
</view>
<range-slider
ref="rangeslider"
:width="690"
:height="80"
:step="10"
:liveMode="true"
background-color="#E2E2E2"
:block-size="40"
bar-height="12"
active-color="#E2C27A"
min="100"
:max="MaximumDatas.maxPrice"
@rangechange="rangechange"
:values="tempRateAndPrice.price"
></range-slider>
</view>
<view class="hotelPriceRangeBox row">
<view class="hotelPriceRange"
v-for="(item,index) in PriceRange"
:key="index"
:class="[tempRateAndPrice.priceId==index+1?'active':'']"
@click="changePrice(item)">
<view>
{{ item.Name }}
</view>
</view>
</view>
<view style="padding: 0 30rpx;">
<view style="margin: 36rpx 0 29rpx 0">
<text style="font-size: 28rpx; color: #111; font-weight: 800"
>星级</text
>
</view>
</view>
<view class="hotel-rate-box">
<view class="hotel-rateTetx" v-for="(x, i) in rates"
:key="i">
<view
class="hotel-rate"
:class="{ active: tempRateAndPrice.rate.indexOf(x.Id) != -1 }"
@click="setHotelRate(x.Id)">
{{ x.Name }}</view>
</view>
</view>
<view style="padding: 0 30rpx;">
<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">
<u-button :custom-style="btnStyle" @click="resetPrice"
>清空</u-button
>
</view>
<view style="flex: 1">
<u-button :custom-style="btnStyle2" @click="surePrice"
>完成</u-button
>
</view>
</view>
</view>
</view>
</u-dropdown-item>
<!--
<u-dropdown-item :title="optionsTitle[3]">
<view
class="slot-content hotelRegionBox column"
style="background-color: #E9E4E0"
>
<view class="row" style="height: 1px;flex: 1;">
<view class="hotelRegionL">
<scroll-view :scroll-y="true" style="height: 100%;">
<view class="hotelRegionLText row items-center justify-center"
:class="[index==0?'active':'']"
v-for="(item,index) in cityList" :key="index"
@click="changeLabel(item)">
<view class="hotelPopular"></view>
<text>{{ item.CityName }}</text>
</view>
</scroll-view>
</view>
<view class="hotelRegionR">
<scroll-view :scroll-y="true" style="height: 100%;">
<view class="hotelRegionRTBox row">
<view class="hotelRegionRText row items-center"
:class="[index==0?'active':'']"
v-for="(item,index) in options2" :key="index"
@click="changeSubtags(item)">
<text>{{ item.label }}</text>
<view>
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638760948784111958.png"/>
</view>
</view>
</view>
</scroll-view>
</view>
</view>
<view style="padding: 0 30rpx;box-shadow: 0rpx 1rpx 8rpx 0rpx rgba(185,152,70,0.25);background: #F3F1EF;">
<view
style="
box-shadow: 0px -10px 30px 0px rgba(36, 36, 36, 0.06);
margin-top: 40rpx;
margin-bottom: 40rpx;
display: flex;
"
>
<view style="flex: 1; margin-right: 30rpx">
<u-button :custom-style="btnStyle" @click="resetFilter"
>清空</u-button
>
</view>
<view style="flex: 1">
<u-button :custom-style="btnStyle2" @click="sureFilter"
>完成</u-button
>
</view>
</view>
</view>
</view>
</u-dropdown-item>-->
</u-dropdown>
<u-popup v-model="showCityList" mode="bottom" :border-radius="40" length="75%">
<!--<Address @confirm="confirmCity" :list="cityList" />-->
<destination :msg="parameters" @close="closeAddress" @clear="clearAddress" @sure="sureAddress"></destination>
</u-popup>
<u-popup v-model="showTimePopup"
mode="bottom" border-radius="20" length="75%" :safe-area-inset-bottom="true">
<view style="
width: 100%;
height: 100%;
display: flex;
flex-direction: column;">
<view style="flex: 1; width: 100%; height: 1rpx">
<canlendar @finish="chosenDateResult" title="日期和人数"></canlendar>
</view>
<view style="background: #ecf1f4; padding: 20rpx 0;margin-bottom: 80rpx;">
<view class="row line-flex" style="padding: 30rpx; background: #fff">
<text style="font-size: 28rpx; color: #111; font-weight: 500">房间</text>
<text style="
font-size: 22rpx;
color: #999;
margin-left: 30rpx;
flex: 1;
"></text>
<u-number-box size="28" :min="1" :max="100000" @change="crChange" v-model="parameters.rooms"></u-number-box>
</view>
<view class="row line-flex" style="padding: 30rpx; background: #fff">
<text style="font-size: 28rpx; color: #111; font-weight: 500">成人</text>
<text style="
font-size: 22rpx;
color: #999;
margin-left: 30rpx;
flex: 1;
">18周岁以上</text>
<u-number-box size="28" :min="1"
:max="100000"
v-model="parameters.adultsNumber"
@change="crChange"></u-number-box>
</view>
<view class="row line-flex" style="padding: 30rpx; background: #fff">
<text style="font-size: 28rpx; color: #111; font-weight: 500">儿童(占床)</text>
<text style="
font-size: 22rpx;
color: #999;
margin-left: 30rpx;
flex: 1;
">2-18周岁(不含)</text>
<u-number-box size="28" :min="0" :max="100000"
v-model="parameters.childrenNumberZC"
@change="etChange"
></u-number-box>
</view>
<!--
<view class="row line-flex" style="padding: 30rpx; background: #fff">
<text style="font-size: 28rpx; color: #111; font-weight: 500">儿童(不占床)</text>
<text style="
font-size: 22rpx;
color: #999;
margin-left: 30rpx;
flex: 1;
">2-18周岁(不含)</text>
<u-number-box size="28" :min="0" :max="100000" v-model="parameters.childrenNumberBZC"></u-number-box>
</view>-->
</view>
</view>
</u-popup>
</view>
</template>
<script>
import rangeSlider from "./range-slider.vue";
import canlendar from "./time/index";
import hotelGood from "./hotel-good.vue";
import Address from "./address/smh-address-indexed.vue";
import destination from "./address/index.vue";
export default {
components: {
rangeSlider,
canlendar,
hotelGood,
Address,
destination,
},
props:['isMap','msg'],
data() {
return {
city: "成都",
cityList: [],
PopularCities: [],
showCityList: false,
showTimePopup: false,
parameters: {
KeyWords: "", //关键字
StartPrice: 100,
EndPrice: 0,
QOrderBy: "1", //排序类型
QStarRating: [], //星级
GName: '', //热门
CityCode: '',//目的地代码
// QStartDate: "",//开始日期
// QEndDate: "",//结束日期
// District: 0, //区
rooms: 1,
adultsNumber:2,
childrenNumberZC:0,
childrenNumberBZC:0,
peoples: 2,
interCurrent: 0,
},
day: 0,
startDay: "",
endDay: "",
HotelList: [], //酒店数据
tempRateAndPrice: {
price: [],
priceText: "",
rate: [],
priceId: 0,
},
MaximumDatas: null,
optionsTitle: ["综合排序", "位置区域", "价格/星级", "筛选"],
rates: [],
options1: [], //推荐排序数据
options2: [{
label: "不限",
value: -1,
},
{
label: "宝镜岩",
value: 1,
},
{
label: "盆景滩",
value: 2,
},
{
label: "芦苇海",
value: 3,
},
{
label: "五彩池",
value: 4,
},
{
label: "镜海",
value: 5,
},
{
label: "犀牛海",
value: 6,
},
{
label: "诺日朗瀑布",
value: 7,
},
{
label: "火花海",
value: 8,
},
],
btnStyle: {
borderRadius: "16rpx",
color: "#111",
fontSize: "30rpx",
width: "100%",
border: "1px solid #111",
background: "#FFF",
},
btnStyle2: {
borderRadius: "16rpx",
color: "#fff",
fontSize: "30rpx",
width: "100%",
background: "#111",
},
dayObj: {},
cityList: [{
label: "不限",
value: 0
}],
showDialog: false,
PriceRange:[
{Name: '¥150以下',minPrice: 0,maxPrice: 150},
{Name: '¥150-250',minPrice: 150,maxPrice: 250},
{Name: '¥250-300',minPrice: 250,maxPrice: 300},
{Name: '¥300-350',minPrice: 300,maxPrice: 350},
{Name: '¥350-500',minPrice: 350,maxPrice: 500},
{Name: '¥500-650',minPrice: 500,maxPrice: 650},
{Name: '¥650-850',minPrice: 650,maxPrice: 850},
{Name: '¥850以上',minPrice: 850,maxPrice: 0},
],
mc: '',
};
},
watch:{
msg: {
handler (val, oldval) {
if(val){
this.parameters.KeyWords = val.KeyWords
}
},
deep: true,
}
},
onLoad(options) {
},
created() {
uni.setNavigationBarTitle({
title: "酒店",
});
let d1 = new Date();
let d = new Date();
let d2 = new Date(d.setDate(d.getDate() + 1));
let startWeek = "周" + "日一二三四五六".charAt(new Date().getDay());
let endWeek = "周" + "日一二三四五六".charAt(new Date().getDay() + 1);
let month1 = d1.getMonth() + 1;
let day1 = d1.getDate();
let Month1 = month1>9?month1:'0'+month1;
let Day1 = day1>9?day1:'0'+day1;
let month2 = d2.getMonth() + 1;
let day2 = d2.getDate();
let Month2 = month2>9?month2:'0'+month2;
let Day2 = day2>9?day2:'0'+day2;
var obj = {
start: `${d1.getFullYear()}-${Month1}-${Day1}`,
end: `${d2.getFullYear()}-${Month2}-${Day2}`,
startDay: `${Month1}-${Day1}`,
endDay: `${Month2}-${Day2}`,
day: 1,
startWeek: startWeek,
endWeek: endWeek,
};
this.startDay = obj.startDay;
this.endDay = obj.endDay;
this.day = obj.day;
this.getCity();
this.getSearchCondition()
},
methods: {
sureAddress(msg){
this.showCityList = false;
this.parameters = msg
this.city = msg.CityName
this.research()
},
clearAddress(){
this.parameters.CityCode = 0
this.showCityList = false
this.research()
},
closeAddress(){
this.showCityList = false
},
etChange(e){
this.parameters.childrenNumberZC = e.value;
this.peopleChange()
},
crChange(e){
this.parameters.adultsNumber = e.value;
this.peopleChange()
},
peopleChange(){
this.parameters.peoples = this.parameters.adultsNumber + this.parameters.childrenNumberZC
console.log(this.parameters.peoples,'人数')
},
// 筛选排序
sureFilter(){
this.$forceUpdate();
this.closeDropdown();
this.research();
},
resetFilter(){
this.closeDropdown()
this.research();
},
changeLabel(item){
},
changeSubtags(item){
},
// 位置排序
sureRegion(){
this.$forceUpdate();
this.closeDropdown();
this.research();
},
resetRegion(){
this.parameters.CityCode = '';
this.closeDropdown()
this.research();
},
showCity() {
this.showCityList = true;
},
confirmCity(val) {
this.parameters.GName = val.GName
this.cityList = val.CityList;
},
changeDistrict(item) {
this.parameters.CityCode = item.CityCode
},
// 价格排序
surePrice() {
this.parameters.QStarRating = this.tempRateAndPrice.rate
this.closeDropdown();
this.research();
},
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.priceId = 0
this.tempRateAndPrice = {
price: {
minValue: 0,
maxValue: this.MaximumDatas.maxPrice,
},
priceText: `¥${this.PriceRange[0].minPrice}~${this.MaximumDatas.maxPrice}`,
rate: [],
};
this.parameters.StartPrice = this.PriceRange[0].minPrice;
this.parameters.EndPrice = this.MaximumDatas.maxPrice;
this.parameters.QStarRating = []
this.closeDropdown();
this.research();
},
rangechange(e,option,type) {
this.parameters.StartPrice = e.minValue
this.parameters.EndPrice = e.maxValue
this.tempRateAndPrice.priceText = `¥${e.minValue}~${e.maxValue}`;
this.tempRateAndPrice.price = [this.parameters.StartPrice,this.parameters.EndPrice]
return
let PriceList = null
let minPrice = null
let maxPrice = null
if(type=='Right') {
PriceList = this.PriceRange.filter(item => item.minPrice <= e.maxValue)
minPrice = Math.max(...PriceList.map(item => item.minPrice))
maxPrice = Math.max(...PriceList.map(item => item.maxPrice))
if(minPrice>=0){
if(minPrice==0) this.tempRateAndPrice.priceText = `¥${maxPrice}以下`;
else if(maxPrice==0) this.tempRateAndPrice.priceText = `¥${maxPrice}以上`;
else this.tempRateAndPrice.priceText = `¥${minPrice}~${maxPrice}`;
this.parameters.StartPrice = e.minPrice;
this.parameters.EndPrice = maxPrice;
}
}
if(type=='Left') {
PriceList = this.PriceRange.filter(item => item.minPrice <= e.minValue)
minPrice = Math.max(...PriceList.map(item => item.minPrice))
maxPrice = Math.max(...PriceList.map(item => item.maxPrice))
this.parameters.StartPrice = e.minValue;
if(minPrice>=0){
if(minPrice==0){
this.parameters.StartPrice = 0;
this.tempRateAndPrice.priceText = `¥${minPrice}~${this.MaximumDatas.maxPrice}`;
}else if(maxPrice==0){
this.tempRateAndPrice.priceText = `¥${minPrice}以上`;
}else this.tempRateAndPrice.priceText = `¥${minPrice}~${maxPrice}`;
}
this.parameters.EndPrice = maxPrice;
}
this.tempRateAndPrice.price = [this.parameters.StartPrice,this.parameters.EndPrice]
},
changePrice(item) {
this.parameters.StartPrice = item.minPrice?item.minPrice:100;
this.parameters.EndPrice = item.maxPrice;
this.tempRateAndPrice.priceText = item.Name;
this.tempRateAndPrice.price = [item.minPrice?item.minPrice:100,item.maxPrice]
this.tempRateAndPrice.priceId = item.priceId
},
ComSorting(item) {
this.parameters.QOrderBy = item.value
this.optionsTitle[0] = item.label;
setTimeout(() => {
this.closeDropdown()
}, 300);
this.research();
},
// 星际级
setHotelRate(rateId) {
let temp = this.tempRateAndPrice.rate.indexOf(rateId);
if (temp == -1) {
this.tempRateAndPrice.rate.push(rateId);
} else {
this.tempRateAndPrice.rate.splice(temp, 1);
}
},
// 日期
chosenDate() {
this.showTimePopup = true;
},
chosenDateResult(obj) {
// this.parameters.QStartDate = obj.start;
// this.parameters.QEndDate = obj.end;
this.startDay = obj.startDay;
this.endDay = obj.endDay;
this.day = obj.day;
this.dayObj = obj;
this.showTimePopup = false;
this.research();
},
closeDropdown() {
this.$refs.uDropdown.close();
},
open(index) {
// 展开某个下来菜单时,先关闭原来的其他菜单的高亮
// 同时内部会自动给当前展开项进行高亮
this.$refs.uDropdown.highlight();
if (index == 2) {
// this.tempRateAndPrice = this.parameters.rateAndPrice
}
},
close(index) {
// 关闭的时候,给当前项加上高亮
// 当然,您也可以通过监听dropdown-item的@change事件进行处理
this.$refs.uDropdown.highlight(index);
},
research() {
this.$emit('change',this.parameters);
console.log(this.parameters,'----------1000')
},
//获取查询条件
getSearchCondition() {
this.apipost('dmc_post_B2BAndB2CDiDaHotelQueryCondition',{},(res)=>{
if(res.resultCode==1){
this.options1 = [];
this.PriceRange = []
let tempObj = res.data;
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.StarRatingList) {
this.rates = tempObj.StarRatingList;
}
if (tempObj && tempObj.PriceList) {
tempObj.PriceList.forEach((x,i) => {
let obj = {
Name: `¥${x.Name}`,
minPrice: x.MinPrice,
maxPrice: x.MaxPrice,
priceId: i+1,
};
this.PriceRange.push(obj);
});
this.MaximumDatas = this.PriceRange[this.PriceRange.length-1]
this.parameters.EndPrice = this.MaximumDatas.MaxPrice
this.tempRateAndPrice.priceText = `¥${this.MaximumDatas.maxPrice}`;
}
this.research();
}
},(err)=>{
})
},
// 城市
getCity() {
this.apipost('dmc_post_B2BAndB2CGetHotCity',{},
(res) => {
if (res.resultCode == 1) {
this.PopularCities = res.data
this.parameters.GName = res.data[0].GName
this.cityList = res.data[0].CityList
}
},
(err) => {}
);
},
goMapHotel(){
this.closeDropdown()
uni.navigateTo({
url: "/pages/hotel/mapList"
});
}
},
};
</script>
<style lang="scss">
@import url("@/asset/css/flex.css");
.hotel-list-search .hotel-city {
height: 40rpx;
padding: 0rpx 0 8rpx 0rpx;
margin-right: 27rpx;
text-align: center;
font-size: 28rpx;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display: flex;
align-items: center;
}
.hotel-list-search .search-box {
height: 88rpx;
background: #fff;
border-radius: 10rpx;
display: flex;
align-items: center;
padding: 15rpx 0 15rpx 26rpx;
margin: 0 30rpx;
}
.hotel-list-search .search-box .date {
height: 50rpx;
font-size: 20rpx;
font-weight: 500;
color: #111111;
line-height: 29rpx;
margin-top: -6px;
}
.hotel-list-search .search-box .date text{
color: #757776;
margin-right: 7rpx;
font-size: 22rpx;
}
.hotel-list-search .search-box .date text:last-child{
margin-right: 0;
}
.hotel-list-search .search-box .date view{
margin-right: 10rpx;
}
.hotel-list-search .search-box .days {
height: 40rpx;
padding: 0 19rpx 0 0;
color: #757776;
border-right: 1px solid #E2E2E2;
font-size: 22rpx;
position: relative;
top: 2rpx;
}
.hotel-rate-box {
display: flex;
align-items: center;
flex-wrap: wrap;
padding-left: 33rpx;
padding-right: 15rpx;
}
.hotel-rateTetx{
width: 50%;
margin-bottom: 16rpx;
}
.hotel-rate {
width: 336rpx;
height: 70rpx;
background: #E9E4E0;
border: 2rpx solid #E9E4E0;
border-radius: 6rpx;
font-size: 26rpx;
color: #080A09;
line-height: 62rpx;
margin-right: 15rpx;
text-align: center;
}
.hotel-rate:last-child {
margin-right: 0;
}
.hotel-rate.active {
color: #B99846;
border: 2rpx solid #B99846;
}
/deep/.search-box .u-input{
font-size: 24rpx;
}
.hotelMapIcon{
padding: 0 32rpx 0 20rpx;
font-size: 24rpx;
}
.hotelMapIcon text{
margin-top: 12rpx;
}
.hotelPriceRangeBox{
flex-wrap: wrap;
padding-left: 33rpx;
padding-right: 15rpx;
}
.hotelPriceRange{
width: 33.33%;
margin-bottom: 14rpx;
}
.hotelPriceRange view{
width: 218rpx;
height: 60rpx;
line-height: 52rpx;
background: #E9E4E0;
border-radius: 6rpx;
border: 2rpx solid #E9E4E0;
text-align: center;
color: #080A09;
font-size: 24rpx;
font-weight: 500;
}
.hotelPriceRange.active view{
border: 2rpx solid #B99846;
color: #B99846;
}
.hotelRegionBox{
height: 888rpx;
}
.hotelRegionL{
width: 183rpx;
}
.hotelRegionLText{
height: 78rpx;
line-height: 70rpx;
font-weight: bold;
font-size: 28rpx;
color: #080A09 ;
}
.hotelRegionLText.active{
background: #F3F1EF;
color: #B99846;
}
.hotelPopular{
width: 8rpx;
height: 8rpx;
background: #FF3166;
border-radius: 50%;
margin-right: 10rpx;
}
.hotelRegionR{
width: 1px;
flex: 1;
background: #F3F1EF;
padding: 0 46rpx;
}
.hotelRegionRText{
height: 78rpx;
line-height: 70rpx;
justify-content: space-between;
}
.hotelRegionRText text{
font-size: 28rpx;
color: #080A09;
font-weight: 500;
}
.hotelRegionRText.active{
color: #B99846;
font-weight: bold;
}
.hotelRegionRText img{
width: 28rpx;
height: 28rpx;
display: block;
}
.hotelRegionRTBox{
flex-wrap: wrap;
}
.hotelRegionRTBox .hotelRegionRText{
width: 50%;
overflow: hidden;
padding-right: 32rpx;
}
.hotelRegionRTBox .hotelRegionRText text{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.hotelRegionRTBox .hotelRegionRText:nth-child(2n){
padding-left: 32rpx;
padding-right: 0;
}
.hotelComprehensiveBox{
padding: 0 30rpx;
}
.hotelComprehensiv{
height: 78rpx;
line-height: 70rpx;
font-size: 28rpx;
color: #080A09;
justify-content: space-between;
}
.hotelComprehensiv.active{
color: #B99846;
font-weight: bold;
}
.hotelComprehensiv img{
width: 28rpx;
height: 28rpx;
display: block;
}
</style>
...@@ -14,11 +14,15 @@ ...@@ -14,11 +14,15 @@
<view class="days column justify-center"> <view class="days column justify-center">
</view> </view>
<view style="width: 1px; flex: 1"> <view style="width: 1px; flex: 1;position: relative;">
<u-search placeholder="城市/地标/商圈/酒店" v-model="parameters.Name" input-align="left" <u-search placeholder="酒店" v-model="parameters.KeyWords" input-align="left"
:value="parameters.Name" text-color="#111" bg-color="rgba(0,0,0,0)" @change="research()" :value="parameters.KeyWords" text-color="#111" bg-color="rgba(0,0,0,0)"
:show-action="false" :show-action="false"
disabled
style="font-size: 22rpx;"></u-search> style="font-size: 22rpx;"></u-search>
<view class="clickSearch" @click="clickSearchCity()">
<view>0</view>
</view>
</view> </view>
</view> </view>
<view class="hotelMapIcon column" v-if="isMap" @click="goMapHotel"> <view class="hotelMapIcon column" v-if="isMap" @click="goMapHotel">
...@@ -28,13 +32,12 @@ ...@@ -28,13 +32,12 @@
</view> </view>
</view> </view>
<u-dropdown ref="uDropdown" <u-dropdown ref="uDropdown"
@open="open" @close="close"
active-color="#B99846" active-color="#B99846"
inactive-color="#080A09" inactive-color="#080A09"
title-size="28" title-size="28"
> >
<u-dropdown-item <u-dropdown-item
v-model="parameters.OrderByType" v-model="parameters.QOrderBy"
:title="optionsTitle[0]" :title="optionsTitle[0]"
:options="options1"> :options="options1">
<view <view
...@@ -43,44 +46,59 @@ ...@@ -43,44 +46,59 @@
> >
<view class="hotelComprehensiv row items-center" <view class="hotelComprehensiv row items-center"
v-for="(item,index) in options1" :key="index" v-for="(item,index) in options1" :key="index"
:class="[parameters.OrderByType==item.value?'active':'']" :class="[parameters.QOrderBy==item.value?'active':'']"
@click="ComSorting(item)"> @click="ComSorting(item)">
<text>{{ item.label }}</text> <text>{{ item.label }}</text>
<view v-if="parameters.OrderByType==item.value"> <view v-if="parameters.QOrderBy==item.value">
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638760948784111958.png"/> <img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638760948784111958.png"/>
</view> </view>
</view> </view>
</view> </view>
</u-dropdown-item> </u-dropdown-item>
<u-dropdown-item v-model="parameters.District" <u-dropdown-item
:title="optionsTitle[1]" :title="optionsTitle[1]"
:options="DistrictOptions"> :options="cityList">
<view <view
class="slot-content hotelRegionBox column" class="slot-content hotelRegionBox column"
style="background-color: #E9E4E0" style="background-color: #E9E4E0"
> >
<view class="internationalSearch">
<u-search placeholder="搜索区域中文或拼音"
input-align="left"
v-model="regionKeyWords"
:value="regionKeyWords"
text-color="#111"
bg-color="rgba(0,0,0,0)"
:show-action="false"
style="font-size: 22rpx;"
@change="FilterArea"></u-search>
</view>
<view class="row" style="height: 1px;flex: 1;"> <view class="row" style="height: 1px;flex: 1;">
<view class="hotelRegionL"> <!--<view class="hotelRegionL">
<scroll-view :scroll-y="true" style="height: 100%;"> <scroll-view :scroll-y="true" style="height: 100%;">
<view class="hotelRegionLText row items-center justify-center" <view class="hotelRegionLText row items-center justify-center"
:class="[parameters.City==item.ID?'active':'']" :class="[parameters.CityCode2==item.CityCode?'active':'']"
v-for="(item,index) in cityListAll" :key="index" v-for="(item,index) in cityList" :key="index"
@click="confirmCity(item)"> @click="confirmCity(item)">
<!-- <view class="hotelPopular"></view> --> <view class="hotelPopular"></view>
<text>{{ item.Name }}</text> <text>{{ item.CityName }}</text>
</view> </view>
</scroll-view> </scroll-view>
</view> </view>-->
<view class="hotelRegionR"> <view class="hotelRegionR">
<scroll-view :scroll-y="true" style="height: 100%;"> <scroll-view :scroll-y="true" style="height: 100%;">
<view class="hotelRegionRText row items-center" <template v-if="regionList.length>0">
v-for="(item,index) in DistrictOptions" :key="index" <view class="hotelRegionRText row items-center"
@click="changeDistrict(item)"> v-for="(item,index) in regionList" :key="index"
<text>{{ item.Name }}</text> @click="changeDistrict(item)">
<view v-if="parameters.District==item.ID"> <text>{{ item.CityName_CN }}</text>
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638760948784111958.png"/> <view v-if="parameters.regionCode==item.CityCode">
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638760948784111958.png"/>
</view>
</view> </view>
</view> </template>
<u-empty v-else text="暂无区域相关数据" mode="data" padding-top="30" color="#000"></u-empty>
</scroll-view> </scroll-view>
</view> </view>
</view> </view>
...@@ -109,7 +127,7 @@ ...@@ -109,7 +127,7 @@
</view> </view>
</view> </view>
</u-dropdown-item> </u-dropdown-item>
<u-dropdown-item v-model="parameters.enclosure" :title="optionsTitle[2]" > <u-dropdown-item :title="optionsTitle[2]" >
<view <view
class="slot-content" class="slot-content"
style="padding: 30rpx 0; background-color: #F3F1EF" style="padding: 30rpx 0; background-color: #F3F1EF"
...@@ -135,7 +153,7 @@ ...@@ -135,7 +153,7 @@
margin-top: 34rpx; margin-top: 34rpx;
" "
> >
<view style="font-size: 24rpx; flex: 1">0</view> <view style="font-size: 24rpx; flex: 1">{{ parameters.StartPrice }}</view>
<view <view
style=" style="
font-size: 24rpx; font-size: 24rpx;
...@@ -143,7 +161,7 @@ ...@@ -143,7 +161,7 @@
color: #757776; color: #757776;
text-align: right; text-align: right;
" "
>¥850以上</view >{{ tempRateAndPrice.priceText }}</view
> >
</view> </view>
<range-slider <range-slider
...@@ -156,8 +174,8 @@ ...@@ -156,8 +174,8 @@
:block-size="40" :block-size="40"
bar-height="12" bar-height="12"
active-color="#E2C27A" active-color="#E2C27A"
min="0" min="100"
max="850" :max="MaximumDatas.maxPrice"
@rangechange="rangechange" @rangechange="rangechange"
:values="tempRateAndPrice.price" :values="tempRateAndPrice.price"
></range-slider> ></range-slider>
...@@ -166,7 +184,7 @@ ...@@ -166,7 +184,7 @@
<view class="hotelPriceRange" <view class="hotelPriceRange"
v-for="(item,index) in PriceRange" v-for="(item,index) in PriceRange"
:key="index" :key="index"
:class="[tempRateAndPrice.priceText==item.Name?'active':'']" :class="[tempRateAndPrice.priceId==index+1?'active':'']"
@click="changePrice(item)"> @click="changePrice(item)">
<view> <view>
{{ item.Name }} {{ item.Name }}
...@@ -214,70 +232,17 @@ ...@@ -214,70 +232,17 @@
</view> </view>
</view> </view>
</u-dropdown-item> </u-dropdown-item>
<u-dropdown-item :title="optionsTitle[3]">
<view
class="slot-content hotelRegionBox column"
style="background-color: #E9E4E0"
>
<view class="row" style="height: 1px;flex: 1;">
<view class="hotelRegionL">
<scroll-view :scroll-y="true" style="height: 100%;">
<view class="hotelRegionLText row items-center justify-center"
:class="[index==0?'active':'']"
v-for="(item,index) in DistrictOptions" :key="index"
@click="changeLabel(item)">
<!-- <view class="hotelPopular"></view> -->
<text>{{ item.Name }}</text>
</view>
</scroll-view>
</view>
<view class="hotelRegionR">
<scroll-view :scroll-y="true" style="height: 100%;">
<view class="hotelRegionRTBox row">
<view class="hotelRegionRText row items-center"
:class="[index==0?'active':'']"
v-for="(item,index) in options2" :key="index"
@click="changeSubtags(item)">
<text>{{ item.label }}</text>
<view>
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638760948784111958.png"/>
</view>
</view>
</view>
</scroll-view>
</view>
</view>
<view style="padding: 0 30rpx;box-shadow: 0rpx 1rpx 8rpx 0rpx rgba(185,152,70,0.25);background: #F3F1EF;">
<view
style="
box-shadow: 0px -10px 30px 0px rgba(36, 36, 36, 0.06);
margin-top: 40rpx;
margin-bottom: 40rpx;
display: flex;
"
>
<view style="flex: 1; margin-right: 30rpx">
<u-button :custom-style="btnStyle" @click="resetFilter"
>清空</u-button
>
</view>
<view style="flex: 1">
<u-button :custom-style="btnStyle2" @click="sureFilter"
>完成</u-button
>
</view>
</view>
</view>
</view>
</u-dropdown-item>
</u-dropdown> </u-dropdown>
<u-popup v-model="showCityList" mode="bottom" :border-radius="40" :safe-area-inset-bottom="true"> <u-popup v-model="showCityList" mode="bottom" :border-radius="40" length="75%"
<Address @confirm="confirmCity" :list="cityList" /> :mask-close-able="false">
</u-popup> <destination :msg="parameters"
@sure="sureAddress"
@searchCity="clickSearchCity"
:PopularCities="PopularCities"></destination>
</u-popup>
<u-popup v-model="showTimePopup" <u-popup v-model="showTimePopup"
mode="bottom" border-radius="20" length="75%" :safe-area-inset-bottom="true"> mode="bottom" border-radius="20" length="75%" :safe-area-inset-bottom="true">
<view style=" <view style="
...@@ -339,6 +304,11 @@ ...@@ -339,6 +304,11 @@
</view> </view>
</view> </view>
</u-popup> </u-popup>
<u-popup v-model="showSearchCity" mode="Right" length="100%">
<searchCity :type="SearchCityType" @searchKey="searchKey"
@searchClose="searchClose"></searchCity>
</u-popup>
</view> </view>
</template> </template>
...@@ -346,31 +316,46 @@ ...@@ -346,31 +316,46 @@
import rangeSlider from "./range-slider.vue"; import rangeSlider from "./range-slider.vue";
import canlendar from "./time/index"; import canlendar from "./time/index";
import hotelGood from "./hotel-good.vue"; import hotelGood from "./hotel-good.vue";
import Address from "./address/smh-address-indexed.vue"; import destination from "./address/index.vue";
import searchCity from "./address/searchCity.vue";
export default { export default {
props:['isMap'], components: {
rangeSlider,
canlendar,
hotelGood,
destination,
searchCity
},
props:['isMap','msg'],
data() { data() {
return { return {
city: "成都", city: "成都",
cityList: [], cityList: [],
cityListAll: [], PopularCities: [],
showCityList: false, showCityList: false,
showTimePopup: false, showTimePopup: false,
parameters: { parameters: {
Name: "", //关键字 KeyWords: "", //关键字
StartPrice: 0, StartPrice: 100,
EndPrice: 1000, EndPrice: 0,
QStartDate: "", QOrderBy: "1", //排序类型
QEndDate: "", QStarRating: [], //星级
OrderByType: "1", //排序类型 GName: '', //热门
QStars: "", //星级 CityCode: '',//目的地代码
City: 0, //市262 CityName: '',//目的地
District: 0, //区 CityCode2: '',//目的地代码
regionCode: '',//区域
// QStartDate: "",//开始日期
// QEndDate: "",//结束日期
// District: 0, //区
rooms: 1, rooms: 1,
adultsNumber:2, adultsNumber:2,
childrenNumberZC:0, childrenNumberZC:0,
childrenNumberBZC:0, childrenNumberBZC:0,
peoples: 2, peoples: 2,
interCurrent: 0,
}, },
day: 0, day: 0,
startDay: "", startDay: "",
...@@ -378,49 +363,14 @@ ...@@ -378,49 +363,14 @@
HotelList: [], //酒店数据 HotelList: [], //酒店数据
tempRateAndPrice: { tempRateAndPrice: {
price: [], price: [],
priceText: "¥850以上", priceText: "",
rate: [], rate: [],
priceId: 0,
}, },
optionsTitle: ["综合排序", "位置区域", "价格/星级", "筛选"], MaximumDatas: null,
optionsTitle: ["综合排序", "位置区域", "价格/星级"],
rates: [], rates: [],
options1: [], //推荐排序数据 options1: [], //推荐排序数据
options2: [{
label: "不限",
value: -1,
},
{
label: "宝镜岩",
value: 1,
},
{
label: "盆景滩",
value: 2,
},
{
label: "芦苇海",
value: 3,
},
{
label: "五彩池",
value: 4,
},
{
label: "镜海",
value: 5,
},
{
label: "犀牛海",
value: 6,
},
{
label: "诺日朗瀑布",
value: 7,
},
{
label: "火花海",
value: 8,
},
],
btnStyle: { btnStyle: {
borderRadius: "16rpx", borderRadius: "16rpx",
color: "#111", color: "#111",
...@@ -437,35 +387,28 @@ ...@@ -437,35 +387,28 @@
background: "#111", background: "#111",
}, },
dayObj: {}, dayObj: {},
DistrictOptions: [{
label: "不限",
value: 0
}],
showDialog: false, showDialog: false,
PriceRange:[ PriceRange:[],
{Name: '¥150以下',minPrice: 0,maxPrice: 150},
{Name: '¥150-250',minPrice: 150,maxPrice: 250},
{Name: '¥250-300',minPrice: 250,maxPrice: 300},
{Name: '¥300-350',minPrice: 300,maxPrice: 350},
{Name: '¥350-500',minPrice: 350,maxPrice: 500},
{Name: '¥500-650',minPrice: 500,maxPrice: 650},
{Name: '¥650-850',minPrice: 650,maxPrice: 850},
{Name: '¥850以上',minPrice: 850,maxPrice: 0},
],
mc: '', mc: '',
showSearchCity: false,
SearchCityType: '',// city地区查询 酒店查询
regionListAll: [],//区域
regionList: [],//区域
regionKeyWords: '',
}; };
}, },
components: { watch:{
rangeSlider, msg: {
canlendar, handler (val, oldval) {
hotelGood, if(val){
Address, this.parameters.KeyWords = val.KeyWords
}
},
deep: true,
}
}, },
onLoad(options) { onLoad(options) {
this.mc = this.$uiConfig.mainColor;
if (options && options.Name) {
this.parameters.Name = options.Name;
}
}, },
created() { created() {
uni.setNavigationBarTitle({ uni.setNavigationBarTitle({
...@@ -497,10 +440,72 @@ ...@@ -497,10 +440,72 @@
this.startDay = obj.startDay; this.startDay = obj.startDay;
this.endDay = obj.endDay; this.endDay = obj.endDay;
this.day = obj.day; this.day = obj.day;
this.getCity(); this.getCity()
this.getSearchCondition() this.getSearchCondition()
// this.getLocation()
}, },
methods: { methods: {
FilterArea(){
if(this.regionKeyWords!=''){
this.regionList = this.regionListAll.filter((item)=>{
return item.CityName_CN.toLowerCase().includes(this.regionKeyWords.toLowerCase())
})
}else{
this.regionList = this.regionListAll
}
},
searchClose(){
this.showSearchCity = false
this.showCityList = false
},
searchKey(type,key,City){
if(type==1){
this.parameters.KeyWords = key
this.parameters.hotelId = null
this.parameters.GName = this.PopularCities[0].GName
this.parameters.CityCode = this.PopularCities[0].CityList[0].CityCode
this.city = this.parameters.CityName = this.PopularCities[0].CityList[0].CityName
}else if(type==2){
this.parameters.KeyWords = null
this.parameters.hotelId = key
this.parameters.GName = this.PopularCities[0].GName
this.parameters.CityCode = this.PopularCities[0].CityList[0].CityCode
this.city = this.parameters.CityName = this.PopularCities[0].CityList[0].CityName
}else if(type==3){
this.parameters.KeyWords = null
this.parameters.hotelId = null
this.parameters.CityCode = key
this.city = this.parameters.CityName = City
}
this.searchClose()
this.research()
},
clickSearchCity(type){
this.SearchCityType = type?type:null
this.showSearchCity = true
},
getLocation(){
uni.getLocation({
type: 'wgs84',
success(res) {
console.log(res);
console.log('经纬度:', res.latitude, res.longitude);
},
fail(err) {
console.log(err,'err');
}
});
},
sureAddress(msg){
this.showCityList = false;
if(this.parameters.CityCode2!=msg.CityCode2){
this.parameters.GName = msg.GName
this.parameters.CityCode2 = msg.CityCode2
this.getRegion()
this.city = this.parameters.CityName = msg.CityName
this.research()
}
},
etChange(e){ etChange(e){
this.parameters.childrenNumberZC = e.value; this.parameters.childrenNumberZC = e.value;
this.peopleChange() this.peopleChange()
...@@ -512,72 +517,51 @@ ...@@ -512,72 +517,51 @@
peopleChange(){ peopleChange(){
this.parameters.peoples = this.parameters.adultsNumber + this.parameters.childrenNumberZC this.parameters.peoples = this.parameters.adultsNumber + this.parameters.childrenNumberZC
console.log(this.parameters.peoples,'人数') console.log(this.parameters.peoples,'人数')
this.$emit('change',this.parameters);
}, },
// 筛选排序 // 筛选排序
sureFilter(){ sureFilter(){
this.$forceUpdate(); this.$forceUpdate();
this.closeDropdown(); this.closeDropdown();
this.$emit('change',this.parameters); this.research();
}, },
resetFilter(){ resetFilter(){
this.closeDropdown() this.closeDropdown()
this.$emit('change',this.parameters); this.research();
},
changeLabel(item){
},
changeSubtags(item){
}, },
// 位置排序 // 位置排序
sureRegion(){ sureRegion(){
this.$forceUpdate(); this.$forceUpdate();
this.closeDropdown(); this.closeDropdown();
this.$emit('change',this.parameters); this.city = this.parameters.CityName
this.parameters.CityCode = this.parameters.regionCode?this.parameters.regionCode:this.parameters.CityCode2
this.research();
}, },
resetRegion(){ resetRegion(){
this.parameters.City = 0;
this.parameters.District = 0;
this.closeDropdown() this.closeDropdown()
this.$emit('change',this.parameters); this.parameters.regionCode = ''
if(this.parameters.CityCode!=this.parameters.CityCode2){
this.parameters.CityCode = this.parameters.CityCode2
this.research();
}
}, },
showCity() { showCity() {
this.showCityList = true; this.showCityList = true;
}, },
confirmCity(val) { confirmCity(val) {
this.parameters.City = val.ID; this.City = this.parameters.CityName = val.CityName;
this.showCityList = false; if(this.parameters.CityCode2!= val.CityCode){
this.city = val.Name; this.parameters.CityCode2 = val.CityCode;
this.getDistrict(val.ID); this.getRegion()
// this.getDistrict(); }
this.parameters.District = 0;
// this.optionsTitle[1] = "区域";
console.log(区域,'----位置');
}, },
changeDistrict(item) { changeDistrict(item) {
this.parameters.District = item.ID this.parameters.regionCode = item.CityCode
// this.optionsTitle[1] = item.Name;
}, },
// 价格排序 // 价格排序
surePrice() { surePrice() {
let result = ""; this.parameters.QStarRating = this.tempRateAndPrice.rate
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;
}
result = result == "" ? "价格/星级" : result;
// this.optionsTitle[2] = result;
this.parameters.QStars = this.tempRateAndPrice.rate.toString()
this.$forceUpdate();
this.closeDropdown(); this.closeDropdown();
this.$emit('change',this.parameters); this.research();
}, },
resetPrice() { resetPrice() {
this.optionsTitle[2] = "价格/星级"; this.optionsTitle[2] = "价格/星级";
...@@ -586,47 +570,42 @@ ...@@ -586,47 +570,42 @@
obj.progressBarWidth = obj._getMaxLength(); obj.progressBarWidth = obj._getMaxLength();
obj.minBlockLeft = 0; obj.minBlockLeft = 0;
obj.maxBlockLeft = obj._getMaxLength(); obj.maxBlockLeft = obj._getMaxLength();
this.tempRateAndPrice.priceId = 0
this.tempRateAndPrice = { this.tempRateAndPrice = {
price: { price: {
minValue: 0, minValue: 0,
maxValue: 850, maxValue: this.MaximumDatas.maxPrice,
}, },
priceText: "¥850以上", priceText: `¥${this.PriceRange[0].minPrice}~${this.MaximumDatas.maxPrice}`,
rate: [], rate: [],
}; };
this.parameters.StartPrice = this.PriceRange[0].minPrice;
this.parameters.EndPrice = this.MaximumDatas.maxPrice;
this.parameters.QStarRating = []
this.closeDropdown(); this.closeDropdown();
this.parameters.StartPrice = 0; this.research();
this.parameters.EndPrice = 850;
this.parameters.QStars = ""
this.$emit('change',this.parameters);
}, },
rangechange(e) { rangechange(e,option,type) {
let PriceList = this.PriceRange.filter(item => item.minPrice <= e.maxValue) this.parameters.StartPrice = e.minValue
let minPrice = Math.max(...PriceList.map(item => item.minPrice)) this.parameters.EndPrice = e.maxValue
let maxPrice = Math.max(...PriceList.map(item => item.maxPrice)) this.tempRateAndPrice.priceText = `¥${e.minValue}~${e.maxValue}`;
if(minPrice>=0){ this.tempRateAndPrice.price = [this.parameters.StartPrice,this.parameters.EndPrice]
if(minPrice==0) this.tempRateAndPrice.priceText = `¥${maxPrice}以下`;
else if(minPrice==850) this.tempRateAndPrice.priceText = `¥${maxPrice}以上`;
else this.tempRateAndPrice.priceText = `¥${minPrice}-${maxPrice}`;
this.parameters.StartPrice = e.minPrice;
this.parameters.EndPrice = e.maxPrice;
}
}, },
changePrice(item) { changePrice(item) {
this.parameters.StartPrice = item.minPrice; this.parameters.StartPrice = item.minPrice?item.minPrice:100;
this.parameters.EndPrice = item.maxPrice; this.parameters.EndPrice = item.maxPrice;
this.tempRateAndPrice.priceText = item.Name; this.tempRateAndPrice.priceText = item.Name;
if(item.minPrice>0&&item.maxPrice>0)this.tempRateAndPrice.price = [0,item.maxPrice] this.tempRateAndPrice.price = [item.minPrice?item.minPrice:100,item.maxPrice]
else if(item.minPrice==0) this.tempRateAndPrice.price = [0,item.maxPrice] this.tempRateAndPrice.priceId = item.priceId
else if(item.maxPrice==0) this.tempRateAndPrice.price = [item.minPrice,850]
}, },
ComSorting(item) { ComSorting(item) {
this.parameters.OrderByType = item.value this.parameters.QOrderBy = item.value
this.optionsTitle[0] = item.label; this.optionsTitle[0] = item.label;
setTimeout(() => { setTimeout(() => {
this.closeDropdown() this.closeDropdown()
}, 300); }, 300);
this.$emit('change',this.parameters); this.research();
}, },
// 星际级 // 星际级
setHotelRate(rateId) { setHotelRate(rateId) {
...@@ -642,122 +621,92 @@ ...@@ -642,122 +621,92 @@
this.showTimePopup = true; this.showTimePopup = true;
}, },
chosenDateResult(obj) { chosenDateResult(obj) {
this.parameters.QStartDate = obj.start; // this.parameters.QStartDate = obj.start;
this.parameters.QEndDate = obj.end; // this.parameters.QEndDate = obj.end;
this.startDay = obj.startDay; this.startDay = obj.startDay;
this.endDay = obj.endDay; this.endDay = obj.endDay;
this.day = obj.day; this.day = obj.day;
this.dayObj = obj; this.dayObj = obj;
this.$emit('change',this.parameters);
this.showTimePopup = false; this.showTimePopup = false;
this.research();
}, },
closeDropdown() { closeDropdown() {
this.$refs.uDropdown.close(); this.$refs.uDropdown.close();
}, },
open(index) {
// 展开某个下来菜单时,先关闭原来的其他菜单的高亮
// 同时内部会自动给当前展开项进行高亮
this.$refs.uDropdown.highlight();
if (index == 2) {
// this.tempRateAndPrice = this.parameters.rateAndPrice
}
},
close(index) {
// 关闭的时候,给当前项加上高亮
// 当然,您也可以通过监听dropdown-item的@change事件进行处理
this.$refs.uDropdown.highlight(index);
},
research() { research() {
this.$emit('change',this.parameters); this.$emit('change',this.parameters);
}, },
//获取查询条件 //获取查询条件
getSearchCondition() { getSearchCondition() {
this.request2({ this.apipost('dmc_post_B2BAndB2CDiDaHotelQueryCondition',{},(res)=>{
url: "/api/Hotel/GetHotelQuery", if(res.resultCode==1){
data: {}, this.options1 = [];
}, this.PriceRange = []
(res) => { let tempObj = res.data;
if (res.resultCode == 1) { if (tempObj && tempObj.OrderByList.length > 0) {
let tempObj = res.data; tempObj.OrderByList.forEach((x) => {
this.options1 = []; let obj = {
this.rates = []; label: x.Name,
if (tempObj && tempObj.OrderByList.length > 0) { value: x.Id,
tempObj.OrderByList.forEach((x) => { };
let obj = { this.options1.push(obj);
label: x.Name, });
value: x.Id,
};
this.options1.push(obj);
});
}
if (tempObj && tempObj.StarList) {
this.rates = tempObj.StarList;
}
} }
}, if (tempObj && tempObj.StarRatingList) {
(err) => {} this.rates = tempObj.StarRatingList;
); }
if (tempObj && tempObj.PriceList) {
tempObj.PriceList.forEach((x,i) => {
let obj = {
Name: `¥${x.Name}`,
minPrice: x.MinPrice,
maxPrice: x.MaxPrice,
priceId: i+1,
};
this.PriceRange.push(obj);
});
this.parameters.StartPrice = this.PriceRange[0].minPrice?this.PriceRange[0].minPrice:100;
this.MaximumDatas = this.PriceRange[this.PriceRange.length-1]
let temp = tempObj.PriceList[tempObj.PriceList.length-1]
this.parameters.EndPrice = temp.MaxPrice
this.tempRateAndPrice.priceText = `¥${temp.MaxPrice}`;
}
}
},(err)=>{
})
}, },
// 城市 // 城市
getCity() { getCity() {
this.request2({ this.apipost('dmc_post_B2BAndB2CGetHotCity',{},
url: "/api/Hotel/GetHotelDestination",
data: {
ID: 0
},
},
(res) => { (res) => {
if (res.resultCode == 1) { if (res.resultCode == 1) {
this.cityListAll = res.data this.PopularCities = res.data
// let obj = { this.parameters.GName = this.PopularCities[0].GName
// Name: "不限", this.cityList = this.PopularCities[0].CityList
// ID: 0 this.parameters.GName = this.PopularCities[0].GName
// } this.parameters.CityCode = this.PopularCities[0].CityList[0].CityCode
// this.cityListAll.unshift(obj) this.parameters.CityCode2 = this.PopularCities[0].CityList[0].CityCode
this.cityList = []; this.city = this.parameters.CityName = this.PopularCities[0].CityList[0].CityName
res.data.map((i) => { this.getRegion()
let initial = i.PinYin.slice(0, 1); this.research()
let find = this.cityList.filter((e) => {
return e.letter == initial;
});
if (find.length > 0) {
find[0].citylist.push(i);
} else {
let obj = {
letter: initial,
citylist: [i],
};
// obj.citylist[0]=i
this.cityList.push(obj);
}
});
console.log(this.cityList,'---')
this.parameters.City = this.cityListAll[0].ID
this.getDistrict(this.parameters.City)
} }
}, },
(err) => {} (err) => {}
); );
}, },
// 区 // 区域
getDistrict(id) { getRegion() {
this.request2({ this.parameters.regionCode = ''
url: "/api/Hotel/GetHotelDestination", this.apipost('dmc_post_GetDestinationByCityCode',{
data: { CityCode: this.parameters.CityCode2
ID: id },
},
},
(res) => { (res) => {
if (res.resultCode == 1) { if (res.resultCode == 1) {
this.DistrictOptions = res.data this.regionListAll = res.data
// let obj = { this.regionList = res.data
// Name: "不限",
// ID: 0
// }
// this.DistrictOptions.unshift(obj)
console.log(this.DistrictOptions,'---111')
} }
}, },
(err) => {} (err) => {}
...@@ -983,4 +932,18 @@ ...@@ -983,4 +932,18 @@
height: 28rpx; height: 28rpx;
display: block; display: block;
} }
.clickSearch{
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 3;
}
.clickSearch view{
opacity: 0;
}
.internationalSearch{
padding: 0 30rpx;
}
</style> </style>
...@@ -2,8 +2,8 @@ ...@@ -2,8 +2,8 @@
<view class="hotel-list column" style="background: #F3F1EF;"> <view class="hotel-list column" style="background: #F3F1EF;">
<view class="hotel-listHeader"> <view class="hotel-listHeader">
<hotelHeaders :title="pageTitle"></hotelHeaders> <hotelHeaders :title="pageTitle"></hotelHeaders>
<hotelSearch :isMap="1" @change="change"></hotelSearch> <hotelSearch :msg="searchObj" :isMap="1" @change="change"></hotelSearch>
<view style="padding: 9rpx 30rpx 19rpx 30rpx;"> <!-- <view style="padding: 9rpx 30rpx 19rpx 30rpx;">
<scroll-view :scroll-x="true"> <scroll-view :scroll-x="true">
<view class="ComprehensiveSortings row"> <view class="ComprehensiveSortings row">
<view v-for="(item,index) in searchObj.TagList" :key="index" <view v-for="(item,index) in searchObj.TagList" :key="index"
...@@ -13,10 +13,10 @@ ...@@ -13,10 +13,10 @@
</view> </view>
</view> </view>
</scroll-view> </scroll-view>
</view> </view> -->
</view> </view>
<view style="height: 1px;flex: 1;overflow: hidden;"> <view style="height: 1px;flex: 1;overflow: hidden;">
<view class="no-data" v-if="HotelList.length === 0"> <view class="no-data" v-if="HotelList.length === 0" style="margin-top: 200rpx;">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/no-data.png" <image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/no-data.png"
mode="aspectFit" class="no-data-img"></image> mode="aspectFit" class="no-data-img"></image>
<view class="zhanwu"> 暂无数据 </view> <view class="zhanwu"> 暂无数据 </view>
...@@ -54,14 +54,14 @@ ...@@ -54,14 +54,14 @@
searchObj: { searchObj: {
pageIndex: 1, pageIndex: 1,
pageSize: 15, pageSize: 15,
Name: "", //关键字 KeyWords: "", //关键字
// StartPrice: 0, // StartPrice: 0,
// EndPrice: 1000, // EndPrice: 1000,
QStartDate: "", // QStartDate: "",//开始日期
QEndDate: "", // QEndDate: "",//结束日期
// OrderByType: "1", //排序类型 // OrderByType: "1", //排序类型
// QStars: "", //星级 // QStars: "", //星级
TagList: [], //查询标签 // TagList: [], //查询标签
// City: 262, //市 // City: 262, //市
// District: 0, //区 // District: 0, //区
}, },
...@@ -99,9 +99,9 @@ ...@@ -99,9 +99,9 @@
hotelSearch, hotelSearch,
}, },
onLoad(options) { onLoad(options) {
this.mc = this.$uiConfig.mainColor; this.apimc = this.$uiConfig.mainColor;
if (options && options.Name) { if (options && options.Name) {
this.searchObj.Name = options.Name; this.searchObj.KeyWords = options.KeyWords;
} }
}, },
created() { created() {
...@@ -136,13 +136,13 @@ ...@@ -136,13 +136,13 @@
key: "Time", key: "Time",
data: JSON.stringify(obj), data: JSON.stringify(obj),
}); });
this.searchObj.QStartDate = obj.start; // this.searchObj.QStartDate = obj.start;
this.searchObj.QEndDate = obj.end; // this.searchObj.QEndDate = obj.end;
this.startDay = obj.startDay; this.startDay = obj.startDay;
this.endDay = obj.endDay; this.endDay = obj.endDay;
this.day = obj.day; this.day = obj.day;
this.getSearchCondition(); this.getSearchCondition();
this.getList(); // this.getList();
}, },
methods: { methods: {
scroll(e) { scroll(e) {
...@@ -171,7 +171,6 @@ ...@@ -171,7 +171,6 @@
this.research(); this.research();
}, },
change(item) { change(item) {
console.log(item,'-----searchObj');
this.searchObj ={ this.searchObj ={
...this.searchObj, ...this.searchObj,
...item, ...item,
...@@ -197,25 +196,30 @@ ...@@ -197,25 +196,30 @@
}, },
//获取列表数据 //获取列表数据
getList(type) { getList(type) {
this.searchObj.QStars = this.tempRateAndPrice.rate.toString(); uni.showLoading({
title: "加载中",
});
// this.searchObj.QStars = this.tempRateAndPrice.rate.toString();
if (type == 1) { if (type == 1) {
this.HotelList = []; this.HotelList = [];
} }
this.request2({ this.apipost('dmc_post_B2BAndB2CGetDidaHotelPage',this.searchObj,
url: "/api/Hotel/AppGetHotelPage",
data: this.searchObj,
},
(res) => { (res) => {
if (res.resultCode == 1) { if (res.resultCode == 1) {
uni.hideLoading();
if (this.searchObj.pageIndex === 1) { if (this.searchObj.pageIndex === 1) {
this.HotelList = res.data.pageData; this.HotelList = res.data.pageData;
} else { } else {
this.HotelList = this.HotelList.concat(res.data.pageData); this.HotelList = this.HotelList.concat(res.data.pageData);
} }
this.page_count = res.data.pageCount; this.page_count = res.data.pageCount;
} }
},(err)=>{
uni.hideLoading();
uni.showToast({
title: err.message,
icon: 'none',
})
} }
); );
}, },
...@@ -242,6 +246,7 @@ ...@@ -242,6 +246,7 @@
.hotel-list { .hotel-list {
height: 100vh; height: 100vh;
overflow: hidden;
} }
.hotel-list .hotel-city { .hotel-list .hotel-city {
...@@ -409,5 +414,11 @@ ...@@ -409,5 +414,11 @@
/deep/.hotel-listHeader .u-flex{ /deep/.hotel-listHeader .u-flex{
justify-content: flex-start; justify-content: flex-start;
} }
/deep/.u-dropdown__menu__item:first-child{
padding-left: 40rpx;
}
/deep/.u-dropdown__menu__item:last-child{
padding-right: 40rpx;
}
</style> </style>
...@@ -70,7 +70,7 @@ ...@@ -70,7 +70,7 @@
b2b_user_info.contactNumber = param.Moblie b2b_user_info.contactNumber = param.Moblie
uni.setStorageSync('b2b_user', b2b_user_info); uni.setStorageSync('b2b_user', b2b_user_info);
uni.redirectTo({ uni.redirectTo({
url: '/pages/user-center/user-center' url: '/pages/user-center/userVip-center'
}) })
} else { } else {
this.loginLoading = false; this.loginLoading = false;
......
...@@ -72,7 +72,7 @@ ...@@ -72,7 +72,7 @@
}) })
setTimeout(()=>{ setTimeout(()=>{
uni.redirectTo({ uni.redirectTo({
url:'/pages/user-center/user-center' url:'/pages/user-center/userVip-center'
}) })
},1000) },1000)
} }
......
...@@ -527,7 +527,7 @@ ...@@ -527,7 +527,7 @@
//返回个人中心 //返回个人中心
finish() { finish() {
uni.navigateTo({ uni.navigateTo({
url: "/pages/user-center/user-center" url: "/pages/user-center/userVip-center"
}) })
}, },
//下一步 //下一步
......
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