project init
This commit is contained in:
zxy
201
pageMy/setUserBase/seal/forget.vue
Normal file
201
pageMy/setUserBase/seal/forget.vue
Normal file
@@ -0,0 +1,201 @@
|
||||
<template>
|
||||
<view class="forget">
|
||||
<view class="phone">
|
||||
手机号： {{phoneFilter(userInfo.user_name)}}
|
||||
</view>
|
||||
<view class="codeBox">
|
||||
<jl-input type="number" v-model="code" placeholder="请输入验证码"></jl-input>
|
||||
<view v-if="action === 'can'" class="code" @click="getCode">
|
||||
获取验证码
|
||||
</view>
|
||||
<view v-else-if="action === 'wait'" class="code">
|
||||
获取验证码({{codeint}}s)
|
||||
</view>
|
||||
<view v-else-if="action === 'sending'" class="code">
|
||||
发送中...
|
||||
</view>
|
||||
</view>
|
||||
<jl-input type="number" :maxlength="maxlength" v-model="password" placeholder="请输入六位数字密码" @confirm="regPassword" showPassword clearable></jl-input>
|
||||
<jl-input type="number" :maxlength="maxlength" v-model="newPassword" placeholder="请再次输入六位数字密码" @confirm="regNewPassword" showPassword clearable></jl-input>
|
||||
<view v-if="error" class="error">两次密码输入不一致，请重新输入</view>
|
||||
<view class="btn">
|
||||
<view v-if="loading" class="bottombtn nocheck">提交中</view>
|
||||
<view v-else-if="!validate" class="bottombtn nocheck">确认</view>
|
||||
<view v-else @click="submit" class="bottombtn">确认</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapGetters} from 'vuex'
|
||||
import {
|
||||
phoneFilter
|
||||
} from '@/untils/format.js'
|
||||
import jlInput from '@/components/jl-input/main.vue'
|
||||
import {sendValidate, resetPass} from '@/api/auth.js'
|
||||
import {
|
||||
forgetPW,
|
||||
accountsendValidate,
|
||||
getCaptcha,
|
||||
validateCode
|
||||
} from '@/api/forgetPW.js'
|
||||
const resendTime = 120
|
||||
export default{
|
||||
data () {
|
||||
return {
|
||||
code: '',
|
||||
password: '',
|
||||
newPassword: '',
|
||||
action: 'can',
|
||||
maxlength: 6,
|
||||
codeint: resendTime,
|
||||
loading: false,
|
||||
error: false,
|
||||
defCount:5,//默认发送短信次数
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
if (options.forget) {
|
||||
uni.setNavigationBarTitle({
|
||||
title:'忘记密码'
|
||||
})
|
||||
}
|
||||
},
|
||||
components:{jlInput},
|
||||
methods: {
|
||||
phoneFilter,
|
||||
setTimer() {
|
||||
var sendCode = setInterval(() => {
|
||||
this.codeint -= 1;
|
||||
if (this.codeint <= 0) {
|
||||
this.action = 'can'
|
||||
this.codeint = resendTime;
|
||||
clearInterval(sendCode);
|
||||
return;
|
||||
}
|
||||
}, 1000)
|
||||
},
|
||||
getCode: function() {
|
||||
if (this.action !== 'can') {
|
||||
return;
|
||||
}
|
||||
this.action = 'sending';
|
||||
sendValidate(this.userInfo.user_name).then((res) => {
|
||||
if(res.data.code==200){
|
||||
let count=res.data.data;
|
||||
let diffCount=this.defCount-count;//剩余获取短信次数
|
||||
if(count>1 && count<=5){
|
||||
uni.showToast({
|
||||
title:`今日验证码已获取${count}次，还有${diffCount}次获取机会`,
|
||||
icon:'none',
|
||||
duration:3000
|
||||
})
|
||||
}
|
||||
this.action = 'wait'
|
||||
this.setTimer()
|
||||
}
|
||||
this.loading = false
|
||||
}).catch(() => {
|
||||
this.action='can'
|
||||
this.loading = false
|
||||
this.$refs.code.refushCode()
|
||||
})
|
||||
},
|
||||
submit(){
|
||||
if (this.password !== this.newPassword){
|
||||
this.error = true
|
||||
return
|
||||
}
|
||||
this.loading = true
|
||||
resetPass(this.userInfo.user_name, this.code, this.password).then(()=>{
|
||||
this.loading = false
|
||||
uni.showToast({
|
||||
title: '重置密码成功',
|
||||
icon: false
|
||||
})
|
||||
setTimeout(() => {
|
||||
uni.navigateBack()
|
||||
}, 1000)
|
||||
}).catch(()=>{
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
regPassword(){
|
||||
if(this.password.length !== 6) {
|
||||
uni.showToast({
|
||||
title: '请设置长度6位的密码',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
},
|
||||
regNewPassword(){
|
||||
if(this.newPassword.length !== 6) {
|
||||
uni.showToast({
|
||||
title: '请设置长度6位的密码',
|
||||
icon: 'none'
|
||||
});
|
||||
} else if (this.password !== this.newPassword) {
|
||||
this.error = true
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['realName', 'userInfo']),
|
||||
validate() {
|
||||
return this.password.length ===6 && this.newPassword.length === 6 && this.code
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.error {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 32rpx;
|
||||
color: red;
|
||||
}
|
||||
.forget{
|
||||
padding: 90rpx 80rpx 0 80rpx;
|
||||
.phone{
|
||||
height: 50rpx;
|
||||
font-size: 36rpx;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
line-height: 50rpx;margin-bottom: 90rpx;
|
||||
}
|
||||
}
|
||||
.codeBox{
|
||||
position: relative;
|
||||
.code{
|
||||
z-index: 999;
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right:14px;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
color: #1B66FF;
|
||||
line-height: 38rpx;
|
||||
|
||||
}
|
||||
}
|
||||
.nocheck {
|
||||
opacity: 0.3;
|
||||
}
|
||||
.bottombtn {
|
||||
background-color: #1B66FF;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
border-radius: 10rpx;
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 32rpx;
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
}
|
||||
|
||||
.btn {
|
||||
background-color: #fefefe;
|
||||
padding: 70rpx 80rpx;
|
||||
}
|
||||
</style>
|
||||
147
pageMy/setUserBase/seal/index.vue
Normal file
147
pageMy/setUserBase/seal/index.vue
Normal file
@@ -0,0 +1,147 @@
|
||||
<template>
|
||||
<view class="collectionWrap">
|
||||
<view class="sealBox">
|
||||
<image v-if="src" class="img" mode="aspectFit" :src="src"></image>
|
||||
<view v-else style="height: 100%;
|
||||
line-height: 468rpx;
|
||||
font-size: 30rpx;
|
||||
color: #999999;
|
||||
background: #FFFFFF;
|
||||
text-align: center;" @click="goSeal()">点击输入手写签名</view>
|
||||
</view>
|
||||
<view v-if="!src" class="sealAgreement">
|
||||
<view class="check-icon" @click="checkClick">
|
||||
<image src="../../../static/img/checkOk.png" style="width: 30rpx;height:30rpx;" v-if="status"></image>
|
||||
<view class="seal-nocheck" v-else></view>
|
||||
</view>
|
||||
<view>我已阅读并同意</view>
|
||||
<view class="agreement" @click="go('/pages/user/sealAgreement')">《申请数字证书协议》</view>
|
||||
</view>
|
||||
<view v-if="src" class="forget" @click="goForget()">
|
||||
<view>重置密码</view>
|
||||
<image src="@/static/img/right.svg" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapGetters} from 'vuex'
|
||||
import uniCopy from '@/js_sdk/xb-copy/uni-copy.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
status: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
go(url){
|
||||
uni.navigateTo({
|
||||
url
|
||||
})
|
||||
},
|
||||
checkClick(){
|
||||
this.status = !this.status
|
||||
},
|
||||
realNameState(){
|
||||
if (!this.auth.realNameState) {
|
||||
uni.showToast({
|
||||
title: "未实名认证用户，请先进行实名认证。未完成实名认证，无法成功采集签名。",
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
},
|
||||
goSeal(url){
|
||||
this.realNameState()
|
||||
if (!this.status){
|
||||
uni.showToast({
|
||||
title: '请先阅读并同意《申请证书协议》',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
uni.navigateTo({
|
||||
url:`/pageMy/setUserBase/seal/sealCanvas?path=/pageMy/setUserBase/index`
|
||||
})
|
||||
},
|
||||
goForget(){
|
||||
this.realNameState()
|
||||
uni.navigateTo({
|
||||
url: '/pageMy/setUserBase/seal/forget'
|
||||
})
|
||||
},
|
||||
getInpCode: function(e) {
|
||||
console.log(e)
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
...mapGetters(['auth','autograph']),
|
||||
src() {
|
||||
if (this.autograph.data && this.autograph.data.signSrcUrl) {
|
||||
return this.autograph.data.signSrcUrl
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page{
|
||||
background-color: #F6F6F6;
|
||||
}
|
||||
.sealAgreement{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 30rpx;
|
||||
font-size: 32rpx;
|
||||
.agreement{
|
||||
color: #007AFF;
|
||||
}
|
||||
}
|
||||
.check-icon{
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
align-items: center;
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
margin-right: 12rpx;
|
||||
.seal-nocheck{
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
border-radius: 50%;
|
||||
border: 2rpx solid #999999;
|
||||
margin-right:12rpx;
|
||||
}
|
||||
}
|
||||
.sealBox{
|
||||
padding: 15px 15px 0 15px;
|
||||
}
|
||||
.sealBox .img{
|
||||
background-color: #FFFFFF;
|
||||
width: 692rpx;
|
||||
height: 344rpx;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
.collectionWrap{
|
||||
.modify,.forget{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background-color: #FFFFFF;
|
||||
padding:15px;
|
||||
image{
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
.forget{
|
||||
margin-top: 10px;
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
line-height: 32rpx;
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
36
pageMy/setUserBase/seal/sealCanvas.vue
Normal file
36
pageMy/setUserBase/seal/sealCanvas.vue
Normal file
@@ -0,0 +1,36 @@
|
||||
<template>
|
||||
<view>
|
||||
<seal @finish="finish"></seal>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import seal from '@/components/uni-seal/seal.vue'
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
path: ''
|
||||
}
|
||||
},
|
||||
onLoad(options){
|
||||
this.path = options.path
|
||||
},
|
||||
components:{seal},
|
||||
methods: {
|
||||
finish(e){
|
||||
const data = JSON.parse(e.data)
|
||||
// navigateTo
|
||||
// uni.navigateTo({
|
||||
// url: `/pageMy/setUserBase/seal/setSealPassword?src=${data.data.link}&path=${this.path}`
|
||||
// })
|
||||
uni.redirectTo({
|
||||
url: `/pageMy/setUserBase/seal/setSealPassword?src=${data.data.link}&path=${this.path}`
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
105
pageMy/setUserBase/seal/setSealPassword.vue
Normal file
105
pageMy/setUserBase/seal/setSealPassword.vue
Normal file
@@ -0,0 +1,105 @@
|
||||
<template>
|
||||
<view style="padding: 122rpx 80rpx 0 80rpx;">
|
||||
<jl-input type="number" :maxlength="maxlength" v-model="password" placeholder="请输入六位数字密码" @confirm="regPassword" showPassword clearable></jl-input>
|
||||
<jl-input type="number" :maxlength="maxlength" v-model="newPassword" placeholder="请再次输入六位数字密码" @confirm="regNewPassword" showPassword clearable></jl-input>
|
||||
<view v-if="error" class="error">两次密码输入不一致，请重新输入</view>
|
||||
<view class="btn" >
|
||||
<view v-if="loading" class="bottombtn nocheck">提交中</view>
|
||||
<view v-else @click="submit" class="bottombtn" :class="{'nocheck':!validate}">确认</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import jlInput from '@/components/jl-input/main.vue'
|
||||
import {signGather} from '@/api/auth.js'
|
||||
export default{
|
||||
data (){
|
||||
return {
|
||||
sealSrc: '',
|
||||
password: '',
|
||||
newPassword: '',
|
||||
path: '',
|
||||
maxlength: 6,
|
||||
error: false,
|
||||
loading: false,
|
||||
}
|
||||
},
|
||||
onLoad(options){
|
||||
this.path = options.path
|
||||
// this.sealSrc = options.src + '?x-oss-process=image/resize,w_150,h_150/rotate,90'
|
||||
this.sealSrc = options.src
|
||||
},
|
||||
components:{jlInput},
|
||||
methods: {
|
||||
submit(){
|
||||
if (!this.validate) return
|
||||
this.loading = true
|
||||
const that = this
|
||||
signGather(this.sealSrc,this.password,this.newPassword).then(res => {
|
||||
that.loading = false
|
||||
that.$store.dispatch('setAutograph')
|
||||
if (this.path) {
|
||||
uni.navigateBack({
|
||||
url: this.path
|
||||
})
|
||||
}
|
||||
}, error => {
|
||||
that.loading = false
|
||||
console.log(error);
|
||||
});
|
||||
},
|
||||
regPassword(){
|
||||
if(this.password.length !== 6) {
|
||||
uni.showToast({
|
||||
title: '请设置长度6位的密码',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
},
|
||||
regNewPassword(){
|
||||
if(this.newPassword.length !== 6) {
|
||||
uni.showToast({
|
||||
title: '请设置长度6位的密码',
|
||||
icon: 'none'
|
||||
});
|
||||
} else if (this.password !== this.newPassword) {
|
||||
this.error = true
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
validate() {
|
||||
return this.password.length ===6 && this.newPassword.length === 6 && this.password==this.newPassword
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.error {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 32rpx;
|
||||
color: red;
|
||||
margin-top:23rpx;
|
||||
}
|
||||
|
||||
.nocheck {
|
||||
opacity: 0.3;
|
||||
}
|
||||
.bottombtn {
|
||||
background-color: #1B66FF;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
border-radius: 10rpx;
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 32rpx;
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
}
|
||||
|
||||
.btn {
|
||||
background-color: #fefefe;
|
||||
padding: 70rpx 0;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user