Myth
5 years ago
20 changed files with 1099 additions and 33 deletions
@ -0,0 +1,180 @@ |
|||||
|
// pages/activity/artfestival/index.js
|
||||
|
import commonApi from "../../../utils/https/common" |
||||
|
let app = getApp() |
||||
|
Page({ |
||||
|
|
||||
|
/** |
||||
|
* 页面的初始数据 |
||||
|
*/ |
||||
|
data: { |
||||
|
index:1, |
||||
|
page:1, |
||||
|
total:1, |
||||
|
list:[], |
||||
|
left:[], |
||||
|
right:[], |
||||
|
imgIndex:-1, |
||||
|
leftHeight:0, |
||||
|
rightHeight:0, |
||||
|
ajaxFlag:true |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面加载 |
||||
|
*/ |
||||
|
onLoad: function (options) { |
||||
|
this.getList() |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面初次渲染完成 |
||||
|
*/ |
||||
|
onReady: function () { |
||||
|
|
||||
|
}, |
||||
|
getList:function(){ |
||||
|
if((this.data.left.length+this.data.right.length)>=this.data.total || !this.data.ajaxFlag) return; |
||||
|
this.setData({ |
||||
|
ajaxFlag:false |
||||
|
}) |
||||
|
commonApi._post("multimedia/media_list",{ |
||||
|
page:this.data.page, |
||||
|
limit:10, |
||||
|
tenscenic_id:0, |
||||
|
class_id:this.data.index, |
||||
|
type:2 |
||||
|
}).then(res=>{ |
||||
|
wx.showLoading({ |
||||
|
title: '加载中', |
||||
|
}) |
||||
|
this.setData({ |
||||
|
total:res.data.total, |
||||
|
page:this.data.page+1, |
||||
|
list:res.data.data, |
||||
|
imgIndex:0 |
||||
|
}) |
||||
|
}) |
||||
|
}, |
||||
|
imageLoad:function(e){ |
||||
|
if(this.data.imgIndex==-1) return; |
||||
|
let h = 304 * e.detail.height/e.detail.width + 33 + 26,leftHeight=this.data.leftHeight,rightHeight = this.data.rightHeight,left=this.data.left,right=this.data.right; |
||||
|
let item = this.data.list[this.data.imgIndex]; |
||||
|
item.h = h - 33 - 26; |
||||
|
if(leftHeight<=rightHeight){ |
||||
|
left.push(item); |
||||
|
leftHeight = leftHeight + h; |
||||
|
} |
||||
|
else { |
||||
|
right.push(item); |
||||
|
rightHeight = rightHeight + h; |
||||
|
} |
||||
|
this.setData({ |
||||
|
// imgIndex:this.data.imgIndex+1,
|
||||
|
left:left, |
||||
|
right:right, |
||||
|
leftHeight:leftHeight, |
||||
|
rightHeight:rightHeight |
||||
|
}) |
||||
|
if(this.data.imgIndex>=this.data.list.length-1){ |
||||
|
wx.hideLoading({ |
||||
|
}); |
||||
|
this.setData({ |
||||
|
ajaxFlag:true |
||||
|
}) |
||||
|
} |
||||
|
else { |
||||
|
this.setData({ |
||||
|
imgIndex:this.data.imgIndex+1 |
||||
|
}) |
||||
|
} |
||||
|
}, |
||||
|
changeType:function(e){ |
||||
|
let index = e.currentTarget.dataset.type; |
||||
|
this.setData({ |
||||
|
list:[], |
||||
|
total:1, |
||||
|
page:1, |
||||
|
index:index, |
||||
|
left:[], |
||||
|
right:[], |
||||
|
leftHeight:0, |
||||
|
rightHeight:0, |
||||
|
imgIndex:-1, |
||||
|
ajaxFlag:true |
||||
|
}) |
||||
|
this.getList() |
||||
|
}, |
||||
|
goTop:function(){ |
||||
|
wx.pageScrollTo({ |
||||
|
duration: 200, |
||||
|
scrollTop:0 |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面显示 |
||||
|
*/ |
||||
|
onShow: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面隐藏 |
||||
|
*/ |
||||
|
onHide: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面卸载 |
||||
|
*/ |
||||
|
onUnload: function () { |
||||
|
|
||||
|
}, |
||||
|
previewImg:function(e){ |
||||
|
let item = e.currentTarget.dataset.item; |
||||
|
wx.showLoading({ |
||||
|
title: '加载中', |
||||
|
}) |
||||
|
wx.downloadFile({ |
||||
|
url: item.head_img, |
||||
|
success:function(r){ |
||||
|
console.log(r) |
||||
|
wx.previewImage({ |
||||
|
urls: [r.tempFilePath], |
||||
|
current:r.tempFilePath |
||||
|
}) |
||||
|
}, |
||||
|
complete:function(){ |
||||
|
wx.hideLoading({ |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
goVr:function(){ |
||||
|
app.globalData.weburl = "https://video.9jiexia.com/QuanJMY/suzhou/suzhoumeishuguan/index.html" |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/pbService/web/index' |
||||
|
}) |
||||
|
}, |
||||
|
/** |
||||
|
* 页面相关事件处理函数--监听用户下拉动作 |
||||
|
*/ |
||||
|
onPullDownRefresh: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面上拉触底事件的处理函数 |
||||
|
*/ |
||||
|
onReachBottom: function () { |
||||
|
this.getList() |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 用户点击右上角分享 |
||||
|
*/ |
||||
|
onShareAppMessage: function () { |
||||
|
|
||||
|
} |
||||
|
}) |
||||
@ -0,0 +1,3 @@ |
|||||
|
{ |
||||
|
"usingComponents": {} |
||||
|
} |
||||
@ -0,0 +1,40 @@ |
|||||
|
<!--pages/activity/artfestival/index.wxml--> |
||||
|
<image class="main-img" src="https://m.cloud.sz-trip.com/static/images/activity/artfestival/top.png" mode="widthFix"></image> |
||||
|
<image wx:if="{{imgIndex>-1 && imgIndex<list.length}}" src="{{list[imgIndex].head_img}}?x-oss-process=image/resize,w_500,m_lfit" bindload="imageLoad" mode="widthFix" class="testimg"></image> |
||||
|
<view class="vr-box" bindtap="goVr">点击体验VR观展</view> |
||||
|
<view class="menus"> |
||||
|
<view bindtap="changeType" data-type="1" class="menu{{index==1?' active':''}}"> |
||||
|
<image src="https://m.cloud.sz-trip.com/static/images/activity/artfestival/bg{{index==1?'1':'0'}}.png" mode="aspectFill"></image> |
||||
|
<view>美术作品</view> |
||||
|
</view> |
||||
|
<view bindtap="changeType" data-type="3" class="menu{{index==3?' active':''}}"> |
||||
|
<image src="https://m.cloud.sz-trip.com/static/images/activity/artfestival/bg{{index==3?'1':'0'}}.png" mode="aspectFill"></image> |
||||
|
<view>书法篆刻</view> |
||||
|
</view> |
||||
|
<view bindtap="changeType" data-type="2" class="menu{{index==2?' active':''}}"> |
||||
|
<image src="https://m.cloud.sz-trip.com/static/images/activity/artfestival/bg{{index==2?'1':'0'}}.png" mode="aspectFill"></image> |
||||
|
<view>评委作品</view> |
||||
|
</view> |
||||
|
<view bindtap="changeType" data-type="4" class="menu{{index==4?' active':''}}"> |
||||
|
<image src="https://m.cloud.sz-trip.com/static/images/activity/artfestival/bg{{index==4?'1':'0'}}.png" mode="aspectFill"></image> |
||||
|
<view>特邀作品</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="list"> |
||||
|
<view class="list-left"> |
||||
|
<view class="list-item" bindtap="previewImg" data-item="{{item}}" wx:for="{{left}}"> |
||||
|
<image style="height:{{item.h}}rpx" src="{{item.head_img}}?x-oss-process=image/resize,w_500,m_lfit" mode="aspectFill"></image> |
||||
|
<view class="img-text textOver">{{item.title}}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="list-left"> |
||||
|
<view class="list-item" bindtap="previewImg" data-item="{{item}}" wx:for="{{right}}"> |
||||
|
<image style="height:{{item.h}}rpx" src="{{item.head_img}}?x-oss-process=image/resize,w_500,m_lfit" mode="aspectFill"></image> |
||||
|
<view class="img-text textOver">{{item.title}}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="nomore" wx:if="{{(left.length+right.length)>=total}}">没有更多数据了</view> |
||||
|
<image src="https://m.cloud.sz-trip.com/static/images/activity/artfestival/text.png" mode="widthFix" class="bottomimg"></image> |
||||
|
<image bindtap="goTop" src="https://m.cloud.sz-trip.com/static/images/activity/artfestival/topbtn.png" mode="widthFix" class="btnimg"></image> |
||||
|
<view style="height:1rpx"></view> |
||||
@ -0,0 +1,115 @@ |
|||||
|
/* pages/activity/artfestival/index.wxss */ |
||||
|
.main-img { |
||||
|
display: block; |
||||
|
width: 100%; |
||||
|
position: absolute; |
||||
|
left: 0; |
||||
|
top: 0; |
||||
|
} |
||||
|
.menus { |
||||
|
display: flex; |
||||
|
margin: 0 30rpx; |
||||
|
margin-top: 354rpx; |
||||
|
margin-bottom: 46rpx; |
||||
|
justify-content: space-between; |
||||
|
} |
||||
|
.menu { |
||||
|
position: relative; |
||||
|
width: 153rpx; |
||||
|
line-height: 53rpx; |
||||
|
font-size: 32rpx; |
||||
|
color: #fff; |
||||
|
text-align: center; |
||||
|
} |
||||
|
.menu image { |
||||
|
position: absolute; |
||||
|
left: 0; |
||||
|
top: 0; |
||||
|
width: 153rpx; |
||||
|
height: 53rpx; |
||||
|
} |
||||
|
.menu.active { |
||||
|
font-weight: 500; |
||||
|
color: #C9161E; |
||||
|
} |
||||
|
.menu view { |
||||
|
position: relative; |
||||
|
z-index: 1; |
||||
|
} |
||||
|
page { |
||||
|
background: url(https://m.cloud.sz-trip.com/static/images/activity/artfestival/bg.png); |
||||
|
background-size: 100%; |
||||
|
background-repeat: repeat-y; |
||||
|
} |
||||
|
.list { |
||||
|
margin: 0 30rpx; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
flex-wrap: wrap; |
||||
|
min-height: 100rpx; |
||||
|
} |
||||
|
.list-left { |
||||
|
width: 330rpx; |
||||
|
} |
||||
|
.list-item { |
||||
|
position: relative; |
||||
|
padding: 13rpx; |
||||
|
background: #FEE5C6; |
||||
|
margin-bottom: 33rpx; |
||||
|
} |
||||
|
.list-item image { |
||||
|
width: 100%; |
||||
|
display: block; |
||||
|
} |
||||
|
.img-text { |
||||
|
line-height: 46rpx; |
||||
|
font-size: 27rpx; |
||||
|
color: #fff; |
||||
|
padding: 0 15rpx; |
||||
|
position: absolute; |
||||
|
left: 13rpx; |
||||
|
right: 13rpx; |
||||
|
bottom: 40rpx; |
||||
|
background: rgba(0, 0, 0, 0.3); |
||||
|
} |
||||
|
.testimg { |
||||
|
position: absolute; |
||||
|
width: 304rpx; |
||||
|
opacity: 0; |
||||
|
z-index: -1; |
||||
|
display: block; |
||||
|
} |
||||
|
.bottomimg { |
||||
|
display: block; |
||||
|
width: 356rpx; |
||||
|
margin: 40rpx auto; |
||||
|
} |
||||
|
.btnimg { |
||||
|
position: fixed; |
||||
|
right: 30rpx; |
||||
|
bottom: 70rpx; |
||||
|
width: 84rpx; |
||||
|
display: block; |
||||
|
z-index: 2; |
||||
|
} |
||||
|
.nomore { |
||||
|
text-align: center; |
||||
|
margin-top: 30rpx; |
||||
|
font-size: 26rpx; |
||||
|
color: #ddd; |
||||
|
} |
||||
|
.vr-box { |
||||
|
width: 240rpx; |
||||
|
text-align: center; |
||||
|
line-height: 56rpx; |
||||
|
font-size: 25rpx; |
||||
|
border-radius: 29rpx; |
||||
|
border: 1px solid #fff; |
||||
|
color: #fff; |
||||
|
position: absolute; |
||||
|
left: 50%; |
||||
|
margin-left: -120rpx; |
||||
|
z-index: 1; |
||||
|
top: 236rpx; |
||||
|
box-sizing: border-box; |
||||
|
} |
||||
@ -0,0 +1,95 @@ |
|||||
|
// pages/activity/redlist/index.js
|
||||
|
import commonApi from "../../../utils/https/common" |
||||
|
import util from "../../../utils/util" |
||||
|
Page({ |
||||
|
|
||||
|
/** |
||||
|
* 页面的初始数据 |
||||
|
*/ |
||||
|
data: { |
||||
|
list:[], |
||||
|
isMore:true |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面加载 |
||||
|
*/ |
||||
|
onLoad: function (options) { |
||||
|
this.getList() |
||||
|
}, |
||||
|
gotoDetail:function(e){ |
||||
|
util.gotoDetail(e.currentTarget.dataset.item) |
||||
|
}, |
||||
|
getList:function(){ |
||||
|
if(!this.data.isMore) return; |
||||
|
commonApi._post("product/get_product_by_tag",{ |
||||
|
tag_id:66, |
||||
|
offset:this.data.list.length, |
||||
|
limit:10 |
||||
|
}).then(res=>{ |
||||
|
res.data.list.map(item=>{ |
||||
|
item.display_tags = item.display_tags?item.display_tags.split(","):[]; |
||||
|
item.display_tags = item.display_tags.splice(0,2); |
||||
|
}) |
||||
|
this.setData({ |
||||
|
isMore:res.data.list.length==10, |
||||
|
list:this.data.list.concat(res.data.list) |
||||
|
}) |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
goTop:function(){ |
||||
|
wx.pageScrollTo({ |
||||
|
duration: 200, |
||||
|
scrollTop:0 |
||||
|
}) |
||||
|
}, |
||||
|
/** |
||||
|
* 生命周期函数--监听页面初次渲染完成 |
||||
|
*/ |
||||
|
onReady: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面显示 |
||||
|
*/ |
||||
|
onShow: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面隐藏 |
||||
|
*/ |
||||
|
onHide: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面卸载 |
||||
|
*/ |
||||
|
onUnload: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面相关事件处理函数--监听用户下拉动作 |
||||
|
*/ |
||||
|
onPullDownRefresh: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面上拉触底事件的处理函数 |
||||
|
*/ |
||||
|
onReachBottom: function () { |
||||
|
this.getList() |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 用户点击右上角分享 |
||||
|
*/ |
||||
|
onShareAppMessage: function () { |
||||
|
|
||||
|
} |
||||
|
}) |
||||
@ -0,0 +1,3 @@ |
|||||
|
{ |
||||
|
"usingComponents": {} |
||||
|
} |
||||
@ -0,0 +1,16 @@ |
|||||
|
<!--pages/activity/redlist/index.wxml--> |
||||
|
<image src="https://sz-qd.oss-cn-hangzhou.aliyuncs.com/xcxImages/listtop/redlist.png" mode="widthFix" class="mainimg"></image> |
||||
|
<view class="item" wx:for="{{list}}" bindtap="gotoDetail" data-item="{{item}}"> |
||||
|
<image src="{{item.headimg}}" mode="aspectFill" class="mainimg"></image> |
||||
|
<view class="item-info"> |
||||
|
<view class="item-title textOver">{{item.title}}</view> |
||||
|
<view class="tags"> |
||||
|
<view class="tag textOver" wx:for="{{item.display_tags}}">{{item}}</view> |
||||
|
</view> |
||||
|
<view class="product-bottom"> |
||||
|
<view class="price"><text>￥</text><text>{{item.price/100}}</text>起</view> |
||||
|
<view class="btn">立即购买</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<image bindtap="goTop" mode="widthFix" src="https://m.cloud.sz-trip.com/static/images/activity/redTravel/return.png" class="top"></image> |
||||
@ -0,0 +1,78 @@ |
|||||
|
/* pages/activity/redlist/index.wxss */ |
||||
|
.mainimg { |
||||
|
display: block; |
||||
|
width: 100%; |
||||
|
} |
||||
|
page { |
||||
|
background: #b9080e; |
||||
|
} |
||||
|
.item { |
||||
|
margin: 20rpx 30rpx; |
||||
|
border-radius: 20rpx; |
||||
|
overflow: hidden; |
||||
|
background: white; |
||||
|
} |
||||
|
.item image { |
||||
|
height: 300rpx; |
||||
|
border-radius: 20rpx; |
||||
|
} |
||||
|
.item-info { |
||||
|
margin: 20rpx; |
||||
|
margin-top: 10rpx; |
||||
|
} |
||||
|
.title { |
||||
|
font-size: 31rpx; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
.tags { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
font-size: 21rpx; |
||||
|
margin-top: 10rpx; |
||||
|
margin-bottom: 20rpx; |
||||
|
color: #E40008; |
||||
|
} |
||||
|
.tag { |
||||
|
line-height: 34rpx; |
||||
|
padding: 0 17rpx; |
||||
|
border: 1rpx solid; |
||||
|
border-radius: 6rpx; |
||||
|
margin-right: 10rpx; |
||||
|
} |
||||
|
.product-bottom { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
} |
||||
|
.product-bottom text { |
||||
|
color: #E40008; |
||||
|
} |
||||
|
.price { |
||||
|
font-size: 27rpx; |
||||
|
color: #666666; |
||||
|
} |
||||
|
.price text:nth-child(2){ |
||||
|
font-weight: bold; |
||||
|
font-size: 40rpx; |
||||
|
} |
||||
|
.price text:nth-child(1){ |
||||
|
font-size: 30rpx; |
||||
|
} |
||||
|
.btn { |
||||
|
width: 200rpx; |
||||
|
line-height: 60rpx; |
||||
|
background: linear-gradient(0deg, #B9080E, #E83632); |
||||
|
border-radius: 30rpx; |
||||
|
text-align: center; |
||||
|
color: #FFEE8C; |
||||
|
font-size: 28rpx; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
.top { |
||||
|
position: fixed; |
||||
|
z-index: 2; |
||||
|
width: 120rpx; |
||||
|
display: block; |
||||
|
right: 20rpx; |
||||
|
bottom: 50rpx; |
||||
|
} |
||||
@ -0,0 +1,287 @@ |
|||||
|
// pages/activity/subway/index.js
|
||||
|
import commonApi from "../../../utils/https/common" |
||||
|
import util from "../../../utils/util" |
||||
|
Page({ |
||||
|
|
||||
|
/** |
||||
|
* 页面的初始数据 |
||||
|
*/ |
||||
|
data: { |
||||
|
line:0, |
||||
|
colors:["#2EAE4F","#00A5AF","#E99A10","#278AE7","#C652A7"], |
||||
|
tagIndex:0, |
||||
|
isFixed:false, |
||||
|
tags:[ |
||||
|
[{ |
||||
|
id:74, |
||||
|
name:"全部" |
||||
|
},{ |
||||
|
id:31, |
||||
|
name:"木渎站" |
||||
|
},{ |
||||
|
id:32, |
||||
|
name:"西环路站" |
||||
|
},{ |
||||
|
id:33, |
||||
|
name:"养育巷站" |
||||
|
},{ |
||||
|
id:34, |
||||
|
name:"乐桥站" |
||||
|
},{ |
||||
|
id:35, |
||||
|
name:"临顿路站" |
||||
|
},{ |
||||
|
id:36, |
||||
|
name:"相门站" |
||||
|
},{ |
||||
|
id:37, |
||||
|
name:"东方之门站" |
||||
|
},{ |
||||
|
id:38, |
||||
|
name:"文化博览中心站" |
||||
|
},{ |
||||
|
id:39, |
||||
|
name:"时代广场站" |
||||
|
}],[{ |
||||
|
id:75, |
||||
|
name:"全部" |
||||
|
},{ |
||||
|
id:40, |
||||
|
name:"山塘街站" |
||||
|
},{ |
||||
|
id:41, |
||||
|
name:"石路站" |
||||
|
},{ |
||||
|
id:42, |
||||
|
name:"桐泾公园站" |
||||
|
},{ |
||||
|
id:43, |
||||
|
name:"独墅湖邻里中心站" |
||||
|
},{ |
||||
|
id:44, |
||||
|
name:"月亮湾站" |
||||
|
},{ |
||||
|
id:45, |
||||
|
name:"桑田岛站" |
||||
|
}],[{ |
||||
|
id:76, |
||||
|
name:"全部" |
||||
|
},{ |
||||
|
id:46, |
||||
|
name:"文昌路站" |
||||
|
},{ |
||||
|
id:47, |
||||
|
name:"索山桥西站" |
||||
|
},{ |
||||
|
id:48, |
||||
|
name:"石湖北站" |
||||
|
},{ |
||||
|
id:48, |
||||
|
name:"石湖北站" |
||||
|
},{ |
||||
|
id:49, |
||||
|
name:"新郭站" |
||||
|
},{ |
||||
|
id:50, |
||||
|
name:"迎春路站" |
||||
|
},{ |
||||
|
id:51, |
||||
|
name:"李公堤西站" |
||||
|
},{ |
||||
|
id:52, |
||||
|
name:"东方之门站" |
||||
|
},{ |
||||
|
id:53, |
||||
|
name:"唯亭站" |
||||
|
}],[{ |
||||
|
id:77, |
||||
|
name:"全部" |
||||
|
},{ |
||||
|
id:54, |
||||
|
name:"龙道浜站" |
||||
|
},{ |
||||
|
id:55, |
||||
|
name:"孙武纪念园站" |
||||
|
},{ |
||||
|
id:56, |
||||
|
name:"北寺塔站" |
||||
|
},{ |
||||
|
id:57, |
||||
|
name:"乐桥站" |
||||
|
},{ |
||||
|
id:58, |
||||
|
name:"三元坊站" |
||||
|
},{ |
||||
|
id:59, |
||||
|
name:"南门站" |
||||
|
},{ |
||||
|
id:60, |
||||
|
name:"苏州湾东站" |
||||
|
},{ |
||||
|
id:61, |
||||
|
name:"松陵大道站" |
||||
|
},{ |
||||
|
id:62, |
||||
|
name:"同里站" |
||||
|
},{ |
||||
|
id:63, |
||||
|
name:"越溪站" |
||||
|
}],[{ |
||||
|
id:78, |
||||
|
name:"全部" |
||||
|
},{ |
||||
|
id:64, |
||||
|
name:"太湖香山站" |
||||
|
},{ |
||||
|
id:65, |
||||
|
name:"胥口站" |
||||
|
},{ |
||||
|
id:66, |
||||
|
name:"灵岩山站" |
||||
|
},{ |
||||
|
id:67, |
||||
|
name:"索山桥西站" |
||||
|
},{ |
||||
|
id:68, |
||||
|
name:"新市桥站" |
||||
|
},{ |
||||
|
id:69, |
||||
|
name:"南门站" |
||||
|
},{ |
||||
|
id:70, |
||||
|
name:"李公堤南站" |
||||
|
},{ |
||||
|
id:71, |
||||
|
name:"斜塘站" |
||||
|
},{ |
||||
|
id:72, |
||||
|
name:"苏州奥体中心站" |
||||
|
},{ |
||||
|
id:73, |
||||
|
name:"阳澄湖南站" |
||||
|
}] |
||||
|
], |
||||
|
list:[], |
||||
|
total:1 |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面加载 |
||||
|
*/ |
||||
|
onLoad: function (options) { |
||||
|
this.getList() |
||||
|
}, |
||||
|
changeLine:function(e){ |
||||
|
this.setData({ |
||||
|
line:e.currentTarget.dataset.index, |
||||
|
tagIndex:0, |
||||
|
list:[], |
||||
|
total:1 |
||||
|
}) |
||||
|
this.getList(); |
||||
|
}, |
||||
|
changeTag:function(e){ |
||||
|
this.setData({ |
||||
|
tagIndex:e.currentTarget.dataset.index, |
||||
|
list:[], |
||||
|
total:1 |
||||
|
}) |
||||
|
this.getList(); |
||||
|
}, |
||||
|
getList:function(){ |
||||
|
if(this.data.list.length>=this.data.total) return; |
||||
|
commonApi._post('scene/get_scene_by_tag',{ |
||||
|
tag_id:this.data.tags[this.data.line][this.data.tagIndex].id, |
||||
|
limit:10, |
||||
|
offset:this.data.list.length |
||||
|
}).then(res=>{ |
||||
|
this.setData({ |
||||
|
total:res.data.count, |
||||
|
list:this.data.list.concat(res.data.list) |
||||
|
}) |
||||
|
}) |
||||
|
}, |
||||
|
toTop:function(){ |
||||
|
wx.pageScrollTo({ |
||||
|
duration: 200, |
||||
|
scrollTop:0 |
||||
|
}) |
||||
|
}, |
||||
|
showMap:function(e){ |
||||
|
wx.showLoading({ |
||||
|
title: '加载中', |
||||
|
}) |
||||
|
let src = e.currentTarget.dataset.src; |
||||
|
wx.downloadFile({ |
||||
|
url: src, |
||||
|
success:function(e){ |
||||
|
wx.previewImage({ |
||||
|
urls: [e.tempFilePath], |
||||
|
current:e.tempFilePath |
||||
|
}) |
||||
|
}, |
||||
|
complete:function(){ |
||||
|
wx.hideLoading({ |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
gotoDetail:function(e){ |
||||
|
let item = e.currentTarget.dataset.item; |
||||
|
util.gotoDetail(item) |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面初次渲染完成 |
||||
|
*/ |
||||
|
onReady: function () { |
||||
|
|
||||
|
}, |
||||
|
onPageScroll:function(e){ |
||||
|
let sys = wx.getSystemInfoSync(),ratio = sys.screenWidth/750,height = 949 * ratio; |
||||
|
this.setData({ |
||||
|
isFixed:e.scrollTop>=height |
||||
|
}) |
||||
|
}, |
||||
|
/** |
||||
|
* 生命周期函数--监听页面显示 |
||||
|
*/ |
||||
|
onShow: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面隐藏 |
||||
|
*/ |
||||
|
onHide: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面卸载 |
||||
|
*/ |
||||
|
onUnload: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面相关事件处理函数--监听用户下拉动作 |
||||
|
*/ |
||||
|
onPullDownRefresh: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面上拉触底事件的处理函数 |
||||
|
*/ |
||||
|
onReachBottom: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 用户点击右上角分享 |
||||
|
*/ |
||||
|
onShareAppMessage: function () { |
||||
|
|
||||
|
} |
||||
|
}) |
||||
@ -0,0 +1,5 @@ |
|||||
|
{ |
||||
|
"usingComponents": { |
||||
|
"title":"/pages/component/TitleHeader" |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,33 @@ |
|||||
|
<!--pages/activity/subway/index.wxml--> |
||||
|
<title title="坐着地铁游苏州"></title> |
||||
|
<image style="position:absolute;left:0;height:994rpx" class="mainimg" src="https://sz-qd.oss-cn-hangzhou.aliyuncs.com/xcxImages/subway/top.png" mode="aspectFill"></image> |
||||
|
<view style="height:949rpx"></view> |
||||
|
<view class="lines{{isFixed?' fixed-lines':''}}"> |
||||
|
<view bindtap="changeLine" data-index="{{index}}" class="line{{index==line?' active':''}}" wx:for="{{5}}">{{index+1}}号线</view> |
||||
|
</view> |
||||
|
<view wx:if="{{isFixed}}" style="height:110rpx"></view> |
||||
|
<view class="content" id="content" style="background:{{colors[line]}}"> |
||||
|
<image mode="widthFix" class="mainimg" src="https://sz-qd.oss-cn-hangzhou.aliyuncs.com/xcxImages/subway/title{{line+1}}.png"></image> |
||||
|
<image bindtap="showMap" data-src="https://sz-qd.oss-cn-hangzhou.aliyuncs.com/xcxImages/subway/map{{line+1}}-1.png" class="mapimg" src="https://sz-qd.oss-cn-hangzhou.aliyuncs.com/xcxImages/subway/map{{line+1}}.png"></image> |
||||
|
<view class="tags"> |
||||
|
<view bindtap="changeTag" style="color:{{colors[line]}}" data-index="{{index}}" class="tag{{tagIndex==index?' active':''}}" wx:for="{{tags[line]}}"><view class="tagtext">{{item.name}}</view><image wx:if="{{tagIndex==index}}" src="https://sz-qd.oss-cn-hangzhou.aliyuncs.com/xcxImages/subway/arrow.png"></image></view> |
||||
|
<view style="width:1rpx;height:1rpx;flex-shrink:0"></view> |
||||
|
</view> |
||||
|
<view class="item" wx:for="{{list}}" bindtap="gotoDetail" data-item="{{item}}" style="background-image:url('https://sz-qd.oss-cn-hangzhou.aliyuncs.com/xcxImages/subway/bg{{line+1}}.png');background-size:100% 100%;"> |
||||
|
<image src="{{item.headimg}}" class="headimg" mode="aspectFill"></image> |
||||
|
<view class="right-info"> |
||||
|
<view class="title textOver">{{item.title}}</view> |
||||
|
<view style="color:{{colors[line]}} !important" class="subtitle textOver">{{item.display_tags}}</view> |
||||
|
<view class="right-bottom"><view style="background:{{colors[line]}}">查看详情</view></view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view wx:if="{{list.length<total}}" class="morebtn" bindtap="getList">点击查看更多 <text>>></text></view> |
||||
|
<view style="height:1rpx"></view> |
||||
|
</view> |
||||
|
<image src="https://sz-qd.oss-cn-hangzhou.aliyuncs.com/xcxImages/subway/text.png" mode="widthFix" class="textimg"></image> |
||||
|
<view style="height:53rpx"></view> |
||||
|
<image src="https://sz-qd.oss-cn-hangzhou.aliyuncs.com/xcxImages/subway/bottom.png" mode="widthFix" class="mainimg bottomimg"></image> |
||||
|
<view class="topbtn" bindtap="toTop"> |
||||
|
<image mode="wdithFix" src="https://sz-qd.oss-cn-hangzhou.aliyuncs.com/xcxImages/subway/totop.png"></image> |
||||
|
<view>顶部</view> |
||||
|
</view> |
||||
@ -0,0 +1,185 @@ |
|||||
|
/* pages/activity/subway/index.wxss */ |
||||
|
.mainimg { |
||||
|
display: block; |
||||
|
width: 100%; |
||||
|
} |
||||
|
page { |
||||
|
background: #D4F0FF; |
||||
|
font-size: 32rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
.lines { |
||||
|
padding: 0 27rpx; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
background: #5BB7E8; |
||||
|
justify-content: space-between; |
||||
|
color: #fff; |
||||
|
height: 67rpx; |
||||
|
margin-bottom: 43rpx; |
||||
|
position: relative; |
||||
|
z-index: 1; |
||||
|
} |
||||
|
.line { |
||||
|
width: 120rpx; |
||||
|
line-height: 47rpx; |
||||
|
border-radius: 23rpx; |
||||
|
text-align: center; |
||||
|
} |
||||
|
.line.active { |
||||
|
color: #0789D0; |
||||
|
background: white; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
.content { |
||||
|
margin: 0 27rpx; |
||||
|
margin-bottom: 60rpx; |
||||
|
border-radius: 13rpx; |
||||
|
overflow: hidden; |
||||
|
position: relative; |
||||
|
z-index: 1; |
||||
|
} |
||||
|
.mapimg { |
||||
|
display: block; |
||||
|
width: 665rpx; |
||||
|
margin: 0 auto; |
||||
|
margin-top: 11rpx; |
||||
|
} |
||||
|
.tags { |
||||
|
display: flex; |
||||
|
overflow-x: auto; |
||||
|
height: 110rpx; |
||||
|
margin-left: 16rpx; |
||||
|
} |
||||
|
.tag { |
||||
|
margin-right: 13rpx; |
||||
|
flex-shrink: 0; |
||||
|
position: relative; |
||||
|
color: #2EAE4F; |
||||
|
} |
||||
|
.tagtext { |
||||
|
padding: 0 20rpx; |
||||
|
background: white; |
||||
|
border-radius: 25rpx; |
||||
|
height: 50rpx; |
||||
|
margin-top: 30rpx; |
||||
|
line-height: 50rpx; |
||||
|
} |
||||
|
.tag.active .tagtext{ |
||||
|
font-weight: 500; |
||||
|
background: rgba(0, 0, 0, 0.4); |
||||
|
color: #fff; |
||||
|
} |
||||
|
.tag.active image { |
||||
|
position: absolute; |
||||
|
width: 24rpx; |
||||
|
height: 13rpx; |
||||
|
left: 50%; |
||||
|
margin-left: -12rpx; |
||||
|
top: 78rpx; |
||||
|
display: block; |
||||
|
} |
||||
|
.item { |
||||
|
display: flex; |
||||
|
width: 665rpx; |
||||
|
height: 207rpx; |
||||
|
margin: 0 auto; |
||||
|
margin-bottom: 17rpx; |
||||
|
background-color: white; |
||||
|
border-radius: 10rpx; |
||||
|
} |
||||
|
.item .headimg { |
||||
|
width: 266rpx; |
||||
|
height: 207rpx; |
||||
|
display: block; |
||||
|
flex-shrink: 0; |
||||
|
margin-right: 33rpx; |
||||
|
} |
||||
|
.right-info { |
||||
|
width: 236rpx; |
||||
|
margin-right: 30rpx; |
||||
|
flex: 1; |
||||
|
} |
||||
|
.title { |
||||
|
font-size: 36rpx; |
||||
|
font-weight: 500; |
||||
|
color: #2A2A2A; |
||||
|
margin-top: 20rpx; |
||||
|
} |
||||
|
.subtitle { |
||||
|
font-size: 24rpx !important; |
||||
|
color: #00A5AF; |
||||
|
margin-top: 10rpx; |
||||
|
line-height: 32rpx; |
||||
|
height: 32rpx; |
||||
|
} |
||||
|
.right-bottom { |
||||
|
display: flex; |
||||
|
justify-content: flex-end; |
||||
|
} |
||||
|
.right-bottom view { |
||||
|
width: 153rpx; |
||||
|
line-height: 47rpx; |
||||
|
background: #00A5AF; |
||||
|
border-radius: 23rpx; |
||||
|
text-align: center; |
||||
|
color: #FFFFFF; |
||||
|
font-size: 27rpx; |
||||
|
margin-top: 20rpx; |
||||
|
} |
||||
|
.morebtn { |
||||
|
width: 227rpx; |
||||
|
border: 1rpx solid #FFFFFF; |
||||
|
border-radius: 27rpx; |
||||
|
line-height: 52rpx; |
||||
|
text-align: center; |
||||
|
color: #fff; |
||||
|
font-size: 25rpx; |
||||
|
margin: 30rpx auto; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
.morebtn text { |
||||
|
font-size: 18rpx; |
||||
|
margin-left: 6rpx; |
||||
|
} |
||||
|
.bottomimg { |
||||
|
position: absolute; |
||||
|
left: 0; |
||||
|
bottom: 0; |
||||
|
} |
||||
|
.textimg { |
||||
|
width: 301rpx; |
||||
|
display: block; |
||||
|
margin: 0 auto; |
||||
|
margin-top: 64rpx; |
||||
|
} |
||||
|
.topbtn { |
||||
|
width: 83rpx; |
||||
|
height: 83rpx; |
||||
|
background: #3795FF; |
||||
|
opacity: 0.7; |
||||
|
border-radius: 50%; |
||||
|
position: fixed; |
||||
|
right: 27rpx; |
||||
|
bottom: 171rpx; |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
font-size: 25rpx; |
||||
|
color: #fff; |
||||
|
flex-direction: column; |
||||
|
z-index: 2; |
||||
|
} |
||||
|
.topbtn image { |
||||
|
width: 25rpx; |
||||
|
height: 25rpx; |
||||
|
} |
||||
|
.fixed-lines { |
||||
|
position: fixed; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
z-index: 2; |
||||
|
margin-top: -949rpx; |
||||
|
} |
||||
Loading…
Reference in new issue