Commit 86b58be9ba02b51c65cee03d347b53bc2dd21aad

Authored by vking
1 parent 07358204

master-activity

... ... @@ -34,7 +34,8 @@
"pages/me/history",
"pages/reserve/remark",
"pages/reserve/findSeller",
"pages/customer/cancel"
"pages/customer/cancel",
"pack-activity/pages/index"
],
"subpackages": [
{
... ...
// pack-activity/pages/index.js
Page({
/**
* 页面的初始数据
*/
data: {
activity:{
id:1,
background:'#F04866',
banner:'http://qn.colorcun.com/activity/images/banner.png',
list:[
{
id:1,
name:'开工专享红包',
desc:'开工福利,胡吃海喝',
money:'18.8',
icon:'http://qn.colorcun.com/activity/images/icon.png',
status:0,
},
{
id:2,
name:'开工专享红包',
desc:'开工福利,胡吃海喝',
money:'18.8',
icon:'http://qn.colorcun.com/activity/images/icon.png',
status:1,
},
{
id:3,
name:'开工专享红包',
desc:'开工福利,胡吃海喝',
money:'18.8',
icon:'http://qn.colorcun.com/activity/images/icon.png',
status:2,
},
{
id:4,
name:'开工专享红包',
desc:'开工福利,胡吃海喝',
money:'18.8',
icon:'http://qn.colorcun.com/activity/images/icon.png',
status:0,
},
],
},
count:999.99.toFixed(2),
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{
"backgroundTextStyle":"light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTextStyle":"black",
"usingComponents": {
"nav":"/components/nav/nav"
}
}
\ No newline at end of file
... ...
<!--pack-activity/pages/index.wxml-->
<nav hasHome>activity</nav>
<view class="pages" style="background-color: {{activity.background}}">
<view class="banner">
<image mode="widthFix" src="{{activity.banner}}" style="width: 100%"></image>
<view class="guize">活动 规则</view>
</view>
<view class="content">
<view class="tips flex-lr">
<view>活动累计收入:{{count}}元</view>
<view class="flex-rr">
查看余额
<view class="more"></view>
</view>
</view>
<view class="list">
<view class="header flex-cc">
<view class="header-img lt"></view>
<view class="header-txt">完成任务得红包</view>
<view class="header-img gt"></view>
</view>
<view class="item flex-lr" wx:for="{{activity.list}}" wx:key="list">
<image class="icon" src="{{item.icon}}" mode="aspectFit"></image>
<view class="item-content">
<view class="item-title">{{item.name}}</view>
<view class="item-desc">{{item.desc}}</view>
</view>
<view class="opt">
<view class="opt-button status{{item.status}}">{{['领取奖励','去完成','去查看'][item.status]}}</view>
<view class="opt-money">{{item.money}}元红包</view>
</view>
</view>
</view>
<view class="share-but">分享活动</view>
</view>
</view>
... ...
/* pack-activity/pages/index.wxss */
.pages{
}
.banner{
width:100%;
background:linear-gradient(202deg,rgba(213,45,182,1) 0%,rgba(240,72,102,1) 100%);
position: relative;
}
.content{
height: 1020rpx;
width: calc(100% - 40rpx);
margin: 0 20rpx 0;
}
.tips{
width:100%;
height:50rpx;
background:rgba(53,53,53,0.3);
border-radius:30rpx;
box-sizing: border-box;
padding: 0 28rpx 0 40rpx;
font-size:24rpx;
font-weight:500;
color:rgba(255,255,255,1);
line-height:50rpx;
}
.more{
background-image: url("http://qn.colorcun.com/activity/images/more.png");
margin-left: 22rpx;
}
.guize{
width:40rpx;
height:120rpx;
background:rgba(53,53,53,0.29);
border-radius:10rpx 0rpx 0rpx 10rpx;
padding: 2rpx 10rpx 0;
box-sizing: border-box;
font-size:20rpx;
font-weight:500;
color:rgba(255,255,255,1);
line-height:28rpx;
position: absolute;
top:20rpx;
right:0;
}
.list{
background:rgba(255,255,255,1);
box-shadow:4rpx 4rpx 6rpx 4rpx rgba(218,61,69,1);
border-radius:20rpx;
margin-top: 20rpx;
box-sizing: border-box;
padding-top: 60rpx;
padding-bottom: 60rpx;
}
.header{
margin-bottom: 60rpx;
}
.header .header-txt{
width:236rpx;
height:44rpx;
font-size:32rpx;
font-weight:600;
color:rgba(204,17,39,1);
line-height:44rpx;
margin: 0 20rpx;
}
.header-img{
background-size: 100% 100%;
width: 70rpx;
height: 16rpx;
}
.header-img.gt{
background-image: url("http://qn.colorcun.com/activity/images/lt.png");
}
.header-img.lt{
background-image: url("http://qn.colorcun.com/activity/images/gt.png");
}
.list .item{
margin-bottom: 60rpx;
height: 94rpx;
padding: 0 20rpx;
box-sizing: border-box;
}
.list .item:last-child{
margin-bottom: 0;
}
.item .icon{
width: 94rpx;
height: 94rpx;
min-width: 94rpx;
}
.item-content{
margin-left: 10rpx;
width: 100%;
}
.opt{
width: 130rpx;
min-width: 130rpx;
}
.item-title{
height:44rpx;
font-size:32rpx;
font-weight:600;
color:rgba(53,53,53,1);
line-height:44rpx;
}
.item-desc{
height:34rpx;
font-size:24rpx;
font-weight:500;
color:rgba(153,153,153,1);
line-height:34rpx;
margin-top: 10rpx;
}
.opt-money{
height:28rpx;
font-size:20rpx;
font-weight:600;
color:rgba(230,34,57,1);
line-height:28rpx;
margin-top: 10rpx;
}
.opt-button{
box-sizing: border-box;
width:130rpx;
height:50rpx;
border-radius:25rpx;
border:2rpx solid rgba(235,41,65,1);
font-size:24rpx;
font-weight:600;
color:rgba(230,34,57,1);
line-height:50rpx;
text-align: center;
}
.opt-button.status0,.opt-button.status1{
background:linear-gradient(180deg,rgba(225,27,49,1) 0%,rgba(243,53,78,1) 100%);
box-shadow:0rpx 2rpx 4rpx 0rpx rgba(232,37,60,1),2rpx 0rpx 6rpx 0rpx rgba(255,172,171,1);
color:rgba(255,227,192,1);
}
.share-but{
width:400rpx;
height:80rpx;
background:linear-gradient(180deg,rgba(252,190,38,1) 0%,rgba(255,233,128,1) 100%);
box-shadow:0rpx 4rpx 8rpx 0rpx rgba(182,43,68,1);
border-radius:40rpx;
margin-top: 40rpx;
font-size:32rpx;
font-weight:600;
color:rgba(230,34,57,1);
line-height:80rpx;
text-align: center;
margin-left: calc(50% - 200rpx);
}
\ No newline at end of file
... ...
... ... @@ -595,6 +595,13 @@
"pathName": "pages/customer/cancel",
"query": "id=58241",
"scene": null
},
{
"id": -1,
"name": "pack-activity/pages/index",
"pathName": "pack-activity/pages/index",
"query": "id=1",
"scene": null
}
]
}
... ...