lfs3
7 years ago
13 changed files with 790 additions and 9 deletions
Unified View
Diff Options
-
6app.js
-
11app.json
-
BINimages/activity_banner.png
-
BINimages/开团按钮.png
-
148pages/activity_detail/activity_detail.js
-
3pages/activity_detail/activity_detail.json
-
66pages/activity_detail/activity_detail.wxml
-
224pages/activity_detail/activity_detail.wxss
-
195pages/index/index.js
-
5pages/index/index.json
-
29pages/index/index.wxml
-
110pages/index/index.wxss
-
2pages/jz/jz.wxss
| Before | After |
|---|---|
|
|
| Width: 1125 | Height: 315 | Size: 358 KiB |
| Before | After |
|---|---|
|
|
| Width: 705 | Height: 135 | Size: 63 KiB |
@ -0,0 +1,148 @@ |
|||||
|
//获取应用实例
|
||||
|
const app = getApp() |
||||
|
|
||||
|
var WxParse = require('../../wxParse/wxParse.js');//主要为了能够显示获取的html代码
|
||||
|
|
||||
|
Page({ |
||||
|
|
||||
|
/** |
||||
|
* 页面的初始数据 |
||||
|
*/ |
||||
|
data: { |
||||
|
bottomBGColor: '#21BE8D',//
|
||||
|
buttomText: '我要开团', |
||||
|
rule_image_height:0,//活动规则图片高度
|
||||
|
detail_image_height: 0,//活动详情图片高度
|
||||
|
bannerImage: '/images/activity_banner.png', |
||||
|
ruleImage: '/images/banner1.png', |
||||
|
countDownDay: 0, |
||||
|
countDownHour: 0, |
||||
|
countDownMinute: 0, |
||||
|
countDownSecond: 0, |
||||
|
memberList:[], |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
*活动倒计时方法 |
||||
|
*/ |
||||
|
countActivityTime: function (timeStamp){ |
||||
|
var totalSecond = timeStamp - Date.parse(new Date()) / 1000; |
||||
|
|
||||
|
var interval = setInterval(function () { |
||||
|
// 秒数
|
||||
|
var second = totalSecond; |
||||
|
|
||||
|
// 天数位
|
||||
|
var day = Math.floor(second / 3600 / 24); |
||||
|
var dayStr = day.toString(); |
||||
|
if (dayStr.length == 1) dayStr = '0' + dayStr; |
||||
|
|
||||
|
// 小时位
|
||||
|
var hr = Math.floor((second - day * 3600 * 24) / 3600); |
||||
|
var hrStr = hr.toString(); |
||||
|
if (hrStr.length == 1) hrStr = '0' + hrStr; |
||||
|
|
||||
|
// 分钟位
|
||||
|
var min = Math.floor((second - day * 3600 * 24 - hr * 3600) / 60); |
||||
|
var minStr = min.toString(); |
||||
|
if (minStr.length == 1) minStr = '0' + minStr; |
||||
|
|
||||
|
// 秒位
|
||||
|
var sec = second - day * 3600 * 24 - hr * 3600 - min * 60; |
||||
|
var secStr = sec.toString(); |
||||
|
if (secStr.length == 1) secStr = '0' + secStr; |
||||
|
|
||||
|
this.setData({ |
||||
|
countDownDay: dayStr, |
||||
|
countDownHour: hrStr, |
||||
|
countDownMinute: minStr, |
||||
|
countDownSecond: secStr, |
||||
|
}); |
||||
|
totalSecond--; |
||||
|
if (totalSecond < 0) { |
||||
|
clearInterval(interval); |
||||
|
wx.showToast({ |
||||
|
title: '活动已结束', |
||||
|
}); |
||||
|
this.setData({ |
||||
|
countDownDay: '00', |
||||
|
countDownHour: '00', |
||||
|
countDownMinute: '00', |
||||
|
countDownSecond: '00', |
||||
|
}); |
||||
|
} |
||||
|
}.bind(this), 1000); |
||||
|
}, |
||||
|
// 图片加载
|
||||
|
ruleImageLoad: function (image) { |
||||
|
var app = getApp(); |
||||
|
console.log(image) |
||||
|
var imageHeight = app.gw.systemInfo.windowWidth / image.detail.width * image.detail.height; |
||||
|
this.setData({ |
||||
|
rule_image_height: imageHeight |
||||
|
}) |
||||
|
}, |
||||
|
detailImageLoad: function (image) { |
||||
|
var app = getApp(); |
||||
|
console.log(image) |
||||
|
var imageHeight = app.gw.systemInfo.windowWidth / image.detail.width * image.detail.height; |
||||
|
this.setData({ |
||||
|
detail_image_height: imageHeight |
||||
|
}) |
||||
|
}, |
||||
|
/** |
||||
|
* 生命周期函数--监听页面加载 |
||||
|
*/ |
||||
|
onLoad: function (options) { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面初次渲染完成 |
||||
|
*/ |
||||
|
onReady: function () { |
||||
|
this.countActivityTime(1527609600); |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面显示 |
||||
|
*/ |
||||
|
onShow: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面隐藏 |
||||
|
*/ |
||||
|
onHide: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面卸载 |
||||
|
*/ |
||||
|
onUnload: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面相关事件处理函数--监听用户下拉动作 |
||||
|
*/ |
||||
|
onPullDownRefresh: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面上拉触底事件的处理函数 |
||||
|
*/ |
||||
|
onReachBottom: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 用户点击右上角分享 |
||||
|
*/ |
||||
|
onShareAppMessage: function () { |
||||
|
|
||||
|
} |
||||
|
}) |
||||
@ -0,0 +1,3 @@ |
|||||
|
{ |
||||
|
"navigationBarTitleText": "活动详情" |
||||
|
} |
||||
@ -0,0 +1,66 @@ |
|||||
|
<import src="../../wxParse/wxParse.wxml" /> |
||||
|
<view class="content"> |
||||
|
<scroll-view scroll-x="{{false}}" scroll-y="{{true}}"> |
||||
|
<image src="{{bannerImage}}" class="slide-image" mode='widthFix' /> |
||||
|
<view class='activity_info'> |
||||
|
<text class='title'>家政节大作战</text> |
||||
|
<view class="row"> |
||||
|
<text class="num">20人团</text> |
||||
|
<text class="limit_type">新老用户均可参团</text> |
||||
|
</view> |
||||
|
<view class="row" style='padding-top: 10rpx;'> |
||||
|
<text class="sucess_tip">拼团成功人均获得一张</text> |
||||
|
<text class="sucess_card">高端保洁铂金月卡</text> |
||||
|
</view> |
||||
|
<view class="price_row"> |
||||
|
<view style='float: left;'> |
||||
|
<text class="common666">原价：</text> |
||||
|
<text class="common666">200元</text> |
||||
|
</view> |
||||
|
<view style='float: left;'> |
||||
|
<text class="common666">团长价：</text> |
||||
|
<text class="commonRed">499</text> |
||||
|
</view> |
||||
|
<view style='float: left;'> |
||||
|
<text class="common666">团员价：</text> |
||||
|
<text class="commonRed">499</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class='grounp_info'> |
||||
|
<view class='status'> |
||||
|
<text class="tag">拼团中</text> |
||||
|
<view class='remark'>还差 |
||||
|
<text class='num'>4</text>人拼团成功 |
||||
|
</view> |
||||
|
<view class="countDownTimeView"> |
||||
|
<text class="countDownTimeText">{{countDownDay}}天</text> |
||||
|
<text class="countDownTimeText">{{countDownHour}}时</text> |
||||
|
<text class="countDownTimeText">{{countDownMinute}}分</text> |
||||
|
<text class="countDownTimeText">{{countDownSecond}}秒</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class='list'> |
||||
|
<scroll-view scroll-x="{{true}}" scroll-y="{{false}}" class='list'> |
||||
|
<view class='view'> |
||||
|
<view wx:for-items="{{memberList}}" class="memberList"> |
||||
|
<image class='headImage' src='{{item.headUrl}}'></image> |
||||
|
<text class="{{item.memberType == 0 ? 'markBlock' : 'markNone'}}">团长</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</scroll-view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<image src="{{ruleImage}}" bindload="ruleImageLoad" style="width:100%;margin: 5rpx auto;height:{{rule_image_height}}px"></image> |
||||
|
<view class="global_focus intro-box" style='margin: 5rpx auto;'> |
||||
|
<template is="wxParse" data="{{wxParseData:activityDetail.nodes}}" /> |
||||
|
</view> |
||||
|
</scroll-view> |
||||
|
<view class='bottom_view'> |
||||
|
<view class='one_content' id='one_button' style='background-color:{{bottomBGColor}};'>{{buttomText}}</view> |
||||
|
<view class='two_content' id='two_content'> |
||||
|
<view class='left'>￥499</view> |
||||
|
<view class='right'>{{buttomText}}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
@ -0,0 +1,224 @@ |
|||||
|
.content{ |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
|
image{ |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
|
.activity_info{ |
||||
|
width: 100%; |
||||
|
background: white; |
||||
|
height: 220rpx; |
||||
|
margin: -10rpx auto; |
||||
|
} |
||||
|
.activity_info .title{ |
||||
|
width: 80%; |
||||
|
padding-top: 29rpx; |
||||
|
padding-left: 36rpx; |
||||
|
font-weight: bold; |
||||
|
font-size: 36rpx; |
||||
|
} |
||||
|
.activity_info .row{ |
||||
|
width: 100%; |
||||
|
height: 40rpx; |
||||
|
float: left; |
||||
|
} |
||||
|
.activity_info .row .num{ |
||||
|
padding: 5rpx 20rpx; |
||||
|
font-size: 20rpx; |
||||
|
width:150px; |
||||
|
height:36px; |
||||
|
background:rgba(255,160,67,1); |
||||
|
border-radius:18px; |
||||
|
margin-left: 26rpx; |
||||
|
text-align: center; |
||||
|
color: white; |
||||
|
} |
||||
|
.activity_info .row .limit_type{ |
||||
|
padding-left: 20rpx; |
||||
|
height: 100%; |
||||
|
font-size: 20rpx; |
||||
|
color: #F44053; |
||||
|
} |
||||
|
|
||||
|
.activity_info .row .sucess_tip{ |
||||
|
margin-left: 26rpx; |
||||
|
color: #666666; |
||||
|
font-size: 20rpx; |
||||
|
} |
||||
|
|
||||
|
.activity_info .row .sucess_card{ |
||||
|
margin-left: 13rpx; |
||||
|
color: #333333; |
||||
|
font-size: 24rpx; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
|
||||
|
.activity_info .price_row{ |
||||
|
height: 40px; |
||||
|
position: absolute; |
||||
|
left: 13px; |
||||
|
right: 20px; |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
flex-wrap: nowrap; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
padding-top: 45px; |
||||
|
} |
||||
|
|
||||
|
.common666{ |
||||
|
color: #999; |
||||
|
font-size: 24rpx; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.commonRed{ |
||||
|
color: #F44053; |
||||
|
font-size: 32rpx; |
||||
|
} |
||||
|
|
||||
|
.grounp_info{ |
||||
|
width: 100%; |
||||
|
background: white; |
||||
|
height: 220rpx; |
||||
|
margin: 30rpx auto; |
||||
|
} |
||||
|
|
||||
|
.grounp_info .status{ |
||||
|
width: 100%; |
||||
|
height: 80rpx; |
||||
|
margin: 10rpx auto; |
||||
|
} |
||||
|
|
||||
|
.grounp_info .status .tag{ |
||||
|
padding: 5rpx 20rpx; |
||||
|
font-size: 20rpx; |
||||
|
width:110px; |
||||
|
height:36px; |
||||
|
border-radius:18px; |
||||
|
border-width: 2rpx; |
||||
|
border-style: solid; |
||||
|
border-color: #F8B551; |
||||
|
margin-left: 26rpx; |
||||
|
color: #F8B551; |
||||
|
} |
||||
|
|
||||
|
.grounp_info .status .remark{ |
||||
|
width: 300rpx; |
||||
|
height: 30rpx; |
||||
|
margin: -45rpx 150rpx auto; |
||||
|
color: #666666; |
||||
|
font-size: 26rpx; |
||||
|
} |
||||
|
|
||||
|
.grounp_info .status .remark .num{ |
||||
|
color: #F44053; |
||||
|
font-size: 26rpx; |
||||
|
} |
||||
|
|
||||
|
.grounp_info .status .countDownTimeView{ |
||||
|
width: 300rpx; |
||||
|
height: 20rpx; |
||||
|
margin: -15rpx 150rpx auto; |
||||
|
} |
||||
|
|
||||
|
.grounp_info .status .countDownTimeView .countDownTimeText{ |
||||
|
color: #999999; |
||||
|
font-size: 20rpx; |
||||
|
} |
||||
|
|
||||
|
.grounp_info .list{ |
||||
|
width: 98%; |
||||
|
height: 120rpx; |
||||
|
margin: -10rpx auto; |
||||
|
margin-left: 13rpx; |
||||
|
} |
||||
|
|
||||
|
.grounp_info .list .view{ |
||||
|
width: 100%; |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
} |
||||
|
|
||||
|
.grounp_info .list .view .memberList{ |
||||
|
height: 100rpx; |
||||
|
width: 100rpx; |
||||
|
display: inline-block; |
||||
|
margin: 10rpx 10rpx auto; |
||||
|
position: relative; |
||||
|
|
||||
|
} |
||||
|
.grounp_info .list .view .memberList .headImage{ |
||||
|
height: 86rpx; |
||||
|
width: 86rpx; |
||||
|
border-radius:43rpx; |
||||
|
margin: 7rpx auto; |
||||
|
} |
||||
|
|
||||
|
.grounp_info .list .view .memberList .markBlock{ |
||||
|
display: block; |
||||
|
padding: 1rpx 4rpx; |
||||
|
font-size: 16rpx; |
||||
|
width:20px; |
||||
|
background:#21BE8D; |
||||
|
border-radius:10px; |
||||
|
margin-left: 26rpx; |
||||
|
text-align: center; |
||||
|
color: white; |
||||
|
position: absolute; |
||||
|
top: 3px; |
||||
|
right: -1px; |
||||
|
} |
||||
|
|
||||
|
.grounp_info .list .view .memberList .markNone{ |
||||
|
display: none; |
||||
|
} |
||||
|
|
||||
|
.bottom_view{ |
||||
|
width:100%; |
||||
|
height: 50px; |
||||
|
position:fixed; |
||||
|
bottom:0; |
||||
|
} |
||||
|
|
||||
|
.bottom_view .one_content{ |
||||
|
width:100%; |
||||
|
line-height: 50px; |
||||
|
color: white; |
||||
|
text-align: center; |
||||
|
font-size: 16px; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.bottom_view .two_content{ |
||||
|
width:100%; |
||||
|
line-height: 50px; |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
flex-wrap: nowrap; |
||||
|
justify-content: space-between; |
||||
|
} |
||||
|
|
||||
|
.bottom_view .two_content .left{ |
||||
|
width: 35%; |
||||
|
line-height: 50px; |
||||
|
font-size: 16px; |
||||
|
color: #F44054; |
||||
|
font-weight: bold; |
||||
|
margin-left: 0px; |
||||
|
background-color: white; |
||||
|
text-align: center; |
||||
|
} |
||||
|
.bottom_view .two_content .right{ |
||||
|
width: 65%; |
||||
|
line-height: 50px; |
||||
|
font-size: 16px; |
||||
|
color: white; |
||||
|
font-weight: bold; |
||||
|
margin-right: 0px; |
||||
|
background:#F36619; |
||||
|
text-align: center; |
||||
|
} |
||||
@ -0,0 +1,195 @@ |
|||||
|
//获取应用实例
|
||||
|
const app = getApp() |
||||
|
|
||||
|
Page({ |
||||
|
/** |
||||
|
* 页面的初始数据 |
||||
|
*/ |
||||
|
data: { |
||||
|
indicatorDots: true, |
||||
|
autoplay: true, |
||||
|
interval: 5000, |
||||
|
duration: 1000, |
||||
|
imgUrls: [], |
||||
|
// bannerImage: '/images/activity_banner.png',
|
||||
|
menu_list:[ |
||||
|
{ name: '拼团', disabled:false, className:'green_button'}, |
||||
|
{ name: '秒杀', disabled: true, className: 'gray_button' }, |
||||
|
{ name: '夺宝', disabled: true, className: 'gray_button' } |
||||
|
], |
||||
|
nowDate: new Date().getTime(), |
||||
|
cityId: 440100000, |
||||
|
addrArray: { id: [440100000, 430426000], name: ['广州', '祁东'] }, |
||||
|
addrIndex: 0, |
||||
|
activityList: [], |
||||
|
pageNum: 1, |
||||
|
pageSize: 20, |
||||
|
hasMoreData: true, |
||||
|
img1: '/images/activity_banner.png', |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面加载 |
||||
|
*/ |
||||
|
onLoad: function (options) { |
||||
|
let that = this; |
||||
|
wx.request({ |
||||
|
url: app.gw.hostUrl + '/mall/wxa/activity/banner', |
||||
|
method: 'get', |
||||
|
data: { |
||||
|
merchantNo: 2 |
||||
|
}, |
||||
|
header: { |
||||
|
'Content-Type': 'application/x-www-form-urlencoded' |
||||
|
}, |
||||
|
success: function (res){ |
||||
|
var data = res.data; |
||||
|
var status = data.code; |
||||
|
if (status == 0) { |
||||
|
var data = res.data; |
||||
|
var status = data.code; |
||||
|
console.log(res); |
||||
|
that.setData({ |
||||
|
imgUrls: data.response |
||||
|
}) |
||||
|
} else { |
||||
|
wx.showToast({ |
||||
|
title: data.msg, |
||||
|
icon: 'none', |
||||
|
duration: 3000 |
||||
|
}); |
||||
|
return; |
||||
|
} |
||||
|
}, |
||||
|
fail: function (res) { |
||||
|
wx.showToast({ |
||||
|
title: '加载数据失败', |
||||
|
}); |
||||
|
}, |
||||
|
}), |
||||
|
this.getActivityList(); |
||||
|
}, |
||||
|
|
||||
|
getActivityList: function(){ |
||||
|
let that = this; |
||||
|
wx.showNavigationBarLoading() //在标题栏中显示加载
|
||||
|
wx.request({ |
||||
|
url: app.gw.hostUrl + '/mall/wxa/activity/list', |
||||
|
method: 'get', |
||||
|
data: { |
||||
|
pageNum: that.data.pageNum, |
||||
|
pageSize: that.data.pageSize |
||||
|
}, |
||||
|
header: { |
||||
|
'Content-Type': 'application/x-www-form-urlencoded' |
||||
|
}, |
||||
|
success: function (res) { |
||||
|
var data = res.data; |
||||
|
var status = data.code; |
||||
|
console.log(res); |
||||
|
var activitylistTem = that.data.activityList; |
||||
|
if (status == 0) { |
||||
|
if (that.data.pageNum == 1) { |
||||
|
//刷新清空数据
|
||||
|
activitylistTem = []; |
||||
|
} |
||||
|
var list = data.response; |
||||
|
if (list.length < that.data.pageSize) { |
||||
|
//最后一页数据添加
|
||||
|
that.setData({ |
||||
|
activityList: activitylistTem.concat(list), |
||||
|
hasMoreData: false |
||||
|
}); |
||||
|
} else { |
||||
|
that.setData({ |
||||
|
activityList: activitylistTem.concat(list), |
||||
|
hasMoreData: true, |
||||
|
pageNum: that.data.pageNum + 1 |
||||
|
}); |
||||
|
} |
||||
|
} else { |
||||
|
wx.showToast({ |
||||
|
title: data.msg, |
||||
|
icon: 'none', |
||||
|
duration: 3000 |
||||
|
}); |
||||
|
return; |
||||
|
} |
||||
|
}, |
||||
|
fail:function(res) { |
||||
|
wx.showToast({ |
||||
|
title: '加载数据失败', |
||||
|
}); |
||||
|
}, |
||||
|
complete: function (res) { |
||||
|
// complete
|
||||
|
wx.hideNavigationBarLoading() //完成停止加载
|
||||
|
wx.stopPullDownRefresh() //停止下拉刷新
|
||||
|
}, |
||||
|
|
||||
|
}) |
||||
|
}, |
||||
|
/** |
||||
|
* 生命周期函数--监听页面初次渲染完成 |
||||
|
*/ |
||||
|
onReady: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面显示 |
||||
|
*/ |
||||
|
onShow: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面隐藏 |
||||
|
*/ |
||||
|
onHide: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面卸载 |
||||
|
*/ |
||||
|
onUnload: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面相关事件处理函数--监听用户下拉动作 |
||||
|
*/ |
||||
|
onPullDownRefresh: function () { |
||||
|
this.data.pageNum = 1; |
||||
|
this.getActivityList(); |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面上拉触底事件的处理函数 |
||||
|
*/ |
||||
|
onReachBottom: function () { |
||||
|
if (this.data.hasMoreData) { |
||||
|
this.getActivityList(); |
||||
|
} else { |
||||
|
wx.showToast({ |
||||
|
title: '没有更多数据', |
||||
|
}) |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 用户点击右上角分享 |
||||
|
*/ |
||||
|
onShareAppMessage: function () { |
||||
|
|
||||
|
}, |
||||
|
getUserInfo: function (e) { |
||||
|
console.log(e) |
||||
|
app.globalData.userInfo = e.detail.userInfo |
||||
|
this.setData({ |
||||
|
userInfo: e.detail.userInfo, |
||||
|
hasUserInfo: true |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
@ -0,0 +1,5 @@ |
|||||
|
{ |
||||
|
"navigationBarTitleText": "活动中心", |
||||
|
"enablePullDownRefresh": true, |
||||
|
"backgroundColor": "#26AE76" |
||||
|
} |
||||
@ -0,0 +1,29 @@ |
|||||
|
<!--pages/index/index.wxml--> |
||||
|
<view class="content"> |
||||
|
<swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}"> |
||||
|
<block wx:for="{{imgUrls}}"> |
||||
|
<swiper-item> |
||||
|
<image src="{{item.imgUrl}}" class="slide-image" mode='widthFill' /> |
||||
|
</swiper-item> |
||||
|
</block> |
||||
|
</swiper> |
||||
|
<view class='menu'> |
||||
|
<view class='list'> |
||||
|
<view wx:for-items="{{menu_list}}" wx:if="{{index < 4}}" class="view"> |
||||
|
<button class='{{item.className}}'>{{item.name}}</button> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view wx:for-items="{{activityList}}"> |
||||
|
<view class='activity_list_view' bindtap='loading' data-item='{{item.goodsNo}}'> |
||||
|
<image src='{{item.showUrl}}' class='image'></image> |
||||
|
<!-- <text class="num">20人团</text> --> |
||||
|
<text class="p1">{{item.activityName}}</text> |
||||
|
<view class="p3"> |
||||
|
<view class='p2'>¥</view>{{item.participantPrice / 100}} |
||||
|
<text class="del">原价:{{item.originalPrice / 100}}</text> |
||||
|
</view> |
||||
|
<button class='openBtn' form-type="submit">去开团</button> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
@ -0,0 +1,110 @@ |
|||||
|
.content{ |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
|
image{ |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
|
|
||||
|
.menu{ |
||||
|
width: 100%; |
||||
|
background: white; |
||||
|
height: 90rpx; |
||||
|
margin: -10rpx auto; |
||||
|
} |
||||
|
|
||||
|
.menu .list{ |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
|
|
||||
|
.menu .list .view{ |
||||
|
height: 46rpx; |
||||
|
width: 150rpx; |
||||
|
float: left; |
||||
|
margin: 22rpx auto; |
||||
|
} |
||||
|
.menu .list .view .green_button{ |
||||
|
line-height: 46rpx; |
||||
|
width: 130rpx; |
||||
|
background: #21BE8D; |
||||
|
color: white; |
||||
|
font-size: 26rpx; |
||||
|
} |
||||
|
|
||||
|
.menu .list .view .gray_button{ |
||||
|
line-height: 46rpx; |
||||
|
width: 130rpx; |
||||
|
background: #E5E5E5; |
||||
|
color: gray; |
||||
|
font-size: 26rpx; |
||||
|
} |
||||
|
|
||||
|
/*商品列表*/ |
||||
|
.activity_list_view{ |
||||
|
margin: 30rpx 35rpx 11rpx 35rpx; |
||||
|
background: white; |
||||
|
height: 623rpx; |
||||
|
border-radius: 10rpx; |
||||
|
text-align:center; |
||||
|
} |
||||
|
.activity_list_view .image{ |
||||
|
height: 350rpx; |
||||
|
border-radius: 10rpx 10rpx 0 0; |
||||
|
} |
||||
|
|
||||
|
.activity_list_view .num{ |
||||
|
padding: 5rpx 20rpx; |
||||
|
font-size: 20rpx; |
||||
|
width:150px; |
||||
|
height:36px; |
||||
|
background:rgba(255,160,67,1); |
||||
|
border-radius: 0rpx 10rpx 0 10rpx; |
||||
|
text-align: center; |
||||
|
color: white; |
||||
|
position: relative; |
||||
|
margin-right: 10px; |
||||
|
margin-top: 0px; |
||||
|
} |
||||
|
.activity_list_view .p1{ |
||||
|
font-size: 40rpx; |
||||
|
color: #191919; |
||||
|
position: relative; |
||||
|
width: 90%; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
.activity_list_view .p2{ |
||||
|
font-size: 32rpx; |
||||
|
display: inline-block; |
||||
|
} |
||||
|
.activity_list_view .p3{ |
||||
|
color: #ff4040; |
||||
|
font-size: 40rpx; |
||||
|
font-family: '微软雅黑 Light'; |
||||
|
font-weight: bold; |
||||
|
margin: 40rpx 0; |
||||
|
width: 100%; |
||||
|
text-align:center; |
||||
|
} |
||||
|
|
||||
|
.activity_list_view .del{ |
||||
|
color: #c0c0c0; |
||||
|
font-size: 28rpx; |
||||
|
margin-left: 20rpx; |
||||
|
position:absolute; |
||||
|
margin-top: 10rpx; |
||||
|
font-family: "微软雅黑 Light"; |
||||
|
font-weight: bold; |
||||
|
text-decoration: line-through; |
||||
|
} |
||||
|
|
||||
|
.openBtn{ |
||||
|
width: 60%; |
||||
|
margin: -40rpx auto; |
||||
|
text-align: center; |
||||
|
color: #fff; |
||||
|
background: #F44053; |
||||
|
border-radius:20px; |
||||
|
line-height: 80rpx; |
||||
|
} |
||||
Write
Preview
Loading…
Cancel
Save