jiazhipeng
1 year ago
15 changed files with 734 additions and 4 deletions
@ -0,0 +1,81 @@ |
|||
// pages/user/profile/index.js
|
|||
let app = getApp(); |
|||
import util from "../../../utils/util" |
|||
import WeCropper from '../../../we-cropper/we-cropper.min.js'; |
|||
import userApi from "../../../utils/https/user" |
|||
let device = wx.getSystemInfoSync(),rect = wx.getMenuButtonBoundingClientRect(); // 获取设备信息
|
|||
const width = device.windowWidth // 示例为一个与屏幕等宽的正方形裁剪框
|
|||
let menuHeight = (rect.top - device.statusBarHeight) * 2 + rect.height + device.statusBarHeight; |
|||
let height = device.windowHeight - menuHeight; |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
|
|||
info:null, |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
|
|||
}, |
|||
|
|||
goSetting (e) { |
|||
let type = e.currentTarget.dataset.type; |
|||
wx.navigateTo({ |
|||
url: '/subPackages/password/setting/setting?type='+type, |
|||
}) |
|||
}, |
|||
|
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
// userApi.user_post("user/getMyInfo",{}).then(res=>{
|
|||
// this.setData({
|
|||
// info:res.data,
|
|||
// })
|
|||
// })
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,19 @@ |
|||
<!--pages/user/profile/index.wxml--> |
|||
|
|||
<title title="支付密码"></title> |
|||
|
|||
<view bindtap="goSetting" data-type="add" class="profile-item" > |
|||
<text>设置支付密码</text> |
|||
<view class="info" wx:if="{{info&&info.password}}">已设置</view> |
|||
<view class="iconfont icon-you"></view> |
|||
</view> |
|||
<view bindtap="goSetting" data-type="edit" class="profile-item" > |
|||
<text>修改密码</text> |
|||
<view class="info"></view> |
|||
<view class="iconfont icon-you"></view> |
|||
</view> |
|||
<view bindtap="goSetting" data-type="reset" class="profile-item"> |
|||
<text>忘记密码</text> |
|||
<view class="info"></view> |
|||
<view class="iconfont icon-you"></view> |
|||
</view> |
|||
@ -0,0 +1,29 @@ |
|||
/* pages/user/profile/index.wxss */ |
|||
.profile-item { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
font-size: 30rpx; |
|||
color: #333; |
|||
height: 118rpx; |
|||
margin: 0 30rpx; |
|||
border-bottom: 1rpx solid #D8D8D8; |
|||
} |
|||
.profile-item text { |
|||
font-weight: 500; |
|||
flex-shrink: 0; |
|||
} |
|||
.profile-item .info { |
|||
flex: 1; |
|||
text-align: right; |
|||
} |
|||
.profile-item .iconfont { |
|||
flex-shrink: 0; |
|||
} |
|||
.profile-item .info image { |
|||
display: inline-block; |
|||
width: 80rpx; |
|||
height: 80rpx; |
|||
border-radius: 50%; |
|||
} |
|||
|
|||
@ -0,0 +1,238 @@ |
|||
|
|||
import util from "../../../utils/util.js" |
|||
import user from "../../../utils/https/user.js" |
|||
import https from "../../../utils/https.js" |
|||
var app = getApp(); |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
type:'add', |
|||
title: '', |
|||
|
|||
editConfrim: false, |
|||
vcode: '',//验证码内容
|
|||
isFoucs: true, |
|||
|
|||
inputData: { |
|||
phone: '', |
|||
code: '', |
|||
password: '', |
|||
confirmPassword: '', |
|||
}, |
|||
canSubmit: false, |
|||
|
|||
code:"", |
|||
buttonText:"获取验证码", |
|||
sendFlag:true, |
|||
regToken:null, |
|||
codeId:null, |
|||
|
|||
|
|||
isApproval: false |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
this.setData({ |
|||
type: options.type||'add', |
|||
title: options.type=='reset'?'忘记密码':options.type=='edit'?'修改密码':'设置支付密码', |
|||
editConfrim: options.type == 'edit'?true:false |
|||
}) |
|||
}, |
|||
|
|||
// 编辑输入原密码
|
|||
passwordChange: function (e) { |
|||
let val = e.detail.value |
|||
this.setData({ |
|||
vcode: val |
|||
}) |
|||
if (val.length==6) { |
|||
// 验证密码
|
|||
this.setData({editConfrim: false}) |
|||
} |
|||
}, |
|||
handleFoucs() { |
|||
this.setData({ |
|||
isFoucs: true |
|||
}) |
|||
}, |
|||
|
|||
// 输入框
|
|||
inputChange:function(e){ |
|||
let inputData = this.data.inputData |
|||
let keyname =e.currentTarget.dataset.keyname; |
|||
inputData[keyname] = e.detail.value |
|||
this.setData({ |
|||
inputData: inputData |
|||
}) |
|||
|
|||
let canSubmit = false |
|||
if (this.data.type == 'edit' && inputData.password && inputData.confirmPassword) { |
|||
canSubmit = true |
|||
} |
|||
if (this.data.type != 'edit' && inputData.phone && inputData.code && inputData.password && inputData.confirmPassword) { |
|||
canSubmit = true |
|||
} |
|||
this.setData({canSubmit: canSubmit}) |
|||
|
|||
}, |
|||
|
|||
// 获取验证码
|
|||
getCode:function(){ |
|||
// 如果已经在发送则不能继续发送验证码
|
|||
if (!this.data.sendFlag){ |
|||
return false; |
|||
} |
|||
if(!this.data.inputData.phone){ |
|||
wx.showToast({ |
|||
title: '请输入手机号', |
|||
icon:"none" |
|||
}) |
|||
return false; |
|||
} |
|||
if(!util.isTel(this.data.inputData.phone)){ |
|||
wx.showToast({ |
|||
title: '请输入正确的手机号码', |
|||
icon: "none" |
|||
}) |
|||
return false; |
|||
} |
|||
|
|||
// 获取验证码则需要改变按钮的文字
|
|||
this.setData({ |
|||
buttonText:"发送中...", |
|||
sendFlag:false |
|||
}) |
|||
let service = "user/getMobileCodeForChange",data={ |
|||
mobile:this.data.inputData.phone, |
|||
},api = user.user_post; |
|||
if(this.data.regToken){ |
|||
service="user/getMobileCodeForBind"; |
|||
data.openid = this.data.regToken |
|||
api = user._post |
|||
} |
|||
api(service, data).then(res=>{ |
|||
console.log('sendmsg',res) |
|||
if(res.code==1){ |
|||
// 发送成功 即接口调用成功
|
|||
this.setData({ |
|||
buttonText: "发送成功", |
|||
sendFlag: false, |
|||
codeId: res.data.id |
|||
}) |
|||
// 获取成功之后需要马上改变成倒计时
|
|||
let time = 59; |
|||
var timer = setInterval(() => { |
|||
// 倒计时结束需要重置可发送验证码状态和按钮文字
|
|||
if (time < 0) { |
|||
// 清除定时器
|
|||
clearInterval(timer) |
|||
this.setData({ |
|||
buttonText: "重新发送", |
|||
sendFlag: true |
|||
}) |
|||
return false; |
|||
} |
|||
this.setData({ |
|||
buttonText: time + "秒后重新发送" |
|||
}) |
|||
time--; |
|||
}, 1000) |
|||
} |
|||
else { |
|||
this.setData({ |
|||
buttonText: "重新发送", |
|||
sendFlag: true |
|||
}) |
|||
} |
|||
|
|||
}) |
|||
|
|||
}, |
|||
// 绑定
|
|||
submit:function(){ |
|||
if(!this.data.inputData.code){ |
|||
wx.showToast({ |
|||
title: '请输入验证码', |
|||
icon: "none" |
|||
}) |
|||
return false; |
|||
} |
|||
|
|||
let service = "user/changeMobile" |
|||
let data={smsCode:this.data.inputData.code,mobile:this.data.inputData.phone,smsCodeId:this.data.codeId} |
|||
let api = user.user_post; |
|||
if(this.data.regToken){ |
|||
service = "user/wxBindPhoneAndLogin" |
|||
data.openid = this.data.regToken |
|||
data.fromSource = "WECHATXCX" |
|||
if(app.globalData.category_id){ |
|||
data.category_id = app.globalData.category_id; |
|||
} |
|||
api = user._post |
|||
} |
|||
api(service,data).then(res=>{ |
|||
if(res.code==1){ |
|||
|
|||
setTimeout(()=>{ |
|||
wx.navigateBack({ |
|||
delta:1 |
|||
}) |
|||
},500) |
|||
// if(this.data.regToken){
|
|||
// https.set_logininfo(res);
|
|||
// }
|
|||
|
|||
} |
|||
}) |
|||
}, |
|||
|
|||
|
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title-header": "/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,50 @@ |
|||
<!--pages/user/bindtel/index.wxml--> |
|||
<view> |
|||
<title-header title="{{title}}"></title-header> |
|||
|
|||
<view wx:if="{{editConfrim}}"> |
|||
<view class="edit-tip">输入支付密码</view> |
|||
<view class="passward-box-container"> |
|||
<input type="number" password="true" class="show-code" wx:for="{{6}}" disabled |
|||
wx:key="index" value="{{vcode[index]}}" catch:tap="handleFoucs"/> |
|||
</view> |
|||
|
|||
<input type="number" password="true" maxlength="6" focus="{{isFoucs}}" bindinput="passwordChange" class="passward-box" /> |
|||
|
|||
</view> |
|||
|
|||
<view wx:else> |
|||
<view class="bind-box"> |
|||
<view class="bind-item" wx:if="{{type!='edit'}}"> |
|||
<view class="bind-item-left">手机号</view> |
|||
<input type="number" bindinput="inputChange" data-keyname="phone" class="weui-input" auto-focus placeholder="请输入您的手机号" /> |
|||
</view> |
|||
<view class="bind-item" wx:if="{{type!='edit'}}"> |
|||
<view class="bind-item-left">验证码</view> |
|||
<input type="number" bindinput="inputChange" data-keyname="code" class="weui-input" placeholder="请输入验证码" /> |
|||
<button class="vaild-number" type="primary" size="mini" bindtap="getCode">{{buttonText}}</button> |
|||
</view> |
|||
|
|||
<view class="bind-item" wx:if="{{type=='reset'}}"> |
|||
<view class="bind-item-left">修改支付密码</view> |
|||
<input type="number" password="true" maxlength="6" bindinput="inputChange" data-keyname="password" class="weui-input" placeholder="请设置新的支付密码" /> |
|||
</view> |
|||
<view class="bind-item" wx:if="{{type=='add'}}"> |
|||
<view class="bind-item-left">设置支付密码</view> |
|||
<input type="number" password="true" maxlength="6" bindinput="inputChange" data-keyname="password" class="weui-input" placeholder="请设置您的支付密码" /> |
|||
</view> |
|||
<view class="bind-item" wx:if="{{type=='edit'}}"> |
|||
<view class="bind-item-left">输入新密码</view> |
|||
<input type="number" password="true" maxlength="6" bindinput="inputChange" data-keyname="password" class="weui-input" placeholder="请设置新的支付密码" /> |
|||
</view> |
|||
|
|||
<view class="bind-item"> |
|||
<view class="bind-item-left">再次填写密码</view> |
|||
<input type="number" password="true" maxlength="6" bindinput="inputChange" data-keyname="confirmPassword" class="weui-input" placeholder="再次填写您的支付密码" /> |
|||
</view> |
|||
</view> |
|||
<view class="btn {{canSubmit?'':'disabled'}}" bindtap="submit">确 定</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
@ -0,0 +1,91 @@ |
|||
/* pages/user/bindtel/index.wxss */ |
|||
.bind-box { |
|||
background: white; |
|||
} |
|||
.bind-item { |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
margin: 0 20rpx; |
|||
height: 120rpx; |
|||
line-height: 120rpx; |
|||
font-size: 28rpx; |
|||
border-bottom: 1rpx solid #EEE; |
|||
} |
|||
.bind-item .weui-input { |
|||
flex: 1; |
|||
} |
|||
.bind-item-left { |
|||
width: 249rpx; |
|||
} |
|||
.bind-item image { |
|||
width: 200rpx; |
|||
height: 60rpx; |
|||
} |
|||
.btn { |
|||
margin:0rpx auto; |
|||
margin-top: 74rpx; |
|||
width: 697rpx; |
|||
height: 73rpx; |
|||
background: #D62829; |
|||
border-radius: 37rpx; |
|||
line-height: 73rpx; |
|||
font-weight: bold; |
|||
font-size: 35rpx; |
|||
color: #FFFFFF; |
|||
text-align: center; |
|||
} |
|||
.btn.disabled{ |
|||
background: #CCCCCC; |
|||
} |
|||
|
|||
.vaild-number{ |
|||
width: 197rpx !important; |
|||
height: 53rpx !important; |
|||
font-size: 27rpx !important; |
|||
color: #0C898F !important; |
|||
background: none !important; |
|||
line-height: 53rpx !important; |
|||
padding: 0 !important; |
|||
text-align: center; |
|||
border: 1px solid #0C898F; |
|||
border-radius: 27rpx; |
|||
font-weight: 500 !important; |
|||
} |
|||
|
|||
.edit-tip{ |
|||
padding: 66rpx 0; |
|||
text-align: center; |
|||
font-weight: bold; |
|||
font-size: 31rpx; |
|||
color: #000000; |
|||
} |
|||
.passward-box-container{ |
|||
width: 697rpx; |
|||
height: 93rpx; |
|||
margin: 0 auto; |
|||
position: relative; |
|||
border-radius: 7rpx; |
|||
border: 1px solid #999999; |
|||
display: flex; |
|||
box-sizing: border-box; |
|||
padding: 16rpx 0; |
|||
|
|||
} |
|||
.show-code{ |
|||
flex: 1; |
|||
height: 100%; |
|||
border-right: 1px solid #999999; |
|||
text-align: center; |
|||
font-size: 20rpx; |
|||
} |
|||
.show-code:last-of-type { |
|||
border: none; |
|||
} |
|||
.passward-box{ |
|||
width: 0; |
|||
height: 0; |
|||
border: none; |
|||
opacity: 0; |
|||
color: rgba(0,0,0,0); |
|||
} |
|||
Loading…
Reference in new issue