| openid: "",//OPENID | openid: "",//OPENID | ||||
| session_key: "",//session_key | session_key: "",//session_key | ||||
| openidSuccessFuc: null,//方法回调 | openidSuccessFuc: null,//方法回调 | ||||
| nowPage:'3',//当前tabBar | |||||
| nowPage:'1',//当前tabBar | |||||
| isRegister:false,//是否已注册 | isRegister:false,//是否已注册 | ||||
| userMobile:null,//用户手机号 | userMobile:null,//用户手机号 | ||||
| isFirstLogin:true,//是否为第一次登录 | isFirstLogin:true,//是否为第一次登录 |
| "pages/myCenter/myCenter", | "pages/myCenter/myCenter", | ||||
| "pages/luckyStar/luckyStar", | "pages/luckyStar/luckyStar", | ||||
| "pages/scout/register/register", | "pages/scout/register/register", | ||||
| "pages/scout/share/share" | |||||
| "pages/scout/share/share", | |||||
| "pages/prizes/prizes", | |||||
| "pages/poster/poster", | |||||
| "pages/coupon/coupon" | |||||
| ], | ], | ||||
| "window": { | "window": { | ||||
| "backgroundTextStyle": "light", | "backgroundTextStyle": "light", |
| url: '../star/star' | url: '../star/star' | ||||
| }) | }) | ||||
| } else if (page == '3'){ | } else if (page == '3'){ | ||||
| wx.showToast({ | |||||
| title: '暂未开启', | |||||
| icon:'none' | |||||
| }) | |||||
| // wx.redirectTo({ | |||||
| // url: '../index/index' | |||||
| // wx.showToast({ | |||||
| // title: '暂未开启', | |||||
| // icon:'none' | |||||
| // }) | // }) | ||||
| wx.redirectTo({ | |||||
| url: '../luckyStar/luckyStar' | |||||
| }) | |||||
| } else if (page == '4'){ | } else if (page == '4'){ | ||||
| wx.redirectTo({ | wx.redirectTo({ | ||||
| url: '../myCenter/myCenter' | url: '../myCenter/myCenter' |
| color: black; | color: black; | ||||
| } | } | ||||
| .tabBarText2{ | .tabBarText2{ | ||||
| color: #1D7EAF; | |||||
| color: #345486; | |||||
| } | } | ||||
| .tabBar1{ | .tabBar1{ | ||||
| width: 46rpx; | width: 46rpx; |
| // pages/coupon/coupon.js | |||||
| const app = getApp() | |||||
| Page({ | |||||
| /** | |||||
| * 页面的初始数据 | |||||
| */ | |||||
| data: { | |||||
| imgUrl: app.globalData.urlStatic,//图片路径 | |||||
| }, | |||||
| /** | |||||
| * 生命周期函数--监听页面加载 | |||||
| */ | |||||
| onLoad: function (options) { | |||||
| }, | |||||
| /** | |||||
| * 生命周期函数--监听页面初次渲染完成 | |||||
| */ | |||||
| onReady: function () { | |||||
| }, | |||||
| /** | |||||
| * 生命周期函数--监听页面显示 | |||||
| */ | |||||
| onShow: function () { | |||||
| }, | |||||
| /** | |||||
| * 生命周期函数--监听页面隐藏 | |||||
| */ | |||||
| onHide: function () { | |||||
| }, | |||||
| /** | |||||
| * 生命周期函数--监听页面卸载 | |||||
| */ | |||||
| onUnload: function () { | |||||
| }, | |||||
| /** | |||||
| * 页面相关事件处理函数--监听用户下拉动作 | |||||
| */ | |||||
| onPullDownRefresh: function () { | |||||
| }, | |||||
| /** | |||||
| * 页面上拉触底事件的处理函数 | |||||
| */ | |||||
| onReachBottom: function () { | |||||
| }, | |||||
| /** | |||||
| * 用户点击右上角分享 | |||||
| */ | |||||
| onShareAppMessage: function () { | |||||
| }, | |||||
| receive:function(){//立即领取 | |||||
| wx.redirectTo({ | |||||
| url: '../index/index', | |||||
| }) | |||||
| } | |||||
| }) |
| { | |||||
| "navigationBarTitleText": "东风启辰星探计划", | |||||
| "usingComponents": { | |||||
| "tabBar": "../component/tabBar/index" | |||||
| } | |||||
| } |
| <!--pages/coupon/coupon.wxml--> | |||||
| <view class="all"> | |||||
| <view class="main"> | |||||
| <image class="couponBg" src="{{imgUrl+'/images/couponBg.png'}}"></image> | |||||
| <view class="prizeFrame"> | |||||
| <image class="coupon" src="{{imgUrl+'/images/coupon.png'}}"></image> | |||||
| <view class="getPrizeNumGroup"> | |||||
| <view class="getPrizeNum">全国已有 581人获得了500元启辰星购车券</view> | |||||
| </view> | |||||
| <view bindtap="receive" class="receiveBtn">立即领取</view> | |||||
| </view> | |||||
| </view> | |||||
| <tabBar></tabBar> | |||||
| </view> | |||||
| /* pages/coupon/coupon.wxss */ | |||||
| image{ | |||||
| display: block; | |||||
| } | |||||
| view{ | |||||
| -webkit-overflow-scrolling: touch; | |||||
| } | |||||
| .main{ | |||||
| height: calc(100vh - 150rpx); | |||||
| overflow: auto; | |||||
| position: relative; | |||||
| } | |||||
| .couponBg{ | |||||
| width: 750rpx; | |||||
| height: 734rpx; | |||||
| } | |||||
| .prizeFrame{ | |||||
| position: absolute; | |||||
| top: 672rpx; | |||||
| left: 50%; | |||||
| transform: translateX(-50%); | |||||
| width: 750rpx; | |||||
| height: auto; | |||||
| display: flex; | |||||
| align-items: center; | |||||
| flex-direction: column; | |||||
| padding-bottom: 34rpx; | |||||
| } | |||||
| .coupon{ | |||||
| width: 627rpx; | |||||
| height: 581rpx; | |||||
| } | |||||
| .receiveBtn{ | |||||
| width:653rpx; | |||||
| height:70rpx; | |||||
| text-align: center; | |||||
| line-height: 70rpx; | |||||
| font-size:30rpx; | |||||
| font-family:PingFang; | |||||
| font-weight:400; | |||||
| color:rgba(255,255,255,1); | |||||
| background-color: #29558D; | |||||
| border-radius: 20rpx; | |||||
| margin-top: 23rpx; | |||||
| } | |||||
| .getPrizeNumGroup{ | |||||
| position: relative; | |||||
| width: 750rpx; | |||||
| height: 0; | |||||
| } | |||||
| .getPrizeNum{ | |||||
| position: absolute; | |||||
| left: 0; | |||||
| top: -60rpx; | |||||
| width: 750rpx; | |||||
| height: 24rpx; | |||||
| line-height: 24rpx; | |||||
| font-size:24rpx; | |||||
| font-family:PingFang; | |||||
| font-weight:bold; | |||||
| color:rgba(248,197,109,1); | |||||
| text-align: center; | |||||
| } |
| }) | }) | ||||
| this.getUserLocation();//获取用户当前位置 | this.getUserLocation();//获取用户当前位置 | ||||
| if (e.detail.errMsg=='getPhoneNumber:ok'){ | if (e.detail.errMsg=='getPhoneNumber:ok'){ | ||||
| this.setData({ | |||||
| siteSelect: true, | |||||
| }) | |||||
| app.wxRequest(app.globalData.urlRoot + "userInfo/getUserPhoneNumber", { encryptedData: e.detail.encryptedData, iv: e.detail.iv }, res => { | app.wxRequest(app.globalData.urlRoot + "userInfo/getUserPhoneNumber", { encryptedData: e.detail.encryptedData, iv: e.detail.iv }, res => { | ||||
| if (res.code == 200) { | if (res.code == 200) { | ||||
| this.data.subscribeData.mobile = res.data.decodeData.phoneNumber; | this.data.subscribeData.mobile = res.data.decodeData.phoneNumber; | ||||
| }) | }) | ||||
| } | } | ||||
| }, this,"POST"); | }, this,"POST"); | ||||
| }else{ | |||||
| this.setData({ | |||||
| siteSelect: true, | |||||
| }) | |||||
| } | } | ||||
| }, | }, | ||||
| getUserLocation:function(e){ | getUserLocation:function(e){ | ||||
| }, | }, | ||||
| fail:(res)=>{ | fail:(res)=>{ | ||||
| this.getDistributorList("", ""); | this.getDistributorList("", ""); | ||||
| }, | |||||
| complete:(res)=>{ | |||||
| this.setData({ | |||||
| siteSelect: true, | |||||
| }) | |||||
| } | } | ||||
| }) | }) | ||||
| }, | }, |
| height:54rpx; | height:54rpx; | ||||
| line-height: 54rpx; | line-height: 54rpx; | ||||
| text-align: center; | text-align: center; | ||||
| background-color: #005EFF; | |||||
| background-color: #345489; | |||||
| color: white; | color: white; | ||||
| font-size: 29rpx; | font-size: 29rpx; | ||||
| margin-top: 18rpx; | margin-top: 18rpx; |
| data: { | data: { | ||||
| imgUrl: app.globalData.urlStatic,//图片路径 | imgUrl: app.globalData.urlStatic,//图片路径 | ||||
| ruleShow: false,//是否显示游戏玩法 | ruleShow: false,//是否显示游戏玩法 | ||||
| ruleCloseShow: true,//是否显示游戏玩法关闭按钮 | |||||
| ruleCloseShow: false,//是否显示游戏玩法关闭按钮 | |||||
| clawTop:95,//爪子的top值 | |||||
| clawLeft: 293,//爪子的left值 | |||||
| clawScale: 1,//爪子的scale值 | |||||
| downNum:30,//倒计时时间 | |||||
| setInt:null,//倒计时元素 | |||||
| pizeTip:0,//抓奖提示框 | |||||
| setGroup:{ | |||||
| left:null, | |||||
| right: null, | |||||
| top: null, | |||||
| bottom: null, | |||||
| } | |||||
| }, | }, | ||||
| /** | /** | ||||
| ruleShow: true | ruleShow: true | ||||
| }) | }) | ||||
| }, | }, | ||||
| strolClaw:function(){//开始控制爪子方向 | |||||
| gameStart: function () {//开始游戏 | |||||
| if (!this.data.ruleCloseShow) { | |||||
| this.downTimeFun(); | |||||
| } | |||||
| this.setData({ | |||||
| ruleShow: false, | |||||
| ruleCloseShow: true | |||||
| }) | |||||
| }, | }, | ||||
| endClaw:function(){//结束爪子动作 | |||||
| startClaw:function(e){//开始控制爪子方向 | |||||
| let direction = e.currentTarget.dataset.direction; | |||||
| if (direction == "L") {//向左 | |||||
| if (this.data.clawLeft <= 130) { | |||||
| return; | |||||
| } | |||||
| this.data.setGroup.left = setInterval(() => { | |||||
| this.setData({ | |||||
| clawLeft: this.data.clawLeft-=2 | |||||
| }) | |||||
| if (this.data.clawLeft <= 130) { | |||||
| clearInterval(this.data.setGroup.left); | |||||
| } | |||||
| },20); | |||||
| } else if (direction == "R") {//向右 | |||||
| if (this.data.clawLeft >= 445) { | |||||
| return; | |||||
| } | |||||
| this.data.setGroup.right = setInterval(() => { | |||||
| this.setData({ | |||||
| clawLeft: this.data.clawLeft += 2 | |||||
| }) | |||||
| if (this.data.clawLeft >= 445) { | |||||
| clearInterval(this.data.setGroup.right); | |||||
| } | |||||
| }, 20); | |||||
| } else if (direction == "T") {//向后 | |||||
| if (this.data.clawScale <= 0.5) { | |||||
| return; | |||||
| } | |||||
| this.data.setGroup.top = setInterval(() => { | |||||
| this.setData({ | |||||
| clawScale: this.data.clawScale -= 0.01 | |||||
| }) | |||||
| if (this.data.clawScale <= 0.5) { | |||||
| clearInterval(this.data.setGroup.top); | |||||
| } | |||||
| }, 20); | |||||
| } else if (direction == "B") {//向前 | |||||
| if (this.data.clawScale >= 1.5) { | |||||
| return; | |||||
| } | |||||
| this.data.setGroup.bottom = setInterval(() => { | |||||
| this.setData({ | |||||
| clawScale: this.data.clawScale += 0.01 | |||||
| }) | |||||
| if (this.data.clawScale >= 1.5) { | |||||
| clearInterval(this.data.setGroup.bottom); | |||||
| } | |||||
| }, 20); | |||||
| } | |||||
| }, | |||||
| endClaw:function(e){//结束爪子动作 | |||||
| let direction = e.currentTarget.dataset.direction; | |||||
| if (direction == "L") {//向左 | |||||
| clearInterval(this.data.setGroup.left); | |||||
| } else if (direction == "R") {//向右 | |||||
| clearInterval(this.data.setGroup.right); | |||||
| } else if (direction == "T") {//向后 | |||||
| clearInterval(this.data.setGroup.top); | |||||
| } else if (direction == "B") {//向前 | |||||
| clearInterval(this.data.setGroup.bottom); | |||||
| } | |||||
| }, | |||||
| getClaw:function(){//抓取 | |||||
| this.setData({ | |||||
| clawTop: this.data.clawScale > 1 ? 490 - (2 * (this.data.clawScale-1) * 90) : 490 + (2 * (1 - this.data.clawScale) * 90 ) | |||||
| }) | |||||
| this.closeSetInt(); | |||||
| }, | |||||
| downTimeFun:function(){//游戏倒计时 | |||||
| this.data.setInt = setInterval(()=>{ | |||||
| this.data.downNum -= 1; | |||||
| if (this.data.downNum<10){ | |||||
| this.data.downNum = '0' + this.data.downNum; | |||||
| } | |||||
| this.setData({ | |||||
| downNum: this.data.downNum | |||||
| }) | |||||
| if (this.data.downNum < 1) { | |||||
| this.closeSetInt(); | |||||
| } | |||||
| },1000); | |||||
| }, | |||||
| closeSetInt:function(){//关闭倒计时 | |||||
| clearInterval(this.data.setInt); | |||||
| this.setData({ | |||||
| downNum: 30, | |||||
| clawTop: this.data.clawScale > 1 ? 455 - (2 * (this.data.clawScale - 1) * 90) : 455 + (2 * (1 - this.data.clawScale) * 90) | |||||
| }) | |||||
| setTimeout(()=>{ | |||||
| this.setData({ | |||||
| downNum: 30, | |||||
| clawTop: 95, | |||||
| clawLeft: 293, | |||||
| clawScale:1 | |||||
| }) | |||||
| }, 1200); | |||||
| }, | |||||
| prizeLook:function(){//活动奖品 | |||||
| wx.navigateTo({ | |||||
| url: '../prizes/prizes' | |||||
| }) | |||||
| } | } | ||||
| }) | }) |
| <view class="all"> | <view class="all"> | ||||
| <view class="main"> | <view class="main"> | ||||
| <view class="gameMain"> | <view class="gameMain"> | ||||
| <image class="gameStarBg" src="{{imgUrl+'/images/gameStarBg.png'}}"></image> | |||||
| <image class="gameStarBg" src="{{imgUrl+'/images/gameStarBg.png?v=002'}}"></image> | |||||
| <view class="gameTitle">幸运星抓手</view> | <view class="gameTitle">幸运星抓手</view> | ||||
| <view class="downTime">00:29</view> | |||||
| <image class="gameClaw" src="{{imgUrl+'/images/gameClaw.png'}}"></image> | |||||
| <image class="prizeIcon2" src="{{imgUrl+'/images/prizeIcon2.png'}}"></image> | |||||
| <image class="prizeIcon1" src="{{imgUrl+'/images/prizeIcon1.png'}}"></image> | |||||
| <view class="scrollText"> | |||||
| <view class="scrollFrame"> | |||||
| <view class="scrollView">恭喜XXX获得头等舱机票一张,恭喜XX获得20元美团代金券一张</view> | |||||
| <view class="scrollView">恭喜XXX获得头等舱机票一张,恭喜XX获得20元美团代金券一张</view> | |||||
| </view> | |||||
| <view class="downTime">{{'00:'+downNum}}</view> | |||||
| <image class="prizeIcon2" src="{{imgUrl+'/images/prizeIcon2.png?v=002'}}"></image> | |||||
| <image class="gameClaw" style="top:{{clawTop}}rpx;left:{{clawLeft}}rpx;transform: scale({{clawScale}});" src="{{imgUrl+'/images/gameClaw.png'}}"></image> | |||||
| <image class="prizeIcon1" src="{{imgUrl+'/images/prizeIcon1.png?v=002'}}"></image> | |||||
| <view class="getPrizeTip"> | |||||
| <view class="prizeTipLine"></view> | |||||
| <view class="prizeTipText">他们都中奖了</view> | |||||
| <view class="prizeTipLine"></view> | |||||
| </view> | |||||
| <view class="tipContentGroup"> | |||||
| <view class="tipContent">恭喜XXX获得头等舱机票一张,恭喜XX获得20元美团代金券一张</view> | |||||
| </view> | |||||
| <view class="prizeLookGroup"> | |||||
| <view class="prizeLook" bindtap="prizeLook">活动奖品</view> | |||||
| </view> | </view> | ||||
| <view class="gameControlFrame"> | <view class="gameControlFrame"> | ||||
| <view class="gameControlGroup"> | <view class="gameControlGroup"> | ||||
| <view class="btnControlL" bindtouchstart="strolClaw" bindtouchend="endClaw" data-direction="L"></view> | |||||
| <view class="btnControlR" bindtouchstart="strolClaw" bindtouchend="endClaw" data-direction="R"></view> | |||||
| <view class="btnControlT" bindtouchstart="strolClaw" bindtouchend="endClaw" data-direction="T"></view> | |||||
| <view class="btnControlB" bindtouchstart="strolClaw" bindtouchend="endClaw" data-direction="B"></view> | |||||
| <view class="btnControlL" bindtouchstart="startClaw" bindtouchend="endClaw" data-direction="L"></view> | |||||
| <view class="btnControlR" bindtouchstart="startClaw" bindtouchend="endClaw" data-direction="R"></view> | |||||
| <view class="btnControlT" bindtouchstart="startClaw" bindtouchend="endClaw" data-direction="T"></view> | |||||
| <view class="btnControlB" bindtouchstart="startClaw" bindtouchend="endClaw" data-direction="B"></view> | |||||
| </view> | </view> | ||||
| </view> | </view> | ||||
| <view class="gameGetBtn"></view> | |||||
| <view class="prizeLook">活动奖品</view> | |||||
| <view class="gameGetBtn" bindtap="getClaw"></view> | |||||
| </view> | </view> | ||||
| <view bindtap="openGameRule" class="gameRuleBtn {{ruleShow?'gameRuleBtn2':''}}">游戏玩法</view> | <view bindtap="openGameRule" class="gameRuleBtn {{ruleShow?'gameRuleBtn2':''}}">游戏玩法</view> | ||||
| <view class="gameTip">500元待领取</view> | <view class="gameTip">500元待领取</view> | ||||
| <view class="ruleGroup"> | <view class="ruleGroup"> | ||||
| <image class="gameRuleIcon" src="{{imgUrl+'/images/gameRuleDesc.png'}}"></image> | <image class="gameRuleIcon" src="{{imgUrl+'/images/gameRuleDesc.png'}}"></image> | ||||
| <image class="gameRuleClose" wx:if="{{ruleCloseShow}}" bindtap="closeRule" src="{{imgUrl+'/images/gameRuleClose.png'}}"></image> | <image class="gameRuleClose" wx:if="{{ruleCloseShow}}" bindtap="closeRule" src="{{imgUrl+'/images/gameRuleClose.png'}}"></image> | ||||
| <view class="gameStrat">开始游戏</view> | |||||
| <view class="gameStrat" bindtap="gameStart">开始游戏</view> | |||||
| </view> | |||||
| </view> | |||||
| <view class="successPop" wx:if="{{pizeTip}}"> | |||||
| <view class="successGroup" wx:if="{{pizeTip==1}}"> | |||||
| <image class="gameRuleClose" style="top:-31rpx;right:-29rpx;" src="{{imgUrl+'/images/gameRuleClose.png'}}"></image> | |||||
| <image class="successIcon" src="{{imgUrl+'/images/successIcon.png'}}"></image> | |||||
| <view class="titleGroup"></view> | |||||
| <view class="successTip">幸运满格,大奖到手</view> | |||||
| <image class="prizePic" src="{{imgUrl+'/images/prizePic1.png'}}"></image> | |||||
| <view class="prizeName">头等舱机票一张</view> | |||||
| <view class="startRegister">立即领奖</view> | |||||
| </view> | |||||
| <view class="successGroup" wx:if="{{pizeTip==2 || pizeTip==3}}"> | |||||
| <image class="gameRuleClose" style="top:-31rpx;right:-29rpx;" src="{{imgUrl+'/images/gameRuleClose.png'}}"></image> | |||||
| <image class="successIcon" src="{{imgUrl+'/images/failIcon.png'}}"></image> | |||||
| <view class="titleGroup"></view> | |||||
| <view class="failText" style="margin-top:113rpx;">运气就差一点点</view> | |||||
| <view class="failText" style="margin-top:20rpx;margin-bottom:82rpx;">重整旗鼓再来抓</view> | |||||
| <view class="startRegister">{{pizeTip==2?"邀请好友一起来玩":"立即注册,探索更多星探好礼"}}</view> | |||||
| </view> | </view> | ||||
| </view> | </view> | ||||
| </view> | </view> |
| image{ | image{ | ||||
| display: block; | display: block; | ||||
| } | } | ||||
| view{ | |||||
| -webkit-overflow-scrolling: touch; | |||||
| } | |||||
| .main{ | .main{ | ||||
| height: calc(100vh - 150rpx); | height: calc(100vh - 150rpx); | ||||
| overflow: auto; | overflow: auto; | ||||
| .gameMain{ | .gameMain{ | ||||
| position: relative; | position: relative; | ||||
| width: 750rpx; | width: 750rpx; | ||||
| height: 1471rpx; | |||||
| } | } | ||||
| .gameStarBg{ | .gameStarBg{ | ||||
| width: 100%; | |||||
| height: 100%; | |||||
| width: 750rpx; | |||||
| height: 1038rpx; | |||||
| } | } | ||||
| .gameTitle{ | .gameTitle{ | ||||
| position: absolute; | position: absolute; | ||||
| left: 50%; | left: 50%; | ||||
| top: 10rpx; | |||||
| top: 0; | |||||
| transform: translateX(-50%); | transform: translateX(-50%); | ||||
| width: 342rpx; | width: 342rpx; | ||||
| height: 124rpx; | |||||
| line-height: 124rpx; | |||||
| height: 70rpx; | |||||
| line-height: 70rpx; | |||||
| font-size:40rpx; | font-size:40rpx; | ||||
| font-family:PingFangSC; | font-family:PingFangSC; | ||||
| color:rgba(35,33,34,1); | color:rgba(35,33,34,1); | ||||
| } | } | ||||
| .downTime{ | .downTime{ | ||||
| position: absolute; | position: absolute; | ||||
| top: 58rpx; | |||||
| top: 20rpx; | |||||
| right: 80rpx; | right: 80rpx; | ||||
| font-size:34rpx; | font-size:34rpx; | ||||
| line-height: 34rpx; | line-height: 34rpx; | ||||
| } | } | ||||
| .gameClaw{ | .gameClaw{ | ||||
| position: absolute; | position: absolute; | ||||
| left: 50%; | |||||
| transform: translateX(-50%); | |||||
| top: 130rpx; | |||||
| left: 293rpx; | |||||
| top: 95rpx; | |||||
| width: 164rpx; | width: 164rpx; | ||||
| height: 259rpx; | height: 259rpx; | ||||
| } | |||||
| .scrollText{ | |||||
| position: absolute; | |||||
| left: 50%; | |||||
| transform: translateX(-50%); | |||||
| bottom: 428rpx; | |||||
| width: 700rpx; | |||||
| height: 30rpx; | |||||
| overflow: hidden; | |||||
| } | |||||
| .scrollFrame{ | |||||
| width: 100%; | |||||
| height: 100%; | |||||
| position: relative; | |||||
| overflow: hidden; | |||||
| } | |||||
| .scrollView{ | |||||
| position: absolute; | |||||
| width: auto; | |||||
| height: 30rpx; | |||||
| line-height: 30rpx; | |||||
| font-size:20rpx; | |||||
| font-family:PingFangSC; | |||||
| font-weight:600; | |||||
| color:rgba(255,255,255,1); | |||||
| left: 60%; | |||||
| } | |||||
| .prizeLook{ | |||||
| position: absolute; | |||||
| left: 50%; | |||||
| transform: translateX(-50%); | |||||
| bottom: 161rpx; | |||||
| width:710rpx; | |||||
| height:70rpx; | |||||
| background-color: #355483; | |||||
| line-height: 70rpx; | |||||
| text-align: center; | |||||
| font-size:30rpx; | |||||
| font-family:PingFangSC; | |||||
| font-weight:400; | |||||
| color:rgba(255,255,255,1); | |||||
| border-radius: 20rpx; | |||||
| transition: top 0.8s linear; | |||||
| transform: scale(2); | |||||
| transform-origin:50% 0 0; | |||||
| } | } | ||||
| .prizeIcon2{ | .prizeIcon2{ | ||||
| position: absolute; | position: absolute; | ||||
| left: 115rpx; | left: 115rpx; | ||||
| top: 610rpx; | |||||
| width: 523rpx; | |||||
| height: 171rpx; | |||||
| top: 562rpx; | |||||
| width: 527rpx; | |||||
| height: 169rpx; | |||||
| } | } | ||||
| .prizeIcon1{ | .prizeIcon1{ | ||||
| position: absolute; | position: absolute; | ||||
| left: 72rpx; | |||||
| top: 640rpx; | |||||
| left: 64rpx; | |||||
| top: 592rpx; | |||||
| width: 624rpx; | width: 624rpx; | ||||
| height: 265rpx; | height: 265rpx; | ||||
| } | } | ||||
| .gameGetBtn{ | .gameGetBtn{ | ||||
| position: absolute; | position: absolute; | ||||
| right: 70rpx; | right: 70rpx; | ||||
| top: 1086rpx; | |||||
| top: 920rpx; | |||||
| width: 304rpx; | width: 304rpx; | ||||
| height: 80rpx; | height: 80rpx; | ||||
| } | } | ||||
| .gameControlFrame{ | .gameControlFrame{ | ||||
| position: absolute; | position: absolute; | ||||
| left: 130rpx; | left: 130rpx; | ||||
| top: 1078rpx; | |||||
| top: 910rpx; | |||||
| width: 174rpx; | width: 174rpx; | ||||
| height: 106rpx; | height: 106rpx; | ||||
| } | } | ||||
| width: 50rpx; | width: 50rpx; | ||||
| height: 47rpx; | height: 47rpx; | ||||
| /* background-color: rgba(233, 222, 111, 0.5); */ | /* background-color: rgba(233, 222, 111, 0.5); */ | ||||
| } | |||||
| .successPop{ | |||||
| position: fixed; | |||||
| top: 0; | |||||
| left: 0; | |||||
| width: 100%; | |||||
| height: calc(100vh - 150rpx); | |||||
| background-color: rgba( 000, 000, 000, 0.3); | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| } | |||||
| .successGroup{ | |||||
| position: relative; | |||||
| width:455rpx; | |||||
| height:426rpx; | |||||
| background-color: white; | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| align-items: center; | |||||
| border-radius: 20rpx; | |||||
| } | |||||
| .successIcon{ | |||||
| position: absolute; | |||||
| top: -33rpx; | |||||
| left: 50%; | |||||
| transform: translateX(-50%); | |||||
| width: 114rpx; | |||||
| height: 114rpx; | |||||
| } | |||||
| .titleGroup{ | |||||
| width: 100%; | |||||
| height: 63rpx; | |||||
| background-color: #355485; | |||||
| border-top-left-radius: 20rpx; | |||||
| border-top-right-radius: 20rpx; | |||||
| } | |||||
| .startRegister{ | |||||
| width:278rpx; | |||||
| height:50rpx; | |||||
| background-color: #345489; | |||||
| border-radius: 15rpx; | |||||
| text-align: center; | |||||
| font-size:21rpx; | |||||
| font-family:PingFangSC; | |||||
| font-weight:400; | |||||
| color:rgba(255,255,255,1); | |||||
| line-height:50rpx; | |||||
| } | |||||
| .prizePic{ | |||||
| width: 310rpx; | |||||
| height: 116rpx; | |||||
| margin-bottom: 10rpx; | |||||
| } | |||||
| .successTip{ | |||||
| font-size:28rpx; | |||||
| font-family:PingFangSC; | |||||
| font-weight:bold; | |||||
| color:rgba(52,84,132,1); | |||||
| line-height: 28rpx; | |||||
| text-align: center; | |||||
| margin-top: 50rpx; | |||||
| margin-bottom: 13rpx; | |||||
| } | |||||
| .prizeName{ | |||||
| font-size:21rpx; | |||||
| font-family:PingFangSC; | |||||
| font-weight:400; | |||||
| color:rgba(0,0,0,1); | |||||
| line-height:21rpx; | |||||
| text-align: center; | |||||
| margin-bottom: 30rpx; | |||||
| } | |||||
| .failText{ | |||||
| font-size:28rpx; | |||||
| font-family:PingFangSC; | |||||
| font-weight:bold; | |||||
| color:rgba(52,84,132,1); | |||||
| line-height:28rpx; | |||||
| text-align: center; | |||||
| } | |||||
| .getPrizeTip{ | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| margin-top: 50rpx; | |||||
| margin-bottom: 16rpx; | |||||
| } | |||||
| .prizeTipLine{ | |||||
| width:80rpx; | |||||
| height:5rpx; | |||||
| background-color: #1F4C76; | |||||
| } | |||||
| .prizeTipLine:first-child{ | |||||
| margin-right: 20rpx; | |||||
| } | |||||
| .prizeTipLine:last-child{ | |||||
| margin-left: 20rpx; | |||||
| } | |||||
| .prizeTipText{ | |||||
| font-size:24rpx; | |||||
| font-family:PingFangSC; | |||||
| font-weight:600; | |||||
| color:rgba(21,83,136,1); | |||||
| line-height:24rpx; | |||||
| } | |||||
| .tipContentGroup{ | |||||
| width:712rpx; | |||||
| height:72rpx; | |||||
| margin: 0 auto; | |||||
| box-sizing: border-box; | |||||
| border: 1rpx solid #4B6782; | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| border-radius: 20rpx; | |||||
| } | |||||
| .tipContent{ | |||||
| font-size:21rpx; | |||||
| font-family:PingFangSC; | |||||
| font-weight:400; | |||||
| color:rgba(21,83,136,1); | |||||
| line-height:21rpx; | |||||
| } | |||||
| .prizeLookGroup{ | |||||
| padding-top:40rpx; | |||||
| padding-bottom: 45rpx; | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| } | |||||
| .prizeLook{ | |||||
| width:710rpx; | |||||
| height:70rpx; | |||||
| background-color: #355483; | |||||
| line-height: 70rpx; | |||||
| text-align: center; | |||||
| font-size:30rpx; | |||||
| font-family:PingFangSC; | |||||
| font-weight:400; | |||||
| color:rgba(255,255,255,1); | |||||
| border-radius: 20rpx; | |||||
| } | } |
| */ | */ | ||||
| data: { | data: { | ||||
| imgUrl: app.globalData.urlStatic,//图片路径 | imgUrl: app.globalData.urlStatic,//图片路径 | ||||
| phoneInputShow: false,//是否显示电话输入框 | |||||
| siteSelect: false,//是否显示位置选择框 | |||||
| isLogin:false,//登录状态 | isLogin:false,//登录状态 | ||||
| selectNow:0,//现在的选项 | selectNow:0,//现在的选项 | ||||
| taskNow:1,//现在的任务类型 | taskNow:1,//现在的任务类型 | ||||
| this.data.subscribeData.agent_code = this.data.storeArr[this.data.storeValue].agent_code; | this.data.subscribeData.agent_code = this.data.storeArr[this.data.storeValue].agent_code; | ||||
| }else{ | }else{ | ||||
| app.globalData.myCenterData = {}; | app.globalData.myCenterData = {}; | ||||
| this.getUserLocation(); | |||||
| this.getOrderInfo(); | this.getOrderInfo(); | ||||
| } | } | ||||
| if (this.data.optionsData){ | if (this.data.optionsData){ | ||||
| }, | }, | ||||
| fail: (res) => { | fail: (res) => { | ||||
| this.getDistributorList("", ""); | this.getDistributorList("", ""); | ||||
| }, | |||||
| complete: (res) => { | |||||
| this.setData({ | |||||
| siteSelect: true, | |||||
| }) | |||||
| } | } | ||||
| }) | }) | ||||
| }, | }, | ||||
| }) | }) | ||||
| } | } | ||||
| },this) | },this) | ||||
| }, | |||||
| getUserPhone: function (e) {//获取用户手机号 | |||||
| this.setData({ | |||||
| phoneInputShow: true | |||||
| }) | |||||
| this.getUserLocation();//获取用户当前位置 | |||||
| if (e.detail.errMsg == 'getPhoneNumber:ok') { | |||||
| app.wxRequest(app.globalData.urlRoot + "userInfo/getUserPhoneNumber", { encryptedData: e.detail.encryptedData, iv: e.detail.iv }, res => { | |||||
| if (res.code == 200) { | |||||
| this.data.subscribeData.mobile = res.data.decodeData.phoneNumber; | |||||
| this.setData({ | |||||
| subscribeData: this.data.subscribeData | |||||
| }) | |||||
| } else { | |||||
| wx.showToast({ | |||||
| title: res.msg, | |||||
| icon: "none" | |||||
| }) | |||||
| } | |||||
| }, this, "POST"); | |||||
| } | |||||
| } | } | ||||
| }) | }) |
| </view> | </view> | ||||
| <view class="inputGroup"> | <view class="inputGroup"> | ||||
| <input class="inputCode" bindinput="getMobile" type="number" value="{{subscribeData.mobile}}" maxlength='11' placeholder="请输入您的联系电话"></input> | <input class="inputCode" bindinput="getMobile" type="number" value="{{subscribeData.mobile}}" maxlength='11' placeholder="请输入您的联系电话"></input> | ||||
| <view class="getPhoneFrame" wx:if="{{!phoneInputShow}}"> | |||||
| <button class="getPhoneBtn" style="width: 652rpx;height: 65rpx;margin: 0;padding: 0;min-height: 0;" open-type="getPhoneNumber" bindgetphonenumber="getUserPhone"></button> | |||||
| </view> | |||||
| </view> | </view> | ||||
| <view class="inputGroup"> | <view class="inputGroup"> | ||||
| <input class="inputCode" style="width:500rpx;" bindinput="getCaptcha" placeholder="请输入验证码"></input> | <input class="inputCode" style="width:500rpx;" bindinput="getCaptcha" placeholder="请输入验证码"></input> | ||||
| <view class="codeTime" bindtap="getCode">{{verificationCode}}</view> | <view class="codeTime" bindtap="getCode">{{verificationCode}}</view> | ||||
| </view> | </view> | ||||
| <picker mode='selector' range="{{provinceArr}}" range-key="province" value="{{provinceValue}}" bindchange="provinceChane"> | |||||
| <view class="selectSiteGroup"> | |||||
| <text class="selectName">{{provinceArr[provinceValue].province}}</text> | |||||
| <image src="{{imgUrl+'/images/selectIcon.png'}}" class="selectIcon"></image> | |||||
| </view> | |||||
| </picker> | |||||
| <picker mode='selector' range="{{storeArr}}" range-key="agent_detail" value="{{storeValue}}" bindchange="storeChane"> | |||||
| <view class="selectSiteGroup"> | |||||
| <text class="selectName">{{storeArr[storeValue].agent_detail}}</text> | |||||
| <image src="{{imgUrl+'/images/selectIcon.png'}}" class="selectIcon"></image> | |||||
| </view> | |||||
| </picker> | |||||
| <view wx:if="{{siteSelect}}"> | |||||
| <picker mode='selector' range="{{provinceArr}}" range-key="province" value="{{provinceValue}}" bindchange="provinceChane"> | |||||
| <view class="selectSiteGroup"> | |||||
| <text class="selectName">{{provinceArr[provinceValue].province}}</text> | |||||
| <image src="{{imgUrl+'/images/selectIcon.png'}}" class="selectIcon"></image> | |||||
| </view> | |||||
| </picker> | |||||
| <picker mode='selector' range="{{storeArr}}" range-key="agent_detail" value="{{storeValue}}" bindchange="storeChane"> | |||||
| <view class="selectSiteGroup"> | |||||
| <text class="selectName">{{storeArr[storeValue].agent_detail}}</text> | |||||
| <image src="{{imgUrl+'/images/selectIcon.png'}}" class="selectIcon"></image> | |||||
| </view> | |||||
| </picker> | |||||
| </view> | |||||
| <view class="subscribeBtn" bindtap="subscribeFun">预约鉴赏</view> | <view class="subscribeBtn" bindtap="subscribeFun">预约鉴赏</view> | ||||
| </view> | </view> | ||||
| <view class="subscribeGroup" wx:if="{{selectNow==4 && isRegister}}"> | <view class="subscribeGroup" wx:if="{{selectNow==4 && isRegister}}"> |
| margin: 0 auto; | margin: 0 auto; | ||||
| width:307rpx; | width:307rpx; | ||||
| height:49rpx; | height:49rpx; | ||||
| background-color: #005CFE; | |||||
| background-color: #345486; | |||||
| border-radius: 10rpx; | border-radius: 10rpx; | ||||
| text-align: center; | text-align: center; | ||||
| font-size: 25rpx; | font-size: 25rpx; | ||||
| line-height: 41rpx; | line-height: 41rpx; | ||||
| font-size:21rpx; | font-size:21rpx; | ||||
| border-radius: 10rpx; | border-radius: 10rpx; | ||||
| border: 1rpx solid #4777D6; | |||||
| border: 1rpx solid #345486; | |||||
| color: black; | color: black; | ||||
| } | } | ||||
| .taskText2{ | .taskText2{ | ||||
| background-color: #005CFE; | |||||
| background-color: #345486; | |||||
| color:white; | color:white; | ||||
| } | } | ||||
| .taskDetailGroup{ | .taskDetailGroup{ | ||||
| color: white; | color: white; | ||||
| font-size: 20rpx; | font-size: 20rpx; | ||||
| line-height:40rpx; | line-height:40rpx; | ||||
| background-color: #005AFD; | |||||
| background-color: #345486; | |||||
| border-radius: 20rpx; | border-radius: 20rpx; | ||||
| } | } | ||||
| .taskWaitBtn{ | .taskWaitBtn{ | ||||
| .taskLine{ | .taskLine{ | ||||
| height:15rpx; | height:15rpx; | ||||
| width:0; | width:0; | ||||
| background-color: #0260FF; | |||||
| background-color: #345486; | |||||
| border-radius: 20rpx; | border-radius: 20rpx; | ||||
| } | } | ||||
| .taskSignIcon{ | .taskSignIcon{ | ||||
| width:368rpx; | width:368rpx; | ||||
| height:57rpx; | height:57rpx; | ||||
| border-radius: 10rpx; | border-radius: 10rpx; | ||||
| background-color: #0060FE; | |||||
| background-color: #345486; | |||||
| text-align: center; | text-align: center; | ||||
| line-height: 57rpx; | line-height: 57rpx; | ||||
| font-size: 29rpx; | font-size: 29rpx; | ||||
| align-items: center; | align-items: center; | ||||
| justify-content: space-between; | justify-content: space-between; | ||||
| border: 1rpx solid #B4B4B4; | border: 1rpx solid #B4B4B4; | ||||
| position: relative; | |||||
| overflow: hidden; | |||||
| } | } | ||||
| .inputCode{ | .inputCode{ | ||||
| height: 100%; | height: 100%; | ||||
| height:65rpx; | height:65rpx; | ||||
| line-height: 65rpx; | line-height: 65rpx; | ||||
| text-align: center; | text-align: center; | ||||
| background-color: #005EFF; | |||||
| background-color: #345486; | |||||
| color: white; | color: white; | ||||
| font-size: 29rpx; | font-size: 29rpx; | ||||
| margin-top: 18rpx; | margin-top: 18rpx; | ||||
| line-height: 26rpx; | line-height: 26rpx; | ||||
| margin-bottom: 26rpx; | margin-bottom: 26rpx; | ||||
| text-align: center; | text-align: center; | ||||
| } | |||||
| .getPhoneFrame{ | |||||
| position: absolute; | |||||
| left: 0; | |||||
| top: 0; | |||||
| width: 652rpx; | |||||
| height: 65rpx; | |||||
| z-index: 2; | |||||
| } | |||||
| .getPhoneBtn{ | |||||
| opacity: 0; | |||||
| } | } |
| // pages/poster/poster.js | |||||
| const app = getApp() | |||||
| Page({ | |||||
| /** | |||||
| * 页面的初始数据 | |||||
| */ | |||||
| data: { | |||||
| imgUrl: app.globalData.urlStatic,//图片路径 | |||||
| canvasContron:null,//canvas | |||||
| qrCodeUrl:"https://www.jiyou-tech.com/2020/496_qichen/static/images/testQrCode.png", | |||||
| windowScale:0,//屏幕缩放比 | |||||
| windowW: 0,//屏幕宽度 | |||||
| windowH: 0,//屏幕高度 | |||||
| posterUrl:null,//海报图片 | |||||
| }, | |||||
| /** | |||||
| * 生命周期函数--监听页面加载 | |||||
| */ | |||||
| onLoad: function (options) { | |||||
| }, | |||||
| /** | |||||
| * 生命周期函数--监听页面初次渲染完成 | |||||
| */ | |||||
| onReady: function () { | |||||
| this.data.canvasContron = wx.createCanvasContext('myCanvas'); | |||||
| wx.getSystemInfo({ | |||||
| success: res => { | |||||
| this.data.windowScale = res.windowWidth / 750; | |||||
| this.data.windowW = res.windowWidth; | |||||
| this.data.windowH = res.windowHeight; | |||||
| this.posterDrawing(); | |||||
| } | |||||
| }) | |||||
| }, | |||||
| /** | |||||
| * 生命周期函数--监听页面显示 | |||||
| */ | |||||
| onShow: function () { | |||||
| }, | |||||
| /** | |||||
| * 生命周期函数--监听页面隐藏 | |||||
| */ | |||||
| onHide: function () { | |||||
| }, | |||||
| /** | |||||
| * 生命周期函数--监听页面卸载 | |||||
| */ | |||||
| onUnload: function () { | |||||
| }, | |||||
| /** | |||||
| * 页面相关事件处理函数--监听用户下拉动作 | |||||
| */ | |||||
| onPullDownRefresh: function () { | |||||
| }, | |||||
| /** | |||||
| * 页面上拉触底事件的处理函数 | |||||
| */ | |||||
| onReachBottom: function () { | |||||
| }, | |||||
| /** | |||||
| * 用户点击右上角分享 | |||||
| */ | |||||
| onShareAppMessage: function () { | |||||
| return { | |||||
| title: '500元购车券', | |||||
| imageUrl: "", | |||||
| path: "/pages/coupon/coupon" | |||||
| } | |||||
| }, | |||||
| saveImg:function(){//保存到手机 | |||||
| wx.chooseImage({ | |||||
| success: function (res) { | |||||
| console.log(res); | |||||
| const tempFilePaths = res.tempFilePaths | |||||
| wx.saveFile({ | |||||
| tempFilePath: tempFilePaths[0], | |||||
| success(res) { | |||||
| console.log(res); | |||||
| const savedFilePath = res.savedFilePath | |||||
| } | |||||
| }) | |||||
| } | |||||
| }) | |||||
| }, | |||||
| posterDrawing: function () {//海报绘制 | |||||
| var ctx = this.data.canvasContron; | |||||
| var scale = this.data.windowScale; | |||||
| console.log(scale); | |||||
| //背景 | |||||
| ctx.drawImage(this.data.imgUrl + '/images/tempImg1.jpg', 0, 0, scale * 444, scale * 817);//defaultHead | |||||
| ctx.setFillStyle("#FFFFFF"); | |||||
| ctx.save(); | |||||
| ctx.beginPath(); //开始绘制 | |||||
| //先画个圆 前两个参数确定了圆心 (x,y) 坐标 第三个参数是圆的半径 四参数是绘图方向 默认是false,即顺时针 | |||||
| ctx.arc(scale * 48 / 2 + scale * 49, scale * 48 / 2 + scale * 538, scale * 48 / 2, 0, Math.PI * 2, false); | |||||
| ctx.clip(); //剪切 | |||||
| ctx.drawImage(this.data.imgUrl + '/images/coupon.png', scale * 49, scale * 538, scale * 48, scale * 48); //头像 | |||||
| ctx.restore(); //恢复之前保存的绘图上下文 | |||||
| //名称 | |||||
| ctx.setFontSize(scale * 28); | |||||
| ctx.setFillStyle('#FFFFFF'); | |||||
| ctx.setTextAlign('left'); | |||||
| ctx.fillText("啦啦啦", scale * 102, scale *572); | |||||
| //我是第XXX星探 | |||||
| ctx.drawImage(this.data.imgUrl + '/images/posterNum.png', scale * 50, scale * 598, scale * 333, scale * 74); | |||||
| //二维码 | |||||
| ctx.drawImage(this.data.qrCodeUrl, scale * 282, scale * 672, scale * 105, scale* 106); | |||||
| //绘制 | |||||
| ctx.draw(); | |||||
| }, | |||||
| savePoster:function(){//生成海报 | |||||
| wx.canvasToTempFilePath({ | |||||
| width: 443 * this.windowScale, | |||||
| height: 817 * this.windowScale, | |||||
| destWidth: 443 * this.windowScale *this.data.windowW*3, | |||||
| destHeight: 817 * this.windowScale * this.data.windowH*3, | |||||
| canvasId: 'myCanvas', | |||||
| success: res => { | |||||
| wx.previewImage({ | |||||
| urls: [res.tempFilePath] // 需要预览的图片http链接列表 | |||||
| }) | |||||
| // this.data.posterUrl = res.tempFilePath; | |||||
| // console.log(this.data.posterUrl); | |||||
| } | |||||
| }) | |||||
| } | |||||
| }) |
| { | |||||
| "navigationBarTitleText": "东风启辰星探计划", | |||||
| "usingComponents": { | |||||
| "tabBar": "../component/tabBar/index" | |||||
| } | |||||
| } |
| <!--pages/poster/poster.wxml--> | |||||
| <view class="all"> | |||||
| <view class="main"> | |||||
| <view class="selectTempFrame"> | |||||
| <image class="posterChoose" src="{{imgUrl+'/images/posterChoose.png'}}"></image> | |||||
| <canvas class="canvasDraw" canvas-id="myCanvas"></canvas> | |||||
| </view> | |||||
| <view class="lookBigPic" bindtap="savePoster"> | |||||
| <image class="lookBigIcon" src="{{imgUrl+'/images/lookbigIcon.png'}}"></image> | |||||
| <view class="lookBigText">查看大图</view> | |||||
| </view> | |||||
| <image class="selectPosterTip" src="{{imgUrl+'/images/selectPosterTip.png'}}"></image> | |||||
| <view class="operationFrame"> | |||||
| <view class="operationGroup" style="margin-right:55rpx;" bindtap="saveImg"> | |||||
| <image class="saveIcon" src="{{imgUrl+'/images/saveIcon.png'}}"></image> | |||||
| <view class="operationText">保存到手机</view> | |||||
| </view> | |||||
| <view class="operationGroup"> | |||||
| <image class="saveIcon" src="{{imgUrl+'/images/shareIcon.png'}}"></image> | |||||
| <view class="operationText">分享给好友</view> | |||||
| <button class="shareBtn" open-type="share"></button> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <tabBar></tabBar> | |||||
| </view> |
| /* pages/poster/poster.wxss */ | |||||
| image{ | |||||
| display: block; | |||||
| } | |||||
| view{ | |||||
| -webkit-overflow-scrolling: touch; | |||||
| } | |||||
| .main{ | |||||
| height: calc(100vh - 150rpx); | |||||
| overflow: auto; | |||||
| position: relative; | |||||
| } | |||||
| .operationFrame{ | |||||
| margin-top: 43rpx; | |||||
| width: 750rpx; | |||||
| height: 234rpx; | |||||
| background-image: url('https://www.jiyou-tech.com/2020/496_qichen/static/images/posterBg.png?v=002'); | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content:center; | |||||
| } | |||||
| .operationGroup{ | |||||
| width: 96rpx; | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| align-items: center; | |||||
| position: relative; | |||||
| overflow: hidden; | |||||
| } | |||||
| .saveIcon{ | |||||
| width: 96rpx; | |||||
| height: 96rpx; | |||||
| } | |||||
| .operationText{ | |||||
| margin-top: 12rpx; | |||||
| line-height: 12rpx; | |||||
| font-size:12rpx; | |||||
| font-family:PingFang; | |||||
| font-weight:bold; | |||||
| color:rgba(113,112,113,1); | |||||
| } | |||||
| .shareBtn{ | |||||
| position: absolute; | |||||
| top: 0; | |||||
| left: 0; | |||||
| width: 96rpx; | |||||
| height: 96rpx; | |||||
| margin: 0; | |||||
| padding: 0; | |||||
| opacity: 0; | |||||
| } | |||||
| .selectTempFrame{ | |||||
| width:443rpx; | |||||
| height:817rpx; | |||||
| border: 10rpx solid #00548C; | |||||
| position: relative; | |||||
| margin: 0 auto; | |||||
| margin-top: 92rpx; | |||||
| } | |||||
| .posterChoose{ | |||||
| width: 73rpx; | |||||
| height: 73rpx; | |||||
| position: absolute; | |||||
| left: 50%; | |||||
| transform: translate(-50%,-50%); | |||||
| top:0; | |||||
| z-index: 2; | |||||
| } | |||||
| .canvasDraw{ | |||||
| width:100%; | |||||
| height:100%; | |||||
| } | |||||
| .lookBigPic{ | |||||
| display: flex; | |||||
| align-items: center; | |||||
| flex-direction: column; | |||||
| margin-top: 5rpx; | |||||
| } | |||||
| .lookBigIcon{ | |||||
| width: 41rpx; | |||||
| height: 41rpx; | |||||
| } | |||||
| .lookBigText{ | |||||
| margin-top: 11rpx; | |||||
| font-size:18rpx; | |||||
| line-height: 18rpx; | |||||
| font-family:PingFang; | |||||
| font-weight:bold; | |||||
| color:rgba(113,112,113,1); | |||||
| } | |||||
| .selectPosterTip{ | |||||
| width: 278rpx; | |||||
| height: 68rpx; | |||||
| margin: 0 auto; | |||||
| margin-top: 20rpx; | |||||
| } |
| // pages/prizes/prizes.js | |||||
| const app = getApp() | |||||
| Page({ | |||||
| /** | |||||
| * 页面的初始数据 | |||||
| */ | |||||
| data: { | |||||
| imgUrl: app.globalData.urlStatic,//图片路径 | |||||
| }, | |||||
| /** | |||||
| * 生命周期函数--监听页面加载 | |||||
| */ | |||||
| onLoad: function (options) { | |||||
| }, | |||||
| /** | |||||
| * 生命周期函数--监听页面初次渲染完成 | |||||
| */ | |||||
| onReady: function () { | |||||
| }, | |||||
| /** | |||||
| * 生命周期函数--监听页面显示 | |||||
| */ | |||||
| onShow: function () { | |||||
| }, | |||||
| /** | |||||
| * 生命周期函数--监听页面隐藏 | |||||
| */ | |||||
| onHide: function () { | |||||
| }, | |||||
| /** | |||||
| * 生命周期函数--监听页面卸载 | |||||
| */ | |||||
| onUnload: function () { | |||||
| }, | |||||
| /** | |||||
| * 页面相关事件处理函数--监听用户下拉动作 | |||||
| */ | |||||
| onPullDownRefresh: function () { | |||||
| }, | |||||
| /** | |||||
| * 页面上拉触底事件的处理函数 | |||||
| */ | |||||
| onReachBottom: function () { | |||||
| }, | |||||
| /** | |||||
| * 用户点击右上角分享 | |||||
| */ | |||||
| onShareAppMessage: function () { | |||||
| } | |||||
| }) |
| { | |||||
| "navigationBarTitleText": "活动奖品", | |||||
| "usingComponents": { | |||||
| "tabBar": "../component/tabBar/index" | |||||
| } | |||||
| } |
| <!--pages/prizes/prizes.wxml--> | |||||
| <view class="all"> | |||||
| <view class="main"> | |||||
| <view class="prizeTitleFrame"> | |||||
| <view class="prizeTitle">活动奖品</view> | |||||
| </view> | |||||
| <view class="thirdAward" style="margin-top:0;">一等奖</view> | |||||
| <view class="firstPrize"> | |||||
| <image class="firstPrizePic" src="{{imgUrl+'/images/firstPrizePic.png'}}"></image> | |||||
| <view class="firstPrizeText">欢乐谷全家一日游</view> | |||||
| </view> | |||||
| <view class="thirdAward">二等奖</view> | |||||
| <view class="ticketGroup"> | |||||
| <view class="prizeTicket"> | |||||
| <image class="prizeTicketPic" src="{{imgUrl+'/images/prizeTicket1.png'}}"></image> | |||||
| <view class="prizeTicketName">欢乐谷全家一日游</view> | |||||
| </view> | |||||
| <view class="prizeTicket"> | |||||
| <image class="prizeTicketPic" src="{{imgUrl+'/images/prizeTicket2.png'}}"></image> | |||||
| <view class="prizeTicketName">迪士尼全家一日游</view> | |||||
| </view> | |||||
| <view class="prizeTicket"> | |||||
| <image class="prizeTicketPic" style="width:210rpx;" src="{{imgUrl+'/images/prizeTicket3.png'}}"></image> | |||||
| <view class="prizeTicketName">长隆全家一日游</view> | |||||
| </view> | |||||
| </view> | |||||
| <view class="thirdAward">三等奖</view> | |||||
| <view class="thirdAwardGroup"> | |||||
| <view class="threeFrame"> | |||||
| <view class="threeGroup"> | |||||
| <image class="three1" src="{{imgUrl+'/images/three1.png'}}"></image> | |||||
| </view> | |||||
| <view class="threeText">喜马拉雅智能音响</view> | |||||
| </view> | |||||
| <view class="threeFrame"> | |||||
| <view class="threeGroup"> | |||||
| <image class="three2" src="{{imgUrl+'/images/three2.png'}}"></image> | |||||
| </view> | |||||
| <view class="threeText">松下扫地机器人</view> | |||||
| </view> | |||||
| <view class="threeFrame"> | |||||
| <view class="threeGroup"> | |||||
| <image class="three3" src="{{imgUrl+'/images/three3.png'}}"></image> | |||||
| </view> | |||||
| <view class="threeText">索尼无线蓝牙耳机</view> | |||||
| </view> | |||||
| </view> | |||||
| <view class="thirdAward">入门奖</view> | |||||
| <view class="introductionGroup"> | |||||
| <view class="introduction"> | |||||
| <image class="introductionPic" src="{{imgUrl+'/images/Introduction1.png'}}"></image> | |||||
| <view class="introductionText">美团外卖20元代金券</view> | |||||
| </view><view class="introduction"> | |||||
| <image class="introductionPic" src="{{imgUrl+'/images/Introduction2.png'}}"></image> | |||||
| <view class="introductionText">饿了么15元代金券</view> | |||||
| </view><view class="introduction"> | |||||
| <image class="introductionPic" src="{{imgUrl+'/images/Introduction3.png'}}"></image> | |||||
| <view class="introductionText">瑞幸咖啡免费券</view> | |||||
| </view><view class="introduction"> | |||||
| <image class="introductionPic" src="{{imgUrl+'/images/Introduction4.png'}}"></image> | |||||
| <view class="introductionText">网易云音乐月卡一张</view> | |||||
| </view><view class="introduction"> | |||||
| <image class="introductionPic" src="{{imgUrl+'/images/Introduction5.png'}}"></image> | |||||
| <view class="introductionText">腾讯视频月卡一张</view> | |||||
| </view><view class="introduction"> | |||||
| <image class="introductionPic" src="{{imgUrl+'/images/Introduction6.png'}}"></image> | |||||
| <view class="introductionText">爱奇艺月卡一张</view> | |||||
| </view> | |||||
| </view> | |||||
| <view class="immediateFetching"> | |||||
| <view class="prizeTitle" style="margin-top:0;">立即抓取</view> | |||||
| </view> | |||||
| </view> | |||||
| <tabBar></tabBar> | |||||
| </view> |
| /* pages/prizes/prizes.wxss */ | |||||
| image{ | |||||
| display: block; | |||||
| } | |||||
| view{ | |||||
| -webkit-overflow-scrolling: touch; | |||||
| } | |||||
| .main{ | |||||
| height: calc(100vh - 150rpx); | |||||
| overflow: auto; | |||||
| padding-top: 222rpx; | |||||
| padding-bottom: 152rpx; | |||||
| box-sizing: border-box; | |||||
| } | |||||
| .prizeTitle{ | |||||
| width:710rpx; | |||||
| height:70rpx; | |||||
| background-color: #17528A; | |||||
| border-radius: 20rpx; | |||||
| margin: 0 auto; | |||||
| line-height: 70rpx; | |||||
| text-align: center; | |||||
| font-size:30rpx; | |||||
| font-family:PingFang; | |||||
| font-weight:500; | |||||
| color:rgba(255,255,255,1); | |||||
| } | |||||
| .ticketGroup{ | |||||
| padding: 0 45rpx; | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: space-between; | |||||
| margin-top:35rpx; | |||||
| } | |||||
| .prizeTicket{ | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| align-items: center; | |||||
| } | |||||
| .prizeTicketPic{ | |||||
| width: 206rpx; | |||||
| height: 83rpx; | |||||
| } | |||||
| .prizeTicketName{ | |||||
| font-size:20rpx; | |||||
| line-height: 20rpx; | |||||
| font-family:PingFang; | |||||
| font-weight:400; | |||||
| color:rgba(35,33,34,1); | |||||
| margin-top: 30rpx; | |||||
| } | |||||
| .thirdAward{ | |||||
| width:128rpx; | |||||
| height:30rpx; | |||||
| background-color: #17528A; | |||||
| font-size:18rpx; | |||||
| line-height: 30rpx; | |||||
| font-family:PingFang; | |||||
| font-weight:400; | |||||
| color:rgba(255,255,255,1); | |||||
| border-radius: 20rpx; | |||||
| text-align: center; | |||||
| margin-top: 65rpx; | |||||
| margin-left: 45rpx; | |||||
| } | |||||
| .thirdAwardGroup{ | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: space-between; | |||||
| padding: 0 45rpx; | |||||
| } | |||||
| .threeFrame{ | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| align-items: center; | |||||
| margin-top: 45rpx; | |||||
| } | |||||
| .threeGroup{ | |||||
| width: 168rpx; | |||||
| height: 191rpx; | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| } | |||||
| .three1{ | |||||
| width: 86rpx; | |||||
| height: 191rpx; | |||||
| } | |||||
| .three2{ | |||||
| width: 168rpx; | |||||
| height: 168rpx; | |||||
| } | |||||
| .three3{ | |||||
| width: 147rpx; | |||||
| height: 166rpx; | |||||
| } | |||||
| .threeText{ | |||||
| line-height: 20rpx; | |||||
| font-size:20rpx; | |||||
| font-family:PingFang; | |||||
| font-weight:400; | |||||
| color:rgba(35,33,34,1); | |||||
| margin-top: 30rpx; | |||||
| } | |||||
| .introductionGroup{ | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: space-between; | |||||
| flex-wrap: wrap; | |||||
| padding: 0 45rpx; | |||||
| } | |||||
| .introduction{ | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| align-items: center; | |||||
| padding-top: 15rpx; | |||||
| } | |||||
| .introductionPic{ | |||||
| width: 194rpx; | |||||
| height: 107rpx; | |||||
| margin-bottom: 26rpx; | |||||
| margin-top: 30rpx; | |||||
| } | |||||
| .introductionText{ | |||||
| font-size:20rpx; | |||||
| line-height: 20rpx; | |||||
| font-family:PingFang; | |||||
| font-weight:400; | |||||
| color:rgba(35,33,34,1); | |||||
| } | |||||
| .immediateFetching{ | |||||
| position: fixed; | |||||
| left: 0; | |||||
| bottom: 150rpx; | |||||
| width: 750rpx; | |||||
| padding-top: 37rpx; | |||||
| padding-bottom: 45rpx; | |||||
| background-color: white; | |||||
| } | |||||
| .firstPrize{ | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| align-items: center; | |||||
| margin-top: 35rpx; | |||||
| } | |||||
| .firstPrizePic{ | |||||
| width:460rpx; | |||||
| height:172rpx; | |||||
| } | |||||
| .firstPrizeText{ | |||||
| line-height: 28rpx; | |||||
| font-size:28rpx; | |||||
| font-family:PingFang; | |||||
| font-weight:400; | |||||
| color:rgba(35,33,34,1); | |||||
| margin-top: 30rpx; | |||||
| } | |||||
| .prizeTitleFrame{ | |||||
| position: fixed; | |||||
| top: 0; | |||||
| left: 0; | |||||
| padding-top: 87rpx; | |||||
| padding-bottom:65rpx; | |||||
| background-color: white; | |||||
| width: 750rpx; | |||||
| } |
| "name": "幸运星抓手", | "name": "幸运星抓手", | ||||
| "pathName": "pages/luckyStar/luckyStar", | "pathName": "pages/luckyStar/luckyStar", | ||||
| "query": "" | "query": "" | ||||
| }, | |||||
| { | |||||
| "id": -1, | |||||
| "name": "活动奖品", | |||||
| "pathName": "pages/prizes/prizes", | |||||
| "query": "" | |||||
| }, | |||||
| { | |||||
| "id": -1, | |||||
| "name": "海报", | |||||
| "pathName": "pages/poster/poster", | |||||
| "query": "" | |||||
| }, | |||||
| { | |||||
| "id": -1, | |||||
| "name": "优惠券", | |||||
| "pathName": "pages/coupon/coupon", | |||||
| "query": "" | |||||
| } | } | ||||
| ] | ] | ||||
| } | } |