Skip to content

J
jz_Travel
Commit 04bd4889 authored by 黄奎's avatar 黄奎
Browse files
Options

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

parents baf7f746 5c894c67
Hide whitespace changes
Inline Side-by-side
Showing with 609 additions and 646 deletions
pages/hotel/list.vue
View file @ 04bd4889
<template>
<view class="hotel-list">
<view class="search-box">
<view class="hotel-city" @click="showCity">
<u-icon
name="location"
:size="24"
color="#000000"
style="margin-right: 8rpx"
></u-icon>
{{ city }}
</view>
<view class="hotel-list">
<view class="search-box">
<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>住 {{ startDay }}</view>
<view>离 {{ endDay }}</view>
</view>
<view class="days">{{ day }}晚</view>
<view style="width: 1px; flex: 1">
<u-search
placeholder="关键字/位置/品牌/酒店名"
v-model="searchObj.Name"
input-align="left"
:value="searchObj.Name"
text-color="#111"
bg-color="rgba(0,0,0,0)"
@change="research()"
:show-action="false"
></u-search>
</view>
</view>
<u-popup
v-model="showCityList"
mode="bottom"
:border-radius="40"
:safe-area-inset-bottom="true"
>
<Address @confirm="confirmCity" :list="cityList" />
</u-popup>
<view>
<u-dropdown
ref="uDropdown"
@open="open"
@close="close"
active-color="#000"
inactive-color="#444"
>
<u-dropdown-item
v-model="searchObj.OrderByType"
:title="optionsTitle[0]"
:options="options1"
@change="change"
>
</u-dropdown-item>
<u-dropdown-item
v-model="searchObj.District"
:title="optionsTitle[1]"
:options="DistrictOptions"
@change="changeDistrict"
>
</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="date" @click="chosenDate">
<view>住 {{ startDay }}</view>
<view>离 {{ endDay }}</view>
</view>
<view class="days">{{ day }}晚</view>
<view style="width: 1px; flex: 1">
<u-search placeholder="关键字/位置/品牌/酒店名" v-model="searchObj.Name" input-align="left"
:value="searchObj.Name" text-color="#111" bg-color="rgba(0,0,0,0)" @change="research()"
:show-action="false"></u-search>
</view>
</view>
<u-popup v-model="showCityList" mode="bottom" :border-radius="40" :safe-area-inset-bottom="true">
<Address @confirm="confirmCity" :list="cityList" />
</u-popup>
<view>
<u-dropdown ref="uDropdown" @open="open" @close="close" active-color="#000" inactive-color="#444">
<u-dropdown-item v-model="searchObj.OrderByType" :title="optionsTitle[0]" :options="options1"
@change="change">
</u-dropdown-item>
<u-dropdown-item v-model="searchObj.District" :title="optionsTitle[1]" :options="DistrictOptions"
@change="changeDistrict">
<!-- <view class="slot-content" style="background-color: #FFFFFF;">
<scroll-view scroll-y="true" style="height: 200rpx;">
<view v-for="(item.in)" class="u-text-center u-content-color u-m-t-20 u-m-b-20">无言独上西楼</view>
<view class="u-text-center u-content-color u-m-t-20 u-m-b-20">月如钩</view>
<view class="u-text-center u-content-color u-m-t-20 u-m-b-20">寂寞梧桐深院锁清秋</view>
<view class="u-text-center u-content-color u-m-t-20 u-m-b-20">剪不断</view>
<view class="u-text-center u-content-color u-m-t-20 u-m-b-20">理还乱</view>
<view class="u-text-center u-content-color u-m-t-20 u-m-b-20">是离愁</view>
<view class="u-text-center u-content-color u-m-t-20 u-m-b-20">别是一般滋味在心头</view>
</scroll-view>
</view> -->
</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"
......@@ -147,19 +128,13 @@
</view>
</view>
</view>
</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">
</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 searchObj.TagList"
class="item"
......@@ -167,596 +142,584 @@
:class="{ active: x.IsCheck == 1 }"
>{{ x.Name }}</view
>
</view>
<view class="no-data" v-if="HotelList.length === 0">
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/no-data.png"
mode="aspectFit"
class="no-data-img"
></image>
<view class="zhanwu"> 暂无数据 </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"
v-if="HotelList.length > 0"
>
<hotel-good
:HotelList="HotelList"
:dayObj="dayObj"
:searchObj="searchObj"
></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>
</view>
</view> -->
<view class="no-data" v-if="HotelList.length === 0">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/no-data.png"
mode="aspectFit" class="no-data-img"></image>
<view class="zhanwu"> 暂无数据 </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"
v-if="HotelList.length > 0">
<hotel-good :HotelList="HotelList" :dayObj="dayObj" :searchObj="searchObj"></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>
</view>
</template>
<script>
import rangeSlider from "./components/range-slider.vue";
import canlendar from "./components/time/index";
import hotelGood from "./components/hotel-good.vue";
import Address from "./components/address/smh-address-indexed.vue";
export default {
data() {
return {
city: "成都",
cityList: [],
showCityList: false,
showTimePopup: false,
searchObj: {
pageIndex: 1,
pageSize: 15,
Name: "", //关键字
StartPrice: 0,
EndPrice: 1000,
QStartDate: "",
QEndDate: "",
OrderByType: "1", //排序类型
QStars: "", //星级
TagList: [], //查询标签
City: 262, //市
District: 0, //区
},
day: 0,
startDay: "",
endDay: "",
HotelList: [], //酒店数据
tempRateAndPrice: {
price: {},
priceText: "不限",
rate: [],
},
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",
},
loadText: {
loadmore: "轻轻上拉，加载更多",
loading: "努力加载中",
nomore: "没有更多商品了",
},
scrollTop: 0,
old: {
scrollTop: 0,
},
showLoading: false,
status: "loadmore",
page_count: 0,
dayObj: {},
DistrictOptions: [{ label: "不限", value: 0 }],
};
},
components: {
rangeSlider,
canlendar,
hotelGood,
Address,
},
onLoad(options) {
if (options && options.Name) {
this.searchObj.Name = options.Name;
}
},
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);
var obj = {
start: `${d1.getFullYear()}-${d1.getMonth() + 1}-${d1.getDate()}`,
end: `${d2.getFullYear()}-${d2.getMonth() + 1}-${d2.getDate()}`,
startDay: `${d1.getMonth() + 1}-${d1.getDate()}`,
endDay: `${d2.getMonth() + 1}-${d2.getDate()}`,
day: 1,
startWeek: startWeek,
endWeek: endWeek,
};
this.dayObj = obj;
uni.setStorage({
key: "Time",
data: JSON.stringify(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();
this.getCity();
this.getDistrict(262);
},
methods: {
showCity() {
this.showCityList = true;
},
confirmCity(val) {
this.searchObj.City = val.ID;
this.showCityList = false;
this.city = val.Name;
this.getDistrict(val.ID);
this.searchObj.District = 0;
this.searchObj.pageIndex = 1;
this.optionsTitle[1] = "区域";
this.getList();
},
scroll: function (e) {
this.old.scrollTop = e.detail.scrollTop;
},
goTop: function (e) {
this.scrollTop = this.old.scrollTop;
this.$nextTick(function () {
this.scrollTop = 0;
});
},
research() {
this.searchObj.pageIndex = 1;
this.getList(1);
},
lower(e) {
// TODO: 滚动到了底部，实现翻页加载
if (this.searchObj.pageIndex < this.page_count) {
this.status = "loading";
this.searchObj.pageIndex++;
this.getList();
} else {
this.status = "nomore";
}
},
chosenMorewhere(obj) {
if (obj.IsCheck == 0) {
obj.IsCheck = 1;
} else {
obj.IsCheck = 0;
}
this.research();
},
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.dayObj = obj;
this.research();
this.showTimePopup = false;
},
chosenDate() {
this.showTimePopup = true;
},
setHotelRate(rateId) {
let temp = this.tempRateAndPrice.rate.indexOf(rateId);
if (temp == -1) {
this.tempRateAndPrice.rate.push(rateId);
} else {
this.tempRateAndPrice.rate.splice(temp, 1);
}
},
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: [],
};
this.closeDropdown();
this.searchObj.StartPrice = 0;
this.searchObj.EndPrice = 1000;
this.research();
},
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;
}
result = result == "" ? "价格/星级" : result;
this.optionsTitle[2] = result;
this.$forceUpdate();
this.closeDropdown();
this.research();
},
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}之间`;
}
},
closeDropdown() {
this.$refs.uDropdown.close();
},
open(index) {
// 展开某个下来菜单时，先关闭原来的其他菜单的高亮
// 同时内部会自动给当前展开项进行高亮
this.$refs.uDropdown.highlight();
if (index == 2) {
// this.tempRateAndPrice = this.searchObj.rateAndPrice
}
},
close(index) {
// 关闭的时候，给当前项加上高亮
// 当然，您也可以通过监听dropdown-item的@change事件进行处理
this.$refs.uDropdown.highlight(index);
},
change(index) {
let temp = this.options1.find((x) => {
if (x.value == index) {
return x;
} else {
return false;
}
});
this.optionsTitle[0] = temp.label;
this.research();
},
change2(index) {
if (index != -1) {
let temp = this.options2.find((x) => {
if (x.value == index) {
return x;
} else {
return false;
}
});
this.optionsTitle[1] = temp.label;
} 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();
if (type == 1) {
this.HotelList = [];
}
this.request2(
{
url: "/api/Hotel/AppGetHotelPage",
data: this.searchObj,
},
(res) => {
if (res.resultCode == 1) {
if (this.searchObj.pageIndex === 1) {
this.HotelList = res.data.pageData;
} else {
this.HotelList = this.HotelList.concat(res.data.pageData);
}
this.page_count = res.data.pageCount;
}
}
);
},
getCity() {
this.request2(
{
url: "/api/Hotel/GetHotelDestination",
data: { ID: 0 },
},
(res) => {
if (res.resultCode == 1) {
this.cityList = [];
res.data.map((i) => {
let initial = i.PinYin.slice(0, 1);
import rangeSlider from "./components/range-slider.vue";
import canlendar from "./components/time/index";
import hotelGood from "./components/hotel-good.vue";
import Address from "./components/address/smh-address-indexed.vue";
export default {
data() {
return {
city: "成都",
cityList: [],
showCityList: false,
showTimePopup: false,
searchObj: {
pageIndex: 1,
pageSize: 15,
Name: "", //关键字
StartPrice: 0,
EndPrice: 1000,
QStartDate: "",
QEndDate: "",
OrderByType: "1", //排序类型
QStars: "", //星级
TagList: [], //查询标签
City: 262, //市
District: 0, //区
},
day: 0,
startDay: "",
endDay: "",
HotelList: [], //酒店数据
tempRateAndPrice: {
price: {},
priceText: "不限",
rate: [],
},
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",
},
loadText: {
loadmore: "轻轻上拉，加载更多",
loading: "努力加载中",
nomore: "没有更多商品了",
},
scrollTop: 0,
old: {
scrollTop: 0,
},
showLoading: false,
status: "loadmore",
page_count: 0,
dayObj: {},
DistrictOptions: [{
label: "不限",
value: 0
}],
};
},
components: {
rangeSlider,
canlendar,
hotelGood,
Address,
},
onLoad(options) {
if (options && options.Name) {
this.searchObj.Name = options.Name;
}
},
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);
var obj = {
start: `${d1.getFullYear()}-${d1.getMonth() + 1}-${d1.getDate()}`,
end: `${d2.getFullYear()}-${d2.getMonth() + 1}-${d2.getDate()}`,
startDay: `${d1.getMonth() + 1}-${d1.getDate()}`,
endDay: `${d2.getMonth() + 1}-${d2.getDate()}`,
day: 1,
startWeek: startWeek,
endWeek: endWeek,
};
this.dayObj = obj;
uni.setStorage({
key: "Time",
data: JSON.stringify(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();
this.getCity();
this.getDistrict(262);
},
methods: {
showCity() {
this.showCityList = true;
},
confirmCity(val) {
this.searchObj.City = val.ID;
this.showCityList = false;
this.city = val.Name;
this.getDistrict(val.ID);
this.searchObj.District = 0;
this.searchObj.pageIndex = 1;
this.optionsTitle[1] = "区域";
this.getList();
},
scroll: function(e) {
this.old.scrollTop = e.detail.scrollTop;
},
goTop: function(e) {
this.scrollTop = this.old.scrollTop;
this.$nextTick(function() {
this.scrollTop = 0;
});
},
research() {
this.searchObj.pageIndex = 1;
this.getList(1);
},
lower(e) {
// TODO: 滚动到了底部，实现翻页加载
if (this.searchObj.pageIndex < this.page_count) {
this.status = "loading";
this.searchObj.pageIndex++;
this.getList();
} else {
this.status = "nomore";
}
},
chosenMorewhere(obj) {
if (obj.IsCheck == 0) {
obj.IsCheck = 1;
} else {
obj.IsCheck = 0;
}
this.research();
},
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.dayObj = obj;
this.research();
this.showTimePopup = false;
},
chosenDate() {
this.showTimePopup = true;
},
setHotelRate(rateId) {
let temp = this.tempRateAndPrice.rate.indexOf(rateId);
if (temp == -1) {
this.tempRateAndPrice.rate.push(rateId);
} else {
this.tempRateAndPrice.rate.splice(temp, 1);
}
},
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: [],
};
this.closeDropdown();
this.searchObj.StartPrice = 0;
this.searchObj.EndPrice = 1000;
this.research();
},
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;
}
result = result == "" ? "价格/星级" : result;
this.optionsTitle[2] = result;
this.$forceUpdate();
this.closeDropdown();
this.research();
},
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}之间`;
}
},
closeDropdown() {
this.$refs.uDropdown.close();
},
open(index) {
// 展开某个下来菜单时，先关闭原来的其他菜单的高亮
// 同时内部会自动给当前展开项进行高亮
this.$refs.uDropdown.highlight();
if (index == 2) {
// this.tempRateAndPrice = this.searchObj.rateAndPrice
}
},
close(index) {
// 关闭的时候，给当前项加上高亮
// 当然，您也可以通过监听dropdown-item的@change事件进行处理
this.$refs.uDropdown.highlight(index);
},
change(index) {
let temp = this.options1.find((x) => {
if (x.value == index) {
return x;
} else {
return false;
}
});
this.optionsTitle[0] = temp.label;
this.research();
},
change2(index) {
if (index != -1) {
let temp = this.options2.find((x) => {
if (x.value == index) {
return x;
} else {
return false;
}
});
this.optionsTitle[1] = temp.label;
} 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();
if (type == 1) {
this.HotelList = [];
}
this.request2({
url: "/api/Hotel/AppGetHotelPage",
data: this.searchObj,
},
(res) => {
if (res.resultCode == 1) {
if (this.searchObj.pageIndex === 1) {
this.HotelList = res.data.pageData;
} else {
this.HotelList = this.HotelList.concat(res.data.pageData);
}
this.page_count = res.data.pageCount;
}
}
);
},
getCity() {
this.request2({
url: "/api/Hotel/GetHotelDestination",
data: {
ID: 0
},
},
(res) => {
if (res.resultCode == 1) {
this.cityList = [];
res.data.map((i) => {
let initial = i.PinYin.slice(0, 1);
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);
}
});
}
},
(err) => {}
);
},
getDistrict(id) {
this.request2(
{
url: "/api/Hotel/GetHotelDestination",
data: { ID: id },
},
(res) => {
if (res.resultCode == 1) {
this.DistrictOptions = [{ label: "不限", value: 0 }];
res.data.map((i) => {
let obj = {
label: i.Name,
value: i.ID,
};
this.DistrictOptions.push(obj);
});
}
},
(err) => {}
);
},
changeDistrict(val) {
this.searchObj.pageIndex = 1;
this.getList();
let res = this.DistrictOptions.filter((i) => {
return i.value == val;
});
this.optionsTitle[1] = res[0].label;
},
},
};
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);
}
});
}
},
(err) => {}
);
},
getDistrict(id) {
this.request2({
url: "/api/Hotel/GetHotelDestination",
data: {
ID: id
},
},
(res) => {
if (res.resultCode == 1) {
this.DistrictOptions = [{
label: "不限",
value: 0
}];
res.data.map((i) => {
let obj = {
label: i.Name,
value: i.ID,
};
this.DistrictOptions.push(obj);
});
}
},
(err) => {}
);
},
changeDistrict(val) {
this.searchObj.pageIndex = 1;
this.getList();
let res = this.DistrictOptions.filter((i) => {
return i.value == val;
});
this.optionsTitle[1] = res[0].label;
},
},
};
</script>
<style lang="scss" scoped>
/deep/.u-flex {
justify-content: center;
}
.hotel-list {
height: 100vh;
}
.hotel-list .hotel-city {
width: 105rpx;
height: 40rpx;
padding: 0rpx 10rpx 8rpx 0rpx;
margin-right: 20rpx;
text-align: center;
/* color: #DFBE6E; */
border-right: 1px solid #e2e2e2;
font-size: 28rpx;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display: flex;
align-items: center;
}
/deep/.u-dropdown-item scroll-view{
height: 100vh !important;
}
/deep/.u-flex {
justify-content: center;
}
.hotel-list {
height: 100vh;
}
.hotel-list .hotel-city {
width: 105rpx;
height: 40rpx;
padding: 0rpx 10rpx 8rpx 0rpx;
margin-right: 20rpx;
text-align: center;
/* color: #DFBE6E; */
border-right: 1px solid #e2e2e2;
font-size: 28rpx;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display: flex;
align-items: center;
}
.hotel-list .search-box {
height: 88rpx;
background: #ecf1f4;
border-radius: 44rpx;
display: flex;
align-items: center;
padding: 19rpx 30rpx;
margin: 0 30rpx;
}
.hotel-list .search-box {
height: 88rpx;
background: #ecf1f4;
border-radius: 44rpx;
display: flex;
align-items: center;
padding: 19rpx 30rpx;
margin: 0 30rpx;
}
.hotel-list .search-box .date {
width: 82rpx;
height: 50rpx;
font-size: 22rpx;
font-weight: 500;
color: #111111;
line-height: 29rpx;
margin-top: -6px;
}
.hotel-list .search-box .date {
width: 82rpx;
height: 50rpx;
font-size: 22rpx;
font-weight: 500;
color: #111111;
line-height: 29rpx;
margin-top: -6px;
}
.hotel-list .search-box .days {
height: 40rpx;
padding: 8rpx 20rpx 8rpx 10rpx;
color: #dfbe6e;
border-right: 1px solid #e2e2e2;
font-size: 24rpx;
}
.hotel-list .search-box .days {
height: 40rpx;
padding: 8rpx 20rpx 8rpx 10rpx;
color: #dfbe6e;
border-right: 1px solid #e2e2e2;
font-size: 24rpx;
}
.hotel-rate-box {
display: flex;
align-items: center;
}
.hotel-rate-box {
display: flex;
align-items: center;
}
.hotel-rate {
width: 160rpx;
height: 60rpx;
background: #ecf1f4;
border-radius: 10rpx;
font-size: 26rpx;
color: #999999;
line-height: 60rpx;
margin-right: 15rpx;
text-align: center;
}
.hotel-rate {
width: 160rpx;
height: 60rpx;
background: #ecf1f4;
border-radius: 10rpx;
font-size: 26rpx;
color: #999999;
line-height: 60rpx;
margin-right: 15rpx;
text-align: center;
}
.hotel-rate:last-child {
margin-right: 0;
}
.hotel-rate:last-child {
margin-right: 0;
}
.hotel-rate.active {
background: #111111;
color: #ffffff;
}
.hotel-rate.active {
background: #111111;
color: #ffffff;
}
.hotel-list .morewhere {
padding: 10rpx 30rpx;
display: flex;
align-items: center;
overflow-x: auto;
flex-wrap: nowrap;
}
.hotel-list .morewhere {
padding: 10rpx 30rpx;
display: flex;
align-items: center;
overflow-x: auto;
flex-wrap: nowrap;
}
.hotel-list .morewhere .item {
padding: 0 20rpx;
height: 36rpx;
line-height: 36rpx;
background: #ecf1f4;
border-radius: 8rpx;
margin-right: 26rpx;
font-size: 22rpx;
color: #999999;
font-weight: 400;
flex-shrink: 0;
}
.hotel-list .morewhere .item {
padding: 0 20rpx;
height: 36rpx;
line-height: 36rpx;
background: #ecf1f4;
border-radius: 8rpx;
margin-right: 26rpx;
font-size: 22rpx;
color: #999999;
font-weight: 400;
flex-shrink: 0;
}
.hotel-list .morewhere .item.active {
background: #111111;
color: #ffffff;
}
.hotel-list .morewhere .item.active {
background: #111111;
color: #ffffff;
}
.hotel-list .morewhere .item:last-child {
margin-right: 0;
}
.hotel-list .morewhere .item:last-child {
margin-right: 0;
}
.no-data {
.no-data-img {
width: 180rpx;
height: 240rpx;
margin-left: 50%;
transform: translateX(-50%);
}
.no-data {
.no-data-img {
width: 180rpx;
height: 240rpx;
margin-left: 50%;
transform: translateX(-50%);
}
.zhanwu {
text-align: center;
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
color: #999999;
margin-top: 20rpx;
}
}
.zhanwu {
text-align: center;
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
color: #999999;
margin-top: 20rpx;
}
}
</style>
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