project init
This commit is contained in:
zxy
198
pageMy/setUserBase/icCard/add.vue
Normal file
198
pageMy/setUserBase/icCard/add.vue
Normal file
@@ -0,0 +1,198 @@
|
||||
<template>
|
||||
<view class="body">
|
||||
<view class="list">
|
||||
<view class="listName">
|
||||
开户银行
|
||||
</view>
|
||||
<view class="listContent" @click="goBankList">
|
||||
{{bankName}}
|
||||
<image src="@/static/img/right.svg" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list">
|
||||
<view class="listName">
|
||||
银行卡号
|
||||
</view>
|
||||
<text v-if="edit">{{bankCardFilter(cardNumber)}}</text>
|
||||
<input v-else type="number" v-model="cardNumber" placeholder="请输入银行卡号" placeholder-style="color:#cccccc;" />
|
||||
</view>
|
||||
<view class="list">
|
||||
<view class="listName">
|
||||
默认银行卡
|
||||
</view>
|
||||
<switch :disabled="!canEditDef" :checked="def" @change="switchChange" />
|
||||
</view>
|
||||
<view v-if="loading" class="btn">
|
||||
<view class="bottombtn nocheck">{{btnText}}中</view>
|
||||
</view>
|
||||
<view v-else-if="validate" class="btn">
|
||||
<view class="bottombtn nocheck">{{btnText}}</view>
|
||||
</view>
|
||||
<view v-else class="btn" @click="goSet">
|
||||
<view class="bottombtn">{{btnText}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
bank
|
||||
} from '@/api/auth.js'
|
||||
import {
|
||||
validatenull
|
||||
} from '@/untils/validate.js'
|
||||
import {
|
||||
mapGetters
|
||||
} from 'vuex'
|
||||
import {
|
||||
bankCardFilter
|
||||
} from '@/untils/format.js'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
edit: false,
|
||||
canEditDef: false,
|
||||
loading: false,
|
||||
id: null,
|
||||
bankId: '',
|
||||
bankName: '选择银行',
|
||||
cardNumber: '',
|
||||
def: true,
|
||||
btnText: "认证"
|
||||
};
|
||||
},
|
||||
onLoad({
|
||||
id,
|
||||
name,
|
||||
card,
|
||||
def
|
||||
}) {
|
||||
if (id) {
|
||||
this.edit = true
|
||||
this.id = id
|
||||
this.bankId = this.bankName = name
|
||||
this.cardNumber = card
|
||||
this.def = def === '1'
|
||||
this.canEditDef = !this.def && this.auth.bankCardState
|
||||
this.btnText = '修改'
|
||||
} else {
|
||||
this.canEditDef = this.auth.bankCardState
|
||||
this.btnText = '认证'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
goBankList: function() {
|
||||
uni.$once('icCardSetBank', (data) => {
|
||||
this.bankId = data.id;
|
||||
this.bankName = data.name;
|
||||
})
|
||||
uni.navigateTo({
|
||||
url: '/pages/bankList/bankList'
|
||||
})
|
||||
},
|
||||
goSet() {
|
||||
this.loading = true
|
||||
bank(this.bankName, this.auth.authInfo.realName, this.cardNumber, this.def ? 1 : 0, this.id).then(resp => {
|
||||
this.loading = false
|
||||
this.$store.commit('SET_AUTH_BANKCARD', true)
|
||||
uni.navigateBack()
|
||||
}).catch(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
switchChange(e) {
|
||||
if (this.auth.bankCardState && this.canEditDef) {
|
||||
this.def = !this.def
|
||||
}
|
||||
},
|
||||
bankCardFilter
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['auth']),
|
||||
validate() {
|
||||
return validatenull(this.bankId) || validatenull(this.cardNumber)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.list switch {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.nocheck {
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.listName {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
width: 200rpx;
|
||||
}
|
||||
|
||||
.listContent image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.listContent {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.list input,
|
||||
.list text {
|
||||
margin-left: auto;
|
||||
text-align: right;
|
||||
}
|
||||
.list input{
|
||||
flex:1;
|
||||
}
|
||||
.list {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
padding: 30rpx;
|
||||
padding-left: 0;
|
||||
border-bottom: 1rpx solid #f2f2f2;
|
||||
}
|
||||
|
||||
.body {
|
||||
background-color: #fefefe;
|
||||
margin-top: 30rpx;
|
||||
padding-left: 30rpx;
|
||||
}
|
||||
|
||||
page {
|
||||
background-color: #f6f6f6;
|
||||
}
|
||||
|
||||
.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;
|
||||
width: 690rpx;
|
||||
padding: 30rpx;
|
||||
padding-bottom: 80rpx;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
</style>
|
||||
182
pageMy/setUserBase/icCard/index.vue
Normal file
182
pageMy/setUserBase/icCard/index.vue
Normal file
@@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="cardList" v-for="item in cards" :key="item.id" @click="editIc(item)">
|
||||
<image src="@/static/img/exp/map.svg" class="cardBack" mode=""></image>
|
||||
<view class="cardName">
|
||||
{{item.bankName}}
|
||||
</view>
|
||||
<view class="cardType">
|
||||
储蓄卡
|
||||
</view>
|
||||
<view class="cardNo">
|
||||
{{bankCardFilter(item.cardNumber)}}
|
||||
</view>
|
||||
<view class="delect" @click.stop="delect(item.id)" v-if="cards.length > 1 && item.def != 1">
|
||||
<image src="@/static/img/exp/link.svg" mode=""></image>
|
||||
<view class="delectContent">
|
||||
解绑银行卡
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn" @click="addIc">
|
||||
<image src="@/static/img/add.svg" mode=""></image>
|
||||
添加银行卡
|
||||
</view>
|
||||
<view class="tx">
|
||||
目前仅支持储蓄卡
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getUserCards,
|
||||
remove
|
||||
} from '@/api/bank.js'
|
||||
import {
|
||||
bankCardFilter
|
||||
} from '@/untils/format.js'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
cards: []
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.getData()
|
||||
},
|
||||
methods: {
|
||||
getData() {
|
||||
getUserCards().then(res => {
|
||||
this.cards = res.data.data
|
||||
})
|
||||
},
|
||||
addIc: function() {
|
||||
uni.navigateTo({
|
||||
url: './add'
|
||||
})
|
||||
},
|
||||
editIc(ic) {
|
||||
uni.navigateTo({
|
||||
url: `./add?id=${ic.id}&name=${ic.bankName}&card=${ic.cardNumber}&def=${ic.def}`
|
||||
})
|
||||
},
|
||||
delect(id) {
|
||||
uni.showModal({
|
||||
title: '解绑银行卡',
|
||||
content: '解绑银行卡后工资将不会发放到此银行卡中',
|
||||
cancelText: '保持绑定',
|
||||
cancelColor: '#1B66FF',
|
||||
confirmText: '仍要解绑',
|
||||
confirmColor: '#1B66FF',
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
remove(id).then(() => {
|
||||
this.getData()
|
||||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
bankCardFilter
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.cardBack {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
/* z-index: -1; */
|
||||
}
|
||||
|
||||
.tx {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
text-align: center;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.btn image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 690rpx;
|
||||
margin: 30rpx;
|
||||
background-color: #1B66FF;
|
||||
color: #fff;
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
|
||||
.delect image {
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
|
||||
}
|
||||
|
||||
.delect {
|
||||
position: absolute;
|
||||
right: 40rpx;
|
||||
top: 30rpx;
|
||||
background-color: rgba(255, 255, 255, 0.3) !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
height: 36rpx;
|
||||
width: 170rpx;
|
||||
}
|
||||
|
||||
.cardNo {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 32rpx;
|
||||
color: #FFFFFF;
|
||||
position: absolute;
|
||||
left: 40rpx;
|
||||
bottom: 40rpx;
|
||||
}
|
||||
|
||||
.cardType {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 26rpx;
|
||||
color: #FFFFFF;
|
||||
padding-left: 40rpx;
|
||||
padding-top: 15rpx;
|
||||
}
|
||||
|
||||
.cardName {
|
||||
padding-left: 40rpx;
|
||||
padding-top: 50rpx;
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 36rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.cardList {
|
||||
position: relative;
|
||||
width: 690rpx;
|
||||
margin: 30rpx;
|
||||
background-image: linear-gradient(-31deg, #3E8EED 0%, #6BA5FF 24%, #84BDFF 45%, #397AFF 100%);
|
||||
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.30);
|
||||
border-radius: 15rpx;
|
||||
height: 280rpx;
|
||||
}
|
||||
|
||||
page {
|
||||
background-color: #f6f6f6;
|
||||
}
|
||||
</style>
|
||||
304
pageMy/setUserBase/index.vue
Normal file
304
pageMy/setUserBase/index.vue
Normal file
@@ -0,0 +1,304 @@
|
||||
<template>
|
||||
<view class="body">
|
||||
<view class="head">
|
||||
<image src="@/static/img/pic_logo.svg" class="logo" mode=""></image>
|
||||
<view class="headuser">
|
||||
<image src="@/static/img/head.svg" class="headuserImg" mode=""></image>
|
||||
<view v-if="auth.realNameState" class="name">
|
||||
<view class="userName">{{authInfo.realName}}</view>
|
||||
<view class="userInfo">{{idNumberFilter(authInfo.idNumber)}}</view>
|
||||
</view>
|
||||
<view v-else class="name">
|
||||
<view class="userName">姓名</view>
|
||||
<view class="userInfo">身份证号</view>
|
||||
</view>
|
||||
<image v-if="auth.realNameState" src="@/static/img/exp/stamp2.svg" class="stamp" mode=""></image>
|
||||
<image v-else src="@/static/img/exp/stamp1.svg" class="stamp" mode=""></image>
|
||||
</view>
|
||||
<view class="tx">
|
||||
<image src="@/static/img/bao.svg" mode=""></image>
|
||||
<view class="txText">个人隐私信息安全保障中</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="border"></view>
|
||||
<!--<picker @change="bindPickerChange" :value="index" :range="laborType">
|
||||
<view class="list">
|
||||
<view class="listLeft">
|
||||
<view class="listTitle">身份信息</view>
|
||||
<view class="listContent">选择个人身份，获得精准推荐</view>
|
||||
</view>
|
||||
<view class="listRight">
|
||||
<view class="rightContent nochoose">
|
||||
<view v-if="auth.laborState" class="uni-input">{{ laborType[0] }}</view>
|
||||
<view v-else class="uni-input">未选择</view>
|
||||
</view>
|
||||
<image src="@/static/img/right.svg" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</picker>-->
|
||||
<view class="border"></view>
|
||||
<view class="list" @click="goRealName">
|
||||
<view class="listLeft">
|
||||
<view class="listTitle">实名认证</view>
|
||||
<view class="listContent">完成实名认证，提高信息可信度</view>
|
||||
</view>
|
||||
<view class="listRight">
|
||||
<view v-if="auth.realNameState" class="rightContent nochoose">已认证</view>
|
||||
<view v-else class="rightContent nochoose">未认证</view>
|
||||
<image src="@/static/img/right.svg" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="border"></view>
|
||||
<view class="list" @click="setIcCard">
|
||||
<view class="listLeft">
|
||||
<view class="listTitle">银行卡认证</view>
|
||||
<view class="listContent">完善银行卡信息，方便领工资</view>
|
||||
</view>
|
||||
<view class="listRight">
|
||||
<view v-if="auth.bankCardState" class="rightContent nochoose">已认证</view>
|
||||
<view v-else class="rightContent nochoose">未认证</view>
|
||||
<image src="@/static/img/right.svg" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="border"></view>
|
||||
<!--<picker @change="bindPickerChangeBao" :value="indexbao" :range="insureType">
|
||||
<view class="list">
|
||||
<view class="listLeft">
|
||||
<view class="listTitle">社保信息</view>
|
||||
<view class="listContent">选择个人身份，获得精准推荐</view>
|
||||
</view>
|
||||
<view class="listRight">
|
||||
<view class="rightContent nochoose">
|
||||
<view v-if="auth.insureState" class="uni-input">{{ insureType[indexbao] }}</view>
|
||||
<view v-else class="uni-input">未选择</view>
|
||||
</view>
|
||||
<image src="@/static/img/right.svg" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</picker>-->
|
||||
<view class="border"></view>
|
||||
<view class="list" @click="setSeal">
|
||||
<view class="listLeft">
|
||||
<view class="listTitle">个人签名</view>
|
||||
<view class="listContent">采集手写签名，便于维护自身利益</view>
|
||||
</view>
|
||||
<view class="listRight">
|
||||
<view v-if="autograph.data && autograph.data.signSrcUrl" class="rightContent nochoose">已采集</view>
|
||||
<view v-else class="rightContent nochoose">未采集</view>
|
||||
<image src="@/static/img/right.svg" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import textdata from '@/common/textdata.js'
|
||||
import {
|
||||
mapGetters
|
||||
} from 'vuex'
|
||||
import {
|
||||
idNumberFilter
|
||||
} from '@/untils/format.js'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
laborType: textdata.laborType,
|
||||
index: 0,
|
||||
insureType: textdata.insureType,
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.$store.dispatch('setAutograph')
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['auth', 'authInfo', 'autograph']),
|
||||
indexbao() {
|
||||
if (this.auth.insureState) {
|
||||
return this.authInfo.bakValue - 1
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
setSeal(){
|
||||
if (this.auth.realNameState) {
|
||||
uni.navigateTo({
|
||||
url: '/pageMy/setUserBase/seal/index'
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '请先完成实名认证',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
},
|
||||
setIcCard: function() {
|
||||
if (this.auth.realNameState) {
|
||||
uni.navigateTo({
|
||||
url: '/pageMy/setUserBase/icCard/index'
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '请先完成实名认证',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
},
|
||||
goRealName: function() {
|
||||
uni.navigateTo({
|
||||
url: '/pageMy/setUserBase/realName'
|
||||
})
|
||||
},
|
||||
bindPickerChangeBao: function(e) {
|
||||
uni.showLoading()
|
||||
this.$store.dispatch('authInsure', e.target.value * 1 + 1).then(resp => {
|
||||
uni.hideLoading()
|
||||
}).catch(() => {
|
||||
uni.hideLoading()
|
||||
})
|
||||
},
|
||||
bindPickerChange: function(e) {
|
||||
uni.showLoading()
|
||||
this.$store.dispatch('authLabor').then(resp => {
|
||||
this.index = e.target.value;
|
||||
uni.hideLoading()
|
||||
}).catch(() => {
|
||||
uni.hideLoading()
|
||||
})
|
||||
},
|
||||
idNumberFilter
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.nochoose {
|
||||
color: #1b66ff;
|
||||
}
|
||||
|
||||
.listRight {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.listRight image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
margin-left: 15rpx;
|
||||
}
|
||||
|
||||
.listContent {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 28rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
padding: 30rpx;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
|
||||
.border {
|
||||
margin-left: 30rpx;
|
||||
width: 720rpx;
|
||||
height: 2rpx;
|
||||
background-color: #f2f2f2;
|
||||
/* border-bottom: 1rpx solid #dddddd; */
|
||||
}
|
||||
|
||||
.tx image {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.tx {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 24rpx;
|
||||
color: #ffffff;
|
||||
padding: 30rpx;
|
||||
padding-top: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.userInfo {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 26rpx;
|
||||
color: #ffffff;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.name {
|
||||
margin-left: 20rpx;
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 36rpx;
|
||||
color: #ffffff;
|
||||
font-weight: bold;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
|
||||
.headuserImg {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
}
|
||||
|
||||
.headuser {
|
||||
padding: 30rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.stamp {
|
||||
position: absolute;
|
||||
top: 30rpx;
|
||||
right: 30rpx;
|
||||
/* opacity: 0.6; */
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
}
|
||||
|
||||
.logo {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
opacity: 0.1;
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
}
|
||||
|
||||
.head {
|
||||
width: 690rpx;
|
||||
height: 250rpx;
|
||||
padding-top: 30rpx;
|
||||
margin: 30rpx;
|
||||
margin-top: 0;
|
||||
border-radius: 15rpx;
|
||||
position: relative;
|
||||
background: #1b66ff;
|
||||
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.body {
|
||||
background-color: #fefefe;
|
||||
padding-top: 30rpx;
|
||||
}
|
||||
|
||||
page {
|
||||
background-color: #f6f6f6;
|
||||
}
|
||||
</style>
|
||||
247
pageMy/setUserBase/realName.vue
Normal file
247
pageMy/setUserBase/realName.vue
Normal file
@@ -0,0 +1,247 @@
|
||||
<template>
|
||||
<view class="body">
|
||||
<view class="list">
|
||||
<view class="name">
|
||||
姓名
|
||||
</view>
|
||||
<text v-if="auth.realNameState" style="color: #1b66ff;">{{auth.authInfo.realName}}</text>
|
||||
<input v-else type="text" value="" placeholder="请输入真实姓名" @input="setName" placeholder-style="color:#cccccc;" />
|
||||
</view>
|
||||
<view>
|
||||
<view class="list">
|
||||
<view class="name">
|
||||
身份证号
|
||||
</view>
|
||||
<text v-if="auth.realNameState" style="color: #1b66ff;">{{idNumberFilter(auth.authInfo.idNumber)}}</text>
|
||||
<input v-else type="idcard" value="" placeholder="请输入身份证号" @input="setCard" style="text-transform:uppercase"
|
||||
placeholder-style="color:#cccccc;" />
|
||||
</view>
|
||||
<view v-if="error" class="error">身份证填写有误</view>
|
||||
</view>
|
||||
<picker :range="identityList" @change="identityChange" :value="index">
|
||||
<view class="list">
|
||||
<view class="listLeft">
|
||||
<view class="name">
|
||||
身份信息
|
||||
</view>
|
||||
<view class="listContent">完成实名认证，提高信息可信度</view>
|
||||
</view>
|
||||
<view class="listRight">
|
||||
<view class="listRightContent">
|
||||
<view class="" v-if="auth.laborState">已认证</view>
|
||||
<view class="" v-else>未认证</view>
|
||||
</view>
|
||||
<image src="@/static/img/right.svg" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</picker>
|
||||
<picker :range="insureList" @change="insureChange" :value="indexBao">
|
||||
<view class="list">
|
||||
<view class="listLeft">
|
||||
<view class="name">
|
||||
社保信息
|
||||
</view>
|
||||
<view class="listContent">选择个人身份，获得精准推荐</view>
|
||||
</view>
|
||||
<view class="listRight">
|
||||
<view class="listRightContent">
|
||||
<view class="" v-if="auth.insureState">{{insureList[indexBao]}}</view>
|
||||
<view class="" v-else>未选择</view>
|
||||
</view>
|
||||
<image src="@/static/img/right.svg" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</picker>
|
||||
<view v-if="auth.realNameState"></view>
|
||||
<view class="btn nocheck" v-else-if="loading">
|
||||
<view class="bottombtn">
|
||||
认证中
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn" @click="goSet" v-else-if="check">
|
||||
<view class="bottombtn">
|
||||
认证
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn nocheck" v-else>
|
||||
<view class="bottombtn">
|
||||
认证
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
check18IdCardNo,
|
||||
validatenull
|
||||
} from '@/untils/validate.js'
|
||||
import {
|
||||
mapGetters
|
||||
} from 'vuex'
|
||||
import {
|
||||
idNumberFilter
|
||||
} from '@/untils/format.js'
|
||||
import textdata from '@/common/textdata.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
name: '',
|
||||
card: '',
|
||||
loading: false,
|
||||
error: false,
|
||||
identityList: textdata.laborType,
|
||||
insureList: textdata.insureType,
|
||||
index: 0,
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
setName: function(e) {
|
||||
this.name = e.detail.value;
|
||||
},
|
||||
setCard: function(e) {
|
||||
this.card = e.detail.value.toUpperCase();
|
||||
this.error = !check18IdCardNo(this.card)
|
||||
return e.detail.value.toUpperCase()
|
||||
},
|
||||
goSet: function() {
|
||||
this.loading = true
|
||||
this.$store.dispatch('authRealName', {
|
||||
name: this.name,
|
||||
idNumber: this.card
|
||||
})
|
||||
.then(() => {
|
||||
this.loading = false
|
||||
uni.navigateBack()
|
||||
}).catch(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
idNumberFilter,
|
||||
identityChange(val) {
|
||||
uni.showLoading();
|
||||
this.$store.dispatch('authLabor').then(() => {
|
||||
this.index = val.detail.value;
|
||||
uni.hideLoading();
|
||||
}).catch(() => {
|
||||
uni.hideLoading();
|
||||
})
|
||||
},
|
||||
insureChange(val) {
|
||||
uni.showLoading();
|
||||
this.$store.dispatch('authInsure', val.detail.value * 1 + 1).then(() => {
|
||||
uni.hideLoading();
|
||||
}).catch(()=>{
|
||||
uni.hideLoading();
|
||||
})
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['auth', 'authInfo']),
|
||||
check() {
|
||||
return check18IdCardNo(this.card) && !validatenull(this.name)
|
||||
},
|
||||
indexBao() {
|
||||
if (this.auth.insureState) {
|
||||
return this.authInfo.bakValue - 1
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.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;
|
||||
width: 690rpx;
|
||||
padding: 30rpx;
|
||||
padding-bottom: 80rpx;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.name {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
width: 200rpx;
|
||||
}
|
||||
|
||||
.error {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 26rpx;
|
||||
color: red;
|
||||
margin: 5px 0 0 200rpx;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
.list {
|
||||
padding: 20rpx;
|
||||
padding-left: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1rpx solid #f2f2f2;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.pickerList {
|
||||
padding: 20rpx;
|
||||
padding-left: 0;
|
||||
|
||||
border-bottom: 1rpx solid #f2f2f2;
|
||||
}
|
||||
|
||||
.listRight {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.listRightContent {
|
||||
color: #1b66ff;
|
||||
}
|
||||
|
||||
.listRight image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
margin-left: 15rpx;
|
||||
}
|
||||
|
||||
.listContent {
|
||||
color: #999;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.body {
|
||||
background-color: #fefefe;
|
||||
padding-left: 20rpx;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.nocheck {
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
page {
|
||||
background-color: #f6f6f6;
|
||||
}
|
||||
</style>
|
||||
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