| @@ -1,10 +1,13 @@ | |||
| { | |||
| "pages": [ | |||
| "pages/everyday/everyday", | |||
| "pages/star/star", | |||
| "pages/scout/scout", | |||
| "pages/index/index", | |||
| "pages/everyday/everyday", | |||
| "pages/logs/logs", | |||
| "pages/myCenter/myCenter" | |||
| "pages/myCenter/myCenter", | |||
| "pages/scout/register/register", | |||
| "pages/scout/share/share" | |||
| ], | |||
| "window": { | |||
| "backgroundTextStyle": "light", | |||
| @@ -57,6 +57,14 @@ Page({ | |||
| }) | |||
| } | |||
| }, | |||
| /** | |||
| * 星探任务 | |||
| */ | |||
| goScout(){ | |||
| wx.navigateTo({ | |||
| url: '../scout/scout' | |||
| }) | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面加载 | |||
| @@ -23,7 +23,7 @@ | |||
| <image class="arrowBtn" style="right:-30rpx;" src="{{imgUrl+'/star/everyday/arrowRightBtn.png'}}" bindtap="nextPicturl"></image> | |||
| </view> | |||
| <view class="btnBox"> | |||
| <view class="btn" style="margin-right:20rpx;">星探任务</view> | |||
| <view class="btn" style="margin-right:20rpx;" bindtap="goScout">星探任务</view> | |||
| <view class="btn select" style="margin-left:20rpx;">每日任务</view> | |||
| </view> | |||
| <view class="mask" wx:if="{{maskShow}}"> | |||
| @@ -0,0 +1,189 @@ | |||
| // pages/scout/register/register.js | |||
| var Mcaptcha = require('../../../utils/mcaptcha.js'); | |||
| const app = getApp() | |||
| Page({ | |||
| /** | |||
| * 页面的初始数据 | |||
| */ | |||
| data: { | |||
| imgUrl: app.globalData.urlStatic,//图片路径 | |||
| type: 0, //1车主 0非车主 | |||
| imgCode:'1234',//验证码 | |||
| vocationList:['网约车司机','公交司机','快的司机'],//职业列表 | |||
| vocationIndex:0, | |||
| cityList:['宁波','北京','上海','佛山'],//城市列表 | |||
| cityIndex:0, | |||
| getVcodeTime:0,//获取验证码倒计时 | |||
| getCodeTimeKey:null, | |||
| photoList:[],//图片列表 | |||
| agree:false,//是否同意本协议 | |||
| }, | |||
| /** | |||
| * 切换车主非车主 | |||
| */ | |||
| changeType(e) { | |||
| var type = e.currentTarget.dataset.type; | |||
| if (this.data.type != type) { | |||
| this.setData({ | |||
| type: type | |||
| }) | |||
| if (type == 1) { | |||
| setTimeout(this.vCodeRefresh, 100); | |||
| } | |||
| } | |||
| }, | |||
| /** | |||
| * 提交信息 | |||
| */ | |||
| formSubmit1(e){ | |||
| console.log('form发生了submit事件,携带数据为:', e.detail.value) | |||
| }, | |||
| /** | |||
| * 更换职业 | |||
| */ | |||
| changeVocation: function (e) { | |||
| this.setData({ | |||
| vocationIndex: e.detail.value | |||
| }) | |||
| }, | |||
| /** | |||
| * 切换城市 | |||
| */ | |||
| changeCity(e){ | |||
| this.setData({ | |||
| cityIndex: e.detail.value | |||
| }) | |||
| }, | |||
| /** | |||
| * 获取验证码 | |||
| */ | |||
| getVcode(){ | |||
| console.log('获取验证码') | |||
| this.setData({ | |||
| getVcodeTime: 60 | |||
| }) | |||
| this.getCodeTimeKey=setInterval(this.vCodeDownTime,1000); | |||
| }, | |||
| vCodeDownTime(){ | |||
| var time = this.data.getVcodeTime-1; | |||
| console.log(time) | |||
| this.setData({ | |||
| getVcodeTime: time | |||
| }) | |||
| if(time<=0){ | |||
| clearInterval(this.getCodeTimeKey); | |||
| } | |||
| }, | |||
| /** | |||
| * 上传照片 | |||
| */ | |||
| chooseImage(){ | |||
| wx.chooseImage({ | |||
| count:1, | |||
| sizeType: ['original'], //可选择原图 | |||
| sourceType: ['album', 'camera'], //可选择性开放访问相册、相机 | |||
| success: res => { | |||
| var list=this.data.photoList; | |||
| list.push(res.tempFilePaths[0]); | |||
| this.setData({ | |||
| photoList:list | |||
| }) | |||
| } | |||
| }) | |||
| }, | |||
| /** | |||
| * 同意协议 | |||
| */ | |||
| agreementClick(event){ | |||
| var agree = this.data.agree; | |||
| this.setData({ "agree": !agree }); | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面加载 | |||
| */ | |||
| onLoad: function(options) { | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面初次渲染完成 | |||
| */ | |||
| onReady: function() { | |||
| this.mcaptcha = new Mcaptcha({ | |||
| el: 'canvas', | |||
| width: 80, | |||
| height: 35, | |||
| createCodeImg: "" | |||
| }); | |||
| setTimeout(this.checkVcode, 1000); | |||
| }, | |||
| /** | |||
| * 刷新验证码 | |||
| */ | |||
| vCodeRefresh() { | |||
| this.mcaptcha.refresh(); | |||
| }, | |||
| /** | |||
| * 验证验证码 | |||
| */ | |||
| checkVcode() { | |||
| var res = this.mcaptcha.validate(this.data.imgCode); | |||
| if (this.data.imgCode == "" || this.data.imgCode == null) { | |||
| wx.showToast({ | |||
| title: '请输入图形验证码' | |||
| }) | |||
| return; | |||
| } | |||
| if (!res) { | |||
| wx.showToast({ | |||
| title: '图形验证码错误' | |||
| }) | |||
| return; | |||
| } | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面显示 | |||
| */ | |||
| onShow: function() { | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面隐藏 | |||
| */ | |||
| onHide: function() { | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面卸载 | |||
| */ | |||
| onUnload: function() { | |||
| clearInterval(this.getCodeTimeKey); | |||
| this.data.getVcodeTime=60; | |||
| }, | |||
| /** | |||
| * 页面相关事件处理函数--监听用户下拉动作 | |||
| */ | |||
| onPullDownRefresh: function() { | |||
| }, | |||
| /** | |||
| * 页面上拉触底事件的处理函数 | |||
| */ | |||
| onReachBottom: function() { | |||
| }, | |||
| /** | |||
| * 用户点击右上角分享 | |||
| */ | |||
| onShareAppMessage: function() { | |||
| } | |||
| }) | |||
| @@ -0,0 +1,5 @@ | |||
| { | |||
| "usingComponents": { | |||
| "tabBar": "../component/tabBar/index" | |||
| } | |||
| } | |||
| @@ -0,0 +1,71 @@ | |||
| <!--pages/scout/register/register.wxml--> | |||
| <view class="showView"> | |||
| <view class="registerContainer"> | |||
| <view class="tabsBox"> | |||
| <view class="item {{type==1?'select':''}}" data-type="1" bindtap="changeType">车主</view> | |||
| <view class="item {{type==0?'select':''}}" data-type="0" bindtap="changeType">非车主</view> | |||
| </view> | |||
| <view class="welcome">欢迎加入星探计划</view> | |||
| <form bindsubmit="formSubmit1" wx:if="{{type==1}}"> | |||
| <view class="Vehicle"> | |||
| <input name="VIN" placeholder="请输入车牌号/VIN号" placeholder-style="font-size:23rpx;" /> | |||
| <input name="code" placeholder="请输入验证码" placeholder-style="font-size:23rpx;" style="padding-right:300rpx;" /> | |||
| <view class="VcodeBox"> | |||
| <canvas style="width:205rpx;height:51rpx;position:absolute;left:20rpx;bottom:0rpx;text-align: center;z-index:9999;" canvas-id="canvas" bindtap="vCodeRefresh"></canvas> | |||
| </view> | |||
| <view class="tipTxt">VIN示意图</view> | |||
| <image class="license" src="{{imgUrl+'/star/scout/register/card.png'}}"></image> | |||
| <button class="submitBtn" formType="submit">提交</button> | |||
| <view class="reminder">温馨提示:您填写的信息将同步至东风启辰服务号,以便改善我们的产品,更好的为您提供优质的服务。</view> | |||
| </view> | |||
| </form> | |||
| <form wx:else> | |||
| <view class="NoVehicle"> | |||
| <picker name="vocation" bindchange="changeVocation" value="{{vocationIndex}}" range="{{vocationList}}"> | |||
| <view class="picker"> | |||
| 职业:{{vocationList[vocationIndex]}} | |||
| </view> | |||
| <image class="arrowDown" src="{{imgUrl+'/star/scout/register/arrowDown.png'}}"></image> | |||
| </picker> | |||
| <input name="name" placeholder="请输入您的姓名" placeholder-style="font-size:23rpx;" /> | |||
| <input name="phone" placeholder="请输入您的手机号码" placeholder-style="font-size:23rpx;" /> | |||
| <input name="code" placeholder="请输入您的验证码" placeholder-style="font-size:23rpx;" style="padding-right:250rpx;" /> | |||
| <view class="getCode" bindtap="getVcode" wx:if="{{getVcodeTime==0}}" style="z-index:99;">获取验证码</view> | |||
| <view class="getCode codeTip" wx:if="{{getVcodeTime!=0}}">{{getVcodeTime}}秒后重新发送</view> | |||
| <picker name="city" bindchange="changeCity" value="{{cityIndex}}" range="{{cityList}}"> | |||
| <view class="picker"> | |||
| {{cityList[cityIndex]}} | |||
| </view> | |||
| <image class="arrowDown" src="{{imgUrl+'/star/scout/register/arrowDown.png'}}"></image> | |||
| </picker> | |||
| <view class="hintTitle">网约车司机合影示意图</view> | |||
| <view class="hintBox"> | |||
| <view class="hintItem" style="margin-right:15rpx;"> | |||
| <image class="hintImg" src="{{imgUrl+'/star/scout/register/hintImg1.png'}}"></image> | |||
| <view class="hintTxt">驾驶员与车辆合影示意</view> | |||
| </view> | |||
| <view class="hintItem" style="margin-left:15rpx;"> | |||
| <image class="hintImg" src="{{imgUrl+'/star/scout/register/hintImg2.png'}}"></image> | |||
| <view class="hintTxt">驾驶员与许可证合影示意</view> | |||
| </view> | |||
| </view> | |||
| <view class="upPhotoTitle">请上传您的照片:</view> | |||
| <view class="upPhonoBox"> | |||
| <view class="phontBox" wx:for="{{photoList}}" wx:if="photoList.length>0"> | |||
| <image src="{{item}}" mode="aspectFill"></image> | |||
| </view> | |||
| <image class="upPhontBtn" src="{{imgUrl+'/star/scout/register/upBtn.png'}}" bindtap="chooseImage"></image> | |||
| </view> | |||
| <view class="photoNotes">注:请上传您与车辆及经营许可证的合影</view> | |||
| <button class="submitBtn" formType="submit">提交</button> | |||
| <view class="agreementBox"> | |||
| <view class="checkBox" bindtap='agreementClick'> | |||
| <icon type="success_no_circle" size="10" wx:if="{{agree}}" /> | |||
| </view> | |||
| 请阅读并同意本协议内容 | |||
| </view> | |||
| </view> | |||
| </form> | |||
| </view> | |||
| </view> | |||
| <tabBar></tabBar> | |||
| @@ -0,0 +1,202 @@ | |||
| /* pages/scout/register/register.wxss */ | |||
| .registerContainer{ | |||
| width: 100%; | |||
| height: calc(100% - 168rpx); | |||
| margin-top: 168rpx; | |||
| overflow-y: scroll; | |||
| } | |||
| .tabsBox{ | |||
| width: 611rpx; | |||
| height: 81rpx; | |||
| border: 1rpx solid #345489; | |||
| margin: 0 auto; | |||
| border-radius: 10rpx; | |||
| box-sizing: border-box; | |||
| } | |||
| .tabsBox>.item{ | |||
| width: 50%; | |||
| height: 100%; | |||
| line-height: 81rpx; | |||
| color: #345489; | |||
| display: inline-block; | |||
| text-align: center; | |||
| } | |||
| .tabsBox>.item.select{ | |||
| color: #ffffff; | |||
| background-color: #345489; | |||
| } | |||
| .welcome{ | |||
| font-size: 33rpx; | |||
| font-weight: bold; | |||
| text-align: center; | |||
| margin: 28rpx auto 28rpx auto; | |||
| } | |||
| .Vehicle{ | |||
| position: relative; | |||
| } | |||
| .Vehicle>input{ | |||
| width: 675rpx; | |||
| height: 66rpx; | |||
| border: 1rpx solid #808080; | |||
| margin: 0 auto 35rpx auto; | |||
| border-radius: 21rpx; | |||
| box-sizing: border-box; | |||
| padding: 0 27rpx; | |||
| font-size: 23rpx; | |||
| } | |||
| .VcodeBox{ | |||
| position: absolute; | |||
| width: 205rpx; | |||
| height: 51rpx; | |||
| border:1rpx solid #808080; | |||
| border-radius: 15rpx; | |||
| right: 45rpx; | |||
| top: 108rpx; | |||
| } | |||
| .Vehicle>.tipTxt{ | |||
| text-align: center; | |||
| font-size: 22rpx; | |||
| color: #666768; | |||
| } | |||
| .Vehicle>.license{ | |||
| width: 553rpx; | |||
| height: 363rpx; | |||
| margin: 22rpx auto 0 auto; | |||
| } | |||
| .Vehicle>.submitBtn{ | |||
| width: 675rpx; | |||
| height: 70rpx; | |||
| background-color: #2a558d; | |||
| color: #ffffff; | |||
| font-size: 28rpx; | |||
| margin: 200rpx auto 0 auto; | |||
| } | |||
| .Vehicle>.reminder{ | |||
| font-size: 17rpx; | |||
| color: #adaeae; | |||
| width: 675rpx; | |||
| margin: 25rpx auto; | |||
| line-height: 32rpx; | |||
| } | |||
| .NoVehicle{ | |||
| position: relative; | |||
| } | |||
| .NoVehicle>.getCode{ | |||
| position: absolute; | |||
| top: 250rpx; | |||
| right: 95rpx; | |||
| font-size: 23rpx; | |||
| color: #1e68e3; | |||
| } | |||
| .NoVehicle>.codeTip{ | |||
| color: #b5b5b6; | |||
| } | |||
| .NoVehicle>picker{ | |||
| position: relative; | |||
| width: 638rpx; | |||
| height: 66rpx; | |||
| line-height: 66rpx; | |||
| border: 1rpx solid #808080; | |||
| margin: 0 auto 13rpx auto; | |||
| border-radius: 21rpx; | |||
| box-sizing: border-box; | |||
| color: #000000; | |||
| padding: 0 30rpx; | |||
| font-size: 23rpx; | |||
| } | |||
| image.arrowDown{ | |||
| position: absolute; | |||
| width: 23rpx; | |||
| height: 11rpx; | |||
| top: 30rpx; | |||
| right: 42rpx; | |||
| } | |||
| .NoVehicle>input{ | |||
| width: 638rpx; | |||
| height: 66rpx; | |||
| line-height: 66rpx; | |||
| border: 1rpx solid #808080; | |||
| margin: 0 auto 13rpx auto; | |||
| border-radius: 21rpx; | |||
| box-sizing: border-box; | |||
| color: #000000; | |||
| padding: 0 30rpx; | |||
| font-size: 23rpx; | |||
| } | |||
| .NoVehicle>.hintTitle{ | |||
| text-align: center; | |||
| font-size: 22rpx; | |||
| color: #666768; | |||
| margin-bottom: 15rpx; | |||
| } | |||
| .NoVehicle>.hintBox{ | |||
| display: flex; | |||
| width: 700rpx; | |||
| margin: 0 auto; | |||
| border-bottom: 2rpx solid #595959; | |||
| justify-content: center; | |||
| margin-bottom: 25rpx; | |||
| } | |||
| .NoVehicle>.hintBox>.hintItem{ | |||
| width: 216rpx; | |||
| } | |||
| .NoVehicle>.hintBox>.hintItem>.hintImg{ | |||
| width: 100%; | |||
| height: 149rpx; | |||
| } | |||
| .NoVehicle>.hintBox>.hintItem>.hintTxt{ | |||
| font-size: 17rpx; | |||
| text-align: center; | |||
| padding: 15rpx 0; | |||
| } | |||
| .NoVehicle>.upPhotoTitle{ | |||
| font-size: 21rpx; | |||
| color: #000000; | |||
| font-weight: bold; | |||
| margin-left: 55rpx; | |||
| } | |||
| .NoVehicle>.upPhonoBox{ | |||
| display: flex; | |||
| margin: 15rpx 25rpx; | |||
| } | |||
| .NoVehicle>.upPhonoBox>.upPhontBtn{ | |||
| width: 125rpx; | |||
| height: 125rpx; | |||
| margin: 10rpx 25rpx; | |||
| } | |||
| .NoVehicle>.upPhonoBox>.phontBox{ | |||
| width: 125rpx; | |||
| height: 125rpx; | |||
| margin: 10rpx 25rpx; | |||
| } | |||
| .NoVehicle>.upPhonoBox>.phontBox>image{ | |||
| width: 100%; | |||
| height: 100%; | |||
| } | |||
| .NoVehicle>.photoNotes{ | |||
| font-size: 17rpx; | |||
| margin-left: 55rpx; | |||
| } | |||
| .NoVehicle>.submitBtn{ | |||
| width: 675rpx; | |||
| height: 70rpx; | |||
| background-color: #2a558d; | |||
| color: #ffffff; | |||
| font-size: 30rpx; | |||
| margin: 20rpx auto 0 auto; | |||
| border-radius: 20rpx; | |||
| } | |||
| .NoVehicle>.agreementBox{ | |||
| margin-top: 20rpx; | |||
| font-size: 16rpx; | |||
| display: flex; | |||
| justify-content: center; | |||
| align-items: center; | |||
| } | |||
| .NoVehicle>.agreementBox>.checkBox{ | |||
| border: 1rpx solid #000000; | |||
| width: 20rpx; | |||
| height: 20rpx; | |||
| display: inline-block; | |||
| margin-right: 5rpx; | |||
| } | |||
| @@ -0,0 +1,81 @@ | |||
| // pages/scout/scout.js | |||
| const app = getApp() | |||
| Page({ | |||
| /** | |||
| * 页面的初始数据 | |||
| */ | |||
| data: { | |||
| imgUrl: app.globalData.urlStatic,//图片路径 | |||
| maskShow: true, | |||
| tipShow:true, | |||
| titleContent:'尊敬的启辰车主您好', | |||
| }, | |||
| /** | |||
| * 关闭提示弹窗 | |||
| */ | |||
| hiddenTip(){ | |||
| this.setData({ | |||
| maskShow: false, | |||
| tipShow: false | |||
| }) | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面加载 | |||
| */ | |||
| onLoad: function (options) { | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面初次渲染完成 | |||
| */ | |||
| onReady: function () { | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面显示 | |||
| */ | |||
| onShow: function () { | |||
| // wx.navigateTo({ | |||
| // url: './share/share' | |||
| // }) | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面隐藏 | |||
| */ | |||
| onHide: function () { | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面卸载 | |||
| */ | |||
| onUnload: function () { | |||
| }, | |||
| /** | |||
| * 页面相关事件处理函数--监听用户下拉动作 | |||
| */ | |||
| onPullDownRefresh: function () { | |||
| }, | |||
| /** | |||
| * 页面上拉触底事件的处理函数 | |||
| */ | |||
| onReachBottom: function () { | |||
| }, | |||
| /** | |||
| * 用户点击右上角分享 | |||
| */ | |||
| onShareAppMessage: function () { | |||
| } | |||
| }) | |||
| @@ -0,0 +1,5 @@ | |||
| { | |||
| "usingComponents": { | |||
| "tabBar": "../component/tabBar/index" | |||
| } | |||
| } | |||
| @@ -0,0 +1,16 @@ | |||
| <!--pages/scout/scout.wxml--> | |||
| <view class="showView"> | |||
| <view class="content"> | |||
| <image class="bg" src="{{imgUrl+'/star/scout/bg.jpg'}}"></image> | |||
| <image class="reward" src="{{imgUrl+'/star/scout/reward.png'}}"></image> | |||
| <view class="btn">立即分享,赚取奖励</view> | |||
| </view> | |||
| <view class="mask" wx:if="{{maskShow}}"> | |||
| <view class="tipContent" wx:if="{{tipShow}}"> | |||
| <view class="title">{{titleContent}}</view> | |||
| <image class="txt" src="{{imgUrl+'/star/scout/tipContent.png'}}"></image> | |||
| <view class="closeBtn" style="right:-40rpx;top:-45rpx;" bindtap="hiddenTip"></view> | |||
| </view> | |||
| </view> | |||
| </view> | |||
| <tabBar></tabBar> | |||
| @@ -0,0 +1,83 @@ | |||
| /* pages/scout/scout.wxss */ | |||
| .content{ | |||
| position: absolute; | |||
| bottom: 0; | |||
| width: 100%; | |||
| display: flex; | |||
| flex-direction: column; | |||
| justify-content: flex-end; | |||
| align-items: center; | |||
| } | |||
| .bg{ | |||
| width: 100%; | |||
| height: 650rpx; | |||
| } | |||
| .reward{ | |||
| width: 602rpx; | |||
| height: 548rpx; | |||
| margin: 43rpx auto 0 auto; | |||
| } | |||
| .btn{ | |||
| text-align: center; | |||
| width: 654rpx; | |||
| height: 58rpx; | |||
| line-height: 58rpx; | |||
| font-size: 30rpx; | |||
| color: #ffffff; | |||
| border-radius: 15rpx; | |||
| background-color: #2a558d; | |||
| margin: 20rpx auto 40rpx auto; | |||
| } | |||
| .mask { | |||
| position: absolute; | |||
| left: 0; | |||
| top: 0; | |||
| width: 100%; | |||
| height: 100%; | |||
| display: flex; | |||
| align-items: center; | |||
| justify-content: center; | |||
| background-color: rgba(0, 0, 0, 0.5); | |||
| } | |||
| .tipContent{ | |||
| position: relative; | |||
| width: 560rpx; | |||
| height: 403rpx; | |||
| border-radius: 15rpx; | |||
| background-color: #ffffff; | |||
| } | |||
| .tipContent>.title{ | |||
| width: 100%; | |||
| height: 78rpx; | |||
| line-height: 78rpx; | |||
| color: #ffffff; | |||
| font-size: 33rpx; | |||
| font-weight: bold; | |||
| text-align: center; | |||
| border-top-left-radius: 15rpx; | |||
| border-top-right-radius: 15rpx; | |||
| background-color: #2a558d; | |||
| } | |||
| .tipContent>.txt{ | |||
| width: 400rpx; | |||
| height: 181rpx; | |||
| margin: 70rpx auto 0 auto; | |||
| } | |||
| .closeBtn { | |||
| color: #ffffff; | |||
| border-radius: 50%; | |||
| text-align: center; | |||
| height: 40rpx; | |||
| line-height: 40rpx; | |||
| width: 40rpx; | |||
| font-size: 30rpx; | |||
| padding: 2rpx; | |||
| position: absolute; | |||
| border: 2rpx solid #fff; | |||
| } | |||
| /* use cross as close button */ | |||
| .closeBtn::before { | |||
| content: "\2716"; | |||
| } | |||
| @@ -0,0 +1,112 @@ | |||
| // pages/scout/share/share.js | |||
| const app = getApp() | |||
| Page({ | |||
| /** | |||
| * 页面的初始数据 | |||
| */ | |||
| data: { | |||
| imgUrl: app.globalData.urlStatic, //图片路径 | |||
| posterList: ['poster1', 'poster2', 'poster3'], | |||
| posterIndex: 1, | |||
| }, | |||
| /** | |||
| * 切换海报 | |||
| */ | |||
| changePoster(event) { | |||
| this.setData({ | |||
| posterIndex: event.detail.current | |||
| }) | |||
| }, | |||
| prevPoster() { | |||
| if (this.data.posterIndex - 1 >= 0) { | |||
| this.setData({ | |||
| posterIndex: this.data.posterIndex - 1 | |||
| }) | |||
| } | |||
| }, | |||
| nextPoster() { | |||
| if (this.data.posterIndex + 1 < this.data.posterList.length) { | |||
| this.setData({ | |||
| posterIndex: this.data.posterIndex + 1 | |||
| }) | |||
| } | |||
| }, | |||
| /** | |||
| * 查看大图 | |||
| */ | |||
| bigPoster() { | |||
| console.log('查看大图') | |||
| }, | |||
| /** | |||
| * 长按保存 | |||
| */ | |||
| savePoster() { | |||
| console.log('长按保存') | |||
| }, | |||
| /** | |||
| * 分享好友 | |||
| */ | |||
| sharePoster() { | |||
| console.log('分享海报') | |||
| wx.showShareMenu({ | |||
| withShareTicket: true | |||
| }) | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面加载 | |||
| */ | |||
| onLoad: function(options) { | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面初次渲染完成 | |||
| */ | |||
| onReady: function() { | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面显示 | |||
| */ | |||
| onShow: function() { | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面隐藏 | |||
| */ | |||
| onHide: function() { | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面卸载 | |||
| */ | |||
| onUnload: function() { | |||
| }, | |||
| /** | |||
| * 页面相关事件处理函数--监听用户下拉动作 | |||
| */ | |||
| onPullDownRefresh: function() { | |||
| }, | |||
| /** | |||
| * 页面上拉触底事件的处理函数 | |||
| */ | |||
| onReachBottom: function() { | |||
| }, | |||
| /** | |||
| * 用户点击右上角分享 | |||
| */ | |||
| onShareAppMessage: function() { | |||
| } | |||
| }) | |||
| @@ -0,0 +1,5 @@ | |||
| { | |||
| "usingComponents": { | |||
| "tabBar": "../component/tabBar/index" | |||
| } | |||
| } | |||
| @@ -0,0 +1,38 @@ | |||
| <!--pages/scout/share/share.wxml--> | |||
| <view class="showView"> | |||
| <view class="posterBox"> | |||
| <swiper current="{{posterIndex}}" bindchange="changePoster" previous-margin="134rpx" next-margin="134rpx"> | |||
| <block wx:for="{{posterList}}" wx:key="*this"> | |||
| <swiper-item> | |||
| <view class="posterContent"> | |||
| <view class="selectFrame posterItem"> | |||
| <image class="poster" src="{{imgUrl+'/star/scout/share/'+item+'.png'}}" mode="aspectFill"></image> | |||
| </view> | |||
| <view class="selectFrame" wx:if="{{posterIndex==index}}"> | |||
| <image class="ok" src="{{imgUrl+'/star/scout/share/ok.png'}}"></image> | |||
| </view> | |||
| </view> | |||
| </swiper-item> | |||
| </block> | |||
| </swiper> | |||
| <image class="arrowBtn" style="left:20rpx;" src="{{imgUrl+'/star/scout/share/arrowLeft.png'}}" bindtap="prevPoster" wx:if="{{posterIndex!=0}}"></image> | |||
| <image class="arrowBtn" style="right:20rpx;" src="{{imgUrl+'/star/scout/share/arrowRight.png'}}" bindtap="nextPoster" wx:if="{{posterIndex!=posterList.length-1}}"></image> | |||
| </view> | |||
| <image class="enlarge" src="{{imgUrl+'/star/scout/share/enlarge.png'}}" bindtap="bigPoster"></image> | |||
| <view class="enlargeTxt">查看大图</view> | |||
| <image class="tip" src="{{imgUrl+'/star/scout/share/tip.png'}}"></image> | |||
| <view class="bottomBox"> | |||
| <image style="width:100%;height:100%;" src="{{imgUrl+'/star/scout/share/bgBottom.jpg'}}"></image> | |||
| <view class="btnBox"> | |||
| <view class="btnItem"> | |||
| <image class="btn" src="{{imgUrl+'/star/scout/share/down.png'}}" bindlongtap="savePoster"></image> | |||
| <view class="btnTxt">长按保存到手机</view> | |||
| </view> | |||
| <view class="btnItem"> | |||
| <image class="btn" src="{{imgUrl+'/star/scout/share/share.png'}}" bindtap="sharePoster"></image> | |||
| <view class="btnTxt">分享给好友</view> | |||
| </view> | |||
| </view> | |||
| </view> | |||
| </view> | |||
| <tabBar></tabBar> | |||
| @@ -0,0 +1,89 @@ | |||
| /* pages/scout/share/share.wxss */ | |||
| .posterBox{ | |||
| margin: 55rpx 0 0 0; | |||
| width: 100%; | |||
| height: 864rpx; | |||
| } | |||
| .posterBox>swiper{ | |||
| height: 100%; | |||
| } | |||
| .posterContent{ | |||
| width: 450rpx; | |||
| height: 825rpx; | |||
| margin: 39rpx 16rpx 0 16rpx; | |||
| } | |||
| .posterContent>.selectFrame{ | |||
| position: absolute; | |||
| width: 450rpx; | |||
| height: 825rpx; | |||
| border: 9rpx solid #2a558d; | |||
| box-sizing: border-box; | |||
| left: 50%; | |||
| bottom: 0; | |||
| transform: translateX(-50%); | |||
| } | |||
| .posterContent>.selectFrame>.ok{ | |||
| position: absolute; | |||
| top: -45rpx; | |||
| left: 50%; | |||
| transform: translateX(-50%); | |||
| width: 72rpx; | |||
| height: 73rpx; | |||
| } | |||
| .posterContent>.posterItem{ | |||
| border: none; | |||
| } | |||
| .posterContent>.posterItem>.poster{ | |||
| width: 100%; | |||
| height: 100%; | |||
| } | |||
| .posterBox>.arrowBtn{ | |||
| position: absolute; | |||
| width: 27rpx; | |||
| height: 118rpx; | |||
| top: 37%; | |||
| transform: translateY(-37%); | |||
| } | |||
| .enlarge{ | |||
| width: 41rpx; | |||
| height: 41rpx; | |||
| margin: 3rpx auto; | |||
| } | |||
| .enlargeTxt{ | |||
| text-align: center; | |||
| font-size: 17rpx; | |||
| color: #717071; | |||
| margin: 15rpx 0; | |||
| } | |||
| .tip{ | |||
| width: 278rpx; | |||
| height: 68rpx; | |||
| margin: 0 auto; | |||
| } | |||
| .bottomBox{ | |||
| position: relative; | |||
| width: 100%; | |||
| height: 234rpx; | |||
| margin-top: 45rpx; | |||
| background-color: #000000; | |||
| } | |||
| .btnBox{ | |||
| position: absolute; | |||
| text-align: center; | |||
| top: 50%; | |||
| left: 50%; | |||
| transform: translate(-50%,-50%); | |||
| } | |||
| .btnBox>.btnItem{ | |||
| display: inline-block; | |||
| width: 96rpx; | |||
| margin: 0 27rpx; | |||
| } | |||
| .btnBox>.btnItem>.btn{ | |||
| width: 96rpx; | |||
| height: 96rpx; | |||
| } | |||
| .btnBox>.btnItem>.btnTxt{ | |||
| font-size: 12rpx; | |||
| margin-top: 12rpx; | |||
| } | |||
| @@ -9,6 +9,7 @@ Page({ | |||
| imgUrl: app.globalData.urlStatic,//图片路径 | |||
| maskShow: false, | |||
| ruleShow:false, | |||
| numList:[8,9,7,0,0], | |||
| }, | |||
| /** | |||
| * 显示规则页 | |||
| @@ -36,6 +37,14 @@ Page({ | |||
| url:'../everyday/everyday' | |||
| }) | |||
| }, | |||
| /** | |||
| * 星探任务 | |||
| */ | |||
| scout:function(){ | |||
| wx.navigateTo({ | |||
| url: '../scout/scout' | |||
| }) | |||
| }, | |||
| /** | |||
| * 生命周期函数--监听页面加载 | |||
| @@ -5,16 +5,24 @@ | |||
| <image class="logo1" src="{{imgUrl+'/star/logo1.png'}}"></image> | |||
| <image class="logo2" src="{{imgUrl+'/star/logo2.png'}}"></image> | |||
| <view class="ruleBtn" bindtap="showRule">规则说明</view> | |||
| <view class="propagandaBox"></view> | |||
| <view class="propagandaBox"> | |||
| <text class="text">已有</text> | |||
| <view class="numBox"> | |||
| <block wx:for="{{numList}}" wx:key="*this"> | |||
| <image class="numFrame" src="{{imgUrl+'/star/numFrame.png'}}"></image> | |||
| </block> | |||
| </view> | |||
| <text class="text">人加入星探计划</text> | |||
| </view> | |||
| <view class="btnBox"> | |||
| <view class="btn">星探任务</view> | |||
| <view class="btn" bindtap="scout">星探任务</view> | |||
| <view class="btn" bindtap="everyDay">每日任务</view> | |||
| </view> | |||
| </view> | |||
| <view class="mask" wx:if="{{maskShow}}"> | |||
| <view class="ruleContent"> | |||
| <image class="rule" src="{{imgUrl+'/star/rule.png'}}"></image> | |||
| <text class="closeBtn" style="right:-40rpx;top:-45rpx;" bindtap="hiddenRule"></text> | |||
| <view class="closeBtn" style="right:-40rpx;top:-45rpx;" bindtap="hiddenRule"></view> | |||
| </view> | |||
| </view> | |||
| </view> | |||
| @@ -51,9 +51,25 @@ | |||
| height: 76rpx; | |||
| bottom: 457rpx; | |||
| left: 0; | |||
| text-align: center; | |||
| display: flex; | |||
| justify-content: center; | |||
| align-items: center; | |||
| background-color: rgba(11, 40, 109, 0.79); | |||
| } | |||
| .propagandaBox>.text{ | |||
| color: #ffffff; | |||
| font-size: 28rpx; | |||
| } | |||
| .numBox{ | |||
| display: inline-block; | |||
| height: 55rpx; | |||
| padding: 0 15rpx; | |||
| } | |||
| .numBox>.numFrame{ | |||
| width: 42rpx; | |||
| height: 100%; | |||
| display: inline-block; | |||
| } | |||
| .home>.btnBox { | |||
| position: absolute; | |||
| @@ -92,6 +108,7 @@ | |||
| width: 562rpx; | |||
| height: 971rpx; | |||
| border-radius: 20rpx; | |||
| background-color: #ffffff; | |||
| } | |||
| .mask>.ruleContent>.rule { | |||
| @@ -101,9 +118,7 @@ | |||
| } | |||
| .closeBtn { | |||
| background: none; | |||
| border: 2rpx solid #fff; | |||
| color: #fff; | |||
| color: #ffffff; | |||
| border-radius: 50%; | |||
| text-align: center; | |||
| height: 40rpx; | |||
| @@ -112,6 +127,7 @@ | |||
| font-size: 30rpx; | |||
| padding: 2rpx; | |||
| position: absolute; | |||
| border: 2rpx solid #fff; | |||
| } | |||
| /* use cross as close button */ | |||
| @@ -0,0 +1,73 @@ | |||
| module.exports = class Mcaptcha { | |||
| constructor(options) { | |||
| this.options = options; | |||
| this.fontSize = options.height * 3 / 6; | |||
| this.init(); | |||
| this.refresh(); | |||
| } | |||
| init() { | |||
| this.ctx = wx.createCanvasContext(this.options.el); | |||
| this.ctx.setTextBaseline("middle"); | |||
| this.ctx.setFillStyle(this.randomColor(180, 240)); | |||
| } | |||
| refresh() { | |||
| var code = ''; | |||
| var txtArr = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z', 0, 1, 2, 3, 4, 5, 6, 7, 8, 9] | |||
| for (var i = 0; i < 4; i++) { | |||
| code += txtArr[this.randomNum(0, txtArr.length)]; | |||
| } | |||
| this.options.createCodeImg = code; | |||
| let arr = (code + '').split(''); | |||
| if (arr.length === 0) { | |||
| arr = ['e', 'r', 'r', 'o', 'r']; | |||
| }; | |||
| let offsetLeft = this.options.width * 0.6 / (arr.length - 1); | |||
| let marginLeft = this.options.width * 0.2; | |||
| arr.forEach((item, index) => { | |||
| this.ctx.setFillStyle(this.randomColor(0, 180)); | |||
| let size = this.randomNum(24, this.fontSize); | |||
| this.ctx.setFontSize(size); | |||
| let dis = offsetLeft * index + marginLeft - size * 0.3; | |||
| let deg = this.randomNum(-30, 30); | |||
| this.ctx.translate(dis, this.options.height * 0.5); | |||
| this.ctx.rotate(deg * Math.PI / 180); | |||
| this.ctx.fillText(item, 0, 0); | |||
| this.ctx.rotate(-deg * Math.PI / 180); | |||
| this.ctx.translate(-dis, -this.options.height * 0.5); | |||
| }) | |||
| for (var i = 0; i < 4; i++) { | |||
| this.ctx.strokeStyle = this.randomColor(40, 180); | |||
| this.ctx.beginPath(); | |||
| this.ctx.moveTo(this.randomNum(0, this.options.width), this.randomNum(0, this.options.height)); | |||
| this.ctx.lineTo(this.randomNum(0, this.options.width), this.randomNum(0, this.options.height)); | |||
| this.ctx.stroke(); | |||
| } | |||
| for (var i = 0; i < this.options.width / 4; i++) { | |||
| this.ctx.fillStyle = this.randomColor(0, 255); | |||
| this.ctx.beginPath(); | |||
| this.ctx.arc(this.randomNum(0, this.options.width), this.randomNum(0, this.options.height), 1, 0, 2 * Math.PI); | |||
| this.ctx.fill(); | |||
| } | |||
| this.ctx.draw(); | |||
| } | |||
| validate(code) { | |||
| var code = code.toLowerCase(); | |||
| var v_code = this.options.createCodeImg.toLowerCase(); | |||
| console.log(code) | |||
| console.log(v_code.substring(v_code.length - 4)) | |||
| if (code == v_code.substring(v_code.length - 4)) { | |||
| return true; | |||
| } else { | |||
| return false; | |||
| } | |||
| } | |||
| randomNum(min, max) { | |||
| return Math.floor(Math.random() * (max - min) + min); | |||
| } | |||
| randomColor(min, max) { | |||
| let r = this.randomNum(min, max); | |||
| let g = this.randomNum(min, max); | |||
| let b = this.randomNum(min, max); | |||
| return "rgb(" + r + "," + g + "," + b + ")"; | |||
| } | |||
| } | |||