Commit b99225397ac577f485e72c8d6b6a9ce1f5a5a146
1 parent
cf8ead7e
领取助力任务
Showing
4 changed files
with
395 additions
and
0 deletions
pages/user/assistance/task_assistance.js
0 → 100644
1 | +var auth = require("../../../utils/auth.js"), rq = require("../../../utils/request.js"); | |
2 | +var e = getApp(), app = e, s = e.globalData.setting, os = s, app_d = e.globalData; | |
3 | +var regeneratorRuntime = require('../../../utils/runtime.js'); | |
4 | +Page({ | |
5 | + | |
6 | + /** | |
7 | + * 页面的初始数据 | |
8 | + */ | |
9 | + data: { | |
10 | + sw_index: 0,//轮播的下标控制 | |
11 | + iurl: s.imghost, | |
12 | + is_task:0,//判断标题名是任务1还是2 | |
13 | + activity_data:"25:20:59",//活动剩余时间 | |
14 | + task_number:12,//任务数 | |
15 | + is_task:0,//历史记录与任务 | |
16 | + aitem:[ | |
17 | + { PrivilegeICOUrl:"https://mshopimg.yolipai.net/public/upload/userqy/ppt/2019/08-19/1e53fef14465c1f4db262fd569e78483.jpg",tite_name:'一页纸活动'},{ | |
18 | + PrivilegeICOUrl: "https://mshopimg.yolipai.net/public/upload/userqy/ppt/2019/08-19/aa50f43dc3b9dceff951cb2145c2df3b.jpg", tite_name: '辉煌活动' | |
19 | + },{ | |
20 | + PrivilegeICOUrl: "https://mshopimg.yolipai.net/public/upload/userqy/ppt/2019/08-19/5c2ff38b48ed350f2c54b19f0b9319e0.jpg", tite_name: '密码活动' | |
21 | + },{ | |
22 | + PrivilegeICOUrl: "https://mshopimg.yolipai.net//miniapp/images/plus/card_one.jpg", tite_name: '啊啊活动' | |
23 | + }, | |
24 | + ],//活动的轮播图 | |
25 | + switch_head: 0, //0:我的任务,1:记录 | |
26 | + }, | |
27 | + | |
28 | + /** | |
29 | + * 生命周期函数--监听页面加载 | |
30 | + */ | |
31 | + onLoad: function (options) { | |
32 | + var th=this; | |
33 | + th.close(); | |
34 | + }, | |
35 | + // 轮播图点击左边 | |
36 | + click_pre:function(){ | |
37 | + var index = this.data.sw_index; | |
38 | + index--; | |
39 | + if (index < 0) return; | |
40 | + this.setData({ sw_index: index }) | |
41 | + | |
42 | + }, | |
43 | + //轮播图点击右边 | |
44 | + click_next:function(){ | |
45 | + var index = this.data.sw_index; | |
46 | + index++; | |
47 | + if (index >= this.data.aitem.length) return; | |
48 | + this.setData({ sw_index: index }) | |
49 | + | |
50 | + }, | |
51 | + //任务领取 | |
52 | + onlicke:function(){ | |
53 | + var th=this; | |
54 | + getApp().my_warnning("任务领取成功", 1, th); | |
55 | + }, | |
56 | + | |
57 | +//我的任务和帮拆记录的替换 | |
58 | + switch_head: function (e) { | |
59 | + var th = this; | |
60 | + var index = e.currentTarget.dataset.index;//获取当前选择的是任务还是活动说明 | |
61 | + var switch_head = th.data.switch_head;//0任务,1活动说明 | |
62 | + if (index != switch_head) { | |
63 | + th.setData({ | |
64 | + switch_head: index, | |
65 | + is_task: index | |
66 | + }) | |
67 | + } | |
68 | + }, | |
69 | + //划动的时候监听 | |
70 | + onSli:function(e){ | |
71 | + | |
72 | + var ind=e.detail.current ; | |
73 | + this.setData({ | |
74 | + sw_index:ind | |
75 | + }) | |
76 | + }, | |
77 | + //关闭导航 | |
78 | + close: function () { | |
79 | + var th = this; | |
80 | + var nav_b = th.selectComponent("#nav_b"); //组件的id | |
81 | + nav_b.close_box(); | |
82 | + nav_b.set_name("助力", ""); | |
83 | + }, | |
84 | + | |
85 | + /** | |
86 | + * 生命周期函数--监听页面初次渲染完成 | |
87 | + */ | |
88 | + onReady: function () { | |
89 | + | |
90 | + }, | |
91 | + | |
92 | + /** | |
93 | + * 生命周期函数--监听页面显示 | |
94 | + */ | |
95 | + onShow: function () { | |
96 | + | |
97 | + }, | |
98 | + | |
99 | + /** | |
100 | + * 生命周期函数--监听页面隐藏 | |
101 | + */ | |
102 | + onHide: function () { | |
103 | + | |
104 | + }, | |
105 | + | |
106 | + /** | |
107 | + * 生命周期函数--监听页面卸载 | |
108 | + */ | |
109 | + onUnload: function () { | |
110 | + | |
111 | + }, | |
112 | + | |
113 | + /** | |
114 | + * 页面相关事件处理函数--监听用户下拉动作 | |
115 | + */ | |
116 | + onPullDownRefresh: function () { | |
117 | + | |
118 | + }, | |
119 | + | |
120 | + /** | |
121 | + * 页面上拉触底事件的处理函数 | |
122 | + */ | |
123 | + onReachBottom: function () { | |
124 | + | |
125 | + }, | |
126 | + | |
127 | + /** | |
128 | + * 用户点击右上角分享 | |
129 | + */ | |
130 | + onShareAppMessage: function () { | |
131 | + | |
132 | + } | |
133 | +}) | |
0 | 134 | \ No newline at end of file | ... | ... |
pages/user/assistance/task_assistance.json
0 → 100644
pages/user/assistance/task_assistance.wxml
0 → 100644
1 | +<view class="top-back" style="background-image: url({{iurl}}/miniapp/images/friendhelp/lumi.png)"> | |
2 | + <!-- 助力活动头部 --> | |
3 | + <view class="top-frame"> | |
4 | + <view class="top-title white fs36 t-c"> | |
5 | + {{aitem[sw_index].tite_name}} | |
6 | + </view> | |
7 | + <view class="activity-data t-c fs28 white"> | |
8 | + 活动剩余时间: {{activity_data}} | |
9 | + </view> | |
10 | + </view> | |
11 | + <!-- 图片的轮播图 --> | |
12 | + <view class="xc-specific-more-frame flex-center"> | |
13 | + <view bindtap="click_pre"> | |
14 | + <view class="bg_left xc-left bcolor"></view> | |
15 | + </view> | |
16 | + <swiper current="{{sw_index}}" style='width:82.7%; height:100%' | |
17 | + bindchange='onSli' | |
18 | + indicator-dots="{{false}}" autoplay="{{false}}" > | |
19 | + | |
20 | + <swiper-item wx:for="{{aitem}}" wx:for-item="aitem" wx:for-index="pidx"> | |
21 | + | |
22 | + <image class="xc-center-img "src="{{aitem.PrivilegeICOUrl}}"></image> | |
23 | + | |
24 | + </swiper-item> | |
25 | + | |
26 | + </swiper> | |
27 | + | |
28 | + <view bindtap="click_next"> | |
29 | + <view class="bg_right xc-right bcolor mt" ></view> | |
30 | + </view> | |
31 | + </view> | |
32 | + | |
33 | + <view class="task-number fs28 white t-c "> | |
34 | + 今天剩余可领{{task_number}}个任务 | |
35 | + </view> | |
36 | + <view class="task_clike fs40 t-c flex-center" bindtap="onlicke"> | |
37 | + 就选它了 | |
38 | + </view> | |
39 | +</view> | |
40 | +<!-- 底部列表 --> | |
41 | + <view> | |
42 | + <!-- 标题 --> | |
43 | + | |
44 | + <view class="flex-vertical-between fs28 padding head"> | |
45 | + <view class="flex-center lhead {{switch_head==0?'rhead':''}}" bindtap="switch_head"data-index="0"> | |
46 | + <image class="unfinished" src="../../../images/frinedhelp/task.png" lazy-load="true"></image> | |
47 | + <view >我的任务</view> | |
48 | + </view> | |
49 | + <view class="flex-center lhead {{switch_head==1?'rhead':''}}" bindtap="switch_head" data-index='1'> | |
50 | + <image class="unfinished" style="margin-top: 5rpx;" src="../../../images/frinedhelp/edit.png" lazy-load="true"></image> | |
51 | + <view>帮拆记录</view> | |
52 | + </view> | |
53 | + </view> | |
54 | + | |
55 | + <view class="white"> | |
56 | + <view class="items" wx:if="{{is_task==0}}"> | |
57 | + <view class="item fs26 flex-vertical-between padding" wx:for="{{5}}"> | |
58 | + <view class="flex-center width"> | |
59 | + <view class="ellipsis-1">豪华任务一 | |
60 | + </view> | |
61 | + </view> | |
62 | + | |
63 | + <view class="flex-center width state"> | |
64 | + <view class="ellipsis-1">进行中 | |
65 | + </view> | |
66 | + </view> | |
67 | + | |
68 | + </view> | |
69 | + </view> | |
70 | + </view> | |
71 | + | |
72 | + | |
73 | + <view class="items" wx:if="{{is_task==1}}"> | |
74 | + | |
75 | + | |
76 | + <view class="item fs26 flex flex-vertical-between padding" wx:for="{{5}}"> | |
77 | + <view class="flex white"style="justify-content: space-around; width: 90%;margin:auto"> | |
78 | + <image class="circle user_img" src="https://mshopimg.yolipai.net/public/upload/qyimg/temp/2019/08-14/0697f7277936a3b116a6ebc4f8f5e39a.png"></image> | |
79 | + <view class="ellipsis-1">豪华任务一 | |
80 | + </view> | |
81 | + <view class="ellipsis-1">2019-05-12 | |
82 | + </view> | |
83 | + </view> | |
84 | + | |
85 | + </view> | |
86 | + | |
87 | + </view> | |
88 | + <view class="fs30" wx:if="{{1<0}}"> | |
89 | + <view class="flex-center nothing"> | |
90 | + <view>暂无任务记录</view> | |
91 | + </view> | |
92 | + <view class="flex-center receive"> | |
93 | + <view class="flex-center"> | |
94 | + <view>已有</view> | |
95 | + <view>126</view> | |
96 | + <view>人领取了任务</view> | |
97 | + </view> | |
98 | + </view> | |
99 | + </view> | |
100 | + | |
101 | + </view> | |
102 | + <!-- 加载更多 --> | |
103 | + <view class="fs32 "> | |
104 | + <view class="flex-center"> | |
105 | + <view class="line"></view> | |
106 | + <view class="load white" bindtap="">点击加载更多</view> | |
107 | + <view class="line"></view> | |
108 | + </view> | |
109 | + <view class="flex-center white"style="margin-top: 20rpx;" > | |
110 | + <view>已有</view> | |
111 | + <view>126</view> | |
112 | + <view>人领取了任务</view> | |
113 | + </view> | |
114 | + </view> | |
115 | + | |
116 | +<!-- 引入提示组件 --> | |
117 | +<warn id="warn"></warn> | |
118 | +<!-- 制作一个圆球导航 --> | |
119 | +<nav_b id="nav_b"></nav_b> | |
0 | 120 | \ No newline at end of file | ... | ... |
pages/user/assistance/task_assistance.wxss
0 → 100644
1 | +page{ | |
2 | + background: #d01119; | |
3 | + width: 100%; | |
4 | + height: 100% | |
5 | + | |
6 | +} | |
7 | +.top-back{ | |
8 | + width: 100%; | |
9 | + height: 60%; | |
10 | + background-repead:no-repead; | |
11 | + background-size:100% 100%; | |
12 | + | |
13 | +} | |
14 | +.top-frame{ | |
15 | + width: 100%; | |
16 | + height: auto; | |
17 | + padding-top: 50rpx | |
18 | +} | |
19 | +.top-title{ | |
20 | + letter-spacing:10rpx | |
21 | +} | |
22 | +.activity-data{ | |
23 | + padding-top: 10rpx; | |
24 | + letter-spacing: 10rpx; | |
25 | + | |
26 | +} | |
27 | +.xc-specific-more-frame{ | |
28 | + width: 100%; | |
29 | + height: 40%; | |
30 | + | |
31 | + margin-top: 20rpx; | |
32 | +} | |
33 | +.task-number{ | |
34 | + margin-top: 50rpx | |
35 | +} | |
36 | +.task_clike{ | |
37 | + margin: auto; | |
38 | + width: 60%; | |
39 | + height: 80rpx; | |
40 | + border-radius: 50rpx; | |
41 | + margin-top: 20rpx; | |
42 | + background: #fbda0e; | |
43 | + color:#d01119; | |
44 | + line-height: 80rpx; | |
45 | + letter-spacing: 5rpx; | |
46 | + box-shadow: 0rpx 7rpx 0rpx 0rpx rgb(245, 119, 6); | |
47 | +} | |
48 | +/* 底部列表样式 */ | |
49 | + | |
50 | + | |
51 | +.head { | |
52 | + border-bottom: 4rpx solid rgb(253, 193, 7); | |
53 | + color: rgb(255, 255, 255); | |
54 | + height: 48rpx; | |
55 | + line-height: 48rpx; | |
56 | +} | |
57 | + | |
58 | +.lhead { | |
59 | + border-top: 4rpx solid rgb(253, 193, 7); | |
60 | + border-left: 4rpx solid rgb(253, 193, 7); | |
61 | + border-right: 4rpx solid rgb(253, 193, 7); | |
62 | + width: 290rpx; | |
63 | + height: 48rpx; | |
64 | + line-height: 48rpx; | |
65 | +} | |
66 | + | |
67 | +.items { | |
68 | + padding-top: 50rpx; | |
69 | +} | |
70 | + | |
71 | +.rhead { | |
72 | + background-color: rgb(253, 193, 7); | |
73 | +} | |
74 | + | |
75 | +.unfinished { | |
76 | + width:35rpx; | |
77 | + height: 35rpx; | |
78 | + margin-right: 10rpx; | |
79 | +} | |
80 | + | |
81 | +.padding { | |
82 | + padding: 0rpx 50rpx; | |
83 | +} | |
84 | + | |
85 | +.width { | |
86 | + width: 290rpx; | |
87 | +} | |
88 | + | |
89 | +.line { | |
90 | + width: 110rpx; | |
91 | + border: 1rpx solid rgb(255, 255, 255); | |
92 | +} | |
93 | + | |
94 | +.load { | |
95 | + margin: 0rpx 26rpx; | |
96 | +} | |
97 | + | |
98 | +.item { | |
99 | + margin-bottom: 35rpx; | |
100 | +} | |
101 | + | |
102 | +.state { | |
103 | + text-decoration: underline; | |
104 | +} | |
105 | + | |
106 | +.nothing { | |
107 | + padding: 50rpx 0rpx; | |
108 | +} | |
109 | + | |
110 | +.receive { | |
111 | + padding-bottom: 50rpx; | |
112 | +} | |
113 | +.xc-center-img{ | |
114 | + width: 100%; | |
115 | + height: 100% | |
116 | +} | |
117 | + | |
118 | +.xc-left{ | |
119 | + width: 40rpx; | |
120 | + height: 40rpx; | |
121 | +} | |
122 | +.bcolor { | |
123 | +border-color: #fff; | |
124 | + | |
125 | +} | |
126 | +.xc-right{ | |
127 | + width: 40rpx; | |
128 | + height: 40rpx; | |
129 | +} | |
130 | +.user_img{ | |
131 | + width: 50rpx; | |
132 | + height: 50rpx; | |
133 | + | |
134 | +} | |
0 | 135 | \ No newline at end of file | ... | ... |