From ed6b3d6a2fb55763f26ccffb241289251a4b6172 Mon Sep 17 00:00:00 2001 From: taiyuan Date: Tue, 20 Jul 2021 18:05:37 +0800 Subject: [PATCH] 幸运大转盘 --- components/my-qrcode/my-qrcode.js | 46 ++++++++++++++++++++++++++++++++++++++++++++++ components/my-qrcode/my-qrcode.json | 4 ++++ components/my-qrcode/my-qrcode.wxml | 10 ++++++++++ components/my-qrcode/my-qrcode.wxss | 122 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ packageB/pages/luckactivity/index/g_filter.wxs | 29 +++++++++++++++++++++++++++++ packageB/pages/luckactivity/index/index.js | 32 ++++++++++++++++++++++++++++++++ packageB/pages/luckactivity/index/index.wxml | 46 +++++++++++++++++++++++++++++----------------- packageB/pages/luckactivity/luckinfo/luckinfo.js | 118 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-------------------------- packageB/pages/luckactivity/luckinfo/luckinfo.json | 2 +- packageB/pages/luckactivity/luckinfo/luckinfo.wxml | 35 ++++++++++++++++++++++++++--------- packageB/pages/luckactivity/luckinfo/luckinfo.wxss | 64 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++---- 11 files changed, 451 insertions(+), 57 deletions(-) create mode 100644 components/my-qrcode/my-qrcode.js create mode 100644 components/my-qrcode/my-qrcode.json create mode 100644 components/my-qrcode/my-qrcode.wxml create mode 100644 components/my-qrcode/my-qrcode.wxss create mode 100644 packageB/pages/luckactivity/index/g_filter.wxs diff --git a/components/my-qrcode/my-qrcode.js b/components/my-qrcode/my-qrcode.js new file mode 100644 index 0000000..27a6dca --- /dev/null +++ b/components/my-qrcode/my-qrcode.js @@ -0,0 +1,46 @@ +// pages/user/yhq/qr_code/qr_code.js +const { + barcode, + qrcode +} = require('../../utils/index.js') + +Component({ + data: { + q_show:0, + object:null, + index:0, + is_fw:0, + + barcode_canvas:null, + qrcode_canvas:null, + }, + properties: { + // 这里定义了innerText属性，属性值可以在组件使用时指定 + }, + ready: function () { + }, + + methods: { + //关闭 + close: function (e) { + this.setData({q_show: 0,barcode_canvas:null,qrcode_canvas:null }); + this.triggerEvent('close',{},{bubbles: true}); + }, + + //打开 + open:function (e) { + this.data.index++; + var list=[{index:this.data.index }]; + + this.setData({q_show: 1,object:e,barcode_canvas:list,qrcode_canvas:list,is_fw:e.is_fw }); + var val=e.val; + + // barcode('barcode'+this.data.index,val, 620, 160,this); + qrcode('qrcode'+this.data.index, val, 520, 520,this); + } + }, + + + + +}) \ No newline at end of file diff --git a/components/my-qrcode/my-qrcode.json b/components/my-qrcode/my-qrcode.json new file mode 100644 index 0000000..a74b8d1 --- /dev/null +++ b/components/my-qrcode/my-qrcode.json @@ -0,0 +1,4 @@ +{ + "component": true, + "usingComponents": {} +} \ No newline at end of file diff --git a/components/my-qrcode/my-qrcode.wxml b/components/my-qrcode/my-qrcode.wxml new file mode 100644 index 0000000..8406d34 --- /dev/null +++ b/components/my-qrcode/my-qrcode.wxml @@ -0,0 +1,10 @@ + + + + + 兑换码：{{object.val}} + 请向店员出示二维码核销兑换 + + + + diff --git a/components/my-qrcode/my-qrcode.wxss b/components/my-qrcode/my-qrcode.wxss new file mode 100644 index 0000000..ae090c1 --- /dev/null +++ b/components/my-qrcode/my-qrcode.wxss @@ -0,0 +1,122 @@ +@import '../../app.wxss'; + +.xc-pop-up{ + position:fixed; + z-index:5; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); +} + + +.xc-obscuration{ + position: fixed; + left: 0; + top: 0; + right: 0; + bottom: 0; + z-index: 11; + background: rgba(0,0,0,0.4); + width: 100%; + height: 100%; + + + +} + + /* Y */ +.xc-qr-frame{ + /* width:90%; + min-height: 696rpx; + background: #fff; + z-index: 55; + position: fixed; + top:180rpx; */ + /* height: auto; */ + /* padding-bottom:20rpx; */ + /* left:35rpx; */ + /* overflow: hidden; + border-radius: 16rpx; */ +} + +/* 二维码和条形码的边框Y */ +.barqrcode{ + background-color: white; + border-radius: 16rpx; + padding: 0 40rpx 40rpx; + text-align: center; +} +/* 点击条形Y */ +.barcode { + /* background-color: white; + border-radius: 12rpx; */ +} +canvas{ + width:100%; + height:55px; +display:block; + +} +.q_code{ + color: #333; +} + + +/* 二维码边框Y*/ +.qrcode_rim { + width: 550rpx; + height:544rpx; +display:flex; +flex-direction:column; +position: absolute; +left: 75rpx; +top: 5rpx; + +} +.qrcode{ + width: 520rpx; + height: 520rpx; +} +.r-code{ + /* font-size:28rpx; + padding-left: 25rpx; */ + /* margin-top: -5.5rpx; */ + +} + +.shut{ + color: white; + text-align: right; + padding-bottom: 30rpx; + position: relative; +} + + +.icon-close { + font-size: 48rpx; +} + +.shut::after { + content: ''; + width: 2rpx; + height: 32rpx; + background-color: white; + position: absolute; + bottom: 0; + right: 24rpx; +} + +.mt{ margin-top:130rpx} +.mts{ margin-top:70rpx} +.flex{ + display: flex; + justify-content:center; +} + +.code_show{ + text-align: center;position: relative; left: -20rpx; +} + +.c-9 { + color: #999; +} \ No newline at end of file diff --git a/packageB/pages/luckactivity/index/g_filter.wxs b/packageB/pages/luckactivity/index/g_filter.wxs new file mode 100644 index 0000000..9719e7d --- /dev/null +++ b/packageB/pages/luckactivity/index/g_filter.wxs @@ -0,0 +1,29 @@ +var g_filters = { + has_char:function(url,key){ + if(!url) return -1; + return url.indexOf(key); + }, + beg_time:function(beg_date){ + var fmt1 = beg_date.substring(0, 19); + var reg = getRegExp("-", "g"); + var fmt2 = fmt1.replace(reg, '/'); + var t1 = getDate(fmt2); + var tnow=getDate(); + if(t1<=tnow) return 1; + return 0; + }, + end_time:function(end_date){ + var fmt1 = end_date.substring(0, 19); + var reg = getRegExp("-", "g"); + var fmt2 = fmt1.replace(reg, '/'); + var t1 = getDate(fmt2); + var tnow=getDate(); + if(t1>=tnow) return 1; + return 0; + } +} +module.exports = { + has_char: g_filters.has_char, + beg_time: g_filters.beg_time, + end_time: g_filters.end_time, +} \ No newline at end of file diff --git a/packageB/pages/luckactivity/index/index.js b/packageB/pages/luckactivity/index/index.js index bbeffda..222d866 100644 --- a/packageB/pages/luckactivity/index/index.js +++ b/packageB/pages/luckactivity/index/index.js @@ -93,8 +93,40 @@ Page({ currentData: data, }); }); + + // 获取广告 + app.request.promiseGet("/api/weshop/ad/page", { + data: { + pid: 1201, + store_id: app.globalData.setting.stoid, + enabled: 1 + } + }).then(res => { + if(res.data.code==0 && res.data.data && res.data.data.pageData && res.data.data.pageData.length>0){ + var a = res.data.data.pageData; + var narr=[]; + for(var i in a){ + var tt = { + 'ad_code': os.imghost + a[i].ad_code, + 'media_link': '', + 'ad_weapplink':a[i].ad_weapplink + }; + narr.push(tt); + } + + self.setData({ + ad_data: narr, + }); + } + }) + + }; }; + + + + }, /** diff --git a/packageB/pages/luckactivity/index/index.wxml b/packageB/pages/luckactivity/index/index.wxml index fc95fc1..3113f0c 100644 --- a/packageB/pages/luckactivity/index/index.wxml +++ b/packageB/pages/luckactivity/index/index.wxml @@ -1,29 +1,41 @@ + - + + + + + + + + + + {{item}} - - - - - - - {{item.act_name}} - - 活动时间：{{filter.format_time(item.begindate) + ' 至 ' + filter.format_time(item.enddate)}} - 兑换时间：{{filter.format_time(item.begindate) + ' 至 ' + filter.format_time(item.enddate)}} - - - - 立即参与 - 去兑换 + + + + + + + {{item.act_name}} + + 活动时间：{{filter.format_time(item.begindate) + ' 至 ' + filter.format_time(item.enddate)}} + 兑换时间：{{filter.format_time(item.begindate) + ' 至 ' + filter.format_time(item.enddate)}} + + + + 立即参与 + 去兑换 + - + + diff --git a/packageB/pages/luckactivity/luckinfo/luckinfo.js b/packageB/pages/luckactivity/luckinfo/luckinfo.js index c330de6..7be448a 100644 --- a/packageB/pages/luckactivity/luckinfo/luckinfo.js +++ b/packageB/pages/luckactivity/luckinfo/luckinfo.js @@ -1,4 +1,5 @@ const app = getApp(); +const imghost = app.globalData.setting.imghost; let self = null; Page({ @@ -13,7 +14,7 @@ Page({ { fonts: [{ text: '积分', top: '18%', wordWrap:false, fontColor: 'transparent'}], imgs: [ { - src: '../../../images/luckDraw/jf.png', + src: '', width: '135rpx', height: '107rpx', top: '15%', @@ -23,7 +24,7 @@ Page({ { fonts: [{ text: '优惠券', top: '18%', wordWrap:false, fontColor: 'transparent'}], imgs: [ { - src: '../../../images/luckDraw/yhq.png', + src: '', width: '135rpx', height: '107rpx', top: '15%', @@ -33,7 +34,7 @@ Page({ { fonts: [{ text: '美容', top: '18%', wordWrap:false, fontColor: 'transparent'}], imgs: [ { - src: '../../../images/luckDraw/mr1.png', + src: '', width: '135rpx', height: '107rpx', top: '15%', @@ -44,7 +45,7 @@ Page({ { fonts: [{ text: '积分', top: '18%', wordWrap:false, fontColor: 'transparent'}], imgs: [ { - src: '../../../images/luckDraw/jf.png', + src: '', width: '135rpx', height: '107rpx', top: '15%', @@ -54,7 +55,7 @@ Page({ { fonts: [{ text: '优惠券', top: '18%', wordWrap:false, fontColor: 'transparent'}], imgs: [ { - src: '../../../images/luckDraw/yhq.png', + src: '', width: '135rpx', height: '107rpx', top: '15%', @@ -64,7 +65,7 @@ Page({ { fonts: [{ text: '美容', top: '18%', wordWrap:false, fontColor: 'transparent'}], imgs: [ { - src: '../../../images/luckDraw/mr1.png', + src: '', width: '135rpx', height: '107rpx', top: '15%', @@ -86,7 +87,7 @@ Page({ padding: '76rpx', // background: 'pink', imgs: [{ - src: 'http://201442.image.myqcloud.com/201442/0/1c825ca4-f155-453c-9f85-2cb0381824fe/original', + src: imghost + 'miniapp/images/luckDraw/weel.png', width: '700rpx', height: '700rpx', rotate: true, @@ -106,7 +107,7 @@ Page({ // background: 'black', // pointer: true, imgs: [{ - src: 'http://201442.image.myqcloud.com/201442/0/b29290ec-aeb3-40e9-9444-8f15fd9acda3/original', + src: imghost + 'miniapp/images/luckDraw/pointer.png', width: '188rpx', height: '230rpx', top: '-130rpx', @@ -116,15 +117,19 @@ Page({ }, onLoad(options) { + // console.log('imghost', imghost); self = this; this.data.options = options; + this.setData({ + imghost: imghost, + }); wx.setNavigationBarTitle({ title: options.title, }); app.isLogin().then(function(data) {//进入页面前已经授权登录成功 self.setData({ userInfo: data, - imghost: app.globalData.setting.imghost, + // imghost: app.globalData.setting.imghost, }); }); }, @@ -135,11 +140,11 @@ Page({ this.setData({ userInfo: app.globalData.userInfo, - imghost: app.globalData.setting.imghost, + // imghost: app.globalData.setting.imghost, isLogin: true, }); - console.log('imghost', this.data.imghost); + // console.log('imghost', this.data.imghost); let user_id = app.globalData.userInfo.user_id; let store_id = app.globalData.setting.stoid; let id = this.data.options.id; @@ -160,14 +165,14 @@ Page({ self.data.msg = res.data.msg; }; - console.log('luckInfo', res.data.data); + // console.log('luckInfo', res.data.data); let luckInfo = res.data.data; - let imghost = self.data.imghost; - if(luckInfo.template_type == 1) { //获取模板 + // let imghost = self.data.imghost; + if(luckInfo.template_type != null && luckInfo.template_type == 1) { //获取模板 let url = `/api/weshop/marketing/marketingLuckTemplate/get/${store_id}/${luckInfo.template_id}`; app.request.get(url, { success: function(res) { - console.log('prizes//////', res.data.data); + // console.log('prizes//////', res.data.data); self.setData({ template: res.data.data, bannerUrl: imghost + res.data.data.bannerUrl, //背景图 @@ -201,8 +206,46 @@ Page({ self.prizeLayout(award); }, - }); + + + //获取兑奖记录 + app.request.get('/api/weshop/marketing/marketingLuckRecord/page', { + isShowLoading: false, + data: { + store_id: app.globalData.setting.stoid, + user_id: app.globalData.userInfo.user_id, + luck_formid: this.data.options.id, + luck_state: 1 + }, + success: function(res) { + if(res.data.code == 0) { + self.setData({ + record: res.data.data.pageData, + }); + }; + }, + }); + + + //获取中奖人员名单 + app.request.get('/api/weshop/marketing/marketingLuckRecord/page', { + isShowLoading: false, + data: { + store_id: app.globalData.setting.stoid, + luck_formid: this.data.options.id, + luck_state: 1, + pageSize: 20, + }, + success: function(res) { + if(res.data.code == 0) { + self.setData({ + nameList: res.data.data.pageData, + }); + }; + }, + }); + }; }; }, @@ -211,12 +254,13 @@ Page({ prizeLayout(award) { let prizes = []; let length = award.length; - let thx = {fonts: [{ text: '谢谢\n参与', top: '18%', wordWrap:false, fontColor: 'rgba(0,0,0,.5)'}]}; + let thx = {fonts: [{ text: '谢谢\n参与', top: '18%', wordWrap:false, fontColor: 'rgba(255,255,255,.8)'}]}; if(length == 1) { [0,2,4,6].map(function(item, index) { prizes[item] = { id: award[0].id, + lbtype: award[0].lbtype, fonts: [{ text: award[0].luck_goods_name + ' x' + award[0].num, top: '18%', wordWrap:false, fontColor: 'transparent'}], imgs: [ { @@ -240,6 +284,7 @@ Page({ [0,4].map(function(item, index) { prizes[item] = { id: award[0].id, + lbtype: award[0].lbtype, fonts: [{ text: award[0].luck_goods_name + ' x' + award[0].num, top: '18%', wordWrap:false, fontColor: 'transparent'}], imgs: [ { @@ -255,6 +300,7 @@ Page({ [2,6].map(function(item, index) { prizes[item] = { id: award[1].id, + lbtype: award[1].lbtype, fonts: [{ text: award[1].luck_goods_name + ' x' + award[1].num, top: '18%', wordWrap:false, fontColor: 'transparent'}], imgs: [ { @@ -278,6 +324,7 @@ Page({ [0,4].map(function(item, index) { prizes[item] = { id: award[0].id, + lbtype: award[0].lbtype, fonts: [{ text: award[0].luck_goods_name + ' x' + award[0].num, top: '18%', wordWrap:false, fontColor: 'transparent'}], imgs: [ { @@ -293,6 +340,7 @@ Page({ [1,5].map(function(item, index) { prizes[item] = { id: award[1].id, + lbtype: award[1].lbtype, fonts: [{ text: award[1].luck_goods_name + ' x' + award[1].num, top: '18%', wordWrap:false, fontColor: 'transparent'}], imgs: [ { @@ -308,6 +356,7 @@ Page({ [2,6].map(function(item, index) { prizes[item] = { id: award[2].id, + lbtype: award[2].lbtype, fonts: [{ text: award[2].luck_goods_name + ' x' + award[2].num, top: '18%', wordWrap:false, fontColor: 'transparent'}], imgs: [ { @@ -332,6 +381,7 @@ Page({ [0,2,4,6].map(function(item, index) { prizes[item] = { id: award[index].id, + lbtype: award[index].lbtype, fonts: [{ text: award[index].luck_goods_name + ' x' + award[index].num, top: '18%', wordWrap:false, fontColor: 'transparent'}], imgs: [ { @@ -355,6 +405,7 @@ Page({ [0,2,3,5,6].map(function(item, index) { prizes[item] = { id: award[index].id, + lbtype: award[index].lbtype, fonts: [{ text: award[index].luck_goods_name + ' x' + award[index].num, top: '18%', wordWrap:false, fontColor: 'transparent'}], imgs: [ { @@ -378,6 +429,7 @@ Page({ prizes = award.map(function(item, index) { return { id: item.id, + lbtype: item.lbtype, fonts: [{ text: item.luck_goods_name + ' x' + item.num, top: '18%', wordWrap:false, fontColor: 'transparent'}], imgs: [ { @@ -396,7 +448,7 @@ Page({ this.data.thxIndexArr = [3,7]; }; - console.log('prizes', prizes); + // console.log('prizes', prizes); this.setData({ prizes, @@ -406,7 +458,7 @@ Page({ // 根据lbtype指定奖品类别图标 prizeSrc(lbtype) { let src = ''; - let imghost = this.data.imghost; + // let imghost = this.data.imghost; switch(lbtype) { case 1: { //积分 src = imghost + 'miniapp/images/luckDraw/jf.png'; @@ -488,8 +540,8 @@ Page({ }, success: function(res) { - // console.log('开始摇奖', res.data.data.id, res.data.data); if(res.data.code == 0) { + console.log('开始摇奖', res.data.data); self.setData({ 'luckInfo.user_LuckNumDay': self.data.luckInfo.user_LuckNumDay - 1 }); @@ -509,7 +561,7 @@ Page({ } else { - console.log('请求出错'); + // console.log('请求出错'); let thxIndexArr = self.data.thxIndexArr; const random = Math.random() * thxIndexArr.length >> 0; const index = thxIndexArr[random]; @@ -523,8 +575,7 @@ Page({ }, fail: function() { - - console.log('出错'); + // console.log('出错'); let thxIndexArr = self.data.thxIndexArr; const random = Math.random() * thxIndexArr.length >> 0; const index = thxIndexArr[random]; @@ -549,13 +600,20 @@ Page({ }, end (event) { // 中奖奖品详情 - // console.log('zjiangla~~',event.detail.fonts[0].text.replace('\n','')); + // console.log('zjiangla~~',event.detail.lbtype); + let lbtype; let resultTitle = event.detail.fonts[0].text.replace('\n',''); + if(event.detail.lbtype == 5) { + lbtype = 5; + } else { + lbtype = -1; + }; this.setData({ hiddenCanvas: true, showResult: true, showMask: true, - resultTitle, + resultTitle, + currentLbtype: lbtype, }); }, @@ -737,6 +795,7 @@ Page({ success: function(res) { if(res.data.code == 0) { let data = res.data.data; + console.log('data!!!!', data); let barcode = self.selectComponent("#qrcode"); barcode.open({val: data}); self.setData({ @@ -749,10 +808,17 @@ Page({ }); }, - closeCode() { + closeQr() { this.setData({ hiddenCanvas: false, showMask: false, }); }, + + clickReceive() { + this.setData({ + showResult: false, + }); + this.showPopup(); + }, }) \ No newline at end of file diff --git a/packageB/pages/luckactivity/luckinfo/luckinfo.json b/packageB/pages/luckactivity/luckinfo/luckinfo.json index 18c1e3f..e8748c5 100644 --- a/packageB/pages/luckactivity/luckinfo/luckinfo.json +++ b/packageB/pages/luckactivity/luckinfo/luckinfo.json @@ -1,7 +1,7 @@ { "usingComponents": { "lucky-wheel":"/packageB/miniprogram_npm/mini-luck-draw/lucky-wheel/index", - "qrcode": "/components/qr_code/qr_code", + "qrcode": "/components/my-qrcode/my-qrcode", "nodata": "/components/nodata/nodata" }, "enablePullDownRefresh": false, diff --git a/packageB/pages/luckactivity/luckinfo/luckinfo.wxml b/packageB/pages/luckactivity/luckinfo/luckinfo.wxml index e933a12..95ebe93 100644 --- a/packageB/pages/luckactivity/luckinfo/luckinfo.wxml +++ b/packageB/pages/luckactivity/luckinfo/luckinfo.wxml @@ -2,6 +2,22 @@ + + + + + + + + + + {{item.nickname}} + 获得了"{{item.luck_goods_name}}" + + + + + @@ -47,10 +63,10 @@ - + - {{basic.remark}} + {{luckInfo.remark}} - + @@ -143,17 +159,18 @@ - {{resultTitle}} + {{resultTitle}} + 继续加油噢~ - 恭喜你获得 + 恭喜你获得 {{resultTitle}} - + + 立即领取 + @@ -162,4 +179,4 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/packageB/pages/luckactivity/luckinfo/luckinfo.wxss b/packageB/pages/luckactivity/luckinfo/luckinfo.wxss index 5fc6bff..66b7bd2 100644 --- a/packageB/pages/luckactivity/luckinfo/luckinfo.wxss +++ b/packageB/pages/luckactivity/luckinfo/luckinfo.wxss @@ -268,7 +268,8 @@ page, font-size: 26rpx; color: white; background-color: #ff2d4b; - padding: 10rpx 40rpx; + padding: 20rpx 40rpx; + text-align: center; } .close-container { @@ -337,12 +338,13 @@ page, left: 50%; transform: translate(-50%, -50%); z-index: 999; + width: 85%; } .popup { background-color: white; border-radius: 12rpx; - padding: 40rpx; + padding: 60rpx; margin-top: 20rpx; } @@ -353,7 +355,7 @@ page, .img-container2 { width: 300rpx; height: 200rpx; - margin: 20rpx auto 0; + margin: 60rpx auto 0; } .note { @@ -371,4 +373,58 @@ page, color: #bbb; text-align: center; font-size: 22rpx; -} \ No newline at end of file +} + +.my-qrcode { + /* background-color: red; */ +} + +.swiper-container { + position: absolute; + top: 0; + left: 0; + padding: 20rpx 10rpx; + width: 100%; + box-sizing: border-box; +} + +.swiper { + height: 60rpx; + color: white; + font-size: 26rpx; +} + +.swiper-item { + /* width: auto !important; + background-color: rgba(0,0,0,.4); + border-radius: 60rpx; */ + position: relative; +} + +.item { + position: absolute; + display: flex; + align-items: center; + border-radius: 60rpx; + background-color: rgba(0,0,0,.4); +} + +.avatar-container { + width: 60rpx; + height: 60rpx; + border-radius: 50%; + overflow: hidden; + flex-shrink: 0; +} + +.img-block { + width: 100%; + height: 100%; + display: block; +} + +.nickname { + color: #FFE12F; + padding: 0 10rpx; +} + -- libgit2 0.21.4