@@ -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 + ")"; | |||
} | |||
} |