yvette
5 years ago
20 changed files with 405 additions and 30 deletions
@ -0,0 +1,126 @@ |
|||||
|
// pages/activity/springten/index.js
|
||||
|
import commonApi from "../../../utils/https/common" |
||||
|
import util from "../../../utils/util" |
||||
|
let app = getApp() |
||||
|
Page({ |
||||
|
|
||||
|
/** |
||||
|
* 页面的初始数据 |
||||
|
*/ |
||||
|
data: { |
||||
|
types:['必赏','必吃','必游','必玩','必购','必住','夜戏','夜饮','夜宴','夜市'], |
||||
|
type:0, |
||||
|
list:[], |
||||
|
total:1 |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面加载 |
||||
|
*/ |
||||
|
onLoad: function (options) { |
||||
|
this.getList() |
||||
|
}, |
||||
|
changeType:function(e){ |
||||
|
this.setData({ |
||||
|
type:e.currentTarget.dataset.type, |
||||
|
list:[], |
||||
|
total:1 |
||||
|
}) |
||||
|
this.getList(); |
||||
|
}, |
||||
|
getList:function(){ |
||||
|
if(this.data.total<=this.data.list.length) return; |
||||
|
commonApi._post("scene/get_scene_by_tag",{ |
||||
|
offset:this.data.list.length, |
||||
|
limit:10, |
||||
|
tag_id:17+Number(this.data.type) |
||||
|
}).then(res=>{ |
||||
|
res.data.list.map(item=>{ |
||||
|
if(item.scene_tags && item.scene_tags.indexOf('运河十景')!=-1){ |
||||
|
item.isYunHe = true; |
||||
|
} |
||||
|
else { |
||||
|
item.isYunHe = false; |
||||
|
} |
||||
|
item.display_tags = item.display_tags?item.display_tags.split(","):[]; |
||||
|
item.display_tags = item.display_tags.splice(0,2); |
||||
|
}) |
||||
|
this.setData({ |
||||
|
list:this.data.list.concat(res.data.list), |
||||
|
total:res.data.count |
||||
|
}) |
||||
|
}) |
||||
|
}, |
||||
|
gotoWeb:function(e){ |
||||
|
let item = e.currentTarget.dataset.item; |
||||
|
app.globalData.weburl = item.ext_link; |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/pbService/web/index', |
||||
|
}) |
||||
|
}, |
||||
|
gotoDetail:function(e){ |
||||
|
let item = e.currentTarget.dataset.item; |
||||
|
util.gotoDetail(item) |
||||
|
}, |
||||
|
gotoLocation:function(e){ |
||||
|
let item = e.currentTarget.dataset.item; |
||||
|
wx.openLocation({ |
||||
|
latitude: item.lat, |
||||
|
longitude: item.lon |
||||
|
}) |
||||
|
}, |
||||
|
gotoFoodInfo:function(e){ |
||||
|
let item = e.currentTarget.dataset.item; |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/info/foodInfo/index?id='+item.id, |
||||
|
}) |
||||
|
}, |
||||
|
/** |
||||
|
* 生命周期函数--监听页面初次渲染完成 |
||||
|
*/ |
||||
|
onReady: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面显示 |
||||
|
*/ |
||||
|
onShow: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面隐藏 |
||||
|
*/ |
||||
|
onHide: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面卸载 |
||||
|
*/ |
||||
|
onUnload: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面相关事件处理函数--监听用户下拉动作 |
||||
|
*/ |
||||
|
onPullDownRefresh: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面上拉触底事件的处理函数 |
||||
|
*/ |
||||
|
onReachBottom: function () { |
||||
|
this.getList() |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 用户点击右上角分享 |
||||
|
*/ |
||||
|
onShareAppMessage: function () { |
||||
|
|
||||
|
} |
||||
|
}) |
||||
@ -0,0 +1,5 @@ |
|||||
|
{ |
||||
|
"usingComponents": { |
||||
|
"title":"/pages/component/TitleHeader" |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,30 @@ |
|||||
|
<!--pages/activity/springten/index.wxml--> |
||||
|
<title title="苏州十大必需体验榜单"></title> |
||||
|
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/springten/top.png" mode="widthFix" class="top-img"></image> |
||||
|
<view class="type-icons"> |
||||
|
<view wx:for="{{types}}" bindtap="changeType" data-type="{{index}}" class="type-icon {{type==index?'type-icon-active':''}}"> |
||||
|
<image mode="widthFix" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/springten/icon{{type==index?'2':'1'}}.png"></image> |
||||
|
<view class="icon-text">{{item}}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="list"> |
||||
|
<view style="height:13rpx"></view> |
||||
|
<view class="item" wx:for="{{list}}"> |
||||
|
<view class="item-in"> |
||||
|
<image src="{{item.headimg}}" mode="aspectFill"></image> |
||||
|
<view class="item-info"> |
||||
|
<view class="item-title textOver">{{item.title}}</view> |
||||
|
<view class="item-tags"> |
||||
|
<view class="tag textOver" wx:for="{{item.display_tags}}">{{item}}</view> |
||||
|
</view> |
||||
|
<view class="item-address textOver">地址：{{item.address}}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="item-result">上榜理由：{{item.brief_intro}}</view> |
||||
|
<view class="item-btn" bindtap="gotoWeb" data-item="{{item}}" wx:if="{{item.ext_link}}">前往购买</view> |
||||
|
<view class="item-btn" bindtap="gotoLocation" data-item="{{item}}" wx:elif="{{item.is_nav}}">打开导航</view> |
||||
|
<view class="item-btn" bindtap="gotoFoodInfo" data-item="{{item}}" wx:elif="{{item.isYunHe}}">查看详情</view> |
||||
|
<view bindtap="gotoDetail" data-item="{{item}}" class="item-btn" wx:else>立即预订</view> |
||||
|
</view> |
||||
|
<view class="nomore" wx:if="{{list.length>=total || list.length==0}}">—— 没有更多了 ——</view> |
||||
|
</view> |
||||
@ -0,0 +1,123 @@ |
|||||
|
/* pages/activity/springten/index.wxss */ |
||||
|
.top-img { |
||||
|
display: block; |
||||
|
width: 100%; |
||||
|
position: absolute; |
||||
|
left: 0; |
||||
|
z-index: 0; |
||||
|
} |
||||
|
.type-icons { |
||||
|
position: relative; |
||||
|
z-index: 1; |
||||
|
margin: 0 20rpx; |
||||
|
margin-top: 357rpx; |
||||
|
display: flex; |
||||
|
flex-wrap: wrap; |
||||
|
justify-content: space-between; |
||||
|
} |
||||
|
.type-icon { |
||||
|
width: 124rpx; |
||||
|
height: 123rpx; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
text-align: center; |
||||
|
font-size: 29rpx; |
||||
|
color: #fff; |
||||
|
font-weight: bold; |
||||
|
position: relative; |
||||
|
margin-top: 20rpx; |
||||
|
} |
||||
|
.icon-text { |
||||
|
position: absolute; |
||||
|
left: 0; |
||||
|
top: 0; |
||||
|
right: 0; |
||||
|
bottom: 0; |
||||
|
line-height: 123rpx; |
||||
|
z-index: 1; |
||||
|
} |
||||
|
.type-icon image { |
||||
|
width: 115rpx; |
||||
|
} |
||||
|
.type-icon-active image { |
||||
|
width: 124rpx; |
||||
|
} |
||||
|
.list { |
||||
|
background:url(https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/springten/bg2.png) repeat-y; |
||||
|
background-size: 100%; |
||||
|
} |
||||
|
.item { |
||||
|
margin: 0 25rpx; |
||||
|
margin-top: 43rpx; |
||||
|
background:url(https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/springten/bg1.png); |
||||
|
background-size: 100% 100%; |
||||
|
width: 700rpx; |
||||
|
height: 325rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
.nomore { |
||||
|
margin-top: 50rpx; |
||||
|
line-height: 50rpx; |
||||
|
font-size: 23rpx; |
||||
|
text-align: center; |
||||
|
} |
||||
|
.item-in { |
||||
|
display: flex; |
||||
|
padding: 30rpx; |
||||
|
padding-bottom: 20rpx; |
||||
|
justify-content: space-between; |
||||
|
} |
||||
|
.item-in image { |
||||
|
width: 253rpx; |
||||
|
height: 213rpx; |
||||
|
display: block; |
||||
|
flex-shrink: 0; |
||||
|
} |
||||
|
.item-info { |
||||
|
flex: 1; |
||||
|
width: 351rpx; |
||||
|
margin-left: 30rpx; |
||||
|
} |
||||
|
.item-title { |
||||
|
font-size: 35rpx; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
.item-tags { |
||||
|
display: flex; |
||||
|
margin-top: 30rpx; |
||||
|
margin-bottom: 18rpx; |
||||
|
font-size: 24rpx; |
||||
|
} |
||||
|
.item-tags .tag { |
||||
|
line-height: 36rpx; |
||||
|
background: linear-gradient(0deg, #BE8CDF, #724796); |
||||
|
border-radius: 7rpx; |
||||
|
color: #fff; |
||||
|
padding: 0 13rpx; |
||||
|
margin-right: 12rpx; |
||||
|
} |
||||
|
.item-tags .tag:last-child { |
||||
|
margin-right: 0; |
||||
|
} |
||||
|
.item-address { |
||||
|
font-size: 23rpx; |
||||
|
color: #666666; |
||||
|
} |
||||
|
.item-result { |
||||
|
font-size: 25rpx; |
||||
|
color: #333; |
||||
|
margin: 0 30rpx; |
||||
|
} |
||||
|
.item-btn { |
||||
|
position: absolute; |
||||
|
right: 37rpx; |
||||
|
bottom: 50rpx; |
||||
|
width: 160rpx; |
||||
|
line-height: 53rpx; |
||||
|
background: #8356A6; |
||||
|
text-align: center; |
||||
|
color: #fff; |
||||
|
font-size: 29rpx; |
||||
|
border-radius: 27rpx; |
||||
|
} |
||||
Loading…
Reference in new issue