Commit 58824ac4 authored by 黄奎's avatar 黄奎

页面修改

parent 4ed981d2
...@@ -34,7 +34,7 @@ ...@@ -34,7 +34,7 @@
:src="item.picUrl" :src="item.picUrl"
/> />
<div class="good-info"> <div class="good-info">
<div class="good-name" v-if="goodsInfo.showGoodsName">{{ item.name }}</div> <div class="good-name" v-if="goodsInfo.showGoodsName">{{ item.name }} 1</div>
<view class="good-sub-name">{{item.subname}}</view> <view class="good-sub-name">{{item.subname}}</view>
<div class="good-price-info"> <div class="good-price-info">
<span class="price" :style="{ color: mainColor }">{{ goodsInfo.showGoodsPrice ? getPrice(item.price) : '' }} <span class="price" :style="{ color: mainColor }">{{ goodsInfo.showGoodsPrice ? getPrice(item.price) : '' }}
......
...@@ -309,6 +309,12 @@ export default { ...@@ -309,6 +309,12 @@ export default {
that.minBlockLeft = minBlockLeft; that.minBlockLeft = minBlockLeft;
that.maxBlockLeft = maxBlockLeft; that.maxBlockLeft = maxBlockLeft;
}, },
_getMaxLength()
{
var that = this;
var MAX_LENGTH = that.width - that.blockSize;
return MAX_LENGTH;
},
/** /**
* 刷新整个视图 * 刷新整个视图
*/ */
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
<view class="days">{{day}}</view> <view class="days">{{day}}</view>
<view style="width: 1px; flex: 1;"> <view style="width: 1px; flex: 1;">
<u-search placeholder="关键字/位置/品牌/酒店名" v-model="searchObj.Name" input-align="left" :value="searchObj.Name" <u-search placeholder="关键字/位置/品牌/酒店名" v-model="searchObj.Name" input-align="left" :value="searchObj.Name"
text-color="#111" bg-color="rgba(0,0,0,0)" @change="getList(1)" :show-action="false"></u-search> text-color="#111" bg-color="rgba(0,0,0,0)" @change="getList(1)" :show-action="false"></u-search>
</view> </view>
</view> </view>
<view> <view>
...@@ -26,14 +26,14 @@ ...@@ -26,14 +26,14 @@
<view style="font-size: 24rpx;flex:1">¥0</view> <view style="font-size: 24rpx;flex:1">¥0</view>
<view style="font-size: 24rpx;flex:1;color: #333;text-align: right;">¥1000以上</view> <view style="font-size: 24rpx;flex:1;color: #333;text-align: right;">¥1000以上</view>
</view> </view>
<range-slider :width="690" :height="80" :step="10" :liveMode="true" background-color="#E2E2E2" <range-slider ref="rangeslider" :width="690" :height="80" :step="10" :liveMode="true" background-color="#E2E2E2"
:block-size="40" active-color="#111111" min="0" max="1000" @rangechange="rangechange4" :block-size="40" active-color="#111111" min="0" max="1000" @rangechange="rangechange4" :values="tempRateAndPrice.price"></range-slider>
:values="tempRateAndPrice.price"></range-slider>
<view style="margin: 20rpx 0 29rpx 0;"> <view style="margin: 20rpx 0 29rpx 0;">
<text style="font-size: 28rpx;color:#111;font-weight: 800;">星级</text> <text style="font-size: 28rpx;color:#111;font-weight: 800;">星级</text>
</view> </view>
<view class="hotel-rate-box"> <view class="hotel-rate-box">
<view v-for="(x,i) in rates" :key="i" class="hotel-rate" :class="{'active':tempRateAndPrice.rate.indexOf(x.Id)!=-1}" @click="setHotelRate(x.Id)">{{x.Name}}</view> <view v-for="(x,i) in rates" :key="i" class="hotel-rate" :class="{'active':tempRateAndPrice.rate.indexOf(x.Id)!=-1}"
@click="setHotelRate(x.Id)">{{x.Name}}</view>
</view> </view>
<view style="box-shadow: 0px -10px 30px 0px rgba(36, 36, 36, 0.06);margin-top:40rpx;display: flex;"> <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;"> <view style="flex:1;margin-right: 30rpx;">
...@@ -45,7 +45,6 @@ ...@@ -45,7 +45,6 @@
</view> </view>
</view> </view>
</u-dropdown-item> </u-dropdown-item>
<!-- <u-dropdown-item v-model="value2" :title="optionsTitle[3]" :options="options2"></u-dropdown-item> -->
</u-dropdown> </u-dropdown>
</view> </view>
<u-popup v-model="showTimePopup" mode="bottom" border-radius="20" length="95%" :safe-area-inset-bottom="true"> <u-popup v-model="showTimePopup" mode="bottom" border-radius="20" length="95%" :safe-area-inset-bottom="true">
...@@ -56,9 +55,9 @@ ...@@ -56,9 +55,9 @@
</view> </view>
<scroll-view :scroll-y="true" @scrolltolower="lower" :enable-back-to-top="true" :enable-flex="true" :scroll-top="scrollTop" <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;"> @scroll="scroll" style="height: calc(100% - 224rpx); padding-bottom: 0px;">
<hotel-good :HotelList="HotelList"></hotel-good> <hotel-good :HotelList="HotelList"></hotel-good>
<u-loadmore v-if="showLoading" :status="status" :load-text="loadText" :font-size="24" :margin-top="20" <u-loadmore v-if="showLoading" :status="status" :load-text="loadText" :font-size="24" :margin-top="20"
:margin-bottom="20" bg-color="#F5F5F5" color="#111" /> :margin-bottom="20" bg-color="#F5F5F5" color="#111" />
</scroll-view> </scroll-view>
</view> </view>
</template> </template>
...@@ -70,30 +69,27 @@ ...@@ -70,30 +69,27 @@
export default { export default {
data() { data() {
return { return {
showTimePopup:false, showTimePopup: false,
searchObj: {
value1: 1, pageIndex: 1,
value2: 2, pageSize: 15,
searchObj:{ Name: '', //关键字
pageIndex:1, StartPrice: 0,
pageSize:15, EndPrice: 1000,
Name:'', //关键字 QStartDate: '',
StartPrice:0, QEndDate: '',
EndPrice:1000, OrderByType: '1', //排序类型
QStartDate:'', QStars: '', //星级
QEndDate:'', TagList: [] //查询标签
OrderByType:'1', //排序类型
QStars:'', //星级
TagList:[] //查询标签
}, },
day:0, day: 0,
startDay:'', startDay: '',
endDay:'', endDay: '',
HotelList:[], //酒店数据 HotelList: [], //酒店数据
tempRateAndPrice:{ tempRateAndPrice: {
price:{}, price: {},
priceText:"不限", priceText: "不限",
rate:[] rate: []
}, },
optionsTitle: [ optionsTitle: [
"推荐排序", "推荐排序",
...@@ -103,8 +99,7 @@ ...@@ -103,8 +99,7 @@
], ],
rates: [], rates: [],
options1: [], //推荐排序数据 options1: [], //推荐排序数据
options2: [ options2: [{
{
label: '不限', label: '不限',
value: -1, value: -1,
}, },
...@@ -141,20 +136,20 @@ ...@@ -141,20 +136,20 @@
value: 8, value: 8,
}, },
], ],
btnStyle:{ btnStyle: {
borderRadius: '16rpx', borderRadius: '16rpx',
color: '#111', color: '#111',
fontSize: '30rpx', fontSize: '30rpx',
width: '100%', width: '100%',
border:"1px solid #111", border: "1px solid #111",
background:"#FFF" background: "#FFF"
}, },
btnStyle2:{ btnStyle2: {
borderRadius: '16rpx', borderRadius: '16rpx',
color: '#fff', color: '#fff',
fontSize: '30rpx', fontSize: '30rpx',
width: '100%', width: '100%',
background:"#111" background: "#111"
}, },
loadText: { loadText: {
loadmore: "轻轻上拉,加载更多", loadmore: "轻轻上拉,加载更多",
...@@ -165,9 +160,9 @@ ...@@ -165,9 +160,9 @@
old: { old: {
scrollTop: 0, scrollTop: 0,
}, },
showLoading:false, showLoading: false,
status: "loadmore", status: "loadmore",
page_count:0 page_count: 0
} }
}, },
components: { components: {
...@@ -176,15 +171,12 @@ ...@@ -176,15 +171,12 @@
hotelGood hotelGood
}, },
created() { created() {
// uni.navigateTo({
// url:"/pages/hotel/detail"
// })
uni.setNavigationBarTitle({ uni.setNavigationBarTitle({
title: "酒店", title: "酒店",
}); });
let d1=new Date(); let d1 = new Date();
let d=new Date(); let d = new Date();
let d2=new Date(d.setDate(d.getDate()+1)) let d2 = new Date(d.setDate(d.getDate() + 1))
var obj = { var obj = {
start: `${d1.getFullYear()}-${d1.getMonth()+1}-${d1.getDate()}`, start: `${d1.getFullYear()}-${d1.getMonth()+1}-${d1.getDate()}`,
end: `${d2.getFullYear()}-${d2.getMonth()+1}-${d2.getDate()}`, end: `${d2.getFullYear()}-${d2.getMonth()+1}-${d2.getDate()}`,
...@@ -196,7 +188,6 @@ ...@@ -196,7 +188,6 @@
key: 'Time', key: 'Time',
data: JSON.stringify(obj) data: JSON.stringify(obj)
}) })
// this.searchObj.date=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;
...@@ -225,84 +216,85 @@ ...@@ -225,84 +216,85 @@
this.status = "nomore"; this.status = "nomore";
} }
}, },
chosenMorewhere(obj){ chosenMorewhere(obj) {
if(obj.IsCheck==0){ if (obj.IsCheck == 0) {
obj.IsCheck=1 obj.IsCheck = 1
}else{ } else {
obj.IsCheck=0; obj.IsCheck = 0;
} }
this.getList(1); this.getList(1);
}, },
chosenDateResult(obj){ chosenDateResult(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.getList(1); this.getList(1);
this.showTimePopup=false this.showTimePopup = false
}, },
chosenDate(){ chosenDate() {
// uni.navigateTo({ this.showTimePopup = true
// url:"/pages/hotel/components/time/index"
// })
this.showTimePopup=true
}, },
setHotelRate(rateId){ setHotelRate(rateId) {
let temp=this.tempRateAndPrice.rate.indexOf(rateId) let temp = this.tempRateAndPrice.rate.indexOf(rateId)
if(temp==-1){ if (temp == -1) {
this.tempRateAndPrice.rate.push(rateId) this.tempRateAndPrice.rate.push(rateId)
}else{ } else {
this.tempRateAndPrice.rate.splice(temp,1) this.tempRateAndPrice.rate.splice(temp, 1)
} }
}, },
resetPrice(){ resetPrice() {
this.optionsTitle[2]="价格/星级" this.optionsTitle[2] = "价格/星级";
this.tempRateAndPrice={ var obj = this.$refs.rangeslider;
price:{ obj.progressBarLeft = 0;
minValue:0, obj.progressBarWidth = obj._getMaxLength();
maxValue:1000 obj.minBlockLeft = 0;
obj.maxBlockLeft = obj._getMaxLength();
this.tempRateAndPrice = {
price: {
minValue: 0,
maxValue: 1000
}, },
priceText:"不限", priceText: "不限",
rate:[] rate: []
} }
this.closeDropdown(); this.closeDropdown();
this.searchObj.StartPrice=0; this.searchObj.StartPrice = 0;
this.searchObj.EndPrice=1000; this.searchObj.EndPrice = 1000;
this.getList(1); this.getList(1);
}, },
surePrice(){ surePrice() {
let result="" let result = ""
if(this.tempRateAndPrice.rate.length>0){ if (this.tempRateAndPrice.rate.length > 0) {
this.rates.forEach(x=>{ this.rates.forEach(x => {
if(this.tempRateAndPrice.rate.indexOf(x.value)!=-1){ if (this.tempRateAndPrice.rate.indexOf(x.value) != -1) {
result+=x.label+"," result += x.label + ","
} }
}) })
} }
if(this.tempRateAndPrice.priceText!="不限"){ if (this.tempRateAndPrice.priceText != "不限") {
result+=this.tempRateAndPrice.priceText result += this.tempRateAndPrice.priceText
} }
result=result==""?"价格/星级":result result = result == "" ? "价格/星级" : result
console.log(result) this.optionsTitle[2] = result
this.optionsTitle[2]=result this.$forceUpdate()
this.$forceUpdate()
this.closeDropdown(); this.closeDropdown();
this.getList(1); this.getList(1);
}, },
rangechange4(e){ rangechange4(e) {
this.searchObj.StartPrice = e.minValue; this.searchObj.StartPrice = e.minValue;
this.searchObj.EndPrice = e.maxValue; this.searchObj.EndPrice = e.maxValue;
if(e.minValue==0){ if (e.minValue == 0) {
if(e.maxValue==1000){ if (e.maxValue == 1000) {
this.tempRateAndPrice.priceText="不限" this.tempRateAndPrice.priceText = "不限"
}else{ } else {
this.tempRateAndPrice.priceText=`¥${e.maxValue}以下` this.tempRateAndPrice.priceText = `¥${e.maxValue}以下`
} }
}else if(e.maxValue==1000){ } else if (e.maxValue == 1000) {
this.tempRateAndPrice.priceText=`¥${e.minValue}以上` this.tempRateAndPrice.priceText = `¥${e.minValue}以上`
}else{ } else {
this.tempRateAndPrice.priceText=`¥${e.minValue} - ¥${e.maxValue}之间` this.tempRateAndPrice.priceText = `¥${e.minValue} - ¥${e.maxValue}之间`
} }
}, },
closeDropdown() { closeDropdown() {
...@@ -312,8 +304,8 @@ ...@@ -312,8 +304,8 @@
// 展开某个下来菜单时,先关闭原来的其他菜单的高亮 // 展开某个下来菜单时,先关闭原来的其他菜单的高亮
// 同时内部会自动给当前展开项进行高亮 // 同时内部会自动给当前展开项进行高亮
this.$refs.uDropdown.highlight(); this.$refs.uDropdown.highlight();
if(index==2){ if (index == 2) {
this.tempRateAndPrice=this.searchObj.rateAndPrice this.tempRateAndPrice = this.searchObj.rateAndPrice
} }
}, },
close(index) { close(index) {
...@@ -332,8 +324,8 @@ ...@@ -332,8 +324,8 @@
this.optionsTitle[0] = temp.label this.optionsTitle[0] = temp.label
this.getList(1); this.getList(1);
}, },
change2(index){ change2(index) {
if(index!=-1){ if (index != -1) {
let temp = this.options2.find(x => { let temp = this.options2.find(x => {
if (x.value == index) { if (x.value == index) {
return x return x
...@@ -342,13 +334,12 @@ ...@@ -342,13 +334,12 @@
} }
}) })
this.optionsTitle[1] = temp.label this.optionsTitle[1] = temp.label
}else{ } else {
this.optionsTitle[1] = "附近" this.optionsTitle[1] = "附近"
} }
}, },
//获取查询条件 //获取查询条件
getSearchCondition(){ getSearchCondition() {
console.log('进入了111');
this.request2({ this.request2({
url: '/api/Hotel/GetHotelQuery', url: '/api/Hotel/GetHotelQuery',
data: {} data: {}
...@@ -356,38 +347,35 @@ ...@@ -356,38 +347,35 @@
res => { res => {
if (res.resultCode == 1) { if (res.resultCode == 1) {
let tempObj = res.data; let tempObj = res.data;
this.options1=[]; this.options1 = [];
this.rates=[]; this.rates = [];
if(tempObj&&tempObj.OrderByList.length>0){ if (tempObj && tempObj.OrderByList.length > 0) {
tempObj.OrderByList.forEach(x=>{ tempObj.OrderByList.forEach(x => {
let obj = { let obj = {
label:x.Name, label: x.Name,
value:x.Id value: x.Id
} }
this.options1.push(obj); this.options1.push(obj);
}) })
} }
if(tempObj&&tempObj.TagList){ if (tempObj && tempObj.TagList) {
this.searchObj.TagList = tempObj.TagList; this.searchObj.TagList = tempObj.TagList;
} }
if(tempObj&&tempObj.StarList){ if (tempObj && tempObj.StarList) {
this.rates = tempObj.StarList; this.rates = tempObj.StarList;
console.log(this.rates,'this.rates');
} }
console.log(res,'查询条件');
} }
}, },
err => { err => {
} }
); );
}, },
//获取列表数据 //获取列表数据
getList(type){ getList(type) {
this.searchObj.QStars = this.tempRateAndPrice.rate.toString(); this.searchObj.QStars = this.tempRateAndPrice.rate.toString();
console.log(this.searchObj); if (type == 1) {
if(type==1){ this.HotelList = [];
this.HotelList=[];
} }
this.request2({ this.request2({
url: '/api/Hotel/AppGetHotelPage', url: '/api/Hotel/AppGetHotelPage',
...@@ -395,7 +383,6 @@ ...@@ -395,7 +383,6 @@
}, },
res => { res => {
if (res.resultCode == 1) { if (res.resultCode == 1) {
console.log(res,'查询列表数据');
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;
} }
...@@ -409,7 +396,6 @@ ...@@ -409,7 +396,6 @@
<style> <style>
.hotel-list { .hotel-list {
height: 100vh; height: 100vh;
} }
.hotel-list .search-box { .hotel-list .search-box {
...@@ -438,11 +424,13 @@ ...@@ -438,11 +424,13 @@
border-right: 1px solid #E2E2E2; border-right: 1px solid #E2E2E2;
font-size: 24rpx; font-size: 24rpx;
} }
.hotel-rate-box{
.hotel-rate-box {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.hotel-rate{
.hotel-rate {
width: 160rpx; width: 160rpx;
height: 60rpx; height: 60rpx;
background: #ECF1F4; background: #ECF1F4;
...@@ -453,21 +441,25 @@ ...@@ -453,21 +441,25 @@
margin-right: 15rpx; margin-right: 15rpx;
text-align: center; text-align: center;
} }
.hotel-rate:last-child{
.hotel-rate:last-child {
margin-right: 0; margin-right: 0;
} }
.hotel-rate.active{
.hotel-rate.active {
background: #111111; background: #111111;
color: #FFFFFF; color: #FFFFFF;
} }
.hotel-list .morewhere{
padding:10rpx 30rpx; .hotel-list .morewhere {
padding: 10rpx 30rpx;
display: flex; display: flex;
align-items: center; align-items: center;
overflow-x: auto; overflow-x: auto;
flex-wrap: nowrap; flex-wrap: nowrap;
} }
.hotel-list .morewhere .item{
.hotel-list .morewhere .item {
padding: 0 20rpx; padding: 0 20rpx;
height: 36rpx; height: 36rpx;
line-height: 36rpx; line-height: 36rpx;
...@@ -479,11 +471,13 @@ ...@@ -479,11 +471,13 @@
font-weight: 400; font-weight: 400;
flex-shrink: 0; flex-shrink: 0;
} }
.hotel-list .morewhere .item.active{
.hotel-list .morewhere .item.active {
background: #111111; background: #111111;
color: #FFFFFF; color: #FFFFFF;
} }
.hotel-list .morewhere .item:last-child{
.hotel-list .morewhere .item:last-child {
margin-right: 0; margin-right: 0;
} }
</style> </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